/* ============================================================
   EMBRACIUM — DESIGN SYSTEM
   Palette: deep navy + gold accent (Architecting Value)
============================================================ */

:root{
  --navy:       #0A1428;
  --navy-2:     #0F1C36;
  --navy-3:     #142343;
  --line:       rgba(245,241,232,0.09);
  --line-strong:rgba(245,241,232,0.16);
  --gold:       #E4A735;
  --gold-2:     #F0C674;
  --gold-dim:   rgba(228,167,53,0.14);
  --text:       #F5F1E8;
  --muted:      #9AA3B8;
  --muted-2:    #6B7488;
  --radius:     14px;
  --radius-sm:  9px;
  --maxw:       1240px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--navy);
  color:var(--text);
  font-family:'Inter', -apple-system, Segoe UI, Arial, sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.disp{font-family:'Space Grotesk', Arial, sans-serif;}
.mono{font-family:'IBM Plex Mono', 'Courier New', monospace; letter-spacing:0.03em;}
a{color:inherit; text-decoration:none;}
img,svg{max-width:100%; display:block;}
ul{list-style:none;}
button{font-family:inherit; cursor:pointer;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
section{position:relative; z-index:1;}

::selection{background:var(--gold-dim); color:var(--text);}
:focus-visible{outline:2px solid var(--gold); outline-offset:2px; border-radius:4px;}

/* ===== NAV ===== */
header.nav{
  position:sticky; top:0; z-index:200;
  background:rgba(10,20,40,0.86);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.navrow{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 32px; max-width:var(--maxw); margin:0 auto;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand svg{width:32px; height:32px; flex-shrink:0;}
.brand .bname{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:16.5px; letter-spacing:0.01em;}
.brand .btag{display:block; font-family:'IBM Plex Mono',monospace; font-weight:400; font-size:9.5px; letter-spacing:0.1em; color:var(--gold); text-transform:uppercase; margin-top:1px;}

nav.links{display:flex; gap:28px; font-size:14px; color:var(--muted);}
nav.links a{position:relative; padding:4px 0; transition:color .15s;}
nav.links a:hover, nav.links a.active{color:var(--text);}
nav.links a.active::after{content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--gold); border-radius:2px;}

.nav-cta{
  font-size:13px; font-weight:600; padding:10px 18px; border-radius:8px;
  background:var(--gold); color:#1A1204; white-space:nowrap;
  transition:background .15s, transform .15s;
}
.nav-cta:hover{background:var(--gold-2); transform:translateY(-1px);}

.nav-toggle{
  display:none; flex-direction:column; gap:5px; background:none; border:none; padding:6px;
}
.nav-toggle span{width:22px; height:2px; background:var(--text); border-radius:2px; transition:transform .2s, opacity .2s;}
.mobile-nav{display:none; flex-direction:column; gap:2px; padding:8px 32px 20px; border-bottom:1px solid var(--line); background:rgba(10,20,40,0.98);}
.mobile-nav a{padding:12px 0; font-size:15px; color:var(--muted); border-bottom:1px solid var(--line);}
.mobile-nav a:last-child{border-bottom:none;}
.mobile-nav.open{display:flex;}

/* ===== HERO ===== */
.hero{padding:88px 0 60px; position:relative; overflow:hidden;}
#hero-canvas{position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:0.85;}
.hero-inner{position:relative; z-index:2;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-family:'IBM Plex Mono',monospace;
  font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold);
  border:1px solid rgba(228,167,53,0.32); padding:6px 13px; border-radius:100px; background:var(--gold-dim);
  margin-bottom:24px;
}
h1.hero-title{
  font-size:52px; line-height:1.08; font-weight:700; letter-spacing:-0.015em; margin-bottom:22px; max-width:820px;
}
h1.hero-title .accent{color:var(--gold);}
.hero-sub{font-size:17px; color:var(--muted); max-width:600px; margin-bottom:34px;}
.hero-cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:52px;}
.btn-primary{
  background:var(--gold); color:#1A1204; font-weight:600; font-size:14.5px;
  padding:14px 24px; border-radius:9px; border:none; display:inline-flex; align-items:center; gap:8px;
  transition:background .15s, transform .15s;
}
.btn-primary:hover{background:var(--gold-2); transform:translateY(-1px);}
.btn-secondary{
  background:transparent; color:var(--text); font-weight:600; font-size:14.5px;
  padding:14px 24px; border-radius:9px; border:1px solid var(--line-strong);
  transition:border-color .15s, background .15s;
}
.btn-secondary:hover{border-color:var(--gold); background:rgba(228,167,53,0.06);}

