/* ISO standard pages · one structure for all 14 standards.
   Built on styles.css tokens. Reuses .eyebrow, .cmp, .list2, .acc, .wide-btn, .rv, .living. */

main.p-isostd{ --muted:#5c655f; --deep:#2a3a35; }

/* ---------- section rhythm ---------- */
.p-isostd .std-sec{ padding-bottom:clamp(.5rem,2vh,1.5rem) }
.p-isostd .eyebrow{ margin:clamp(3.2rem,7vh,5rem) 0 clamp(1.6rem,3vh,2.5rem) }
.p-isostd .std-h2{ font-size:clamp(1.55rem,3.4vw,2.6rem); font-weight:500; letter-spacing:-.025em; line-height:1.06; max-width:22ch; margin-bottom:1.6rem }
.p-isostd .std-body{ font-size:clamp(1.02rem,1.6vw,1.28rem); line-height:1.5; max-width:62ch }
.p-isostd .std-note{ margin-top:1.6rem; color:var(--muted); line-height:1.8; max-width:74ch }
.p-isostd .std-kicker{ display:block; margin-top:clamp(2rem,4vh,3rem); color:var(--muted) }

/* ---------- 1 · hero ---------- */
.p-isostd .std-hero{ padding-top:clamp(7.5rem,13vh,9.5rem); padding-bottom:clamp(2.5rem,6vh,4.5rem) }
.p-isostd .std-crumb{ color:var(--muted); margin-bottom:clamp(1.6rem,4vh,2.6rem) }
.p-isostd .std-crumb a{ color:var(--teal); text-decoration:none }
.p-isostd .std-crumb a:hover{ text-decoration:underline; text-underline-offset:3px }
.p-isostd .std-eyebrow{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  border-top:1px solid var(--ink); padding-top:.6rem; margin-bottom:1.5rem }
.p-isostd .std-h1{ font-size:clamp(2.2rem,6.2vw,4.8rem); font-weight:500; letter-spacing:-.03em; line-height:1.03; max-width:19ch }
.p-isostd .std-lede{ margin-top:1.3rem; font-size:clamp(1.02rem,1.8vw,1.42rem); line-height:1.45; max-width:52ch; color:var(--deep) }
.p-isostd .std-sub{ margin-top:clamp(1.8rem,4vh,2.6rem); color:var(--muted) }
@media (min-width:1024px){
  .p-isostd .std-crumb,
  .p-isostd .std-eyebrow{ max-width:60% }
}

/* ---------- buttons ---------- */
.p-isostd .std-btns{ display:flex; flex-wrap:wrap; gap:.65rem; margin-top:clamp(1.8rem,4vh,2.4rem) }
.p-isostd .std-btn{ display:inline-block; font-family:var(--mono); font-size:.72rem; letter-spacing:.08em;
  text-transform:uppercase; padding:1rem 1.7rem; text-decoration:none; transition:background .3s, color .3s }
.p-isostd .std-solid{ background:var(--teal); color:var(--white) }
.p-isostd .std-solid:hover{ background:var(--teal-deep) }
.p-isostd .std-out{ border:1px solid var(--teal); color:var(--teal) }
.p-isostd .std-out:hover{ background:var(--teal); color:var(--white) }

/* ---------- 2 · at a glance ---------- */
.p-isostd .glance{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin:0 }
@media (min-width:700px){ .p-isostd .glance{ grid-template-columns:1fr 1fr } }
@media (min-width:1100px){ .p-isostd .glance{ grid-template-columns:repeat(3,1fr) } }
.p-isostd .gcell{ background:var(--paper); padding:1.25rem 1.35rem; display:flex; flex-direction:column; gap:.5rem }
.p-isostd .gcell dt{ font-family:var(--mono); font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; color:var(--teal) }
.p-isostd .gcell dd{ margin:0; font-size:.97rem; line-height:1.45 }

/* ---------- 3 · requirements ---------- */
.p-isostd .reqs{ list-style:none; padding:0; margin:1.4rem 0 0; counter-reset:r; border-top:1px solid var(--ink) }
.p-isostd .reqs li{ counter-increment:r; display:grid; grid-template-columns:2.3rem 1fr; gap:.7rem;
  padding:.95rem 0; border-bottom:1px solid var(--line); font-size:.98rem; line-height:1.5 }
.p-isostd .reqs li::before{ content:counter(r,decimal-leading-zero); font-family:var(--mono); font-size:.7rem;
  letter-spacing:.06em; color:var(--teal); padding-top:.3rem }

/* ---------- 4 · who needs it ---------- */
.p-isostd .rows{ border-top:1px solid var(--ink) }
.p-isostd .row{ display:grid; grid-template-columns:1fr; gap:.35rem; padding:1.1rem 0; border-bottom:1px solid var(--line) }
.p-isostd .row b{ font-weight:500; color:var(--teal); font-size:1.05rem; line-height:1.3 }
.p-isostd .row span{ font-size:.97rem; line-height:1.5; max-width:72ch }
@media (min-width:900px){ .p-isostd .row{ grid-template-columns:17rem 1fr; gap:2rem; align-items:baseline } }

/* ---------- 5 + 7 · tables ---------- */
.p-isostd .std-tw{ overflow-x:auto; border:1px solid var(--line); background:var(--paper) }
.p-isostd .std-table{ width:100%; border-collapse:collapse; text-align:left }
.p-isostd .std-table th{ font-family:var(--mono); font-size:.65rem; letter-spacing:.09em; text-transform:uppercase;
  font-weight:400; color:var(--teal); padding:.85rem 1rem; background:var(--white); border-bottom:1px solid var(--line); white-space:nowrap }
.p-isostd .std-table td{ padding:1rem; border-top:1px solid var(--line); vertical-align:top; font-size:.95rem; line-height:1.5 }
.p-isostd .std-table tbody tr:first-child td{ border-top:0 }
.p-isostd .std-table td:first-child{ font-weight:500; color:var(--teal); width:30% }
.p-isostd .std-table-3 td:nth-child(2){ width:14%; font-family:var(--mono); font-size:.7rem; letter-spacing:.06em;
  text-transform:uppercase; color:var(--muted); white-space:nowrap }
@media (max-width:699px){
  .p-isostd .std-table-3, .p-isostd .std-table-3 tbody, .p-isostd .std-table-3 tr, .p-isostd .std-table-3 td{ display:block; width:auto }
  .p-isostd .std-table-3 thead{ display:none }
  .p-isostd .std-table-3 tr{ border-top:1px solid var(--line); padding:1rem }
  .p-isostd .std-table-3 tbody tr:first-child{ border-top:0 }
  .p-isostd .std-table-3 td{ border:0; padding:0 0 .45rem; width:auto }
  .p-isostd .std-table-3 td:nth-child(2){ width:auto }
  .p-isostd .std-table-3 td[data-l]::before{ content:attr(data-l); display:block; font-family:var(--mono);
    font-size:.6rem; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); margin-bottom:.15rem }
}

