/*# General Style */
        :root{
            color-scheme:light;
            --ink:#111827;
            --paper:#F8F9FB;
            --surface:#FFFFFF;
            --soft:#FFF1F2;
            --line:#E5E7EB;
            --muted:#6B7280;
            --red:#D90429;
            --red-deep:#D90429;
            --acid:#D90429;
            --red-soft:#FFF1F2;
            --red-soft-strong:#FFE4E8;
            --red-soft-border:rgba(217,4,41,.18);
            --green:#22c55e;
            --night:#111827;
            --night-soft:#17171F;
            --device:#101010;
            --hero-wash-strong:rgba(248,249,251,.94);
            --hero-wash-soft:rgba(248,249,251,.78);
            --grid-line:rgba(217,4,41,.08);
            --shadow:0 26px 70px rgba(16,16,16,.16);
            --primary:#D90429;
            --primary-dark:#B10322;
            --primary-soft:#FFF1F2;
            --accent:#D90429;
            --bg:#F8F9FB;
            --surface-2:#FFF1F2;
            --text:#111827;
            --success:#22c55e;
            --danger:#D90429;
            --shadow-sm:0 8px 24px rgba(16,24,40,.05);
            --shadow-md:0 20px 45px rgba(16,24,40,.08);
            --radius-xl:32px;
            --radius-lg:24px;
            --radius-md:18px;
            --radius-sm:14px;
            --container:1280px;
        }

        :root[data-theme="dark"]{
            color-scheme:dark;
            --ink:#F9FAFB;
            --paper:#0D0D12;
            --surface:#17171F;
            --soft:#1F1F29;
            --line:#2A2A35;
            --muted:#9CA3AF;
            --red:#D90429;
            --red-deep:#D90429;
            --acid:#D90429;
            --red-soft:#2A1820;
            --red-soft-strong:#351B24;
            --red-soft-border:rgba(217,4,41,.34);
            --green:#22c55e;
            --night:#12121A;
            --night-soft:#17171F;
            --device:#050505;
            --hero-wash-strong:rgba(13,13,18,.94);
            --hero-wash-soft:rgba(13,13,18,.78);
            --grid-line:rgba(217,4,41,.14);
            --shadow:0 26px 70px rgba(0,0,0,.34);
            --primary:#D90429;
            --primary-dark:#D90429;
            --primary-soft:#2A1820;
            --accent:#D90429;
            --bg:#0D0D12;
            --surface-2:#1F1F29;
            --text:#F9FAFB;
            --success:#22c55e;
            --danger:#FF6B6B;
            --shadow-sm:0 8px 24px rgba(0,0,0,.24);
            --shadow-md:0 20px 45px rgba(0,0,0,.34);
        }

        *{box-sizing:border-box}
        html{scroll-behavior:smooth}

        body{
            margin:0;
            color:var(--ink);
            background:var(--paper);
            font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            overflow-x:hidden;
        }

        body.loading{overflow:hidden}
        a{color:inherit;text-decoration:none}
        img{display:block;max-width:100%}
        button{font:inherit}

        .page{
            max-width:var(--container);
            margin:0 auto;
            padding:28px 20px 48px;
        }

        .loader{
            position:fixed;
            inset:0;
            z-index:9999;
            display:grid;
            place-items:center;
            padding:24px;
            background:
                radial-gradient(circle at 18% 18%, rgba(217,4,41,.24), transparent 32%),
                radial-gradient(circle at 82% 24%, rgba(217,4,41,.14), transparent 28%),
                var(--paper);
            color:var(--ink);
            transition:opacity .36s ease, visibility .36s ease;
        }

        .loader.hidden{
            opacity:0;
            visibility:hidden;
            pointer-events:none;
        }

        .loader-box{
            width:min(390px, 100%);
            display:grid;
            justify-items:center;
            gap:18px;
            text-align:center;
        }

        .loader-mark{
            position:relative;
            width:76px;
            height:76px;
            display:grid;
            place-items:center;
            border-radius:24px;
            background:linear-gradient(145deg, rgba(255,255,255,.9), rgba(255,241,242,.72));
            border:1px solid rgba(217,4,41,.16);
            box-shadow:0 24px 70px rgba(217,4,41,.2);
        }

        :root[data-theme="dark"] .loader-mark{
            background:linear-gradient(145deg, rgba(31,31,41,.96), rgba(42,24,32,.9));
            border-color:rgba(217,4,41,.28);
            box-shadow:0 28px 80px rgba(0,0,0,.4);
        }

        .loader-mark::before{
            content:"";
            position:absolute;
            inset:-8px;
            border-radius:28px;
            border:2px solid rgba(217,4,41,.12);
            border-top-color:rgb(217 4 41);
            animation:spin 1s linear infinite;
        }

        .loader-mark img{
            width:54px;
            height:54px;
            object-fit:contain;
        }

        .loader-title{
            margin:0;
            font-size:25px;
            line-height:1;
            font-weight:950;
            letter-spacing:0;
        }

        .loader-title span{
            color:var(--red);
        }

        .loader-copy{
            margin:0;
            color:var(--muted);
            font-size:14px;
            line-height:1.6;
            font-weight:760;
        }

        .loader-line{
            width:min(220px, 84vw);
            height:5px;
            border-radius:999px;
            overflow:hidden;
            background:rgba(217,4,41,.13);
        }

        .loader-line span{
            display:block;
            width:46%;
            height:100%;
            border-radius:999px;
            background:linear-gradient(90deg, rgb(217 4 41), rgb(255 90 114), rgb(255 194 204));
            animation:load 1.12s ease-in-out infinite;
        }

        .progress{
            position:fixed;
            top:0;
            left:0;
            z-index:9998;
            width:100%;
            height:3px;
            transform-origin:left;
            transform:scaleX(0);
            background:linear-gradient(90deg, rgb(217 4 41), rgb(255 90 114), rgb(255 194 204));
            box-shadow:0 0 20px rgba(217,4,41,.45);
            pointer-events:none;
        }

        .site-header{
            position:sticky;
            top:0;
            z-index:50;
            padding:22px 20px;
            background:linear-gradient(180deg, color-mix(in srgb, var(--paper) 92%, transparent), color-mix(in srgb, var(--paper) 72%, transparent));
            backdrop-filter:blur(18px);
            border-bottom:1px solid color-mix(in srgb, var(--line) 72%, transparent);
        }

        .nav{
            max-width:1160px;
            margin:0 auto;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            position:relative;
        }

        .brand{
            display:inline-flex;
            align-items:center;
            gap:10px;
            min-height:46px;
            padding:0;
            font-weight:950;
        }

        .brand .brand-word{
            color:var(--ink);
            font-size:24px;
            line-height:1;
            letter-spacing:0;
            text-shadow:none;
        }

        :root[data-theme="dark"] .brand .brand-word{
            color:#fff;
        }

        .brand .brand-word > span{
            color:var(--red);
            text-shadow:none;
        }

        .nav-links{
            display:flex;
            align-items:center;
            gap:18px;
        }

        .nav-links a{
            min-height:36px;
            display:inline-flex;
            align-items:center;
            border-radius:8px;
            padding:0;
            color:var(--ink);
            font-size:13px;
            font-weight:900;
        }

        .nav-links a:hover{
            color:var(--red);
            background:transparent;
        }

        .nav-links > .nav-mobile-socials{
            display:none !important;
        }

        .menu-toggle{
            display:none;
            width:42px;
            min-height:42px;
            border:1px solid var(--line);
            border-radius:8px;
            padding:0;
            background:var(--surface);
            color:var(--ink);
            cursor:pointer;
            position:relative;
            overflow:hidden;
            transition:transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
        }

        .menu-toggle:hover{
            transform:translateY(-2px);
            border-color:var(--red);
            box-shadow:0 14px 30px rgba(217,4,41,.14);
        }

        .menu-toggle-icon{
            position:relative;
            width:18px;
            height:14px;
            display:block;
        }

        .menu-toggle-icon span{
            position:absolute;
            left:0;
            width:100%;
            height:2px;
            border-radius:999px;
            background:currentColor;
            transition:transform .24s ease, opacity .18s ease, top .24s ease;
        }

        .menu-toggle-icon span:nth-child(1){top:0}
        .menu-toggle-icon span:nth-child(2){top:6px}
        .menu-toggle-icon span:nth-child(3){top:12px}

        .menu-toggle.is-open .menu-toggle-icon span:nth-child(1){
            top:6px;
            transform:rotate(45deg);
        }

        .menu-toggle.is-open .menu-toggle-icon span:nth-child(2){
            opacity:0;
            transform:translateX(8px);
        }

        .menu-toggle.is-open .menu-toggle-icon span:nth-child(3){
            top:6px;
            transform:rotate(-45deg);
        }

        .theme-toggle{
            width:42px;
            min-height:42px;
            border:1px solid var(--line);
            border-radius:8px;
            padding:0;
            display:inline-flex;
            justify-content:center;
            align-items:center;
            background:var(--surface);
            color:var(--ink);
            cursor:pointer;
            transition:transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
        }

        .theme-toggle:hover{
            transform:translateY(-2px);
            border-color:var(--red);
            box-shadow:0 14px 30px rgba(217,4,41,.14);
        }

        .theme-toggle-icon{
            width:22px;
            height:22px;
            display:grid;
            place-items:center;
            color:var(--red);
        }

        .theme-toggle-icon svg{
            grid-area:1 / 1;
            width:20px;
            height:20px;
            transition:opacity .22s ease, transform .22s ease;
        }

        .theme-sun{
            opacity:0;
            transform:scale(.7) rotate(-40deg);
        }

        .theme-moon{
            opacity:1;
            transform:scale(1) rotate(0);
        }

        :root[data-theme="dark"] .theme-sun{
            opacity:1;
            transform:scale(1) rotate(0);
        }

        :root[data-theme="dark"] .theme-moon{
            opacity:0;
            transform:scale(.7) rotate(40deg);
        }

        .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;
        }

        .btn{
            min-height:46px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:9px;
            border:0;
            border-radius:8px;
            padding:0 18px;
            background:var(--red);
            color:#fff;
            font-size:14px;
            font-weight:950;
            cursor:pointer;
            transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
        }

        .btn:hover{
            transform:translateY(-2px);
            box-shadow:0 18px 34px rgba(229,9,47,.24);
        }

        .btn.dark{
            background:var(--night);
            color:#fff;
        }

        .btn.soft{
            background:var(--surface);
            color:var(--ink);
            border:1px solid var(--line);
        }

        .hero{
            position:relative;
            min-height:88svh;
            overflow:hidden;
            display:flex;
            align-items:center;
            background:
                linear-gradient(180deg, var(--hero-wash-strong), var(--hero-wash-soft)),
                linear-gradient(90deg, var(--grid-line) 1px, transparent 1px),
                linear-gradient(180deg, var(--grid-line) 1px, transparent 1px);
            background-size:auto, 42px 42px, 42px 42px;
        }

        .hero-inner{
            width:100%;
            max-width:1160px;
            margin:0 auto;
            padding:54px 20px 78px;
            display:grid;
            grid-template-columns:minmax(0, 1fr) minmax(360px, 470px);
            align-items:center;
            gap:54px;
        }

        .eyebrow{
            width:max-content;
            max-width:100%;
            margin:0 0 16px;
            padding:8px 10px;
            border-radius:8px;
            background:var(--night);
            color:var(--acid);
            font-size:12px;
            font-weight:950;
            letter-spacing:.08em;
            text-transform:uppercase;
            animation:rise .55s ease both .12s;
        }

        .hero-title{
            margin:0;
            max-width:690px;
            font-size:64px;
            line-height:1.02;
            font-weight:950;
            letter-spacing:0;
        }

        .hero-title span{
            display:inline-block;
            opacity:0;
            filter:blur(8px);
            transform:translateY(16px);
            animation:word .65s cubic-bezier(.22,1,.36,1) forwards;
        }

        .hero-title span:nth-child(1){animation-delay:.18s}
        .hero-title span:nth-child(2){animation-delay:.26s}
        .hero-title span:nth-child(3){animation-delay:.34s}
        .hero-title span:nth-child(4){animation-delay:.42s}
        .hero-title span:nth-child(5){animation-delay:.50s}
        .hero-title span:nth-child(6){animation-delay:.58s}
        .hero-title span:nth-child(7){animation-delay:.66s}
        .hero-title span:nth-child(8){animation-delay:.74s}

        .hero-copy{
            max-width:560px;
            margin:20px 0 0;
            color:var(--muted);
            font-size:18px;
            line-height:1.65;
            font-weight:720;
            animation:rise .55s ease both .72s;
        }

        .store-row{
            display:flex;
            flex-wrap:wrap;
            gap:12px;
            margin-top:30px;
            animation:rise .55s ease both .82s;
        }

        .store{
            min-height:60px;
            min-width:176px;
            display:inline-flex;
            align-items:center;
            gap:12px;
            padding:9px 14px;
            border:1px solid var(--red-soft-border);
            border-radius:8px;
            background:linear-gradient(180deg, var(--red-soft), var(--surface));
            box-shadow:0 16px 38px rgba(16,16,16,.08);
            transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
        }

        .store:hover{
            transform:translateY(-2px);
            border-color:var(--red);
            box-shadow:var(--shadow);
        }

        .store-icon{
            width:36px;
            height:36px;
            border-radius:8px;
            display:grid;
            place-items:center;
            background:var(--red);
            color:#fff;
            flex:0 0 auto;
        }

        .store-icon svg{
            width:19px;
            height:19px;
        }

        .store-small{
            display:block;
            color:var(--muted);
            font-size:11px;
            line-height:1;
            font-weight:800;
        }

        .store-name{
            display:block;
            margin-top:5px;
            font-size:16px;
            line-height:1;
            font-weight:950;
        }

        .hero-notes{
            display:flex;
            flex-wrap:wrap;
            gap:9px;
            margin-top:24px;
            animation:rise .55s ease both .92s;
        }

        .hero-note{
            border:1px solid var(--red-soft-border);
            border-radius:8px;
            background:var(--red-soft);
            padding:9px 11px;
            color:var(--ink);
            font-size:13px;
            font-weight:850;
        }

        .hero-visual{
            position:relative;
            min-height:620px;
            perspective:1200px;
            animation:visualIn .8s cubic-bezier(.22,1,.36,1) both .36s;
        }

        .phone{
            position:absolute;
            width:258px;
            padding:9px;
            border:1px solid rgba(216,235,248,.72);
            border-radius:38px;
            background:
                radial-gradient(circle at 18% 12%, rgba(255,255,255,.92) 0 8%, transparent 22%),
                linear-gradient(118deg, rgba(255,255,255,.82) 0%, rgba(175,213,238,.3) 13%, transparent 30%),
                linear-gradient(155deg, #D9ECFA 0%, #84A6BD 24%, #335B76 48%, #B9D5E8 66%, #486D85 100%);
            overflow:visible;
            box-shadow:
                inset 2px 0 5px rgba(255,255,255,.58),
                inset -8px 0 16px rgba(23,55,78,.42),
                inset 0 -18px 34px rgba(20,48,68,.38),
                0 38px 70px rgba(51,91,118,.34),
                0 16px 32px rgba(0,0,0,.24);
        }

        .phone::before{
            content:"";
            position:absolute;
            left:-5px;
            top:84px;
            width:4px;
            height:54px;
            border-radius:6px 0 0 6px;
            background:linear-gradient(180deg, #E8F7FF, #6F93AA 58%, #C6E2F4);
            box-shadow:
                0 70px 0 -1px #6F93AA,
                inset 1px 0 1px rgba(255,255,255,.74),
                -2px 2px 5px rgba(31,49,63,.22);
        }

        .phone::after{
            content:"";
            position:absolute;
            right:-5px;
            top:142px;
            width:4px;
            height:74px;
            border-radius:0 6px 6px 0;
            background:linear-gradient(180deg, #E8F7FF, #6F93AA 58%, #C6E2F4);
            box-shadow:
                inset -1px 0 1px rgba(255,255,255,.74),
                2px 2px 5px rgba(31,49,63,.22);
        }

        .phone img{
            width:100%;
            height:auto;
            border-radius:29px;
            filter:saturate(1.04) contrast(1.02);
            box-shadow:
                0 0 0 1px rgba(15,23,42,.36),
                0 8px 18px rgba(8,25,38,.22),
                inset 0 0 0 1px rgba(255,255,255,.16);
            animation:imageBreath 7s ease-in-out infinite;
        }

        .phone.primary{
            right:82px;
            top:0;
            z-index:3;
            transform:rotate(3deg);
        }

        .phone.secondary{
            left:4px;
            top:92px;
            z-index:2;
            transform:rotate(-8deg) scale(.88);
            opacity:.96;
        }

        .phone.tertiary{
            right:0;
            top:214px;
            z-index:1;
            transform:rotate(10deg) scale(.78);
            opacity:.92;
        }

        .floating-badge{
            position:absolute;
            z-index:5;
            left:44px;
            bottom:72px;
            display:flex;
            align-items:center;
            gap:9px;
            border-radius:8px;
            padding:12px 14px;
            background:var(--night);
            color:#fff;
            box-shadow:0 20px 42px rgba(16,16,16,.24);
            font-size:13px;
            font-weight:950;
            animation:floaty 3s ease-in-out infinite;
        }

        .badge-dot{
            width:10px;
            height:10px;
            border-radius:50%;
            background:var(--green);
            box-shadow:0 0 0 6px rgba(34,197,94,.18);
        }

        .signal-band{
            background:var(--night);
            color:#fff;
            padding:24px 20px;
        }

        .signal-grid{
            max-width:1160px;
            margin:0 auto;
            display:grid;
            grid-template-columns:repeat(4, minmax(0, 1fr));
            gap:12px;
        }

        .signal-card{
            min-height:104px;
            border:1px solid rgba(255,255,255,.1);
            border-radius:8px;
            padding:16px;
            background:rgba(255,255,255,.06);
            position:relative;
            overflow:hidden;
            animation:signalLift 3.2s ease-in-out infinite;
        }

        .signal-card:nth-child(2){animation-delay:.22s}
        .signal-card:nth-child(3){animation-delay:.44s}
        .signal-card:nth-child(4){animation-delay:.66s}

        .signal-card::before{
            content:"";
            position:absolute;
            inset:14px auto auto 14px;
            width:9px;
            height:9px;
            border-radius:50%;
            background:var(--acid);
            box-shadow:0 0 0 0 rgba(217,4,41,.28);
            animation:pingSoft 2.2s ease-out infinite;
        }

        .signal-card strong{
            display:block;
            margin-top:26px;
            font-size:20px;
            line-height:1;
        }

        .signal-card span{
            display:block;
            margin-top:8px;
            color:rgba(255,255,255,.62);
            font-size:13px;
            font-weight:800;
        }

        .section{
            padding:82px 20px;
        }

        .section.dark{
            background:var(--night);
            color:#fff;
        }

        .inner{
            width:100%;
            max-width:1160px;
            margin:0 auto;
        }

        .section-head{
            display:flex;
            align-items:flex-end;
            justify-content:space-between;
            gap:28px;
            margin-bottom:34px;
        }

        .kicker{
            margin:0 0 10px;
            color:var(--red);
            font-size:12px;
            font-weight:950;
            letter-spacing:.08em;
            text-transform:uppercase;
        }

        .dark .kicker{
            color:var(--acid);
        }

        .dark-role .kicker{
            color:var(--acid);
        }

        .section-title{
            margin:0;
            max-width:620px;
            font-size:44px;
            line-height:1.08;
            font-weight:950;
        }

        .section-copy{
            margin:0;
            max-width:430px;
            color:var(--muted);
            font-size:16px;
            line-height:1.65;
            font-weight:720;
        }

        .dark .section-copy{
            color:rgba(255,255,255,.68);
        }

        .screen-strip{
            display:grid;
            grid-template-columns:repeat(4, minmax(0, 1fr));
            gap:16px;
        }

        .screen-card{
            border:1px solid var(--line);
            border-radius:8px;
            background:var(--surface);
            padding:12px;
            box-shadow:0 18px 42px rgba(16,16,16,.08);
            overflow:hidden;
            transition:transform .25s ease, box-shadow .25s ease;
        }

        .screen-card:hover{
            transform:translateY(-6px);
            box-shadow:var(--shadow);
        }

        .screen-card img{
            width:100%;
            border-radius:8px;
            border:1px solid var(--line);
        }

        .screen-card h3{
            margin:14px 4px 4px;
            font-size:18px;
            line-height:1.2;
        }

        .screen-card p{
            margin:0 4px 6px;
            color:var(--muted);
            font-size:13px;
            line-height:1.5;
            font-weight:700;
        }

        .role-stack{
            display:grid;
            gap:0;
        }

        .role-section{
            position:relative;
            display:grid;
            grid-template-columns:minmax(0, 1fr) minmax(420px, 560px);
            gap:54px;
            align-items:center;
            min-height:82svh;
            border-radius:0;
            padding:76px 0;
            background:transparent;
            border:0;
            box-shadow:none;
            overflow:visible;
        }

        .role-section::before{
            content:none;
        }

        .role-section.dark-role{
            position:relative;
            color:var(--ink);
            border-color:transparent;
        }

        .role-section.attendee-role::before{
            content:none;
        }

        .role-section.dark-role::before{
            content:none;
        }

        .role-section.staff-role{
            position:relative;
            background:transparent;
        }

        .role-copy{
            position:relative;
            z-index:2;
            animation:sectionTextFloat 7s ease-in-out infinite;
        }

        .role-copy h3{
            margin:0;
            max-width:690px;
            font-size:62px;
            line-height:1.02;
            font-weight:950;
            letter-spacing:0;
        }

        .role-copy p{
            margin:20px 0 0;
            max-width:560px;
            color:var(--muted);
            font-size:18px;
            line-height:1.65;
            font-weight:720;
        }

        .dark-role .role-copy p{
            color:var(--muted);
        }

        .role-points{
            display:flex;
            flex-wrap:wrap;
            gap:8px;
            margin-top:24px;
        }

        .role-points span{
            border-radius:8px;
            padding:9px 11px;
            background:var(--soft);
            color:var(--ink);
            font-size:12px;
            font-weight:900;
        }

        .dark-role .role-points span{
            background:var(--red-soft);
            color:var(--ink);
        }

        :root[data-theme="dark"] .role-points span,
        :root[data-theme="dark"] .dark-role .role-points span{
            background:linear-gradient(180deg, rgba(217,4,41,.18), rgba(217,4,41,.10));
            border:1px solid rgba(217,4,41,.28);
            color:var(--text);
        }

        .role-screens{
            position:relative;
            min-height:680px;
            perspective:1200px;
        }

        .role-screen{
            position:absolute;
            width:278px;
            padding:9px;
            border:1px solid rgba(216,235,248,.72);
            border-radius:38px;
            overflow:visible;
            background:
                radial-gradient(circle at 18% 12%, rgba(255,255,255,.92) 0 8%, transparent 22%),
                linear-gradient(118deg, rgba(255,255,255,.82) 0%, rgba(175,213,238,.3) 13%, transparent 30%),
                linear-gradient(155deg, #D9ECFA 0%, #84A6BD 24%, #335B76 48%, #B9D5E8 66%, #486D85 100%);
            box-shadow:
                inset 2px 0 5px rgba(255,255,255,.58),
                inset -8px 0 16px rgba(23,55,78,.42),
                inset 0 -18px 34px rgba(20,48,68,.38),
                0 38px 70px rgba(51,91,118,.34),
                0 16px 32px rgba(0,0,0,.24);
            opacity:0;
            transform:rotate(-7deg) scale(.9);
            clip-path:inset(0);
            filter:blur(0);
            transition:
                opacity .62s ease,
                transform .86s cubic-bezier(.22,1,.36,1),
                filter .62s ease,
                clip-path .7s ease;
            animation:screenDrift 6.8s ease-in-out infinite;
        }

        .role-section:not(.phones-visible) .role-screen{
            opacity:0;
            clip-path:inset(14% 0 16% 0);
            filter:blur(12px);
            transform:translateY(52px) rotate(0deg) scale(.78) !important;
            animation:none;
            transition-delay:0s;
        }

        .role-section.phones-visible .role-screen{
            opacity:1;
            clip-path:inset(0);
            filter:blur(0);
            animation:screenDrift 6.8s ease-in-out infinite;
        }

        .role-section.phones-visible .role-screen:nth-child(1){
            transition-delay:.08s;
            animation-delay:.08s;
        }

        .role-section.phones-visible .role-screen:nth-child(2){
            transition-delay:.22s;
            animation-delay:.22s;
        }

        .role-section.phones-visible .role-screen:nth-child(3){
            transition-delay:.36s;
            animation-delay:.36s;
        }

        .role-section.phones-visible .role-screen img{
            animation:imageBreath 7.5s ease-in-out infinite;
        }

        .role-screen::before{
            content:"";
            position:absolute;
            left:-5px;
            top:92px;
            width:4px;
            height:58px;
            border-radius:6px 0 0 6px;
            background:linear-gradient(180deg, #E8F7FF, #6F93AA 58%, #C6E2F4);
            box-shadow:
                0 76px 0 -1px #6F93AA,
                inset 1px 0 1px rgba(255,255,255,.74),
                -2px 2px 5px rgba(31,49,63,.22);
        }

        .role-screen::after{
            content:"";
            position:absolute;
            right:-5px;
            top:150px;
            width:4px;
            height:78px;
            border-radius:0 6px 6px 0;
            background:linear-gradient(180deg, #E8F7FF, #6F93AA 58%, #C6E2F4);
            box-shadow:
                inset -1px 0 1px rgba(255,255,255,.74),
                2px 2px 5px rgba(31,49,63,.22);
        }

        .dark-role .role-screen{
            box-shadow:
                inset 2px 0 5px rgba(255,255,255,.48),
                inset -8px 0 16px rgba(16,42,60,.46),
                inset 0 -18px 34px rgba(16,42,60,.44),
                0 38px 70px rgba(80,129,160,.28),
                0 16px 34px rgba(0,0,0,.38);
        }

        .role-screen:nth-child(1){
            left:3%;
            top:72px;
            z-index:2;
            animation-delay:.15s;
        }

        .role-screen:nth-child(2){
            left:34%;
            top:0;
            z-index:4;
            transform:rotate(3deg);
            animation-delay:.45s;
        }

        .role-screen:nth-child(3){
            right:2%;
            top:118px;
            z-index:3;
            transform:rotate(9deg) scale(.86);
            animation-delay:.75s;
        }

        .role-screen:nth-child(4){
            right:25%;
            bottom:4px;
            z-index:1;
            transform:rotate(-2deg) scale(.78);
            animation-delay:1.05s;
        }

        .role-screen img{
            width:100%;
            border-radius:29px;
            filter:saturate(1.04) contrast(1.02);
            box-shadow:
                0 0 0 1px rgba(15,23,42,.36),
                0 8px 18px rgba(8,25,38,.22),
                inset 0 0 0 1px rgba(255,255,255,.16);
        }

        .staff-role{
            grid-template-columns:minmax(0, 1fr) minmax(420px, 560px);
        }

        .staff-role .role-copy{
            order:2;
        }

        .staff-role .role-screens{
            min-height:680px;
        }

        .staff-role .role-screen{
            width:278px;
        }

        .staff-role .role-screen:nth-child(1){
            left:0;
            top:86px;
            transform:rotate(-4deg);
        }

        .staff-role .role-screen:nth-child(2){
            left:38%;
            top:208px;
            transform:rotate(6deg) scale(.92);
        }

        .staff-role .role-screen:nth-child(3){
            right:-7%;
            top:0;
            transform:rotate(2deg);
        }

        .staff-role .role-screen:nth-child(3)::after{
            content:"";
            position:absolute;
            display:none;
        }

        .attendee-role .role-screen:nth-child(1){
            left:0;
            top:88px;
            transform:rotate(-9deg) scale(.86);
        }

        .attendee-role .role-screen:nth-child(2){
            left:29%;
            top:0;
            transform:rotate(2deg);
        }

        .attendee-role .role-screen:nth-child(3){
            right:4%;
            top:94px;
            transform:rotate(8deg) scale(.9);
        }

        .attendee-role .role-screen:nth-child(4){
            right:28%;
            bottom:6px;
            transform:rotate(-4deg) scale(.78);
        }

        .dark-role .role-screen:nth-child(1){
            left:4%;
            top:98px;
            transform:rotate(-5deg) scale(.9);
        }

        .dark-role .role-screen:nth-child(2){
            left:28%;
            top:34px;
            z-index:5;
            transform:rotate(3deg);
        }

        .dark-role .role-screen:nth-child(3){
            right:3%;
            top:126px;
            z-index:3;
            transform:rotate(7deg) scale(.88);
        }

        .dark-role .role-screen:nth-child(4){
            right:34%;
            bottom:12px;
            transform:rotate(-8deg) scale(.76);
        }

        .split-feature{
            display:grid;
            grid-template-columns:minmax(0, .9fr) minmax(320px, 430px);
            align-items:center;
            gap:60px;
            padding:44px;
            border-radius:8px;
            background:#181818;
            border:1px solid rgba(255,255,255,.10);
        }

        .split-feature + .split-feature{
            margin-top:18px;
        }

        .split-feature:nth-child(even){
            grid-template-columns:minmax(320px, 430px) minmax(0, .9fr);
            background:#211819;
        }

        .split-feature:nth-child(even) .feature-text{
            order:2;
        }

        .feature-text h3{
            margin:0;
            max-width:500px;
            font-size:40px;
            line-height:1.1;
            font-weight:950;
        }

        .feature-text p{
            margin:16px 0 0;
            max-width:480px;
            color:rgba(255,255,255,.7);
            line-height:1.65;
            font-weight:700;
        }

        .feature-points{
            display:grid;
            gap:10px;
            margin-top:24px;
        }

        .feature-points span{
            display:flex;
            align-items:center;
            gap:10px;
            color:#fff;
            font-size:14px;
            font-weight:900;
        }

        .feature-points span::before{
            content:"";
            width:9px;
            height:9px;
            border-radius:50%;
            background:var(--acid);
            flex:0 0 auto;
        }

        .feature-screen{
            max-width:330px;
            margin:0 auto;
            border:10px solid #050505;
            border-radius:34px;
            overflow:hidden;
            background:var(--device);
            box-shadow:0 24px 60px rgba(0,0,0,.34);
        }

        .feature-screen img{
            border-radius:24px;
        }

        .minimal-grid{
            display:grid;
            grid-template-columns:1.1fr .9fr;
            gap:18px;
        }

        .minimal-panel{
            border-radius:8px;
            border:1px solid var(--line);
            background:var(--surface);
            padding:26px;
            box-shadow:0 16px 38px rgba(16,16,16,.07);
        }

        .minimal-panel.red{
            background:var(--red);
            color:#fff;
            border-color:var(--red);
        }

        .minimal-panel.black{
            background:var(--night);
            color:#fff;
            border-color:var(--ink);
        }

        .minimal-panel h3{
            margin:0;
            font-size:30px;
            line-height:1.15;
            font-weight:950;
        }

        .minimal-panel p{
            margin:14px 0 0;
            color:var(--muted);
            line-height:1.65;
            font-weight:700;
        }

        .minimal-panel.red p,
        .minimal-panel.black p{
            color:rgba(255,255,255,.72);
        }

        .mini-metrics{
            display:grid;
            grid-template-columns:repeat(3, 1fr);
            gap:10px;
            margin-top:24px;
        }

        .metric{
            min-height:92px;
            border-radius:8px;
            display:flex;
            flex-direction:column;
            justify-content:center;
            background:var(--soft);
            padding:14px;
        }

        .metric strong{
            font-size:24px;
            line-height:1;
        }

        .metric span{
            margin-top:8px;
            color:var(--muted);
            font-size:12px;
            font-weight:850;
        }

        .gallery{
            display:grid;
            grid-template-columns:repeat(5, 1fr);
            gap:14px;
            align-items:start;
        }

        .gallery .phone-frame{
            border:8px solid var(--device);
            border-radius:28px;
            background:var(--night);
            overflow:hidden;
            box-shadow:0 18px 44px rgba(16,16,16,.14);
        }

        .gallery .phone-frame:nth-child(even){
            margin-top:34px;
        }

        .gallery img{
            border-radius:20px;
        }

        .faq{
            max-width:880px;
            margin:0 auto;
        }

        .faq-item{
            border-bottom:1px solid rgba(255,255,255,.12);
        }

        .faq-button{
            width:100%;
            min-height:76px;
            border:0;
            background:transparent;
            color:#fff;
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:18px;
            text-align:left;
            cursor:pointer;
            font-size:19px;
            font-weight:950;
        }

        .faq-icon{
            width:31px;
            height:31px;
            border-radius:8px;
            display:grid;
            place-items:center;
            background:rgba(255,255,255,.1);
            color:var(--acid);
            flex:0 0 auto;
            transition:transform .24s ease;
        }

        .faq-item.open .faq-icon{
            transform:rotate(45deg);
        }

        .faq-answer{
            max-height:0;
            overflow:hidden;
            transition:max-height .28s ease;
        }

        .faq-answer p{
            margin:0;
            padding:0 52px 24px 0;
            color:rgba(255,255,255,.68);
            line-height:1.65;
            font-weight:700;
        }

        .cta{
            padding:74px 20px;
            background:
                linear-gradient(90deg, rgba(16,16,16,.93), rgba(16,16,16,.76)),
                url('../../uploads/landing/home.png') center 18% / cover;
            color:#fff;
        }

        .cta-box{
            max-width:1160px;
            min-height:310px;
            margin:0 auto;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:28px;
        }

        .cta h2{
            margin:0;
            max-width:660px;
            font-size:50px;
            line-height:1.08;
            font-weight:950;
        }

        .cta p{
            margin:15px 0 0;
            max-width:520px;
            color:rgba(255,255,255,.72);
            font-size:17px;
            line-height:1.6;
            font-weight:720;
        }

        .cta .btn{
            min-width:142px;
            min-height:54px;
            height:auto;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            padding:0 24px;
            border-radius:8px;
            line-height:1;
            white-space:nowrap;
            text-align:center;
            background:linear-gradient(135deg, rgb(217 4 41), rgb(255 90 114));
            color:#fff;
            box-shadow:0 18px 36px rgba(217,4,41,.24);
        }

        .footer{
            background:var(--night);
            color:#fff;
            border-top:1px solid rgba(255,255,255,.1);
            padding:46px 20px 30px;
        }

        .footer-inner{
            max-width:1160px;
            margin:0 auto;
            display:grid;
            grid-template-columns:minmax(260px, 1.3fr) repeat(auto-fit, minmax(120px, .6fr));
            gap:22px;
        }

        .footer h2{
            margin:0;
            font-size:26px;
            line-height:1;
            font-weight:900;
            letter-spacing:-.03em;
        }

        .footer-brand{
            display:inline-flex;
            align-items:center;
            gap:10px;
            margin-bottom:10px;
        }

        .footer-brand h2{
            margin:0;
        }

        .footer-brand h2 span{
            color:var(--red);
        }

        .footer p{
            margin:0;
            max-width:360px;
            color:rgba(255,255,255,.64);
            line-height:1.6;
            font-weight:700;
        }

        .footer h3{
            margin:0 0 12px;
            color:var(--acid);
            font-size:12px;
            text-transform:uppercase;
            letter-spacing:.08em;
            font-weight:900;
        }

        .footer a{
            display:block;
            width:max-content;
            max-width:100%;
            margin-top:9px;
            color:rgba(255,255,255,.7);
            font-weight:750;
        }

        .footer a:hover{
            color:#fff;
        }

        .footer-socials{
            display:flex;
            flex-wrap:wrap;
            align-items:center;
            gap:9px;
            max-width:260px;
        }

        .footer .footer-socials a{
            display:inline-flex;
            align-items:center;
            justify-content:center;
            width:38px;
            height:38px;
            margin-top:0;
            padding:0;
            border:1px solid rgba(255,255,255,.12);
            border-radius:50%;
            background:rgba(255,255,255,.04);
        }

        .footer .footer-socials svg{
            width:16px;
            height:16px;
            flex:0 0 auto;
        }

        .footer .footer-socials a:hover{
            border-color:rgba(255,255,255,.28);
            background:rgba(255,255,255,.09);
        }

        .copyright{
            max-width:1160px;
            margin:36px auto 0;
            padding-top:20px;
            border-top:1px solid rgba(255,255,255,.1);
            color:rgba(255,255,255,.48);
            font-size:14px;
            font-weight:700;
        }

        .reveal{
            opacity:0;
            transform:translateY(24px);
            transition:opacity .65s ease, transform .65s ease;
        }

        .reveal.visible{
            opacity:1;
            transform:translateY(0);
        }

        @keyframes spin{to{transform:rotate(360deg)}}
        @keyframes load{0%{transform:translateX(-110%)}50%{transform:translateX(72%)}100%{transform:translateX(240%)}}
        @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
        @keyframes word{to{opacity:1;filter:blur(0);transform:translateY(0)}}
        @keyframes visualIn{from{opacity:0;transform:translateY(30px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
        @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
        @keyframes signalLift{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
        @keyframes pingSoft{0%{box-shadow:0 0 0 0 rgba(217,4,41,.26)}100%{box-shadow:0 0 0 18px rgba(217,4,41,0)}}
        @keyframes sectionTextFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
        @keyframes screenDrift{0%,100%{margin-top:0}50%{margin-top:-14px}}
        @keyframes imageReveal{from{opacity:0;clip-path:inset(10% 0 12% 0);filter:blur(8px)}to{opacity:1;clip-path:inset(0);filter:blur(0)}}
        @keyframes imageBreath{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.015)}}
        @keyframes checkoutRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

        @media (max-width:1040px){
            .hero-inner{
                grid-template-columns:1fr;
                gap:32px;
            }

            .hero-visual{
                min-height:560px;
                max-width:560px;
                width:100%;
                margin:0 auto;
            }

            .screen-strip{
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }

            .signal-grid{
                grid-template-columns:repeat(2, minmax(0, 1fr));
            }

            .role-section,
            .role-section:nth-child(even){
                grid-template-columns:1fr;
                min-height:auto;
                padding:62px 0;
            }

            .role-section:nth-child(even) .role-copy{
                order:0;
            }

            .staff-role .role-copy{
                order:0;
            }

            .staff-role .role-screens{
                order:1;
            }

            .role-screens,
            .staff-role .role-screens{
                min-height:auto;
                min-height:520px;
            }

            .split-feature,
            .split-feature:nth-child(even),
            .minimal-grid{
                grid-template-columns:1fr;
            }

            .split-feature:nth-child(even) .feature-text{
                order:0;
            }

            .gallery{
                grid-template-columns:repeat(3, 1fr);
            }

            .footer-inner{
                grid-template-columns:1fr 1fr;
            }
        }

        @media (max-width:720px){
            .site-header{padding:14px 12px}
            .brand{min-height:42px}
            .brand-word{font-size:21px}
            .menu-toggle{display:inline-flex;align-items:center;justify-content:center}
            .nav-links{
                position:fixed;
                top:76px;
                left:12px;
                right:12px;
                width:auto;
                padding:10px 16px;
                border:1px solid var(--red-soft-border);
                border-radius:22px;
                background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--surface-2) 88%, transparent));
                box-shadow:0 26px 70px rgba(16,24,40,.18);
                backdrop-filter:blur(24px);
                display:grid;
                grid-template-columns:1fr;
                gap:0;
                opacity:0;
                visibility:hidden;
                transform:translateY(-16px) scale(.96);
                transform-origin:top center;
                clip-path:inset(0 0 100% 0 round 22px);
                pointer-events:none;
                transition:opacity .28s ease, transform .38s cubic-bezier(.16,1,.3,1), clip-path .42s cubic-bezier(.16,1,.3,1), visibility .28s ease;
            }
            :root[data-theme="dark"] .nav-links{
                box-shadow:0 30px 80px rgba(0,0,0,.46);
            }
            .nav-links.is-open{
                opacity:1;
                visibility:visible;
                transform:translateY(0) scale(1);
                clip-path:inset(0 0 0 0 round 22px);
                pointer-events:auto;
            }
            .nav-links > *{
                opacity:0;
                transform:translateY(12px) scale(.96);
                transition:opacity .28s ease, transform .34s cubic-bezier(.16,1,.3,1), background .22s ease, color .22s ease, border-color .22s ease;
            }
            .nav-links.is-open > *{
                opacity:1;
                transform:translateY(0) scale(1);
            }
            .nav-links.is-open > *:nth-child(1){transition-delay:.03s}
            .nav-links.is-open > *:nth-child(2){transition-delay:.06s}
            .nav-links.is-open > *:nth-child(3){transition-delay:.09s}
            .nav-links.is-open > *:nth-child(4){transition-delay:.12s}
            .nav-links.is-open > *:nth-child(5){transition-delay:.15s}
            .nav-links.is-open > *:nth-child(6){transition-delay:.18s}
            .nav-links.is-open > *:nth-child(7){transition-delay:.21s}
            .nav-links a,
            .nav-links .theme-toggle{
                width:100%;
                min-height:50px;
                border-radius:0;
                justify-content:flex-start;
                padding:0;
            }
            .nav-links a{
                color:var(--text);
                background:transparent;
                border:0;
                border-bottom:1px solid color-mix(in srgb, var(--line) 72%, transparent);
                font-size:15px;
                letter-spacing:-.01em;
            }
            .nav-links a::after{
                content:"";
                width:7px;
                height:7px;
                margin-left:auto;
                border-top:2px solid currentColor;
                border-right:2px solid currentColor;
                transform:rotate(45deg) translateX(-2px);
                opacity:.34;
                transition:transform .22s ease, opacity .22s ease;
            }
            .nav-links a:hover{
                color:var(--primary);
                background:transparent;
                border-color:color-mix(in srgb, var(--primary) 28%, var(--line));
                transform:translateX(4px);
            }
            .nav-links a:hover::after{
                opacity:1;
                transform:rotate(45deg) translate(1px, -1px);
            }
            .nav-links .theme-toggle{
                width:100%;
                justify-content:center;
                padding:0;
                justify-self:stretch;
                margin-top:6px;
                border-radius:14px;
                background:var(--red-soft);
                border-color:var(--red-soft-border);
            }
            .nav-links > .nav-mobile-socials{
                display:grid !important;
                gap:12px;
                margin-top:10px;
                padding:14px;
                width:100%;
                border:1px solid color-mix(in srgb, var(--line) 72%, transparent);
                border-radius:18px;
                background:color-mix(in srgb, var(--surface) 82%, transparent);
                box-sizing:border-box;
            }
            .nav-mobile-socials-title{
                font-size:11px;
                font-weight:900;
                letter-spacing:.12em;
                text-transform:uppercase;
                color:var(--muted);
            }
            .nav-mobile-socials-list{
                display:flex;
                flex-wrap:wrap;
                gap:9px;
                align-items:center;
            }
            .nav-links .nav-mobile-socials a{
                display:inline-flex !important;
                align-items:center;
                justify-content:center;
                width:40px !important;
                min-width:40px;
                max-width:40px;
                min-height:40px !important;
                height:40px !important;
                padding:0 !important;
                border:1px solid var(--red-soft-border) !important;
                border-radius:50% !important;
                color:var(--primary);
                background:var(--surface);
                line-height:0;
                flex:0 0 40px;
                box-sizing:border-box;
            }
            .nav-links .nav-mobile-socials a::after{
                display:none !important;
            }
            .nav-links .nav-mobile-socials a:hover{
                transform:translateY(-2px);
                color:#fff;
                background:var(--primary);
                border-color:var(--primary);
            }
            .nav-mobile-socials svg{
                display:block;
                width:17px;
                height:17px;
                max-width:17px;
                max-height:17px;
                flex:0 0 auto;
            }

            :root[data-theme="dark"] .nav-links .nav-mobile-socials a{
                color:#fff;
                background:var(--red-soft);
            }

            .hero{
                min-height:auto;
            }

            .hero-inner{
                padding:40px 14px 54px;
            }

            .hero-title{
                font-size:39px;
                line-height:1.06;
            }

            .hero-copy{
                font-size:16px;
            }

            .store{
                width:calc(50% - 6px);
                min-width:0;
                min-height:56px;
                padding:8px 10px;
            }

            .store-name{
                font-size:13px;
            }

            .hero-visual{
                min-height:430px;
            }

            .phone{
                width:205px;
                padding:7px;
                border-radius:31px;
            }

            .phone img{
                border-radius:24px;
            }

            .phone::before{
                top:66px;
                height:44px;
                box-shadow:
                    0 56px 0 -1px #6F93AA,
                    inset 1px 0 1px rgba(255,255,255,.74),
                    -2px 2px 5px rgba(31,49,63,.2);
            }

            .phone::after{
                top:112px;
                height:58px;
            }

            .phone.primary{
                right:58px;
            }

            .phone.secondary{
                left:0;
                top:72px;
            }

            .phone.tertiary{
                top:158px;
            }

            .floating-badge{
                left:20px;
                bottom:42px;
            }

            .section{
                padding:60px 14px;
            }

            .section-head{
                align-items:flex-start;
                flex-direction:column;
                margin-bottom:24px;
            }

            .section-title{
                font-size:31px;
            }

            .screen-strip,
            .footer-inner{
                grid-template-columns:1fr;
            }

            .signal-grid{
                grid-template-columns:1fr 1fr;
                gap:9px;
            }

            .signal-card{
                min-height:92px;
                padding:13px;
            }

            .role-section{
                padding:46px 0;
                gap:28px;
            }

            .role-copy h3{
                font-size:30px;
            }

            .role-screens,
            .staff-role .role-screens{
                display:block;
                overflow:visible;
                min-height:410px;
                max-width:390px;
                width:100%;
                margin:0 auto;
                padding:0;
            }

            .role-screen,
            .role-screen:nth-child(2),
            .role-screen:nth-child(3),
            .role-screen:nth-child(4),
            .staff-role .role-screen,
            .staff-role .role-screen:nth-child(1),
            .staff-role .role-screen:nth-child(2),
            .staff-role .role-screen:nth-child(3){
                position:absolute;
                display:block;
                width:205px;
                min-width:0;
                left:auto;
                right:auto;
                top:auto;
                bottom:auto;
                opacity:1;
                pointer-events:auto;
                transform:none;
                scroll-snap-align:none;
                padding:7px;
                border:0;
                border-radius:30px;
                transition:opacity .5s ease, transform .5s cubic-bezier(.22,1,.36,1);
                animation:none;
            }

            .role-screen:nth-child(1),
            .staff-role .role-screen:nth-child(1){
                left:0;
                top:88px;
                z-index:2;
                transform:rotate(-7deg) scale(.88);
            }

            .role-screen:nth-child(2),
            .staff-role .role-screen:nth-child(2){
                left:50%;
                top:0;
                z-index:4;
                transform:translateX(-50%) rotate(2deg);
            }

            .role-screen:nth-child(3),
            .staff-role .role-screen:nth-child(3){
                right:0;
                top:110px;
                z-index:3;
                transform:rotate(7deg) scale(.88);
            }

            .dark-role .role-screen:nth-child(1){
                left:2%;
                top:82px;
                transform:rotate(-6deg) scale(.88);
            }

            .dark-role .role-screen:nth-child(2){
                left:50%;
                top:0;
                transform:translateX(-50%) rotate(2deg);
            }

            .dark-role .role-screen:nth-child(3){
                right:2%;
                top:98px;
                transform:rotate(6deg) scale(.88);
            }

            .split-feature{
                padding:22px;
                gap:28px;
            }

            .feature-text h3{
                font-size:30px;
            }

            .feature-screen{
                max-width:250px;
                border-width:8px;
            }

            .minimal-panel{
                padding:22px;
            }

            .mini-metrics{
                grid-template-columns:1fr;
            }

            .gallery{
                display:flex;
                overflow-x:auto;
                scroll-snap-type:x mandatory;
                padding-bottom:10px;
            }

            .gallery .phone-frame{
                min-width:190px;
                scroll-snap-align:start;
            }

            .gallery .phone-frame:nth-child(even){
                margin-top:0;
            }

            .faq-button{
                min-height:70px;
                font-size:17px;
            }

            .faq-answer p{
                padding-right:0;
            }

            .cta{
                padding:58px 14px;
            }

            .cta-box{
                min-height:280px;
                align-items:flex-start;
                justify-content:center;
                flex-direction:column;
            }

            .cta h2{
                font-size:33px;
            }
        }

        @media (prefers-reduced-motion: reduce){
            *,
            *::before,
            *::after{
                animation-duration:.01ms !important;
                animation-iteration-count:1 !important;
                scroll-behavior:auto !important;
                transition-duration:.01ms !important;
            }

            .reveal{
                opacity:1;
                transform:none;
            }
            .nav-links > *{
                opacity:1;
                transform:none;
                transition:none;
            }
        }

/* =========================
   Discover Page
========================= */
.discover-page{
    max-width:var(--container);
    margin:0 auto;
    padding:50px 20px 0;
}

.discover-page .cta{
    margin:42px calc(50% - 50vw) 0;
}

.discover-page .hero{
    position:relative;
    overflow:hidden;
    display:block;
    min-height:auto;
    border-radius:var(--radius-xl);
    padding:36px;
    margin-bottom:20px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)),
        linear-gradient(135deg, var(--primary) 0%, #EF233C 55%, #7F1D1D 100%);
    color:#fff;
    box-shadow:var(--shadow-md);
}

.discover-page .hero::before{
    content:"";
    position:absolute;
    top:-120px;
    right:-80px;
    width:280px;
    height:280px;
    background:rgba(255,255,255,.10);
    border-radius:50%;
}

.discover-page .hero::after{
    content:"";
    position:absolute;
    bottom:-100px;
    left:-60px;
    width:220px;
    height:220px;
    background:rgba(255,255,255,.06);
    border-radius:50%;
}

.hero-content{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
}

.discover-page .hero-copy{
    max-width:760px;
    margin:0;
    color:inherit;
    font-size:initial;
    line-height:normal;
    font-weight:initial;
    animation:none;
}

.hero-tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.20);
    font-size:12px;
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:16px;
}

.discover-page .hero h1{
    margin:0 0 10px;
    font-size:clamp(32px, 4.5vw, 56px);
    line-height:1.02;
    font-weight:900;
    letter-spacing:-.04em;
}

.discover-page .hero p{
    margin:0;
    color:rgba(255,255,255,.90);
    line-height:1.7;
    font-size:15px;
    max-width:680px;
}

.hero-stat{
    position:relative;
    z-index:2;
    min-width:170px;
    padding:22px 20px;
    border-radius:24px;
    background:rgba(255,255,255,.14);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.18);
    text-align:left;
}

.hero-stat strong{
    display:block;
    font-size:38px;
    line-height:1;
    font-weight:900;
    margin-bottom:8px;
}

.hero-stat span{
    display:block;
    font-size:13px;
    font-weight:700;
    color:rgba(255,255,255,.88);
}

.filters-card{
    background:rgba(255,255,255,.80);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.9);
    border-radius:28px;
    padding:20px;
    box-shadow:var(--shadow-sm);
    margin-bottom:26px;
}

