:root{
  --navy: #12172B;
  --navy-soft: #1B2140;
  --parchment: #F7F5F0;
  --slate: #5B6478;
  --amber: #F2A93B;
  --amber-deep: #C97F1E;
  --coral: #E85D4E;
  --line: rgba(247,245,240,0.12);
  --line-dark: rgba(18,23,43,0.1);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', sans-serif;
  background:var(--parchment);
  color:var(--navy);
  line-height:1.5;
  overflow-x:hidden;
}
h1,h2,h3{font-family:'Space Grotesk', sans-serif; letter-spacing:-0.02em;}
.mono{font-family:'IBM Plex Mono', monospace; letter-spacing:0.04em; text-transform:uppercase;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
@media(max-width:640px){.wrap{padding:0 20px;}}

/* NAV */
nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(18,23,43,0.92); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:72px;}
.brand{display:flex; align-items:center; gap:10px; color:var(--parchment); font-weight:600; font-size:19px;}
.brand .mark{width:26px; height:26px; position:relative;}
.brand .mark svg{width:100%; height:100%;}
nav ul{display:flex; gap:36px; list-style:none;}
nav ul li a{color:var(--parchment); opacity:0.75; font-size:14px; font-weight:500; transition:opacity .2s;}
nav ul li a:hover, nav ul li a.active{opacity:1;}
.nav-cta{
  background:var(--amber); color:var(--navy); padding:10px 20px; border-radius:3px;
  font-size:14px; font-weight:600; transition:transform .15s ease; border:none; cursor:pointer; font-family:'Inter';
}
.nav-cta:hover{transform:translateY(-1px);}
.nav-links-wrap{display:flex; align-items:center; gap:32px;}
@media(max-width:860px){ nav ul{display:none;} }

/* PAGE HERO (interior pages) */
.page-hero{background:var(--navy); color:var(--parchment); padding:160px 0 90px;}
.page-hero .eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--amber); margin-bottom:18px;}
.page-hero .eyebrow::before{content:''; width:6px; height:6px; background:var(--amber); border-radius:50%; display:inline-block;}
.page-hero h1{font-size:clamp(34px,5vw,52px); font-weight:700; margin-bottom:18px; max-width:700px;}
.page-hero p{font-size:17px; color:rgba(247,245,240,0.7); max-width:560px;}