/* ---------- 6 · two tracks ---------- */
.p-isostd .cmp{ margin:0 }
.p-isostd .cmp h4{ margin-bottom:.7rem }
.p-isostd .cmp b{ font-size:clamp(1.3rem,2.4vw,1.8rem); margin-bottom:.7rem }
.p-isostd .trk-for{ font-size:.97rem; line-height:1.5; max-width:48ch }
.p-isostd .trk-lab{ display:block; color:var(--muted); border-top:1px solid var(--line); padding-top:.7rem; margin:1.3rem 0 .7rem }
.p-isostd .trk-steps{ margin:0; padding-left:1.15rem; display:grid; gap:.5rem; font-size:.95rem; line-height:1.5 }
.p-isostd .trk-steps li::marker{ font-family:var(--mono); font-size:.75rem; color:var(--teal) }
.p-isostd .trk-del{ list-style:none; margin:0; padding:0; display:grid; gap:.4rem; font-size:.9rem; line-height:1.5 }
.p-isostd .trk-del li{ position:relative; padding-left:1.05rem }
.p-isostd .trk-del li::before{ content:""; position:absolute; left:0; top:.65rem; width:.5rem; height:1px; background:var(--teal) }

/* ---------- 8 · we do / you do ---------- */
.p-isostd .duo{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line) }
@media (min-width:800px){ .p-isostd .duo{ grid-template-columns:1fr 1fr } }
.p-isostd .duo-col{ background:var(--paper); padding:1.5rem }
.p-isostd .duo-col h3{ font-weight:400; color:var(--teal); margin-bottom:.9rem }
.p-isostd .ticks{ list-style:none; margin:0; padding:0 }
.p-isostd .ticks li{ position:relative; padding:.75rem 0 .75rem 1.15rem; border-top:1px solid var(--line);
  font-size:.96rem; line-height:1.5 }