.stat-row{display:flex; gap:44px; padding-top:32px; border-top:1px solid var(--line); flex-wrap:wrap;}
.stat-item b{display:block; font-family:'Space Grotesk',sans-serif; font-size:30px; color:var(--text);}
.stat-item b .suffix{color:var(--gold);}
.stat-item span{font-size:12.5px; color:var(--muted-2); text-transform:uppercase; letter-spacing:0.04em;}

/* ===== DIVIDER ===== */
.divider{display:flex; align-items:center; gap:10px; width:100%; max-width:var(--maxw); margin:0 auto; padding:0 32px; opacity:0.6;}
.divider .dline{flex:1; height:1px; background:linear-gradient(90deg, transparent, var(--line-strong), transparent);}
.divider .ddot{width:5px; height:5px; border-radius:1px; background:var(--gold); transform:rotate(45deg);}

/* ===== SECTION HEADERS ===== */
.section{padding:100px 0;}
.section-head{max-width:680px; margin-bottom:52px;}
.section-tag{font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; display:block;}
h2.section-title{font-size:33px; font-weight:700; letter-spacing:-0.01em; margin-bottom:14px; line-height:1.15; font-family:'Space Grotesk',sans-serif;}
.section-desc{color:var(--muted); font-size:15.5px; max-width:620px;}

/* ===== AI TIERS ===== */
.tier-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.tier-card{
  background:var(--navy-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:28px 24px; display:flex; flex-direction:column; gap:14px; position:relative; overflow:hidden;
}
.tier-card::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--gold);}
.tier-badge{display:inline-flex; align-self:flex-start; font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; padding:4px 10px; border-radius:100px; background:var(--gold-dim); color:var(--gold);}
.tier-card h3{font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:700;}
.tier-card p{color:var(--muted); font-size:14px;}
.tier-list{display:flex; flex-direction:column; gap:8px; margin-top:6px;}
.tier-list li{font-size:13.5px; color:var(--text); padding-left:16px; position:relative;}
.tier-list li::before{content:"—"; position:absolute; left:0; color:var(--gold); font-size:12px;}

