/* ============================================================
   ROOT & RESET
   ============================================================ */
:root{
    --bg-dark:#14171d;
    --bg-dark-2:#1c212a;
    --accent:#ff7a1a;
    --accent-2:#ffb13c;
    --green:#3fae6a;
    --green-dark:#2f9257;
    --red:#ff5a52;
    --diesel:#7d8794;
    --tg-blue:#27a5e7;
    --text:#f5f6f8;
    --text-dim:#a7adb8;
    --page-bg:#0b0d12;
    --card-bg:rgba(255,255,255,0.055);
    --card-border:rgba(255,255,255,0.09);
    --ink:#f5f6f8;
    --ink-dim:#9aa0ac;
    --line:rgba(255,255,255,0.10);
    --radius-lg:22px;
    --radius-md:16px;
    --radius-sm:12px;
    --nav-h:74px;
    --safe-b:env(safe-area-inset-bottom, 0px);
    --safe-t:env(safe-area-inset-top, 0px);
  }

  *{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
  html,body{margin:0;padding:0;}
  body{
    font-family:'Inter',sans-serif;
    background:var(--page-bg);
    color:var(--ink);
    width:100%;
    overflow-x:hidden;
    touch-action:manipulation;
    -webkit-font-smoothing:antialiased;
  }
  button, a, input, select{font-family:inherit;}
  button{touch-action:manipulation; user-select:none; -webkit-user-select:none;}
  img{max-width:100%; display:block;}

  /* ============================================================
     AMBIENT GLASS BACKDROP
     ============================================================ */
  .bg-blobs{position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none;}
  .bg-blobs span{
    position:absolute; border-radius:50%; filter:blur(70px); opacity:0.35;
    animation:drift 16s ease-in-out infinite;
  }
  .bg-blobs span:nth-child(1){width:260px; height:260px; background:var(--accent); top:-60px; left:-60px; animation-delay:0s;}
  .bg-blobs span:nth-child(2){width:220px; height:220px; background:var(--tg-blue); top:40%; right:-80px; animation-delay:4s;}
  .bg-blobs span:nth-child(3){width:200px; height:200px; background:#2f9257; bottom:-60px; left:20%; animation-delay:8s;}
  @keyframes drift{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(20px,-30px) scale(1.15);}
  }

  .app{
    max-width:480px;
    margin:0 auto;
    min-height:100vh;
    background:transparent;
    position:relative;
    z-index:1;
    padding-bottom:calc(var(--nav-h) + var(--safe-b) + 10px);
  }

  .glass{
    background:var(--card-bg);
    border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%);
    backdrop-filter:blur(18px) saturate(140%);
  }

  /* ============================================================
     HEADER
     ============================================================ */
  header.topbar{
    position:sticky; top:0; z-index:50;
    background:rgba(20,23,29,0.55);
    -webkit-backdrop-filter:blur(20px) saturate(140%);
    backdrop-filter:blur(20px) saturate(140%);
    border-bottom:1px solid var(--line);
    padding:calc(14px + var(--safe-t)) 18px 14px;
    display:flex; align-items:center; justify-content:space-between;
  }
  .brand{display:flex; align-items:center; gap:13px;}
  .brand-mark{
    width:60px; height:60px; border-radius:13px;
    background:linear-gradient(145deg,var(--accent),var(--accent-2));
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    overflow:hidden;
  }
  .brand-mark img{
    width:100%;
    height:100%;
    object-fit:cover;
  }
  .brand-name{font-family:'Unbounded'; font-weight:700; font-size:16px; color:var(--text); letter-spacing:.2px;}
  .brand-sub{font-size:10px; color:var(--text-dim); letter-spacing:1.5px; text-transform:uppercase; margin-top:1px;}
  .burger{
    width:44px; height:44px; border-radius:12px; border:none;
    background:var(--bg-dark-2); display:flex; align-items:center; justify-content:center;
    flex-direction:column; gap:4px; cursor:pointer;
  }
  .burger span{width:18px; height:2px; background:var(--text); border-radius:2px;}

  /* ============================================================
     SIDE MENU
     ============================================================ */
  .menu-overlay{
    position:fixed; inset:0; background:rgba(10,12,15,.55);
    z-index:90; opacity:0; pointer-events:none; transition:opacity .25s ease;
  }
  .menu-overlay.open{opacity:1; pointer-events:auto;}
  .menu-panel{
    position:fixed; top:0; right:0; bottom:0; width:78%; max-width:340px;
    background:rgba(20,23,29,0.72);
    -webkit-backdrop-filter:blur(24px) saturate(150%);
    backdrop-filter:blur(24px) saturate(150%);
    border-left:1px solid var(--line);
    z-index:91;
    transform:translateX(100%); transition:transform .3s cubic-bezier(.4,0,.2,1);
    padding:calc(22px + var(--safe-t)) 22px 22px;
    display:flex; flex-direction:column;
  }
  .menu-panel.open{transform:translateX(0);}
  .menu-close{
    align-self:flex-end; width:40px; height:40px; border-radius:10px; border:none;
    background:var(--bg-dark-2); color:var(--text); font-size:18px; margin-bottom:20px;
  }
  .menu-panel a{
    display:flex; align-items:center; min-height:52px;
    color:var(--text); text-decoration:none; font-weight:600; font-size:16px;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .menu-phone{
    margin-top:auto; background:var(--accent); color:#1a1200; text-align:center;
    padding:16px; border-radius:var(--radius-md); font-weight:700; text-decoration:none;
  }

  /* ============================================================
     HERO
     ============================================================ */
  .hero{
    background:rgba(20,23,29,0.35);
    border-bottom:1px solid var(--line);
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    padding:22px 18px 28px;
    position:relative;
    overflow:hidden;
  }
  .hero::after{
    content:"";
    position:absolute; right:-60px; top:-40px; width:220px; height:220px;
    background:radial-gradient(circle, rgba(255,122,26,.28), transparent 65%);
  }
  .hero h1{
    font-family:'Unbounded'; font-weight:700; font-size:25px; line-height:1.28;
    color:var(--text); margin:0 0 10px; position:relative; z-index:1;
  }
  .hero h1 em{color:var(--accent); font-style:normal;}
  .hero p{
    color:var(--text-dim); font-size:14.5px; line-height:1.55; margin:0 0 18px;
    position:relative; z-index:1;
  }
  .hero .address-line{
    font-size:14px; color:var(--text); background:rgba(255,255,255,0.06); padding:8px 14px; border-radius:40px; display:inline-block; margin-bottom:14px; border:1px solid var(--line);
  }
  .hero .address-line i{margin-right:8px; color:var(--accent);}

  .chips{
    display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; margin-bottom:18px;
    scrollbar-width:none; position:relative; z-index:1;
  }
  .chips::-webkit-scrollbar{display:none;}
  .chip{
    flex:0 0 auto; background:rgba(255,255,255,0.07); border:1px solid var(--line);
    -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    border-radius:14px; padding:10px 14px;
    display:flex; flex-direction:column; align-items:center; gap:6px; width:82px;
  }
  .chip svg{width:20px; height:20px;}
  .chip span{font-size:10.5px; color:var(--text-dim); text-align:center; line-height:1.25;}
  .cta-row{display:flex; flex-direction:column; gap:10px; position:relative; z-index:1;}
  .btn{
    min-height:52px; border-radius:var(--radius-md); border:none; font-weight:700; font-size:15.5px;
    display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; width:100%;
  }
  .btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#231400; box-shadow:0 8px 20px rgba(255,122,26,.35);}
  .btn-primary:active{transform:scale(.98);}
  .btn-primary:disabled{opacity:0.5; cursor:not-allowed; transform:none;}
  .btn-outline{background:transparent; color:var(--text); border:1.5px solid rgba(255,255,255,.28);}
  .btn-outline:active{background:rgba(255,255,255,.08);}
  .btn-tg{background:var(--tg-blue); color:#fff;}
  .btn-tg:active{transform:scale(.98);}
  .btn-yandex-nav{
    background:#ffcc00; color:#1a1a1a; border:none; border-radius:var(--radius-md); font-weight:700; font-size:15px;
    display:flex; align-items:center; justify-content:center; gap:8px; min-height:48px; width:100%;
    text-decoration:none; cursor:pointer;
  }
  .btn-yandex-nav:active{transform:scale(.98);}

  /* ============================================================
     TICKER
     ============================================================ */
  .ticker{
    margin:16px 18px 0; background:var(--card-bg); border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    border-radius:var(--radius-sm);
    padding:11px 14px; display:flex; align-items:center; gap:10px;
    font-size:12.5px; color:var(--ink-dim);
  }
  .dot{width:8px; height:8px; border-radius:50%; background:var(--green); flex-shrink:0; animation:pulse 1.8s infinite;}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(63,174,106,.5);} 70%{box-shadow:0 0 0 7px rgba(63,174,106,0);} 100%{box-shadow:0 0 0 0 rgba(63,174,106,0);}}
  .ticker b{color:var(--ink); font-weight:700;}

  /* ============================================================
     SECTION GENERIC
     ============================================================ */
  .section{padding:26px 18px 6px;}
  .section-title{font-family:'Unbounded'; font-weight:700; font-size:19px; margin:0 0 4px;}
  .section-sub{color:var(--ink-dim); font-size:13.5px; margin:0 0 16px; line-height:1.5;}

  /* ============================================================
     CALCULATOR
     ============================================================ */
  .calc-card{
    background:var(--card-bg); border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    border-radius:var(--radius-lg); padding:18px;
  }
  .seg{display:flex; gap:8px; margin-bottom:16px;}
  .seg-btn{
    flex:1; padding:11px 4px; border-radius:12px; border:1.5px solid var(--line); background:rgba(255,255,255,0.05);
    font-weight:700; font-size:13px; color:var(--ink-dim); text-align:center;
  }
  .seg-btn.active{border-color:transparent; color:#fff;}
  .seg-btn[data-fuel="95"].active{background:var(--red);}
  .seg-btn[data-fuel="dt"].active{background:var(--diesel);}
  .seg-btn[data-fuel="92"]{opacity:0.4; cursor:not-allowed; text-decoration:line-through;}

  .stepper-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
  .stepper-label{font-size:13px; color:var(--ink-dim); font-weight:600;}
  .stepper{display:flex; align-items:center; gap:14px;}
  .step-btn{
    width:44px; height:44px; border-radius:12px; border:1px solid var(--line); background:rgba(255,255,255,0.05);
    font-size:20px; font-weight:700; color:var(--ink); display:flex; align-items:center; justify-content:center;
  }
  .step-btn:active{background:rgba(255,255,255,0.12);}
  .step-val{min-width:56px; text-align:center; font-family:'Unbounded'; font-weight:700; font-size:18px;}
  .calc-total{
    display:flex; align-items:baseline; justify-content:space-between;
    background:rgba(255,255,255,0.05); border:1px solid var(--line); border-radius:14px; padding:14px 16px; margin-bottom:14px;
  }
  .calc-total .lbl{font-size:12.5px; color:var(--ink-dim); font-weight:600;}
  .calc-total .val{font-family:'Unbounded'; font-weight:800; font-size:22px;}
  .calc-total .val span{font-size:13px; font-family:'Inter'; color:var(--ink-dim); font-weight:600;}

  /* ============================================================
     PRODUCT CARDS
     ============================================================ */
  .product-card{
    background:var(--card-bg); border-radius:var(--radius-md); padding:14px;
    display:flex; align-items:center; gap:14px; margin-bottom:12px;
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    border:1px solid var(--card-border);
  }
  .product-icon{
    width:56px; height:56px; border-radius:14px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
  }
  .product-icon.p95{background:rgba(255,90,82,.18);}
  .product-icon.pdt{background:rgba(180,188,198,.16);}
  .product-icon.p92{background:rgba(100,100,100,.15); opacity:0.5;}
  .product-icon svg{width:30px; height:30px;}
  .product-info{flex:1; min-width:0;}
  .product-info .name{font-family:'Unbounded'; font-weight:700; font-size:15.5px; margin-bottom:1px;}
  .product-info .type{font-size:11.5px; color:var(--ink-dim); margin-bottom:6px;}
  .product-info .price{font-size:14px; font-weight:700;}
  .product-info .price span{font-weight:500; color:var(--ink-dim); font-size:12px;}
  .product-btn{
    flex-shrink:0; min-height:40px; padding:0 14px; border-radius:10px; font-size:12.5px; font-weight:700; border:1.5px solid;
    background:transparent;
  }
  .product-btn.p95{color:#d63d35; border-color:var(--red);}
  .product-btn.pdt{color:#525a64; border-color:var(--diesel);}
  .product-btn.p92{opacity:0.3; cursor:not-allowed; border-color:#666; color:#666;}

  /* ============================================================
     STEPS
     ============================================================ */
  .steps{display:flex; flex-direction:column; gap:14px;}
  .step-item{display:flex; gap:14px; align-items:flex-start;}
  .step-num{
    width:34px; height:34px; border-radius:10px; background:var(--bg-dark); color:var(--accent-2);
    font-family:'Unbounded'; font-weight:700; font-size:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .step-text b{display:block; font-size:14.5px; margin-bottom:2px;}
  .step-text span{font-size:13px; color:var(--ink-dim); line-height:1.45;}

  /* ============================================================
     WHY US
     ============================================================ */
  .why-list{display:flex; flex-direction:column; gap:12px;}
  .why-item{
    display:flex; gap:12px; align-items:center; background:var(--card-bg); border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    border-radius:14px; padding:13px 14px;
  }
  .why-item .ic{width:34px; height:34px; border-radius:10px; background:rgba(255,122,26,.18); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
  .why-item .ic svg{width:18px; height:18px;}
  .why-item span{font-size:13.5px; font-weight:600; line-height:1.35;}

  /* ============================================================
     MAP CARD
     ============================================================ */
  .map-card{
    background:var(--card-bg); border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    border-radius:var(--radius-lg); padding:18px; margin:0 18px 12px;
  }
  .map-card .map-title{font-weight:700; font-size:16px; margin-bottom:4px;}
  .map-card .map-sub{color:var(--text-dim); font-size:13px; margin-bottom:14px;}
  .map-card .map-placeholder{
    background:#1a1e26; border-radius:12px; height:160px; display:flex; flex-direction:column;
    align-items:center; justify-content:center; color:var(--text-dim); font-size:13px; gap:6px;
    border:1px dashed var(--line); margin-bottom:14px;
  }
  .map-card .map-placeholder i{font-size:28px; color:var(--accent);}
  .map-card .map-coords{font-size:12px; color:var(--text-dim); text-align:center; margin-bottom:12px;}
  .map-card .map-coords b{color:var(--text);}

  /* ============================================================
     FORM
     ============================================================ */
  .form-card{
    background:var(--card-bg); border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(22px) saturate(150%); backdrop-filter:blur(22px) saturate(150%);
    border-radius:var(--radius-lg); padding:20px; color:var(--text);
  }
  .form-card .section-title, .form-card .section-sub{color:var(--text);}
  .form-card .section-sub{color:var(--text-dim);}

  .field{margin-bottom:12px;}
  .field label{display:block; font-size:12px; color:var(--text-dim); margin-bottom:6px; font-weight:600;}
  .field label .required{color:#ff5a52;}
  .field label .geo-badge{background:rgba(63,174,106,0.2); color:#3fae6a; font-size:9px; padding:2px 8px; border-radius:20px; margin-left:6px; font-weight:700;}

  .form-input{
    width:100%; min-height:50px; border-radius:12px; border:1.5px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,0.05); color:var(--text); padding:0 14px; font-size:16px;
    font-family:'Inter',sans-serif; transition:border-color 0.2s ease;
  }
  .form-input:focus{outline:none; border-color:var(--accent);}
  .form-input::placeholder{color:#6b7280;}
  textarea.form-input{padding:14px; resize:vertical; min-height:80px;}
  select.form-input{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a7adb8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:40px;}
  .form-input.geo-filled{border-color:var(--green); background:rgba(63,174,106,0.08);}

  .consent-wrap{
    display:flex; align-items:flex-start; gap:12px; margin:16px 0;
    background:rgba(255,255,255,0.04); padding:14px 16px; border-radius:12px;
    border:1px solid rgba(255,255,255,.08);
  }
  .consent-wrap input[type="checkbox"]{
    width:20px; height:20px; margin-top:2px; flex-shrink:0; cursor:pointer;
    accent-color:var(--accent);
  }
  .consent-wrap label{font-size:0.85rem; color:var(--text-dim); cursor:pointer; line-height:1.4;}
  .consent-wrap label a{color:var(--accent); text-decoration:none;}
  .consent-wrap label a:hover{text-decoration:underline;}

  #form-messages .message{
    padding:12px 16px; border-radius:12px; font-weight:600; font-size:13px;
    display:flex; align-items:center; gap:10px; transition:opacity 0.3s ease;
  }
  #form-messages .message.success{
    background:rgba(63,174,106,0.15); border:1px solid var(--green); color:#bfe9cf;
  }
  #form-messages .message.error{
    background:rgba(255,90,82,0.15); border:1px solid var(--red); color:#ffb0ab;
  }
  #form-messages .message i{font-size:18px;}

  .form-note{font-size:11px; color:var(--text-dim); text-align:center; margin-top:10px; line-height:1.5;}

  /* ============================================================
     FAQ
     ============================================================ */
  .faq-item{
    background:var(--card-bg);
    border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%);
    backdrop-filter:blur(18px) saturate(140%);
    border-radius:14px;
    margin-bottom:10px;
    overflow:hidden;
  }
  .faq-q{
    width:100%;
    text-align:left;
    padding:15px 16px;
    background:none;
    border:none;
    font-weight:700;
    font-size:13.5px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    color:var(--text);
    cursor:pointer;
  }
  .faq-q .plus{
    font-size:18px;
    color:var(--accent);
    transition:transform .2s ease;
    flex-shrink:0;
  }
  .faq-item.open .plus{transform:rotate(45deg);}
  .faq-a{
    max-height:0;
    overflow:hidden;
    transition:max-height .25s ease;
  }
  .faq-a p{
    margin:0;
    padding:0 16px 15px;
    font-size:13px;
    color:#d0d5dd;
    line-height:1.6;
    font-weight:400;
  }

  /* ============================================================
     FOOTER
     ============================================================ */
  footer{padding:26px 18px 10px; text-align:center;}
  footer .fbrand{font-family:'Unbounded'; font-weight:700; font-size:15px; margin-bottom:6px;}
  footer p{font-size:12px; color:var(--ink-dim); margin:3px 0; line-height:1.5;}

  /* ============================================================
     BOTTOM NAV
     ============================================================ */
  .bottom-nav{
    position:fixed; left:0; right:0; bottom:0; z-index:60;
    max-width:480px; margin:0 auto;
    display:grid; grid-template-columns:1fr 1fr 1fr 1fr;
    background:rgba(20,23,29,0.6);
    -webkit-backdrop-filter:blur(22px) saturate(150%);
    backdrop-filter:blur(22px) saturate(150%);
    border-top:1px solid var(--line);
    padding:10px 8px calc(10px + var(--safe-b));
    gap:8px;
  }
  .nav-btn{
    min-height:52px; border:none; border-radius:14px; color:#fff; font-size:11px; font-weight:700;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    text-decoration:none;
  }
  .nav-btn svg{width:19px; height:19px;}
  .nav-btn.call{background:var(--green);}
  .nav-btn.tg{background:var(--tg-blue);}
  .nav-btn.price{background:rgba(255,255,255,0.08); border:1.5px solid var(--line);}
  .nav-btn.order{background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#231400;}
  .nav-btn:active{transform:scale(.96);}

  /* ============================================================
     GEO BANNER
     ============================================================ */
  .geo-banner{
    background:rgba(63,174,106,0.12);
    border:1px solid rgba(63,174,106,0.3);
    border-radius:var(--radius-sm);
    padding:10px 14px;
    margin:12px 18px 16px;
    display:flex;
    align-items:center;
    gap:12px;
    font-size:12px;
    color:var(--text-dim);
    cursor:pointer;
    transition:all 0.3s ease;
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
  }
  .geo-banner:hover{background:rgba(63,174,106,0.2);}
  .geo-banner .geo-icon{color:var(--green); font-size:16px; flex-shrink:0;}
  .geo-banner .geo-text{flex:1;}
  .geo-banner .geo-btn{
    background:var(--green);
    border:none;
    color:#fff;
    padding:4px 14px;
    border-radius:20px;
    font-size:11px;
    font-weight:700;
    cursor:pointer;
    flex-shrink:0;
  }
  .geo-banner .geo-btn:active{transform:scale(.95);}

  /* ============================================================
     SCHEDULE CARD
     ============================================================ */
  .schedule-card{
    background:var(--card-bg); border:1px solid var(--card-border);
    -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
    border-radius:var(--radius-lg); padding:16px 18px; margin:0 18px 12px;
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  }
  .schedule-card .sch-icon{font-size:24px; color:var(--accent);}
  .schedule-card .sch-text{flex:1; font-size:13px; line-height:1.5;}
  .schedule-card .sch-text b{color:var(--text);}
  .schedule-card .sch-badge{
    background:rgba(255,122,26,0.15); color:var(--accent-2); padding:4px 12px; border-radius:20px; font-size:11px; font-weight:700;
  }

  /* ============================================================
     МОДАЛЬНОЕ ОКНО ДЛЯ ПОЛИТИКИ
     ============================================================ */
  .privacy-modal {
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.85);
    z-index:1000;
    padding:20px;
    align-items:center;
    justify-content:center;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  .privacy-modal.open {
    display:flex;
  }
  .privacy-modal-content {
    background:#1c212a;
    border-radius:22px;
    max-width:480px;
    width:100%;
    max-height:90vh;
    overflow-y:auto;
    padding:24px;
    border:1px solid rgba(255,255,255,0.1);
    position:relative;
    animation:modalIn 0.3s ease;
  }
  @keyframes modalIn {
    0% { transform:scale(0.95); opacity:0; }
    100% { transform:scale(1); opacity:1; }
  }
  .privacy-modal-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
    position:sticky;
    top:0;
    background:#1c212a;
    padding-bottom:12px;
    border-bottom:1px solid rgba(255,255,255,0.06);
    z-index:1;
  }
  .privacy-modal-header h3 {
    font-family:'Unbounded';
    font-weight:700;
    font-size:18px;
    color:#f5f6f8;
    margin:0;
  }
  .privacy-close {
    background:none;
    border:none;
    color:#a7adb8;
    font-size:24px;
    cursor:pointer;
    width:40px;
    height:40px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:background 0.2s;
  }
  .privacy-close:hover {
    background:rgba(255,255,255,0.05);
  }
  .privacy-body {
    color:#d0d5dd;
    font-size:14px;
    line-height:1.8;
  }
  .privacy-body p {margin:0 0 12px 0;}
  .privacy-body strong {color:#f5f6f8;}
  .privacy-body ul {
    margin:8px 0 16px 0;
    padding-left:20px;
  }
  .privacy-body ul li {margin-bottom:4px;}
  .privacy-body .date {
    font-size:12px;
    color:#6b7280;
    margin-top:16px;
    padding-top:12px;
    border-top:1px solid rgba(255,255,255,0.06);
  }

  /* ============================================================
     MEDIA
     ============================================================ */
  @media (max-width:400px){
    .hero h1{font-size:20px;}
    .chip{width:70px; padding:8px 10px;}
    .chip span{font-size:9px;}
  }