:root{--ink:#101010;--muted:#74736f;--cream:#f5f3ee;--white:#fff;--gold:#c5a062;--gold-dark:#a98445;--line:rgba(16,16,16,.11);--dark:#090909;--ease:cubic-bezier(.16,1,.3,1);--container:1440px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none} img{display:block;width:100%} button{font:inherit}
.container{width:min(calc(100% - 80px),var(--container));margin:auto}
h1,h2,h3{font-family:"Manrope",sans-serif;font-weight:500;letter-spacing:-.065em}
.section-label{font-size:10px;letter-spacing:.20em;text-transform:uppercase;color:#8b877f}
.gold{color:var(--gold)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;border-radius:100px;font-size:12px;transition:.4s var(--ease)}
.btn:hover{transform:translateY(-3px)} .btn-dark{background:#111;color:#fff} .btn-light{background:#fff;color:#111}
.header{position:fixed;top:0;left:0;width:100%;z-index:1000;color:#fff;transition:.5s var(--ease)}
.header.scrolled{background:rgba(248,247,243,.93);color:#111;backdrop-filter:blur(22px);border-bottom:1px solid var(--line)}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;width:138px;line-height:0} .brand-logo{display:block;width:138px;height:auto;max-height:54px;object-fit:fill;filter:brightness(0) invert(1);transition:.45s var(--ease)} .header.scrolled .brand-logo{filter:none}
.desktop-nav{display:flex;align-items:center;gap:31px} .desktop-nav a{font-size:16px;position:relative;white-space:nowrap} .desktop-nav a::after{content:"";position:absolute;left:0;bottom:-8px;width:0;height:1px;background:currentColor;transition:.35s var(--ease)} .desktop-nav a:hover::after,.desktop-nav a.active::after{width:100%}
.nav-cta{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:100px;background:#fff;color:#111;font-size:14px} .header.scrolled .nav-cta{background:#111;color:#fff}
.mobile-toggle{display:none;border:0;background:none;color:currentColor;cursor:pointer} .mobile-toggle svg{width:25px}
.mobile-menu{display:none;background:var(--cream);color:#111;padding:30px 24px 38px;border-bottom:1px solid var(--line)} .mobile-menu.open{display:flex;flex-direction:column;gap:20px} .mobile-menu>a{font-family:"Manrope";font-size:29px;letter-spacing:-.05em}
/* HERO */
.about-hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:#15120f}
.about-hero-media,.about-hero-overlay{position:absolute;inset:0}
.about-hero-media{display:flex;align-items:center;justify-content:center;background:#15120f}
.about-hero-media img{width:100%;height:100%;object-fit:fill;object-position:center center;transform:none;opacity:.82;display:block}
.about-hero-overlay{background:
linear-gradient(90deg,rgba(8,8,8,.48) 0%,rgba(8,8,8,.56) 48%,rgba(8,8,8,.50) 100%),
linear-gradient(180deg,rgba(8,8,8,.12) 0%,rgba(8,8,8,.48) 100%)}
.about-hero-content{position:relative;z-index:2;padding:0 0 86px;text-shadow:0 2px 20px rgba(0,0,0,.28)}
.hero-eyebrow{display:flex;align-items:center;gap:13px;margin-bottom:28px;font-size:10px;letter-spacing:.17em;text-transform:uppercase;opacity:.86}
.eyebrow-line{width:36px;height:1px;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.2)}
.about-hero h1{font-size:clamp(68px,10vw,155px);line-height:.82;max-width:1100px;letter-spacing:-.055em}
.outline{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.9);text-shadow:none}
.about-hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:45px}
.about-hero-bottom p{max-width:540px;font-size:15px;line-height:1.7;color:rgba(255,255,255,.84)}
.hero-scroll{position:absolute;right:38px;bottom:48px;z-index:3;writing-mode:vertical-rl;font-size:9px;letter-spacing:.15em;text-transform:uppercase;opacity:.68;display:flex;gap:12px;align-items:center}
/* INTRO */
.intro{background:#fff;padding:150px 0 165px} .intro-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:110px;align-items:start}
.intro-title{font-size:clamp(56px,7vw,105px);line-height:.86;max-width:720px} .intro-title .gold{display:block} .intro-copy{padding-top:9px;max-width:690px} .intro-copy .dot{width:40px;height:40px;border:1px solid rgba(197,160,98,.9);border-radius:50%;display:grid;place-items:center;color:var(--gold);font-size:15px;margin-bottom:30px} .intro-copy p{font-size:16px;line-height:1.8;color:#6f6e69;max-width:680px}
.intro-image{margin-top:95px;display:grid;grid-template-columns:1.18fr .82fr;gap:22px;align-items:end} .intro-image-main{height:650px;overflow:hidden;background:#eee} .intro-image-main img{height:100%;object-fit:cover;object-position:center} .intro-image-side{height:430px;overflow:hidden;background:#eee} .intro-image-side img{height:100%;object-fit:cover;object-position:center}
/* PHILOSOPHY */
.philosophy{background:var(--cream);padding:145px 0} .philosophy-head{display:grid;grid-template-columns:1fr 1fr;gap:90px;margin-bottom:75px} .philosophy-title{font-size:clamp(52px,6.4vw,96px);line-height:.88} .philosophy-lead{font-size:16px;line-height:1.8;color:#6f6e69;max-width:580px;padding-top:10px}
.principles{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line)} .principle{min-height:320px;padding:34px 30px;border-right:1px solid var(--line);position:relative} .principle:last-child{border-right:0} .principle-number{font-size:10px;letter-spacing:.18em;color:var(--gold)} .principle h3{font-size:30px;line-height:1;margin-top:92px;max-width:260px} .principle p{font-size:13px;line-height:1.7;color:#777;margin-top:22px;max-width:300px} .principle-icon{position:absolute;top:28px;right:28px;color:var(--gold);opacity:.85} .principle-icon svg{width:21px;height:21px;stroke-width:1.25}
/* CAPABILITIES */
.capabilities{background:#fff;padding:150px 0} .cap-head{display:flex;justify-content:space-between;align-items:flex-end;gap:50px;margin-bottom:70px} .cap-title{font-size:clamp(55px,6.8vw,104px);line-height:.85} .cap-lead{max-width:530px;color:#6f6e69;font-size:15px;line-height:1.8}
.cap-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)} .cap-card{min-height:330px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 25px;position:relative;overflow:hidden} .cap-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.80;transition:.7s var(--ease);filter:saturate(.92) contrast(1.02)} .cap-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.22) 42%,rgba(255,255,255,.68) 100%)} .cap-card:hover img{opacity:.86;transform:scale(1.04)} .cap-card-content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:flex-end} .cap-card small{font-size:9px;letter-spacing:.17em;color:#8b877f;text-transform:uppercase} .cap-card h3{font-size:27px;margin-top:10px} .cap-card p{font-size:12px;line-height:1.7;color:#74736f;margin-top:14px;max-width:260px}
/* PROCESS */
.process{background:var(--dark);color:#fff;padding:145px 0} .process-head{display:grid;grid-template-columns:1fr 1fr;gap:90px;margin-bottom:78px} .process-title{font-size:clamp(55px,7vw,105px);line-height:.84} .process-title .gold{color:#caa86d} .process-lead{font-size:15px;line-height:1.8;color:rgba(255,255,255,.58);max-width:570px;padding-top:8px} .steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.14)} .step{min-height:285px;padding:30px 26px;border-right:1px solid rgba(255,255,255,.14);position:relative} .step:last-child{border-right:0} .step-number{font-size:10px;letter-spacing:.18em;color:#caa86d} .step h3{font-size:27px;margin-top:100px} .step p{font-size:12px;line-height:1.7;color:rgba(255,255,255,.52);margin-top:14px;max-width:245px}
/* STATEMENT */
.statement{background:#fff;padding:150px 0} .statement-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;align-items:center} .statement-image{height:690px;overflow:hidden} .statement-image img{height:100%;object-fit:cover} .statement-copy h2{font-size:clamp(54px,6.7vw,100px);line-height:.85} .statement-copy p{font-size:16px;line-height:1.8;color:#6f6e69;margin-top:38px;max-width:560px} .statement-list{margin-top:45px;border-top:1px solid var(--line)} .statement-list div{display:flex;justify-content:space-between;gap:30px;padding:17px 0;border-bottom:1px solid var(--line);font-size:12px} .statement-list span:first-child{color:#8b877f;letter-spacing:.08em;text-transform:uppercase}
/* CTA */
.cta{min-height:700px;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden} .cta-bg,.cta-overlay{position:absolute;inset:0} .cta-bg img{height:100%;object-fit:cover;object-position:center} .cta-overlay{background:rgba(0,0,0,.63)} .cta-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center} .cta-content .section-label{color:rgba(255,255,255,.58)} .cta-content h2{font-size:clamp(62px,9vw,140px);line-height:.82;margin-top:25px} .cta-content h2 span{color:#caa86d} .cta-content p{max-width:570px;margin:35px auto 30px;font-size:15px;line-height:1.7;color:rgba(255,255,255,.70)}
/* FOOTER */
footer{background:#080808;color:#fff;padding:75px 0 25px} .footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:55px;padding-bottom:70px} .footer-brand p{max-width:350px;margin-top:22px;color:#666;font-size:13px;line-height:1.7} .footer-col h4{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#666;margin-bottom:20px} .footer-col a,.footer-col span{display:block;margin:11px 0;color:#999;font-size:12px} .footer-socials{display:flex;align-items:center;gap:9px;margin-top:25px} .footer-socials a{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.20);border-radius:50%;color:rgba(255,255,255,.68);background:rgba(255,255,255,.025);transition:all .3s ease} .footer-socials a:hover{color:#fff;background:rgba(181,138,59,.16);border-color:rgba(181,138,59,.75);transform:translateY(-3px)} .footer-socials svg{width:15px;height:15px;display:block} .footer-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:20px;display:flex;justify-content:space-between;color:#555;font-size:10px}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)} .reveal.visible{opacity:1;transform:none}
@media(max-width:1050px){.desktop-nav{gap:18px}.nav-cta{display:none}.intro-grid,.philosophy-head,.process-head,.statement-grid{grid-template-columns:1fr;gap:55px}.intro-image{margin-top:65px}.principles,.steps{grid-template-columns:1fr 1fr}.principle:nth-child(2),.step:nth-child(2){border-right:0}.principle:nth-child(-n+2),.step:nth-child(-n+2){border-bottom:1px solid var(--line)}.cap-grid{grid-template-columns:1fr 1fr}.statement-image{height:560px}.footer-top{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.container{width:min(calc(100% - 40px),var(--container))}.desktop-nav{display:none}.mobile-toggle{display:block}.nav{height:72px}.about-hero{min-height:780px}.about-hero-content{padding-bottom:60px}.about-hero h1{font-size:clamp(54px,15vw,90px)}.about-hero-bottom{flex-direction:column;align-items:flex-start;margin-top:35px}.hero-scroll{display:none}.intro,.philosophy,.capabilities,.process,.statement{padding:90px 0}.intro-image{grid-template-columns:1fr;gap:16px}.intro-image-main{height:520px}.intro-image-side{height:330px}.principles,.steps,.cap-grid{grid-template-columns:1fr}.principle,.step{border-right:0!important;border-bottom:1px solid var(--line)!important;min-height:290px}.principle:last-child,.step:last-child{border-bottom:0!important}.cap-card{min-height:300px}.cap-head{flex-direction:column;align-items:flex-start;margin-bottom:50px}.statement-image{height:480px}.footer-top{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:10px}}

/* V6 refinement: remove the decorative photo pair from the Who We Are section. */
.intro-image{display:none!important}
/* V6 refinement: make capability photography visibly present while preserving text legibility. */
.cap-card-content{padding-top:18px}

/* V7 refinement: increase Stainless Steel card image visibility only. */
.cap-grid .cap-card:nth-child(2) img{opacity:.80!important;filter:saturate(1.02) contrast(1.04)!important;}
.cap-grid .cap-card:nth-child(2)::after{background:linear-gradient(180deg,rgba(255,255,255,.02) 0%,rgba(255,255,255,.12) 42%,rgba(255,255,255,.48) 100%)!important;}
.cap-grid .cap-card:nth-child(2):hover img{opacity:.86!important;}

/* V9 — Capabilities cards: clearer imagery, stronger typography and consistent alignment */
.capabilities .cap-grid .cap-card{
  min-height:350px;
  padding:32px 30px;
}
.capabilities .cap-grid .cap-card img,
.capabilities .cap-grid .cap-card:nth-child(2) img{
  opacity:.80 !important;
  filter:saturate(.98) contrast(1.06) brightness(.94) !important;
  transform:none;
}
/* Keep the photography visible, but give the lower text zone a controlled cream wash. */
.capabilities .cap-grid .cap-card::after,
.capabilities .cap-grid .cap-card:nth-child(2)::after{
  background:linear-gradient(180deg,
    rgba(245,243,238,.00) 0%,
    rgba(245,243,238,.02) 35%,
    rgba(245,243,238,.34) 62%,
    rgba(245,243,238,.82) 100%
  ) !important;
}
.capabilities .cap-grid .cap-card-content{
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:flex-start;
  padding:0;
}
.capabilities .cap-grid .cap-card small{
  display:block;
  margin:0 0 10px;
  font-size:9px;
  line-height:1.2;
  letter-spacing:.20em;
  color:#a98445;
  font-weight:600;
  text-decoration:none !important;
  border:0 !important;
  box-shadow:none !important;
}
.capabilities .cap-grid .cap-card small::before,
.capabilities .cap-grid .cap-card small::after{
  content:none !important;
  display:none !important;
}
.capabilities .cap-grid .cap-card a,
.capabilities .cap-grid .cap-card a:hover,
.capabilities .cap-grid .cap-card a:focus{
  text-decoration:none !important;
}
.capabilities .cap-grid .cap-card h3{
  margin:0;
  font-size:clamp(24px,2vw,29px);
  line-height:1.08;
  letter-spacing:-.055em;
  color:#101010 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.18);
}
.capabilities .cap-grid .cap-card p{
  margin:13px 0 0;
  max-width:285px;
  font-size:12.5px;
  line-height:1.65;
  color:#4f4d48 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.18);
}
.capabilities .cap-grid .cap-card:hover img,
.capabilities .cap-grid .cap-card:nth-child(2):hover img{
  opacity:.86 !important;
}
@media(max-width:760px){
  .capabilities .cap-grid .cap-card{min-height:310px;padding:27px 24px}
}

/* V12 — black editorial / vintage finish; black bold reserved for category labels. */
.capabilities .cap-card img{
  opacity:.62 !important;
  filter:saturate(.82) contrast(1.03) brightness(1.02) !important;
}
.capabilities .cap-card::after{
  background:linear-gradient(180deg,
    rgba(248,246,241,.04) 0%,
    rgba(248,246,241,.10) 38%,
    rgba(248,246,241,.48) 72%,
    rgba(248,246,241,.82) 100%) !important;
}
.capabilities .cap-card-content{padding-bottom:2px}
.capabilities .cap-grid .cap-card small,
.capabilities .cap-grid .cap-card small *{
  color:#101010 !important;
  font-weight:700 !important;
  text-decoration:none !important;
  text-decoration-line:none !important;
  text-decoration-color:transparent !important;
  text-shadow:none !important;
  opacity:1 !important;
}
.capabilities .cap-grid .cap-card h3,
.capabilities .cap-grid .cap-card:nth-child(3) h3,
.capabilities .cap-grid .cap-card:nth-child(4) h3{
  color:#101010 !important;
  text-shadow:none !important;
  font-family:"Manrope",sans-serif !important;
  font-weight:500 !important;
  letter-spacing:-.055em !important;
}
.capabilities .cap-grid .cap-card p{
  color:#22211f !important;
  text-shadow:none !important;
  opacity:.92 !important;
}
@media (max-width:900px){
  .capabilities .cap-card img{opacity:.58 !important}
  .capabilities .cap-card::after{
    background:linear-gradient(180deg,rgba(248,246,241,.08) 0%,rgba(248,246,241,.20) 42%,rgba(248,246,241,.78) 100%) !important;
  }
}

/* V13 — Featured systems cards styled to match the S&V Rail dark editorial home-page treatment. */
.capabilities .cap-grid{
  gap:18px;
  border:0 !important;
}
.capabilities .cap-grid .cap-card{
  min-height:430px !important;
  padding:30px 30px 28px !important;
  border:0 !important;
  border-radius:28px !important;
  isolation:isolate;
  background:#12110f;
  color:#fff;
  box-shadow:0 10px 35px rgba(0,0,0,.05);
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s cubic-bezier(.16,1,.3,1);
}
.capabilities .cap-grid .cap-card:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 45px rgba(0,0,0,.14);
}
.capabilities .cap-grid .cap-card img,
.capabilities .cap-grid .cap-card:nth-child(2) img{
  opacity:.88 !important;
  filter:saturate(.90) contrast(1.06) brightness(.78) !important;
  transform:none !important;
  object-fit:cover !important;
  transition:opacity .55s ease, transform .8s cubic-bezier(.16,1,.3,1), filter .55s ease !important;
}
.capabilities .cap-grid .cap-card:hover img,
.capabilities .cap-grid .cap-card:nth-child(2):hover img{
  opacity:.92 !important;
  filter:saturate(.96) contrast(1.07) brightness(.82) !important;
  transform:scale(1.035) !important;
}
.capabilities .cap-grid .cap-card::after,
.capabilities .cap-grid .cap-card:nth-child(2)::after{
  background:
    linear-gradient(180deg,rgba(7,7,7,.14) 0%,rgba(7,7,7,.22) 35%,rgba(7,7,7,.72) 72%,rgba(7,7,7,.92) 100%) !important;
  z-index:1;
}
.capabilities .cap-grid .cap-card-content{
  position:relative;
  z-index:3;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:flex-start;
  padding:0 0 64px !important;
}
.capabilities .cap-grid .cap-card small,
.capabilities .cap-grid .cap-card small *{
  color:rgba(255,255,255,.82) !important;
  font-family:"DM Sans",sans-serif !important;
  font-size:9px !important;
  line-height:1.2 !important;
  letter-spacing:.20em !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  margin:0 0 11px !important;
  text-shadow:0 1px 12px rgba(0,0,0,.45) !important;
}
.capabilities .cap-grid .cap-card h3,
.capabilities .cap-grid .cap-card:nth-child(3) h3,
.capabilities .cap-grid .cap-card:nth-child(4) h3{
  color:#fff !important;
  font-family:"Manrope",sans-serif !important;
  font-size:clamp(25px,2vw,31px) !important;
  line-height:1.06 !important;
  letter-spacing:-.055em !important;
  font-weight:500 !important;
  margin:0 !important;
  text-shadow:0 2px 18px rgba(0,0,0,.40) !important;
}
.capabilities .cap-grid .cap-card p{
  color:rgba(255,255,255,.82) !important;
  font-family:"DM Sans",sans-serif !important;
  font-size:12.5px !important;
  line-height:1.62 !important;
  max-width:300px !important;
  margin:14px 0 0 !important;
  text-shadow:0 1px 14px rgba(0,0,0,.55) !important;
  opacity:1 !important;
}
.cap-arrow{
  position:absolute;
  z-index:4;
  left:30px;
  bottom:28px;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.38);
  border-radius:50%;
  color:#fff;
  background:rgba(10,10,10,.12);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  transition:background .35s ease,border-color .35s ease,transform .35s ease;
}
.cap-arrow svg{width:17px;height:17px;stroke-width:1.7}
.capabilities .cap-card:hover .cap-arrow{
  background:#fff;
  border-color:#fff;
  color:#111;
  transform:translateY(-2px);
}
@media(max-width:1050px){
  .capabilities .cap-grid{gap:14px}
  .capabilities .cap-grid .cap-card{min-height:390px !important;padding:26px 24px 24px !important;border-radius:22px !important}
  .cap-arrow{left:24px;bottom:24px}
}
@media(max-width:760px){
  .capabilities .cap-grid{grid-template-columns:1fr !important;gap:14px}
  .capabilities .cap-grid .cap-card{min-height:390px !important;border-radius:22px !important}
}