/* ===== MODULE CATALOG ===== */
.filter-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:34px;}
.filter-btn{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.04em;
  background:var(--navy-2); border:1px solid var(--line); color:var(--muted);
  padding:9px 15px; border-radius:100px; transition:all .15s;
}
.filter-btn:hover{border-color:var(--line-strong); color:var(--text);}
.filter-btn.active{background:var(--gold); color:#1A1204; border-color:var(--gold);}

.module-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.module-card{
  background:var(--navy-2); border:1px solid var(--line); border-radius:var(--radius);
  padding:22px; cursor:pointer; transition:border-color .15s, transform .15s;
}
.module-card:hover{border-color:var(--line-strong); transform:translateY(-2px);}
.module-cat{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; display:block;}
.module-card h4{font-family:'Space Grotesk',sans-serif; font-size:17px; margin-bottom:8px; line-height:1.25;}
.module-card p.mdesc{color:var(--muted); font-size:13.5px; margin-bottom:12px;}
.module-expand{font-size:12px; color:var(--muted-2); display:flex; align-items:center; gap:6px; font-family:'IBM Plex Mono',monospace;}
.module-expand .chev{transition:transform .2s;}
.module-card.open .module-expand .chev{transform:rotate(90deg);}
.module-detail{display:none; margin-top:16px; padding-top:16px; border-top:1px solid var(--line); cursor:default;}
.module-card.open .module-detail{display:block;}
.detail-block{margin-bottom:14px;}
.detail-label{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:6px; display:block; color:var(--gold);}
.detail-block p{font-size:13.3px; color:var(--text); opacity:.9;}
.detail-block ul{display:flex; flex-direction:column; gap:6px;}
.detail-block ul li{font-size:13.3px; padding-left:14px; position:relative; color:var(--text); opacity:.9;}
.detail-block ul li::before{content:"·"; position:absolute; left:0; color:var(--muted-2);}
.benefit-pill{display:inline-block; font-size:12px; background:var(--gold-dim); color:var(--gold-2); padding:5px 10px; border-radius:100px; margin:3px 5px 0 0;}

/* ===== INDUSTRIES ===== */
.industry-tabs{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:36px;}
.ind-tab{
  font-size:13px; font-weight:500; background:var(--navy-2); border:1px solid var(--line); color:var(--muted);
  padding:10px 16px; border-radius:10px; transition:all .15s;
}
.ind-tab:hover{color:var(--text); border-color:var(--line-strong);}
.ind-tab.active{background:var(--navy-3); border-color:var(--gold); color:var(--text);}
.ind-panel{display:none;}
.ind-panel.active{display:block; animation:fadein .3s ease;}
@keyframes fadein{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}
.ind-intro{font-size:15px; color:var(--muted); max-width:760px; margin-bottom:18px;}
.ind-modtags{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:30px;}
.ind-modtag{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.05em; color:var(--muted-2); border:1px solid var(--line); padding:5px 11px; border-radius:100px;}
.ind-stats{display:flex; gap:28px; margin-bottom:34px; flex-wrap:wrap;}
.ind-stat{background:var(--navy-2); border:1px solid var(--line); border-radius:12px; padding:16px 20px; min-width:150px;}
.ind-stat b{display:block; font-family:'Space Grotesk',sans-serif; font-size:22px; color:var(--gold);}
.ind-stat span{font-size:12px; color:var(--muted);}
.usecase-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px;}
.usecase-card{background:var(--navy-2); border:1px solid var(--line); border-radius:12px; padding:18px 20px;}
.usecase-top{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:8px;}
.usecase-card h5{font-family:'Space Grotesk',sans-serif; font-size:15px; line-height:1.3;}
.type-tag{font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.07em; text-transform:uppercase; padding:3px 8px; border-radius:100px; white-space:nowrap; flex-shrink:0; background:var(--gold-dim); color:var(--gold-2);}
.usecase-card p{font-size:13px; color:var(--muted); margin-bottom:10px;}
.usecase-benefit{font-size:12px; color:var(--text); display:flex; align-items:center; gap:6px;}
.usecase-benefit::before{content:"◆"; color:var(--gold); font-size:9px;}

