:root{
  --navy-950:#0E1A30;
  --navy-900:#152544;
  --navy-800:#1B2A4A;
  --navy-600:#2E4269;
  --slate-500:#5B6B85;
  --slate-300:#9AA6BC;
  --gold-600:#9C7A44;
  --gold-500:#B08D57;
  --gold-300:#D8C39B;
  --cream-50:#F8F6F1;
  --cream-100:#F1EDE3;
  --white:#FFFFFF;
  --ink:#1C2333;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color:var(--ink);
  background:var(--cream-50);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:Georgia, 'Times New Roman', Times, serif;
  font-weight:700;
  color:var(--navy-900);
  letter-spacing:-0.01em;
}
.mono{font-family:inherit; letter-spacing:0.06em; text-transform:uppercase;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
.eyebrow{
  font-family:inherit;
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--gold-600);
  margin-bottom:14px;
  display:block;
}
.eyebrow.on-dark{color:var(--gold-300);}

/* ---------- Nav ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(248,246,241,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(27,42,74,0.08);
}
nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 32px; max-width:1120px; margin:0 auto;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand-mark{width:34px; height:34px; flex-shrink:0;}
.brand-word{
  font-family:Georgia, 'Times New Roman', Times, serif; font-size:17px; font-weight:500;
  letter-spacing:0.04em; color:var(--navy-900);
}
.brand-word .thin{color:var(--slate-500); font-weight:400;}
.navlinks{display:flex; gap:36px; font-size:14px; color:var(--navy-800);}
.navlinks a{position:relative; padding:4px 0;}
.navlinks a:hover{color:var(--gold-600);}
.navlinks a.active{color:var(--gold-600);}
.navlinks a.active::after{
  content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--gold-500);
}
.nav-cta{
  display:inline-block; font-size:13px; font-weight:500;
  border:1px solid var(--navy-800); color:var(--navy-900);
  padding:9px 20px; border-radius:2px; transition:all .2s ease;
}
.nav-cta:hover{background:var(--navy-900); color:var(--white);}

/* ---------- Hero (home) ---------- */
.hero{
  background:linear-gradient(180deg, var(--navy-950) 0%, var(--navy-900) 100%);
  color:var(--white);
  position:relative;
  overflow:hidden;
  padding:96px 0 0;
}
.hero-grid{
  display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px; align-items:center;
  max-width:1120px; margin:0 auto; padding:0 32px 80px;
}
.hero h1{
  font-size:clamp(34px, 4.6vw, 52px);
  line-height:1.12;
  color:var(--white);
  max-width:620px;
}
.hero h1 em{font-style:normal; color:var(--gold-300);}
.hero p.lede{
  margin-top:22px; font-size:17px; color:var(--slate-300);
  max-width:480px; line-height:1.7;
}
.hero-actions{display:flex; gap:16px; margin-top:34px; flex-wrap:wrap;}
.btn-primary{
  background:var(--gold-500); color:var(--navy-950); font-weight:600;
  font-size:14px; padding:14px 26px; border-radius:2px;
  display:inline-block; transition:transform .15s ease, background .2s ease;
}
.btn-primary:hover{background:var(--gold-300); transform:translateY(-1px);}
.btn-ghost{
  border:1px solid rgba(255,255,255,0.28); color:var(--white);
  font-size:14px; padding:14px 26px; border-radius:2px; display:inline-block;
  transition:border-color .2s ease;
}
.btn-ghost:hover{border-color:var(--gold-300); color:var(--gold-300);}

.hero-visual{position:relative; width:100%; aspect-ratio:1/1; max-width:480px; justify-self:end; margin-right:-28px;}
@media (max-width:1120px){.hero-visual{margin-right:0;}}

/* ---------- Ambient watermark ring (echoes the mark, used sparingly) ---------- */
.watermark-ring{
  position:absolute; border-radius:50%; border:1px solid rgba(27,42,74,0.06);
  pointer-events:none; z-index:0;
}

