/* Single committed dark identity — brand is navy + gold, no light variant */
  :root{
    --bg:#08111e;
    --surface:#0e1c2e;
    --surface-hi:#122336;
    --text:#f3f4f6;
    --text-soft:#94a3b8;
    --gold:#c9a463;
    --gold-light:#e6c88b;
    --gold-dark:#9c7a38;
    --border:rgba(201,164,99,0.2);
    --crest-a:#1c3450;
    --crest-b:#081019;
    --topbar-h:0rem;
    --nav-h:5.4rem;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  #top, section[id]{scroll-margin-top:calc(var(--topbar-h) + var(--nav-h));}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
  }

  body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:"Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
    font-weight:300;
    font-size:16px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
  }

  h1,h2,h3{
    font-family:"Cinzel", "Times New Roman", serif;
    text-wrap:balance;
    margin:0;
  }

  a{color:inherit;}

  .wrap{
    max-width:74rem;
    margin:0 auto;
    padding-inline:1.75rem;
    position:relative;
  }

  .eyebrow{
    font-family:"Plus Jakarta Sans", sans-serif;
    font-weight:600;
    font-size:0.78rem;
    letter-spacing:0.28em;
    text-transform:uppercase;
    color:var(--gold);
  }

  /* ambient glow, brand signature rather than per-section decoration */
  .glow{
    position:absolute;
    inset:0;
    background:radial-gradient(60% 55% at 50% 0%, rgba(30,58,95,0.55) 0%, rgba(8,17,30,0) 70%);
    pointer-events:none;
    z-index:0;
  }

  /* ornamental section divider — echoes the shield's quartering lines */
  .divider{
    display:flex;
    align-items:center;
    justify-content:center;
    height:1px;
    background:linear-gradient(90deg, transparent, var(--border) 30%, var(--border) 70%, transparent);
  }
  .divider i{
    display:block;
    width:7px;
    height:7px;
    background:var(--gold);
    transform:rotate(45deg);
    flex-shrink:0;
  }


  /* ===== Nav ===== */
  .nav{
    position:sticky;
    top:var(--topbar-h);
    z-index:40;
    background:rgba(8,17,30,0.75);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .nav-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.5rem;
    min-height:var(--nav-h);
    flex-wrap:wrap;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:0.75rem;
    text-decoration:none;
    color:var(--text);
  }
  .brand svg, .brand img{width:2.6rem;height:2.6rem;flex-shrink:0; filter:drop-shadow(0 0 6px rgba(201,164,99,0.35)); object-fit:contain;}
  .brand-word{
    font-family:"Cinzel", serif;
    font-weight:700;
    font-size:1.2rem;
    letter-spacing:0.14em;
    line-height:1.1;
  }
  .brand-word span{
    display:block;
    font-family:"Plus Jakarta Sans", sans-serif;
    font-weight:600;
    font-size:0.68rem;
    letter-spacing:0.32em;
    color:var(--gold);
    margin-top:0.25rem;
  }
  .nav-links{
    display:flex;
    align-items:center;
    gap:2.6rem;
    list-style:none;
    margin:0;
    padding:0;
    font-size:1.02rem;
    font-weight:500;
  }
  .nav-links a{
    text-decoration:none;
    color:var(--text-soft);
    transition:color 0.2s ease;
    position:relative;
  }
  .nav-links a::after{
    content:"";
    position:absolute;
    left:0; right:100%;
    bottom:-4px;
    height:1px;
    background:var(--gold);
    transition:right 0.25s ease;
  }
  .nav-links a:hover, .nav-links a:focus-visible{color:var(--gold-light);}
  .nav-links a:hover::after, .nav-links a:focus-visible::after{right:0;}
  @media (max-width:820px){.nav-links{display:none;}}
  .nav-cta{padding:0.85rem 1.8rem; font-size:0.85rem;}

  .nav-burger{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:2.4rem;
    height:2.4rem;
    padding:0;
    background:none;
    border:1px solid rgba(255,255,255,0.15);
    border-radius:4px;
    cursor:pointer;
  }
  .nav-burger span{
    display:block;
    width:1.2rem;
    height:2px;
    margin-inline:auto;
    background:var(--gold-light);
    transition:transform 0.25s ease, opacity 0.2s ease;
  }
  .nav-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .nav-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  @media (max-width:820px){
    .nav-burger{display:flex;}
    .nav-cta{display:none;}
    :root{--nav-h:4.4rem;}
    .brand svg, .brand img{width:2.1rem; height:2.1rem;}
    .brand-word{font-size:1rem;}
    .brand-word span{font-size:0.58rem;}
  }

  .mobile-menu{
    display:none;
    flex-direction:column;
    gap:1.2rem;
    padding:0 1.75rem 1.5rem;
    border-top:1px solid var(--border);
    background:rgba(8,17,30,0.98);
  }
  .mobile-menu.open{display:flex;}
  .mobile-menu-links{list-style:none; margin:1.2rem 0 0; padding:0; display:flex; flex-direction:column; gap:1rem;}
  .mobile-menu-links a{text-decoration:none; color:var(--text); font-size:1rem; font-weight:500;}
  .mobile-menu-links a:hover, .mobile-menu-links a:focus-visible{color:var(--gold-light);}
  .mobile-menu .btn{align-self:flex-start;}
  @media (min-width:821px){.mobile-menu{display:none !important;}}

  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:0.5rem;
    padding:0.7rem 1.5rem;
    border-radius:4px;
    font-weight:600;
    font-size:0.78rem;
    letter-spacing:0.07em;
    text-transform:uppercase;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform 0.3s cubic-bezier(.16,1,.3,1), box-shadow 0.3s ease, background 0.3s ease, border-color 0.2s ease, color 0.2s ease;
  }
  .btn:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
  .btn-gold{
    background:linear-gradient(135deg, var(--gold), var(--gold-dark));
    color:#0c1524;
    border:1px solid var(--gold-light);
    box-shadow:0 4px 15px rgba(201,164,99,0.25);
  }
  .btn-gold:hover{
    background:linear-gradient(135deg, var(--gold-light), var(--gold));
    transform:translateY(-2px);
    box-shadow:0 8px 25px rgba(201,164,99,0.35);
  }
  .btn-outline{
    background:rgba(255,255,255,0.02);
    color:var(--text);
    border:1px solid rgba(255,255,255,0.18);
  }
  .btn-outline:hover{
    background:rgba(255,255,255,0.06);
    border-color:var(--gold);
    color:var(--gold-light);
    transform:translateY(-2px);
  }

  /* ===== Hero ===== */
  .hero{
    position:relative;
    overflow:hidden;
    border-bottom:1px solid rgba(201,164,99,0.14);
    min-height:calc(100dvh - var(--topbar-h) - var(--nav-h));
    display:flex;
    align-items:flex-start;
    background-image:
      radial-gradient(circle at 50% 20%, rgba(201,164,99,0.12) 0%, transparent 40%),
      radial-gradient(circle at 50% 45%, #10243e 0%, #070d18 70%);
  }
  .hero-photo{
    background-image:
      linear-gradient(180deg, rgba(7,13,24,0.3) 0%, rgba(7,13,24,0.6) 45%, var(--bg) 94%),
      url('../img/splash.jpg');
    background-size:cover;
    background-position:center 22%;
    background-repeat:no-repeat;
  }
  .hero-photo::after{display:none;}
  .hero-photo .glow{display:none;}
  .hero::after{
    content:"";
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px),
      linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size:55px 55px;
    -webkit-mask-image:radial-gradient(circle at 50% 50%, black 40%, transparent 85%);
    mask-image:radial-gradient(circle at 50% 50%, black 40%, transparent 85%);
    pointer-events:none;
  }
  .hero-inner{
    position:relative;
    z-index:1;
    padding-block:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:clamp(0.5rem, 1.6vh, 1.05rem);
    max-width:46rem;
    margin-inline:auto;
  }
  .hero-photo .hero-inner{
    padding-top:clamp(7rem, 24vh, 11rem);
    padding-bottom:2rem;
  }
  @media (max-width:640px){
    .hero-photo .hero-inner{padding-top:clamp(5rem, 16vh, 7.5rem); padding-bottom:1.4rem;}
  }
  .hero h1{
    font-size:clamp(2.2rem, 6vw, 5.6rem);
    font-weight:800;
    letter-spacing:0.15em;
    text-transform:uppercase;
    line-height:1.05;
    background:linear-gradient(180deg, #ffffff 40%, #cbd5e1 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    text-shadow:0 0 42px rgba(201,164,99,0.4), 0 6px 22px rgba(0,0,0,0.5);
  }
  .hero-sub{
    font-family:"Plus Jakarta Sans", sans-serif;
    font-size:clamp(1.25rem, 4.4vw, 2.15rem);
    font-weight:700;
    letter-spacing:0.32em;
    text-transform:uppercase;
    color:var(--gold-light);
    text-shadow:0 0 24px rgba(201,164,99,0.35);
    margin-top:-1.2rem;
  }
  .pillars{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:1rem;
    font-size:0.8rem;
    font-weight:600;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:#cbd5e1;
  }
  .pillar-dot{
    width:4px;
    height:4px;
    border-radius:50%;
    background:var(--gold);
    flex-shrink:0;
  }
  @media (max-width:640px){.pillars{flex-direction:column; gap:0.4rem;} .pillar-dot{display:none;}}
  .hero p.lede{
    color:var(--text-soft);
    font-size:clamp(0.95rem, 2vh, 1.1rem);
    line-height:1.65;
  }
  .hero-ctas{
    display:flex;
    gap:1.1rem;
    flex-wrap:wrap;
    justify-content:center;
    margin-top:1.6rem;
  }

  /* ===== Reveal-on-scroll ===== */
  .reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity 0.7s ease, transform 0.7s ease;
  }
  .reveal.in-view{opacity:1; transform:translateY(0);}

  /* ===== Sections ===== */
  section{padding-block:5rem; position:relative;}
  .section-head{max-width:38rem; margin-bottom:2.75rem;}
  .section-head h2{
    font-size:clamp(1.7rem, 3.2vw, 2.3rem);
    margin-top:0.6rem;
    font-weight:700;
    color:var(--text);
  }

  /* Services */
  .services{background:var(--bg);}
  .card-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; position:relative; z-index:1;}
  @media (max-width:920px){.card-grid{grid-template-columns:repeat(2,1fr);}}
  @media (max-width:560px){.card-grid{grid-template-columns:1fr;}}
  .card{
    position:relative;
    overflow:hidden;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:6px;
    display:flex;
    flex-direction:column;
    opacity:0;
    transform:translateY(16px);
    cursor:pointer;
    transition:opacity 0.6s ease, transform 0.6s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  }
  .card-media{
    height:8.5rem;
    overflow:hidden;
    position:relative;
  }
  .card-media img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    filter:saturate(0.85) brightness(0.85);
    transition:transform 0.5s cubic-bezier(.16,1,.3,1), filter 0.4s ease;
  }
  .card:hover .card-media img{transform:scale(1.06); filter:saturate(1) brightness(0.9);}
  .card-media::after{
    content:"";
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(8,17,30,0.05) 40%, var(--surface) 100%);
  }
  .card-body{
    padding:1.5rem 1.6rem 1.8rem;
    display:flex;
    flex-direction:column;
    gap:1rem;
    flex:1;
  }
  .card:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
  .card-more{
    margin-top:auto;
    padding-top:0.4rem;
    display:flex;
    align-items:center;
    gap:0.4rem;
    font-size:0.76rem;
    font-weight:700;
    letter-spacing:0.05em;
    text-transform:uppercase;
    color:var(--gold);
  }
  .card-more svg{width:0.85rem; height:0.85rem; transition:transform 0.25s ease;}
  .card:hover .card-more svg{transform:translateX(4px);}
  .card::before{
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:2px;
    background:linear-gradient(90deg, var(--gold-dark), var(--gold), var(--gold-light));
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 0.35s ease;
  }
  .card:nth-child(1){transition-delay:0s;}
  .card:nth-child(2){transition-delay:0.08s;}
  .card:nth-child(3){transition-delay:0.16s;}
  .card:nth-child(4){transition-delay:0.24s;}
  .card.in-view{opacity:1; transform:translateY(0);}
  .card:hover{border-color:var(--gold); box-shadow:0 14px 34px rgba(0,0,0,0.4); transform:translateY(-4px);}
  .card:hover::before{transform:scaleX(1);}
  .card-icon{width:2.6rem; height:2.6rem; color:var(--gold); transition:color 0.25s ease;}
  .card:hover .card-icon{color:var(--gold-light);}
  .card h3{
    font-family:"Plus Jakarta Sans", sans-serif;
    font-weight:700;
    font-size:1rem;
    letter-spacing:0.01em;
    color:var(--text);
  }
  .card p{margin:0; font-size:0.9rem; color:var(--text-soft); line-height:1.65; font-weight:300;}

  /* About */
  .about{background:var(--surface);}
  .about-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:3.5rem; align-items:start; position:relative; z-index:1;}
  @media (max-width:840px){.about-grid{grid-template-columns:1fr;}}
  .about-copy p{color:var(--text-soft); font-size:1.02rem; line-height:1.8; max-width:36rem; font-weight:300;}
  .about-copy p.about-highlight{
    color:var(--gold-light);
    font-family:"Cinzel", serif;
    font-weight:600;
    font-size:1.05rem;
    line-height:1.6;
    padding-top:0.5rem;
    border-top:1px solid var(--border);
  }
  .pillars-list{display:flex; flex-direction:column; border-top:1px solid var(--border);}
  .pillar-row{display:flex; gap:1rem; padding-block:1.2rem; border-bottom:1px solid var(--border); transition:padding-left 0.25s ease, background 0.25s ease;}
  .pillar-row:hover{padding-left:0.4rem; background:rgba(201,164,99,0.04);}
  .pillar-row .mark{font-family:"Cinzel", serif; font-weight:600; color:var(--gold); font-size:0.95rem; flex-shrink:0;}
  .pillar-row div h4{margin:0 0 0.3rem; font-size:0.98rem; font-weight:700;}
  .pillar-row div p{margin:0; font-size:0.88rem; color:var(--text-soft); font-weight:300;}

  /* Mission / Vision */
  .mission{background:var(--bg);}
  .mission-grid{display:grid; grid-template-columns:1fr 1fr; gap:1.75rem; position:relative; z-index:1;}
  @media (max-width:760px){.mission-grid{grid-template-columns:1fr;}}
  .mission-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:8px;
    padding:2.2rem;
    transition:border-color 0.25s ease, box-shadow 0.25s ease;
  }
  .mission-card:hover{border-color:var(--gold); box-shadow:0 14px 34px rgba(0,0,0,0.35);}
  .mission-card h3{
    font-family:"Cinzel", serif;
    font-size:1.3rem;
    color:var(--gold-light);
    margin:0 0 1.1rem;
  }
  .mission-card p{color:var(--text-soft); font-size:0.95rem; line-height:1.75; font-weight:300; margin:0 0 1rem;}
  .mission-card p:last-child{margin-bottom:0;}

  /* FAQ */
  .faq{background:var(--surface);}
  .faq-list{max-width:52rem; margin-inline:auto; border-top:1px solid var(--border); position:relative; z-index:1;}
  .faq-item{border-bottom:1px solid var(--border);}
  .faq-item summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.2rem;
    padding:1.3rem 0;
    cursor:pointer;
    font-family:"Plus Jakarta Sans", sans-serif;
    font-weight:700;
    font-size:1rem;
    color:var(--text);
    list-style:none;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::marker{content:"";}
  .faq-item:hover summary{color:var(--gold-light);}
  .faq-chevron{width:1.1rem; height:1.1rem; color:var(--gold); flex-shrink:0; transition:transform 0.25s ease;}
  .faq-item[open] .faq-chevron{transform:rotate(180deg);}
  .faq-item p{margin:0 0 1.4rem; color:var(--text-soft); font-size:0.92rem; line-height:1.75; font-weight:300; padding-right:2.1rem;}

  /* Contact */
  .contact{background:var(--bg); border-top:1px solid var(--border);}
  .contact-inner{display:grid; grid-template-columns:1fr 1fr; gap:3rem; position:relative; z-index:1;}
  @media (max-width:840px){.contact-inner{grid-template-columns:1fr;}}
  .contact h2{font-size:clamp(1.7rem, 3.2vw, 2.3rem);}
  .contact-copy p{color:var(--text-soft); max-width:30rem; line-height:1.75; font-weight:300;}
  .contact-list{list-style:none; margin:2rem 0 0; padding:0; display:flex; flex-direction:column; gap:1.1rem;}
  .contact-list li{display:flex; gap:0.9rem; align-items:flex-start; font-size:0.98rem; font-weight:400;}
  .contact-list svg{width:1.15rem; height:1.15rem; color:var(--gold); flex-shrink:0; margin-top:0.15rem;}
  .contact-list a{text-decoration:none; color:var(--text);}
  .contact-list a:hover{color:var(--gold-light);}
  .contact-card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:6px;
    padding:2.2rem;
    display:flex;
    flex-direction:column;
    gap:1.4rem;
    transition:border-color 0.25s ease, box-shadow 0.25s ease;
  }
  .contact-card:hover{border-color:var(--gold); box-shadow:0 14px 34px rgba(0,0,0,0.35);}
  .contact-card h3{font-family:"Cinzel", serif; font-size:1.1rem;}
  .contact-card p{color:var(--text-soft); margin:0; font-size:0.92rem; font-weight:300;}
  .contact-card .btn-gold{width:100%;}

  /* Service detail modal */
  .modal-overlay{
    position:fixed;
    inset:0;
    z-index:70;
    background:rgba(4,8,14,0.72);
    backdrop-filter:blur(4px);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1.5rem;
    opacity:0;
    visibility:hidden;
    transition:opacity 0.25s ease, visibility 0.25s ease;
  }
  .modal-overlay.open{opacity:1; visibility:visible;}
  .modal{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:10px;
    max-width:32rem;
    width:100%;
    max-height:88vh;
    overflow-y:auto;
    position:relative;
    transform:translateY(18px) scale(0.98);
    transition:transform 0.35s cubic-bezier(.16,1,.3,1);
    box-shadow:0 30px 70px rgba(0,0,0,0.5);
  }
  .modal-overlay.open .modal{transform:translateY(0) scale(1);}
  .modal-visual{
    height:12rem;
    position:relative;
    overflow:hidden;
    border-bottom:1px solid var(--border);
  }
  .modal-visual img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
  }
  .modal-visual::after{
    content:"";
    position:absolute; inset:0;
    background:linear-gradient(0deg, var(--surface) 0%, rgba(14,28,46,0) 45%);
  }
  .modal-visual .modal-badge{
    position:absolute;
    left:1.2rem; bottom:0.9rem;
    z-index:2;
    width:2.6rem; height:2.6rem;
    border-radius:50%;
    background:var(--gold);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 16px rgba(0,0,0,0.4);
  }
  .modal-visual .modal-badge svg{width:1.35rem; height:1.35rem; color:#0c1524;}
  .modal-body{padding:1.7rem 2rem 2.1rem;}
  .modal-body h3{font-size:1.35rem; margin-top:0.5rem; color:var(--text);}
  .modal-body > p{color:var(--text-soft); font-size:0.95rem; line-height:1.75; margin:0.9rem 0 0;}
  .modal-list{list-style:none; margin:1.3rem 0 0; padding:0; display:flex; flex-direction:column; gap:0.65rem;}
  .modal-list li{display:flex; gap:0.65rem; align-items:flex-start; font-size:0.88rem; color:var(--text-soft); line-height:1.5;}
  .modal-list li::before{content:""; width:5px; height:5px; border-radius:50%; background:var(--gold); margin-top:0.5rem; flex-shrink:0;}
  .modal-close{margin-top:1.5rem;}

  /* WhatsApp floating button */
  .whatsapp-fab{
    position:fixed;
    right:1.5rem;
    bottom:1.5rem;
    z-index:60;
    width:3.4rem;
    height:3.4rem;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg, #25d366, #1da851);
    color:#fff;
    box-shadow:0 10px 26px rgba(0,0,0,0.4), 0 0 0 0 rgba(37,211,102,0.55);
    animation:wa-pulse 2.6s infinite;
    transition:transform 0.25s cubic-bezier(.16,1,.3,1), box-shadow 0.25s ease;
  }
  .whatsapp-fab svg{width:1.7rem; height:1.7rem;}
  .whatsapp-fab:hover{transform:translateY(-3px) scale(1.05); box-shadow:0 14px 32px rgba(0,0,0,0.45);}
  .whatsapp-fab:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
  @keyframes wa-pulse{
    0%{box-shadow:0 10px 26px rgba(0,0,0,0.4), 0 0 0 0 rgba(37,211,102,0.5);}
    70%{box-shadow:0 10px 26px rgba(0,0,0,0.4), 0 0 0 12px rgba(37,211,102,0);}
    100%{box-shadow:0 10px 26px rgba(0,0,0,0.4), 0 0 0 0 rgba(37,211,102,0);}
  }
  @media (max-width:640px){.whatsapp-fab{right:1rem; bottom:1rem; width:3.1rem; height:3.1rem;}}

  /* Footer */
  footer{background:var(--surface); border-top:1px solid var(--border); padding-block:2.2rem;}
  .foot-row{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;}
  .foot-brand{display:flex; align-items:center; gap:0.7rem; color:var(--text-soft); font-size:0.85rem;}
  .foot-brand svg{width:1.5rem; height:1.5rem;}
  footer p{margin:0; font-size:0.8rem; color:var(--text-soft); font-variant-numeric:tabular-nums;}

  /* ===== Boot / access overlay ===== */
  .boot-overlay{
    position:fixed;
    inset:0;
    z-index:200;
    display:flex;
    align-items:center;
    justify-content:center;
    background:
      radial-gradient(circle at 50% 42%, rgba(201,164,99,0.14) 0%, transparent 55%),
      var(--bg);
    animation:boot-fade 0.7s ease 3.8s forwards;
    padding:1.5rem;
    overflow-y:auto;
  }
  .boot-overlay::after{
    content:"";
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px),
      linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size:55px 55px;
    -webkit-mask-image:radial-gradient(circle at 50% 50%, black 30%, transparent 75%);
    mask-image:radial-gradient(circle at 50% 50%, black 30%, transparent 75%);
  }
  .boot-inner{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:1.4rem;
  }
  .boot-logo-wrap{
    position:relative;
    width:min(46vw, 9.5rem);
    height:min(46vw, 9.5rem);
    flex-shrink:0;
  }
  .boot-swirl{
    position:absolute;
    top:-2.6rem;
    left:-2.6rem;
    width:min(calc(46vw + 5.2rem), 14.7rem);
    height:min(calc(46vw + 5.2rem), 14.7rem);
    pointer-events:none;
    animation:boot-swirl-rotate 16s linear infinite;
  }
  .boot-swirl-path{animation:boot-swirl-dash 3.2s linear infinite;}
  @keyframes boot-swirl-rotate{to{transform:rotate(360deg);}}
  @keyframes boot-swirl-dash{to{stroke-dashoffset:-470;}}
  .boot-logo-img{
    position:relative;
    display:block;
    z-index:1;
    width:100%;
    height:100%;
    object-fit:contain;
    filter:drop-shadow(0 10px 26px rgba(0,0,0,0.5)) drop-shadow(0 0 30px rgba(201,164,99,0.35));
    opacity:0;
    transform:translateY(10px) scale(0.97);
    animation:boot-logo-in 0.8s cubic-bezier(.2,.8,.2,1) forwards;
  }
  @keyframes boot-logo-in{to{opacity:1; transform:translateY(0) scale(1);}}
  .boot-caption{
    margin:0;
    font-family:"Plus Jakarta Sans", sans-serif;
    font-size:0.72rem;
    font-weight:600;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--gold-light);
    opacity:0;
    animation:boot-caption 1.3s ease forwards;
  }
  @keyframes boot-caption{
    0%{opacity:0; transform:translateY(4px);}
    15%{opacity:1; transform:translateY(0);}
    72%{opacity:1;}
    88%{opacity:0;}
    100%{opacity:0;}
  }
  .boot-welcome{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0.5rem;
    opacity:0;
    transform:translateY(10px);
    animation:boot-welcome-in 0.9s cubic-bezier(.16,1,.3,1) 1.15s forwards;
  }
  @keyframes boot-welcome-in{to{opacity:1; transform:translateY(0);}}
  .boot-welcome-eyebrow{
    font-family:"Plus Jakarta Sans", sans-serif;
    font-size:clamp(0.7rem, 2.4vw, 0.85rem);
    font-weight:600;
    letter-spacing:0.34em;
    text-transform:uppercase;
    color:var(--gold);
  }
  .boot-welcome-title{
    font-family:"Cinzel", serif;
    font-weight:700;
    font-size:clamp(1.5rem, 6vw, 2.4rem);
    letter-spacing:0.03em;
    text-transform:uppercase;
    text-align:center;
    max-width:22rem;
    background:linear-gradient(180deg, #ffffff 30%, var(--gold-light) 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    text-shadow:0 0 34px rgba(201,164,99,0.4);
  }
  .boot-welcome-sub{
    display:flex;
    align-items:center;
    gap:0.7rem;
    font-family:"Plus Jakarta Sans", sans-serif;
    font-size:clamp(0.8rem, 2.6vw, 1rem);
    font-weight:600;
    letter-spacing:0.4em;
    text-transform:uppercase;
    color:var(--gold-light);
  }
  .boot-welcome-sub i{
    display:block;
    width:1.6rem;
    height:1px;
    background:linear-gradient(90deg, transparent, var(--gold));
  }
  .boot-welcome-sub i:last-child{background:linear-gradient(90deg, var(--gold), transparent);}
  .boot-icons{
    display:flex;
    gap:1.4rem;
    opacity:0;
    animation:boot-fade-in 0.6s ease 2.05s forwards;
  }
  .boot-icons svg{width:1.15rem; height:1.15rem; color:var(--gold);}
  .boot-tagline{
    margin:0;
    font-size:clamp(0.66rem, 2vw, 0.76rem);
    font-weight:500;
    letter-spacing:0.08em;
    color:var(--text-soft);
    text-align:center;
    opacity:0;
    animation:boot-fade-in 0.6s ease 2.3s forwards;
  }
  @keyframes boot-fade-in{to{opacity:1;}}
  @keyframes boot-fade{to{opacity:0; visibility:hidden;}}
  @media (max-width:360px){
    .boot-logo-wrap{width:min(60vw, 11rem); height:min(60vw, 11rem);}
    .boot-swirl{width:min(calc(60vw + 5.2rem), 16.2rem); height:min(calc(60vw + 5.2rem), 16.2rem);}
    .boot-inner{gap:1.1rem;}
    .boot-icons{gap:1rem;}
  }
  @media (prefers-reduced-motion: reduce){
    .boot-overlay{animation-delay:0.4s;}
  }