/* ===== PARTNER MODEL ===== */
.partner-hero{
  background:linear-gradient(135deg, var(--navy-2), var(--navy-3));
  border:1px solid var(--line); border-radius:20px; padding:44px; margin-bottom:44px;
}
.partner-hero h3{font-family:'Space Grotesk',sans-serif; font-size:26px; margin-bottom:14px; max-width:700px;}
.partner-hero p{color:var(--muted); font-size:15px; max-width:680px;}
.pillar-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:44px;}
.pillar-card{background:var(--navy-2); border:1px solid var(--line); border-radius:14px; padding:22px 20px;}
.pillar-card .pnum{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--gold); margin-bottom:12px; display:block;}
.pillar-card h4{font-family:'Space Grotesk',sans-serif; font-size:16px; margin-bottom:10px;}
.pillar-card ul{display:flex; flex-direction:column; gap:7px;}
.pillar-card ul li{font-size:12.8px; color:var(--muted); padding-left:14px; position:relative;}
.pillar-card ul li::before{content:"–"; position:absolute; left:0; color:var(--muted-2);}
.delivery-row{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.delivery-card{background:var(--navy-2); border:1px solid var(--line); border-radius:14px; padding:24px;}
.delivery-card h4{font-family:'Space Grotesk',sans-serif; font-size:16.5px; margin-bottom:8px;}
.delivery-card p{font-size:13px; color:var(--muted);}

/* ===== CERTIFICATIONS ===== */
.cert-strip{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px;}
.cert-chip{font-family:'IBM Plex Mono',monospace; font-size:11.5px; border:1px solid var(--line-strong); color:var(--text); padding:8px 14px; border-radius:8px; background:var(--navy-2);}
.cert-group{margin-bottom:26px;}
.cert-group h4{font-family:'Space Grotesk',sans-serif; font-size:16px; margin-bottom:4px;}
.cert-group .cg-desc{font-size:12.5px; color:var(--muted-2); margin-bottom:2px;}

/* ===== CTA / CONTACT ===== */
.cta-section{padding:100px 0 110px;}
.cta-box{
  background:linear-gradient(135deg, var(--navy-2), var(--navy-3));
  border:1px solid var(--line-strong); border-radius:24px; padding:64px 48px; text-align:center; position:relative; overflow:hidden;
}
.cta-box::before{content:""; position:absolute; top:-40%; right:-10%; width:400px; height:400px; border-radius:50%;
  background:radial-gradient(circle, rgba(228,167,53,0.12), transparent 70%);}
.cta-box h2{font-family:'Space Grotesk',sans-serif; font-size:34px; margin-bottom:14px; position:relative; z-index:1;}
.cta-box p{color:var(--muted); font-size:15.5px; max-width:520px; margin:0 auto 32px; position:relative; z-index:1;}
.cta-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:40px; position:relative; z-index:1;}
.contact-strip{
  display:flex; justify-content:center; gap:36px; flex-wrap:wrap; padding-top:30px; border-top:1px solid var(--line);
  font-family:'IBM Plex Mono',monospace; font-size:13px; position:relative; z-index:1;
}
.contact-strip .cs-label{display:block; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); margin-bottom:4px;}
.contact-strip .cs-val{color:var(--text);}
.contact-strip a.cs-val:hover{color:var(--gold);}

/* ===== FOOTER ===== */
footer{border-top:1px solid var(--line); padding:52px 0 36px;}
.foot-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px; margin-bottom:40px;}
.foot-brand p{font-size:13px; color:var(--muted); max-width:280px; margin-top:14px;}
.foot-col h5{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); margin-bottom:14px;}
.foot-col ul{display:flex; flex-direction:column; gap:10px;}
.foot-col a{font-size:13.5px; color:var(--muted); transition:color .15s;}
.foot-col a:hover{color:var(--gold);}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding-top:24px; border-top:1px solid var(--line);}
.foot-note{font-size:12px; color:var(--muted-2);}
.foot-social{display:flex; gap:14px;}
.foot-social a{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--muted-2);}
.foot-social a:hover{color:var(--gold);}

/* ===== RESPONSIVE ===== */
@media (max-width:980px){
  .tier-grid, .module-grid, .pillar-grid, .delivery-row{grid-template-columns:repeat(2,1fr);}
  .usecase-grid{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  nav.links{display:none;}
  .nav-toggle{display:flex;}
  h1.hero-title{font-size:42px;}
}
@media (max-width:640px){
  .wrap, .navrow{padding-left:20px; padding-right:20px;}
  h1.hero-title{font-size:33px;}
  .tier-grid, .module-grid, .pillar-grid, .delivery-row{grid-template-columns:1fr;}
  .stat-row{gap:26px;}
  h2.section-title{font-size:26px;}
  .section{padding:68px 0;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .cta-box{padding:44px 24px;}
  .cta-box h2{font-size:26px;}
  .contact-strip{gap:22px; justify-content:flex-start;}
}