.filters-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:16px;
    flex-wrap:wrap;
}

.filters-top h2{
    margin:0;
    font-size:18px;
    font-weight:800;
    letter-spacing:-.02em;
}

.helper-text{
    margin:0;
    color:var(--muted);
    font-size:13px;
    font-weight:600;
}

.search-row{
    display:grid;
    grid-template-columns:1.4fr .85fr .85fr .8fr auto;
    gap:12px;
}

.input,.select{
    width:100%;
    height:56px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    padding:0 18px;
    font-size:14px;
    color:var(--text);
    outline:none;
    transition:.2s ease;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}

.input::placeholder{color:#98a2b3}

.input:focus,.select:focus{
    border-color:rgba(217,4,41,.35);
    box-shadow:0 0 0 4px rgba(217,4,41,.08);
}

.search-row .btn,
.checkout-page .btn{
    height:56px;
    border-radius:18px;
    padding:0 22px;
    background:linear-gradient(135deg, var(--primary), #ef233c);
    font-size:14px;
    font-weight:800;
    box-shadow:0 14px 26px rgba(217,4,41,.18);
}

.search-row .btn:hover,
.checkout-page .btn:hover{
    transform:translateY(-1px);
    box-shadow:0 18px 32px rgba(217,4,41,.24);
}

.discover-page .section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin:0 2px 18px;
    flex-wrap:wrap;
}

.discover-page .section-head h3{
    margin:0;
    font-size:22px;
    line-height:1.05;
    font-weight:900;
    letter-spacing:-.03em;
}

.discover-page .section-head p{
    margin:0;
    color:var(--muted);
    font-size:14px;
    font-weight:600;
}

.grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:18px;
}

