/* 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:#122336;
    --crest-b:#0a1420;
    --topbar-h:2.2rem;
    --nav-h:4.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;
  }

  /* ===== Topbar ===== */
  .topbar{
    position:sticky;
    top:0;
    z-index:41;
    background:#060c16;
    border-bottom:1px solid rgba(255,255,255,0.05);
  }
  .topbar-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    min-height:var(--topbar-h);
    font-size:0.72rem;
    color:var(--text-soft);
    flex-wrap:wrap;
  }
  .topbar-status{display:flex; align-items:center; gap:0.55rem; letter-spacing:0.02em;}
  .topbar-247{color:var(--gold-light); font-weight:700; letter-spacing:0.04em;}
  .pulse{
    width:6px; height:6px; border-radius:50%;
    background:#5fd67a;
    animation:pulse 2.2s infinite;
    flex-shrink:0;
  }
  @keyframes pulse{
    0%{box-shadow:0 0 0 0 rgba(95,214,122,0.55);}
    70%{box-shadow:0 0 0 6px rgba(95,214,122,0);}
    100%{box-shadow:0 0 0 0 rgba(95,214,122,0);}
  }
  .topbar-clock{
    font-variant-numeric:tabular-nums;
    display:flex;
    gap:0.5rem;
    white-space:nowrap;
  }
  .topbar-clock .sep{color:var(--gold); opacity:0.55;}
  @media (max-width:700px){.topbar-status .locale{display:none;}}

  /* ===== 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{width:2.1rem;height:2.1rem;flex-shrink:0; filter:drop-shadow(0 0 6px rgba(201,164,99,0.35));}
  .brand-word{
    font-family:"Cinzel", serif;
    font-weight:700;
    font-size:1rem;
    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.58rem;
    letter-spacing:0.32em;
    color:var(--gold);
    margin-top:0.2rem;
  }
  .nav-links{
    display:flex;
    align-items:center;
    gap:2.4rem;
    list-style:none;
    margin:0;
    padding:0;
    font-size:0.9rem;
    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;}}

  .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%);
  }
  .watermark-shield{
    position:absolute;
    width:480px;
    height:580px;
    color:var(--gold);
    opacity:0.05;
    pointer-events:none;
  }
  .watermark-shield.left{left:-120px; bottom:-60px; transform:rotate(-8deg);}
  .watermark-shield.right{right:-120px; top:40px; transform:rotate(8deg);}
  .bg-waves{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    pointer-events: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;
  }
  .emblem-wrapper{position:relative;}
  .emblem-wrapper::before{
    content:"";
    position:absolute;
    inset:-1.4rem;
    background:radial-gradient(circle, rgba(201,164,99,0.18) 0%, transparent 72%);
    border-radius:50%;
    z-index:0;
  }
  .radar{
    position:absolute;
    inset:-1rem;
    border-radius:50%;
    background:conic-gradient(from 0deg, transparent 0deg, rgba(201,164,99,0.5) 18deg, transparent 60deg, transparent 360deg);
    -webkit-mask-image:radial-gradient(circle, transparent 58%, black 60%, black 66%, transparent 68%);
    mask-image:radial-gradient(circle, transparent 58%, black 60%, black 66%, transparent 68%);
    animation:radar-spin 7s linear infinite;
    z-index:0;
  }
  @keyframes radar-spin{to{transform:rotate(360deg);}}
  .hero-crest{
    position:relative;
    z-index:1;
    width:clamp(4.6rem, 10.5vh, 7.5rem);
    height:clamp(4.6rem, 10.5vh, 7.5rem);
    filter:drop-shadow(0 0 12px rgba(201,164,99,0.3));
    opacity:0;
    transform:translateY(14px) scale(0.94);
    animation:crest-in 0.9s cubic-bezier(.2,.8,.2,1) 0.1s forwards;
  }
  @keyframes crest-in{to{opacity:1; transform:translateY(0) scale(1);}}
  .hero h1{
    font-size:clamp(2.6rem, 6.6vh, 5.2rem);
    font-weight:800;
    letter-spacing:0.13em;
    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;
  }
  .hero-sub{
    font-family:"Plus Jakarta Sans", sans-serif;
    font-size:clamp(1rem, 2.2vh, 1.3rem);
    font-weight:500;
    letter-spacing:0.48em;
    text-transform:uppercase;
    color:var(--gold);
  }
  .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-badge{
    display:inline-flex;
    align-items:center;
    gap:0.55rem;
    padding:0.4rem 1rem;
    border:1px solid var(--border);
    border-radius:999px;
    background:rgba(201,164,99,0.08);
    color:var(--gold-light);
    font-size:0.75rem;
    font-weight:700;
    letter-spacing:0.1em;
    text-transform:uppercase;
  }
  .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:0;
  }

  /* ===== 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;}
  .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;}

  /* 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;}