/* ============================================
   CSS CUSTOM PROPERTIES
   ============================================ */
:root {
    --c-black: #010203;
    --c-dark: #030810;
    --c-dark-surface: #050d16;
    --c-dark-card: #07111c;
    --c-blue: #3682AE;
    --c-blue-light: #4a9bcc;
    --c-blue-dark: #2a6a8f;
    --c-blue-glow: rgba(54, 130, 174, 0.3);
    --c-blue-subtle: rgba(54, 130, 174, 0.08);
    --c-grey: #D6D3D3;
    --c-grey-dim: #8a8a8a;
    --c-white: #f0f0f0;
    --c-white-pure: #ffffff;
    --font: 'Space Grotesk', sans-serif;
    --max-w: 1200px;
    --px-desktop: 40px;
    --px-mobile: 20px;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
}

/* RESET */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; max-width: 100%; }
body { font-family: var(--font); background: var(--c-black); color: var(--c-grey); font-size: 16px; line-height: 1.7; overflow-x: hidden; width: 100%; max-width: 100%; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }

/* ============================================
   OCEAN CURRENT BACKGROUND
   ============================================ */
.ocean-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse at 50% 30%, rgba(3,7,14,1) 0%, transparent 70%),
        radial-gradient(ellipse at 20% 70%, rgba(3,10,20,0.25) 0%, transparent 50%),
        linear-gradient(180deg, #010304 0%, #020406 40%, #020508 70%, #010304 100%);
}

/* SVG noise texture */
.noise-overlay {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.1;
    mix-blend-mode: soft-light;
}

/* Current ribbons - ztlumené */
.current-ribbons { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; clip-path: inset(0); }
.ribbon {
    position: absolute;
    left: -20%;
    width: 140%;
    height: 1px;
    opacity: 0;
    animation: ribbonFlow linear infinite;
}
.ribbon:nth-child(1) {
    top: 12%; height: 100px;
    background: linear-gradient(90deg, transparent 0%, rgba(54,130,174,0.03) 20%, rgba(54,130,174,0.08) 40%, rgba(74,155,204,0.05) 60%, rgba(54,130,174,0.02) 80%, transparent 100%);
    filter: blur(30px); animation-duration: 20s; animation-delay: 0s;
}
.ribbon:nth-child(2) {
    top: 28%; height: 70px;
    background: linear-gradient(90deg, transparent 0%, rgba(42,106,143,0.04) 15%, rgba(54,130,174,0.09) 35%, rgba(54,130,174,0.055) 55%, rgba(30,90,130,0.025) 75%, transparent 100%);
    filter: blur(25px); animation-duration: 24s; animation-delay: -4s;
}
.ribbon:nth-child(3) {
    top: 45%; height: 130px;
    background: linear-gradient(90deg, transparent 0%, rgba(54,130,174,0.02) 10%, rgba(54,130,174,0.07) 30%, rgba(74,155,204,0.09) 50%, rgba(54,130,174,0.04) 70%, transparent 100%);
    filter: blur(40px); animation-duration: 28s; animation-delay: -8s;
}
.ribbon:nth-child(4) {
    top: 62%; height: 90px;
    background: linear-gradient(90deg, transparent 0%, rgba(30,80,120,0.045) 25%, rgba(54,130,174,0.08) 45%, rgba(54,130,174,0.045) 65%, transparent 100%);
    filter: blur(35px); animation-duration: 22s; animation-delay: -12s;
}
.ribbon:nth-child(5) {
    top: 78%; height: 80px;
    background: linear-gradient(90deg, transparent 0%, rgba(54,130,174,0.03) 20%, rgba(42,106,143,0.06) 50%, rgba(54,130,174,0.03) 80%, transparent 100%);
    filter: blur(28px); animation-duration: 18s; animation-delay: -6s;
}
.ribbon:nth-child(6) {
    top: 20%; height: 50px;
    background: linear-gradient(90deg, transparent 0%, rgba(74,155,204,0.045) 30%, rgba(54,130,174,0.085) 50%, rgba(74,155,204,0.04) 70%, transparent 100%);
    filter: blur(20px); animation-duration: 30s; animation-delay: -15s;
}

@keyframes ribbonFlow {
    0% { transform: translateX(-30%) scaleY(0.8); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateX(30%) scaleY(1.2); opacity: 0; }
}

/* Current particles + cursor interaction canvas */
#currentCanvas { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

/* Vignette */
.vignette { position: fixed; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(ellipse at center, transparent 25%, rgba(1,2,3,0.82) 100%); }

/* Cursor wake canvas */
#cursorCanvas { position: fixed; inset: 0; z-index: 1; pointer-events: none; }

@media (pointer: coarse) { #cursorCanvas { display: none !important; } }

/* ============================================
   LAYOUT
   ============================================ */
.container { max-width: var(--max-w); margin: 0 auto; padding-left: var(--px-desktop); padding-right: var(--px-desktop); }
section { position: relative; z-index: 1; }
.hero { overflow: clip; }

/* ============================================
   REVEAL ANIMATIONS
   ============================================ */
.reveal { opacity: 0; transform: translateY(40px); transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-left { opacity: 0; transform: translateX(-60px); transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); }
.reveal-left.visible { opacity: 1; transform: translateX(0); }
.reveal-right { opacity: 0; transform: translateX(60px); transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); }
.reveal-right.visible { opacity: 1; transform: translateX(0); }
.reveal-scale { opacity: 0; transform: scale(0.9); transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); }
.reveal-scale.visible { opacity: 1; transform: scale(1); }
.delay-1{transition-delay:.1s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.3s}.delay-4{transition-delay:.4s}.delay-5{transition-delay:.5s}

/* ============================================
   HEADER
   ============================================ */
.site-header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; padding: 20px 0; transition: background 0.4s var(--ease-smooth), padding 0.4s var(--ease-smooth), backdrop-filter 0.4s var(--ease-smooth); }
.site-header.scrolled { background: rgba(3,6,9,0.85); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); padding: 14px 0; border-bottom: 1px solid rgba(54,130,174,0.1); }
.header-inner { display: flex; align-items: center; justify-content: space-between; }
.logo { display: flex; align-items: center; flex-shrink: 0; }
.logo img { height: 40px; width: auto; }
.logo-placeholder { width: 96px; height: 40px; display: flex; align-items: center; justify-content: center; }
.main-nav { display: flex; align-items: center; gap: 36px; }
.main-nav a { font-size: 15px; font-weight: 500; color: var(--c-grey); position: relative; padding: 4px 0; transition: color 0.3s var(--ease-smooth); }
.main-nav a::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 2px; background: var(--c-blue); border-radius: 1px; transition: width 0.4s var(--ease-out); }
.main-nav a:hover { color: var(--c-white); }
.main-nav a:hover::after { width: 100%; }
.main-nav a.active { color: var(--c-white); }
.main-nav a.active::after { width: 100%; }
.main-nav .nav-cta { font-size:15px; font-weight:600; color:var(--c-white); background:var(--c-blue); padding:10px 28px; border-radius:0; transition:background .3s var(--ease-smooth),transform .3s var(--ease-smooth),box-shadow .3s var(--ease-smooth); }
.main-nav .nav-cta::after { display:none; }
.main-nav .nav-cta:hover { background:var(--c-blue-light); transform:translateY(-2px); box-shadow:0 8px 30px rgba(54,130,174,0.3); }
.menu-toggle { display:none; flex-direction:column; justify-content:center; align-items:center; width:44px; height:44px; background:none; border:none; cursor:pointer; gap:5px; z-index:1002; position:relative; }
.menu-toggle span { display:block; width:24px; height:2px; background:var(--c-white); border-radius:2px; transition: transform 0.5s var(--ease-out), opacity 0.3s var(--ease-out), width 0.4s var(--ease-out); transform-origin: center; }
.menu-toggle.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); width:22px; }
.menu-toggle.active span:nth-child(2){ opacity:0; width:0; }
.menu-toggle.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); width:22px; }

