/* Values-led layout. Builds on the representative page's existing base styles. */
:root {
  --paper:#f6f9fc; --pale:#ecf4f8; --ink:#183645; --navy:#102e43;
  --green:#006c64; --line:#ccdee7; --sub:#4d6775; --blue:#19659a;
  --space-xs:8px; --space-sm:16px; --space-md:24px; --space-lg:32px; --space-xl:48px;
}
html { scroll-padding-top:96px; }
body { background:var(--paper); }
.header { background:#fff; border-bottom-color:var(--line); }
.head-inner { min-height:80px; }
.header-link { border-color:var(--line); border-radius:4px; }
.brand small { letter-spacing:.06em; }
.preview { background:#eaf4f5; border-bottom-color:#d5e5e9; }
.eyebrow { font-size:13px; letter-spacing:.03em; }
.eyebrow::before { width:18px; background:var(--blue); }
a:focus-visible,button:focus-visible,summary:focus-visible { outline-color:var(--blue); }
.hero { background:#f0f6fa; }
.hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; padding-block:64px 48px; }
.hero-copy { padding:0; }
.hero-copy::before { display:none; }
.values-label { display:flex; align-items:center; gap:12px; font-size:14px; font-weight:650; color:var(--sub); margin-bottom:24px; }
.values-label::before { content:""; width:24px; height:2px; background:var(--blue); }
.hero h1.values-title { display:grid; grid-template-columns:1fr 1fr; gap:14px 32px; max-width:490px; margin:0; font-size:clamp(38px,4.2vw,60px); line-height:1.24; letter-spacing:-.025em; font-weight:750; }
.values-title span { white-space:nowrap; }
.values-title .value-long { grid-column:1 / -1; color:var(--green); padding-top:14px; border-top:1px solid #aac8d5; }
.hero-lead { font-size:15px; line-height:1.85; max-width:460px; margin-top:24px; }
.hero-actions { margin-top:28px; gap:16px 24px; }
.btn { min-height:48px; border-radius:4px; gap:24px; }
.btn:hover { transform:none; }
.text-link { min-height:44px; }
.hero-visual { margin:0; padding:12px; border:1px solid #a6c5d4; background:#fff; }
.hero-visual::before,.hero-visual::after { content:""; position:absolute; width:28px; height:28px; pointer-events:none; border-color:var(--blue); border-style:solid; }
.hero-visual::before { top:-1px; left:-1px; border-width:2px 0 0 2px; }
.hero-visual::after { right:-1px; bottom:-1px; border-width:0 2px 2px 0; }
.hero-image { height:480px; filter:none; }
.hero-image-caption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:14px 2px 2px; color:var(--sub); font-size:12px; }
.hero-image-caption b { color:var(--navy); font-weight:600; }
.hero-bottom { gap:0; padding:20px 0 24px; border-top-color:#c9dce6; }
.hero-bottom span { display:flex; align-items:center; gap:12px; padding-right:40px; font-size:13px; letter-spacing:0; color:var(--sub); }
.hero-bottom span::before,.hero-bottom span:not(:first-child)::before { content:""; display:block; width:6px; height:6px; margin:0; border:1px solid var(--blue); border-radius:50%; }
.hero-bottom span:first-child { color:var(--navy); font-weight:600; }
.section { padding-block:88px; }
.section-head { grid-template-columns:160px minmax(0,1fr); gap:32px; margin-bottom:32px; align-items:start; }
.section-head h2,.insight-head h2 { font-size:clamp(28px,3vw,40px); letter-spacing:-.025em; line-height:1.35; }
.section-note { font-size:14px; line-height:1.85; }
.services .wrap { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr); gap:16px 48px; }
.services .section-head { grid-column:1; grid-row:1 / 3; display:block; margin:0; }
.services .section-head .eyebrow { margin-bottom:24px; padding-top:0; }
.services .section-head h2 { font-size:clamp(28px,2.8vw,38px); }
.services .section-note { margin-top:20px; }
.phase-title { grid-column:2; grid-row:1; margin:0; font-size:14px; font-weight:600; }
.phase-grid { grid-column:2; grid-row:2; grid-template-columns:repeat(3,minmax(0,1fr)); border:0; gap:0; background:#f3f8fb; }
.phase { min-height:184px; padding:20px; border:0; border-top:1px solid #c9dee8; background:transparent; }
.phase:nth-child(n+4) { border-top-color:#9ebdce; }
.phase-top { margin-bottom:20px; }
.phase small { font-size:11px; color:var(--blue); letter-spacing:0; }
.phase-icon { border-radius:6px; background:#e1edf4; color:var(--blue); width:36px; height:36px; }
.phase-icon svg { width:20px; height:20px; }
.phase h3 { font-size:15px; line-height:1.5; }
.phase p { font-size:13px; line-height:1.7; }
.boundary-note { grid-column:1 / -1; margin:12px 0 0; padding-top:20px; border-top:1px solid var(--line); max-width:none; font-size:12px; }
.scenes { background:#edf4f8; }
.scene-grid { grid-template-columns:1.15fr 1fr 1fr; gap:24px; }
.scene { background:#fff; }
.scene-image img,.scene-diagram { height:280px; }
.scene:hover .scene-image img { transform:none; }
.scene-caption { padding:24px; }
.scene h3 { font-size:24px; margin-top:0; }
.scene-caption small { display:none; }
.scene p { font-size:14px; line-height:1.8; }
.scene-diagram { background:#e0eef5; flex-direction:column; gap:10px; padding:20px; }
.diagram-node { width:70%; display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-color:#a8c6d7; background:#fff; }
.diagram-node b { font-size:14px; }
.diagram-node small { font-size:12px; margin:0; }
.diagram-arrow { transform:rotate(90deg); font-size:18px; line-height:1; color:var(--blue); }
.insights .wrap { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr); gap:64px; }
.insight-head { flex-direction:column; align-items:start; justify-content:start; gap:20px; margin:0; }
.insight-head h2 { margin-top:24px; max-width:9em; }
.insight-head p { max-width:300px; font-size:14px; line-height:1.85; }
.question summary { grid-template-columns:24px 1fr 24px; gap:16px; padding:24px 0; min-height:80px; }
.question h3 { font-size:17px; line-height:1.6; }
.question summary span { color:var(--blue); }
.question { padding:0; }
.answer { padding:0 24px 24px 40px; font-size:14px; }
.impact { background:#eaf3f5; }
.impact-layout { grid-template-columns:1fr 1fr; gap:64px; }
.impact h2 { font-size:40px; letter-spacing:-.025em; }
.impact .intro { font-size:16px; }
.impact-board { grid-template-columns:1fr; gap:0; border-top:1px solid #a8c9d4; }
.impact-tile { flex-direction:row; align-items:center; justify-content:start; gap:24px; min-height:124px; border:0; border-bottom:1px solid #a8c9d4; padding:24px 0; background:transparent; }
.impact-tile:nth-child(2) { margin:0; }
.impact-tile .symbol { width:36px; height:36px; flex:none; color:var(--blue); }
.impact-tile h3 { font-size:20px; }
.impact-tile p { font-size:14px; }
.contact { background:#f5f8fb; }
.contact h2 { font-size:clamp(32px,3.5vw,44px); letter-spacing:-.025em; }
.contact-card { border:1px solid var(--line); border-radius:4px; padding:32px; }
.contact-card ul { display:grid; grid-template-columns:1fr; gap:0; counter-reset:prepare; }
.contact-card li { counter-increment:prepare; border:0; border-bottom:1px solid #dce8ee; padding:14px 0; font-size:14px; }
.contact-card li::before { content:counter(prepare,decimal-leading-zero); color:var(--blue); margin-right:20px; font-size:12px; font-weight:650; }
.footer { background:#e8f0f5; }
/* Keep the content visible at rest and when scripts fail. */
.js .reveal,.js .reveal.is-visible { opacity:1; transform:none; transition:none; }
@media(max-width:1100px) {
  .hero-grid { gap:40px; padding-block:48px 40px; }
  .hero-image { height:460px; }
  .services .wrap { gap:16px 32px; }
  .phase { padding:16px; }
  .scene-grid { gap:16px; }
}
@media(max-width:960px) {
  .hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .hero-image { height:400px; }
  .hero h1.values-title { font-size:42px; gap:14px 20px; }
  .values-label { font-size:13px; }
  .services .wrap { display:block; }
  .services .section-head { margin-bottom:32px; max-width:680px; }
  .services .section-head h2 br { display:none; }
  .phase-title { margin-bottom:16px; }
  .phase-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .boundary-note { margin-top:24px; }
  .section-head { grid-template-columns:120px 1fr; }
  .scene-grid { grid-template-columns:1fr 1fr; }
  .scene:last-child { grid-column:1 / -1; display:grid; grid-template-columns:1fr 1fr; }
  .scene:last-child .scene-caption { align-self:center; }
  .scene-image img,.scene-diagram { height:240px; }
  .insights .wrap { grid-template-columns:1fr; gap:32px; }
  .insight-head h2 { max-width:none; }
  .impact-layout { grid-template-columns:1fr 1fr; gap:32px; }
}
@media(max-width:700px) {
  .hero-grid { grid-template-columns:1fr; gap:32px; padding-block:40px 32px; }
  .hero h1.values-title { font-size:clamp(36px,7.5vw,48px); max-width:460px; column-gap:24px; }
  .hero-lead { max-width:520px; }
  .hero-image { height:320px; }
  .hero-bottom { gap:12px 24px; flex-wrap:wrap; }
  .hero-bottom span { padding-right:0; font-size:12px; gap:8px; }
  .section { padding-block:56px; }
  .section-head { grid-template-columns:1fr; gap:16px; }
  .phase-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .phase { min-height:190px; }
  .phase-top { margin-bottom:16px; }
  .scene-grid { grid-template-columns:1fr; gap:24px; }
  .scene:last-child { grid-column:auto; display:block; }
  .scene-image img,.scene-diagram { height:260px; }
  .scene-caption { padding:24px; }
  .insight-head h2 { margin-top:16px; }
  .question summary { grid-template-columns:20px minmax(0,1fr) 20px; gap:12px; padding-block:20px; }
  .question h3 { font-size:16px; }
  .answer { padding-left:32px; padding-right:0; }
  .impact-layout { grid-template-columns:1fr; gap:32px; }
  .impact-tile { min-height:112px; }
  .contact-card { padding:24px; }
}
@media(max-width:360px) {
  .hero h1.values-title { font-size:36px; column-gap:16px; }
  .hero-image { height:270px; }
  .hero-image-caption { font-size:11px; }
  .phase { padding:16px 12px; }
  .phase h3 { font-size:14px; }
}