.event-card{
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.95);
    border-radius:26px;
    overflow:hidden;
    box-shadow:var(--shadow-sm);
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.event-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
    border-color:rgba(217,4,41,.10);
}

.event-card.reveal{transform:translateY(28px) scale(.98)}
.event-card.reveal.visible{transform:translateY(0) scale(1)}
.event-card.reveal.visible:hover{transform:translateY(-4px) scale(1)}

.event-media{
    position:relative;
    aspect-ratio:16 / 10;
    background:linear-gradient(180deg, #fff1f2 0%, #fef2f2 100%);
    overflow:hidden;
}

.event-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .35s ease;
}

.event-card:hover .event-media img{transform:scale(1.04)}

.event-image-fallback{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--primary);
    font-size:14px;
    font-weight:800;
    text-align:center;
    padding:18px;
    background:linear-gradient(180deg, #fff1f2 0%, #ffe4e8 100%);
}

.card-chip{
    position:absolute;
    top:14px;
    left:14px;
    z-index:2;
    max-width:calc(100% - 28px);
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.95);
    box-shadow:0 8px 20px rgba(16,24,40,.08);
    font-size:12px;
    font-weight:800;
    color:var(--text);
}

.event-body{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
    flex:1;
}

.event-title{
    margin:0;
    font-size:20px;
    font-weight:850;
    line-height:1.28;
    letter-spacing:-.02em;
    display:-webkit-box;
    -webkit-line-clamp:2;
    line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.event-desc{
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.6;
    display:-webkit-box;
    -webkit-line-clamp:2;
    line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    min-height:44px;
}

.meta{
    display:grid;
    gap:10px;
    padding:14px;
    border-radius:18px;
    background:linear-gradient(180deg, var(--primary-soft), rgba(255,255,255,.86));
    border:1px solid rgba(217,4,41,.14);
}

.meta-line{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:var(--muted);
    font-size:13px;
    font-weight:600;
    line-height:1.5;
}

.meta-line svg{
    width:16px;
    height:16px;
    margin-top:2px;
    color:var(--primary);
    flex-shrink:0;
}

.card-bottom{
    margin-top:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding-top:4px;
}

.price-wrap{display:flex;flex-direction:column;gap:4px}

.price-label{
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#98a2b3;
}

.price{
    font-size:24px;
    line-height:1;
    font-weight:900;
    color:var(--primary);
    letter-spacing:-.03em;
}

.price.free{color:var(--success)}

.ticket-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:132px;
    height:46px;
    padding:0 18px;
    border-radius:14px;
    background:#fff;
    color:var(--primary);
    border:1px solid rgba(217,4,41,.14);
    box-shadow:0 8px 20px rgba(16,24,40,.05);
    font-size:14px;
    font-weight:800;
    transition:.2s ease;
}

