
:root{
  --navy:#123F43;
  --navy-2:#0F3538;
  --navy-3:#16494D;
  --gold:#C0A267;
  --gold-light:#D4BC86;
  --ivory:#F5F0E6;
  --paper:#F5F0E6;
  --paper-2:#E8E7DE;
  --ink:#0B1F1F;
  --muted:#6B7774;
  --line:rgba(179,148,88,.26);
  --line-soft:rgba(179,148,88,.16);
  --shadow:0 18px 48px rgba(12,18,28,.16);
  --shadow-deep:0 24px 70px rgba(4,9,18,.28);
  --radius:22px;
  --max:1340px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at top left, rgba(209,182,120,.16), transparent 18%),
    linear-gradient(180deg, #faf7f2 0%, var(--paper) 30%, #F5F0E6 100%);
  line-height:1.6;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.page-chrome{
  position:fixed; inset:18px;
  border:1px solid rgba(179,148,88,.16);
  pointer-events:none; z-index:1;
}
.site-header{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:18px 4.8vw;
  background:rgba(18,63,67,.92);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(179,148,88,.20);
}
.brand img{width:min(420px,46vw); height:60px; object-fit:contain; object-position:left center}
.nav{
  display:flex; align-items:center; gap:24px;
  color:rgba(246,241,233,.78);
  font-size:.78rem; letter-spacing:.12em; text-transform:uppercase;
}
.nav a{position:relative}
.nav a:not(.nav-cta)::after{
  content:""; position:absolute; left:0; bottom:-8px;
  width:0; height:1px; background:var(--gold-light); transition:.25s ease;
}
.nav a:hover::after{width:100%}
.nav-cta{
  padding:12px 18px; border:1px solid var(--gold);
  color:var(--ivory)!important; border-radius:999px;
  background:linear-gradient(135deg, rgba(209,182,120,.18), rgba(209,182,120,.06));
}
.nav-toggle{
  display:none; background:none; border:1px solid rgba(179,148,88,.28);
  color:var(--ivory); padding:10px 14px;
}

.hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 75% 28%, rgba(255,213,128,.09), transparent 14%),
    linear-gradient(120deg, rgba(18,63,67,.99) 0%, rgba(11,31,31,.98) 35%, rgba(22,73,77,.97) 100%);
  color:var(--ivory);
  padding:80px 4.8vw 46px;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:48px 48px;
  opacity:.24;
}
.hero-grid{
  max-width:var(--max); margin:0 auto; position:relative; z-index:3;
  display:grid; grid-template-columns:1.1fr .72fr; gap:42px; align-items:end;
}
.eyebrow{
  margin:0 0 12px; text-transform:uppercase; letter-spacing:.23em;
  font-size:.72rem; font-weight:600; color:var(--gold-light);
}
.eyebrow.dark{color:#8C7444}
.hero h1, .section-head h2, .leader-card h3, .hero-card h3, .contact-card h3, .service-card h3, .value-card h3{
  font-family:"Cormorant Garamond", Georgia, serif;
}
.hero h1{
  font-size:clamp(4rem, 8vw, 7.9rem);
  line-height:.88; margin:0 0 14px; font-weight:600;
  letter-spacing:-.035em;
}
.hero h1 span{color:var(--gold-light)}
.heartbeat-line{
  width:min(800px, 105%); height:90px; color:var(--gold-light);
  margin:10px 0 10px;
}
.heartbeat-line svg{width:100%; height:100%}
.hero-body{
  max-width:680px; color:rgba(246,241,233,.76);
  font-size:1.06rem; margin:0 0 22px;
}
.hero-legacy{
  margin:0 0 30px; color:var(--gold-light);
  text-transform:uppercase; letter-spacing:.08em;
  font-size:1rem;
}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap}
.button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:52px; padding:0 22px; border-radius:999px;
  font-size:.78rem; letter-spacing:.10em; text-transform:uppercase;
  transition:.25s ease;
}
.button-gold{
  background:linear-gradient(135deg, var(--gold-light), #a88443);
  color:var(--navy); box-shadow:0 12px 30px rgba(0,0,0,.24);
}
.button-gold:hover{transform:translateY(-2px)}
.button-ghost{
  border:1px solid rgba(246,241,233,.24);
  color:var(--ivory); background:rgba(255,255,255,.04);
}
.button-ghost:hover{background:rgba(255,255,255,.08)}
.hero-aside{display:flex; flex-direction:column; gap:18px}
.glass{
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:var(--shadow-deep);
  backdrop-filter:blur(10px);
}
.hero-card{
  border-radius:28px; padding:28px 28px 26px;
}
.card-kicker{
  margin:0 0 8px; color:var(--gold-light); font-size:.72rem;
  letter-spacing:.16em; text-transform:uppercase;
}
.hero-card h3{
  margin:0 0 18px; font-size:2rem; line-height:1.02; font-weight:600;
}
.signature-list{margin:0; padding-left:18px; color:rgba(246,241,233,.82)}
.signature-list li{margin:8px 0}
.stats-row{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
}
.stat{
  border-radius:22px; padding:22px 16px; text-align:center;
}
.stat-number{
  display:block; font-family:"Cormorant Garamond", Georgia, serif;
  font-size:2.8rem; line-height:1; color:var(--gold-light);
}
.stat-label{
  display:block; margin-top:8px; font-size:.78rem; color:rgba(246,241,233,.74);
}
.hero-skyline{
  position:absolute; right:-2vw; bottom:0; width:54vw; height:52%;
  opacity:.36; z-index:2;
}
.building{
  position:absolute; bottom:0; width:7%;
  background:linear-gradient(180deg, rgba(209,182,120,.28), rgba(246,241,233,.06));
  border:1px solid rgba(209,182,120,.26); border-bottom:none;
}
.building::before{
  content:""; position:absolute; left:18%; right:18%; top:12%;
  bottom:8%; background:
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:14px 14px; opacity:.35;
}
.b1{left:0;height:26%}.b2{left:10%;height:38%}.b3{left:21%;height:32%}
.b4{left:32%;height:58%;width:9%}.b5{left:44%;height:45%}
.b6{left:56%;height:72%;width:10%}.b7{left:69%;height:40%}
.b8{left:80%;height:53%}.b9{left:91%;height:47%}
.credibility-strip{
  position:relative; z-index:4;
  margin:-1px auto 0;
  background:var(--navy); color:rgba(246,241,233,.72);
  border-top:1px solid rgba(179,148,88,.18);
  border-bottom:1px solid rgba(179,148,88,.18);
  display:grid; grid-template-columns:repeat(5,1fr);
  text-transform:uppercase; letter-spacing:.12em; font-size:.68rem;
}
.credibility-item{
  padding:18px 12px; text-align:center; border-right:1px solid rgba(179,148,88,.14);
}
.credibility-item:last-child{border-right:none}

.section{padding:92px 4.8vw}
.section-head{max-width:920px; margin:0 auto 38px}
.section-head.center{text-align:center}
.section-head h2{
  margin:0; font-size:clamp(2.9rem, 5vw, 5.3rem);
  line-height:.92; font-weight:600; letter-spacing:-.03em;
}
.section-sub{max-width:760px; margin:18px auto 0; color:#6c675f}
.two-column{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:start;
}
.editorial-card, .pillars-card, .value-card, .company-card, .contact-panel, .service-card, .leader-card, .founder-note{
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.editorial-card{
  background:linear-gradient(180deg, #fbf8f3, #f1e8dc);
  padding:34px; border:1px solid var(--line-soft);
  font-size:1.08rem;
}
.pillars-card{
  background:white; border:1px solid rgba(17,24,39,.06);
  padding:18px;
}
.pillar{
  display:grid; grid-template-columns:62px 1fr; gap:18px;
  align-items:start; padding:18px 10px; border-bottom:1px solid rgba(17,24,39,.08);
}
.pillar:last-child{border-bottom:none}
.pillar span{
  width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  background:#f2eadf; color:#8C7444; font-weight:700;
}
.pillar h3{margin:2px 0 6px; font-size:1.18rem}
.pillar p{margin:0; color:#6b6861}

.dark-surface{
  background:
    linear-gradient(180deg, rgba(11,31,31,.99), rgba(18,63,67,.99)),
    radial-gradient(circle at 50% 0%, rgba(209,182,120,.08), transparent 20%);
  color:var(--ivory);
  position:relative;
}
.dark-surface::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:50px 50px; opacity:.22;
}
.dark-surface > *{position:relative; z-index:2}

.services-grid{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
.service-card{
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.08);
  padding:28px; transition:.25s ease;
}
.service-card:hover{transform:translateY(-4px); border-color:rgba(209,182,120,.36)}
.service-icon{
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center;
  border:1px solid rgba(209,182,120,.46); color:var(--gold-light);
  margin-bottom:16px; font-size:1.45rem;
}
.service-card h3{
  margin:0 0 10px; font-size:1.72rem; line-height:1;
}
.service-card p{margin:0; color:rgba(246,241,233,.72)}

.architecture-wrap{
  max-width:var(--max); margin:0 auto 28px;
  padding:36px 24px 28px; background:white; border-radius:28px;
  border:1px solid rgba(17,24,39,.06); box-shadow:var(--shadow);
}
.architecture-top, .architecture-mid{display:flex; justify-content:center}
.connector{
  width:2px; background:linear-gradient(180deg, rgba(179,148,88,.15), rgba(179,148,88,.75), rgba(179,148,88,.15));
  margin:0 auto;
}
.connector-main{height:34px}
.connector-secondary{height:28px}
.architecture-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:18px;
}
.arch-box{
  background:linear-gradient(180deg, #fbf8f3, #f3eadf);
  border:1px solid rgba(179,148,88,.22);
  border-radius:20px; padding:22px; text-align:center;
}
.parent-box{min-width:min(540px, 100%)}
.spotlight{
  background:linear-gradient(135deg, var(--navy), var(--navy-2)); color:var(--ivory);
  min-width:min(520px, 100%); box-shadow:var(--shadow-deep);
}
.arch-label{
  margin:0 0 8px; text-transform:uppercase; letter-spacing:.16em;
  font-size:.64rem; color:#8C7444;
}
.spotlight .arch-label{color:var(--gold-light)}
.arch-box h3{
  margin:0; font-family:"Cormorant Garamond", Georgia, serif;
  font-size:1.9rem; line-height:1.05;
}
.spotlight p:last-child{margin:10px 0 0; color:rgba(246,241,233,.72)}
.arch-box.small h3{font-size:1.45rem}
.value-grid{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.value-card{
  background:linear-gradient(180deg, #fffdf9, #f4ece2);
  padding:26px; border:1px solid rgba(17,24,39,.06);
}
.value-card h3{margin:0 0 8px; font-size:1.65rem}
.value-card p{margin:0; color:#666159}

.companies{
  background:
    linear-gradient(180deg, rgba(255,255,255,.68), rgba(255,255,255,.68)),
    radial-gradient(circle at center, rgba(179,148,88,.12) 1px, transparent 1px);
  background-size:auto, 16px 16px;
}
.company-grid{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
}
.company-card{
  background:linear-gradient(180deg, #fffdfa, #f5ede2);
  border:1px solid rgba(17,24,39,.06);
  padding:26px 24px 24px;
  transition:.25s ease;
}
.company-card:hover{transform:translateY(-5px); box-shadow:0 20px 44px rgba(20,26,38,.12)}
.company-card.pending{opacity:.82; cursor:default}
.logo-stage{
  height:165px; display:flex; align-items:center; justify-content:center;
  border-radius:18px; margin-bottom:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(243,232,220,.82));
  border:1px solid rgba(179,148,88,.14);
}
.logo-stage img{max-height:145px; object-fit:contain}
.company-sector{
  display:block; margin-bottom:8px; text-transform:uppercase;
  letter-spacing:.15em; font-size:.62rem; color:#8C7444;
}
.company-card h3{
  margin:0 0 10px;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:1.8rem; line-height:1;
}
.company-card p{margin:0 0 18px; color:#6a655d}
.visit{
  display:inline-flex; align-items:center; min-height:42px; padding:0 14px;
  border:1px solid rgba(179,148,88,.34); border-radius:999px;
  font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; color:#6d572d;
}
.legacy-quote{
  text-align:center; max-width:900px; margin:58px auto 0;
  color:var(--navy);
}
.quote-mark{
  display:block; font-family:"Cormorant Garamond", Georgia, serif;
  font-size:5rem; color:var(--gold); line-height:.6;
}
.legacy-quote p{
  margin:0; font-family:"Cormorant Garamond", Georgia, serif;
  font-size:clamp(2.1rem, 4vw, 3.6rem); line-height:1.02;
}
.legacy-quote strong{font-weight:600; color:#8C7444}

.leaders-wrap{
  max-width:1000px; margin:0 auto 24px;
  display:grid; grid-template-columns:1fr 1fr; gap:20px;
}
.leader-card{
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.08);
  padding:28px;
}
.leader-role{
  margin:0 0 6px; text-transform:uppercase; letter-spacing:.18em;
  font-size:.66rem; color:var(--gold-light);
}
.leader-card h3{
  margin:0 0 10px; font-size:2rem; line-height:1;
}
.leader-card p:last-child{margin:0; color:rgba(246,241,233,.72)}
.founder-note{
  max-width:1000px; margin:0 auto;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid rgba(209,182,120,.16);
  padding:28px 30px;
}
.founder-note h3{
  margin:0 0 8px; font-family:"Cormorant Garamond", Georgia, serif;
  font-size:2rem;
}
.founder-note p:last-child{margin:0; color:rgba(246,241,233,.72)}

.contact-panel{
  max-width:var(--max); margin:0 auto;
  background:linear-gradient(180deg, #fffdfa, #f4ebe0);
  border:1px solid rgba(17,24,39,.06);
  padding:34px;
}
.contact-grid{
  display:grid; grid-template-columns:1.1fr .72fr; gap:22px; align-items:start;
}
.contact-note{color:#8C7444}
.contact-card{
  background:linear-gradient(135deg, var(--navy), var(--navy-2)); color:var(--ivory);
  border-radius:24px; padding:28px;
  box-shadow:var(--shadow-deep);
}
.contact-label{
  margin:0 0 8px; text-transform:uppercase; letter-spacing:.16em;
  font-size:.66rem; color:var(--gold-light);
}
.contact-card h3{
  margin:0 0 10px; font-family:"Cormorant Garamond", Georgia, serif;
  font-size:2rem;
}
.contact-card a{color:var(--gold-light)}
.contact-links{
  display:flex; gap:12px; flex-wrap:wrap; margin-top:18px;
}
.contact-links a{
  display:inline-flex; align-items:center; min-height:40px; padding:0 14px;
  border-radius:999px; border:1px solid rgba(209,182,120,.34);
  font-size:.68rem; text-transform:uppercase; letter-spacing:.12em;
}

.site-footer{
  background:#0B1F1F; color:rgba(246,241,233,.64);
  display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; gap:20px; padding:28px 4.8vw 36px;
  border-top:1px solid rgba(179,148,88,.18);
}
.site-footer img{width:340px; height:58px; object-fit:contain; object-position:left center}
.footer-center{text-align:center}
.footer-right{text-align:right}

@media (max-width:1180px){
  .hero-grid, .two-column, .contact-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .architecture-grid, .company-grid{grid-template-columns:repeat(2,1fr)}
  .value-grid{grid-template-columns:1fr}
  .hero-skyline{width:78vw; opacity:.25}
}
@media (max-width:960px){
  .nav{display:none}
  .nav.open{
    display:flex; position:absolute; left:0; right:0; top:96px;
    background:rgba(18,63,67,.98); padding:20px 4.8vw 26px;
    flex-direction:column; align-items:flex-start;
    border-bottom:1px solid rgba(179,148,88,.18);
  }
  .nav-toggle{display:inline-block}
  .credibility-strip{grid-template-columns:1fr}
  .credibility-item{border-right:none; border-bottom:1px solid rgba(179,148,88,.14)}
  .credibility-item:last-child{border-bottom:none}
  .leaders-wrap{grid-template-columns:1fr}
  .site-footer{grid-template-columns:1fr; text-align:left}
  .footer-center, .footer-right{text-align:left}
}
@media (max-width:720px){
  .page-chrome{display:none}
  .hero{padding-top:58px}
  .hero h1{font-size:clamp(3.2rem, 15vw, 5rem)}
  .stats-row, .services-grid, .architecture-grid, .company-grid{grid-template-columns:1fr}
  .parent-box, .spotlight{min-width:unset}
  .section{padding:74px 5vw}
  .site-header{padding:16px 5vw}
  .brand img{width:72vw}
  .hero-card h3{font-size:1.7rem}
  .section-head h2{font-size:clamp(2.5rem, 12vw, 3.9rem)}
}

/* OPTION 2 — DEEP TEAL + CHAMPAGNE GOLD */
.hero::after{
  content:"";
  position:absolute;
  right:5vw;
  top:6%;
  width:min(620px,52vw);
  aspect-ratio:1;
  border-radius:50%;
  background:
    radial-gradient(circle at center, transparent 0 18%, rgba(212,188,134,.10) 18.2% 18.5%, transparent 18.7% 30%,
    rgba(212,188,134,.08) 30.2% 30.5%, transparent 30.7% 42%,
    rgba(212,188,134,.07) 42.2% 42.5%, transparent 42.7% 56%,
    rgba(212,188,134,.05) 56.2% 56.5%, transparent 56.7%);
  opacity:.75;
  pointer-events:none;
  z-index:1;
}
.company-logo-link{
  display:block;
  border-radius:18px;
  position:relative;
}
.company-logo-link:not(.pending-link)::after{
  content:"Visit";
  position:absolute;
  right:14px;
  bottom:14px;
  border:1px solid rgba(192,162,103,.45);
  background:rgba(245,240,230,.92);
  color:#123F43;
  border-radius:999px;
  padding:6px 10px;
  font-size:.58rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(4px);
  transition:.22s ease;
}
.company-logo-link:not(.pending-link):hover::after{
  opacity:1;
  transform:translateY(0);
}
.company-logo-link:not(.pending-link):hover .logo-stage{
  border-color:rgba(192,162,103,.50);
  box-shadow:0 18px 40px rgba(11,31,31,.12);
}
.company-logo-link .logo-stage{transition:.25s ease}
.pending-link{cursor:default}
.pending-visit{opacity:.68; border-style:dashed}
