/*
 * my-theme.css
 *
 * FINAL & COMPLETE OVERRIDE for aistack.pl
 * Theme: "Neon Aurora" - Lean, Consistent, & Polished
 *
 * This version corrects all identified issues:
 * - FIXED: Gradient borders are now correctly rounded with their containers.
 * - REFINED: Font weights are now leaner for a modern, clean aesthetic.
 * - MAINTAINED: Spacious layout, fixed header, and consistent pill-shaped buttons.
 */

/* ==== 1. FONT IMPORT ==== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap');

/* ==== 2. ROOT TOKEN OVERRIDES - LEAN & SPACIOUS ==== */
:root {
    /* -- Typography -- */
    --font-base: 'Inter', system-ui, -apple-system, sans-serif;
    --line-height: 1.8; /* Increased line-height for more text spacing */

    /* -- Dark Mode Color Palette -- */
    --clr-bg: #0B0F19;
    --clr-bg-alt: #111827;
    --clr-text: #9ca3af;
    --clr-text-headings: #f9fafb;
    
    /* -- SPECTACULAR NEON GRADIENT PALETTE -- */
    --clr-neon-cyan: #22d3ee;
    --clr-neon-purple: #a855f7;
    --clr-neon-pink: #ec4899;
    --gradient-main: linear-gradient(90deg, var(--clr-neon-pink) 0%, var(--clr-neon-purple) 50%, var(--clr-neon-cyan) 100%);
    
    /* -- Redefined States -- */
    --clr-primary: var(--clr-neon-cyan);
    --clr-primary-hover: #67e8f9;
    --clr-accent: var(--clr-neon-pink);
    --clr-success: #4ade80;
    --clr-error: #f87171;

    /* -- Borders, Radius & Layout -- */
    --clr-border: #374151;
    --radius: 0.75rem; /* 12px - A consistent, modern, soft radius */
    --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --header-height: 80px;

    /* -- Increased Spacing Tokens -- */
    --sp-1: 0.375rem;  /* 6px */
    --sp-2: 0.75rem;   /* 12px */
    --sp-3: 1.5rem;    /* 24px */
    --sp-4: 3rem;      /* 48px */
}