/* HOME HERO */
header.hero{
  background:var(--navy); color:var(--parchment);
  padding:160px 0 120px; position:relative; overflow:hidden;
}
.hero-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px; align-items:center;}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;} header.hero{padding:140px 0 80px;}}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--amber); margin-bottom:22px;}
.eyebrow::before{content:''; width:6px; height:6px; background:var(--amber); border-radius:50%; display:inline-block;}
h1.headline{font-size:clamp(38px, 5.2vw, 62px); font-weight:700; line-height:1.05; margin-bottom:24px;}
h1.headline em{font-style:normal; color:var(--amber);}
.hero-sub{font-size:18px; color:rgba(247,245,240,0.72); max-width:480px; margin-bottom:36px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.btn-primary{
  background:var(--amber); color:var(--navy); padding:14px 28px; border-radius:3px;
  font-weight:600; font-size:15px; display:inline-block; transition:transform .15s ease, box-shadow .15s ease;
  border:none; cursor:pointer; font-family:'Inter';
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(242,169,59,0.25);}
.btn-ghost{
  border:1px solid rgba(247,245,240,0.3); color:var(--parchment); padding:14px 28px; border-radius:3px;
  font-weight:600; font-size:15px; display:inline-block; transition:border-color .15s ease;
  background:transparent; cursor:pointer; font-family:'Inter';
}
.btn-ghost:hover{border-color:var(--parchment);}

/* ORBIT SIGNATURE */
.orbit-stage{position:relative; height:440px; display:flex; align-items:center; justify-content:center;}
.orbit-ring{position:absolute; border:1px solid rgba(247,245,240,0.14); border-radius:50%;}
.ring1{width:420px; height:420px; animation:spin 32s linear infinite;}
.ring2{width:300px; height:300px; animation:spin 22s linear infinite reverse;}
.ring3{width:180px; height:180px; border-color:rgba(242,169,59,0.25);}
@keyframes spin{from{transform:rotate(0deg);} to{transform:rotate(360deg);}}
.hive-core{
  width:120px; height:120px; background:linear-gradient(145deg, var(--amber), var(--amber-deep));
  clip-path:polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  display:flex; align-items:center; justify-content:center; position:relative; z-index:5;
  box-shadow:0 0 60px rgba(242,169,59,0.35);
}
.hive-core span{font-family:'Space Grotesk'; font-weight:700; color:var(--navy); font-size:15px;}
.node{
  position:absolute; background:var(--navy-soft); border:1px solid var(--line);
  padding:9px 15px; border-radius:20px; font-family:'IBM Plex Mono'; font-size:11px;
  letter-spacing:0.05em; text-transform:uppercase; color:var(--parchment);
  display:flex; align-items:center; gap:6px; white-space:nowrap;
}
.node::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--amber);}
.n1{animation:orbit1 32s linear infinite;}
.n2{animation:orbit2 22s linear infinite reverse;}
.n3{animation:orbit1 32s linear infinite; animation-delay:-16s;}
.n4{animation:orbit2 22s linear infinite reverse; animation-delay:-11s;}
@keyframes orbit1{ from{transform:rotate(0deg) translateX(210px) rotate(0deg);} to{transform:rotate(360deg) translateX(210px) rotate(-360deg);} }
@keyframes orbit2{ from{transform:rotate(0deg) translateX(150px) rotate(0deg);} to{transform:rotate(360deg) translateX(150px) rotate(-360deg);} }
@media (prefers-reduced-motion: reduce){
  .ring1,.ring2,.n1,.n2,.n3,.n4{animation:none;}
  .n1{transform:translateX(210px);} .n3{transform:translateX(-210px);}
  .n2{transform:translateY(150px);} .n4{transform:translateY(-150px);}
}
@media(max-width:900px){.orbit-stage{height:340px;} .ring1{width:300px;height:300px;} .ring2{width:210px;height:210px;}
  @keyframes orbit1{ from{transform:rotate(0deg) translateX(150px) rotate(0deg);} to{transform:rotate(360deg) translateX(150px) rotate(-360deg);} }
  @keyframes orbit2{ from{transform:rotate(0deg) translateX(105px) rotate(0deg);} to{transform:rotate(360deg) translateX(105px) rotate(-360deg);} }
}

/* MARKETPLACE STRIP */
.strip{background:var(--parchment); border-bottom:1px solid var(--line-dark); padding:28px 0;}
.strip .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
.strip-label{font-size:12px; color:var(--slate);}
.strip-marks{display:flex; gap:32px; flex-wrap:wrap;}
.strip-marks span{font-family:'Space Grotesk'; font-weight:600; font-size:16px; color:var(--navy); opacity:0.55;}

/* SECTION GENERIC */
section{padding:110px 0;}
@media(max-width:640px){section{padding:70px 0;}}
.section-head{max-width:600px; margin-bottom:64px;}
.section-head .mono{font-size:12px; color:var(--amber-deep); margin-bottom:14px; display:block;}
.section-head h2{font-size:clamp(28px,3.6vw,40px); margin-bottom:16px;}
.section-head p{color:var(--slate); font-size:16px;}

/* SOURCING SECTION - dark band */
.sourcing{background:var(--navy); color:var(--parchment);}
.sourcing .section-head p{color:rgba(247,245,240,0.65);}
.sourcing .section-head .mono{color:var(--amber);}
.source-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);}
.source-card{background:var(--navy); padding:36px 32px;}
.source-card .num{font-family:'IBM Plex Mono'; color:var(--amber); font-size:13px; margin-bottom:16px; display:block;}
.source-card h3{font-size:19px; margin-bottom:10px;}
.source-card p{font-size:14.5px; color:rgba(247,245,240,0.65);}
@media(max-width:800px){.source-grid{grid-template-columns:1fr;}}

