/* =========================================================
   JOREMA Corporate Advisory — stylesheet situs publik
   Palet: navy dalam #081826 → #123454, emas gradasi #A9863F → #E9CE94
   Font: Fraunces (judul), IBM Plex Sans (isi), IBM Plex Mono (label/nomor)
   Edisi: elevated / premium refresh (kartu + ikon, animasi scroll, gradasi)
   ========================================================= */

:root{
  --ink:#0B2036;
  --navy:#0E2B47;
  --navy-2:#123454;
  --navy-deep:#081826;
  --navy-deeper:#050f1a;
  --gold:#A9863F;
  --gold-soft:#D9BD7E;
  --gold-bright:#E9CE94;
  --cream:#F8F5ED;
  --paper:#FFFFFF;
  --line:#E3DDC9;
  --line-soft:#ECE7D8;
  --muted:#5B594E;
  --on-navy:#EDE7D6;
  --on-navy-muted:#AFC0CE;
  --grad-gold: linear-gradient(120deg, var(--gold) 0%, var(--gold-soft) 55%, var(--gold-bright) 100%);
  --grad-navy: linear-gradient(135deg, var(--navy-deep) 0%, var(--navy) 55%, var(--navy-2) 100%);
  --grad-navy-deep: linear-gradient(160deg, var(--navy-deeper), var(--navy) 62%, var(--navy-2));
  --shadow-sm: 0 8px 24px -14px rgba(8,24,38,0.30);
  --shadow: 0 20px 50px -25px rgba(11,32,54,0.35);
  --shadow-lg: 0 30px 70px -28px rgba(8,24,38,0.42);
  --shadow-gold: 0 14px 34px -16px rgba(169,134,63,0.55);
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 22px;
  --ease: cubic-bezier(.22,.9,.24,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.65;
}
img{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:1180px; margin:0 auto; padding-inline:24px; position:relative;}
@media (min-width:900px){ .wrap{padding-inline:40px;} }

.eyebrow{
  font-family:"IBM Plex Mono", ui-monospace, monospace;
  font-size:12px; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--gold); font-weight:500; margin:0 0 12px;
  position:relative; padding-left:32px; display:inline-block; max-width:100%;
}
.eyebrow::before{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:22px; height:1.5px; background:var(--grad-gold); border-radius:2px;}
h1,h2,h3{
  font-family:"Fraunces", Georgia, serif; color:var(--ink); margin:0;
  text-wrap:balance; font-weight:600; letter-spacing:-0.015em;
}
h2{font-size:clamp(27px,3.6vw,40px); line-height:1.14;}
h3{font-size:20px; line-height:1.3;}
.lede{color:var(--muted); font-size:16.5px; max-width:60ch; margin:14px 0 0;}
.section{padding-block:68px; position:relative;}
@media (min-width:900px){ .section{padding-block:92px;} }
.section-head{max-width:640px; margin-bottom:46px;}

.pull{
  font-family:"Fraunces", Georgia, serif; font-style:italic; font-weight:500;
  color:var(--gold); font-size:clamp(17px,2vw,21px); line-height:1.55;
  text-wrap:balance; margin:0; position:relative; padding-left:22px;
  border-left:2px solid var(--gold-soft);
}