.ticket-btn:hover{
    background:var(--primary);
    color:#fff;
    border-color:var(--primary);
    box-shadow:0 14px 26px rgba(217,4,41,.18);
}

.empty,.error-box{
    background:rgba(255,255,255,.86);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.95);
    border-radius:28px;
    padding:42px 24px;
    text-align:center;
    box-shadow:var(--shadow-sm);
}

.empty h3,.error-box h3{
    margin:0 0 10px;
    font-size:24px;
    font-weight:900;
    letter-spacing:-.02em;
}

.empty p,.error-box p{
    margin:0;
    color:var(--muted);
    line-height:1.7;
    max-width:640px;
    margin-inline:auto;
}

:root[data-theme="dark"] .filters-card,
:root[data-theme="dark"] .event-card,
:root[data-theme="dark"] .empty,
:root[data-theme="dark"] .error-box,
:root[data-theme="dark"] .btn-light{
    background:rgba(23,23,31,.84);
    border-color:rgba(42,42,53,.96);
}

:root[data-theme="dark"] .card-chip{
    background:rgba(13,13,18,.82);
    border-color:rgba(255,255,255,.08);
}

:root[data-theme="dark"] .input,
:root[data-theme="dark"] .select{
    background:var(--surface);
    color:var(--text);
    border-color:var(--line);
    box-shadow:none;
}

