:root{
  --ink:#030708;
  --ink-2:#071012;
  --cream:#f7f3e9;
  --paper:#fffdf8;
  --text:#fbfaf6;
  --muted:#bfc3bf;
  --gold:#f4b51f;
  --gold-deep:#c98700;
  --line:rgba(244,181,31,.62);
  --shadow:0 28px 70px rgba(0,0,0,.30);
  --max:1480px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--text);font-family:"Montserrat",Arial,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
.shell{width:min(var(--max),calc(100% - 64px));margin-inline:auto}
.anchor{position:absolute;transform:translateY(-120px)}

.site-header{position:sticky;top:0;z-index:50;min-height:104px;padding:0 42px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:40px;background:linear-gradient(90deg,#071011 0%,#020607 72%);border-bottom:1px solid rgba(244,181,31,.55);box-shadow:0 6px 24px rgba(0,0,0,.28)}
.brand{display:flex;align-items:center;gap:17px;min-width:330px}.brand-mark{font-family:"Cormorant Garamond",serif;font-size:62px;font-style:italic;font-weight:700;line-height:.78;letter-spacing:-8px;color:var(--gold);text-shadow:0 0 16px rgba(244,181,31,.16)}.brand-copy{display:flex;flex-direction:column;gap:5px}.brand-copy strong{font-size:21px;letter-spacing:2.5px}.brand-copy small{font-size:12px;letter-spacing:3.7px}
.site-nav{display:flex;justify-content:center;gap:30px;font-size:12px;text-transform:uppercase;white-space:nowrap}.site-nav a{transition:color .2s ease}.site-nav a:hover,.site-nav a:focus-visible{color:var(--gold)}
.menu-toggle{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;padding:17px 24px;border:1px solid var(--gold);font-size:13px;font-weight:700;letter-spacing:.35px;text-transform:uppercase;cursor:pointer;transition:transform .2s ease,background .2s ease,color .2s ease}.btn:hover,.btn:focus-visible{transform:translateY(-2px)}.btn-gold{background:linear-gradient(135deg,#ffd45d,#f2ad13);color:#050606}.btn-outline{background:rgba(0,0,0,.08);color:var(--gold)}.header-cta{min-width:220px}.small-btn{padding:14px 19px;font-size:11px}

.hero{min-height:500px;background:#030708;overflow:hidden}.hero-inner{display:grid;grid-template-columns:39% 61%;min-height:500px}.hero-copy{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:46px 0 46px 24px}.eyebrow{margin:0 0 18px;color:var(--gold);font-weight:700;font-size:15px;letter-spacing:.4px}.eyebrow span{margin:0 11px}.hero h1{font-family:"Cormorant Garamond",serif;font-size:78px;line-height:.89;letter-spacing:-1.8px;margin:0}.hero h1 em{color:var(--gold);font-weight:600}.hero-lede{max-width:600px;margin:24px 0 28px;font-size:18px;color:#ebebe7}.hero-lede strong{color:var(--gold)}.hero-actions{display:flex;gap:16px;flex-wrap:wrap}.hero-visual{position:relative;min-width:0}.hero-visual:before{content:"";position:absolute;inset:0 auto 0 -1px;width:190px;z-index:1;background:linear-gradient(90deg,#030708 4%,rgba(3,7,8,.78) 34%,transparent)}.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center}

.industry-strip{padding:34px 0 42px;background:linear-gradient(180deg,#081214,#041012 72%,#020607);border-block:1px solid rgba(255,255,255,.06)}.industry-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.industry-card{position:relative;isolation:isolate;min-height:188px;padding:20px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;border:1px solid rgba(244,181,31,.77);background:#061012;box-shadow:inset 0 0 0 1px rgba(255,255,255,.01);transition:transform .28s ease,border-color .28s ease}.industry-card::before{content:"";position:absolute;inset:-8px;z-index:-3;background-image:var(--industry-image);background-size:cover;background-position:var(--pos);filter:grayscale(.28) saturate(.72) brightness(.62);transform:scale(1.08);transition:filter .55s ease,transform .65s ease}.industry-card::after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(3,7,8,.83),rgba(3,7,8,.93));transition:background .55s ease}.industry-card:hover,.industry-card:focus-visible{transform:translateY(-3px);border-color:var(--gold)}.industry-card:hover::before,.industry-card:focus-visible::before{filter:grayscale(0) saturate(1.05) brightness(.96);transform:scale(1.01)}.industry-card:hover::after,.industry-card:focus-visible::after{background:linear-gradient(180deg,rgba(3,7,8,.20),rgba(3,7,8,.44))}.industry-icon{font-size:38px;line-height:1;margin-bottom:8px;color:#fff;text-shadow:0 2px 12px #000}.industry-card h2{margin:0 0 5px;font-size:13px;line-height:1.25;text-transform:uppercase}.industry-card p{margin:0 0 11px;font-size:12px;color:#f6f6f2}.industry-card strong{font-size:11px;letter-spacing:.9px;text-transform:uppercase;color:var(--gold)}

.capabilities{padding:72px 0 76px;background:var(--cream);color:#111}.capability-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.capability-card,.process-card{background:var(--paper);border:1px solid rgba(20,20,20,.08);box-shadow:0 13px 40px rgba(40,30,10,.08);overflow:hidden}.capability-card{display:grid;grid-template-columns:1.05fr .95fr;grid-template-rows:1fr auto;min-height:405px}.capability-copy{padding:34px 16px 28px 34px;position:relative;z-index:2}.section-kicker{margin:0 0 8px;color:#8b5a00;font-weight:700;font-size:12px;letter-spacing:2px;text-transform:uppercase}.capability-copy h2,.process-intro h2,.about-copy h2,.project-form-wrap h2{font-family:"Cormorant Garamond",serif;line-height:.94;margin:0;color:#111}.capability-copy h2{font-size:42px}.capability-copy>p:not(.section-kicker){margin:14px 0 22px;max-width:500px;font-size:15px;color:#3d3d3d}.capability-image{position:relative;min-height:300px;background-size:contain;background-repeat:no-repeat;background-position:center right;background-color:var(--paper)}.capability-image:before{content:"";position:absolute;inset:0 auto 0 -1px;width:100px;background:linear-gradient(90deg,var(--paper),rgba(255,253,248,.6),transparent)}.materials-image{background-image:url('assets/materials-photo-clean.jpg');background-position:center center}.logistics-image{background-image:url('assets/logistics-photo-clean.jpg');background-position:center center}.sustainability-image{background-image:url('assets/sustainability-photo-clean.jpg');background-position:center center}.icon-row{grid-column:1/-1;display:grid;background:#fff;border-top:1px solid rgba(0,0,0,.08);padding:13px 10px 15px}.icon-row.eight{grid-template-columns:repeat(8,1fr)}.icon-row.five{grid-template-columns:repeat(5,1fr)}.icon-row span{display:flex;min-width:0;flex-direction:column;align-items:center;gap:4px;padding:0 5px;text-align:center}.icon-row b{font-size:23px;line-height:1;color:#191919}.icon-row small{font-size:8.5px;line-height:1.15;color:#252525;font-weight:600}
.process-card{padding:34px;display:flex;flex-direction:column}.process-intro{max-width:650px}.process-intro h2{font-size:46px}.process-intro>p:not(.section-kicker){font-size:15px;color:#3d3d3d;margin:11px 0 0}.process-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:8px;margin:28px 0 23px}.process-flow i{font-style:normal;color:#c7983b;font-size:21px}.process-step{text-align:center}.process-step span{width:64px;height:64px;margin:0 auto 8px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(0,0,0,.1);box-shadow:0 7px 20px rgba(0,0,0,.07);font-family:"Cormorant Garamond",serif;font-size:26px;background:#fff}.process-step b{display:block;font-size:11px;text-transform:uppercase}.process-step small{display:block;margin-top:2px;font-size:9px;color:#555}.process-card .small-btn{align-self:flex-start}

.future-banner{position:relative;min-height:355px;overflow:hidden;background:#020607}.future-bg{position:absolute;inset:0;background-color:#020607;background-image:url('assets/future-earth-full.jpg');background-position:right center;background-size:contain;background-repeat:no-repeat}.future-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,5,7,.97) 0%,rgba(1,5,7,.86) 38%,rgba(1,5,7,.33) 70%,rgba(1,5,7,.05) 100%)}.future-content{position:relative;z-index:2;padding-top:70px;padding-bottom:62px}.future-content>p{margin:0 0 9px;color:var(--gold);font-size:12px;font-weight:700;letter-spacing:2.1px}.future-content h2{font-family:"Cormorant Garamond",serif;font-size:68px;line-height:.9;margin:0}.future-content h2 em{color:var(--gold);font-style:normal}.future-content h3{font-size:18px;font-weight:500;margin:13px 0 25px}

.about-contact{position:relative;background:var(--cream);color:#111;padding:54px 0}.about-contact-grid{display:grid;grid-template-columns:1fr .9fr 1.15fr;gap:42px;align-items:start}.about-copy .section-kicker{margin-bottom:7px}.about-copy h2{font-size:43px}.about-copy>p:not(.section-kicker){color:#3c3c3c;font-size:14px;margin:12px 0 22px}.trust-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-inline:1px solid rgba(0,0,0,.09);padding:12px 28px}.trust-grid div{display:flex;align-items:center;gap:14px;min-height:90px}.trust-grid b{font-size:39px;font-weight:400}.trust-grid span{font-size:11px;line-height:1.3;font-weight:700;text-transform:uppercase}.project-form-wrap{background:#fffaf0;border:1px solid rgba(0,0,0,.08);padding:24px}.project-form-wrap h2{font-size:38px}.project-form-wrap>p{margin:2px 0 13px;font-size:12px;color:#4e4e4e}.project-form{display:grid;gap:9px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.project-form label{display:block}.project-form label>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.project-form input,.project-form select,.project-form textarea{width:100%;padding:11px 12px;background:#fff;border:1px solid rgba(0,0,0,.16);color:#222;outline:none;font-size:12px}.project-form input:focus,.project-form select:focus,.project-form textarea:focus{border-color:var(--gold-deep)}.project-form textarea{resize:vertical}.project-form .btn{width:100%;padding:13px 18px;font-size:11px}.form-status{margin:0;font-size:11px;color:#6b6b6b;min-height:15px}

.site-footer{background:#020607;border-top:1px solid rgba(244,181,31,.45)}.footer-main{min-height:96px;display:grid;grid-template-columns:auto 1fr auto;gap:34px;align-items:center}.footer-brand{min-width:260px}.footer-brand .brand-mark{font-size:48px}.footer-brand .brand-copy strong{font-size:15px}.footer-brand .brand-copy small{font-size:9px}.footer-main nav{display:flex;justify-content:center;gap:22px;font-size:10px}.footer-main nav a:hover{color:var(--gold)}.socials{display:flex;gap:18px;color:var(--gold);font-weight:700}.footer-bottom{min-height:40px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;color:#9ba09c;font-size:9px}

@media(max-width:1220px){
  .site-header{grid-template-columns:auto auto 1fr;min-height:88px;padding:15px 22px}.brand{min-width:0}.brand-mark{font-size:50px}.brand-copy strong{font-size:17px}.brand-copy small{font-size:10px}.menu-toggle{display:block;justify-self:end;border:1px solid var(--gold);background:transparent;color:var(--gold);padding:9px 13px;text-transform:uppercase}.site-nav{display:none;grid-column:1/-1;flex-direction:column;align-items:flex-start;gap:13px;padding:10px 0}.site-nav.open{display:flex}.header-cta{display:none}
  .hero-inner{grid-template-columns:1fr}.hero-copy{padding:62px 0 30px}.hero-visual{height:390px}.hero-visual:before{inset:-1px 0 auto 0;width:auto;height:120px;background:linear-gradient(180deg,#030708 5%,transparent)}
  .industry-grid{grid-template-columns:repeat(3,1fr)}
  .capability-grid{grid-template-columns:1fr}.capability-card{min-height:390px}.about-contact-grid{grid-template-columns:1fr 1fr}.project-form-wrap{grid-column:1/-1}.trust-grid{border-right:0}
}
@media(max-width:820px){
  .shell{width:min(var(--max),calc(100% - 30px))}.hero h1{font-size:60px}.hero-lede{font-size:16px}.eyebrow{font-size:11px;line-height:1.8}.eyebrow span{margin:0 5px}.hero-visual{height:300px}
  .industry-grid{grid-template-columns:1fr 1fr}.industry-card{min-height:175px}
  .capabilities{padding:48px 0}.capability-card{grid-template-columns:1fr;grid-template-rows:auto 270px auto}.capability-copy{padding:28px}.capability-copy h2,.process-intro h2{font-size:38px}.capability-image:before{inset:-1px 0 auto 0;width:auto;height:70px;background:linear-gradient(180deg,var(--paper),transparent)}.icon-row.eight{grid-template-columns:repeat(4,1fr);row-gap:15px}.process-card{padding:28px}.process-flow{grid-template-columns:1fr 1fr 1fr;gap:18px}.process-flow i{display:none}.future-banner{min-height:420px}.future-content{padding-top:80px}.future-content h2{font-size:54px}.about-contact-grid{grid-template-columns:1fr}.trust-grid{border:0;padding:0}.project-form-wrap{grid-column:auto}.footer-main{grid-template-columns:1fr;justify-items:start;padding:24px 0}.footer-main nav{justify-content:flex-start;flex-wrap:wrap}.footer-bottom{align-items:flex-start;gap:8px;flex-direction:column;padding:13px 0}
}
@media(max-width:520px){
  .brand-copy{display:none}.hero h1{font-size:50px}.hero-actions{flex-direction:column}.hero-actions .btn{width:100%}.hero-visual{height:240px}.industry-grid{grid-template-columns:1fr}.industry-card{min-height:160px}.capability-copy h2,.process-intro h2,.about-copy h2{font-size:35px}.icon-row.eight,.icon-row.five{grid-template-columns:repeat(2,1fr);row-gap:14px}.process-flow{grid-template-columns:1fr 1fr}.future-content h2{font-size:46px}.future-content h3{font-size:15px}.form-row{grid-template-columns:1fr}.trust-grid{grid-template-columns:1fr}.site-header{gap:14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.industry-card,.industry-card::before,.industry-card::after,.btn{transition:none}}

/* 2026-09-23 desktop lock: match approved homepage proportions */
@media (min-width:1221px){
  :root{--max:1560px}
  .shell{width:min(var(--max),calc(100% - 40px))}
  .site-header{min-height:82px;height:82px;padding:0 30px;gap:28px}
  .brand{min-width:295px;gap:14px}
  .brand-mark{font-size:52px;letter-spacing:-7px}
  .brand-copy{gap:3px}
  .brand-copy strong{font-size:17px;letter-spacing:2.2px}
  .brand-copy small{font-size:10px;letter-spacing:3.2px}
  .site-nav{gap:24px;font-size:10.5px}
  .header-cta{min-width:190px;padding:14px 18px;font-size:11px}

  .hero{min-height:360px;height:360px}
  .hero-inner{grid-template-columns:37% 63%;min-height:360px;height:360px}
  .hero-copy{padding:30px 12px 28px 18px}
  .eyebrow{font-size:12.5px;margin-bottom:13px;white-space:nowrap}
  .eyebrow span{margin:0 8px}
  .hero h1{font-size:60px;line-height:.88;letter-spacing:-1.2px}
  .hero h1 em{white-space:nowrap}
  .hero-lede{font-size:15px;line-height:1.5;max-width:520px;margin:17px 0 20px}
  .hero-actions{gap:12px}
  .hero-actions .btn{padding:13px 18px;font-size:11px}
  .hero-visual:before{width:135px}
  .hero-visual img{object-position:center center}

  .industry-strip{padding:20px 0 24px}
  .industry-grid{gap:10px}
  .industry-card{min-height:154px;padding:14px 9px}
  .industry-icon{font-size:30px;margin-bottom:6px}
  .industry-card h2{font-size:11px;margin-bottom:4px}
  .industry-card p{font-size:10px;margin-bottom:8px}
  .industry-card strong{font-size:9.5px}
}

@media (min-width:1221px) and (max-width:1400px){
  .site-header{padding-inline:20px;gap:18px}
  .brand{min-width:260px}
  .brand-mark{font-size:48px}
  .brand-copy strong{font-size:15px}
  .brand-copy small{font-size:9px}
  .site-nav{gap:18px;font-size:9.5px}
  .header-cta{min-width:168px;padding:12px 14px;font-size:10px}
  .hero h1{font-size:56px}
  .hero-lede{font-size:14px}
}

/* FINAL LOCKED DESKTOP COMPOSITION — 2026-09-23
   Preserve the approved homepage layout on ordinary laptop/desktop viewports. */
@media (min-width:981px){
  :root{--max:1540px}
  .shell{width:min(var(--max),calc(100% - 32px))}

  .site-header{
    height:76px;min-height:76px;padding:0 24px;gap:20px;
    grid-template-columns:minmax(250px,300px) minmax(0,1fr) auto;
  }
  .brand{min-width:0;gap:13px}
  .brand-mark{font-size:48px;letter-spacing:-7px}
  .brand-copy{gap:2px;white-space:nowrap}
  .brand-copy strong{font-size:15px;letter-spacing:2px}
  .brand-copy small{font-size:9px;letter-spacing:3px}
  .menu-toggle{display:none!important}
  .site-nav{display:flex!important;grid-column:auto;flex-direction:row;align-items:center;justify-content:center;gap:clamp(13px,1.55vw,25px);padding:0;font-size:clamp(8px,.72vw,10.5px);white-space:nowrap}
  .header-cta{display:inline-flex;min-width:172px;padding:12px 15px;font-size:10px;white-space:nowrap}

  .hero{height:342px;min-height:342px}
  .hero-inner{height:342px;min-height:342px;grid-template-columns:38% 62%}
  .hero-copy{padding:27px 10px 25px 16px;min-width:0}
  .eyebrow{font-size:clamp(9.5px,.82vw,12.5px);line-height:1.25;margin:0 0 12px;white-space:nowrap}
  .eyebrow span{margin:0 7px}
  .hero h1{font-size:clamp(46px,4.15vw,62px);line-height:.87;letter-spacing:-1.1px}
  .hero h1 em{white-space:nowrap}
  .hero-lede{font-size:clamp(12px,1.02vw,15px);line-height:1.48;max-width:490px;margin:15px 0 18px}
  .hero-actions{gap:10px;flex-wrap:nowrap}
  .hero-actions .btn{padding:11px 15px;font-size:9.5px;white-space:nowrap}
  .hero-visual{height:342px}
  .hero-visual:before{width:115px;background:linear-gradient(90deg,#030708 4%,rgba(3,7,8,.74) 34%,transparent)}
  .hero-visual img{height:100%;width:100%;object-fit:cover;object-position:center center}

  .industry-strip{padding:16px 0 18px}
  .industry-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
  .industry-card{min-height:136px;height:136px;padding:10px 7px}
  .industry-card::before{inset:-4px;transform:scale(1.05)}
  .industry-card::after{background:linear-gradient(180deg,rgba(3,7,8,.78),rgba(3,7,8,.91))}
  .industry-icon{font-size:27px;margin-bottom:5px}
  .industry-card h2{font-size:clamp(8.5px,.72vw,11px);line-height:1.15;margin:0 0 3px;white-space:nowrap}
  .industry-card p{font-size:clamp(8px,.66vw,10px);line-height:1.15;margin:0 0 6px;white-space:nowrap}
  .industry-card strong{font-size:clamp(7.5px,.62vw,9.5px);line-height:1;white-space:nowrap}
}

/* Keep the desktop composition on smaller Windows/laptop CSS viewports.
   Only switch to the mobile navigation/layout below 980px. */
@media (min-width:981px) and (max-width:1180px){
  .site-header{grid-template-columns:235px minmax(0,1fr) 154px;padding-inline:15px;gap:12px}
  .brand-mark{font-size:43px}
  .brand-copy strong{font-size:13px;letter-spacing:1.6px}
  .brand-copy small{font-size:8px;letter-spacing:2.4px}
  .site-nav{gap:11px;font-size:7.9px}
  .header-cta{min-width:154px;padding-inline:10px;font-size:8.6px}
  .hero{height:325px;min-height:325px}
  .hero-inner,.hero-visual{height:325px;min-height:325px}
  .hero h1{font-size:46px}
  .hero-lede{font-size:12px;max-width:410px}
  .hero-actions .btn{font-size:8.7px;padding:10px 12px}
  .industry-card{height:128px;min-height:128px}
  .industry-card h2{font-size:8.4px}
  .industry-card p{font-size:7.8px}
  .industry-card strong{font-size:7.5px}
}

/* Replace the older tablet breakpoint: true compact/tablet layout begins here. */
@media (max-width:980px){
  .site-header{grid-template-columns:auto auto 1fr;min-height:82px;height:auto;padding:14px 18px}
  .brand{min-width:0}.brand-mark{font-size:48px}.brand-copy strong{font-size:16px}.brand-copy small{font-size:9px}
  .menu-toggle{display:block;justify-self:end;border:1px solid var(--gold);background:transparent;color:var(--gold);padding:9px 13px;text-transform:uppercase}
  .site-nav{display:none;grid-column:1/-1;flex-direction:column;align-items:flex-start;gap:13px;padding:10px 0}.site-nav.open{display:flex}.header-cta{display:none}
  .hero{height:auto;min-height:0}.hero-inner{height:auto;min-height:0;grid-template-columns:1fr}.hero-copy{padding:52px 0 28px}.hero-visual{height:330px}.hero-visual:before{inset:-1px 0 auto 0;width:auto;height:100px;background:linear-gradient(180deg,#030708 5%,transparent)}
  .industry-grid{grid-template-columns:repeat(3,1fr)}
  .capability-grid{grid-template-columns:1fr}.capability-card{min-height:390px}.about-contact-grid{grid-template-columns:1fr 1fr}.project-form-wrap{grid-column:1/-1}.trust-grid{border-right:0}
}

/* Locked image visibility + cleaner CTA treatment */
@media (min-width:981px){
  .capability-card{grid-template-columns:44% 56%}
  .capability-image{min-height:330px}
  .materials-image,.logistics-image,.sustainability-image{
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:center right!important;
  }
  .future-bg{
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:right center!important;
  }
  .future-shade{
    background:linear-gradient(90deg,rgba(1,5,7,.98) 0%,rgba(1,5,7,.90) 34%,rgba(1,5,7,.48) 58%,rgba(1,5,7,.08) 78%,rgba(1,5,7,0) 100%)
  }
}

/* CLEAN BACKGROUND LOCK — remove baked-in stray lettering from approved imagery */
@media (min-width:981px){
  .hero-visual{overflow:hidden}
  .hero-visual img{
    width:calc(100% + 105px)!important;
    max-width:none!important;
    transform:translateX(-105px);
    object-fit:cover!important;
    object-position:center center!important;
  }
  .hero-visual:before{
    width:165px!important;
    background:linear-gradient(90deg,#030708 0%,#030708 24%,rgba(3,7,8,.90) 48%,rgba(3,7,8,.42) 72%,transparent 100%)!important;
  }

  .future-bg{
    background-image:url('assets/future-earth-clean.jpg')!important;
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:right center!important;
  }
  .future-shade{
    background:linear-gradient(90deg,#020607 0%,#020607 32%,rgba(2,6,7,.96) 44%,rgba(2,6,7,.72) 58%,rgba(2,6,7,.18) 78%,rgba(2,6,7,0) 100%)!important;
  }
  .future-content{max-width:1540px}
}

/* On compact/mobile layouts keep the same clean treatment without exposing source text. */
@media (max-width:980px){
  .hero-visual{overflow:hidden}
  .hero-visual img{
    width:calc(100% + 75px)!important;
    max-width:none!important;
    transform:translateX(-75px);
  }
  .future-bg{
    background-image:url('assets/future-earth-clean.jpg')!important;
    background-size:cover!important;
    background-position:68% center!important;
  }
  .future-shade{
    background:linear-gradient(90deg,rgba(2,6,7,.96),rgba(2,6,7,.74) 58%,rgba(2,6,7,.28))!important;
  }
}

/* FINAL PHOTO-ONLY LOWER SECTION LOCK */
.materials-image{
  background-image:url('assets/materials-photo-clean.jpg')!important;
}
.logistics-image{
  background-image:url('assets/logistics-photo-clean.jpg')!important;
}
.sustainability-image{
  background-image:url('assets/sustainability-photo-clean.jpg')!important;
}
.materials-image,.logistics-image,.sustainability-image{
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
}
/* Keep a subtle blend at the left edge without exposing source text. */
.capability-image:before{
  width:64px!important;
  background:linear-gradient(90deg,var(--paper),rgba(255,253,248,.38),transparent)!important;
}
@media (max-width:820px){
  .capability-image:before{
    width:auto!important;
    height:44px!important;
    background:linear-gradient(180deg,var(--paper),rgba(255,253,248,.28),transparent)!important;
  }
}

/* FULL-VISIBILITY IMAGE LOCK — 2026-09-23 */
.hero-visual{
  background:#030708!important;
  overflow:hidden!important;
}
.hero-visual img{
  content:url('assets/hero-products-clean-full.jpg')!important;
  width:100%!important;
  max-width:100%!important;
  height:100%!important;
  transform:none!important;
  object-fit:contain!important;
  object-position:center right!important;
}
.hero-visual:before{
  width:90px!important;
  background:linear-gradient(90deg,#030708 0%,rgba(3,7,8,.92) 28%,rgba(3,7,8,.38) 68%,transparent 100%)!important;
}

.materials-image{
  background-image:url('assets/materials-photo-full.jpg')!important;
}
.logistics-image{
  background-image:url('assets/logistics-photo-full.jpg')!important;
}
.sustainability-image{
  background-image:url('assets/sustainability-photo-full.jpg')!important;
}
.materials-image,.logistics-image,.sustainability-image{
  background-color:var(--paper)!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
}
.capability-image:before{
  width:36px!important;
  background:linear-gradient(90deg,var(--paper),rgba(255,253,248,.16),transparent)!important;
}

/* Give the visual side enough room on desktop so 'contain' still reads large. */
@media (min-width:981px){
  .capability-card{grid-template-columns:40% 60%!important}
  .capability-image{min-height:345px!important}
}
@media (max-width:980px){
  .hero-visual img{
    object-fit:contain!important;
    object-position:center center!important;
  }
  .materials-image,.logistics-image,.sustainability-image{
    background-size:contain!important;
    background-position:center center!important;
  }
}


/* ===== FINAL VISUAL FIXES 2026-09-23 ===== */
.brand-logo{display:block;width:54px;height:auto;filter:drop-shadow(0 2px 8px rgba(244,181,31,.18));}
.brand-mark{display:none!important;}
.footer-brand .brand-logo{width:46px;}

.hero-visual{background:#030708!important;display:flex;align-items:center;justify-content:center;overflow:hidden!important;}
.hero-visual img{content:none!important;width:100%!important;max-width:100%!important;height:100%!important;transform:none!important;object-fit:contain!important;object-position:center center!important;}
.hero-visual:before{width:78px!important;background:linear-gradient(90deg,#030708 0%,rgba(3,7,8,.88) 34%,rgba(3,7,8,.28) 68%,transparent 100%)!important;}

.capability-card{grid-template-columns:42% 58%!important;}
.capability-image{background:var(--paper)!important;background-image:none!important;display:flex;align-items:center;justify-content:center;min-height:350px!important;padding:10px 14px 8px 8px;overflow:hidden;}
.capability-image:before{display:none!important;}
.capability-photo{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center center;}

.industry-card::before{background-size:cover!important;}

@media (min-width:981px){
  .hero{height:350px!important;min-height:350px!important;}
  .hero-inner{height:350px!important;min-height:350px!important;grid-template-columns:39% 61%!important;}
  .hero-visual{height:350px!important;padding:8px 8px 8px 0;}
  .capability-card{grid-template-columns:40% 60%!important;}
  .capability-image{min-height:360px!important;}
}
@media (max-width:980px){
  .brand-logo{width:50px;}
  .hero-visual{height:320px!important;padding:8px;}
  .hero-visual img{object-position:center center!important;}
  .capability-card{grid-template-columns:1fr!important;grid-template-rows:auto 280px auto!important;}
  .capability-image{min-height:280px!important;padding:6px 10px 0!important;}
}
@media (max-width:520px){
  .brand-logo{width:44px;}
  .hero-visual{height:250px!important;}
}


/* ===== FINAL CLOUDFLARE CHECK BUILD ===== */

/* Exact approved YS monogram in header and footer */
.brand-logo{
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
  object-position:center!important;
  background:transparent!important;
  filter:none!important;
}
.footer-brand .brand-logo{
  width:48px!important;
  height:48px!important;
}

/* HD hero: preserve full five-product composition; never crop */
.hero-visual{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:#030708!important;
}
.hero-visual img{
  content:none!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  image-rendering:auto;
}
.hero-visual:before{
  width:64px!important;
  background:linear-gradient(90deg,#030708 0%,rgba(3,7,8,.80) 34%,rgba(3,7,8,.18) 70%,transparent 100%)!important;
}

/* Materials / Logistics / Sustainability: always show the COMPLETE image */
.capability-image{
  background:none!important;
  background-image:none!important;
  padding:10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
.capability-image:before{display:none!important;}
.capability-photo{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  image-rendering:auto;
}

/* Keep section images large enough to read while preserving full composition */
@media (min-width:981px){
  .capability-card{grid-template-columns:39% 61%!important;}
  .capability-image{min-height:365px!important;}
  .hero{height:355px!important;min-height:355px!important;}
  .hero-inner,.hero-visual{height:355px!important;min-height:355px!important;}
}
@media (max-width:980px){
  .brand-logo{width:52px!important;height:52px!important;}
  .hero-visual img{object-fit:contain!important;}
  .capability-image{min-height:290px!important;}
}

/* V19 APPROVED + LOCKED EARTH VISUAL */
.future-banner-approved{min-height:0!important;background:#020607!important;overflow:hidden}
.future-banner-approved .future-approved-art{display:block;width:100%;height:auto;object-fit:cover}
@media(max-width:720px){
  .future-banner-approved .future-approved-art{width:100%;height:auto;object-fit:contain}
}

/* V20 — EXACT APPROVED SUSTAINABILITY ARTWORK */
.sustainability-exact-card{padding:0!important;overflow:hidden;background:#f7f3e9!important}
.sustainability-exact-link{display:block;width:100%;text-decoration:none}
.sustainability-exact-link img{display:block;width:100%;height:auto;object-fit:contain}
@media(max-width:720px){
  .sustainability-exact-card{margin-left:0;margin-right:0}
  .sustainability-exact-link img{width:100%;height:auto}
}


/* V22 — sustainability exact card spacing fix */
.sustainability-exact-card{display:block!important;grid-template-columns:none!important;grid-template-rows:none!important;min-height:0!important;height:auto!important;padding:0!important}
.sustainability-exact-card .sustainability-exact-link{display:block!important;width:100%!important;height:auto!important}
.sustainability-exact-card .sustainability-exact-link img{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;object-fit:contain!important}
@media(max-width:720px){
  .sustainability-exact-card{display:block!important;min-height:0!important;height:auto!important}
}


/* V23 — APPROVED MOTION PASS */
/* Logistics: uses the previously approved motion preview, with no yellow-dot effect. */
.logistics-card .capability-photo,
.inner-hero-image img[src*="logistics-motion-approved.gif"]{
  object-fit:cover!important;
}

/* Packaging for What's Next: subtle approved motion direction only. */
.future-banner-approved{position:relative;isolation:isolate}
.future-banner-approved .future-approved-art{
  will-change:transform,filter;
  transform-origin:72% 32%;
  animation:ysEarthDrift 18s ease-in-out infinite alternate;
}
.future-banner-approved::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,180,52,.18),rgba(255,160,30,.07) 11%,transparent 28%),
    radial-gradient(circle at 58% 64%,rgba(255,181,54,.045),transparent 28%);
  mix-blend-mode:screen;
  animation:ysSunGlow 8s ease-in-out infinite alternate;
}
@keyframes ysEarthDrift{
  from{transform:scale(1.000) translate3d(0,0,0);filter:brightness(1.00) saturate(1.00)}
  to{transform:scale(1.018) translate3d(-.35%,.18%,0);filter:brightness(1.035) saturate(1.03)}
}
@keyframes ysSunGlow{
  from{opacity:.62;transform:translate3d(0,0,0) scale(1)}
  to{opacity:1;transform:translate3d(-.25%,.15%,0) scale(1.025)}
}
@media(prefers-reduced-motion:reduce){
  .future-banner-approved .future-approved-art,
  .future-banner-approved::after{animation:none!important;transform:none!important}
}

/* V25 — EXACT APPROVED OUR PROCESS EXPERIENCE */
.process-card-approved{
  display:block!important;
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  background:#fbf8f0!important;
  overflow:hidden;
}
.process-approved-link{
  display:block;
  width:100%;
  text-decoration:none;
  position:relative;
}
.process-approved-art{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}
.process-approved-link::after{
  content:"Explore the full process →";
  position:absolute;
  right:24px;
  bottom:24px;
  z-index:2;
  padding:12px 18px;
  background:rgba(5,12,13,.92);
  border:1px solid rgba(204,151,45,.8);
  color:#f4b51f;
  font-size:10px;
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .25s ease,transform .25s ease;
}
.process-approved-link:hover::after,
.process-approved-link:focus-visible::after{
  opacity:1;
  transform:translateY(0);
}
@media(max-width:720px){
  .process-approved-link::after{display:none}
}

/* V30 — LAUNCH ACCESSIBILITY / BROWSER IDENTITY */
.skip-link{
  position:fixed;
  left:14px;
  top:12px;
  z-index:99999;
  transform:translateY(-160%);
  background:#f3b528;
  color:#0b1010;
  padding:10px 14px;
  font:700 10px/1 Montserrat,sans-serif;
  letter-spacing:.7px;
  text-transform:uppercase;
  text-decoration:none;
}
.skip-link:focus{transform:translateY(0)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid #e8ad2b;
  outline-offset:3px;
}

/* V31 — PERFORMANCE / STABILITY */
img{max-width:100%;height:auto}
@media(prefers-reduced-data:reduce){
  .motion-layer,.parallax-layer{display:none!important}
}


/* V39 — PACKAGING FOR WHAT'S NEXT / EARTH LAPTOP FIT */
@media (min-width:981px){
  .future-banner-approved{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:0!important;
    max-height:760px!important;
    background:#020607!important;
  }
  .future-banner-approved .future-approved-art{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    max-height:760px!important;
    object-fit:contain!important;
    margin:0 auto!important;
  }
}
@media (min-width:981px) and (max-height:850px){
  .future-banner-approved,
  .future-banner-approved .future-approved-art{
    max-height:640px!important;
  }
}


/* =========================================================
   V41 — FINAL HOMEPAGE VISUAL FIXES
   ========================================================= */

/* Homepage logistics card:
   V23 forced object-fit:cover, which was cutting the airplane.
   Override that and give the artwork breathing room. */
.logistics-card .capability-image{
  padding:18px 28px!important;
  background:#fff!important;
}
.logistics-card .capability-photo{
  width:92%!important;
  height:92%!important;
  max-width:92%!important;
  max-height:92%!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:auto!important;
}
@media (min-width:981px){
  .logistics-card .capability-image{
    min-height:340px!important;
  }
}

/* Earth / Packaging for What's Next:
   preserve the complete approved artwork while replacing the two hard
   black side bars with a soft fill derived from the artwork itself. */
.future-banner-approved{
  position:relative!important;
  overflow:hidden!important;
  background:#071011!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
}
.future-banner-approved::before{
  content:""!important;
  position:absolute!important;
  inset:-24px!important;
  z-index:0!important;
  background-image:url('assets/future-earth-approved-locked.jpg')!important;
  background-size:cover!important;
  background-position:center!important;
  filter:blur(22px) brightness(.50)!important;
  transform:scale(1.06)!important;
  opacity:.95!important;
}
.future-banner-approved .future-approved-art{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
  max-height:610px!important;
  object-fit:contain!important;
  margin:0 auto!important;
}
@media (min-width:981px) and (max-height:850px){
  .future-banner-approved .future-approved-art{
    max-height:560px!important;
  }
}
@media (max-width:980px){
  .future-banner-approved::before{
    display:none!important;
  }
  .future-banner-approved .future-approved-art{
    width:100%!important;
    max-height:none!important;
  }
}

/* =========================================================
   V42 — HOMEPAGE PROCESS CLEANUP
   Hide the redundant YS / MENU header baked into the approved process art.
   The real website navigation remains above it. */
.process-approved-link{
  overflow:hidden!important;
}
.process-approved-art{
  width:100%!important;
  height:auto!important;
  margin-top:-7.6%!important;
  margin-bottom:-0.2%!important;
}

/* V42 final tune — remove embedded top navigation from homepage Process artwork. */
.process-approved-link{
  overflow:hidden!important;
}
.process-approved-art{
  display:block!important;
  width:100%!important;
  height:auto!important;
  margin-top:-7.45%!important;
}


/* V43 — LOGISTICS IMAGE RESTORE
   Use the stable approved HD artwork and keep ship, airplane and truck fully visible. */
.logistics-card .capability-image{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:#fff!important;
  padding:18px 22px!important;
}
.logistics-card .capability-photo{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:auto!important;
}


/* V44 — HOMEPAGE PROCESS FINAL FIX
   The embedded YS / MENU bar has been physically removed from the image.
   Do not crop the remaining artwork with negative margins. */
.process-approved-link{
  overflow:visible!important;
}
.process-approved-art{
  display:block!important;
  width:100%!important;
  height:auto!important;
  margin-top:0!important;
  margin-bottom:0!important;
  object-fit:contain!important;
}


/* V45 — HOMEPAGE FUTURE BANNER FULL-WIDTH FIX
   Replace the centered image treatment with a full-bleed section
   so the earth artwork fills the full screen width with no side banners. */
.future-banner-approved{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-height:clamp(420px,78vh,760px)!important;
  height:min(78vh,760px)!important;
  max-height:none!important;
  background:#020607 url('assets/future-earth-approved-locked.jpg') center center / cover no-repeat!important;
  overflow:hidden!important;
}
.future-banner-approved::before,
.future-banner-approved::after{
  display:none!important;
  content:none!important;
  background:none!important;
}
.future-banner-approved .future-approved-art{
  display:none!important;
}
@media (max-width:980px){
  .future-banner-approved{
    min-height:clamp(320px,62vh,560px)!important;
    height:auto!important;
    aspect-ratio:1103 / 1053;
    background-size:cover!important;
    background-position:center center!important;
  }
}


/* V46 — EARTH BANNER SLIGHTLY SMALLER
   Keep the approved full-width treatment, but reduce its vertical size on laptop/desktop. */
@media (min-width:981px){
  .future-banner-approved{
    min-height:520px!important;
    height:64vh!important;
    max-height:620px!important;
    background-size:cover!important;
    background-position:center center!important;
  }
}
@media (min-width:981px) and (max-height:850px){
  .future-banner-approved{
    height:58vh!important;
    max-height:560px!important;
  }
}


/* V49 — HOMEPAGE EARTH BANNER REFINED
   Goals:
   1) Keep the approved HD earth artwork.
   2) Make the banner slightly smaller on laptop so the full wording stays visible.
   3) Avoid black side banners by using a full-bleed soft image backdrop behind the contained hero art.
   4) Preserve the V48 Industries text-safe fix unchanged. */
.future-banner-approved{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:clamp(360px,56vh,560px)!important;
  height:clamp(360px,56vh,560px)!important;
  max-height:560px!important;
  overflow:hidden!important;
  background:#020607!important;
}
.future-banner-approved::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  display:block!important;
  background:url('assets/future-earth-approved-locked.jpg') center center / cover no-repeat!important;
  filter:blur(10px) brightness(.56) saturate(1.02)!important;
  transform:scale(1.12)!important;
  opacity:1!important;
}
.future-banner-approved::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  display:block!important;
  background:linear-gradient(180deg, rgba(2,6,7,.10) 0%, rgba(2,6,7,.03) 38%, rgba(2,6,7,.14) 100%)!important;
}
.future-banner-approved .future-approved-art{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  width:min(100%, 1500px)!important;
  height:100%!important;
  max-height:560px!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:0 auto!important;
  filter:none!important;
}
@media (min-width:981px) and (max-height:860px){
  .future-banner-approved{
    min-height:clamp(330px,52vh,500px)!important;
    height:clamp(330px,52vh,500px)!important;
    max-height:500px!important;
  }
  .future-banner-approved .future-approved-art{
    max-height:500px!important;
  }
}
@media (max-width:980px){
  .future-banner-approved{
    min-height:clamp(280px,46vh,420px)!important;
    height:auto!important;
    aspect-ratio:auto!important;
    max-height:none!important;
  }
  .future-banner-approved .future-approved-art{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
  }
}


/* =========================================================
   V50 — EARTH HERO FINAL REDESIGN
   Full-width, no side banners, no cropped wording.
   Uses a high-resolution clean earth background with live HTML text.
   ========================================================= */
.future-banner-v50{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  height:clamp(410px,54vh,540px)!important;
  min-height:410px!important;
  max-height:540px!important;
  overflow:hidden!important;
  background-image:
    linear-gradient(90deg, rgba(2,6,7,.80) 0%, rgba(2,6,7,.54) 34%, rgba(2,6,7,.10) 68%, rgba(2,6,7,.02) 100%),
    url('assets/future-earth-clean-hd-v50.jpg')!important;
  background-size:cover!important;
  background-position:center 46%!important;
  background-repeat:no-repeat!important;
}
.future-banner-v50::before,
.future-banner-v50::after{
  display:none!important;
  content:none!important;
}
.future-banner-v50 .future-approved-art{
  display:none!important;
}
.future-v50-content{
  position:relative!important;
  z-index:2!important;
  width:min(1220px, calc(100% - 64px))!important;
  margin:0 auto!important;
  padding:28px 0 34px!important;
}
.future-v50-kicker{
  margin:0 0 12px!important;
  color:var(--gold)!important;
  font-size:15px!important;
  font-weight:700!important;
  letter-spacing:2.8px!important;
  text-transform:uppercase!important;
}
.future-banner-v50 h2{
  margin:0!important;
  max-width:760px!important;
  color:#fff!important;
  font-family:"Cormorant Garamond",serif!important;
  font-size:clamp(58px,6.4vw,88px)!important;
  line-height:.92!important;
  font-weight:600!important;
  letter-spacing:-1.5px!important;
}
.future-banner-v50 h2 em{
  color:var(--gold)!important;
  font-style:normal!important;
}
.future-v50-sub{
  margin:18px 0 0!important;
  color:#fff!important;
  font-size:22px!important;
  font-weight:600!important;
  letter-spacing:.1px!important;
}
@media (min-width:981px) and (max-height:820px){
  .future-banner-v50{
    height:440px!important;
    min-height:440px!important;
    max-height:440px!important;
    background-position:center 44%!important;
  }
  .future-banner-v50 h2{
    font-size:68px!important;
  }
  .future-v50-kicker{font-size:13px!important;}
  .future-v50-sub{font-size:19px!important;}
}
@media (max-width:980px){
  .future-banner-v50{
    height:430px!important;
    min-height:430px!important;
    max-height:none!important;
    background-position:58% center!important;
  }
  .future-v50-content{
    width:min(100% - 36px, 680px)!important;
  }
  .future-banner-v50 h2{
    font-size:56px!important;
    max-width:560px!important;
  }
  .future-v50-sub{font-size:18px!important;}
}
@media (max-width:620px){
  .future-banner-v50{
    height:390px!important;
    min-height:390px!important;
    background-position:62% center!important;
  }
  .future-v50-content{
    width:calc(100% - 28px)!important;
  }
  .future-v50-kicker{
    font-size:10px!important;
    letter-spacing:1.8px!important;
  }
  .future-banner-v50 h2{
    font-size:43px!important;
    line-height:.95!important;
    max-width:360px!important;
  }
  .future-v50-sub{
    font-size:15px!important;
    max-width:330px!important;
  }
}

/* V51 FINAL APPROVAL QA SAFEGUARDS — preserve approved visuals without crop */
body.home-page .hero-visual img,
.hero-visual img,
.capability-photo,
.process-approved-art,
.sustainability-exact-link img { object-fit: contain !important; object-position: center center !important; max-width:100%; }
/* V66 locked-reference QA: prevent image distortion/cropping on approved banners */
img{max-width:100%}
.approved-banner img,.approved-display-banner img{max-width:none}