/* GW Foundry beta shell — design system v3 (Claude Design redesign, 2026-08-12)
   Palette per the locked 7/31 decision: pure black + orange + white, two inks max.
     black #000000 (was charcoal #10151C) · panel #0A0A0A · ink #0B0B0C
     orange #F37021 (hover #E45E0C / on-black hover #F58643) · soft orange #F58A49
     steel #8DA0B8 · body #4F5C6B · line #E3E7EC · grey bg #F5F7F9

   v3 (8/12) redesigned Home, Why Choose GW and Our Story from the Claude Design
   comps. Those pages use the `.v3-*` classes at the bottom of this file. The other
   11 pages still use the v2 section classes and changed only in palette. */

* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { background: #fff; }
body { font-family: 'Archivo', system-ui, sans-serif; -webkit-font-smoothing: antialiased; color: #0B0B0C; }
a { text-decoration: none; }
.wrap { max-width: 1440px; margin: 0 auto; padding-left: 48px; padding-right: 48px; }

/* ---------- header (dark) ---------- */
.site-header { position: sticky; top: 0; z-index: 100; background: #000000; }
.utility { background: #000000; color: rgba(255,255,255,0.7); font-size: 12.5px; letter-spacing: 0.02em; }
.util-in { display: flex; justify-content: flex-end; gap: 28px; padding-top: 7px; padding-bottom: 7px; }
.util-loc { color: #8DA0B8; font-weight: 600; }
.mainbar { border-bottom: 1px solid rgba(255,255,255,0.12); background: #000000; }
.main-in { height: 88px; display: flex; align-items: center; gap: 36px; }
.logo { display: block; flex: none; line-height: 0; }
.logo-img { height: 52px; width: auto; display: block; }
.nav { display: flex; align-items: center; justify-content: flex-end; gap: 34px; flex: 1; font-size: 15px; font-weight: 500; }
.nav-item { position: relative; }
.nav-top { color: rgba(255,255,255,0.88); display: inline-block; padding: 34px 0; border-bottom: 3px solid transparent; }
.nav-item:hover > .nav-top, .nav-item.active > .nav-top { color: #F37021; border-bottom-color: #F37021; }
.drop { display: none; position: absolute; top: 100%; left: -20px; min-width: 260px; background: #0A0A0A; border: 1px solid rgba(255,255,255,0.12); border-top: 2px solid #F37021; box-shadow: 0 24px 48px -16px rgba(0,0,0,0.45); padding: 14px 0; }
.nav-item:hover .drop { display: block; }
.drop a { display: block; padding: 9px 22px; color: rgba(255,255,255,0.85); font-size: 14.5px; font-weight: 500; }
.drop a:hover { color: #fff; background: rgba(243,112,33,0.12); }
.drop.mega { min-width: 640px; padding: 26px 28px 30px; }
.mega-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
.mega-head { font-size: 12px; font-weight: 700; letter-spacing: 0.14em; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.14); margin-bottom: 6px; }
.mega-head a { color: rgba(255,255,255,0.45); padding: 0; }
.mega-head a:hover { color: #8DA0B8; background: none; }
.drop.mega .mega-grid a { padding: 8px 0; }
.drop.mega .mega-grid a:hover { background: none; }
.util-tel { color: inherit; }
.util-tel:hover { color: #fff; }

/* mobile nav (hidden on desktop) */
.nav-toggle-cb, .nav-toggle, .m-panel { display: none; }
.nav-toggle { flex: none; width: 44px; height: 44px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; cursor: pointer; }
.nav-toggle span { display: block; width: 24px; height: 2.5px; background: #fff; border-radius: 2px; transition: transform 0.2s ease, opacity 0.2s ease; }
.nav-toggle-cb:checked ~ .wrap .nav-toggle span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.nav-toggle-cb:checked ~ .wrap .nav-toggle span:nth-child(2) { opacity: 0; }
.nav-toggle-cb:checked ~ .wrap .nav-toggle span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
.m-panel { position: absolute; left: 0; right: 0; top: 100%; background: #000000; border-top: 1px solid rgba(255,255,255,0.12); border-bottom: 1px solid rgba(255,255,255,0.12); max-height: calc(100vh - 120px); overflow-y: auto; }
.m-item summary { list-style: none; cursor: pointer; position: relative; }
.m-item summary::-webkit-details-marker { display: none; }
.m-item summary, .m-link { display: block; padding: 15px 24px; color: rgba(255,255,255,0.88); font-size: 16px; font-weight: 500; border-bottom: 1px solid rgba(255,255,255,0.08); }
.m-item summary::after { content: "+"; position: absolute; right: 24px; top: 50%; transform: translateY(-50%); color: #8DA0B8; font-size: 20px; font-weight: 400; }
.m-item[open] summary::after { content: "–"; }
.m-item[open] summary { color: #8DA0B8; }
.m-sub { background: #050505; }
.m-sub a { display: block; padding: 13px 24px 13px 40px; color: rgba(255,255,255,0.7); font-size: 15px; border-bottom: 1px solid rgba(255,255,255,0.06); }
.m-sub a:active, .m-link:active { color: #8DA0B8; }
.m-foot { padding: 20px 24px 26px; display: flex; flex-direction: column; gap: 14px; align-items: stretch; text-align: center; }
.m-cta { display: block; text-align: center; }
.m-tel { color: #8DA0B8; font-size: 16px; font-weight: 600; padding: 6px 0; }

/* ---------- buttons ---------- */
.btn { display: inline-block; font-size: 16px; font-weight: 600; padding: 16px 32px; border-radius: 3px; }
.btn-sm { font-size: 14.5px; padding: 12px 24px; }
.btn-solid { background: #F37021; color: #fff; }
.btn-solid:hover { background: #E45E0C; }
.mainbar .btn-solid { color: #000000; font-weight: 700; }
.mainbar .btn-solid:hover { background: #F58643; }
.btn-ghost { color: #fff; border: 1px solid rgba(255,255,255,0.35); }
.btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,0.06); }
.btn-row { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.btn-row.center { justify-content: center; }
.text-link { color: #F37021; font-size: 16px; font-weight: 600; padding-bottom: 6px; border-bottom: 2px solid #F37021; }

/* ---------- heroes ---------- */
.hero { position: relative; background: #000000; overflow: hidden; }
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.hero-ol1 { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(0,0,0,0.94) 0%, rgba(0,0,0,0.82) 42%, rgba(0,0,0,0.30) 75%, rgba(0,0,0,0.15) 100%); }
.hero-ol2 { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, transparent 30%, transparent 70%, rgba(0,0,0,0.55) 100%); }
.hero-in { position: relative; z-index: 1; padding-top: 120px; padding-bottom: 96px; }
.hero h1 { font-size: 50px; line-height: 1.08; font-weight: 800; letter-spacing: -0.02em; color: #fff; max-width: 920px; margin-bottom: 28px; }
.accent { color: #F37021; }
.hero-sub { font-size: 21px; line-height: 1.55; color: rgba(255,255,255,0.72); max-width: 620px; margin-bottom: 44px; }

.page-hero { position: relative; background: radial-gradient(720px 400px at 88% 110%, rgba(243,112,33,0.20), transparent 68%), linear-gradient(180deg, #000000 0%, #000000 100%); overflow: hidden; }
.page-hero::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,0.035) 0 1px, transparent 1px 96px); pointer-events: none; }
.page-hero .wrap { position: relative; z-index: 1; padding-top: 64px; padding-bottom: 64px; }
.page-hero h1 { font-size: 40px; line-height: 1.12; font-weight: 800; letter-spacing: -0.02em; color: #fff; max-width: 880px; margin: 14px 0 0; }
.page-hero .hero-sub { font-size: 18px; margin: 18px 0 0; }
.crumbs { font-size: 13px; color: rgba(255,255,255,0.5); margin-bottom: 22px; }
.crumbs a { color: rgba(255,255,255,0.65); }
.crumbs a:hover { color: #8DA0B8; }
.crumbs span { margin: 0 4px; }
.crumb-cur { color: #8DA0B8; }
.hero-tbd { display: inline-block; margin-top: 16px; font-size: 12px; font-weight: 600; letter-spacing: 0.06em; color: #F58A49; border: 1px dashed rgba(245,138,73,0.5); border-radius: 3px; padding: 5px 10px; }

/* ---------- sections ---------- */
.section { background: #fff; }
.section .wrap { padding-top: 96px; padding-bottom: 96px; }
.section-grey { background: #F5F7F9; }
.kicker { font-size: 13px; font-weight: 700; letter-spacing: 0.16em; color: #8DA0B8; }
.kicker-dark { font-size: 13px; font-weight: 700; letter-spacing: 0.16em; color: #F37021; margin-bottom: 18px; }
.h2-dark { font-size: 34px; font-weight: 800; letter-spacing: -0.015em; line-height: 1.15; color: #000000; margin-bottom: 44px; max-width: 760px; }
.h2-dark.big { font-size: 44px; }
.h2-light { color: #fff; margin-bottom: 24px; letter-spacing: -0.015em; line-height: 1.15; font-weight: 800; }
.h2-light.big { font-size: 44px; }
.body-p { font-size: 16.5px; line-height: 1.65; color: #4F5C6B; margin-bottom: 28px; max-width: 560px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; }

/* ---------- cards & grids ---------- */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.card { display: block; background: #fff; border: 1px solid #E3E7EC; border-radius: 4px; padding: 32px 28px 28px; }
.card-link { transition: box-shadow 0.15s ease, transform 0.15s ease; }
.card-link:hover { box-shadow: 0 16px 32px -12px rgba(0,0,0,0.18); transform: translateY(-2px); }
.card-num { font-size: 13px; font-weight: 700; color: #F37021; margin-bottom: 20px; font-variant-numeric: tabular-nums; }
.card-num.grey { color: #8DA0B8; margin-bottom: 16px; }
.card-title { font-size: 20px; font-weight: 700; color: #000000; margin-bottom: 10px; }
.card-desc { font-size: 15px; line-height: 1.55; color: #4F5C6B; }
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 56px; }
.pillar { border-top: 3px solid #F37021; padding-top: 26px; }
.pillar-title { font-size: 20px; font-weight: 700; color: #000000; margin-bottom: 12px; }
.pillar-desc { font-size: 16px; line-height: 1.6; color: #4F5C6B; }
.split-head { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 56px; gap: 48px; }
.split-head .h2-dark { margin-bottom: 0; }

/* industries grid */
.ind-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #E3E7EC; border: 1px solid #E3E7EC; }
.ind-cell { display: block; background: #fff; padding: 32px 28px; }
.ind-cell:hover { background: #F5F7F9; }
.ind-cell .card-title { font-size: 18px; }
.ind-cell .card-desc { font-size: 14px; }
.ind-more { background: #000000; }
.ind-more .card-title { color: #8DA0B8; }
.ind-more .card-desc { color: rgba(255,255,255,0.6); }
.ind-more:hover { background: #0A0A0A; }

/* domestic / offshore duo */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.duo-card { border-radius: 4px; padding: 48px 44px; position: relative; overflow: hidden; }
.duo-usa { background: radial-gradient(560px 340px at 100% 115%, rgba(243,112,33,0.22), transparent 65%), #000000; }
.duo-off { background: radial-gradient(560px 340px at 0% 115%, rgba(141,160,184,0.18), transparent 65%), #0A0A0A; }
.duo-kick { font-size: 12.5px; font-weight: 700; letter-spacing: 0.16em; margin-bottom: 20px; }
.duo-kick.orange { color: #F58A49; }
.duo-kick.blue { color: #8DA0B8; }
.duo-title { font-size: 30px; font-weight: 800; color: #fff; line-height: 1.2; margin-bottom: 18px; letter-spacing: -0.01em; }
.duo-desc { font-size: 16px; line-height: 1.65; color: rgba(255,255,255,0.72); margin-bottom: 28px; }
.duo-list { display: flex; flex-direction: column; gap: 12px; font-size: 15px; color: rgba(255,255,255,0.85); }
.duo-list.orange-mark div::first-letter { color: #F58A49; font-weight: 700; }
.duo-list.blue-mark div::first-letter { color: #8DA0B8; font-weight: 700; }
.duo-cta { margin-top: 36px; }

/* dark supply-chain section */
.dark-section { background: #000000; position: relative; overflow: hidden; }
.dark-section::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,0.03) 0 1px, transparent 1px 96px); pointer-events: none; }
.dark-section .wrap { position: relative; z-index: 1; padding-top: 104px; padding-bottom: 104px; }
.dark-section .kicker { margin-bottom: 18px; }
.dark-p { font-size: 17px; line-height: 1.65; color: rgba(255,255,255,0.7); margin-bottom: 36px; }
.steps { display: flex; flex-direction: column; }
.step { padding: 26px 0; border-top: 1px solid rgba(255,255,255,0.14); display: flex; gap: 24px; }
.step:last-child { border-bottom: 1px solid rgba(255,255,255,0.14); }
.step-num { flex: none; font-size: 15px; font-weight: 700; color: #8DA0B8; font-variant-numeric: tabular-nums; width: 36px; }
.step-title { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 6px; }
.step-desc { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,0.62); }

/* ---------- placeholders ---------- */
.ph { border: 1.5px dashed #B9C2CC; border-radius: 4px; background: rgba(245,247,249,0.6); color: #8DA0B8; font-size: 13.5px; font-weight: 600; letter-spacing: 0.04em; display: flex; align-items: center; justify-content: center; text-align: center; }
.ph-copy { min-height: 96px; padding: 20px; margin-bottom: 18px; line-height: 1.5; }
.ph-img { min-height: 380px; }
.ph-thumb { min-height: 140px; margin-bottom: 18px; }
.ph-map { min-height: 200px; margin: 22px 0 18px; }
.foot-map { min-height: 150px; }
.ph-inline { color: #8DA0B8; }

/* ---------- contact ---------- */
.contact-grid { grid-template-columns: 1.3fr 1fr; }
.contact-form .form-row { margin-bottom: 18px; }
.contact-form label { display: block; font-size: 13px; font-weight: 700; letter-spacing: 0.06em; color: #000000; margin-bottom: 7px; }
.contact-form input, .contact-form textarea { width: 100%; font-family: inherit; font-size: 15px; color: #000000; padding: 13px 14px; border: 1px solid #D3DAE1; border-radius: 3px; background: #fff; }
.contact-form input:focus, .contact-form textarea:focus { outline: 2px solid #F37021; border-color: #F37021; }
.contact-form .ph-copy { min-height: 64px; }
.form-note { margin-top: 12px; font-size: 12.5px; color: #8DA0B8; }
.info-card { background: #0A0A0A; border-radius: 4px; padding: 36px 32px; }
.info-card .foot-head { color: #8DA0B8; }
.info-lines { font-size: 15px; line-height: 1.7; color: rgba(255,255,255,0.8); margin-top: 14px; }
.info-card .ph { border-color: rgba(255,255,255,0.25); background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.45); }

/* ---------- CTA ---------- */
.quality-grid { grid-template-columns: 0.9fr 1.4fr; }
.cta { background: radial-gradient(800px 420px at 50% 130%, rgba(243,112,33,0.18), transparent 65%), #000000; }
.cta-in { padding-top: 96px; padding-bottom: 96px; text-align: center; }
.cta h2 { font-size: 48px; font-weight: 800; letter-spacing: -0.015em; color: #fff; margin-bottom: 18px; }
.cta p { font-size: 18px; line-height: 1.6; color: rgba(255,255,255,0.7); max-width: 560px; margin: 0 auto 40px; }

/* ---------- footer ---------- */
.footer { background: #000000; color: rgba(255,255,255,0.6); }
.footer .wrap { padding-top: 72px; padding-bottom: 40px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr; gap: 56px; padding-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.logo-img-foot { height: 60px; width: auto; display: block; margin-bottom: 22px; }
.foot-boiler { font-size: 13.5px; line-height: 1.6; max-width: 280px; margin-bottom: 16px; }
.foot-contact { font-size: 14.5px; line-height: 1.7; }
.foot-visit { gap: 16px; }
.foot-visit .foot-li { margin-top: 6px; }   /* 9/10: chicklet lives here now */
.footer .ph { border-color: rgba(255,255,255,0.22); background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.42); }
.foot-li { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 3px; background: #F37021; color: #000000; font-weight: 700; font-size: 15px; }
.foot-li:hover { background: #F58643; }
/* the four right-hand columns drop to the boiler's first line, clearing the
   footer logo (60px tall + 22px margin) so everything starts on one line */
.foot-col { display: flex; flex-direction: column; gap: 12px; font-size: 14.5px; padding-top: 85px; }
.foot-head { font-size: 14px; font-weight: 700; letter-spacing: 0.12em; color: #fff; margin-bottom: 8px; }
.foot-col a { color: rgba(255,255,255,0.6); }
.foot-col a:hover { color: #fff; }
.foot-bottom { padding-top: 28px; display: flex; justify-content: space-between; font-size: 13px; color: rgba(255,255,255,0.4); }

/* ---------- responsive ---------- */
/* below 1240: hamburger replaces the inline nav */
@media (max-width: 1440px) {
  .foot-grid { gap: 44px; }
}

@media (max-width: 1240px) {
  .nav, .nav-cta { display: none; }
  .nav-toggle { display: flex; margin-left: auto; }
  .main-in { height: 72px; gap: 20px; }
  .logo-img { height: 42px; }
  .nav-toggle-cb:checked ~ .m-panel { display: block; }
  /* five columns stop fitting here — the link labels and the address wrap.
     The brand block goes full width and the four remaining columns sit under it. */
  .foot-grid { grid-template-columns: repeat(4, 1fr); gap: 40px 36px; }
  .foot-brand { grid-column: 1 / -1; }
  .foot-boiler { max-width: 640px; }
  .foot-col { padding-top: 0; }
}

/* tablet */
@media (max-width: 1080px) {
  .wrap { padding-left: 28px; padding-right: 28px; }
  .two-col, .duo, .grid-3, .grid-2, .pillars, .contact-grid, .quality-grid { grid-template-columns: 1fr; }
  /* team grid goes two across; the top pair fills its row, so no offset needed */
  .team-grid { grid-template-columns: repeat(4, 1fr); }
  .team-card.row-start { grid-column: span 2; }
  .two-col { gap: 44px; }
  .ind-grid { grid-template-columns: 1fr 1fr; }
  .hero h1 { font-size: 38px; }
  .page-hero h1 { font-size: 32px; }
  .h2-dark.big, .h2-light.big, .cta h2 { font-size: 34px; }
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .split-head { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 40px; }
  .section .wrap { padding-top: 64px; padding-bottom: 64px; }
  .dark-section .wrap { padding-top: 64px; padding-bottom: 64px; }
  .hero-in { padding-top: 80px; padding-bottom: 64px; }
  .ph-img { min-height: 260px; }
}

/* phone */
@media (max-width: 640px) {
  .wrap { padding-left: 20px; padding-right: 20px; }
  .util-in { justify-content: center; gap: 16px; }
  .util-mail { display: none; }
  .main-in { height: 64px; }
  .logo-img { height: 36px; }
  .m-panel { max-height: calc(100vh - 100px); }
  .hero-in { padding-top: 56px; padding-bottom: 48px; }
  .hero h1 { font-size: 30px; letter-spacing: -0.01em; }
  .hero-sub { font-size: 16.5px; margin-bottom: 32px; }
  .page-hero .wrap { padding-top: 40px; padding-bottom: 40px; }
  .page-hero h1 { font-size: 25px; }
  .page-hero .hero-sub { font-size: 16px; }
  .crumbs { font-size: 12px; }
  .h2-dark { font-size: 24px; margin-bottom: 32px; }
  .h2-dark.big, .h2-light.big { font-size: 27px; }
  .cta h2 { font-size: 28px; }
  .cta p { font-size: 16px; }
  .cta-in { padding-top: 64px; padding-bottom: 64px; }
  .section .wrap, .dark-section .wrap { padding-top: 48px; padding-bottom: 48px; }
  .btn-row .btn { flex: 1 1 100%; text-align: center; }
  .duo-card { padding: 32px 24px; }
  .duo-title { font-size: 24px; }
  .ind-grid { grid-template-columns: 1fr; }
  .ind-cell { padding: 26px 22px; }
  .pillars { gap: 32px; }
  .steps .step { padding: 20px 0; }
  .foot-grid { grid-template-columns: 1fr; gap: 32px; }
  .foot-bottom { flex-direction: column; gap: 6px; text-align: center; }
  .grid-3, .grid-2 { gap: 16px; }
  .team-grid { grid-template-columns: 1fr; gap: 16px; }
  .team-card, .team-card.row-start { grid-column: auto; }
  .card { padding: 24px 20px 22px; }
}

/* ---------- long-form prose (copy deck 2026-08-11) ---------- */
.prose { max-width: 780px; }
.p-h2 { font-size: 27px; font-weight: 800; letter-spacing: -0.01em; line-height: 1.22; color: #000000; margin: 52px 0 16px; }
.p-h2:first-child { margin-top: 0; }
.p-body { font-size: 17px; line-height: 1.7; color: #4F5C6B; margin-bottom: 18px; }
.p-body:last-child { margin-bottom: 0; }
.p-note { font-size: 15.5px; line-height: 1.6; font-weight: 600; color: #000000; border-left: 3px solid #F37021; padding: 2px 0 2px 16px; margin: 0 0 16px; }
.p-typical { font-size: 14.5px; line-height: 1.6; color: #8DA0B8; font-weight: 500; margin: -4px 0 18px; }
.p-pull { font-size: 22px; line-height: 1.45; font-weight: 700; color: #000000; border-left: 3px solid #F37021; padding: 6px 0 6px 22px; margin: 28px 0; }
.p-ul { list-style: none; margin: 0 0 20px; }
.p-ul li { position: relative; font-size: 17px; line-height: 1.65; color: #4F5C6B; padding-left: 24px; margin-bottom: 11px; }
.p-ul li::before { content: ""; position: absolute; left: 0; top: 11px; width: 9px; height: 2px; background: #F37021; }
.p-link { margin: 4px 0 18px; }
.p-quotes { margin: 22px 0 24px; display: flex; flex-direction: column; gap: 12px; }
.p-quote { font-size: 20px; font-weight: 700; color: #000000; border-left: 3px solid #F37021; padding: 6px 0 6px 22px; }

/* dark variant */
.dark-section .prose .p-h2 { color: #fff; }
.dark-section .prose .p-body { color: #fff; }
.dark-section .prose .p-ul li { color: #fff; }

/* home feature rows */
.home-row { align-items: center; }
.home-row .ph-img { min-height: 340px; }
.home-row .body-p { margin-bottom: 22px; max-width: 560px; }
.home-row .h2-dark.big { margin-bottom: 20px; }
.row-flip > div:first-child { order: 2; }
.row-flip > div:last-child { order: 1; }

/* leadership grid */
/* Leadership grid, Michael 8/19: Dick and Jim centred on the top row, then 3 and 3.
   Six columns at two per card gives cells identical in width to the old grid-3. */
.team-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }
.team-card { text-align: center; grid-column: span 2; }
/* a 2-card row inside the 6-col grid starts at column 2 so it centres */
.team-card.row-start { grid-column: 2 / span 2; }
.team-card .ph-thumb { min-height: 0; aspect-ratio: 1 / 1; }

/* misc */
.foot-link { color: inherit; }
.foot-link:hover { color: #fff; }
.form-lead { margin: 26px 0 22px; }
.foot-boiler { color: rgba(255,255,255,0.6); }

@media (max-width: 1080px) {
  .row-flip > div:first-child { order: 1; }
  .row-flip > div:last-child { order: 2; }
  .home-row .ph-img { min-height: 240px; }
}
@media (max-width: 640px) {
  .p-h2 { font-size: 22px; margin: 38px 0 14px; }
  .p-body, .p-ul li { font-size: 16px; }
  .p-pull, .p-quote { font-size: 18px; padding-left: 16px; }
}

/* =================================================================
   v3 — redesigned pages (Claude Design, 2026-08-12)
   Used by: index.html, about/why-choose-gw.html, about/our-story.html
   Additive only. Nothing above this line is overridden for other pages.
   ================================================================= */

.v3 { --ink: #0B0B0C; --body: #4F5C6B; --steel: #8DA0B8; --orange: #F37021; --line: #E3E7EC; }
.v3-wrap { max-width: 1440px; margin: 0 auto; padding-left: 48px; padding-right: 48px; }

/* ---------- shared type ---------- */
.v3-kick { font-size: 13px; font-weight: 700; letter-spacing: 0.16em; color: var(--orange); margin-bottom: 18px; }
.v3-h2 { font-size: 34px; font-weight: 800; letter-spacing: -0.01em; line-height: 1.15; color: var(--ink); margin: 0 0 26px; }
.v3-h2.md { font-size: 36px; line-height: 1.14; }
.v3-h2.lg { font-size: 38px; line-height: 1.14; }
.v3-h2.home { font-size: 40px; line-height: 1.12; }
.v3-h2.xl { font-size: 46px; line-height: 1.1; }
.v3-h2.on-black { color: #fff; }
.v3-p { font-size: 17px; line-height: 1.7; color: var(--body); margin: 0 0 20px; text-wrap: pretty; }
.v3-p:last-child { margin-bottom: 0; }
/* Michael 8/19: white, not blue, in black rows — and consistent sitewide. */
.v3-p.on-black { color: #fff; }
.v3-p.sm { font-size: 16.5px; }
.v3-p.lg { font-size: 18px; line-height: 1.6; }
.v3-strong { font-size: 19px; line-height: 1.6; font-weight: 600; color: var(--ink); margin: 0; }
.v3-rule { width: 40px; height: 3px; background: var(--orange); }
.v3-link { font-size: 14.5px; font-weight: 700; letter-spacing: 0.08em; color: var(--orange); display: inline-block; }
.v3-link:hover { color: #E45E0C; }
.v3-link.on-black:hover { color: #F58643; }

/* ---------- media ---------- */
.v3-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.v3-fill { position: absolute; inset: 0; }
.v3-frame { position: relative; width: 100%; align-self: stretch; }
.v3-frame .v3-img { border-radius: 4px; }
.v3-corner { position: absolute; width: 180px; height: 180px; border: 1px solid var(--line); z-index: 0; }
.v3-corner.tr { top: -24px; right: -24px; }
.v3-corner.bl { bottom: -24px; left: -24px; }
.v3-shot { position: relative; z-index: 1; width: 100%; height: 420px; }
.v3-split.narrow-img .v3-shot { height: 340px; }   /* stepped down in the media queries below */
/* dashed placeholder, August shoot — same language as the rest of the build */
.v3-ph { border: 1.5px dashed #B9C2CC; border-radius: 4px; background: rgba(245,247,249,0.6);
         color: var(--steel); font-size: 13.5px; font-weight: 600; letter-spacing: 0.04em;
         display: flex; align-items: center; justify-content: center; text-align: center;
         padding: 20px; line-height: 1.5; }

/* ---------- page hero, full-bleed image ---------- */
.v3-hero { position: relative; background: #000; overflow: hidden; }
.v3-hero-ol1 { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.55) 45%, rgba(0,0,0,0.18) 78%, rgba(0,0,0,0.06) 100%); }
.v3-hero-ol2 { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, transparent 32%, transparent 76%, rgba(0,0,0,0.45) 100%); }
.v3-hero-in { position: relative; padding-top: 56px; padding-bottom: 88px; min-height: 520px;
              display: flex; flex-direction: column; justify-content: flex-end; }
.v3-hero h1 { margin: 0; font-size: 46px; line-height: 1.12; font-weight: 800; letter-spacing: -0.01em; color: #fff; max-width: 800px; }
.v3-hero h1.tight { font-size: 52px; line-height: 1.08; max-width: 660px; }
.v3-crumbs { display: flex; gap: 10px; font-size: 13px; color: var(--steel); margin-bottom: 30px; }
.v3-crumbs a { color: var(--steel); }
.v3-crumbs a:hover { color: #fff; }
.v3-crumbs .sep { color: #3D4B5F; }
.v3-crumbs .cur { color: #E8ECF2; }

/* ---------- sketch hero variant ----------
   Standard dark hero, standard black overlay, no filters on the artwork.

   The drawing is not cropped: own aspect ratio, height-matched to the hero, right
   aligned to the content column. At 640px tall and 16:9 that is 1138px wide.

   The overlay is anchored to that width. It is FULLY OPAQUE black everywhere left of
   the image and only begins to fall off once it is over the drawing, so the image's
   left edge has pure black on both sides and there is no visible boundary. The falloff
   covers the drawing's blank left-hand paper and clears before the figures. */
.v3-hero.sketch .v3-hero-in, .v3-hero.anchored .v3-hero-in { min-height: 640px; }   /* matches the homepage hero */
.v3-hero.sketch .v3-img, .v3-hero.anchored .v3-img {
  inset: 0 0 0 auto;   /* bleeds off the right edge, so there is no edge to see */
  /* zoomed so the drawing fills the band: 1450px wide against a 1280px source is a
     1.13x scale, and cover crops the surplus off the sheet's empty top and bottom
     margins. 34% biases the crop upward so no heads are clipped — the sketches carry
     more blank paper above the figures than below. */
  width: 1450px;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  object-position: right 34%;
}
.v3-hero.sketch .v3-hero-ol1, .v3-hero.anchored .v3-hero-ol1 {
  background: linear-gradient(90deg,
    #000 0,
    #000            calc(100% - 1450px),   /* image starts here — still solid black */
    rgba(0,0,0,0.94) calc(100% - 1300px),
    rgba(0,0,0,0.70) calc(100% - 1095px),
    rgba(0,0,0,0.34) calc(100% - 890px),
    rgba(0,0,0,0.08) calc(100% - 715px),
    rgba(0,0,0,0)    calc(100% - 585px));
}
/* the vertical overlay is invisible over the homepage's dark video but would grey the
   top and bottom of a white sheet, so it is off here */
.v3-hero.sketch .v3-hero-ol2, .v3-hero.anchored .v3-hero-ol2 { background: none; }

@media (max-width: 1080px) {
  .v3-hero.sketch .v3-hero-in, .v3-hero.anchored .v3-hero-in { min-height: 440px; }   /* image 782px wide */
  .v3-hero.sketch .v3-hero-ol1, .v3-hero.anchored .v3-hero-ol1 {
    background: linear-gradient(90deg,
      #000 0, #000 calc(100% - 782px),
      rgba(0,0,0,0.94) calc(100% - 700px),
      rgba(0,0,0,0.62) calc(100% - 580px),
      rgba(0,0,0,0.25) calc(100% - 450px),
      rgba(0,0,0,0)    calc(100% - 340px));
  }
}
@media (max-width: 760px) {
  /* stacked: the drawing can't hold its own column, so black it back and fade upward */
  .v3-hero.sketch .v3-hero-ol1, .v3-hero.anchored .v3-hero-ol1 {
    background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.7) 45%, rgba(0,0,0,0.93) 100%);
  }
}

/* ---------- generic bands ---------- */
.v3-band { background: #fff; }
.v3-band.grey { background: #F5F7F9; border-top: 1px solid var(--line); }
.v3-band.black { background: #000; position: relative; overflow: hidden; }
.v3-band .v3-wrap { padding-top: 104px; padding-bottom: 96px; }
.v3-glow { position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(900px 480px at 50% 130%, rgba(243,112,33,0.16), transparent 65%); }
.v3-glow.right { background: radial-gradient(900px 480px at 85% 120%, rgba(243,112,33,0.14), transparent 65%); }
.v3-band.black .v3-wrap { position: relative; }

/* two-column, image one side */
.v3-split { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.v3-split.narrow-img { grid-template-columns: 300px 1fr; align-items: start; }

.v3-split.offset { grid-template-columns: 1.15fr 0.85fr; gap: 80px; align-items: start; }

/* half-bleed: image runs to the edge of the viewport */
.v3-bleed { display: grid; grid-template-columns: 1fr 1fr; }
.v3-bleed-text { display: flex; flex-direction: column; justify-content: center; padding: 104px 64px; position: relative; overflow: hidden; }
.v3-bleed-text .inner { position: relative; max-width: 520px; }
.v3-bleed-text.push-right .inner { margin-left: auto; }
.v3-bleed-img { position: relative; min-height: 560px; }
.v3-bleed-img .fade-l { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(255,255,255,0.25) 0%, transparent 30%); }
.v3-bleed-img .fade-rw { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(270deg, rgba(255,255,255,0.25) 0%, transparent 30%); }
/* stacked customer quotes — the fire band is a half-bleed now, so they run vertically */
.v3-quotes.stacked { flex-direction: column; align-items: flex-start; gap: 14px;
  padding: 30px 0; margin: 0 0 28px; }
.v3-quotes.stacked .v3-quote { white-space: normal; font-size: 21px; }
.v3-bleed-img .fade-r { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 60%, rgba(0,0,0,0.55) 100%); }

/* centred editorial */
.v3-centre { display: flex; flex-direction: column; align-items: center; text-align: center; }
.v3-centre .v3-rule { margin-bottom: 28px; }
/* 8/20 (Eric): the About intro reads left, not centred. */
.v3-flush { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.v3-flush .v3-rule { margin-bottom: 28px; }

/* ---------- Domestic-Offshore bands (8/20) ---------- */
.v3-w680 { max-width: 680px; }

/* When the half-bleed's TEXT is the left column, its inner edge has to line up with
   the centred 1440px wrap every other band uses — otherwise it drifts further left
   the wider the screen gets. This element is a grid area half the band wide, so 100%
   is half the viewport; 672 is half the wrap (720) less the wrap's padding (48).
   Percentages resolve against the layout box, so this is scrollbar-safe unlike 100vw. */
.v3-bleed-text.align-wrap { padding-left: max(48px, calc(100% - 672px)); }
/* the criteria column carries more than the broker band does, so it runs wider */
.v3-bleed-text .inner.wide { max-width: 620px; }
/* sized so each of the two sentences holds on one line inside that 620 */
.v3-bleed-text .inner.wide .v3-h2 { font-size: 32px; line-height: 1.16; }
.v3-bleed-text .inner.wide .v3-rule { margin-bottom: 26px; }
.v3-bleed-text .inner.wide .v3-crit { max-width: none; }
/* narrower gutters so the copy gets the width instead of the padding */
.v3-bleed-text.tight-pad { padding-left: 56px; padding-right: 56px; }
/* the column is near-square, so bias the 16:9 crop right to keep the cast part in */
.v3-img.peers-crop { object-position: 62% center; }
/* near-square column: hold the casting and both faces rather than centre-cropping */
.v3-img.recv-crop { object-position: 45% center; }
/* hold the casting and the drawing rather than the shoulder on the right */
.v3-img.work-crop { object-position: 35% center; }

/* three-up: domestic / international / both */
.v3-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; width: 100%;
           border-top: 1px solid var(--line); margin-top: 48px; }
.v3-trio-cell { padding: 30px 32px 0 32px; border-right: 1px solid var(--line); }
.v3-trio-cell:first-child { padding-left: 0; }
.v3-trio-cell:last-child { border-right: none; padding-right: 0; }
/* 9/10 (Eric): same size as the criteria statement in the next band (.v3-crit, 23px/700), still caps */
.v3-trio-k { font-size: 23px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.2; color: var(--orange); margin-bottom: 12px; }
.v3-trio-t { font-size: 17px; line-height: 1.5; color: var(--body); text-wrap: pretty; }
.v3-tail-p { margin-top: 44px; max-width: 680px; }

/* Six qualification criteria as one flowing statement, orange slashes between.
   Boxes made six short labels look like an empty spreadsheet. */
/* Same measure as the paragraph above, and sitting right under it — the copy ends
   on a colon, so the list is the continuation of that sentence, not a new block. */
.v3-crit { margin: 22px 0 0; max-width: 680px;
           font-size: 23px; font-weight: 700; line-height: 1.5; color: #fff; }
.v3-crit-item { white-space: nowrap; }
.v3-crit-sep { color: var(--orange); font-weight: 400; padding: 0 6px; }
.v3-crit-close { margin-top: 40px; }

/* capability spec: category label in a narrow left column, items running beside it */
.v3-spec { margin: 40px 0 0; width: 100%; border-top: 1px solid var(--line); }
.v3-spec-row { display: grid; grid-template-columns: 220px 1fr; gap: 32px;
               padding: 26px 0; border-bottom: 1px solid var(--line); }
.v3-spec-k { font-size: 13px; font-weight: 700; letter-spacing: 0.14em;
             color: var(--orange); padding-top: 5px; }
.v3-spec-v { font-size: 19px; font-weight: 600; line-height: 1.5; color: var(--ink);
             text-wrap: pretty; }
.v3-spec-i { white-space: nowrap; }
.v3-spec-sep { color: var(--steel); font-weight: 400; padding: 0 4px; }
.v3-spec-close { margin-top: 36px; }

/* ---------- Quality Standards bands (8/20) ---------- */
.v3-h3 { font-size: 24px; font-weight: 800; letter-spacing: -0.005em; line-height: 1.2;
         color: var(--ink); margin: 20px 0 0; }
/* five-step supplier management sequence — ruled rows, deliberately no numerals */
.v3-seq { margin: 40px 0 0; width: 100%; border-top: 1px solid rgba(255,255,255,0.16); }
.v3-seq-row { padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,0.16);
              font-size: 18px; font-weight: 600; line-height: 1.45; color: #fff;
              text-wrap: pretty; }
.v3-seq-close { margin-top: 36px; }
/* needs to out-specify the dark bleed placeholder above */
.v3-bleed-img .v3-ph.v3-fill.light { border-color: #B9C2CC; background: #F5F7F9; color: #8DA0B8; }
.v3-closing { margin-top: 72px; display: flex; flex-direction: column; align-items: center;
              text-align: center; }
.v3-closing .v3-rule { margin-bottom: 24px; }
.v3-closing-line { font-size: 32px; font-weight: 800; letter-spacing: -0.01em; color: var(--ink); }

/* ---------- What We Do bands (8/20) ---------- */
/* three-up for the situations buyers arrive with — rule over each, no labels */
.v3-three { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px;
            margin: 44px 0 0; width: 100%; }
.v3-three .col { border-top: 3px solid var(--orange); padding-top: 24px;
                 font-size: 17px; line-height: 1.65; color: var(--body); text-wrap: pretty; }
.v3-three .col strong { font-weight: 700; color: var(--ink); }
.v3-three-close { margin-top: 44px; }
/* the offer pair sits on black */
.v3-band.black .v3-pair h2 { color: #fff; }
.v3-band.black .v3-pair p { color: #fff; margin-bottom: 24px; }

/* ---------- Castings Capabilities bands (8/20) ---------- */
/* five processes, each the same anatomy: name left, detail right */
.v3-proc { width: 100%; border-top: 1px solid var(--line); }
.v3-proc-row { display: grid; grid-template-columns: 300px 1fr; gap: 48px;
               padding: 40px 0; border-bottom: 1px solid var(--line); }
.v3-proc-k { font-size: 25px; font-weight: 800; letter-spacing: -0.005em; line-height: 1.2;
             color: var(--ink); }
.v3-proc-v { max-width: 760px; }
.v3-proc-best { font-size: 13px; font-weight: 700; letter-spacing: 0.1em;
                text-transform: uppercase; color: var(--orange); line-height: 1.5;
                margin-bottom: 16px; }
.v3-proc-typ { font-size: 14.5px; font-weight: 600; color: var(--steel); margin-top: 14px; }
/* ---------- Industries cards (8/20) ---------- */
/* Seven sectors plus the "don't see yours" cell, so the grid closes out at four rows.
   Image slots aren't built in — Michael's sidebar-photo note is deferred. */
.v3-sectors { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; width: 100%; }
.v3-sector { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--orange);
             padding: 32px 32px 30px; display: flex; flex-direction: column; }
.v3-sector h3 { font-size: 23px; font-weight: 800; letter-spacing: -0.005em; line-height: 1.2;
                color: var(--ink); margin: 0 0 14px; }
.v3-sector-rules { font-size: 15px; font-weight: 600; line-height: 1.55; color: var(--orange);
                   margin-bottom: 16px; text-wrap: pretty; }
.v3-sector p { font-size: 16.5px; line-height: 1.65; color: var(--body); margin: 0;
               text-wrap: pretty; }
.v3-sector-typ { font-size: 14.5px; line-height: 1.55; font-weight: 600; color: var(--steel);
                 margin-top: auto; padding-top: 18px; }
.v3-sector.more { background: none; border-color: var(--line); border-top-color: var(--ink);
                  justify-content: flex-start; }
.v3-sector.more p { margin-bottom: 20px; }

/* checklists — orange tick rule instead of a bullet */
/* width:100% because these sit in a flex column, where they'd otherwise shrink to fit */
.v3-ticks { margin: 24px 0 28px; width: 100%; max-width: 760px; }
.v3-tick { position: relative; padding: 12px 0 12px 26px; font-size: 17px; line-height: 1.55;
           color: var(--body); border-bottom: 1px solid var(--line); text-wrap: pretty; }
.v3-tick::before { content: ""; position: absolute; left: 0; top: 21px;
                   width: 12px; height: 2px; background: var(--orange); }
.v3-ticks.on-black .v3-tick { color: #fff; border-bottom-color: rgba(255,255,255,0.16); }
.v3-ticks.on-black { max-width: 900px; }

.v3-close-p { max-width: 680px; margin-bottom: 36px; }
.v3-bleed-img .v3-ph.v3-fill { position: absolute; inset: 0; width: 100%; height: 100%;
  border: 1.5px dashed rgba(255,255,255,0.28); background: #0A0A0A; border-radius: 0;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.45); font-size: 13.5px; font-weight: 600; letter-spacing: 0.04em; }
.v3-rail { max-width: 680px; text-align: left; border-top: 1px solid var(--line); padding-top: 48px;
           display: flex; flex-direction: column; gap: 20px; }
.v3-rail .v3-p { margin: 0; }
/* Industries has no section heading, so the rail needs no rule above it */
.v3-rail.no-top { border-top: none; padding-top: 0; }

/* ---------- homepage ---------- */
.v3-home-hero { position: relative; background: #000; overflow: hidden; }
.v3-home-hero .hero-ol1, .v3-home-hero .hero-ol2 { z-index: 0; }
.v3-home-hero-in { position: relative; z-index: 1; padding-top: 130px; padding-bottom: 120px; }
.v3-home-hero h1 { margin: 0 0 28px; font-size: 56px; line-height: 1.08; font-weight: 800; letter-spacing: -0.01em; color: #fff; max-width: 860px; }
.v3-home-sub { margin: 0 0 40px; font-size: 20px; line-height: 1.6; color: rgba(255,255,255,0.75); max-width: 600px; text-wrap: pretty; }
.v3-btn { display: inline-block; background: var(--orange); color: #000; font-size: 15px; font-weight: 700;
          letter-spacing: 0.06em; padding: 17px 40px; border-radius: 3px; }
.v3-btn:hover { background: #F58643; }

/* quality word strip — numerals dropped per Eric 8/12 */
/* 8/20: the quality row is a half-bleed band, so the word strip sits below it
   in its own centred wrap rather than inside the text column. */
.v3-band.black .v3-steps-wrap { padding-top: 0; padding-bottom: 64px; }
.v3-steps-wrap .v3-steps { margin-top: 0; }
.v3-steps { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,0.16); margin-top: 64px; }
.v3-step { padding: 28px 24px 0 28px; border-right: 1px solid rgba(255,255,255,0.16);
           font-size: 19px; font-weight: 700; letter-spacing: 0.06em; color: #E8ECF2; }
.v3-step:first-child { padding-left: 0; }
.v3-step:last-child { border-right: none; padding-right: 0; }

/* watermark numeral behind the story band */
.v3-watermark { position: absolute; top: 24px; right: -30px; font-size: 280px; font-weight: 800;
                letter-spacing: -0.04em; color: #F3F5F8; line-height: 1; user-select: none; pointer-events: none; }
.v3-band.has-watermark { position: relative; overflow: hidden; }
.v3-band.has-watermark .v3-wrap { position: relative; }

/* what we do — four words, no arrows per Eric 8/12 */
.v3-words { display: flex; justify-content: center; align-items: center; gap: 32px; flex-wrap: wrap; margin-bottom: 28px; }
.v3-word { font-size: 40px; font-weight: 800; letter-spacing: -0.01em; color: var(--ink); }
.v3-band .v3-centre .v3-body { font-size: 17px; line-height: 1.65; color: var(--body); max-width: 680px; margin: 0 auto 32px; text-wrap: pretty; }
.v3-wide { width: 100%; height: auto; object-fit: fill; margin-top: 56px; }
.v3-frame picture { display: block; }

/* ---------- our story ---------- */
.v3-fire { text-align: center; }
.v3-measure { max-width: 920px; margin-left: auto; margin-right: auto; }
.v3-fire .v3-quotes { justify-content: center; gap: 56px; }
.v3-quotes { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 28px;
             padding: 56px 0; margin: 24px 0; border-top: 1px solid rgba(255,255,255,0.14);
             border-bottom: 1px solid rgba(255,255,255,0.14); }
/* Michael 8/19: the customer quotes are italic — they're someone else's words. */
.v3-quote { flex: none; font-size: 25px; font-weight: 700; font-style: italic; line-height: 1.35; color: #fff; white-space: nowrap; }
.v3-quote .qm { color: var(--orange); }
.v3-creed { font-size: 32px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.4; color: var(--ink); max-width: 720px; }
.v3-creed .mid { color: var(--orange); }
.v3-centre .v3-creed { margin-top: 36px; }
.v3-centre.finale .v3-rule { margin-bottom: 0; }
.v3-centre .v3-outro { margin: 48px 0 0; font-size: 17px; line-height: 1.7; color: var(--body); max-width: 560px; text-wrap: pretty; }

/* ---------- why choose gw ---------- */
.v3-portrait { position: relative; margin-top: -72px; z-index: 5; }
.v3-portrait .v3-shot { height: 440px; box-shadow: 0 32px 64px -24px rgba(0,0,0,0.5); }
.v3-portrait .v3-corner { width: 150px; height: 150px; }
.v3-split.offset .v3-text { padding: 104px 0 96px; }
.v3-band.no-pad .v3-wrap { padding-top: 0; padding-bottom: 0; }

/* video pull-quote band */
.v3-quoteband { position: relative; background: #000; overflow: hidden; }
.v3-quoteband video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.v3-quoteband .scrim { position: absolute; inset: 0; background: rgba(0,0,0,0.68); pointer-events: none; }
.v3-quoteband-in { position: relative; max-width: 1440px; margin: 0 auto; padding: 72px 48px; min-height: 500px; display: flex; flex-direction: column;
                   justify-content: center; align-items: center; text-align: center; }
.v3-bigquote { font-size: 34px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.3; color: #fff; max-width: 760px; margin: 34px auto 0; }
.v3-bigquote .accent2 { color: var(--orange); }

/* closing pair */
.v3-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; }
.v3-pair .col { border-top: 3px solid var(--orange); padding-top: 28px; }
.v3-pair h2 { margin: 0 0 16px; font-size: 25px; font-weight: 800; letter-spacing: -0.005em; line-height: 1.22; color: var(--ink); }
.v3-pair p { margin: 0; font-size: 16px; line-height: 1.7; color: var(--body); text-wrap: pretty; }
.v3-band.tall .v3-wrap { padding-bottom: 128px; }

@media (min-width: 1081px) { .v3-split.narrow-img > div:last-child { max-width: 700px; } }

@media (max-width: 1200px) {
  .v3-fire .v3-quotes { flex-direction: column; align-items: center; gap: 18px; padding: 36px 0; }
}

/* ---------- v3 responsive ---------- */
/* the 4-up word strip clips at ~732px (MANAGED is the binding cell) — collapse early */
@media (max-width: 760px) {
  .v3-steps { grid-template-columns: 1fr 1fr; margin-top: 40px; }
  .v3-step { border-right: none; padding: 20px 0 0; border-top: 1px solid rgba(255,255,255,0.16); }
  .v3-step:first-child, .v3-step:nth-child(2) { border-top: none; }
}

@media (max-width: 1080px) {
  .v3-wrap { padding-left: 28px; padding-right: 28px; }
  .v3-split, .v3-split.narrow-img, .v3-split.offset, .v3-pair { grid-template-columns: 1fr; gap: 40px; }
  .v3-split.offset .v3-text { padding: 0; }
  .v3-band.no-pad .v3-wrap { padding-top: 64px; padding-bottom: 64px; }
  .v3-portrait { margin-top: 0; }
  .v3-trio { grid-template-columns: 1fr; }
  .v3-three { grid-template-columns: 1fr; gap: 28px; }
  .v3-proc-row { grid-template-columns: 1fr; gap: 14px; padding: 32px 0; }
  .v3-sectors { grid-template-columns: 1fr; gap: 20px; }
  .v3-proc-k { font-size: 22px; }
  .v3-trio-cell { padding: 24px 0; border-right: none; border-bottom: 1px solid var(--line); }
  .v3-trio-cell:last-child { border-bottom: none; padding-bottom: 0; }
  .v3-crit { font-size: 21px; }
  .v3-trio-k { font-size: 21px; }
  .v3-bleed { grid-template-columns: 1fr; }
  .v3-bleed-text { padding: 64px 28px; }
  /* single column below here, so the wrap-alignment calc no longer applies */
  .v3-bleed-text.align-wrap { padding-left: 28px; }
  .v3-bleed-text .inner, .v3-bleed-text.push-right .inner { max-width: none; margin-left: 0; }
  .v3-bleed-img { min-height: 340px; }
  .v3-band .v3-wrap { padding-top: 64px; padding-bottom: 64px; }
  .v3-band.tall .v3-wrap { padding-bottom: 72px; }
  .v3-hero-in { padding-top: 40px; padding-bottom: 56px; min-height: 380px; }
  .v3-hero h1, .v3-hero h1.tight { font-size: 32px; }
  .v3-home-hero-in { padding-top: 80px; padding-bottom: 64px; }
  .v3-home-hero h1 { font-size: 38px; }
  .v3-h2, .v3-h2.md, .v3-h2.lg { font-size: 28px; }
  .v3-h2.home { font-size: 30px; }
  .v3-h2.xl { font-size: 32px; }
  .v3-quotes { flex-direction: column; align-items: flex-start; gap: 18px; padding: 36px 0; }
  .v3-fire .v3-quotes { align-items: center; gap: 18px; }
  .v3-quote { white-space: normal; font-size: 21px; }
  .v3-watermark { font-size: 180px; opacity: 0.6; }
  .v3-word { font-size: 30px; }
  .v3-words { gap: 20px; }
  .v3-creed { font-size: 26px; }
  .v3-bigquote { font-size: 26px; }
  .v3-pair h2 { font-size: 23px; }
  .v3-quoteband-in { min-height: 360px; padding: 56px 28px; }
  .v3-shot, .v3-portrait .v3-shot, .v3-split.narrow-img .v3-shot { height: 300px; }
  .v3-corner { display: none; }
}
@media (max-width: 640px) {
  .v3-wrap { padding-left: 20px; padding-right: 20px; }
  .v3-band .v3-wrap, .v3-band.no-pad .v3-wrap { padding-top: 48px; padding-bottom: 48px; }
  .v3-hero h1, .v3-hero h1.tight { font-size: 25px; }
  .v3-home-hero h1 { font-size: 30px; letter-spacing: -0.01em; }
  .v3-home-sub { font-size: 16.5px; }
  .v3-h2, .v3-h2.md, .v3-h2.lg, .v3-h2.home, .v3-h2.xl { font-size: 23px; }
  .v3-p, .v3-p.sm, .v3-p.lg, .v3-band .v3-centre .v3-body { font-size: 16px; }
  .v3-strong { font-size: 17px; }
  .v3-word { font-size: 24px; }
  .v3-words { gap: 14px; }
  .v3-creed { font-size: 21px; }
  .v3-bigquote { font-size: 20px; }
  .v3-pair h2 { font-size: 21px; }
  .v3-pair p { font-size: 15.5px; }
  .v3-quote { font-size: 18px; }
  .v3-crit { font-size: 18px; padding-top: 28px; }
  .v3-trio-k { font-size: 18px; }
  .v3-crit-sep { margin: 0 8px; }
  .v3-bleed-text.align-wrap { padding-left: 20px; }
  .v3-spec-row { grid-template-columns: 1fr; gap: 10px; padding: 22px 0; }
  .v3-spec-v { font-size: 17px; }
  .v3-watermark { font-size: 120px; top: 8px; }
  .v3-rail { padding-top: 32px; }
  .v3-centre .v3-outro { margin-top: 32px; font-size: 16px; }
  .v3-shot, .v3-portrait .v3-shot, .v3-split.narrow-img .v3-shot { height: 220px; }
  .v3-wide { margin-top: 36px; }
  .v3-btn { display: block; text-align: center; }
}

/* =================================================================
   9/3 — Inventory Management System page, Contact rebuild
   ================================================================= */

/* ---------- IMS hero: plain dark hero, lockup in the kicker slot ---------- */
.ims-lockup-wrap { margin: 8px 0 26px; }
.ims-lockup { display: block; height: 72px; width: auto; }
.ims-hero h1 { max-width: 760px; }

/* ---------- band 1: copy rail left, pull quote right ---------- */
.v3-prob { display: grid; grid-template-columns: minmax(0, 680px) 1fr; gap: 72px; align-items: start; width: 100%; }
.v3-pullrail { border-top: 1px solid var(--line); padding-top: 48px; }
.v3-pullrail-q { font-size: 25px; font-weight: 700; font-style: italic; line-height: 1.35; color: var(--ink); text-wrap: pretty; }
.v3-pullrail-q .qm { color: var(--orange); }
.v3-pullrail-by { margin-top: 18px; font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--steel); }

/* ---------- band 2: the core band, on black ---------- */
.v3-rail.on-black { border-top-color: rgba(255,255,255,0.16); }
.v3-trio.on-black { border-top-color: rgba(255,255,255,0.16); }
.v3-trio.on-black .v3-trio-cell { border-right-color: rgba(255,255,255,0.16); }
.v3-trio.on-black .v3-trio-t { color: #fff; }
/* the platform visual — a wide slot under the three-up, styled like an application window */
.v3-panel { width: 100%; margin-top: 64px; }
.v3-panel-ph { min-height: 480px; border-color: rgba(255,255,255,0.28); background: #0A0A0A; border-radius: 6px; color: rgba(255,255,255,0.45); }
/* the two application screens: shown whole, never cropped; a thin edge and a drop so they read as a window */
.v3-panel-img { display: block; width: 100%; height: auto; border-radius: 6px; border: 1px solid rgba(255,255,255,0.14); box-shadow: 0 32px 64px -24px rgba(0,0,0,0.6); }
.v3-band.grey .v3-panel-img { border-color: var(--line); box-shadow: 0 24px 48px -24px rgba(0,0,0,0.35); }

/* ---------- band 3: report, split with placeholder ---------- */
.v3-rule-sp { margin-bottom: 28px; }
.v3-ph.v3-shot { height: 420px; }

/* ---------- band 4: flexibility — slash statement under the half-bleed, on white ---------- */
.v3-band.no-pad .v3-flex-wrap { padding-top: 56px; padding-bottom: 96px; }
.v3-crit.light { color: var(--ink); margin: 0; max-width: none; font-size: 21px; }

/* ---------- band 5 ---------- */
.v3-start { max-width: 680px; margin-bottom: 36px; }

/* card link on Managed Services */
.v3-card-link { margin-top: 18px; }

/* ---------- contact: black area with the aerial, map free-standing below ---------- */
.contact-black { background: #000; border-top: 1px solid rgba(255,255,255,0.08); }
.contact-black .wrap { padding-bottom: 72px; }
.contact-aerial-ph { min-height: 520px; border-color: rgba(255,255,255,0.28); background: #0A0A0A; color: rgba(255,255,255,0.45); border-radius: 4px; }
.contact-details { display: grid; grid-template-columns: 1.4fr 1fr 1fr 0.6fr; gap: 40px; margin-top: 40px; }
.contact-detail .foot-head { color: #fff; }
.contact-detail-v { margin-top: 10px; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.8); }
.contact-detail-v .foot-li { margin-top: 2px; }
.contact-map { background: #F5F7F9; line-height: 0; border-bottom: 1px solid #E3E7EC; }
.contact-map iframe { width: 100%; height: 440px; border: 0; display: block; }
.contact-grid { align-items: start; }

@media (max-width: 1080px) {
  .v3-prob { grid-template-columns: 1fr; gap: 40px; }
  .v3-pullrail { padding-top: 32px; }
  .v3-pullrail-q { font-size: 21px; }
  .v3-panel { margin-top: 40px; }
  .v3-panel-ph { min-height: 300px; }
  .v3-ph.v3-shot { height: 300px; }
  .v3-band.no-pad .v3-flex-wrap { padding-top: 0; padding-bottom: 64px; }
  .v3-crit.light { font-size: 19px; }
  .ims-lockup { height: 56px; }
  .contact-aerial-ph { min-height: 320px; }
  .contact-details { grid-template-columns: 1fr 1fr; gap: 28px; }
  .contact-map iframe { height: 340px; }
}
@media (max-width: 640px) {
  .ims-lockup { height: 44px; }
  .v3-pullrail-q { font-size: 18px; }
  .v3-crit.light { font-size: 17px; }
  .v3-ph.v3-shot { height: 220px; }
  .contact-aerial-ph { min-height: 220px; }
  .contact-details { grid-template-columns: 1fr; gap: 22px; }
  .contact-map iframe { height: 280px; }
}
/* the flexibility statements are sentences, not labels — below tablet width they
   stack as rows and the slashes go, or a nowrap item overflows the viewport */
@media (max-width: 760px) {
  .v3-crit.light .v3-crit-item { white-space: normal; display: block; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .v3-crit.light .v3-crit-item:last-child { border-bottom: none; }
  .v3-crit.light .v3-crit-sep { display: none; }
  .v3-crit.light { border-top: 1px solid var(--line); }
}

/* ---------- 9/3: Insights articles ---------- */
.art-grid { grid-template-columns: repeat(3, 1fr); }
.art-card { display: flex; flex-direction: column; color: inherit; }
.art-card:hover .card-title { color: #F37021; }
.art-card-date { font-size: 12.5px; font-weight: 700; letter-spacing: 0.1em; color: #8DA0B8; margin-bottom: 8px; }
.art-card .card-desc { flex: 1; margin-bottom: 18px; }
.article-wrap { max-width: 860px; }
.article-meta { font-size: 13px; font-weight: 700; letter-spacing: 0.1em; color: #8DA0B8; margin-bottom: 28px; }
.art-ph { min-height: 380px; margin-bottom: 40px; }
.article-prose .p-h2:first-child { margin-top: 0; }
@media (max-width: 1080px) { .art-grid { grid-template-columns: 1fr 1fr; } .art-ph { min-height: 260px; } }
@media (max-width: 640px) { .art-grid { grid-template-columns: 1fr; } .art-ph { min-height: 200px; } }
.art-card .text-link { align-self: flex-start; font-size: 14px; }

/* ---------- 9/4 edits ---------- */
/* IMS black band: photo beside the copy */
.v3-how { display: grid; grid-template-columns: 380px 1fr; gap: 56px; align-items: start; width: 100%; }
.v3-how .v3-rail { border-top: none; padding-top: 0; }
.v3-how-img { height: auto; aspect-ratio: 1 / 1; border-radius: 4px; }
/* control panel, smaller: centred at 75% of the wrap */
.v3-panel.sm { max-width: 75%; margin-left: auto; margin-right: auto; margin-top: 56px; }
/* Industries: photo slot above each title */
.v3-sector-ph { height: 180px; margin: -32px -32px 24px; border-radius: 0; border-width: 0 0 1.5px; }
.v3-sector-photo { height: 180px; margin: -32px -32px 24px; overflow: hidden; line-height: 0; }
.v3-sector-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
@media (max-width: 640px) { .v3-sector-ph, .v3-sector-photo { height: 140px; } }
/* form selects match the inputs */
.contact-form select { width: 100%; font-family: inherit; font-size: 15px; color: #000000; padding: 13px 14px; border: 1px solid #D3DAE1; border-radius: 3px; background: #fff; }
.contact-form select:focus { outline: 2px solid #F37021; border-color: #F37021; }
@media (max-width: 1080px) {
  .v3-how { grid-template-columns: 1fr; gap: 28px; }
  .v3-how-ph { min-height: 220px; }
  .v3-panel.sm { max-width: 100%; margin-top: 40px; }
}

/* contact, 9/4 (Eric): left copy + form; right aerial / address / contact / map */
.contact-grid { grid-template-columns: 1.15fr 1fr; gap: 80px; align-items: start; }
.contact-grid .prose { max-width: none; }
.contact-form { margin-top: 36px; padding-top: 36px; border-top: 1px solid #E3E7EC; }
.contact-side { display: flex; flex-direction: column; }
.contact-side-aerial { display: block; line-height: 0; }
.contact-side-aerial img { display: block; width: 100%; height: auto; border-radius: 4px 4px 0 0; }
.contact-side-card { border: 1px solid #E3E7EC; border-top: 3px solid #F37021; border-radius: 0 0 4px 4px; background: #fff; }
.contact-side-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 28px 28px 26px; }
.contact-side-k { font-size: 12.5px; font-weight: 700; letter-spacing: 0.14em; color: #F37021; margin-bottom: 10px; }
.contact-side-v { font-size: 16px; line-height: 1.65; color: #0B0B0C; }
.contact-side-v a { color: #0B0B0C; }
.contact-side-v a:hover { color: #F37021; }
.contact-side-li { margin-top: 14px; }
.contact-side-map { border-top: 1px solid #E3E7EC; line-height: 0; }
.contact-side-map iframe { width: 100%; height: 300px; border: 0; display: block; border-radius: 0 0 4px 4px; }
@media (max-width: 1080px) {
  .contact-grid { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 640px) {
  .contact-side-grid { grid-template-columns: 1fr; gap: 18px; padding: 22px 20px; }
  .contact-side-map iframe { height: 240px; }
}

/* 9/8: Insights article images — lead on the article page, thumb on the card */
.art-photo { margin-bottom: 40px; line-height: 0; }
.art-photo img { width: 100%; height: auto; max-height: 380px; object-fit: cover; border-radius: 4px; display: block; }
.art-thumb { height: 140px; margin: -32px -28px 18px; overflow: hidden; line-height: 0; border-radius: 4px 4px 0 0; }
.art-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 640px) { .art-photo img { max-height: 220px; } .art-thumb { height: 120px; } }

/* ---------- 9/10 edits (Michael) ---------- */
/* Our Story: the three customer quotes and their marks run bigger */
.v3-quotes.stacked .v3-quote { font-size: 30px; line-height: 1.3; }
.v3-quotes.stacked .v3-quote .qm { font-size: 1.9em; line-height: 0; vertical-align: -0.3em; font-style: normal; }
/* IMS pull quote, same treatment */
.v3-pullrail-q { font-size: 30px; line-height: 1.3; }
.v3-pullrail-q .qm { font-size: 1.9em; line-height: 0; vertical-align: -0.3em; font-style: normal; }
/* Domestic-Offshore first band: tighter around the three-up */
.v3-trio { margin-top: 32px; }
.v3-trio-cell { padding-top: 22px; }
.v3-tail-p { margin-top: 30px; }
/* Castings Capabilities: "Helpful to include:" sits on its list */
.v3-band.grey .v3-flush .v3-w680 + .v3-ticks { margin-top: 8px; }
.v3-band.grey .v3-flush .v3-tick { padding-top: 9px; padding-bottom: 9px; }
/* Industries: less air between the intro and the first row of cards */
.v3-band .v3-ind-intro { padding-bottom: 48px; }
.v3-band .v3-ind-cards { padding-top: 56px; }
@media (max-width: 1080px) {
  .v3-quotes.stacked .v3-quote, .v3-pullrail-q { font-size: 24px; }
  .v3-band .v3-ind-intro { padding-bottom: 32px; }
  .v3-band .v3-ind-cards { padding-top: 40px; }
}
@media (max-width: 640px) {
  .v3-quotes.stacked .v3-quote, .v3-pullrail-q { font-size: 21px; }
}