/* ============================================
   MOBILE NAV – OCEAN CURRENT REVEAL
   ============================================ */
.mobile-nav {
    display:none;
    position:fixed;
    inset:0;
    z-index:1001;
    flex-direction:column;
    pointer-events:none;
    overflow:hidden;
}
.mobile-nav.open {
    pointer-events:all;
}

/* Wave reveal background – clips from right to left */
.mobile-nav-bg {
    position:absolute;
    inset:0;
    background: rgba(2,5,10,0.97);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    clip-path: circle(0% at calc(100% - 42px) 32px);
    transition: clip-path 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}
.mobile-nav.open .mobile-nav-bg {
    clip-path: circle(150% at calc(100% - 42px) 32px);
}

/* Current animation inside menu */
.mobile-nav-canvas {
    position:absolute;
    inset:0;
    z-index:0;
}

/* Internal current ribbons */
.mobile-nav-currents {
    position:absolute;
    inset:0;
    overflow:hidden;
    z-index:0;
}
.mobile-nav-currents .mn-ribbon {
    position:absolute;
    left:-30%;
    width:160%;
    opacity:0;
}
.mobile-nav.open .mobile-nav-currents .mn-ribbon {
    animation: mnRibbonFlow 14s linear infinite;
}
.mn-ribbon:nth-child(1) {
    top:18%; height:60px;
    background: linear-gradient(90deg, transparent, rgba(54,130,174,0.06) 30%, rgba(54,130,174,0.12) 50%, rgba(54,130,174,0.06) 70%, transparent);
    filter:blur(20px);
    animation-delay:0s !important;
}
.mn-ribbon:nth-child(2) {
    top:45%; height:80px;
    background: linear-gradient(90deg, transparent, rgba(54,130,174,0.04) 25%, rgba(74,155,204,0.1) 50%, rgba(54,130,174,0.04) 75%, transparent);
    filter:blur(28px);
    animation-delay:-5s !important;
}
.mn-ribbon:nth-child(3) {
    top:72%; height:50px;
    background: linear-gradient(90deg, transparent, rgba(42,106,143,0.05) 30%, rgba(54,130,174,0.08) 55%, rgba(42,106,143,0.04) 75%, transparent);
    filter:blur(22px);
    animation-delay:-9s !important;
}

@keyframes mnRibbonFlow {
    0% { transform:translateX(-25%); opacity:0; }
    8% { opacity:1; }
    92% { opacity:1; }
    100% { transform:translateX(25%); opacity:0; }
}

/* Menu content wrapper */
.mobile-nav-content {
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    height:100%;
    padding: 100px 32px 40px;
    justify-content: center;
}

/* Close button */
.mobile-nav-logo {
    position:absolute;
    top:22px;
    left:20px;
    opacity:0;
    transform:translateX(-20px);
    transition: opacity 0.4s var(--ease-out) 0.25s, transform 0.5s var(--ease-out) 0.25s;
}
.mobile-nav-logo img { height:40px; width:auto; }
.mobile-nav.open .mobile-nav-logo {
    opacity:1;
    transform:translateX(0);
}

.mobile-nav-close {
    position:absolute;
    top:20px;
    right:20px;
    width:48px;
    height:48px;
    background:none;
    border:1px solid rgba(54,130,174,0.2);
    border-radius:0;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    transform:rotate(-90deg) scale(0.5);
    transition: opacity 0.4s var(--ease-out) 0.3s, transform 0.5s var(--ease-out) 0.3s, border-color 0.3s, background 0.3s;
}
.mobile-nav.open .mobile-nav-close {
    opacity:1;
    transform:rotate(0deg) scale(1);
}
.mobile-nav-close svg {
    width:20px;
    height:20px;
    color:var(--c-grey);
    transition:color 0.3s;
}
.mobile-nav-close:active,
.mobile-nav-close:hover {
    border-color:var(--c-blue);
    background:rgba(54,130,174,0.1);
}
.mobile-nav-close:active svg,
.mobile-nav-close:hover svg {
    color:var(--c-blue);
}

/* Navigation links */
.mobile-nav-links {
    display:flex;
    flex-direction:column;
    gap:0;
}

.mobile-nav-link {
    display:block;
    font-size:28px;
    font-weight:700;
    color:var(--c-grey);
    padding:20px 0;
    text-decoration:none;
    position:relative;
    transform: translateX(80px);
    opacity:0;
    transition: transform 0.6s var(--ease-out), opacity 0.5s var(--ease-out), color 0.3s;
}

/* Staggered entrance */
.mobile-nav.open .mobile-nav-link {
    transform: translateX(0);
    opacity: 1;
}
.mobile-nav.open .mobile-nav-link:nth-child(1) { transition-delay: 0.15s; }
.mobile-nav.open .mobile-nav-link:nth-child(2) { transition-delay: 0.22s; }
.mobile-nav.open .mobile-nav-link:nth-child(3) { transition-delay: 0.29s; }
.mobile-nav.open .mobile-nav-link:nth-child(4) { transition-delay: 0.36s; }
.mobile-nav.open .mobile-nav-link:nth-child(5) { transition-delay: 0.43s; }

/* Closing: reverse stagger */
.mobile-nav:not(.open) .mobile-nav-link:nth-child(5) { transition-delay: 0.02s; }
.mobile-nav:not(.open) .mobile-nav-link:nth-child(4) { transition-delay: 0.06s; }
.mobile-nav:not(.open) .mobile-nav-link:nth-child(3) { transition-delay: 0.1s; }
.mobile-nav:not(.open) .mobile-nav-link:nth-child(2) { transition-delay: 0.14s; }
.mobile-nav:not(.open) .mobile-nav-link:nth-child(1) { transition-delay: 0.18s; }