/* ==== 3. LAYOUT & SPACING FIXES ==== */
body {
    background-color: var(--clr-bg);
    color: var(--clr-text);
    font-weight: 300; /* LEANER: Set the base font weight to light */
    background-image:
        radial-gradient(at 0% 0%, rgba(236, 72, 153, 0.15) 0px, transparent 50%),
        radial-gradient(at 90% 95%, rgba(34, 211, 238, 0.15) 0px, transparent 50%);
    background-attachment: fixed;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Remove this block to avoid double padding:
main {
    padding-top: var(--header-height);
}
*/

/* Add generous, consistent vertical spacing between all direct child sections. */
.cmp-hero {
    margin-bottom: 4rem; /* 128px */
    min-height: 520px;    /* Increased from default for a proper hero */
    padding-top: 5rem;    /* More vertical padding */
    padding-bottom: 5rem;
    display: flex;
    align-items: center;
    /* The rest is inherited from base style.css */
}

main .cmp-layout--one-col,
.cmp-timeline {
    margin-bottom: 4rem; /* 128px */
    margin-top: 2rem
}


main .cmp-layout--one-col > section {
    padding: 0; 
    margin-bottom: 6rem; /* 128px */
}

main .cmp-layout--one-col > section:last-child {
    margin-bottom: 0;
}

/* -- About Us Page: Timeline Section Spacing -- */
main .cmp-layout--one-col > section.cmp-timeline {
    margin-bottom: 2rem !important; /* Force extra space after timeline */
}

/* ==== 4. COMPLETE COMPONENT RESTYLING ==== */

/* -- Global Typography -- */
h1, h2 {
    color: transparent;
    background: var(--gradient-main);
    -webkit-background-clip: text;
    background-clip: text;
    padding-bottom: var(--sp-1);
    font-weight: 700; /* Keep main headings bold for hierarchy */
}
h2 {
    font-size: 2.25rem; /* REWORK: Increased H2 size */
}
h3, h4 {
    color: var(--clr-text-headings);
    font-weight: 500; /* LEANER: Use medium weight for subheadings */
}
a {
    color: var(--clr-primary);
}
a:hover {
    color: var(--clr-primary-hover);
    text-decoration: none;
}
p {
    max-width: 65ch; /* Improve readability by limiting paragraph width */
    font-weight: 400; /* LEANER: Use regular weight for paragraphs for readability */
}

/* -- Header: Locked to top, full-width glass effect -- */
.cmp-header {
    position: fixed;
    top: 0; left: 0; width: 100%;
    height: var(--header-height);
    background-color: rgba(11, 15, 25, 0.6);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--clr-border);
    z-index: 100;
}
.cmp-nav, .cmp-nav__container {
    height: 100%; background: transparent; border: none;
}
.cmp-nav__logo { color: var(--clr-text-headings); }
.cmp-nav__menu-item a {
    color: var(--clr-text);
    transition: color 0.2s ease;
    border-radius: var(--radius);
    font-weight: 400; /* REWORK: Thinner font weight for nav links */
    font-size: 1.1rem; /* REWORK: Larger font size for nav links */
}
.cmp-nav__menu-item a:hover { color: white; background: none; }
.cmp-nav__menu-item a::after { background: var(--gradient-main); }
.cmp-nav__menu-toggle { color: var(--clr-text); }
@media (max-width: 768px) {
    .cmp-nav__menu {
        background-color: var(--clr-bg-alt);
        border: 1px solid var(--clr-border);
        border-radius: var(--radius);
        /* Fix: Ensure menu is always full viewport width and positioned at left edge */
        position: fixed !important;
        top: var(--header-height, 80px);
        left: 0;
        right: 0;
        width: 100vw !important;
        min-width: 0 !important;
        max-width: 100vw !important;
        margin: 0 !important;
        z-index: 999;
        box-sizing: border-box;
        overflow-x: hidden;
        /* Hide menu by default on mobile */
        display: none !important;
    }
    .cmp-nav__menu.hidden {
        display: none !important;
    }
    .cmp-nav__menu:not(.hidden) {
        display: block !important;
    }
    html, body {
        overflow-x: hidden;
    }
}
@media (min-width: 769px) {
    .cmp-nav__menu {
        display: flex !important;
    }
}

/* -- Buttons: Square & Glowing -- */
.cmp-button {
    border-radius: 0; /* Force square shape for consistency with gradient borders */
    box-shadow: none;
    transition: all 0.2s ease-out;
    padding: var(--sp-2) var(--sp-3);
    font-weight: 500; /* LEANER: Medium weight for all buttons */
}
.cmp-button:hover { transform: translateY(-3px); }
.cmp-button--large { padding: var(--sp-3) var(--sp-4); }
.cmp-button--primary, .cmp-button--accent {
    color: #0B0F19;
    font-weight: 700; /* Keep primary button text bold for emphasis */
    border: none;
    background: var(--gradient-main);
    background-size: 200% 100%;
}
.cmp-button--primary:hover, .cmp-button--accent:hover {
    background-position: 100% 0;
    box-shadow: 0 0 25px -5px var(--clr-neon-purple);
    color: #fff;
}
.cmp-button--ghost {
    background: transparent;
    border: 2px solid;
    border-image-source: var(--gradient-main);
    border-image-slice: 1;
    color: var(--clr-text-headings);
}
.cmp-button--ghost:hover {
    background: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05));
    box-shadow: 0 0 20px -5px var(--clr-neon-purple);
}
.cmp-button.cmp-button--primary, .cmp-button.cmp-button--accent {
    color: #0B0F19;
}