:root[data-theme="dark"] .event-media,
:root[data-theme="dark"] .event-image-fallback{
    background:linear-gradient(180deg, #2A1820 0%, #1F1F29 100%);
}

:root[data-theme="dark"] .meta{
    background:linear-gradient(180deg, rgba(42,24,32,.95), rgba(31,31,41,.92));
    border-color:rgba(217,4,41,.28);
}

.discover-footer{
    margin-top:34px;
    padding:28px 0 0;
    border-top:1px solid var(--line);
    display:grid;
    grid-template-columns:minmax(260px, 1.3fr) repeat(auto-fit, minmax(120px, .6fr));
    gap:22px;
}

.discover-footer p{
    margin:0;
    max-width:360px;
    color:var(--muted);
    line-height:1.6;
    font-weight:700;
}

.discover-footer h3{
    margin:0 0 12px;
    color:var(--primary);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:900;
}

.discover-footer a{
    display:block;
    width:max-content;
    max-width:100%;
    margin-top:9px;
    color:var(--muted);
    font-weight:750;
}

.discover-footer a:hover{color:var(--primary)}

.discover-footer .footer-socials{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:9px;
    max-width:260px;
}

.discover-footer .footer-socials a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-top:0;
    padding:0;
    border:1px solid var(--line);
    border-radius:50%;
    background:var(--surface);
}

