/* da-page.css: page-scoped tokens + the ONE type scale for /divorce-agreement/ (離婚協議書, #105; a copy of cb-page.css,
   itself from cu-page.css, so the service pages read as one family). The deep green stays the SITE green (site.css
   --green #0F3B2E). Grounds: s2 tan #E8DCC3 (the live 撫養權 six factors), s7 sage #DDE6DF. */
[id] { scroll-margin-top: calc(var(--nav-h) + 16px); }
h1.mask .line > span, h2.mask .line > span { text-wrap: balance; }
@media (max-width: 899px) { :root { --pad: 20px; } }

.da {
  --da-sage: #DDE6DF;
  --da-sand: #E8DCC3;
  --on-dark: #F2F3EE; --on-dark-mute: rgba(242,243,238,.72); --on-dark-dim: rgba(242,243,238,.40);
  --da-mute: rgba(16,32,27,.68); --hair-light: rgba(16,32,27,.14); --hair-dark: rgba(242,243,238,.18);
  --ease: cubic-bezier(.16,1,.3,1);
  display: block;
}
.da .sec { padding: 160px 0; }

/* every two-phrase heading: a phrase is ONE unbreakable unit; the heading may only break BETWEEN phrases
   (lab/probe-cross-border.mjs asserts it at 320-2000) */
.da .ln.join { display: inline-block; white-space: nowrap; }
/* the amber accent on a light ground is a marker band, never amber text (2:1 on paper/sage/sand) */
.da .hi-mark { color: inherit; background: linear-gradient(transparent 60%, rgba(233,169,58,.55) 60%); -webkit-box-decoration-break: clone; box-decoration-break: clone; padding-inline: .06em; }

/* ---------- ONE TYPE SCALE (mt-page.css names, da- prefix) ---------- */
.da .da-h3 { font-family: var(--serif); font-weight: 500; font-size: 24px; line-height: 1.3; letter-spacing: -.01em; }
.da .da-label { font-family: var(--sans); font-weight: 500; font-size: 13px; line-height: 1.4; letter-spacing: .12em; color: var(--da-mute); }
.da .da-kp { font-family: var(--sans); font-weight: 400; font-size: 14px; line-height: 1.65; }
.da .da-num { font-family: var(--serif); font-weight: 400; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.da .da-body { font-family: var(--sans); font-weight: 400; font-size: 16px; line-height: 1.8; color: var(--da-mute); }
.da .da-intro { font-family: var(--sans); font-weight: 400; font-size: 16px; line-height: 1.8; color: var(--da-mute); max-width: 34em; margin-top: 18px; }
.da [data-da-sec] .btn { font-weight: 500; }
.da [data-da-sec] b, .da [data-da-sec] strong { font-weight: 500; }

/* ---------- the pin (mt-page.css): wrapper = runway, inner = the sticky 100vh stage ---------- */
.da .da-pin { position: relative; }
.da .da-pin.is-pinned > .da-pin-inner { position: sticky; top: 0; height: var(--screen); overflow: hidden; }

/* the ask under a section: one line + the WhatsApp button */
.da .da-ask { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 24px; text-align: center; }
.da .da-ask-line { margin: 0; font-family: var(--sans); font-weight: 400; font-size: 16px; line-height: 1.8; color: var(--da-mute); }

@media (max-width: 899px) {
  .da .sec { padding: 80px 0; }
  .da .da-h3 { font-size: 20px; }
  .da .da-ask-line { font-size: 15px; }
}

/* ---------- the dark pricing card gets air (撫養權 edit round 1 row 5, same rule) ---------- */
.da #pricing { margin-top: 72px; padding: clamp(28px, 4.5vw, 64px); }
.da #pricing > .wrap { width: 100%; }
.da #pricing .dp-plan-list { gap: 12px; }
@media (max-width: 899px) { .da #pricing { margin-top: 44px; } }

/* the shared cases filter chips are 40px tall; on this page every tap target is >= 44px (page probe) */
.da .dp-case-filters button { min-height: 44px; }
/* the shared blog + FAQ filter chips (38px in site.css): 44px on this page */
.chips button { height: 44px; border-radius: 22px; }
/* the hero's second H1 line (內地結婚，也可在香港辦妥, 12 units) wraps on a phone: it may only break at its comma,
   never inside 也可在香港辦妥 (shared HeroDP markup, page-scoped rule) */
#da-hero h1 .line > span { word-break: keep-all; white-space: nowrap; }
/* #105: the hero H1 is ONE line (owner's word) and the sub-line sits under it, smaller than the H1, amber */
#da-hero .hero-h1-single .line:last-child > span { font-size: inherit; }
#da-hero .hero-subline { margin: 14px 0 0; font-family: var(--serif); font-weight: 400; font-size: clamp(22px, 2.6vw, 38px); line-height: 1.3; color: var(--amber, #E9A93A); white-space: nowrap; }
@media (max-width: 480px) { #da-hero .hero-subline { font-size: clamp(20px, 6.4vw, 26px); } }
/* every H2 of this page's own sections sits on ONE line at 1024-2000 (v2 law): one .ln.join phrase each */
@media (min-width: 1024px) { .da h2 .ln.join { white-space: nowrap; } }
/* the booking form's "以電郵確認預約" row is a 24px label: its whole row is the 44px target on this page */
#book label.check { min-height: 44px; align-items: center; }
/* 320-360 px phones: the ten-character one-phrase H2s (e.g. 最常見的五個寫法錯誤) fit inside the screen */
@media (max-width: 360px) { .da h2.h2 { font-size: 24px; } }

/* FIX ROUND 1 R1-R3 (#105): EVERY H2 on this page is one line at 1024-2000 (v2 law), the shared blocks included.
   FAQ: the H2 is 「離婚協議書常見問題」 alone (Faq headingHi=""); Book: both phrases in one .line (h2OneLine), the size
   of the v2 wireframe; numbers + blog: their two .line phrases run on as one line, sized to fit the column. */
@media (min-width: 1024px) {
  #faq .faq-left h2 .line > span { white-space: nowrap; }
  #book .book-h2-one .line > span { white-space: nowrap; }
  #book .book-h2-one { font-size: clamp(19px, 1.85vw, 28px); }
  #numbers .numbers-h2 .line, #blog h2 .line { display: inline; }
  #numbers .numbers-h2 .line > span, #blog h2 .line > span { display: inline; white-space: nowrap; }
  #numbers .numbers-h2 { font-size: clamp(26px, 2.6vw, 44px); white-space: nowrap; }
  #blog h2 { font-size: clamp(28px, 3vw, 48px); white-space: nowrap; }
}
/* the shared close band's two phrases run on as ONE line at 1024-2000 (v2 law; page-scoped, Close.astro untouched) */
@media (min-width: 1024px) {
  #close h2 .line { display: inline; }
  #close h2 .line > span { display: inline; white-space: nowrap; }
  #close h2 { white-space: nowrap; }
}