.p-isostd .ticks li:first-child{ border-top:0 }
.p-isostd .ticks li::before{ content:""; position:absolute; left:0; top:1.28rem; width:.42rem; height:.42rem; background:var(--teal) }

/* ---------- 9 · cost drivers ---------- */
.p-isostd .list2{ margin-top:0 }
.p-isostd .list2 li{ font-size:.97rem; line-height:1.5; padding:.9rem 0 }

/* ---------- 10 · faq ---------- */
.p-isostd .std-faq .acc-head{ font-size:clamp(1rem,1.75vw,1.28rem); line-height:1.35; padding:1.15rem 0; align-items:flex-start }
.p-isostd .std-faq .acc-plus{ font-size:1rem; padding-top:.18rem }
.p-isostd .std-faq .acc-body p{ font-family:var(--sans); font-size:1rem; letter-spacing:0; text-transform:none;
  line-height:1.6; max-width:74ch; padding-bottom:1.4rem }

/* ---------- 11 · related ---------- */
.p-isostd .relgrid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line) }
@media (min-width:640px){ .p-isostd .relgrid{ grid-template-columns:1fr 1fr } }
@media (min-width:1024px){ .p-isostd .relgrid{ grid-template-columns:repeat(4,1fr) } }
.p-isostd .relcard{ background:var(--paper); padding:1.35rem; min-height:10.5rem; display:flex; flex-direction:column;
  gap:.5rem; text-decoration:none; color:var(--ink); transition:background .3s }
.p-isostd .relcard:hover{ background:var(--white) }
.p-isostd .rc-code{ font-size:1.22rem; font-weight:500; color:var(--teal); line-height:1.1 }
.p-isostd .rc-name{ font-size:.92rem; line-height:1.4 }
.p-isostd .rc-go{ margin-top:auto; font-family:var(--mono); font-size:.64rem; letter-spacing:.09em;
  text-transform:uppercase; color:var(--teal) }

/* ---------- 12 · cta band ---------- */
.p-isostd .std-cta{ color:var(--paper); margin-top:clamp(3.5rem,8vh,6rem);
  padding:clamp(3.5rem,9vh,6.5rem) clamp(1rem,3vw,2.5rem) }
.p-isostd .std-cta-in{ max-width:58rem }
.p-isostd .std-cta-ref{ display:block; opacity:.75; margin-bottom:1.3rem }
.p-isostd .std-cta-h{ font-size:clamp(1.5rem,3.4vw,2.8rem); font-weight:500; letter-spacing:-.022em; line-height:1.14; max-width:26ch }
.p-isostd .std-cta-btn{ margin-top:clamp(1.8rem,4vh,2.4rem); background:var(--paper); color:var(--teal-deep) }
.p-isostd .std-cta-btn:hover{ background:var(--white) }

.p-isostd .std-note{margin:1.6rem 0 0; font-size:1.02rem; line-height:1.5; color:var(--ink); max-width:60ch}
.p-isostd .std-note a{color:var(--teal); text-decoration:underline; text-underline-offset:3px}