.discover-footer .footer-socials svg{
    width:16px;
    height:16px;
    flex:0 0 auto;
}

@media (max-width:1180px){
    .grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
    .search-row{grid-template-columns:1fr 1fr 1fr}
}

@media (max-width:900px){
    .discover-footer{grid-template-columns:1fr}
}

@media (max-width:860px){
    .hero-content{flex-direction:column;align-items:flex-start}
    .hero-stat{width:100%;min-width:0}
    .search-row{grid-template-columns:1fr 1fr}
}

@media (max-width:720px){
    .discover-page{padding:40px 12px 0}
}

@media (max-width:640px){
    .discover-page .hero{padding:24px 20px;border-radius:24px}
    .discover-page .section-head{
        justify-content:flex-start;
        text-align:left;
        margin-left:0;
        margin-right:0;
    }
    .discover-page .section-head h3{
        font-size:20px;
    }
    .filters-card{padding:16px;border-radius:22px}
    .search-row{grid-template-columns:1fr}
    .grid{grid-template-columns:1fr}
    .event-body{padding:16px}
    .card-bottom{flex-direction:column;align-items:stretch}
    .ticket-btn{width:100%}
}
/* =========================
   Checkout Page
========================= */

.checkout-page{
    padding-top:24px;
}

.checkout-hero{
    position:relative;
    overflow:hidden;
    border-radius:var(--radius-xl);
    padding:32px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)),
        linear-gradient(135deg, #d90429 0%, #ef233c 52%, #7f1d1d 100%);
    color:#fff;
    box-shadow:var(--shadow-md);
    margin-bottom:22px;
}

.checkout-hero::before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    top:-120px;
    right:-70px;
    background:rgba(255,255,255,.10);
}

.checkout-hero::after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border-radius:50%;
    left:-80px;
    bottom:-120px;
    background:rgba(255,255,255,.06);
}

.checkout-hero__content{
    position:relative;
    z-index:2;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
}

.checkout-hero__copy{
    max-width:720px;
}

.checkout-hero__tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.18);
    font-size:12px;
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:14px;
}

.checkout-hero__copy h1{
    margin:0 0 10px;
    font-size:clamp(30px, 4vw, 50px);
    line-height:1.02;
    font-weight:900;
    letter-spacing:-.04em;
}

.checkout-hero__copy p{
    margin:0;
    font-size:15px;
    line-height:1.7;
    color:rgba(255,255,255,.92);
}

.checkout-hero__stat{
    min-width:180px;
    padding:22px 20px;
    border-radius:24px;
    background:rgba(255,255,255,.14);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.18);
}

.checkout-hero__stat strong{
    display:block;
    font-size:36px;
    line-height:1;
    font-weight:900;
    margin-bottom:8px;
}

.checkout-hero__stat span{
    display:block;
    font-size:13px;
    font-weight:700;
    color:rgba(255,255,255,.88);
}

.checkout-shell{
    display:grid;
    grid-template-columns:minmax(0, 1.55fr) minmax(320px, .85fr);
    gap:20px;
    align-items:start;
}

.glass-card{
    background:rgba(255,255,255,.84);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.96);
    box-shadow:var(--shadow-sm);
    border-radius:28px;
}

.checkout-panel{
    padding:24px;
}

.sticky-card{
    padding:22px;
    position:sticky;
    top:24px;
}

.panel-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:20px;
}

.panel-kicker{
    margin:0 0 6px;
    color:var(--primary);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:900;
}

.panel-title-lg{
    margin:0;
    font-size:28px;
    line-height:1.08;
    font-weight:900;
    letter-spacing:-.03em;
}

.panel-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 14px;
    border-radius:999px;
    background:var(--primary-soft);
    color:var(--primary);
    font-weight:800;
    font-size:13px;
    border:1px solid rgba(217,4,41,.12);
}

.checkout-alert{
    margin-bottom:18px;
    padding:14px 16px;
    border-radius:16px;
    font-size:14px;
    font-weight:700;
    border:1px solid transparent;
}

.checkout-alert.success{
    background:rgba(22,163,74,.10);
    color:#166534;
    border-color:rgba(22,163,74,.18);
}

.checkout-alert.error{
    background:rgba(217,4,41,.08);
    color:#991b1b;
    border-color:rgba(217,4,41,.14);
}

.checkout-alert.loading{
    background:rgba(255,183,3,.12);
    color:#92400e;
    border-color:rgba(255,183,3,.18);
}

/* utility helpers */
.u-hidden{display:none!important}

.checkout-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-bottom:18px;
}

.checkout-block{
    margin-bottom:18px;
}

.field-label{
    display:block;
    margin-bottom:10px;
    color:#344054;
    font-size:13px;
    font-weight:800;
}

.field-static{
    min-height:56px;
    display:flex;
    align-items:center;
    padding:0 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:var(--surface);
    font-weight:700;
    color:var(--text);
}

.qty-picker{
    display:flex;
    align-items:center;
    gap:10px;
}

.qty-input-web{
    width:90px;
    height:56px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    text-align:center;
    font-size:16px;
    font-weight:900;
    color:var(--text);
    outline:none;
}

.qty-input-web:focus{
    border-color:rgba(217,4,41,.35);
    box-shadow:0 0 0 4px rgba(217,4,41,.08);
}

.promo-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) 180px;
    gap:12px;
}

.helper-note{
    margin:10px 4px 0;
    color:var(--muted);
    font-size:13px;
    line-height:1.6;
    font-weight:600;
}

.summary-card{
    margin-top:6px;
    padding:18px;
    border-radius:24px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(249,250,252,.95));
}

.summary-card__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:14px;
}

.summary-card__head h3{
    margin:0;
    font-size:22px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:-.02em;
}

.summary-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:0 14px;
    border-radius:999px;
    background:#fff;
    border:1px solid var(--line);
    color:#344054;
    font-weight:800;
    font-size:13px;
}

.summary-meta{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-bottom:16px;
}

.summary-meta__item{
    padding:14px;
    border-radius:18px;
    background:#fff;
    border:1px solid var(--line);
}

.summary-meta__label{
    display:block;
    margin-bottom:6px;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#98a2b3;
    font-weight:800;
}

.summary-meta__item strong{
    display:block;
    font-size:15px;
    font-weight:800;
    color:var(--text);
    line-height:1.5;
}

.quote-box{
    margin-top:8px;
}

.price-list{
    display:grid;
    gap:10px;
}

.price-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:14px 16px;
    border-radius:16px;
    background:#fff;
    border:1px solid var(--line);
    font-size:14px;
    color:#344054;
    font-weight:700;
}

.price-row strong{
    color:var(--text);
    font-weight:900;
}

.discount-row strong{
    color:var(--success);
}

