.about-page{background:#f7f6f1;color:#17352a}
.about-section{padding:52px 24px}
.about-section:nth-child(even){background:#fff}
.about-shell{width:min(1140px,100%);margin:auto}
.about-eyebrow{margin:0 0 10px;color:#9b7425;font-size:.76rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.about-page h1,.about-page h2,.about-page h3{color:#0e3327;margin-top:0}
.about-page h1{font-size:clamp(2rem,3.6vw,3.5rem);line-height:1.02;letter-spacing:-.04em;margin-bottom:18px;max-width:12ch}
.about-page h2{font-size:clamp(1.45rem,2.25vw,2.35rem);line-height:1.12;letter-spacing:-.025em;max-width:840px;margin-bottom:14px}
.about-page h3{font-size:1rem;line-height:1.32;margin-bottom:10px}
.about-lead,.about-intro{font-size:.98rem;line-height:1.68;color:#52665d;max-width:760px;margin:0 0 18px}
.about-hero{padding-top:46px;background:linear-gradient(135deg,#f5f0e5 0%,#fbfaf6 60%,#edf4ef 100%)}
.about-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.94fr);align-items:center;gap:34px}
.about-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.about-subroutes{display:flex;gap:22px;flex-wrap:wrap;margin-top:16px}
.about-subroutes a,.secondary-routes a,.family-card a{color:#0b7255;font-weight:750;text-decoration:none}
.about-visual img,.about-wide-visual img{width:100%;height:auto;display:block;border-radius:20px;box-shadow:0 18px 44px rgba(19,55,41,.12)}
.about-visual{margin:0}
.about-wide-visual{margin:24px auto 0;max-width:940px}
.about-hero .about-visual{max-width:560px;margin-left:auto}
.about-hero .about-visual img{aspect-ratio:4/3;object-fit:cover;object-position:center}
.about-challenge .about-wide-visual img{aspect-ratio:16/9;object-fit:cover;object-position:center}
.about-governance .about-visual{max-width:560px}
.about-governance .about-visual img{aspect-ratio:4/3;object-fit:cover;object-position:center top}
.friction-grid,.organise-grid,.family-grid,.route-grid,.stage-grid,.steps-grid,.prepare-grid,.roadmap-grid,.final-grid{display:grid;gap:14px}
.friction-grid{grid-template-columns:repeat(4,1fr)}
.friction-item{display:flex;gap:10px;padding:14px;border:1px solid #dfe8e2;border-radius:14px;background:#fbfcfa}
.friction-item span{width:8px;height:8px;border-radius:50%;background:#0f7658;margin-top:8px;flex:0 0 auto}
.friction-item p{margin:0;font-size:.88rem;line-height:1.45}
.about-transition,.boundary-note{margin:20px 0 0;padding:15px 18px;border-left:3px solid #b88a2e;background:#f7f1e4;border-radius:0 12px 12px 0;color:#3c5148;line-height:1.58;font-size:.95rem}
.trust-anchor{display:block;margin:22px 0;padding:18px 20px;border:1px solid #c9ddd3;border-radius:16px;background:#edf7f2;font-weight:700;line-height:1.58}
.organise-grid{grid-template-columns:repeat(4,1fr)}
.about-card,.family-card,.route-card,.prepare-card,.layer-card,.road-card,.final-card,.stage-card,.step-card{padding:18px;border:1px solid #dbe5df;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(29,62,49,.05)}
.about-card p,.family-card p,.route-card p,.layer-card p,.final-card p,.road-card p,.stage-card p,.step-card p,.support-list p,.limit-list p{color:#65756e;line-height:1.52;font-size:.94rem}
.about-icon{width:30px;height:7px;border-radius:999px;background:linear-gradient(90deg,#0f7658,#c79535);margin-bottom:14px}
.about-center{text-align:center;margin-top:20px}
.family-grid{grid-template-columns:repeat(3,1fr)}
.route-grid{grid-template-columns:repeat(4,1fr)}
.route-card,.prepare-card,.final-card{display:flex;flex-direction:column}
.route-card .rd-btn,.prepare-card .rd-btn,.final-card .rd-btn{margin-top:auto}
.stage-grid{grid-template-columns:repeat(3,1fr)}
.stage-card span,.step-card span{font-size:.75rem;font-weight:800;color:#b38127;letter-spacing:.12em}
.stage-card:last-child{border-style:dashed;background:#f6f7f5}
.steps-grid{grid-template-columns:repeat(3,1fr)}
.step-card{min-height:110px}
.prepare-grid{grid-template-columns:repeat(3,1fr)}
.prepare-card ul{padding-left:18px;color:#596b63;line-height:1.58;margin:0 0 14px}
.prepare-card li{margin:0 0 4px}
.split-head,.boundary-grid,.governance-grid,.context-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.support-list,.limit-list{display:grid;gap:10px}
.support-list>div,.limit-list>div,.context-cards>div,.experience-grid>div{padding:14px 16px;border-radius:13px;border:1px solid #dce7e1;background:#fff}
.support-list h3,.limit-list h3,.context-cards h3,.experience-grid h3{margin:0}
.support-list>div{border-left:3px solid #0f7658}
.limit-list>div{border-left:3px solid #b88a2e}
.governance-grid{align-items:start}
.layer-cards{display:grid;gap:12px}
.roadmap-grid{grid-template-columns:repeat(3,1fr)}
.road-status{display:inline-block;font-size:.7rem;font-weight:800;color:#0f7658;background:#e8f4ee;border-radius:999px;padding:5px 10px;margin-bottom:12px}
.road-card:last-child{border-style:dashed}
.context-grid{align-items:start}
.context-cards{display:grid;gap:12px}
.experience-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.final-grid{grid-template-columns:repeat(4,1fr)}
.secondary-routes{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:22px}
.about-page .rd-btn{display:inline-flex;justify-content:center;align-items:center;text-decoration:none;min-height:44px;padding:12px 18px}
.about-page .rd-btn-outline{border:1px solid #0f7658;color:#0f7658;background:transparent}
.about-page .rd-btn-outline:hover{background:#e9f4ef}
.about-page .rd-btn-solid{background:#0f7658;color:#fff}
.about-page .rd-btn-solid:hover{background:#095f46}

@media(max-width:1100px){
  .about-hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.86fr);gap:28px}
  .about-shell{width:min(1080px,100%)}
}
@media(max-width:980px){
  .about-section{padding:46px 22px}
  .about-hero-grid{grid-template-columns:1fr;gap:22px}
  .about-hero .about-visual{max-width:620px;margin:0 auto}
  .about-hero-copy{text-align:left}
  .friction-grid,.organise-grid{grid-template-columns:repeat(2,1fr)}
  .route-grid,.final-grid{grid-template-columns:repeat(2,1fr)}
  .family-grid{grid-template-columns:repeat(3,1fr)}
  .experience-grid{grid-template-columns:repeat(3,1fr)}
  .governance-grid,.context-grid,.split-head,.boundary-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .about-section{padding:38px 16px}
  .about-page h1{font-size:2rem;max-width:none}
  .about-page h2{font-size:1.55rem}
  .about-lead,.about-intro{font-size:.95rem;line-height:1.62}
  .about-actions{flex-direction:column}
  .about-actions .rd-btn{width:100%}
  .about-subroutes{justify-content:flex-start;gap:16px}
  .about-wide-visual{max-width:100%;margin-top:18px}
  .about-wide-visual img{aspect-ratio:4/3}
  .about-visual img,.about-wide-visual img{border-radius:14px}
  .friction-grid,.organise-grid,.family-grid,.route-grid,.stage-grid,.steps-grid,.prepare-grid,.roadmap-grid,.final-grid,.split-head,.boundary-grid,.governance-grid,.context-grid{grid-template-columns:1fr}
  .experience-grid{grid-template-columns:1fr 1fr}
  .secondary-routes{flex-direction:column;align-items:center;gap:12px}
  .about-card,.family-card,.route-card,.prepare-card,.layer-card,.road-card,.final-card,.stage-card,.step-card{padding:16px}
  .step-card{min-height:auto}
}
@media(max-width:430px){
  .about-page h1{font-size:1.8rem}
  .about-page h2{font-size:1.42rem}
  .about-eyebrow{font-size:.7rem;letter-spacing:.13em}
  .experience-grid{grid-template-columns:1fr}
  .about-subroutes{flex-direction:column;align-items:flex-start;gap:8px}
  .about-page .rd-btn{padding:11px 14px}
}

/* CTN About v02 — compact three-line hero + direct Products nav */
@media(min-width:981px){
  .about-hero-grid{grid-template-columns:minmax(0,1.16fr) minmax(380px,.84fr);gap:36px}
  .about-page h1{font-size:clamp(2.45rem,3vw,3.2rem);line-height:1.04;max-width:680px;letter-spacing:-.035em}
  .about-hero .about-visual{max-width:520px}
}
@media(min-width:1180px){
  .about-page h1{font-size:3.05rem;max-width:720px}
}