.capstrip{
  border-top:1px solid rgba(255,255,255,0.1);
  background:rgba(0,0,0,0.14);
}
.capstrip-inner{
  max-width:1120px; margin:0 auto; padding:26px 32px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
}
.cap-item{color:var(--slate-300); font-size:13.5px; display:flex; gap:12px; align-items:flex-start;}
.cap-item .dot{width:6px; height:6px; border-radius:50%; background:var(--gold-500); margin-top:7px; flex-shrink:0;}
.cap-item strong{color:var(--white); font-weight:500; display:block; margin-bottom:2px;}

/* ---------- Inner page hero (non-home pages) ---------- */
.page-hero{
  background:linear-gradient(180deg, var(--navy-950) 0%, var(--navy-900) 100%);
  color:var(--white);
  padding:72px 0 56px;
}
.page-hero h1{
  font-size:clamp(30px,4vw,44px); color:var(--white); max-width:640px;
}
.page-hero p.lede{margin-top:16px; color:var(--slate-300); font-size:16px; max-width:560px; line-height:1.7;}

/* ---------- Section shells ---------- */
section{padding:96px 0; scroll-margin-top:84px;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:clamp(26px,3vw,34px); line-height:1.2;}
.section-head p{color:var(--slate-500); margin-top:16px; font-size:16px; max-width:560px;}
.rule{width:56px; height:1px; background:var(--gold-500); margin:18px 0;}

/* ---------- Focus areas (renewable energy / data center imagery) ---------- */
.focus-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.focus-item img{
  width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:2px; display:block;
  filter:saturate(1.03);
}
.focus-caption{
  margin-top:12px; font-family:inherit; font-size:12px; color:var(--slate-500);
  letter-spacing:0.03em;
}
@media (max-width:860px){.focus-grid{grid-template-columns:1fr; gap:28px;}}

/* ---------- Services (editorial list, not cards) ---------- */
.services-columns{display:grid; grid-template-columns:1fr 1fr; gap:0 72px;}
.service-group + .service-group{margin-top:0;}
.service-group-label{
  font-family:inherit; font-size:12px; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--gold-600); padding-bottom:16px; border-bottom:1px solid rgba(27,42,74,0.14); margin-bottom:4px;
}
.service-row{
  padding:26px 0; border-bottom:1px solid rgba(27,42,74,0.1);
  display:flex; flex-direction:column; gap:8px;
}
.service-row h3{font-size:18px; font-weight:500; color:var(--navy-900);}
.service-row p{font-size:14.5px; color:var(--slate-500); line-height:1.6; max-width:34ch;}
@media (max-width:860px){.services-columns{grid-template-columns:1fr; gap:0;} .service-group{margin-bottom:8px;}}

/* ---------- Home: "where to start" editorial list ---------- */
.start-block{display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:start;}
.start-block h2{font-size:clamp(24px,3vw,32px); max-width:20ch;}
.start-list{display:flex; flex-direction:column;}
.start-link{
  display:flex; align-items:baseline; justify-content:space-between; gap:24px;
  padding:24px 0; border-bottom:1px solid rgba(27,42,74,0.12); transition:padding-left .2s ease;
}
.start-link:first-child{border-top:1px solid rgba(27,42,74,0.12);}
.start-link:hover{padding-left:10px;}
.start-link .sl-title{font-family:Georgia, 'Times New Roman', Times, serif; font-size:22px; font-weight:500; color:var(--navy-900);}
.start-link .sl-desc{font-size:13.5px; color:var(--slate-500); max-width:34ch; margin-top:6px;}
.start-link .sl-arrow{font-size:20px; color:var(--gold-600); flex-shrink:0; transition:transform .2s ease;}
.start-link:hover .sl-arrow{transform:translateX(4px);}
@media (max-width:860px){.start-block{grid-template-columns:1fr; gap:28px;}}