/* -- Sections & Cards: Glass Panels with CORRECTLY ROUNDED Gradient Borders -- */
.cmp-card, .cmp-cta-banner, .cmp-stats-grid, .cmp-faq .cmp-accordion, .cmp-tabs, .cmp-contact-section, .cmp-strategy-step {
    background-color: rgba(17, 24, 39, 0.6);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid transparent;
    border-radius: var(--radius);
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-3);
}
.cmp-card::before, .cmp-cta-banner::before, .cmp-stats-grid::before, .cmp-faq .cmp-accordion::before, .cmp-tabs::before, .cmp-contact-section::before, .cmp-strategy-step::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: var(--radius); /* **FIX: Ensure border inherits radius** */
    padding: 1px;
    background: linear-gradient(135deg, var(--clr-neon-purple), var(--clr-border) 70%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
    transition: background 0.3s ease-out;
}
.cmp-card:hover::before, .cmp-cta-banner:hover::before, .cmp-stats-grid:hover::before, .cmp-faq .cmp-accordion:hover::before, .cmp-tabs:hover::before, .cmp-contact-section:hover::before, .cmp-strategy-step:hover::before {
    background: var(--gradient-main);
}
.cmp-card:hover { transform: translateY(-5px); }
.cmp-card { padding: 0; }
.cmp-card__content, .cmp-cta-banner__content, .cmp-stats-grid__item { padding: var(--sp-3); }
.cmp-card__image { border-bottom: 1px solid var(--clr-border); opacity: 0.85; }
.cmp-card__text {
    font-size: 0.9rem; /* REWORK: Smaller font size for card descriptions */
}

/* -- Forms, Dialogs & Accordions -- */
.cmp-form input, .cmp-form textarea {
    background-color: rgba(11, 15, 25, 0.8);
    border: 1px solid var(--clr-border);
    color: var(--clr-text-headings);
    border-radius: var(--radius);
    padding: var(--sp-2);
    font-weight: 400;
}
.cmp-form input:focus, .cmp-form textarea:focus {
    border: 1px solid transparent;
    border-image-source: var(--gradient-main);
    border-image-slice: 1;
    box-shadow: none;
    outline: none;
}
.cmp-dialog, .cmp-accordion__panel {
    background-color: var(--clr-bg-alt);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius);
}
.cmp-accordion__button {
    background-color: transparent;
    border-radius: var(--radius);
    font-weight: 500;
}

/* MODIFIER: Agent Card with top icon */
.cmp-card--icon-top {
    text-align: center;
}
.cmp-card--icon-top .cmp-card__image {
    width: 100px;
    height: 100px;
    margin: var(--sp-3) auto var(--sp-2);
    border-radius: var(--radius);
    border-bottom: none;
    object-fit: cover;
}
.cmp-card--icon-top .cmp-card__content {
    text-align: center;
}
.cmp-card--icon-top .cmp-card__content p {
    margin-left: auto;
    margin-right: auto;
}