/* Current-style separator between links */
.mobile-nav-link::after {
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    height:1px;
    width:0;
    background: linear-gradient(90deg, rgba(54,130,174,0.3), rgba(54,130,174,0.08) 60%, transparent);
    transition: width 0.8s var(--ease-out);
}
.mobile-nav.open .mobile-nav-link::after {
    width:100%;
}
.mobile-nav.open .mobile-nav-link:nth-child(1)::after { transition-delay: 0.35s; }
.mobile-nav.open .mobile-nav-link:nth-child(2)::after { transition-delay: 0.42s; }
.mobile-nav.open .mobile-nav-link:nth-child(3)::after { transition-delay: 0.49s; }
.mobile-nav.open .mobile-nav-link:nth-child(4)::after { transition-delay: 0.56s; }

.mobile-nav-link:hover, .mobile-nav-link:active {
    color:var(--c-white);
}

/* CTA link special style */
.mobile-nav-link.mn-cta {
    margin-top:12px;
    padding:0;
}
.mobile-nav-link.mn-cta::after { display:none; }
.mobile-nav-link.mn-cta .mn-cta-inner {
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:14px 32px;
    background:var(--c-blue);
    color:var(--c-white-pure);
    font-size:16px;
    font-weight:600;
    border-radius:0;
    transition:background 0.3s, box-shadow 0.3s;
}
.mobile-nav-link.mn-cta .mn-cta-inner svg {
    width:16px; height:16px;
}

/* Footer info in mobile nav */
.mobile-nav-footer {
    margin-top:auto;
    padding-top:24px;
    opacity:0;
    transform:translateY(20px);
    transition: opacity 0.5s var(--ease-out) 0.5s, transform 0.5s var(--ease-out) 0.5s;
}
.mobile-nav.open .mobile-nav-lang {
    opacity:1;
    transform:translateY(0);
}
.mobile-nav.open .mobile-nav-footer {
    opacity:1;
    transform:translateY(0);
}
.mobile-nav-footer a {
    display:block;
    font-size:14px;
    color:var(--c-blue);
    text-decoration:none;
    margin-bottom:4px;
}
.mobile-nav-footer span {
    font-size:12px;
    color:var(--c-grey-dim);
}

/* ============================================
   HERO
   ============================================ */
.hero { min-height:100vh; display:flex; align-items:center; position:relative; overflow:hidden; padding-top:100px; }
.hero-content { position:relative; z-index:2; width:100%; }
.hero-tagline { font-size:15px; font-weight:500; color:var(--c-blue); text-transform:uppercase; letter-spacing:3px; margin-bottom:24px; display:flex; align-items:center; gap:12px; }
.hero-tagline::before { content:''; display:inline-block; width:40px; height:2px; background:var(--c-blue); }
.hero-title { font-size:clamp(38px,5.5vw,68px); font-weight:700; color:var(--c-white); line-height:1.1; margin-bottom:32px; max-width:800px; }
.hero-title .highlight { background:linear-gradient(135deg,var(--c-blue),var(--c-blue-light)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-services { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:40px; }
.hero-service-tag { display:inline-flex; align-items:center; gap:8px; padding:10px 22px; border:1px solid rgba(54,130,174,0.25); border-radius:0; font-size:15px; font-weight:500; color:var(--c-grey); background:rgba(54,130,174,0.05); transition:all .4s var(--ease-out); cursor:pointer; text-decoration:none; }
.hero-service-tag:hover { border-color:var(--c-blue); color:var(--c-white); background:rgba(54,130,174,0.12); transform:translateY(-3px); box-shadow:0 8px 25px rgba(54,130,174,0.15); }
.hero-service-tag svg,.hero-service-tag img { width:16px; height:16px; flex-shrink:0; }
.hero-cta-group { display:flex; gap:16px; align-items:center; }
.btn-primary { display:inline-flex; align-items:center; gap:10px; padding:16px 36px; background:var(--c-blue); color:var(--c-white-pure); font-family:var(--font); font-size:16px; font-weight:600; border:none; border-radius:0; cursor:pointer; transition:all .4s var(--ease-out); text-decoration:none; }
.btn-primary:hover { background:var(--c-blue-light); transform:translateY(-3px); box-shadow:0 12px 40px rgba(54,130,174,0.35); }
.btn-primary svg { width:18px; height:18px; transition:transform .3s var(--ease-out); }
.btn-primary:hover svg { transform:translateX(4px); }
.btn-secondary { display:inline-flex; align-items:center; gap:10px; padding:16px 36px; background:transparent; color:var(--c-grey); font-family:var(--font); font-size:16px; font-weight:500; border:1px solid rgba(214,211,211,0.2); border-radius:0; cursor:pointer; transition:all .4s var(--ease-out); text-decoration:none; }
.btn-secondary:hover { border-color:var(--c-blue); color:var(--c-white); background:rgba(54,130,174,0.08); transform:translateY(-3px); }
.hero-orb { position:absolute; right:-5%; top:50%; transform:translateY(-50%); width:500px; height:500px; border-radius:50%; background:radial-gradient(circle at 30% 30%,rgba(54,130,174,0.06),rgba(54,130,174,0.01) 70%); filter:blur(60px); animation:orbFloat 8s ease-in-out infinite; pointer-events:none; }
@keyframes orbFloat { 0%,100%{transform:translateY(-50%) scale(1)} 50%{transform:translateY(-52%) scale(1.05)} }
.scroll-indicator { position:absolute; bottom:40px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; animation:scrollBounce 2s ease-in-out infinite; }
.scroll-indicator .mouse { width:24px; height:38px; border:2px solid rgba(214,211,211,0.25); border-radius:12px; position:relative; }
.scroll-indicator .mouse::after { content:''; position:absolute; top:8px; left:50%; transform:translateX(-50%); width:3px; height:8px; background:var(--c-blue); border-radius:2px; animation:mouseScroll 2s ease-in-out infinite; }
@keyframes scrollBounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }
@keyframes mouseScroll { 0%,100%{opacity:1;top:8px} 50%{opacity:.3;top:18px} }

/* ============================================
   SECTION HEADINGS
   ============================================ */
.section-label { font-size:16px; font-weight:600; color:var(--c-blue); text-transform:uppercase; letter-spacing:3px; margin-bottom:16px; display:flex; align-items:center; gap:12px; }
.section-label::before { content:''; display:inline-block; width:32px; height:2px; background:var(--c-blue); }
.section-title { font-size:clamp(30px,3.5vw,46px); font-weight:700; color:var(--c-white); line-height:1.2; margin-bottom:20px; }
.section-desc { font-size:17px; color:var(--c-grey); line-height:1.8; max-width:700px; }

/* ============================================
   ABOUT
   ============================================ */
.about-section { padding:60px 0; }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-text .section-desc { margin-bottom:32px; }
.about-image-wrap { position:relative; }
.about-hero-img { width:100%; aspect-ratio:4/3; object-fit:cover; border:1px solid rgba(54,130,174,0.1); display:block; }
.image-placeholder { width:100%; aspect-ratio:4/3; border-radius:0; background:linear-gradient(135deg,var(--c-dark-surface),var(--c-dark-card)); border:1px solid rgba(54,130,174,0.1); display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; }
.image-placeholder::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(54,130,174,0.05),transparent); }
.image-placeholder-text { color:var(--c-grey-dim); font-size:14px; z-index:1; }
.floating-badge { position:absolute; bottom:-24px; right:-24px; background:var(--c-dark-card); border:1px solid rgba(54,130,174,0.2); border-radius:0; padding:20px 28px; backdrop-filter:blur(10px); }
.floating-badge .badge-number { font-size:32px; font-weight:700; color:var(--c-blue); line-height:1; }
.floating-badge .badge-text { font-size:13px; color:var(--c-grey-dim); margin-top:4px; }