/* ---------- Text link (used instead of ghost button in places) ---------- */
.link-arrow-lg{
  font-size:14.5px; font-weight:500; color:var(--gold-300); border-bottom:1px solid rgba(216,195,155,0.4);
  padding-bottom:3px; display:inline-block; transition:border-color .2s ease, color .2s ease;
}
.link-arrow-lg:hover{border-color:var(--gold-300);}
.link-arrow-lg.on-light{color:var(--navy-900); border-bottom-color:rgba(27,42,74,0.3);}

/* ---------- Figure caption (editorial annotation) ---------- */
.fig-caption{
  font-family:inherit; font-size:11.5px; color:var(--slate-300); letter-spacing:0.04em;
  margin-top:14px; text-align:right;
}
.fig-caption.on-light{color:var(--slate-500);}

/* ---------- Approach: connected timeline ---------- */
.approach{background:var(--navy-950); color:var(--white);}
.approach .section-head h2{color:var(--white);}
.approach .section-head p{color:var(--slate-300);}
.timeline{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:32px; padding-top:8px;}
.timeline::before{
  content:''; position:absolute; top:6px; left:0; right:0; height:1px; background:rgba(255,255,255,0.16);
}
.tl-step{position:relative; padding-top:34px;}
.tl-dot{
  position:absolute; top:0; left:0; width:11px; height:11px; border-radius:50%;
  background:var(--navy-950); border:1.5px solid var(--gold-400,var(--gold-300)); transform:translateY(0.5px);
}
.tl-step:nth-child(odd) .tl-dot{border-color:var(--gold-300);}
.tl-step:nth-child(even) .tl-dot{border-color:rgba(255,255,255,0.5);}
.tl-label{
  font-family:inherit; font-size:11px; color:var(--gold-300); letter-spacing:0.08em;
  text-transform:uppercase; display:block; margin-bottom:10px;
}
.tl-step h3{color:var(--white); font-size:17px; margin-bottom:10px; font-weight:500;}
.tl-step p{color:var(--slate-300); font-size:14px; line-height:1.65; max-width:30ch;}
@media (max-width:860px){
  .timeline{grid-template-columns:1fr 1fr; row-gap:40px;}
  .timeline::before{display:none;}
  .tl-step{padding-top:0;}
  .tl-dot{position:static; margin-bottom:14px;}
}
@media (max-width:520px){.timeline{grid-template-columns:1fr;}}

/* ---------- Diagram section ---------- */
.diagram-section{background:var(--cream-100);}
.diagram-wrap{
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:center;
}
.diagram-copy p{color:var(--slate-500); font-size:15.5px; line-height:1.75; margin-bottom:16px;}
.diagram-copy .rule{margin-bottom:24px;}

/* ---------- Sectors / Industries ---------- */
.industries{display:flex; flex-wrap:wrap; gap:12px;}
.industry-tag{
  border:1px solid rgba(27,42,74,0.18); color:var(--navy-800);
  font-size:13.5px; padding:11px 20px; border-radius:2px; background:var(--white);
}
.industry-tag.filled{background:var(--navy-900); color:var(--white); border-color:var(--navy-900);}
.sector-split{display:grid; grid-template-columns:1fr 1fr; gap:0; position:relative;}
.sector-split::before{content:''; position:absolute; top:4px; bottom:4px; left:50%; width:1px; background:rgba(27,42,74,0.14);}
.sector-split > div:first-child{padding-right:44px;}
.sector-split > div:last-child{padding-left:44px;}
@media (max-width:860px){
  .sector-split{grid-template-columns:1fr; gap:40px;}
  .sector-split::before{display:none;}
  .sector-split > div:first-child, .sector-split > div:last-child{padding:0;}
}