/* SERVICES */
.services-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark);}
.svc-card{background:var(--parchment); padding:40px; transition:background .2s ease;}
.svc-card:hover{background:#EFEBE0;}
.svc-card .mono{font-size:11px; color:var(--amber-deep); display:block; margin-bottom:14px;}
.svc-card h3{font-size:21px; margin-bottom:12px;}
.svc-card p{color:var(--slate); font-size:15px;}
@media(max-width:700px){.services-grid{grid-template-columns:1fr;}}

/* PROCESS */
.process{background:#EFEBE0;}
.process-row{display:flex; border-top:1px solid var(--line-dark);}
.process-row:last-child{border-bottom:1px solid var(--line-dark);}
.p-num{font-family:'IBM Plex Mono'; font-size:13px; color:var(--amber-deep); width:90px; padding:26px 0; flex-shrink:0;}
.p-body{padding:26px 0; flex:1; display:flex; justify-content:space-between; align-items:baseline; gap:20px; flex-wrap:wrap;}
.p-body h3{font-size:19px;}
.p-body p{color:var(--slate); font-size:14.5px; max-width:400px;}

/* STATS */
.stats{background:var(--navy); color:var(--parchment); text-align:center;}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:40px;}
.stat-num{font-family:'Space Grotesk'; font-size:clamp(30px,4vw,44px); font-weight:700; color:var(--amber);}
.stat-label{font-size:13px; color:rgba(247,245,240,0.6); margin-top:6px;}
@media(max-width:700px){.stats-grid{grid-template-columns:repeat(2,1fr); gap:36px;}}

/* ABOUT PAGE */
.about-story{display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px;}
@media(max-width:800px){.about-story{grid-template-columns:1fr;}}
.about-story p{color:var(--slate); margin-bottom:18px; font-size:16px;}
.values-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark);}
.value-card{background:var(--parchment); padding:34px 28px;}
.value-card h3{font-size:18px; margin-bottom:10px;}
.value-card p{color:var(--slate); font-size:14.5px;}
@media(max-width:800px){.values-grid{grid-template-columns:1fr;}}

/* CONTACT */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px;}
@media(max-width:800px){.contact-grid{grid-template-columns:1fr;}}
.contact-info h2{font-size:clamp(28px,3.6vw,38px); margin-bottom:18px;}
.contact-info p{color:var(--slate); margin-bottom:28px; max-width:400px;}
.contact-detail{margin-bottom:18px;}
.contact-detail .mono{font-size:11px; color:var(--amber-deep); display:block; margin-bottom:4px;}
.contact-detail div{font-size:16px; font-weight:500;}
.contact-detail a:hover{color:var(--coral);}
form{display:flex; flex-direction:column; gap:16px;}
form input, form textarea, form select{
  border:1px solid var(--line-dark); background:transparent; padding:14px 16px; font-family:'Inter';
  font-size:15px; border-radius:3px; color:var(--navy);
}
form textarea{resize:vertical; min-height:110px;}
form button{
  background:var(--navy); color:var(--parchment); border:none; padding:15px; border-radius:3px;
  font-weight:600; font-size:15px; cursor:pointer; transition:background .2s ease; font-family:'Inter';
}
form button:hover{background:var(--coral);}
form label{font-size:12px; color:var(--slate); margin-bottom:-10px;}

footer{background:var(--navy); color:rgba(247,245,240,0.5); padding:40px 0; font-size:13px;}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;}
footer a:hover{color:var(--amber);}

/* START PROJECT MODAL */
.modal-overlay{
  position:fixed; inset:0; background:rgba(18,23,43,0.72); backdrop-filter:blur(3px);
  display:none; align-items:center; justify-content:center; z-index:1000; padding:20px;
}
.modal-overlay.open{display:flex;}
.modal-box{
  background:var(--parchment); border-radius:6px; max-width:460px; width:100%;
  padding:40px; position:relative; max-height:90vh; overflow-y:auto;
}
.modal-close{
  position:absolute; top:18px; right:18px; background:none; border:none; cursor:pointer;
  font-size:22px; color:var(--slate); line-height:1; font-family:'Inter'; padding:4px;
}
.modal-close:hover{color:var(--navy);}
.modal-box h2{font-size:24px; margin-bottom:8px;}
.modal-box .modal-sub{color:var(--slate); font-size:14.5px; margin-bottom:24px;}
.modal-box form{gap:14px;}

::selection{background:var(--amber); color:var(--navy);}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--coral); outline-offset:2px;
}