/* ============================================
   SERVICES
   ============================================ */
.services-section { padding:60px 0; }
.services-header { margin-bottom:64px; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.service-card { padding:44px 36px; border-radius:0; background:rgba(8,20,34,0.5); border:1px solid rgba(54,130,174,0.08); backdrop-filter:blur(6px); transition:all .5s var(--ease-out); position:relative; overflow:hidden; }
.service-card::after { content:''; position:absolute; bottom:0; left:0; width:100%; height:3px; background:linear-gradient(90deg,var(--c-blue),var(--c-blue-light)); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease-out); }
.service-card:hover { transform:translateY(-8px); border-color:rgba(54,130,174,0.2); box-shadow:0 20px 60px rgba(54,130,174,0.08); }
.service-card:hover::after { transform:scaleX(1); }
.service-icon { width:56px; height:56px; border-radius:0; background:rgba(54,130,174,0.1); display:flex; align-items:center; justify-content:center; margin-bottom:24px; transition:all .4s var(--ease-out); }
.service-card:hover .service-icon { background:rgba(54,130,174,0.2); transform:scale(1.08); }
.service-icon svg { width:26px; height:26px; stroke:var(--c-blue); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.service-icon img { width:32px; height:32px; object-fit:contain; display:block; }
.service-card h3 { font-size:20px; font-weight:700; color:var(--c-white); margin-bottom:14px; }
.service-card p { font-size:15px; color:var(--c-grey); line-height:1.7; }
.service-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.service-tag { font-size:12px; font-weight:500; color:var(--c-blue); background:rgba(54,130,174,0.08); padding:5px 14px; border-radius:0; border:1px solid rgba(54,130,174,0.12); }

/* ============================================
   STATS
   ============================================ */
.stats-section { padding:60px 0; margin:60px 0; position:relative; z-index:1; background:linear-gradient(180deg, rgba(8,20,36,0.0) 0%, rgba(8,20,36,0.5) 8%, rgba(8,20,36,0.55) 50%, rgba(8,20,36,0.5) 92%, rgba(8,20,36,0.0) 100%); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
.stats-section::before { content:''; position:absolute; top:0; left:0; width:100%; height:1px; background:linear-gradient(90deg, transparent 5%, rgba(54,130,174,0.12) 30%, rgba(54,130,174,0.2) 50%, rgba(54,130,174,0.12) 70%, transparent 95%); }
.stats-section::after { content:''; position:absolute; bottom:0; left:0; width:100%; height:1px; background:linear-gradient(90deg, transparent 5%, rgba(54,130,174,0.12) 30%, rgba(54,130,174,0.2) 50%, rgba(54,130,174,0.12) 70%, transparent 95%); }
.stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:34px; }
.stat-card { text-align:center; padding:34px 28px; background:none; border:none; border-radius:0; position:relative; }
.stat-card:not(:last-child)::after { content:''; position:absolute; right:0; top:15%; height:70%; width:1px; background:linear-gradient(180deg, transparent, rgba(54,130,174,0.2) 50%, transparent); }
.stat-number { font-size:clamp(48px,5vw,64px); font-weight:700; color:var(--c-blue); line-height:1; margin-bottom:6px; }
.stat-number .plus { font-weight:700; color:var(--c-blue-light); }
.stat-text { font-size:15px; color:var(--c-grey); line-height:1.5; }

/* ============================================
   WEB CREATION
   ============================================ */
.web-section { padding:60px 0; }
.web-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.web-image-wrap { position:relative; order:2; }

/* Web showcase carousel */
.web-carousel {
    position:relative;
    border-radius:0;
    overflow:hidden;
    border:1px solid rgba(54,130,174,0.1);
    background:linear-gradient(135deg,var(--c-dark-surface),var(--c-dark-card));
}
.web-carousel-track {
    display:flex;
    transition:transform 0.6s var(--ease-out);
}
.web-carousel-slide {
    min-width:100%;
    aspect-ratio:4/3;
    position:relative;
}
.web-carousel-slide img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.web-carousel-nav {
    position:absolute;
    bottom:16px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    gap:16px;
    background:rgba(2,5,10,0.7);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border:1px solid rgba(54,130,174,0.15);
    border-radius:0;
    padding:8px 8px;
}
.web-carousel-arrow {
    width:36px;
    height:36px;
    border-radius:0;
    border:1px solid rgba(54,130,174,0.2);
    background:transparent;
    color:var(--c-grey);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:all .3s var(--ease-smooth);
    padding:0;
}
.web-carousel-arrow:hover {
    border-color:var(--c-blue);
    color:var(--c-blue);
    background:rgba(54,130,174,0.1);
}
.web-carousel-arrow svg { width:16px; height:16px; }
.web-carousel-counter {
    font-size:13px;
    font-weight:600;
    color:var(--c-grey);
    font-variant-numeric:tabular-nums;
    min-width:36px;
    text-align:center;
}
.web-carousel-counter span { color:var(--c-white); }

/* ============================================
   TESTIMONIALS
   ============================================ */
.testimonials-section { padding:60px 0; }
.testimonials-header { margin-bottom:48px; }
.testimonials-slider { position:relative; overflow:hidden; }
.testimonials-track { display:flex; transition:transform .6s var(--ease-out); }
.testimonial-card { min-width:100%; padding:0; }
.testimonial-inner { max-width:900px; padding:0 0 0 48px; position:relative; text-align:left; background:none; border:none; }
.testimonial-inner::before { content:''; position:absolute; top:0; left:0; width:2px; height:100%; background:linear-gradient(180deg, var(--c-blue), rgba(54,130,174,0.15)); }
.testimonial-quote-mark { font-size:72px; font-weight:700; color:var(--c-blue); opacity:0.2; line-height:0.8; font-family:Georgia,serif; margin-bottom:12px; display:block; }
.testimonial-text { font-size:18px; color:var(--c-grey); line-height:1.85; margin-bottom:28px; font-style:normal; font-weight:300; }
.testimonial-stars { display:flex; gap:5px; margin-bottom:16px; }
.testimonial-stars svg { width:20px; height:20px; fill:var(--c-blue); }
.testimonial-footer { display:flex; align-items:center; gap:12px; }
.testimonial-author { font-size:16px; font-weight:600; color:var(--c-white); }
.testimonial-divider { width:1px; height:16px; background:rgba(54,130,174,0.25); }
.testimonial-role { font-size:14px; color:var(--c-grey-dim); }
.testimonial-company { margin-top:6px; }
.testimonial-company a { font-size:13px; color:var(--c-blue); text-decoration:none; transition:color .3s; display:inline-flex; align-items:center; gap:5px; }
.testimonial-company a:hover { color:var(--c-blue-light); }
.testimonial-company a svg { width:12px; height:12px; }
.testimonial-nav { display:flex; align-items:center; gap:16px; margin-top:40px; padding-left:48px; }
.testimonial-dot { width:10px; height:10px; border-radius:0; background:rgba(54,130,174,0.2); border:none; cursor:pointer; padding:0; transition:all .3s var(--ease-smooth); }
.testimonial-dot.active { background:var(--c-blue); width:32px; border-radius:2px; }
.testimonial-arrow { width:40px; height:40px; border-radius:0; border:1px solid rgba(54,130,174,0.2); background:transparent; color:var(--c-grey); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .3s var(--ease-smooth); }
.testimonial-arrow:hover { border-color:var(--c-blue); color:var(--c-blue); background:rgba(54,130,174,0.08); }
.testimonial-arrow svg { width:18px; height:18px; }

/* ============================================
   SUPPORT STRIP
   ============================================ */
.support-strip { padding:48px 0; border-top:1px solid rgba(54,130,174,0.08); border-bottom:1px solid rgba(54,130,174,0.08); background:rgba(54,130,174,0.03); }
.support-strip-inner { display:flex; align-items:center; gap:36px; }
.support-strip-icon { flex-shrink:0; position:relative; width:64px; height:64px; display:flex; align-items:center; justify-content:center; }
.support-strip-icon .heart-pulse { width:36px; height:36px; color:var(--c-blue); animation:heartPulse 2s ease-in-out infinite; position:relative; z-index:2; filter:drop-shadow(0 0 8px rgba(54,130,174,0.4)); }
.support-strip-icon::before,
.support-strip-icon::after { content:''; position:absolute; top:50%; left:50%; translate:-50% -50%; border-radius:50%; border:1.5px solid rgba(54,130,174,0.35); animation:heartRipple 2s ease-out infinite; }
.support-strip-icon::before { width:48px; height:48px; }
.support-strip-icon::after { width:48px; height:48px; animation-delay:0.6s; }
@keyframes heartPulse { 0%,100%{ transform:scale(1); opacity:0.85; } 50%{ transform:scale(1.18); opacity:1; } }
@keyframes heartRipple { 0%{ transform:scale(1); opacity:0.5; } 100%{ transform:scale(1.8); opacity:0; } }
.support-strip-content { flex:1; }
.support-strip-title { font-size:22px; font-weight:700; color:var(--c-white); margin-bottom:10px; }
.support-strip-text { font-size:15px; color:var(--c-grey); line-height:1.75; }
.support-strip-cta { flex-shrink:0; }

/* ============================================
   PAGE HERO (subpages)
   ============================================ */
.page-hero { padding-top:160px; padding-bottom:40px; position:relative; z-index:1; }
.page-hero-title { font-size:clamp(36px,5vw,56px); font-weight:700; color:var(--c-white); line-height:1.15; margin-bottom:20px; }
.page-hero-desc { font-size:18px; color:var(--c-grey); line-height:1.8; max-width:700px; }

/* ============================================
   ABOUT PAGE
   ============================================ */
.about-page-intro { padding:20px 0 60px; position:relative; z-index:1; }
.about-intro-text { font-size:18px; color:var(--c-grey); line-height:1.9; max-width:800px; margin-bottom:20px; }

.founders-section { padding:60px 0; position:relative; z-index:1; }
.founder-block { display:grid; grid-template-columns:1fr 1.4fr; gap:60px; align-items:start; margin-bottom:80px; }
.founder-block:last-child { margin-bottom:0; }
.founder-block.reverse { grid-template-columns:1.4fr 1fr; }
.founder-block.reverse .founder-photo { order:2; }
.founder-block.reverse .founder-text { order:1; }
.founder-photo { position:relative; }
.founder-photo-img { width:100%; aspect-ratio:67/96; object-fit:cover; display:block; border:1px solid rgba(54,130,174,0.1); }
.founder-photo-mobile { display:none; }
.founder-name { font-size:clamp(24px,3vw,32px); font-weight:700; color:var(--c-white); margin-bottom:6px; }
.founder-role { font-size:14px; font-weight:500; color:var(--c-blue); margin-bottom:24px; text-transform:uppercase; letter-spacing:1px; }
.founder-desc { font-size:16px; color:var(--c-grey); line-height:1.9; }
.founder-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.founder-tag { font-size:14px; font-weight:500; color:var(--c-blue); background:rgba(54,130,174,0.08); padding:6px 16px; border:1px solid rgba(54,130,174,0.12); }

.what-we-do-section { padding:60px 0; position:relative; z-index:1; }
.what-we-do-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; margin-top:32px; }
.what-we-do-list { list-style:none; display:flex; flex-direction:column; gap:12px; }
.what-we-do-list li { font-size:16px; color:var(--c-grey); padding-left:24px; position:relative; line-height:1.7; }
.what-we-do-list li::before { content:''; position:absolute; left:0; top:11px; width:10px; height:1px; background:var(--c-blue); }
.what-we-do-text { font-size:16px; color:var(--c-grey); line-height:1.9; }