/* ---------- SCROLL REVEAL ---------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .75s var(--ease), transform .75s var(--ease);}
.reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
}

/* ---------- NAV ---------- */
header.site{
  position:sticky; top:0; z-index:60;
  background:rgba(248,245,237,0.90);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .35s var(--ease), padding .35s var(--ease), background .35s var(--ease);
}
header.site.scrolled{
  background:rgba(248,245,237,0.97);
  box-shadow:0 12px 30px -20px rgba(11,32,54,0.28);
}
.nav-row{position:relative; display:flex; align-items:center; justify-content:space-between; padding-block:18px; transition:padding .35s var(--ease);}
header.site.scrolled .nav-row{padding-block:12px;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; min-width:max-content;}
.brand-copy{display:flex; flex-direction:column; gap:1px;}
.brand-mark{
  position:relative; display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px;
  width:44px; height:44px; border-radius:50%; color:var(--gold-bright);
  background:var(--grad-navy-deep); border:1px solid rgba(169,134,63,.58);
  box-shadow:0 8px 22px -10px rgba(8,24,38,.65), inset 0 0 0 3px rgba(217,189,126,.07);
}
.brand-mark::before{content:""; position:absolute; inset:5px; border:1px solid rgba(217,189,126,.34); border-radius:50%;}
.brand-mark span{position:relative; z-index:1; font-family:"Fraunces",serif; font-size:13px; font-style:italic; font-weight:700; letter-spacing:-.05em;}
.brand .word{font-family:"Fraunces", serif; font-weight:600; font-size:23px; letter-spacing:0.04em; color:var(--ink);}
.brand .word b{background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:var(--gold); font-weight:600;}
.brand .cap{font-family:"IBM Plex Mono", monospace; font-size:9.5px; letter-spacing:0.26em; color:var(--muted); text-transform:uppercase;}
.nav-right{display:flex; align-items:center; gap:14px;}
nav.links{display:none; gap:28px; font-size:14.5px; font-weight:500; align-items:center;}
nav.links a{text-decoration:none; color:var(--ink); opacity:0.82; position:relative; padding-bottom:3px;}
nav.links a::after{content:""; position:absolute; left:0; right:100%; bottom:0; height:1.5px; background:var(--grad-gold); transition:right .3s var(--ease); border-radius:2px;}
nav.links a:hover{opacity:1; color:var(--gold);}
nav.links a:hover::after{right:0;}
nav.links a.active{opacity:1; color:var(--gold);}
nav.links a.active::after{right:0;}
nav.links.open{
  display:flex; flex-direction:column; align-items:flex-start; gap:18px;
  position:absolute; top:100%; left:0; right:0;
  background:var(--cream); border-bottom:1px solid var(--line);
  padding:22px 24px 28px; box-shadow:var(--shadow-lg);
}
@media (min-width:1020px){
  nav.links{display:flex !important; flex-direction:row; position:static; background:none; border:none; box-shadow:none; padding:0;}
}
.nav-toggle{
  display:inline-flex; flex-direction:column; justify-content:center; gap:5px;
  width:38px; height:34px; border:1px solid var(--line); border-radius:8px;
  background:transparent; cursor:pointer; padding:0 8px; transition:border-color .2s;
}
.nav-toggle:hover{border-color:var(--gold);}
.nav-toggle span{display:block; height:1.5px; background:var(--ink); border-radius:2px;}
@media (min-width:1020px){ .nav-toggle{display:none;} }

