/* =====================================================================
   page: organizing.html  (loaded after base.css; base.css tokens only)
   Rhythm: paper hero with a sample closet sheet -> paper-2 "two ways"
   ledger + how pricing works -> paper plain steps -> mist "keep it that
   way" -> paper-2 estimate form + talk block.
   Audience colour: homes (paper + orchid accents).
   ===================================================================== */

/* 1. hero: like homes.html (sheet under the buttons on phones, tilted right at 1024+) */
.or-hero{padding-block:var(--s6) var(--s8)}
.or-hero h1{font-size:clamp(2.55rem,1.5rem + 3.3vw,4.35rem)}
.or-hero .lead{margin-top:var(--s5)}
.or-hero__btns{margin-top:var(--s6)}
.or-hero__sheet .sheet{margin-inline:auto}
@media (max-width:599px){
  .or-hero__btns{flex-direction:column;align-items:stretch}
  .or-hero__btns .btn{width:100%}
}
@media (min-width:1024px){
  .or-hero{padding-block:var(--s8) var(--s9)}
  .or-hero__grid{align-items:center}
  .or-hero__sheet{justify-self:end;width:100%;max-width:440px}
}

/* 2. two ways: full-width ledger with its own link column (as homes.html) */
.or-ledger .or-ledger__go{justify-self:start;margin-top:var(--s2);display:inline-block;padding-block:10px}
@media (min-width:1024px){
  .or-ledger .ledger__row{grid-template-columns:minmax(0,9fr) minmax(0,11fr) minmax(0,4fr)}
  .or-ledger .or-ledger__go{grid-column:3;grid-row:1 / span 2;justify-self:end;align-self:center;margin-top:0;white-space:nowrap}
}
/* how pricing works: a ruled row closing the band (no dollar amounts, by design) */
.or-price{display:grid;gap:var(--s3) var(--s6);margin-top:var(--s7);padding-top:var(--s5);border-top:var(--border)}
.or-price .kicker{margin-bottom:var(--s2)}
.or-price__h{font-size:var(--t-h2)}
.or-price__line{font:400 var(--t-lead)/1.45 var(--f-display);color:var(--ink);max-width:40ch}
@media (min-width:768px){ .or-price{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:end} }

/* 3. how it goes: heading held left, plain steps right */
@media (min-width:1024px){
  .or-how{align-items:start}
  .or-how__head{position:sticky;top:calc(var(--header-h) + var(--s6))}
  .or-steps .steps__row{grid-template-columns:5.5rem minmax(0,1fr);row-gap:var(--s2)}
  .or-steps .steps__n{grid-row:1 / span 2}
}

/* 4. keep it that way */
.or-keep .body{max-width:48ch}
.or-keep__grid{row-gap:var(--s5)}
.or-keep__act{margin-top:0}
@media (min-width:1024px){
  .or-keep__grid{align-items:end}
  .or-keep__act{justify-self:end;margin-top:0}
}

/* 5. estimate */
.or-est{align-items:start}
.or-est__other{margin-top:var(--s6);padding-top:var(--s4);border-top:var(--hair)}
.or-est__links{margin-top:var(--s3)}