.total-row{
    background:linear-gradient(135deg, var(--primary-soft), #fff);
    border-color:rgba(217,4,41,.12);
}

.total-row span{
    font-size:15px;
    font-weight:900;
    color:var(--text);
}

.total-row strong{
    font-size:24px;
    line-height:1;
    color:var(--primary);
    letter-spacing:-.03em;
}

.pricing-note{
    margin-top:12px;
    padding:14px 16px;
    border-radius:16px;
    background:rgba(255,255,255,.72);
    border:1px dashed rgba(102,112,133,.24);
    color:var(--muted);
    font-size:13px;
    line-height:1.6;
    font-weight:600;
}

.side-head{
    margin-bottom:16px;
}

.side-title{
    margin:0;
    font-size:24px;
    line-height:1.12;
    font-weight:900;
    letter-spacing:-.02em;
}

.side-info-list{
    display:grid;
    gap:12px;
    margin-bottom:18px;
}

.side-info{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:14px 16px;
    border-radius:18px;
    background:var(--surface-2);
    border:1px solid var(--line);
}

.side-info span{
    color:var(--muted);
    font-size:13px;
    font-weight:700;
}

.side-info strong{
    color:var(--text);
    font-size:15px;
    font-weight:900;
}

.side-total-card{
    padding:18px;
    border-radius:22px;
    margin-bottom:16px;
    background:linear-gradient(135deg, #d90429 0%, #ef233c 100%);
    color:#fff;
    box-shadow:0 16px 28px rgba(217,4,41,.18);
}

.side-total-card__label{
    display:block;
    margin-bottom:8px;
    font-size:12px;
    letter-spacing:.08em;
    text-transform:uppercase;
    font-weight:800;
    color:rgba(255,255,255,.84);
}

.side-total-card strong{
    display:block;
    font-size:32px;
    line-height:1;
    font-weight:900;
    letter-spacing:-.03em;
}

.checkout-cta{
    width:100%;
    margin-bottom:12px;
}

.side-note{
    margin:0;
    color:var(--muted);
    font-size:13px;
    line-height:1.65;
    font-weight:600;
}

.btn:disabled{
    opacity:.65;
    cursor:not-allowed;
    transform:none;
    box-shadow:0 10px 18px rgba(16,24,40,.08);
}

@media (max-width:1024px){
    .checkout-shell{
        grid-template-columns:1fr;
    }

    .sticky-card{
        position:relative;
        top:0;
    }
}

@media (max-width:760px){
    .checkout-hero{
        padding:24px 20px;
        border-radius:24px;
    }

    .checkout-hero__content{
        flex-direction:column;
        align-items:flex-start;
    }

    .checkout-hero__stat{
        width:100%;
        min-width:0;
    }

    .checkout-grid{
        grid-template-columns:1fr;
    }

    .promo-row{
        grid-template-columns:1fr;
    }

    .summary-meta{
        grid-template-columns:1fr;
    }

    .panel-title-lg{
        font-size:24px;
    }

    .side-title{
        font-size:22px;
    }
}

@media (max-width:560px){
    .checkout-panel,
    .sticky-card{
        padding:18px;
        border-radius:22px;
    }

    .qty-picker{
        width:100%;
    }

    .qty-input-web{
        flex:1;
        width:auto;
    }

    .price-row{
        padding:13px 14px;
    }

    .total-row strong{
        font-size:22px;
    }
}


    /* Event details - ticket UI additions moved from inline page styles */
    .ticket-card{
        border:1px solid var(--line);
        background:var(--surface-2);
        border-radius:24px;
        padding:18px;
        display:grid;
        gap:14px;
        margin-bottom:12px;
    }

    .card-bottom{ margin-top:12px; }

    .ticket-actions{ display:flex; gap:8px; align-items:center; }

    .qty-select{
        width:86px;
        padding:8px 10px;
        border-radius:10px;
        border:1px solid var(--line);
        background:#fff;
        font-weight:800;
        color:var(--text);
        -webkit-appearance:none;
        -moz-appearance:none;
        appearance:none;
    }

    .mini-stat{
        padding:14px;
        border-radius:18px;
        background:#fff;
        border:1px solid var(--line);
        display:flex;
        flex-direction:column;
        min-width:0;
    }

    .mini-stat .label{
        display:block;
        font-size:11px;
        text-transform:uppercase;
        letter-spacing:.08em;
        color:#98a2b3;
        font-weight:800;
        margin-bottom:7px;
    }

    .mini-stat .value{
        display:block;
        font-size:16px;
        font-weight:900;
        color:var(--text);
        word-break:break-word;
    }

    .mini-stat .ticket-remaining{ color:var(--danger); }

    .qty-controls{ display:inline-flex; align-items:center; gap:8px; }

    .qty-btn{
        width:36px;
        height:36px;
        border-radius:8px;
        border:1px solid var(--line);
        background:#fff;
        color:var(--text);
        font-weight:900;
        font-size:18px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        cursor:pointer;
    }

    .qty-btn:disabled{ opacity:.48; cursor:not-allowed; }

    .qty-display{ min-width:26px; text-align:center; font-weight:900; }

    .qty-input{ display:none; }

    .benefits{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }

    .benefit-pill{
        display:inline-flex;
        align-items:center;
        gap:8px;
        padding:8px 12px;
        border-radius:999px;
        background:#fff;
        border:1px solid var(--line);
        color:#344054;
        font-size:12px;
        font-weight:700;
    }

    /* small utilities for event-details.php */
    .hero-image-card.clickable{ cursor: pointer; }

    /* modal / lightbox for event images */
    .modal-overlay{
        display:none;
        position:fixed;
        inset:0;
        z-index:9999;
        background:rgba(0,0,0,.85);
        align-items:center;
        justify-content:center;
    }
    .modal-overlay.open{ display:flex; }
    .modal-inner{
        max-width:1100px;
        max-height:86vh;
        padding:12px;
    }
    .modal-img{
        display:block;
        max-width:100%;
        max-height:86vh;
        margin:0 auto;
        border-radius:12px;
        object-fit:contain;
    }
    .modal-close{
        position:absolute;
        top:18px;
        right:18px;
        background:transparent;
        border:none;
        color:#fff;
        font-size:28px;
        cursor:pointer;
    }
    .modal-nav{
        position:absolute;
        top:50%;
        transform:translateY(-50%);
        background:transparent;
        border:none;
        color:#fff;
        font-size:36px;
        cursor:pointer;
    }
    .modal-nav.prev{ left:18px; }
    .modal-nav.next{ right:18px; }

    .panel-title{ margin:0 0 10px; font-size:18px; font-weight:900; }
    .btn-row{ display:flex; gap:8px; align-items:center; }

/* About page */
.about-page{
    max-width:1180px;
    margin:0 auto;
    padding:34px 20px 88px;
}

.about-top{
    display:flex;
    align-items:flex-start;
    gap:16px;
    margin-bottom:16px;
}

.about-page .back-btn{
    width:46px;
    height:46px;
    border:none;
    border-radius:14px;
    background:var(--surface);
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    font-weight:900;
    color:var(--text);
    cursor:pointer;
    transition:.2s ease;
    flex-shrink:0;
}

.about-page .back-btn:hover{
    transform:translateY(-1px);
    box-shadow:var(--shadow-md);
}

.about-breadcrumb{
    min-width:0;
}

.crumbs{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:14px;
    color:var(--muted);
    font-size:13px;
    font-weight:800;
}

.crumbs a{
    color:var(--primary);
    transition:opacity .2s ease;
}

.crumbs a:hover{
    opacity:.72;
}

.about-editorial{
    display:grid;
    gap:44px;
}

.about-editorial-row{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:58px;
    align-items:center;
    min-height:430px;
    padding:18px 0;
}

.about-editorial-copy{
    max-width:580px;
}

.about-editorial-row .about-editorial-copy > *,
.about-section-head > *,
.team-card{
    opacity:0;
    transform:translateY(18px);
    transition:opacity 1.05s ease, transform 1.05s cubic-bezier(.22,1,.36,1);
}

.about-editorial-row .about-editorial-copy > *:nth-child(2){
    transition-delay:.16s;
}

.about-editorial-row .about-editorial-copy > *:nth-child(3){
    transition-delay:.32s;
}

.about-editorial-row.visible .about-editorial-copy > *,
.about-section-head.visible > *,
.team-card.visible{
    opacity:1;
    transform:translateY(0);
}

.about-editorial-copy h1,
.about-editorial-copy h2{
    margin:0;
    color:var(--text);
    font-size:clamp(38px, 5vw, 66px);
    line-height:.98;
    letter-spacing:-.055em;
    font-weight:950;
}

.about-editorial-copy h2{
    font-size:clamp(34px, 4.4vw, 58px);
}

.about-editorial-copy p:not(.kicker){
    margin:22px 0 0;
    color:var(--muted);
    font-size:18px;
    line-height:1.75;
    font-weight:650;
}

.about-editorial-image{
    width:100%;
    display:flex;
    justify-content:flex-end;
}

.about-editorial-image--left{
    justify-content:flex-start;
}

.about-editorial-image > img{
    width:min(100%, 480px);
    max-height:560px;
    object-fit:contain;
    border-radius:0;
    box-shadow:none;
    opacity:0;
    transform:translateX(28px) scale(.96);
    transition:opacity 1.12s ease .18s, transform 1.12s cubic-bezier(.22,1,.36,1) .18s;
}

:root[data-theme="dark"] .about-editorial-image > img{
    box-shadow:none;
}

.about-editorial-image--left > img{
    transform:translateX(-28px) scale(.96);
}

.about-editorial-row.visible .about-editorial-image > img{
    opacity:1;
    transform:translateX(0) scale(1);
}

.about-phone-case{
    position:relative;
    width:min(100%, 278px);
    padding:9px;
    border:1px solid rgba(216,235,248,.72);
    border-radius:38px;
    overflow:visible;
    background:
        radial-gradient(circle at 18% 12%, rgba(255,255,255,.92) 0 8%, transparent 22%),
        linear-gradient(118deg, rgba(255,255,255,.82) 0%, rgba(175,213,238,.3) 13%, transparent 30%),
        linear-gradient(155deg, #D9ECFA 0%, #84A6BD 24%, #335B76 48%, #B9D5E8 66%, #486D85 100%);
    box-shadow:
        inset 2px 0 5px rgba(255,255,255,.58),
        inset -8px 0 16px rgba(23,55,78,.42),
        inset 0 -18px 34px rgba(20,48,68,.38),
        0 38px 70px rgba(51,91,118,.34),
        0 16px 32px rgba(0,0,0,.24);
    opacity:0;
    transform:translateX(30px) translateY(18px) scale(.9) rotate(2deg);
    transition:
        opacity 1.12s ease .18s,
        transform 1.12s cubic-bezier(.22,1,.36,1) .18s;
}

.about-editorial-image--left .about-phone-case{
    transform:translateX(-30px) translateY(18px) scale(.9) rotate(-2deg);
}

.about-phone-case::before{
    content:"";
    position:absolute;
    left:-5px;
    top:92px;
    width:4px;
    height:58px;
    border-radius:6px 0 0 6px;
    background:linear-gradient(180deg, #E8F7FF, #6F93AA 58%, #C6E2F4);
    box-shadow:
        0 76px 0 -1px #6F93AA,
        inset 1px 0 1px rgba(255,255,255,.74),
        -2px 2px 5px rgba(31,49,63,.22);
}

.about-phone-case::after{
    content:"";
    position:absolute;
    right:-5px;
    top:150px;
    width:4px;
    height:78px;
    border-radius:0 6px 6px 0;
    background:linear-gradient(180deg, #E8F7FF, #6F93AA 58%, #C6E2F4);
    box-shadow:
        inset -1px 0 1px rgba(255,255,255,.74),
        2px 2px 5px rgba(31,49,63,.22);
}

.about-phone-case img{
    width:100%;
    height:auto;
    border-radius:29px;
    filter:saturate(1.04) contrast(1.02);
    box-shadow:
        0 0 0 1px rgba(15,23,42,.36),
        0 8px 18px rgba(8,25,38,.22),
        inset 0 0 0 1px rgba(255,255,255,.16);
    animation:imageBreath 7.5s ease-in-out infinite;
}

.about-editorial-row.visible .about-phone-case{
    opacity:1;
    transform:translateX(0) translateY(0) scale(1) rotate(0deg);
}

.about-editorial-empty{
    min-height:1px;
}

.about-team{
    padding-top:64px;
}

.about-section-head{
    max-width:760px;
    margin:0 auto 34px;
    text-align:center;
}

.about-section-head h2{
    margin:12px 0 0;
    color:var(--text);
    font-size:clamp(34px, 5vw, 60px);
    line-height:1;
    letter-spacing:-.05em;
}

.about-section-head p:not(.kicker){
    margin:16px auto 0;
    max-width:560px;
    color:var(--muted);
    font-size:16px;
    font-weight:650;
    line-height:1.7;
}

.team-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:38px;
    max-width:1040px;
    margin:0 auto;
}

.team-card{
    display:grid;
    gap:18px;
    align-items:start;
    justify-items:center;
    text-align:center;
    padding:0;
    transition:opacity 1.05s ease, transform 1.05s cubic-bezier(.22,1,.36,1);
}

.team-card:nth-child(2){
    transition-delay:.16s;
}

.team-card:nth-child(3){
    transition-delay:.32s;
}

.team-photo{
    width:170px;
    height:170px;
    border-radius:50%;
    background:var(--red-soft);
    overflow:hidden;
    border:1px solid var(--red-soft-border);
}

.team-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:none;
    mix-blend-mode:normal;
    transition:transform .5s cubic-bezier(.16,1,.3,1);
}

.team-card:hover .team-photo img{
    transform:scale(1.055);
}

.team-body{
    padding:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0;
}

.team-body h3{
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
    color:var(--text);
    font-size:22px;
    line-height:1.15;
    letter-spacing:-.03em;
}

.team-verified{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0;
    border-radius:0;
    background:transparent;
    border:0;
    color:#16a34a;
    box-shadow:none;
}

:root[data-theme="dark"] .team-verified{
    background:transparent;
    border-color:transparent;
    color:#4ade80;
}

.team-verified svg{
    width:16px;
    height:16px;
    flex-shrink:0;
    display:block;
}

.team-body p{
    min-height:0;
    margin:12px 0 0;
    max-width:240px;
    color:var(--muted);
    font-size:14px;
    font-weight:700;
    line-height:1.55;
}

.team-links{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:16px;
    justify-content:center;
}

.team-links a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:50%;
    background:transparent;
    border:0;
    color:var(--primary);
    transition:transform .2s ease, color .2s ease;
}

.team-links a:hover{
    transform:translateY(-2px) scale(1.04);
    color:var(--text);
}

.team-links svg{
    width:21px;
    height:21px;
    display:block;
}

@media (max-width:960px){
    .about-editorial-row{
        grid-template-columns:1fr;
        gap:26px;
        min-height:auto;
        padding:22px 0;
    }

    .about-editorial-empty{
        display:none;
    }

    .about-editorial-image{
        justify-content:flex-start;
    }

    .team-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:24px;
    }

    .team-photo{
        width:140px;
        height:140px;
    }
}

@media (max-width:720px){
    .about-page{
        padding:38px 14px 72px;
    }

    .about-top{
        gap:12px;
        margin-bottom:22px;
    }

    .about-editorial{
        gap:28px;
    }

    .about-editorial-copy h1,
    .about-editorial-copy h2{
        font-size:clamp(34px, 11vw, 48px);
    }

    .about-editorial-copy p:not(.kicker){
        font-size:16px;
    }

    .about-editorial-image > img{
        width:100%;
        max-height:480px;
    }

    .about-phone-case{
        width:min(100%, 278px);
    }

    .team-grid{
        grid-template-columns:1fr;
        gap:34px;
    }

    .team-photo{
        width:170px;
        height:170px;
    }

    .team-links{
        justify-content:center;
    }
}

/* Contact page */
.contact-page{
    max-width:1160px;
    margin:0 auto;
    padding:46px 20px 90px;
}

.contact-top{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:34px;
}

.contact-page .back-btn{
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid var(--red-soft-border);
    background:var(--red-soft);
    color:var(--primary);
    font-size:22px;
    font-weight:900;
    cursor:pointer;
    transition:transform .22s ease, background .22s ease, border-color .22s ease;
}

.contact-page .back-btn:hover{
    transform:translateX(-3px);
    border-color:var(--primary);
    background:color-mix(in srgb, var(--red-soft) 74%, var(--primary));
}

.contact-hero{
    display:grid;
    grid-template-columns:minmax(0, .95fr) minmax(360px, 1.05fr);
    gap:64px;
    align-items:center;
    min-height:560px;
}

.contact-copy{
    max-width:560px;
}

.contact-copy h1{
    margin:14px 0 0;
    color:var(--text);
    font-size:clamp(42px, 6.5vw, 78px);
    line-height:.98;
    letter-spacing:-.06em;
}

.contact-copy p:not(.kicker){
    margin:22px 0 0;
    color:var(--muted);
    font-size:18px;
    font-weight:700;
    line-height:1.7;
}

.contact-panel{
    display:grid;
    gap:14px;
    position:relative;
}

.contact-panel::before{
    content:"";
    position:absolute;
    inset:-34px -18px;
    border-radius:42px;
    background:
        radial-gradient(circle at 18% 22%, rgba(217,4,41,.18), transparent 34%),
        radial-gradient(circle at 84% 76%, rgba(217,4,41,.12), transparent 34%);
    filter:blur(10px);
    pointer-events:none;
    z-index:-1;
}

.contact-method{
    min-height:104px;
    display:flex;
    align-items:center;
    gap:18px;
    padding:18px;
    border-radius:8px;
    border:1px solid var(--red-soft-border);
    background:linear-gradient(180deg, var(--red-soft), var(--surface));
    color:var(--text);
    box-shadow:0 18px 42px rgba(16,16,16,.08);
    transition:opacity .9s ease, transform .9s cubic-bezier(.22,1,.36,1), border-color .22s ease, box-shadow .22s ease;
}

a.contact-method:hover{
    transform:translateY(-3px);
    border-color:var(--primary);
    box-shadow:var(--shadow);
}

.contact-method:nth-child(2){
    transition-delay:.12s;
}

.contact-method:nth-child(3){
    transition-delay:.24s;
}

.contact-method:nth-child(4){
    transition-delay:.36s;
}

.contact-method-icon{
    width:52px;
    height:52px;
    border-radius:8px;
    display:grid;
    place-items:center;
    background:var(--primary);
    color:#fff;
    flex:0 0 auto;
    box-shadow:0 18px 34px rgba(217,4,41,.22);
}

.contact-method-icon svg{
    width:25px;
    height:25px;
}

.contact-method small{
    display:block;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.contact-method strong{
    display:block;
    margin-top:6px;
    color:var(--text);
    font-size:clamp(18px, 2.2vw, 25px);
    line-height:1.12;
    letter-spacing:-.03em;
}

.contact-note{
    max-width:760px;
    margin:64px auto 0;
    text-align:center;
}

.contact-socials{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin:42px 0 0;
    padding:24px;
    border:1px solid var(--red-soft-border);
    border-radius:24px;
    background:linear-gradient(135deg, var(--surface), var(--red-soft));
    box-shadow:0 18px 42px rgba(16,16,16,.06);
}

.contact-socials h2{
    margin:8px 0 0;
    color:var(--text);
    font-size:clamp(28px, 3vw, 42px);
    line-height:1;
    letter-spacing:-.05em;
}

.contact-social-list{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
}

.contact-social-list a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    padding:0;
    border:1px solid var(--red-soft-border);
    border-radius:50%;
    background:var(--bg);
    color:var(--text);
    transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.contact-social-list svg{
    width:18px;
    height:18px;
    flex:0 0 auto;
}

.contact-social-list a:hover{
    transform:translateY(-2px);
    border-color:var(--primary);
    background:var(--primary);
    color:#fff;
}

.contact-note h2{
    margin:12px 0 0;
    color:var(--text);
    font-size:clamp(32px, 4.5vw, 56px);
    line-height:1;
    letter-spacing:-.05em;
}

.contact-note p:not(.kicker){
    margin:18px auto 0;
    max-width:620px;
    color:var(--muted);
    font-size:16px;
    font-weight:700;
    line-height:1.7;
}

.contact-hero .contact-copy > *,
.contact-note > *,
.contact-socials{
    opacity:0;
    transform:translateY(18px);
    transition:opacity 1.05s ease, transform 1.05s cubic-bezier(.22,1,.36,1);
}

.contact-hero.visible .contact-copy > *,
.contact-note.visible > *,
.contact-socials.visible{
    opacity:1;
    transform:translateY(0);
}

.contact-hero.visible .contact-copy > *:nth-child(2),
.contact-note.visible > *:nth-child(2){
    transition-delay:.16s;
}

.contact-hero.visible .contact-copy > *:nth-child(3),
.contact-note.visible > *:nth-child(3){
    transition-delay:.32s;
}

@media (max-width:900px){
    .contact-hero{
        grid-template-columns:1fr;
        gap:32px;
        min-height:auto;
    }

    .contact-copy{
        max-width:720px;
    }

    .contact-socials{
        align-items:flex-start;
        flex-direction:column;
    }

    .contact-social-list{
        justify-content:flex-start;
    }

}

@media (max-width:720px){
    .contact-page{
        padding:38px 14px 76px;
    }

    .contact-top{
        gap:12px;
        margin-bottom:24px;
    }

    .contact-hero{
        gap:28px;
    }

    .contact-copy h1{
        font-size:clamp(38px, 12vw, 52px);
    }

    .contact-copy p:not(.kicker){
        font-size:16px;
    }

    .contact-panel{
        gap:12px;
    }

    .contact-panel::before{
        inset:-18px -8px;
        border-radius:28px;
    }

    .contact-method{
        min-height:88px;
        padding:14px;
        gap:13px;
    }

    .contact-method-icon{
        width:46px;
        height:46px;
    }

    .contact-method strong{
        font-size:17px;
    }

    .contact-note{
        margin-top:48px;
        text-align:left;
    }

}

/* Legal pages */
.legal-page{
    max-width:1160px;
    margin:0 auto;
    padding:46px 20px 96px;
}

.legal-top{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:34px;
}

.legal-page .back-btn{
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid var(--red-soft-border);
    background:var(--red-soft);
    color:var(--primary);
    font-size:22px;
    font-weight:900;
    cursor:pointer;
    transition:transform .22s ease, background .22s ease, border-color .22s ease;
}

.legal-page .back-btn:hover{
    transform:translateX(-3px);
    border-color:var(--primary);
    background:color-mix(in srgb, var(--red-soft) 74%, var(--primary));
}

.legal-hero{
    max-width:850px;
    padding:32px 0 50px;
}

.legal-hero h1{
    margin:14px 0 0;
    color:var(--text);
    font-size:clamp(44px, 7vw, 86px);
    line-height:.96;
    letter-spacing:-.065em;
}

.legal-hero p:not(.kicker){
    margin:22px 0 0;
    max-width:680px;
    color:var(--muted);
    font-size:18px;
    font-weight:700;
    line-height:1.7;
}

.legal-hero > span{
    display:inline-flex;
    margin-top:22px;
    color:var(--primary);
    font-size:13px;
    font-weight:900;
    letter-spacing:.02em;
}

.legal-hero > *{
    opacity:0;
    transform:translateY(18px);
    transition:opacity 1.05s ease, transform 1.05s cubic-bezier(.22,1,.36,1);
}

.legal-hero.visible > *{
    opacity:1;
    transform:translateY(0);
}

.legal-hero.visible > *:nth-child(2){
    transition-delay:.16s;
}

.legal-hero.visible > *:nth-child(3){
    transition-delay:.32s;
}

.legal-hero.visible > *:nth-child(4){
    transition-delay:.48s;
}

.legal-layout{
    display:block;
    width:100%;
}

.legal-content{
    display:grid;
    gap:0;
    width:100%;
}

.legal-section{
    display:grid;
    grid-template-columns:minmax(80px, .22fr) minmax(0, 1fr);
    column-gap:34px;
    padding:36px 0;
    border-top:1px solid var(--line);
    background:transparent;
    transition:opacity 1.05s ease, transform 1.05s cubic-bezier(.22,1,.36,1);
}

.legal-section:last-child{
    border-bottom:1px solid var(--line);
}

.legal-section > span{
    display:inline-flex;
    align-self:start;
    padding-top:8px;
    color:var(--primary);
    font-size:13px;
    font-weight:950;
    letter-spacing:.08em;
}

.legal-section h2{
    margin:0;
    color:var(--text);
    font-size:clamp(24px, 3vw, 36px);
    line-height:1.08;
    letter-spacing:-.04em;
    grid-column:2;
}

.legal-section p{
    margin:16px 0 0;
    color:var(--muted);
    font-size:16px;
    font-weight:650;
    line-height:1.75;
    grid-column:2;
}

.legal-section p:first-of-type{
    margin-top:18px;
}

@media (max-width:900px){
    .legal-layout{
        display:block;
    }
}

@media (max-width:720px){
    .legal-page{
        padding:38px 14px 80px;
    }

    .legal-top{
        gap:12px;
        margin-bottom:22px;
    }

    .legal-hero{
        padding:24px 0 34px;
    }

    .legal-hero h1{
        font-size:clamp(40px, 13vw, 56px);
    }

    .legal-hero p:not(.kicker){
        font-size:16px;
    }

    .legal-section{
        grid-template-columns:1fr;
        padding:28px 0;
    }

    .legal-section > span,
    .legal-section h2,
    .legal-section p{
        grid-column:1;
    }

    .legal-section > span{
        padding-top:0;
        margin-bottom:10px;
    }

    .legal-section p{
        font-size:15px;
    }
}

/* Shared inner breadcrumb style, matched to checkout.php */
.about-top,
.contact-top,
.legal-top{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:24px;
    animation:checkoutRise .42s ease both;
}

.about-page .back-btn,
.contact-page .back-btn,
.legal-page .back-btn,
.event-details-page .back-btn{
    width:46px;
    height:46px;
    border:none;
    border-radius:14px;
    background:var(--surface);
    border:1px solid var(--line);
    box-shadow:var(--shadow-sm);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    font-weight:900;
    color:var(--text);
    cursor:pointer;
    transition:.2s ease;
    flex-shrink:0;
}

.about-page .back-btn:hover,
.contact-page .back-btn:hover,
.legal-page .back-btn:hover,
.event-details-page .back-btn:hover{
    transform:translateY(-1px);
    box-shadow:var(--shadow-md);
    border-color:var(--line);
    background:var(--surface);
}

.about-breadcrumb,
.contact-breadcrumb,
.legal-top > .crumbs{
    flex:1;
    min-width:0;
}

.about-top .crumbs,
.contact-top .crumbs,
.legal-top .crumbs,
.event-details-top .crumbs{
    margin:0;
    min-width:0;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.about-top .crumbs a,
.contact-top .crumbs a,
.legal-top .crumbs a,
.event-details-top .crumbs a{
    color:var(--primary);
}

.about-top .crumbs span:last-child,
.contact-top .crumbs span:last-child,
.legal-top .crumbs span:last-child,
    .event-details-top .crumbs span:last-child{
        min-width:0;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .event-details-top{
        margin-bottom:24px;
        animation:checkoutRise .42s ease both;
    }

@media (max-width:720px){
    .about-top,
    .contact-top,
    .legal-top{
        gap:12px;
        margin-bottom:20px;
    }

.about-page .back-btn,
.contact-page .back-btn,
.legal-page .back-btn,
.event-details-page .back-btn{
        width:42px;
        height:42px;
        border-radius:13px;
    }
}