.btn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:"IBM Plex Sans", sans-serif; font-weight:600; font-size:14.5px;
  padding:13px 26px; border-radius:999px; text-decoration:none;
  border:1px solid transparent; cursor:pointer; white-space:nowrap;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn-gold{background:var(--grad-gold); color:#0B2036; box-shadow:var(--shadow-gold); background-size:160% 160%; background-position:0% 50%;}
.btn-gold:hover{transform:translateY(-2px); box-shadow:0 20px 40px -16px rgba(169,134,63,0.65); background-position:100% 50%;}
.btn-outline{border-color:var(--line); color:var(--ink); background:rgba(255,255,255,0.4);}
.btn-outline:hover{border-color:var(--gold); color:var(--gold); transform:translateY(-2px);}
.btn-outline-dark{border-color:rgba(237,231,214,0.35); color:var(--on-navy); background:rgba(255,255,255,0.03);}
.btn-outline-dark:hover{border-color:var(--gold-soft); color:var(--gold-soft); transform:translateY(-2px); background:rgba(255,255,255,0.07);}

/* ---------- ICON BADGE ---------- */
.icon-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:54px; height:54px; border-radius:16px; flex-shrink:0;
  background:var(--grad-navy); color:var(--gold-soft);
  box-shadow:var(--shadow-sm);
  margin-bottom:18px;
  transition:transform .4s var(--ease);
}
.icon-badge svg{width:24px; height:24px;}
.icon-badge.on-dark{background:rgba(255,255,255,0.08); color:var(--gold-soft); box-shadow:none; border:1px solid rgba(237,231,214,0.18);}
.icon-badge.gold{background:var(--grad-gold); color:#0B2036;}
.icon-badge.round{border-radius:50%;}
.icon-badge.sm{width:46px; height:46px; margin-bottom:0;}
.icon-badge.sm svg{width:20px; height:20px;}

/* ---------- HERO (mengikuti gaya cover Company Profile: krem + panel foto
   diagonal + garis emas + pita navy di bawah) ---------- */
.hero{position:relative; overflow:hidden; background:var(--cream); color:var(--ink);}
.hero::before{content:""; position:absolute; width:520px; height:520px; left:-250px; top:-300px; border-radius:50%; border:1px solid rgba(169,134,63,.15); box-shadow:0 0 0 60px rgba(169,134,63,.025),0 0 0 120px rgba(169,134,63,.018); pointer-events:none;}
.hero-grid{
  position:relative; z-index:2; display:grid; grid-template-columns:1fr; gap:36px;
  padding-block:52px 0; align-items:center;
}
@media (min-width:960px){
  .hero-grid{grid-template-columns:1.1fr 0.9fr; gap:20px; padding-block:72px 0; align-items:stretch; min-height:480px;}
}
.hero-copy{padding-block:4px 8px;}
.hero-copy::before{content:"JOREMA"; display:block; font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.42em; color:rgba(169,134,63,.68); margin-bottom:13px;}
.hero-photo{
  position:relative; width:100%; aspect-ratio:16/11; overflow:hidden;
  border-radius:22px; margin-top:4px; box-shadow:var(--shadow-lg);
}
.hero-photo img{width:100%; height:100%; object-fit:cover; display:block;}
@media (min-width:960px){
  .hero-photo{
    aspect-ratio:auto; height:100%; min-height:420px; margin-top:0; border-radius:0;
    box-shadow:none;
    clip-path:polygon(14% 0, 100% 0, 100% 100%, 0 100%);
  }
  .hero-photo::before{
    content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
    clip-path:polygon(14% 0, 15.4% 0, 1.4% 100%, 0 100%);
    background:var(--grad-gold);
  }
  .hero-photo::after{
    content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(200deg, rgba(8,24,38,0.05), rgba(8,24,38,0.28) 80%);
  }
}
.hero-eyebrow{font-family:"IBM Plex Mono", monospace; font-size:12.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold); margin:0 0 20px; position:relative; padding-left:32px; display:inline-block; max-width:100%;}
.hero-eyebrow::before{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:22px; height:1.5px; background:var(--grad-gold); border-radius:2px;}
.hero h1{font-family:"Fraunces", serif; font-weight:600; color:var(--ink); font-size:clamp(33px,5vw,52px); line-height:1.1; letter-spacing:-0.02em; text-wrap:balance; margin:0;}
.hero h1 em{background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:var(--gold); font-style:italic; font-weight:500;}
.hero p.lede-hero{color:var(--muted); font-size:16.5px; max-width:52ch; margin:20px 0 0;}
.hero-ctas{display:flex; flex-wrap:wrap; gap:14px; margin-top:32px;}
.hero-pillars{display:grid; grid-template-columns:repeat(2,1fr); gap:24px 18px; margin-top:44px;}
@media (min-width:640px){ .hero-pillars{grid-template-columns:repeat(4,1fr);} }
.hero-pillar-item{display:flex; flex-direction:column; align-items:flex-start; gap:12px;}
.hero-pillar-item .hp-label{font-size:13px; font-weight:600; color:var(--ink); line-height:1.35;}
.hero-quote-strip{position:relative; z-index:2; margin-top:46px; background:var(--grad-navy); padding-block:26px; overflow:hidden;}
.hero-quote-strip::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:64%;
  background:var(--cream); clip-path:polygon(0 0, 100% 0, 0 100%);
  z-index:1; pointer-events:none;
}
.hero-quote-strip .wrap{position:relative; z-index:2; display:flex; justify-content:flex-end; align-items:center; gap:14px; flex-wrap:wrap;}
.hero-quote-strip p{font-family:"Fraunces", serif; font-style:italic; font-size:15.5px; color:var(--gold-soft); margin:0; text-align:right; max-width:56ch;}

