/* 
   BASE STYLES - Global variables, reset, gradient
   Loading: Always (all pages)
*/

/* --- GLOBAL VARIABLES --- */
:root {
    /* PALETA BARW - WARM MIDNIGHT */
    --bg-color: #1C222E;
    /* Deep Navy */
    --text-main: #E8E0D5;
    /* Warm Sand */
    --accent: #C67B5C;
    /* Terracotta */
    --secondary: #BFA68A;
    /* Muted Gold */
    --line-color: rgba(198, 123, 92, 0.3);
    /* Subtelne linie */

    /* TYPOGRAFIA */
    --font-head: 'Space Grotesk', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-mono: 'Space Mono', monospace;

    /* USTAWIENIA */
    --container-width: 1400px;
    --section-padding: 120px;
    /* ODSTĘPY (System 4px) - DEFINICJE BRAKUJĄCE */
    --space-1: 0.4rem;
    /* 4px */
    --space-2: 0.8rem;
    /* 8px */
    --space-3: 1.2rem;
    /* 12px */
    --space-4: 1.6rem;
    /* 16px */
    --space-6: 2.4rem;
    /* 24px */
    --space-8: 3.2rem;
    /* 32px */
    --space-12: 4.8rem;
    /* 48px */
    --space-16: 6.4rem;
    /* 64px */
    --space-24: 9.6rem;
    /* 96px */
    --space-32: 12.8rem;
    /* 128px */

    /* Inne */
    --text-xs: 1.2rem;
    --text-sm: 1.4rem;
    --text-base: 1.6rem;
    --text-lg: 1.8rem;
    --text-xl: 2.4rem;
    --container-max: 1400px;
}

/* --- RESET & BASIC SETUP --- */
*,
*::before,
*::after {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* --- BODY SIZING FIX --- */
body {
    background-color: var(--bg-color) !important;
    background: var(--bg-color) !important;
    color: var(--text-main);
    font-family: var(--font-body) !important;
    line-height: 1.5;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    min-height: 100vh;
}

/* --- FONT OVERRIDE (forces correct fonts over Elementor/plugins) --- */
/* Body text - Inter font, normal weight */
body,
body p,
body span,
body div,
body li,
body a,
body button,
body input,
body textarea,
body select,
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-heading-title,
.elementor-widget-container,
.elementor-widget-container p,
.elementor-widget-container span,
/* Contact page */
.info-val,
.info-link,
.form-label,
/* Studio page */
.founder-quote,
.story-text,
.value-text,
.section-sub,
.body-inner p,
.cap-desc,
/* Portfolio page */
.desc,
.hero-meta,
/* Oferta page */
.srv-desc,
.step-desc,
.faq-a {
    font-family: var(--font-body) !important;
}

/* Text elements - normalize font-weight and margins */
body p,
.elementor-widget-text-editor p,
.elementor-widget-container p,
.info-val,
.founder-quote,
.story-text,
.value-text,
.section-sub,
.body-inner p,
.cap-desc,
.desc,
.srv-desc,
.step-desc,
.faq-a {
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

/* Headings - Space Grotesk font */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
.elementor-heading-title,
/* Studio page */
.studio-headline .word,
.founder-name,
.section-title,
.story-title,
.value-title,
.cap-title,
.cta-title,
/* Contact page */
.contact-title,
/* Portfolio page */
.hero-statement,
.kinetic-title,
/* Oferta page */
.expert-title,
.srv-headline,
.step-title {
    font-family: var(--font-head) !important;
}

/* Mono text - Space Mono */
code,
pre,
kbd,
samp,
.mono,
[class*="mono"],
/* Studio labels */
.studio-label,
.section-label,
.founder-role,
.story-year,
.scroll-cue span,
.tech-label,
/* Contact labels */
.info-label,
/* Portfolio labels */
.label,
.meta-top,
.stats,
/* Oferta labels */
.srv-tag,
.spec-head,
.spec-col ul li {
    font-family: var(--font-mono) !important;
    font-weight: 400 !important;
}

html {
    overflow-x: hidden;
    scrollbar-gutter: stable;
    background: #1C222E !important;
}

/* Global animated gradient removed - using solid #1C222E matching Kontakt page */

@keyframes globalGradientShift {

    0%,
    100% {
        background-position: 0% 0%, 100% 100%, 50% 50%;
    }

    25% {
        background-position: 100% 0%, 0% 100%, 100% 0%;
    }

    50% {
        background-position: 100% 100%, 0% 0%, 0% 100%;
    }

    75% {
        background-position: 0% 100%, 100% 0%, 50% 0%;
    }
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }

    25% {
        background-position: 50% 100%;
    }

    50% {
        background-position: 100% 50%;
    }

    75% {
        background-position: 50% 0%;
    }

    100% {
        background-position: 0% 50%;
    }
}

/* --- TRANSPARENT SECTIONS --- */
main[data-barba="wrapper"],
main[data-barba="wrapper"]>div[data-barba="container"],
/* .hero-section removed */
.manifesto-section,
.portfolio-section,
.services-teaser,
.vibe-portal-section,
/* footer-section removed */
.expert-hero,
.methodology-section,
.capabilities-section,
.vibe-hero,
.styles-container,
.contact-split-section,
.manifesto-grid,
.manifesto-text,
.manifesto-visual,
.image-mask,
.services-grid,
.caps-grid,
.vibe-grid,
.footer-bottom,
.footer-cta-wrapper {
    background-color: transparent !important;
}

/* Barba wrapper */
main[data-barba="wrapper"] {
    width: 100%;
    position: relative;
    overflow: visible;
}

main[data-barba="wrapper"]>div[data-barba="container"] {
    width: 100%;
}

/* Utility class - Outline text */
.outline-text {
    color: transparent !important;
    -webkit-text-stroke: 1.5px var(--text-main) !important;
    text-stroke: 1.5px var(--text-main) !important;
    font-family: var(--font-head) !important;
    font-weight: 700 !important;
}

/* Hide scroll progress bars from plugins */
.starter-templates-starter-templates-progress,
.starter-templates-starter-templates-progress *,
.starter-templates-starter-templates-progress-bar,
.starter-templates-starter-templates-progress-bar *,
.starter-templates-starter-templates-starter-templates-progress,
.starter-templates-starter-templates-starter-templates-progress *,
#starter-templates-starter-templates-progress,
div[class*="reading-progress"],
div[class*="scroll-progress"],
div[class*="progress-bar"][style*="position: fixed"],
.starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-starter-templates-progress {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
}

/* === GLOBAL SECTION SEPARATORS === */
.section-separator {
    display: block;
    width: 100%;
    max-width: 1200px;
    height: 1px;
    margin: 0 auto;
    background: linear-gradient(90deg,
            transparent 0%,
            rgba(198, 123, 92, 0.6) 20%,
            rgba(198, 123, 92, 0.9) 50%,
            rgba(198, 123, 92, 0.6) 80%,
            transparent 100%);
    position: relative;
    z-index: 50;
    opacity: 1 !important;
}

/* Glow removed for hard edge */

/* === HERO TITLE POSITION ADJUSTMENT (move EVENTÓW to start on screen) === */
/* Shift content to the right so text starts within viewport */
.hero-content {
    left: 10% !important;
}

.hero-title {
    /* Tighter line-height to reduce gaps between NOWA, ERA, EVENTÓW */
    line-height: 0.85 !important;
}

.hero-line-1,
.hero-line-2 {
    line-height: 0.85 !important;
    display: block !important;
}

/* Reduce gap in line-wrapper */
.line-wrapper {
    margin-bottom: -0.1em !important;
}