.how-we-work-section { padding:60px 0; position:relative; z-index:1; }
.how-we-work-text { font-size:17px; color:var(--c-grey); line-height:1.9; max-width:800px; }

.about-contact-section { padding:60px 0; position:relative; z-index:1; }
.about-contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; align-items:start; }


/* ============================================
   404 PAGE
   ============================================ */
.error-page { min-height:100vh; display:flex; align-items:center; justify-content:center; position:relative; z-index:1; padding:120px 0 80px; }
.error-content { text-align:center; max-width:640px; }
.error-number { font-size:clamp(120px,20vw,200px); font-weight:700; color:transparent; line-height:0.9; margin-bottom:24px; background:linear-gradient(180deg, var(--c-blue) 0%, rgba(54,130,174,0.15) 100%); -webkit-background-clip:text; background-clip:text; position:relative; letter-spacing:-4px; }
.error-number::after { content:'404'; position:absolute; inset:0; background:linear-gradient(180deg, rgba(54,130,174,0.06) 0%, transparent 60%); -webkit-background-clip:text; background-clip:text; color:transparent; filter:blur(20px); }
.error-compass { width:80px; height:80px; margin:0 auto 32px; position:relative; }
.error-compass svg { width:100%; height:100%; }
.error-compass-needle { transform-origin:center; animation:compassSpin 8s ease-in-out infinite; }
@keyframes compassSpin {
    0%,100% { transform:rotate(-20deg); }
    25% { transform:rotate(45deg); }
    50% { transform:rotate(-35deg); }
    75% { transform:rotate(15deg); }
}
.error-title { font-size:clamp(22px,3vw,28px); font-weight:700; color:var(--c-white); margin-bottom:16px; }
.error-desc { font-size:17px; color:var(--c-grey); line-height:1.8; margin-bottom:40px; }
.error-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.error-divider { width:40px; height:1px; background:linear-gradient(90deg, transparent, var(--c-blue), transparent); margin:0 auto 32px; }
.error-coordinates { font-size:12px; color:var(--c-grey-dim); font-variant-numeric:tabular-nums; letter-spacing:2px; margin-top:48px; }