.page-hero{position:relative; background:var(--grad-navy); color:var(--on-navy); padding-block:60px; overflow:hidden;}
.page-hero::before{content:""; position:absolute; inset:0; background:radial-gradient(55% 90% at 90% 0%, rgba(217,189,126,0.14), transparent 60%); pointer-events:none;}
.bg-num{
  position:absolute; right:-0.06em; top:50%; transform:translateY(-50%);
  font-family:"Fraunces", serif; font-weight:700; font-style:italic;
  font-size:clamp(140px,20vw,300px); line-height:1; color:rgba(255,255,255,0.045);
  z-index:0; user-select:none; pointer-events:none;
}
.page-hero .wrap, .contact > .wrap{z-index:1;}
.page-hero h1{font-size:clamp(29px,4.2vw,44px); color:#fff;}
.page-hero .lede{color:var(--on-navy-muted);}

/* ---------- BERANDA EXTRAS ---------- */
.service-preview{display:grid; grid-template-columns:1fr; gap:18px; margin-top:40px;}
@media (min-width:700px){ .service-preview{grid-template-columns:repeat(3,1fr);} }
@media (min-width:1020px){ .service-preview{grid-template-columns:repeat(5,1fr);} }
.sp-card{
  background:var(--paper); border:1px solid var(--line-soft); padding:26px 22px; border-radius:var(--radius);
  text-decoration:none; display:block; box-shadow:var(--shadow-sm);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
  position:relative; overflow:hidden;
}
.sp-card:nth-child(even){background:linear-gradient(155deg,#fff 0%,#fbf8f0 100%);}
.sp-card::before{content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--grad-gold); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease);}
.sp-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent;}
.sp-card:hover::before{transform:scaleX(1);}
.sp-card:hover .icon-badge{transform:scale(1.08) rotate(-4deg);}
.sp-card .num{font-family:"IBM Plex Mono",monospace; color:var(--gold); font-size:11px; letter-spacing:0.1em; display:block; margin-bottom:14px;}
.sp-card h3{font-size:15.5px; margin:0; line-height:1.35; color:var(--ink);}
.cta-band{
  background:var(--grad-navy); color:var(--on-navy); border-radius:var(--radius-lg); padding:40px 36px;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:22px; margin-top:60px;
  position:relative; overflow:hidden; box-shadow:var(--shadow-lg);
}
.cta-band::before{content:""; position:absolute; inset:0; background:radial-gradient(50% 120% at 100% 0%, rgba(217,189,126,0.16), transparent 65%); pointer-events:none;}
.cta-band h3{color:#fff; font-size:23px; margin:0 0 5px; position:relative;}
.cta-band p{margin:0; color:var(--on-navy-muted); font-size:14.5px; position:relative;}
.cta-band .btn{position:relative;}

/* ---------- PILLARS ---------- */
.pillar-grid{display:grid; grid-template-columns:1fr; gap:16px;}
@media (min-width:700px){ .pillar-grid{grid-template-columns:1fr 1fr;} }
.pillar{
  background:var(--grad-navy); color:var(--on-navy); padding:28px 26px 26px; border-radius:var(--radius);
  box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease); position:relative; overflow:hidden;
}
.pillar:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
.pillar .num{font-family:"IBM Plex Mono",monospace; color:var(--gold-soft); font-size:12px; letter-spacing:0.12em;}
.pillar h3{color:#fff; margin:12px 0 8px; font-size:18.5px;}
.pillar p{margin:0; color:var(--on-navy-muted); font-size:14.5px;}
.about-layout{display:grid; grid-template-columns:1fr; gap:48px;}
@media (min-width:940px){ .about-layout{grid-template-columns:1fr 1fr; align-items:start;} }

/* ---------- DEFINITION LIST ---------- */
.deflist{border-top:1px solid var(--line);}
.deflist .row{display:grid; grid-template-columns:1fr; gap:8px; padding:22px 0; border-bottom:1px solid var(--line); transition:padding-left .35s var(--ease);}
@media (min-width:760px){ .deflist .row{grid-template-columns:270px 1fr; gap:32px; padding:26px 0;} }
.deflist .row:hover{padding-left:8px;}
.deflist .term{font-family:"Fraunces",serif; font-weight:600; font-size:17.5px; color:var(--ink);}
.deflist .desc{color:var(--muted); font-size:15px; max-width:62ch;}

/* ---------- SERVICE TILES / PROCESS / WHY ---------- */
.service-tiles{display:grid; grid-template-columns:1fr; gap:16px; margin-top:36px;}
@media (min-width:700px){ .service-tiles{grid-template-columns:1fr 1fr;} }
.tile-dark{
  background:var(--grad-navy); color:var(--on-navy); padding:26px 26px; border-radius:var(--radius);
  box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.tile-dark:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
.tile-dark h4{margin:0 0 8px; color:#fff; font-family:"Fraunces",serif; font-size:16.5px; font-weight:600;}
.tile-dark p{margin:0; font-size:14px; color:var(--on-navy-muted);}
.process{display:grid; grid-template-columns:1fr; gap:16px; margin-top:12px;}
@media (min-width:860px){ .process{grid-template-columns:repeat(5,1fr); gap:0; border-left:1px solid var(--line);} }
.process .step{padding:24px 22px; border-bottom:1px solid var(--line); position:relative; transition:background .35s var(--ease);}
@media (min-width:860px){ .process .step{border-bottom:none; border-right:1px solid var(--line);} }
.process .step:hover{background:rgba(169,134,63,0.06);}
.process .step .n{font-family:"IBM Plex Mono",monospace; font-size:26px; background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:var(--gold); font-weight:500;}
.process .step h3{font-size:15px; letter-spacing:0.02em; margin:11px 0 8px; text-transform:uppercase; font-family:"IBM Plex Sans",sans-serif; font-weight:700;}
.process .step p{margin:0; font-size:13.5px; color:var(--muted);}
.process-note{margin-top:32px;}
.why-grid{display:grid; grid-template-columns:1fr; gap:16px; margin-top:36px;}
@media (min-width:700px){ .why-grid{grid-template-columns:repeat(2,1fr);} }
@media (min-width:1020px){ .why-grid{grid-template-columns:repeat(3,1fr);} }
.why-item{
  background:var(--paper); padding:26px 24px; border-radius:var(--radius); border:1px solid var(--line-soft);
  box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.why-item:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
.why-item h3{font-size:16.5px; margin-bottom:9px;}
.why-item p{margin:0; color:var(--muted); font-size:14px;}

/* ---------- FOUNDER ---------- */
.founder{display:grid; grid-template-columns:1fr; gap:44px; align-items:center;}
@media (min-width:900px){ .founder{grid-template-columns:0.8fr 1.2fr;} }
.founder-photo-wrap{position:relative; max-width:300px; margin-inline:auto;}
.founder-photo-wrap .ring{position:absolute; inset:-16px; border:1.5px solid var(--gold); border-radius:50%; opacity:0.7;}
.founder-photo-wrap .ring::after{content:""; position:absolute; inset:8px; border:1px solid var(--gold-soft); border-radius:50%; opacity:0.5;}
.founder-photo-wrap img{border-radius:50%; aspect-ratio:1/1; object-fit:cover; object-position:center 20%; box-shadow:var(--shadow-lg);}
.founder-copy p{color:var(--muted); font-size:15.5px; margin:0 0 14px;}
.founder-copy p b{color:var(--ink);}
.founder-sign{margin-top:20px; padding-top:18px; border-top:1px solid var(--line);}
.founder-sign .name{font-family:"Fraunces",serif; font-weight:600; font-size:17.5px;}
.founder-sign .role{color:var(--gold); font-size:13.5px; font-weight:500;}

/* ---------- INDUSTRIES / TEAM / ENGAGEMENT ---------- */
.industry-grid{display:grid; grid-template-columns:1fr; gap:16px; margin-top:36px;}
@media (min-width:700px){ .industry-grid{grid-template-columns:1fr 1fr;} }
.industry-card{
  background:var(--grad-navy); color:var(--on-navy); padding:26px 26px; border-radius:var(--radius);
  box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.industry-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
.industry-card h4{margin:0 0 8px; color:#fff; font-family:"Fraunces",serif; font-weight:600; font-size:16.5px;}
.industry-card p{margin:0; color:var(--on-navy-muted); font-size:14px;}
.team-grid{display:grid; grid-template-columns:1fr; gap:30px; margin-top:10px;}
@media (min-width:700px){ .team-grid{grid-template-columns:repeat(2,1fr);} }
.team-card{
  background:var(--paper); border:1px solid var(--line-soft); border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.team-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg);}
.team-card .photo{aspect-ratio:4/3; overflow:hidden; background:var(--line);}
.team-card .photo img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease);}
.team-card:hover .photo img{transform:scale(1.05);}
.team-card .body{padding:24px 26px;}
.team-card .name{font-family:"Fraunces",serif; font-weight:600; font-size:19.5px;}
.team-card .role{color:var(--gold); font-size:13.5px; font-weight:600; letter-spacing:0.02em; margin:5px 0 12px;}
.team-card .tags{display:flex; flex-wrap:wrap; gap:8px;}
.team-card .tags span{font-family:"IBM Plex Mono",monospace; font-size:11.5px; color:var(--muted); border:1px solid var(--line); border-radius:20px; padding:5px 13px; transition:border-color .3s, color .3s;}
.team-card .tags span:hover{border-color:var(--gold); color:var(--gold);}
.team-note{margin-top:30px; color:var(--muted); font-size:14.5px;}
.engage-grid{display:grid; grid-template-columns:1fr; gap:16px; margin-top:36px;}
@media (min-width:760px){ .engage-grid{grid-template-columns:repeat(2,1fr);} }
.engage-item{
  background:var(--paper); padding:26px; border-radius:var(--radius); border:1px solid var(--line-soft);
  box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.engage-item:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg);}
.engage-item h3{font-size:16.5px; margin-bottom:9px;}
.engage-item p{margin:0; color:var(--muted); font-size:14.5px;}

/* ---------- CONTACT ---------- */
.contact{background:var(--grad-navy-deep); color:var(--on-navy); position:relative; overflow:hidden;}
.contact::before{content:""; position:absolute; inset:0; background:radial-gradient(50% 80% at 90% 10%, rgba(217,189,126,0.12), transparent 60%); pointer-events:none;}
.contact .section-head h2{color:#fff;}
.contact-layout{display:grid; grid-template-columns:1fr; gap:46px; margin-top:38px;}
@media (min-width:940px){ .contact-layout{grid-template-columns:0.9fr 1.1fr;} }
.contact-cards{display:grid; grid-template-columns:1fr; gap:1px; background:rgba(237,231,214,0.14); border:1px solid rgba(237,231,214,0.16); border-radius:var(--radius); overflow:hidden;}
.contact-card{background:rgba(8,24,38,0.55); padding:28px 26px; transition:background .3s;}
.contact-card:hover{background:rgba(8,24,38,0.8);}
.contact-card .label{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:0.14em; color:var(--gold-soft); text-transform:uppercase; margin-bottom:10px;}
.contact-card .name{font-family:"Fraunces",serif; font-weight:600; font-size:18.5px; color:#fff;}
.contact-card .role{color:var(--on-navy-muted); font-size:13.5px; margin:4px 0 16px;}
.contact-card a.phone{font-family:"IBM Plex Mono",monospace; font-size:15px; color:var(--gold-soft); text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:gap .3s;}
.contact-card a.phone:hover{color:#fff; gap:12px;}
.contact-meta{display:grid; grid-template-columns:1fr; gap:24px; margin-top:28px;}
.contact-meta .m-label{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:0.14em; color:var(--gold-soft); text-transform:uppercase; margin-bottom:6px;}
.contact-meta .m-value{font-size:14.5px; color:var(--on-navy);}
.contact-meta a{text-decoration:none; color:var(--on-navy);}
.contact-meta a:hover{color:var(--gold-soft);}

.contact-form{background:rgba(255,255,255,0.045); border:1px solid rgba(237,231,214,0.16); border-radius:var(--radius-lg); padding:32px; box-shadow:var(--shadow-lg);}
.contact-form .field{margin-bottom:18px;}
.contact-form label{display:block; font-size:13px; color:var(--on-navy-muted); margin-bottom:7px;}
.contact-form input, .contact-form textarea{
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid rgba(237,231,214,0.25);
  background:rgba(255,255,255,0.06); color:#fff; font-family:"IBM Plex Sans",sans-serif; font-size:14.5px;
  transition:border-color .3s, background .3s;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{color:rgba(237,231,214,0.45);}
.contact-form input:focus, .contact-form textarea:focus{outline:none; border-color:var(--gold-soft); background:rgba(255,255,255,0.09);}
.contact-form textarea{resize:vertical; min-height:130px;}
.contact-form .btn{width:100%; justify-content:center;}
.form-alert{padding:14px 18px; border-radius:10px; margin-bottom:22px; font-size:14px;}
.form-alert.success{background:rgba(217,189,126,0.18); color:var(--gold-soft); border:1px solid rgba(217,189,126,0.4);}
.form-alert.error{background:rgba(220,90,90,0.15); color:#f3a9a9; border:1px solid rgba(220,90,90,0.4);}
.hp-field{position:absolute; left:-9999px; top:-9999px;}

footer{background:var(--navy-deeper); color:var(--on-navy-muted); padding-block:44px; font-size:13px; position:relative; border-top:3px solid var(--gold);}
.footer-brand{display:flex; align-items:center; gap:12px; margin-bottom:12px;}
.footer-brand .brand-mark{width:38px; height:38px; flex-basis:38px; background:#061421;}
.footer-brand .word{font-family:"Fraunces",serif; font-size:18px; letter-spacing:.08em; color:#fff;}
.footer-brand .word b{color:var(--gold-soft);}
footer .wrap{display:flex; flex-direction:column; gap:30px;}
.footer-top{display:flex; flex-wrap:wrap; gap:34px; justify-content:space-between;}
.footer-nav{display:flex; flex-direction:column; gap:10px;}
.footer-nav a{text-decoration:none; color:var(--on-navy-muted); font-size:13.5px; transition:color .3s, padding-left .3s;}
.footer-nav a:hover{color:var(--gold-soft); padding-left:4px;}
.footer-col .m-label{font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:0.14em; color:var(--gold-soft); text-transform:uppercase; margin-bottom:10px;}
.footer-col{max-width:280px;}
.footer-bottom{display:flex; flex-direction:column; gap:10px; align-items:center; text-align:center; border-top:1px solid rgba(237,231,214,0.14); padding-top:26px;}
@media (min-width:760px){ .footer-bottom{flex-direction:row; justify-content:space-between; text-align:left;} }
.footer-bottom .taglines{display:flex; flex-direction:column; gap:4px; font-family:"IBM Plex Mono",monospace; letter-spacing:0.08em; font-size:10.5px; text-transform:uppercase;}
.footer-bottom .taglines .t2{color:var(--gold-soft);}

/* ---------- BACK TO TOP ---------- */
.back-to-top{
  position:fixed; right:22px; bottom:22px; z-index:70;
  width:48px; height:48px; border-radius:50%; border:none; cursor:pointer;
  background:var(--grad-navy); color:var(--gold-soft); box-shadow:var(--shadow-lg);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:translateY(14px) scale(0.9); pointer-events:none;
  transition:opacity .35s var(--ease), transform .35s var(--ease), background .3s;
}
.back-to-top.show{opacity:1; transform:none; pointer-events:auto;}
.back-to-top:hover{background:var(--grad-gold); color:#0B2036;}
.back-to-top svg{width:20px; height:20px;}

::selection{background:var(--gold); color:#0B2036;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .sp-card, .pillar, .tile-dark, .why-item, .industry-card, .engage-item, .team-card,
  .team-card .photo img, .icon-badge, .back-to-top, header.site, .nav-row{transition:none !important;}
}
@media (max-width:430px){
  .brand{gap:9px}.brand-mark{width:38px;height:38px;flex-basis:38px}.brand .word{font-size:20px}.brand .cap{font-size:7.5px;letter-spacing:.18em}
  .hero-grid{padding-top:38px}.hero h1{font-size:34px}.hero-ctas .btn{width:100%;justify-content:center}
  .contact-form{padding:24px 20px}.cta-band{padding:32px 24px}
}