/* Let the type breathe: no masks across serif descenders. */
.hero-title { line-height: 1.03; font-size: clamp(65px,8vw,128px); }
.hero-title .title-row { overflow: visible; padding-block: .035em; }
.hero-title .reveal-word { transform: none; animation: none; }
.hero-objects { animation: none; }
.hero-reframe { position: relative; display: table; margin: 20px auto 0; }
.hero-reframe::after { content:''; position:absolute; left:6%; right:4%; bottom:-9px; height:2px; background:var(--signal); transform:scaleX(0) rotate(-1deg); transform-origin:left; animation:pencil-underline .9s .4s ease forwards; }
.hero-copy { margin-top:32px; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

.before-work { padding-left:calc(var(--pad) + 175px); }
.before-work .case-sheet { max-width:950px; }
.case-sheet-before .case-row { grid-template-columns:30px minmax(0,1.35fr) minmax(0,1fr); }
.case-sheet-before .row-context { text-align:right; }
.case-sheet-before .case-row-final .row-context { font-size:23px; }
.case-sheet-paper { position:relative; }
.case-sheet h2 { font-size:clamp(36px,4vw,52px); }
.case-row .write-text { clip-path:none!important; animation:none!important; }
.type-visual { position:relative; }
.motion-ready .typed-char { visibility:hidden; }
.motion-ready .typed-char.typed { visibility:visible; }
.motion-ready .row-context .write-text { opacity:0; transition:opacity .55s ease; }
.motion-ready .is-context-visible .row-context .write-text { opacity:1; }
.typing-now .type-visual { border-right:1px solid currentColor; }
.row-action .type-visual { padding-right:2px; }
.admin-mark { position:absolute; z-index:4; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.admin-mark path { fill:none; stroke:#4d7349; stroke-width:1.8; stroke-linecap:round; opacity:.85; }
.motion-ready .admin-mark path { stroke-dasharray:1; stroke-dashoffset:1; }
.motion-ready .is-annotated .admin-mark path { animation:draw-pencil 1.2s ease forwards; }
.margin-note { position:absolute; top:37%; left:-188px; width:157px; margin:0; font:32px/1.05 'Caveat',cursive; color:var(--signal); transform:rotate(-7deg); }
.margin-note::after { content:'↗'; display:block; margin:12px 0 0 80px; font-size:48px; }
.motion-ready .margin-note::after { opacity:0; }
.motion-ready .is-annotated .margin-note::after { animation:note-arrow .7s .75s ease forwards; }
.case-sheet-after .row-context { text-align:left; }
.case-sheet-after .case-row { grid-template-columns:24px minmax(0,1fr) minmax(0,1.25fr); gap:15px; min-height:102px; }
.case-sheet-after .row-action { font-size:27px; }
.case-sheet-after .row-context { font-size:28px; }
.case-sheet-after .strike-action { width:auto; }
.case-sheet-after .strike-action::after { display:none; }
.case-sheet-after .is-context-visible .row-action .type-visual { text-decoration:line-through; text-decoration-thickness:1.5px; text-decoration-color:#738369; }
.case-sheet-after .case-row-final .row-action .type-visual { text-decoration:none; }

.rewrite-section { min-height:650px; }
.rewrite-copy h2 { display:flex; align-items:baseline; justify-content:center; gap:.16em; padding-top:100px; font:clamp(68px,10vw,158px)/1.2 'Instrument Serif',serif; letter-spacing:-.035em; }
.verb-edit { position:relative; display:inline-block; }
.struck-word { position:relative; color:#d6e2d3; }
.struck-word::after { content:''; position:absolute; left:-3%; top:52%; width:106%; height:4px; background:#f4ebc4; border-radius:50%; transform-origin:left; transform:rotate(-4deg); }
.replace-word { position:absolute; left:9%; bottom:.8em; color:#fcf5d7; font:500 1.2em/1 'Caveat',cursive; transform:rotate(-7deg); }
.unchanged-words { color:#eff0e0; }
.motion-ready .struck-word::after { transform:scaleX(0) rotate(-4deg); }
.motion-ready .is-rewritten .struck-word::after { animation:pencil-underline .55s ease forwards; }

.after-scene { display:grid; grid-template-columns:minmax(0,1fr) 195px; align-items:center; gap:38px; max-width:1340px; margin:auto; }
.after-scene .case-sheet { width:100%; margin:35px 0; }
.after-scene .case-sheet-paper { padding-inline:36px; }
.after-scene .sheet-footnote { margin-left:39px; }
.retired-tools { position:relative; height:410px; align-self:end; margin-bottom:110px; }
.tool-scrap { position:absolute; z-index:1; display:flex; align-items:center; gap:10px; width:150px; height:67px; padding:14px; border:1px solid #b9beb1; background:#f9f8ee; box-shadow:3px 7px 10px #2431242b; font-size:13px; }
.tool-scrap img { width:27px; height:27px; }
.scrap-whatsapp { top:28px; left:2px; transform:rotate(-16deg); }
.scrap-gmail { top:85px; left:41px; transform:rotate(15deg); }
.scrap-drive { top:139px; left:4px; transform:rotate(-10deg); }
.scrap-pdf { top:184px; left:22px; transform:rotate(12deg); }
.pdf-emblem { display:grid; place-items:center; width:28px; height:32px; border:1px solid #8f5340; color:#8f5340; font-size:9px; font-weight:600; }
.wire-basket { position:absolute; z-index:2; left:0; top:145px; width:190px; height:195px; clip-path:polygon(0 0,100% 0,88% 100%,12% 100%); border-bottom:5px solid #737e70; background:repeating-linear-gradient(90deg,transparent 0 9px,#66776399 10px 11px,transparent 12px 13px),repeating-linear-gradient(0deg,transparent 0 11px,#6a7a6480 12px 13px,transparent 14px 15px),linear-gradient(90deg,#a1ab9744,#c4cfb61a 40%,#5f74504f); }
.wire-basket::before { content:''; position:absolute; top:0; left:0; right:0; height:16px; border:4px solid #747e6e; border-radius:50%; background:#c6cdbb55; }
.wire-basket::after { content:''; position:absolute; left:10%; bottom:0; width:80%; height:13px; border:3px solid #7e8973; border-radius:50%; }
.retired-tools > p { position:absolute; top:340px; left:0; width:100%; margin:20px 0 0; font:29px/1.1 'Caveat',cursive; text-align:center; color:var(--signal); transform:rotate(-5deg); }

.case-map { position:relative; isolation:isolate; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:'one two three' 'signature five four'; gap:80px 64px; padding:60px; max-width:1400px; margin:75px auto 0; border:1px solid #aeb9a6; background:linear-gradient(#9fad9833 1px,transparent 1px),linear-gradient(90deg,#9fad9833 1px,transparent 1px),#e5e7db; background-size:42px 42px; }
.map-node { position:relative; z-index:2; min-height:215px; padding:25px; border:1px solid #a8b39e; background:#f7f6ed; box-shadow:4px 5px 0 #78896c1f; }
.map-node > span { font-size:11px; color:var(--muted); }
.map-node h3 { margin:26px 0 16px; font:32px/1.03 'Instrument Serif',serif; letter-spacing:-.02em; }
.map-node p { margin:0; font-size:15px; line-height:1.55; color:var(--muted); }
.map-one { grid-area:one; }.map-two { grid-area:two; }.map-three { grid-area:three; }.map-four { grid-area:four; }.map-five { grid-area:five; border-color:#54774d; background:#d9e4d2; }
.map-signature { grid-area:signature; align-self:center; text-align:center; color:var(--signal); }
.map-signature strong { font-size:43px; font-weight:600; letter-spacing:-.07em; }
.map-signature p { margin:14px 0 0; font:24px/1.2 'Caveat',cursive; }
.case-map-routes { position:absolute; z-index:1; inset:0; width:100%; height:100%; pointer-events:none; }
.map-route { fill:none; stroke:#54744f; stroke-width:1.8; marker-end:url(#case-arrow); }
.map-route-return { stroke-dasharray:5 7; opacity:.65; animation:route-flow 16s linear infinite; }
@keyframes pencil-underline { to { transform:scaleX(1) rotate(-2deg); } }
@keyframes draw-pencil { to { stroke-dashoffset:0; } }
@keyframes note-arrow { from { opacity:0; transform:translate(-8px,8px); } to { opacity:1; transform:none; } }
@keyframes route-flow { to { stroke-dashoffset:-120; } }

@media(max-width:1100px) {
  .before-work { padding-left:calc(var(--pad) + 130px); }.margin-note { left:-143px; width:125px; font-size:28px; }
  .after-scene { grid-template-columns:minmax(0,1fr) 160px; gap:25px; }.retired-tools { transform:scale(.84); transform-origin:left center; }
  .case-sheet-after .row-action,.case-sheet-after .row-context { font-size:25px; }.after-scene .case-sheet-paper { padding-inline:28px; }
  .case-map { padding:40px; gap:65px 38px; }.map-node { padding:20px; }.map-node h3 { font-size:29px; }
}
@media(max-width:900px) {
  .hero-title { font-size:9.5vw; }
  .before-work { padding-left:var(--pad); }.case-sheet-before .margin-note { position:relative; left:auto; top:auto; width:280px; margin:34px 0 0 20px; font-size:30px; transform:rotate(-3deg); }.margin-note::after { position:absolute; left:220px; top:-30px; transform:rotate(-60deg); margin:0; }
  .case-map { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:'one two' 'four three' 'five signature'; gap:55px 40px; }
  .after-scene { grid-template-columns:1fr; }.retired-tools { width:195px; margin:0 25px 0 auto; transform:none; height:405px; }
  .case-sheet-after .row-action,.case-sheet-after .row-context { font-size:28px; }
}
@media(max-width:600px) {
  .hero-title { font-size:clamp(43px,12vw,66px); }.hero-reframe { font-size:26px; }.hero-copy { margin-top:29px; }
  .case-sheet-before .case-row { grid-template-columns:17px minmax(0,1.2fr) minmax(0,1fr); gap:10px; }
  .case-sheet-before .case-row-final .row-context { font-size:18px; }
  .case-sheet h2 { font-size:35px; }.case-row { min-height:96px; }.row-action,.row-context { font-size:22px; }
  .case-sheet-before .margin-note { margin-left:5px; width:235px; }.admin-mark path { stroke-width:1.4; }
  .rewrite-section { min-height:450px; padding-inline:20px; }.rewrite-copy h2 { font-size:13vw; gap:.15em; padding-top:65px; }.replace-word { font-size:1.4em; bottom:.68em; }.struck-word::after { height:2px; }
  .after-scene .case-sheet-paper { padding-inline:18px; }.case-sheet-after .case-row { grid-template-columns:17px minmax(0,1fr) minmax(0,1.3fr); gap:10px; }.case-sheet-after .row-action { font-size:22px; }.case-sheet-after .row-context { font-size:23px; }.case-sheet-after .case-row-final .row-context { font-size:22px; }.after-scene .sheet-footnote { margin-left:27px; }
  .retired-tools { margin-right:22px; }.system { padding-bottom:55px; }
  .case-journey h2 { font-size:52px; }.case-map { grid-template-columns:1fr; grid-template-areas:'one' 'two' 'three' 'four' 'five' 'signature'; gap:36px; padding:32px 26px; margin-top:50px; }.map-node { min-height:175px; padding:23px; }.map-node h3 { margin-top:18px; font-size:33px; }.map-node p { font-size:16px; }.map-signature { padding-block:14px; }
}
@media(prefers-reduced-motion:reduce) {
  .motion-ready .typed-char { visibility:visible; }.motion-ready .row-context .write-text { opacity:1; }.motion-ready .admin-mark path { stroke-dashoffset:0; }.motion-ready .margin-note::after { opacity:1; }
  .motion-ready .struck-word::after { transform:scaleX(1) rotate(-2deg); }.map-route-return { animation:none; }.hero-reframe::after { transform:scaleX(1); animation:none; }
}