/* ============================================
   LEGAL PAGE
   ============================================ */
.legal-content-section { padding:20px 0 60px; position:relative; z-index:1; }
.legal-content { max-width:800px; }
.legal-content h2 { font-size:20px; font-weight:700; color:var(--c-white); margin-top:40px; margin-bottom:16px; }
.legal-content p { font-size:16px; color:var(--c-grey); line-height:1.9; margin-bottom:16px; }
.legal-content ul { list-style:none; margin-bottom:16px; }
.legal-content ul li { font-size:16px; color:var(--c-grey); line-height:1.9; padding-left:20px; position:relative; }
.legal-content ul li::before { content:''; position:absolute; left:0; top:12px; width:6px; height:1px; background:var(--c-blue); }

/* ============================================
   CONTACT PAGE
   ============================================ */
.contact-content-section { padding:40px 0 60px; position:relative; z-index:1; }
.contact-page-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; align-items:start; }
.contact-page-info { display:flex; flex-direction:column; gap:40px; }
.contact-block-label { font-size:13px; font-weight:600; color:var(--c-blue); text-transform:uppercase; letter-spacing:2px; margin-bottom:16px; }
.contact-block-text { font-size:15px; color:var(--c-grey); line-height:1.8; }

/* ============================================
   CONTACT
   ============================================ */