/* -- Logo Cloud Rework (Scrolling) -- */
.cmp-logo-cloud--scrolling {
    display: block; /* Override grid display */
    padding: 0;
    position: relative;
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}
.cmp-logo-cloud--scrolling .cmp-logo-cloud__track {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    animation: marquee 40s linear infinite;
    width: fit-content; /* Let the content define the width */
}
.cmp-logo-cloud--scrolling:hover .cmp-logo-cloud__track {
    animation-play-state: paused;
}
.cmp-logo-cloud--scrolling .cmp-logo-cloud__item {
    flex-shrink: 0;
}
.cmp-logo-cloud--scrolling .cmp-logo-cloud__item img {
    max-height: 50px; /* Adjust size for tech logos */
    width: auto;
    max-width: 150px;
    filter: none;
    opacity: 0.8;
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.cmp-logo-cloud--scrolling .cmp-logo-cloud__item img:hover {
    opacity: 1;
    transform: scale(1.1);
}
@keyframes marquee {
    from { transform: translateX(0%); }
    to { transform: translateX(-50%); }
}

/* -- About Us Page: Pillars Section -- */
.cmp-team-section .cmp-card {
    text-align: center;
}
.cmp-team-section .cmp-card .material-symbols-outlined {
    font-size: 4rem;
    background: var(--gradient-main);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block; /* Needed for text-align to work */
}
.cmp-team-section .cmp-card__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

/* -- About Us Page: Timeline Section Spacing -- */
section.cmp-timeline {
    padding-bottom: 8rem; /* Add space after timeline section */
}

/* -- Enterprise Page Specifics -- */
.cmp-stats-grid__icon .material-symbols-outlined {
    font-size: 3rem;
    background: var(--gradient-main);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.cmp-stats-grid__value {
    color: var(--clr-text-headings); /* White */
}
.cmp-stats-grid__label {
    background: var(--gradient-main);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 500;
}
.cmp-strategy-step {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    margin-bottom: var(--sp-4); /* Space between steps */
}
.cmp-strategy-step__graphic {
    flex-shrink: 0;
    width: 150px;
    height: 150px;
}
.cmp-strategy-step__graphic img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.cmp-strategy-step__content h3 {
    margin-top: 0;
}
@media (max-width: 768px) {
    .cmp-strategy-step {
        flex-direction: column;
        text-align: center;
    }
}


/* -- Footer -- */
.cmp-footer {
    background-color: #0B0F19;
    border-top: 1px solid var(--clr-border);
    color: var(--clr-text);
    margin-top: 8rem;
    padding: var(--sp-4) 0;
}
.cmp-footer a:hover {
    color: var(--clr-primary);
}
.cmp-footer__social-icon {
    width: 32px;
    height: 32px;
    vertical-align: middle;
    display: inline-block;
}

.cmp-footer__social-list--right {
    justify-content: flex-end;
}

.cmp-footer__contact-row {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.cmp-footer__contact-icon {
    font-size: 1.4em;
    color: var(--clr-primary);
    vertical-align: middle;
    /* Prevent icon from shrinking if container is small */
    flex-shrink: 0;
}

/* --- Language Selector: Minimal fix for gap and no bullets --- */
.cmp-footer__language-list {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

/* -- Contact Page -- */
.cmp-contact-section__map iframe {
    border-radius: var(--radius);
    border-color: var(--clr-border);
    filter: invert(90%) hue-rotate(180deg);
}
.cmp-contact-section__address {
    text-align: right; /* REWORK: Align address block to the right */
}
@media (max-width: 768px) {
    .cmp-contact-section__address {
        text-align: left; /* Revert on mobile for better readability */
    }
}

/* -- Testimonial Logo Miniatures -- */
.cmp-testimonial-slide__logo {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
    min-height: 128px;
    padding-top: 1rem;      /* Override the var(--sp-4) from style.css */
    padding-bottom: 0.5rem; /* Override the var(--sp-4) from style.css */
    /* Left/right padding remains var(--sp-4) from style.css */
}
.cmp-testimonial-slide__logo img {
    max-width: 240px;
    max-height: 128px;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 0;
    background: none;
    box-shadow: none;
    display: block;
}

/* --- Testimonial Slide Row Layout --- */
.cmp-testimonial-slide__row {
    display: flex;
    align-items: flex-start; /* <-- align logo to the top */
    gap: 2.5rem;
    justify-content: center;
    min-height: 180px;
}

.cmp-testimonial-slide__logo-col {
    flex: 0 0 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.cmp-testimonial-slide__logo-col img {
    max-width: 120px;
    max-height: 100px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.cmp-testimonial-slide__content-col {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.cmp-testimonial-slide__content {
    padding-top: 0.5rem;
    /* Bottom/left/right padding remains var(--sp-4) from style.css */
}

.cmp-testimonial-slide__content .cmp-card__text {
    margin-top: 0;
    margin-bottom: 0.5em;
}

.cmp-testimonial-slide__content .cmp-testimonials__author {
    margin-top: 0;
    font-style: normal;
    font-weight: bold;
    color: var(--clr-primary);
}

@media (max-width: 700px) {
    .cmp-testimonial-slide__row {
        flex-direction: column;
        align-items: center;
        gap: 1.5rem;
        min-height: 0;
    }
    .cmp-testimonial-slide__logo-col {
        margin-bottom: 0.5rem;
    }
    .cmp-testimonial-slide__content-col {
        width: 100%;
        align-items: center;
        text-align: center;
    }
}

/* --- Testimonial Carousel Navigation Buttons --- */
.cmp-testimonials .cmp-carousel__button {
    width: 1.6rem;
    height: 1.6rem;
    min-width: 1.6rem;
    min-height: 1.6rem;
    border-radius: 0.5rem;
    background: rgba(17, 24, 39, 0.85);
    /* Remove border */
    border: none !important;
    box-shadow: none !important;
    color: var(--clr-neon-cyan);
    box-shadow: 0 0 0 1.5px var(--clr-neon-cyan) inset;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 
        background 0.2s,
        border-color 0.2s,
        color 0.2s,
        box-shadow 0.2s;
    padding: 0;
}
.cmp-testimonials .cmp-carousel__button:hover,
.cmp-testimonials .cmp-carousel__button:focus {
    background: var(--clr-neon-cyan);
    color: #0B0F19;
    border-color: var(--clr-neon-cyan);
    box-shadow: 0 0 8px 0 var(--clr-neon-cyan);
    outline: none;
}
.cmp-testimonials .cmp-carousel__button .material-symbols-outlined {
    font-size: 1rem;
    /* Gradient overlay for arrow icons */
    background: var(--gradient-main);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
    vertical-align: middle;
    transition: background 0.2s;
}

/* -- Contact Section: Proper Spacing and Padding Fixes -- */
.cmp-contact-section {
    /* Override the base grid layout and add proper spacing */
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-4);
    padding: var(--sp-4) !important; /* Force override with important */
}

@media (min-width: 768px) {
    .cmp-contact-section {
        grid-template-columns: 1fr 1fr;
    }
}

/* Ensure proper spacing for all direct children */
.cmp-contact-section__address,
.cmp-contact-section__form {
    padding: 0; /* Reset any existing padding */
    margin: 0; /* Reset any existing margin */
}

/* Add proper spacing to the map that spans full width */
.cmp-contact-section__map {
    grid-column: 1 / -1;
    margin-top: var(--sp-3);
}

.cmp-contact-section__map iframe {
    margin-top: var(--sp-2);
}

/* Add spacing between elements within address and form sections */
.cmp-contact-section__address > *,
.cmp-contact-section__form > * {
    margin-bottom: var(--sp-3);
}

.cmp-contact-section__address > *:last-child,
.cmp-contact-section__form > *:last-child {
    margin-bottom: 0;
}

/* Ensure form inside contact section has proper spacing */
.cmp-contact-section .cmp-form {
    margin: 0;
    padding: 0;
}

/* Reduce space after testimonials on index */
.cmp-testimonials {
    margin-bottom: 2rem !important;
}
.cmp-testimonials + section {
    margin-top: 2rem !important;
}

/* --- HERO SECTION FONT & BUTTON TWEAKS --- */
.cmp-hero__headline,
.cmp-hero h1,
.cmp-hero h2 {
    font-weight: 500 !important;
    font-size: 2.7rem !important; /* Bigger headline */
    letter-spacing: -0.5px;
    line-height: 1.15;
}

.cmp-hero__text,
.cmp-hero p {
    font-size: 1.25rem !important; /* Bigger subtext */
    font-weight: 400 !important;
    opacity: 0.92;
    line-height: 1.6;
    margin-bottom: 2rem;
}

/* Make hero buttons slightly smaller, square edges, no border-radius */
.cmp-hero .cmp-button,
.cmp-hero .cmp-button--large {
    font-size: 1.08rem !important;
    padding: 0.75rem 1.5rem !important;
    min-height: 2.25rem;
    border-radius: 0 !important;
}

/* Gradient text for hero "Generative AI" */
.cmp-hero__gradient {
    background: var(--gradient-main);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline;
}