/* ---------- About ---------- */
.about{
  display:grid; grid-template-columns:0.8fr 1.2fr; gap:64px; align-items:start;
}
.about-portrait{
  aspect-ratio:4/5; background:var(--navy-800); border-radius:2px;
  display:flex; align-items:center; justify-content:center; color:var(--slate-300);
  font-family:inherit; font-size:12px; text-align:center; padding:24px;
}
.about-copy p{color:var(--slate-500); font-size:16px; line-height:1.8; margin-bottom:18px;}
.about-copy strong{color:var(--navy-900); font-weight:500;}
.about-copy p.lead-para::first-letter{
  font-family:Georgia, 'Times New Roman', Times, serif; font-size:52px; font-weight:500; color:var(--gold-600);
  float:left; line-height:0.85; margin:6px 8px 0 0;
}

/* ---------- Testimonial / quote strip ---------- */
.quote-strip{background:var(--navy-900); color:var(--white); padding:80px 0;}
.quote-strip blockquote{
  font-family:Georgia, 'Times New Roman', Times, serif; font-size:clamp(22px,3vw,30px);
  line-height:1.5; max-width:760px; color:var(--white); font-weight:400;
}
.quote-strip cite{
  display:block; margin-top:24px; font-style:normal; font-size:14px; color:var(--gold-300);
}

/* ---------- Closing CTA ---------- */
.closing-cta{padding:88px 0; background:var(--cream-50);}

/* ---------- Contact ---------- */
.contact-wrap{
  display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px;
}
.contact-info h2{font-size:clamp(26px,3vw,34px);}
.contact-info p{color:var(--slate-500); margin-top:16px; font-size:16px; line-height:1.7;}
.contact-detail{margin-top:32px; font-size:14.5px;}
.contact-detail div{margin-bottom:14px; color:var(--navy-800);}
.contact-detail span{color:var(--slate-500); display:block; font-size:12px; text-transform:uppercase; letter-spacing:0.08em; margin-bottom:3px; font-family:inherit;}

form{display:flex; flex-direction:column; gap:18px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
label{font-size:12.5px; text-transform:uppercase; letter-spacing:0.07em; color:var(--slate-500); font-family:inherit; margin-bottom:8px; display:block;}
input, textarea{
  width:100%; border:1px solid rgba(27,42,74,0.2); background:var(--white);
  padding:13px 14px; font-family:inherit; font-size:14.5px; border-radius:2px;
  color:var(--ink); transition:border-color .15s ease;
}
input:focus, textarea:focus{outline:none; border-color:var(--gold-500);}
textarea{resize:vertical; min-height:110px;}
.submit-btn{
  background:var(--navy-900); color:var(--white); font-weight:500; font-size:14px;
  padding:15px 28px; border:none; border-radius:2px; cursor:pointer; width:fit-content;
  transition:background .2s ease;
}
.submit-btn:hover{background:var(--gold-600);}

/* ---------- Footer ---------- */
footer{background:var(--navy-950); color:var(--slate-300); padding:56px 0 32px;}
.footer-top{
  display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:32px;
  padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,0.1);
}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand .brand-word{color:var(--white);}
.footer-brand .brand-word .thin{color:var(--slate-300);}
.footer-links{display:flex; gap:32px; font-size:13.5px;}
.footer-links a:hover{color:var(--gold-300);}
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; padding-top:24px; font-size:12.5px; color:var(--slate-500);
  flex-wrap:wrap; gap:12px;
}

/* ---------- Motion ---------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- Responsive ---------- */
@media (max-width:860px){
  .navlinks, .nav-cta{display:none;}
  .hero-grid{grid-template-columns:1fr; padding-bottom:56px;}
  .hero-visual{justify-self:center; margin-top:24px;}
  .capstrip-inner{grid-template-columns:1fr; gap:16px;}
  .services-grid{grid-template-columns:1fr 1fr;}
  .explore-grid{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr 1fr;}
  .step{border-bottom:1px solid rgba(255,255,255,0.12); padding-bottom:8px;}
  .diagram-wrap, .about, .contact-wrap{grid-template-columns:1fr;}
  .about-portrait{max-width:260px;}
  .form-row{grid-template-columns:1fr;}
  section{padding:64px 0;}
}
@media (max-width:520px){
  .services-grid{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .step{border-right:none;}
}