.contact-section { padding:60px 0; }
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; align-items:start; }
.contact-info h2 { font-size:clamp(30px,3.5vw,42px); font-weight:700; color:var(--c-white); line-height:1.2; margin-bottom:20px; }
.contact-info p { font-size:17px; color:var(--c-grey); line-height:1.8; margin-bottom:40px; }
.contact-detail { display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.contact-detail-icon { width:48px; height:48px; border-radius:0; background:rgba(54,130,174,0.1); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-detail-icon svg { width:22px; height:22px; stroke:var(--c-blue); fill:none; stroke-width:1.8; }
.contact-detail-text a { font-size:16px; color:var(--c-white); font-weight:500; transition:color .3s; }
.contact-detail-text a:hover { color:var(--c-blue); }
.contact-detail-text span { display:block; font-size:13px; color:var(--c-grey-dim); margin-top:2px; }
.contact-form { padding:48px; background:rgba(8,20,34,0.45); border:1px solid rgba(54,130,174,0.1); border-radius:0; backdrop-filter:blur(6px); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.form-group { margin-bottom:20px; }
.form-row .form-group { margin-bottom:0; }
.form-group label { display:block; font-size:14px; font-weight:500; color:var(--c-grey); margin-bottom:8px; }
.form-group label .required { color:var(--c-blue); }
.form-group input,.form-group textarea { width:100%; padding:14px 18px; background:rgba(3,6,9,0.6); border:1px solid rgba(214,211,211,0.1); border-radius:0; color:var(--c-white); font-family:var(--font); font-size:15px; transition:border-color .3s var(--ease-smooth),box-shadow .3s var(--ease-smooth); outline:none; }
.form-group input::placeholder,.form-group textarea::placeholder { color:var(--c-grey-dim); }
.form-group input:focus,.form-group textarea:focus { border-color:var(--c-blue); box-shadow:0 0 0 3px rgba(54,130,174,0.15); }
.form-group textarea { resize:vertical; min-height:130px; }
.form-submit { width:100%; padding:16px; background:var(--c-blue); color:var(--c-white-pure); font-family:var(--font); font-size:16px; font-weight:600; border:none; border-radius:0; cursor:pointer; transition:all .4s var(--ease-out); display:flex; align-items:center; justify-content:center; gap:10px; }
.form-submit:hover { background:var(--c-blue-light); transform:translateY(-2px); box-shadow:0 12px 40px rgba(54,130,174,0.3); }
.form-submit svg { width:18px; height:18px; transition:transform .3s var(--ease-out); }
.form-submit:hover svg { transform:translateX(4px); }
.form-consent { font-size:12px; color:var(--c-grey-dim); line-height:1.6; margin-top:16px; }
.form-consent a { color:var(--c-blue); text-decoration:underline; transition:color .3s; }
.form-consent a:hover { color:var(--c-blue-light); }

/* ============================================
   FOOTER
   ============================================ */
.site-footer { padding:60px 0 40px; border-top:1px solid rgba(54,130,174,0.08); position:relative; z-index:1; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:60px; margin-bottom:48px; }
.footer-brand p { font-size:15px; color:var(--c-grey-dim); line-height:1.7; margin-top:16px; max-width:320px; }
.footer-heading { font-size:15px; font-weight:600; color:var(--c-white); margin-bottom:20px; }
.footer-links { list-style:none; display:flex; flex-direction:column; gap:12px; }
.footer-links a { font-size:15px; color:var(--c-grey-dim); transition:color .3s,transform .3s; display:inline-block; }
.footer-links a:hover { color:var(--c-blue); transform:translateX(4px); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:32px; border-top:1px solid rgba(214,211,211,0.06); }
.footer-bottom p { font-size:13px; color:var(--c-grey-dim); }
.footer-founders { font-size:12px; color:var(--c-grey-dim); line-height:1.7; }

/* ============================================
   LOADER
   ============================================ */
.loader { position:fixed; inset:0; background:var(--c-black); z-index:10000; display:flex; align-items:center; justify-content:center; transition:opacity .6s var(--ease-out),visibility .6s; }
.loader.hidden { opacity:0; visibility:hidden; }
.loader-inner { display:flex; gap:6px; }
.loader-dot { width:10px; height:10px; border-radius:0; background:var(--c-blue); animation:loaderPulse 1.4s ease-in-out infinite; }
.loader-dot:nth-child(2){animation-delay:.2s} .loader-dot:nth-child(3){animation-delay:.4s}
@keyframes loaderPulse { 0%,80%,100%{transform:scale(.6);opacity:.3} 40%{transform:scale(1);opacity:1} }

/* ============================================
   RESPONSIVE
   ============================================ */
@media(max-width:1024px){.about-grid,.web-grid,.contact-grid,.contact-page-grid,.about-contact-grid{grid-template-columns:1fr;gap:48px}.web-image-wrap{order:0}.services-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr;gap:40px}.founder-block,.founder-block.reverse{grid-template-columns:1fr;gap:36px}.founder-block.reverse .founder-photo{order:-1}.founder-block.reverse .founder-text{order:0}.what-we-do-grid{grid-template-columns:1fr}}
@media(max-width:768px){
    :root{--px-desktop:var(--px-mobile)}
    .menu-toggle{display:flex}.main-nav{display:none}.mobile-nav{display:flex}
    .hero{min-height:auto;padding-top:120px;padding-bottom:60px}
    .page-hero{padding-top:120px;padding-bottom:30px}
    .contact-page-grid{gap:40px}
    .about-contact-grid{gap:40px}
    .founder-block{margin-bottom:50px}
    .founder-photo-img{display:none}
    .founder-photo-mobile{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid rgba(54,130,174,0.1)}
    .hero-services{display:inline-flex;flex-direction:column;align-items:stretch}
    .hero-service-tag{font-size:17px;padding:12px 22px}
    .hero-service-tag svg,.hero-service-tag img{width:20px;height:20px}
    .hero-cta-group{flex-direction:column;align-items:stretch}
    .btn-primary,.btn-secondary{justify-content:center;text-align:center}
    .hero-orb{display:none}
    .about-section{padding:50px 0}
    .services-section{padding:50px 0}
    .stats-section{padding:50px 0;margin:50px 0}
    .stats-grid{grid-template-columns:1fr;gap:14px}
    .stat-card{padding:24px 16px}
    .stat-card:not(:last-child)::after{right:auto;top:auto;bottom:0;left:15%;height:1px;width:70%;background:linear-gradient(90deg, transparent, rgba(54,130,174,0.2) 50%, transparent)}
    .web-section{padding:50px 0}
    .testimonials-section{padding:50px 0}
    .contact-section{padding:50px 0}
    .services-grid{grid-template-columns:1fr}
    .services-header{margin-bottom:40px}
    .form-row{grid-template-columns:1fr}
    .contact-form{padding:28px 20px}
    .testimonial-inner{padding:0 0 0 20px}
    .testimonials-header{margin-bottom:40px}
    .testimonial-quote-mark{font-size:48px;margin-bottom:8px}
    .testimonial-text{font-size:15px;line-height:1.75;margin-bottom:20px}
    .testimonial-stars svg{width:16px;height:16px}
    .testimonial-stars{margin-bottom:12px}
    .testimonial-author{font-size:14px}
    .testimonial-role{font-size:12px}
    .testimonial-company a{font-size:12px}
    .testimonial-nav{padding-left:20px;margin-top:28px;gap:12px}
    .testimonial-arrow{width:36px;height:36px}
    .testimonial-arrow svg{width:16px;height:16px}
    .support-strip{padding:36px 0}
    .support-strip-inner{flex-direction:column;text-align:center;gap:24px}
    .support-strip-title{font-size:18px}
    .support-strip-text{font-size:14px}
    .footer-grid{grid-template-columns:1fr;gap:28px}
    .footer-bottom{flex-direction:column;gap:16px;text-align:center}
    .site-footer{padding:48px 0 32px}
    .scroll-indicator{display:none}
    .section-title{font-size:clamp(26px,6vw,36px)}
    .floating-badge{right:12px;bottom:-16px;padding:14px 20px}
    .floating-badge .badge-number{font-size:26px}
    .about-grid{gap:36px}
    .web-grid{gap:40px}
    .contact-grid{gap:40px}
}
@media(max-width:480px){body{font-size:15px}.hero-title{font-size:clamp(28px,7.5vw,38px)}.hero{padding-top:100px;padding-bottom:50px}}

/* ============================================
   COOKIE CONSENT BANNER
   ============================================ */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.cookie-consent{
    position:fixed;bottom:0;left:0;right:0;z-index:10000;
    background:rgba(5,13,22,0.97);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    border-top:1px solid rgba(54,130,174,0.15);
    transform:translateY(100%);
    transition:transform 0.5s var(--ease-out),opacity 0.4s ease;
    opacity:0;
    padding:0;
}
.cookie-consent.visible{transform:translateY(0);opacity:1}
.cookie-consent.hidden{transform:translateY(100%);opacity:0;pointer-events:none}

.cookie-consent-inner{
    max-width:var(--max-w);
    margin:0 auto;
    padding:20px var(--px-desktop);
    display:flex;
    align-items:center;
    gap:24px;
}

.cookie-consent-text{flex:1;min-width:0}
.cookie-consent-text p{
    font-size:14px;line-height:1.6;color:var(--c-grey);margin:0;
}
.cookie-consent-text a{
    color:var(--c-blue-light);text-decoration:underline;
    transition:color 0.3s;
}
.cookie-consent-text a:hover{color:var(--c-white)}

.cookie-consent-actions{
    display:flex;gap:10px;flex-shrink:0;
}

.cookie-btn{
    font-family:var(--font);font-size:14px;font-weight:500;
    padding:10px 20px;border-radius:8px;
    cursor:pointer;transition:all 0.3s ease;
    border:none;white-space:nowrap;
    line-height:1.4;
}
.cookie-btn-accept{
    background:var(--c-blue);color:var(--c-white-pure);
}
.cookie-btn-accept:hover{background:var(--c-blue-light)}

.cookie-btn-reject{
    background:transparent;color:var(--c-grey);
    border:1px solid rgba(214,211,211,0.25);
}
.cookie-btn-reject:hover{border-color:var(--c-grey);color:var(--c-white)}

.cookie-btn-settings{
    background:transparent;color:var(--c-grey);
    border:1px solid rgba(214,211,211,0.25);
}
.cookie-btn-settings:hover{border-color:var(--c-grey);color:var(--c-white)}

/* Detail panel */
.cookie-consent-detail{
    max-height:0;overflow:hidden;
    transition:max-height 0.45s var(--ease-out),padding 0.3s ease;
}
.cookie-consent-detail.open{
    max-height:600px;
    overflow-y:auto;
}

.cookie-detail-inner{
    max-width:var(--max-w);
    margin:0 auto;
    padding:0 var(--px-desktop) 20px;
}

.cookie-category{
    padding:16px 0;
    border-top:1px solid rgba(214,211,211,0.08);
}
.cookie-category:first-child{border-top:1px solid rgba(214,211,211,0.12)}

.cookie-category-header{
    display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
}

.cookie-category-info{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.cookie-category-info strong{
    font-size:15px;font-weight:600;color:var(--c-white);
}
.cookie-category-desc{
    font-size:13px;line-height:1.55;color:var(--c-grey-dim);
}

/* Cookie list table (collapsed by default) */
.cookie-list{
    max-height:0;overflow:hidden;
    transition:max-height 0.35s var(--ease-out);
    margin-top:0;
}
.cookie-list.open{
    max-height:300px;
    margin-top:12px;
}
.cookie-list-toggle{
    display:inline-flex;align-items:center;gap:4px;
    background:none;border:none;cursor:pointer;
    font-family:var(--font);font-size:12px;color:var(--c-blue-light);
    padding:4px 0;margin-top:4px;
    transition:color 0.3s;
}
.cookie-list-toggle:hover{color:var(--c-white)}
.cookie-list-toggle svg{
    transition:transform 0.3s ease;
}
.cookie-list-toggle[aria-expanded="true"] svg{
    transform:rotate(180deg);
}
.cookie-list-toggle[aria-expanded="true"]::first-line{
    content:'Skrýt cookies';
}
.cookie-table{
    width:100%;border-collapse:collapse;font-size:12px;line-height:1.5;
}
.cookie-table th{
    text-align:left;padding:6px 10px;
    color:var(--c-grey-dim);font-weight:500;
    border-bottom:1px solid rgba(214,211,211,0.1);
    white-space:nowrap;
}
.cookie-table td{
    padding:6px 10px;color:var(--c-grey);
    border-bottom:1px solid rgba(214,211,211,0.05);
}
.cookie-table td:first-child{
    font-family:monospace;font-size:11px;color:var(--c-blue-light);white-space:nowrap;
}

.cookie-toggle-wrap{flex-shrink:0;display:flex;align-items:center;padding-top:2px}

.cookie-always-on{
    font-size:12px;font-weight:500;color:var(--c-blue-light);
    background:rgba(54,130,174,0.12);
    padding:4px 12px;border-radius:20px;white-space:nowrap;
}

/* Toggle switch */
.cookie-toggle{
    position:relative;display:inline-block;width:44px;height:24px;cursor:pointer;
}
.cookie-toggle input{opacity:0;width:0;height:0;position:absolute}
.cookie-toggle-slider{
    position:absolute;inset:0;
    background:rgba(214,211,211,0.15);
    border-radius:24px;
    transition:background 0.3s ease;
}
.cookie-toggle-slider::before{
    content:'';position:absolute;
    width:18px;height:18px;left:3px;bottom:3px;
    background:var(--c-grey);border-radius:50%;
    transition:transform 0.3s ease,background 0.3s ease;
}
.cookie-toggle input:checked + .cookie-toggle-slider{
    background:var(--c-blue);
}
.cookie-toggle input:checked + .cookie-toggle-slider::before{
    transform:translateX(20px);background:var(--c-white-pure);
}
.cookie-toggle input:focus-visible + .cookie-toggle-slider{
    outline:2px solid var(--c-blue-light);outline-offset:2px;
}

.cookie-detail-actions{
    padding-top:16px;display:flex;justify-content:flex-end;
}

/* Mobile */
@media(max-width:768px){
    .cookie-consent-inner{
        flex-direction:column;align-items:stretch;
        padding:18px var(--px-mobile);gap:16px;
    }
    .cookie-consent-actions{
        flex-direction:row;justify-content:stretch;
    }
    .cookie-consent-actions .cookie-btn{flex:1;text-align:center;padding:10px 12px;font-size:13px}
    .cookie-detail-inner{padding:0 var(--px-mobile) 18px}
    .cookie-category-header{gap:14px}
    .cookie-table th:nth-child(3),.cookie-table td:nth-child(3){display:none}
}
@media(max-width:480px){
    .cookie-consent-actions{flex-wrap:wrap}
    .cookie-consent-actions .cookie-btn{flex:1 1 calc(50% - 5px);min-width:0}
    .cookie-consent-actions .cookie-btn-settings{order:-1;flex:1 1 100%}
}

/* ============================================
   SKIP-TO-CONTENT & SR-ONLY
   ============================================ */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.sr-only-focusable:focus { position:fixed; top:8px; left:8px; z-index:100000; width:auto; height:auto; padding:12px 24px; margin:0; overflow:visible; clip:auto; white-space:normal; background:var(--c-blue); color:var(--c-white-pure); font-family:var(--font); font-size:16px; font-weight:600; text-decoration:none; outline:3px solid var(--c-white-pure); outline-offset:2px; }

/* ============================================
   FOCUS STYLES (WCAG 2.4.7)
   ============================================ */
.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.form-submit:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.main-nav a:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:4px; }
.main-nav .nav-cta:focus-visible { outline:2px solid var(--c-white); outline-offset:3px; }
.menu-toggle:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.web-carousel-arrow:focus-visible,
.testimonial-arrow:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:2px; }
.testimonial-dot:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.mobile-nav-link:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:4px; }
.mobile-nav-close:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.cookie-btn:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:2px; }
.cookie-toggle input:focus-visible + .cookie-toggle-slider { outline:2px solid var(--c-blue-light); outline-offset:2px; }
.footer-links a:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.hero-service-tag:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }

/* ============================================
   FORM FIELD ERRORS & STATUS
   ============================================ */
.form-field-error { display:block; font-size:13px; color:#e74c3c; margin-top:6px; min-height:0; }
.form-status { margin-top:16px; padding:0; font-size:14px; line-height:1.6; border-radius:0; transition:all .3s var(--ease-smooth); }
.form-status:empty { display:none; }
.form-status-error { display:block; padding:14px 18px; background:rgba(231,76,60,0.1); border:1px solid rgba(231,76,60,0.25); color:#e74c3c; }
.form-status-success { display:block; padding:14px 18px; background:rgba(39,174,96,0.1); border:1px solid rgba(39,174,96,0.25); color:#27ae60; }

/* ============================================
   UTILITY CLASSES (replacing inline styles)
   ============================================ */
.text-highlight { color:var(--c-white); }
.label-optional { color:var(--c-grey-dim); font-weight:400; }
.contact-detail-icon-lg { width:56px; height:56px; }
.contact-detail-icon-lg svg { width:26px; height:26px; }
.contact-detail-email { font-size:18px; }
.contact-detail-subtitle { display:block; font-size:14px; color:#D6D3D3; }
.footer-bottom a { color:var(--c-grey-dim); text-decoration:underline; transition:color .3s; }
.footer-bottom a:hover { color:var(--c-blue-light); }
.testimonial-dots { display:flex; gap:8px; margin-left:8px; }
.mt-16 { margin-top:16px; }
.mt-32 { margin-top:32px; }
.mt-40 { margin-top:40px; }
.mb-24 { margin-bottom:24px; }
.mb-32 { margin-bottom:32px; }
.mb-48 { margin-bottom:48px; }
/* ============================================
   LANGUAGE SWITCHER
   ============================================ */
.lang-switch { display:flex; align-items:center; gap:0; }
.lang-switch a { font-size:13px; font-weight:500; padding:4px 8px; color:var(--c-grey-dim); text-decoration:none; transition:color .3s var(--ease-smooth); position:relative; }
.lang-switch a::after { content:''; position:absolute; bottom:0; left:50%; width:0; height:1.5px; background:var(--c-blue); border-radius:0; transform:translateX(-50%); transition:width .3s var(--ease-out); }
.lang-switch a.active { color:var(--c-white); }
.lang-switch a.active::after { width:16px; }
.lang-switch a:hover { color:var(--c-white); }
.lang-switch a:hover::after { width:16px; }
.lang-switch a:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.lang-switch-sep { width:1px; height:14px; background:rgba(214,211,211,0.15); }
.mobile-nav-lang { display:flex; align-items:center; gap:0; margin-bottom:8px; padding-bottom:20px; border-bottom:1px solid rgba(54,130,174,0.1); opacity:0; transform:translateY(-10px); transition:opacity .4s var(--ease-out) .2s, transform .4s var(--ease-out) .2s; }
.mobile-nav-lang a { font-size:15px; font-weight:500; padding:4px 10px; color:var(--c-grey-dim); text-decoration:none; transition:color .3s; }
.mobile-nav-lang a.active { color:var(--c-white); }
.mobile-nav-lang a:focus-visible { outline:2px solid var(--c-blue-light); outline-offset:3px; }
.mobile-nav-lang .lang-switch-sep { height:16px; }