/* Catherine D. Gemstones — inner pages (Criações, Sob medida).
   Built on editorial.css: same tokens, typefaces, header, links, dialogs and footer.
   Adds a restrained "botanical plate" vocabulary: plate numbers, thin gold rules, a sprig ornament. */

.page{background:var(--ivory)}
.header--ink{color:var(--ink)}
.header--ink .menu-toggle{color:var(--ink)}
.desktop-nav a[aria-current="page"]{border-bottom:1px solid currentColor}
.header-contact{cursor:pointer}

.eyebrow{display:block;font:11px/1.4 var(--sans);letter-spacing:2.6px;text-transform:uppercase;color:#6b7057;margin-bottom:26px}
.on-dark .eyebrow,.eyebrow--light{color:#c0b286}
.plate-no{display:block;font:italic 21px/1 var(--serif);color:#766b46;margin-bottom:18px}
.on-dark .plate-no{color:var(--gold)}
.rule{display:flex;align-items:center;gap:16px;color:var(--gold);margin:0}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:currentColor;opacity:.6}
.rule svg{width:34px;height:14px;flex:none}
.lede{font-size:18px;line-height:1.72;max-width:460px}
.quiet-link{display:inline-flex;align-items:center;min-height:44px;font-size:13px;letter-spacing:.2px;color:#59614c;border-bottom:1px solid transparent}
.quiet-link:hover{border-bottom-color:currentColor}
.on-dark .quiet-link{color:#cfc7ad}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 34px;margin-top:30px}
.cta-row .text-link{min-height:48px;font-size:15px}
.frame{position:relative}
.frame::after{content:"";position:absolute;inset:10px;border:1px solid #f5f0e74d;pointer-events:none}
.figure-note{font-size:13px;line-height:1.6;color:#6a6f5b;margin-top:14px;letter-spacing:.2px}
.on-dark .figure-note{color:#b9b49e}

/* -------------------------------- Criações -------------------------------- */
.cr-hero{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center;padding:168px var(--gutter) 88px}
.cr-hero h1{font-size:clamp(64px,7vw,104px);letter-spacing:-2.4px;line-height:.92}
.cr-hero h1 em{display:block}
.cr-hero .lede{margin-top:34px}
.plate-index{list-style:none;margin:52px 0 0;padding:0;max-width:440px;border-top:1px solid #26302226}
.plate-index a{display:grid;grid-template-columns:40px 1fr auto;align-items:baseline;gap:12px;padding:15px 0;border-bottom:1px solid #26302226;min-height:52px}
.plate-index .n{font:italic 20px var(--serif);color:#766b46}
.plate-index .t{font:25px/1.1 var(--serif)}
.plate-index .k{font-size:12px;letter-spacing:.4px;color:#6b7057}
.specimens{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;align-items:end}
.specimens a{display:block}
.specimens img{width:100%;object-fit:cover}
.specimens .s1 img{aspect-ratio:.62;object-position:66% center}
.specimens .s2 img{aspect-ratio:.62}
.specimens .s3 img{aspect-ratio:.62;object-position:64% center}
.specimens .s2{transform:translateY(-64px)}
.specimens figcaption{font:italic 16px var(--serif);color:#6b6450;margin-top:10px}

.plate{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:center;padding:128px var(--gutter)}
.plate h2{font-size:clamp(52px,5vw,74px);letter-spacing:-1.4px;line-height:.98}
.plate p.desc{font-size:18px;line-height:1.75;max-width:460px;margin-top:24px}
.plate .kind{display:block;font-size:12px;letter-spacing:.5px;color:#6b7057;margin-top:12px}
.on-dark .kind{color:#c0b286}
.plate-1 .plate-media{grid-column:1/7}
.plate-1 .plate-media img{aspect-ratio:1;object-fit:cover;width:100%}
.plate-1{padding-top:72px}
.plate-1 .plate-text{grid-column:8/12}
.plate-1 .detail{margin-top:40px;width:220px}
.plate-1 .detail img{aspect-ratio:.86;object-fit:cover;width:100%}
.plate-2{background:var(--stone)}
.plate-2 .plate-text{grid-column:2/6;grid-row:1}
.plate-2 .plate-media{grid-column:7/12;grid-row:1}
.plate-2 .plate-media img{width:100%;max-width:520px;aspect-ratio:1000/1200;object-fit:cover;margin-left:auto}
.plate-3{background:var(--forest);color:var(--ivory-text);padding-top:0;row-gap:56px}
.plate-3 .plate-media{grid-column:1/13;margin:0 calc(var(--gutter) * -1)}
.plate-3 .plate-media img{width:100%;aspect-ratio:1.9;object-fit:cover;object-position:center 60%}
.plate-3 .plate-title{grid-column:1/6;align-self:start}
.plate-3 .plate-body{grid-column:7/12;align-self:start}
.plate-3 .plate-body p.desc{margin-top:0}
.plates-note{padding:26px var(--gutter);font-size:11px;color:#b9b49e;background:var(--forest);border-top:1px solid #c0b28626}

.closing{text-align:center;padding:128px var(--gutter) 120px}
.closing h2{font-size:clamp(56px,6vw,88px);letter-spacing:-1.8px;line-height:.98}
.closing p{font-size:18px;line-height:1.72;max-width:540px;margin:28px auto 0}
.closing .cta-row{justify-content:center}
.closing .rule{max-width:280px;margin:0 auto 46px}
.closing-dark{background:var(--forest);color:var(--ivory-text)}

/* -------------------------------- Sob medida -------------------------------- */
.sm-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--forest);color:var(--ivory-text);padding:206px var(--gutter) 128px;display:grid;grid-template-columns:1.7fr 1fr;gap:64px;align-items:end}
.sm-hero h1{font-size:clamp(62px,6.4vw,100px);letter-spacing:-2.2px;line-height:.94}
.sm-hero h1 em{display:block}
.sm-hero .lede{color:#e7e1d0}
.sm-hero-botanical{position:absolute;right:-210px;top:-170px;width:560px;opacity:.26;z-index:-1;pointer-events:none;transform:scaleY(-1) rotate(8deg)}
.sm-process{padding:124px var(--gutter) 110px}
.sm-process-head{display:grid;grid-template-columns:1.05fr 1fr;gap:72px;align-items:end;margin-bottom:70px}
.sm-process-head h2{font-size:clamp(54px,5.4vw,80px);letter-spacing:-1.6px;line-height:.96}
.sm-process-head p{font-size:18px;line-height:1.72;max-width:460px}
.steps{list-style:none;margin:0;padding:0;border-top:1px solid #c0b28680}
.step-row{display:grid;grid-template-columns:96px minmax(0,1fr) minmax(0,1.1fr);gap:56px;align-items:center;padding:64px 0;border-bottom:1px solid #c0b28680}
.step-row .num{font:italic 64px/1 var(--serif);color:#9b8659}
.step-row h3{font-size:42px;line-height:1.02;letter-spacing:-.6px}
.step-row p{font-size:18px;line-height:1.75;margin-top:18px;max-width:470px}
.step-visual{justify-self:stretch}
.swatches{display:flex;flex-wrap:wrap;gap:22px 26px}
.swatch{display:grid;justify-items:center;gap:10px;font:italic 17px var(--serif);color:#5b5a49}
.swatch i{display:block;width:62px;height:62px;border-radius:50%;box-shadow:inset 0 -6px 14px #00000033,inset 0 6px 10px #ffffff2e}
.specimen-row{display:flex;gap:28px;align-items:flex-end}
.specimen-row figure{margin:0;display:grid;justify-items:center;gap:10px}
.specimen-row img{display:block;height:150px;width:auto;object-fit:cover;border:1px solid #c0b28666;padding:6px;background:#fbf8f1}
.specimen-row figcaption{font:italic 17px var(--serif);color:#5b5a49}
.step-visual .cad-sheet{width:100%;aspect-ratio:1479/1110;object-fit:cover;box-shadow:0 1px 0 #d9d2c2,0 18px 40px -28px #3b3426}
.step-visual .finished{width:100%;max-width:520px;aspect-ratio:1.36;object-fit:cover}
.process-note{font-size:11px;color:#6a6f5b;margin-top:22px}

.faq{background:var(--stone);padding:118px var(--gutter);display:grid;grid-template-columns:1fr 1.35fr;gap:72px}
.faq h2{font-size:clamp(50px,5vw,72px);letter-spacing:-1.4px;line-height:.98}
.faq-list{border-top:1px solid #26302233}
.faq details{border-bottom:1px solid #26302233}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:72px;padding:18px 0;cursor:pointer;font:29px/1.15 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:300 26px var(--sans);color:#766b46;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{font-size:17px;line-height:1.75;max-width:580px;padding:0 0 28px}
.wa-note{font-size:13px;color:#b9b49e;margin-top:26px}

/* reveal (respecting reduced motion) */
.js-reveal [data-reveal]{opacity:0;translate:0 18px;transition:opacity .9s ease,translate 1s cubic-bezier(.2,.6,.3,1)}
.js-reveal [data-reveal].is-in{opacity:1;translate:none}
@media(prefers-reduced-motion:reduce){.js-reveal [data-reveal]{opacity:1;translate:none;transition:none}}

/* -------------------------------- tablet -------------------------------- */
@media(max-width:1150px) and (min-width:701px){
  .cr-hero,.sm-hero,.sm-process-head{gap:40px}
  .plate-1 .plate-media{grid-column:1/8}.plate-1 .plate-text{grid-column:8/13}
  .plate-2 .plate-text{grid-column:1/6}.plate-2 .plate-media{grid-column:7/13}
  .plate-3 .plate-title{grid-column:1/7}.plate-3 .plate-body{grid-column:7/13}
  .step-row{grid-template-columns:80px 1fr;gap:28px}.step-row .step-visual{grid-column:2}
  .faq{grid-template-columns:1fr;gap:36px}
}
/* -------------------------------- phone -------------------------------- */
@media(max-width:700px){
  .eyebrow{margin-bottom:18px}
  .lede{font-size:16px}
  .cr-hero{grid-template-columns:1fr;gap:54px;padding:150px 24px 76px}
  .cr-hero h1{font-size:56px;letter-spacing:-1.5px;line-height:.95}
  .cr-hero .lede{margin-top:24px}
  .plate-index{margin-top:36px}
  .plate-index .t{font-size:23px}
  .specimens{gap:10px}
  .specimens .s2{transform:translateY(-24px)}
  .specimens figcaption{font-size:14px}
  .plate{display:block;padding:76px 24px}
  .plate h2{font-size:46px;letter-spacing:-1px}
  .plate p.desc{font-size:16px;margin-top:18px}
  .plate-media{margin-bottom:34px}
  .plate-2 .plate-media{margin:0 0 34px}
  .plate-1 .detail{width:56%;margin-top:30px}
  .plate-3{padding-top:0}
  .plate-3 .plate-media{margin:0 -24px 36px}
  .plate-3 .plate-media img{aspect-ratio:1.2}
  .plate-3 .plate-body{margin-top:18px}
  .plates-note{padding:22px 24px;font-size:12px}
  .cta-row{gap:6px 26px;margin-top:24px}
  .closing{padding:84px 24px 86px}
  .closing h2{font-size:48px;letter-spacing:-1px}
  .closing p{font-size:16px}
  .sm-hero{grid-template-columns:1fr;gap:34px;padding:150px 24px 86px}
  .sm-hero h1{font-size:52px;letter-spacing:-1.4px;line-height:.98}
  .sm-hero-botanical{width:300px;right:-170px;top:-90px;bottom:auto;opacity:.18}
  .sm-process{padding:80px 24px 72px}
  .sm-process-head{grid-template-columns:1fr;gap:22px;margin-bottom:44px}
  .sm-process-head h2{font-size:46px}
  .step-row{grid-template-columns:1fr;gap:16px;padding:40px 0}
  .step-row .num{font-size:46px}
  .step-row h3{font-size:34px}
  .step-row .step-visual{margin-top:14px}
  .swatches{gap:16px 0;flex-wrap:nowrap;justify-content:space-between}.swatch{font-size:15px}
  .swatch i{width:46px;height:46px}
  .specimen-row{gap:16px}
  .specimen-row img{height:112px}
  .faq{grid-template-columns:1fr;gap:30px;padding:76px 24px}
  .faq h2{font-size:44px}
  .faq summary{font-size:24px;min-height:64px}
  .faq details p{font-size:15px}
  .process-note,.figure-note{font-size:12px}
  .wa-note{font-size:12px}
}
.mobile-nav button{display:block;width:100%;text-align:left;padding:14px 0;font:28px var(--serif);border-bottom:1px solid #ffffff20;color:inherit}
.mobile-nav a[aria-current="page"]{color:var(--gold)}

/* narrative additions */
.emotion{font:italic 27px/1.3 var(--serif);color:#6b5a3c;margin-top:20px;max-width:420px}
.on-dark .emotion{color:#c0b286}
.plate-3 .emotion{margin-top:16px}
.manifesto{padding:128px var(--gutter) 96px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
.letter{grid-column:3/11;position:relative;padding:72px 84px 64px;background:#fbf8f1;box-shadow:0 1px 0 #e3dccb,0 30px 60px -44px #3b3426}
.letter::before{content:"";position:absolute;inset:14px;border:1px solid #c0b28673;pointer-events:none}
.letter h2{font-size:clamp(50px,4.8vw,70px);letter-spacing:-1.3px;line-height:.98;margin-bottom:34px}
.letter p{font-size:17px;line-height:1.9;max-width:640px;margin-top:18px}
.letter .drop::first-letter{float:left;font:400 92px/.78 var(--serif);color:#9b8659;margin:8px 12px 0 0}
.step-label{display:block;font:11px var(--sans);letter-spacing:2.2px;text-transform:uppercase;color:#766b46;margin-bottom:12px}
@media(max-width:1150px) and (min-width:701px){.letter{grid-column:1/13}}
@media(max-width:700px){
  .emotion{font-size:23px;margin-top:14px}
  .manifesto{display:block;padding:72px 18px 60px}
  .letter{padding:46px 26px 40px}.letter::before{inset:9px}
  .letter h2{font-size:42px;margin-bottom:22px}
  .letter p{font-size:16px;line-height:1.85}
  .letter .drop::first-letter{font-size:72px}
}

@media(max-width:700px){.cr-hero{padding-bottom:28px}.page-criacoes .plate-1{padding-top:48px}}

/* =========================== round 3: content deepening =========================== */
.dot{display:inline-block;flex:none;width:14px;height:14px;border-radius:50%;background:var(--c);box-shadow:inset 0 -3px 6px #0000003d,inset 0 2px 4px #ffffff40;vertical-align:middle}
.aside-line{font:italic 23px/1.35 var(--serif);color:#6b5a3c;margin-top:26px;max-width:440px}
.on-dark .aside-line{color:#c0b286}
/* I — herbarium note */
.herbarium{margin:34px 0 0;max-width:440px;border-top:1px solid #c0b28699}
.herbarium div{display:grid;grid-template-columns:86px 1fr;align-items:baseline;gap:12px;padding:12px 0;border-bottom:1px solid #c0b28659}
.herbarium dt{font:11px var(--sans);letter-spacing:2.2px;text-transform:uppercase;color:#766b46}
.herbarium dd{margin:0;font:italic 21px/1.3 var(--serif);color:#3e3f31}
/* II — a conversation of colours */
.voices{list-style:none;margin:26px 0 0;padding:0;max-width:460px}
.voices li{display:flex;align-items:baseline;gap:14px;padding:9px 0;font-size:17px;line-height:1.5}
.voices .dot{width:16px;height:16px;transform:translateY(2px)}
.voices b{font:italic 400 25px/1 var(--serif);min-width:74px}
.plate-2 .plate-media{position:relative}
.plate-2 .float{position:absolute;border-radius:50%;background:var(--c);box-shadow:inset 0 -5px 10px #00000040,inset 0 4px 7px #ffffff40,0 10px 18px -10px #3b3426}
.float.f1{width:34px;height:34px;left:2%;top:18%}.float.f2{width:22px;height:22px;left:9%;top:9%}
.float.f3{width:28px;height:28px;right:-3%;bottom:22%}.float.f4{width:18px;height:18px;right:5%;bottom:13%}
/* III */
.plate-3 .scene{font-size:18px}
/* Detail feature */
.closer{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:48px;padding:136px var(--gutter) 120px;align-items:start}
.closer-head{grid-column:1/5;grid-row:1}
.closer-head h2{font-size:clamp(52px,5vw,74px);letter-spacing:-1.4px;line-height:.98}
.closer-head p{font-size:18px;line-height:1.72;margin-top:26px;max-width:360px}
.d{margin:0}
.d img{display:block;width:100%;height:auto}
.d figcaption{font-size:15px;line-height:1.6;color:#4d5142;margin-top:16px;max-width:380px}
.d figcaption span{font:italic 19px var(--serif);color:#766b46;margin-right:4px}
.d figcaption b{font:400 20px/1.2 var(--serif);color:var(--ink)}
.d1{grid-column:5/10;grid-row:1/3}
.d2{grid-column:10/13;grid-row:1/3;align-self:center;max-width:340px}
.d3{grid-column:2/5;grid-row:2;max-width:280px;align-self:end}
/* Bridge to Sob medida */
.bridge{background:var(--stone);padding:110px var(--gutter) 116px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
.bridge-mark{grid-column:1/13;display:flex;align-items:center;gap:14px;margin-bottom:46px}
.bridge-mark .dot{width:18px;height:18px}
.bridge-mark span{width:56px;height:1px;background:var(--gold)}
.bridge h2{grid-column:1/7;grid-row:2;font-size:clamp(50px,4.8vw,70px);letter-spacing:-1.3px;line-height:.98}
.bridge > div:last-child{grid-column:8/12}
.bridge p{font-size:18px;line-height:1.75;margin-bottom:26px}
.bridge .text-link{min-height:48px;font-size:15px}
/* Sob medida — letter seal */
.seal{display:flex;align-items:center;gap:14px;margin-top:44px!important}
.seal img{width:46px;height:46px;border-radius:50%}
.seal span{font:24px/1 var(--serif);letter-spacing:.6px;color:#4c4a3a;text-transform:uppercase}
.seal small{display:block;font:9px var(--sans);letter-spacing:4px;margin-top:6px;color:#766b46}
/* Stories */
.stories{background:var(--stone);padding:124px var(--gutter) 136px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:56px;row-gap:0}
.stories-head{grid-column:1/4;display:grid;grid-template-columns:1.05fr 1fr;gap:72px;align-items:end;margin-bottom:76px}
.stories-head h2{font-size:clamp(54px,5.4vw,80px);letter-spacing:-1.6px;line-height:.96}
.stories-head p{font-size:18px;line-height:1.72;max-width:440px}
.story h3{font-size:34px;line-height:1.05;letter-spacing:-.4px;margin-top:46px}
.story p{font-size:17px;line-height:1.75;margin-top:16px;max-width:360px}
.s-b{margin-top:96px}.s-c{margin-top:40px}
.arch{position:relative;margin:0;max-width:300px}
.arch img{display:block;width:100%;aspect-ratio:345/460;object-fit:cover;border-radius:999px 999px 0 0;outline:1px solid #c0b286a6;outline-offset:8px}
.arch .gem{position:absolute;left:50%;bottom:-20px;width:40px;height:40px;margin-left:-20px;border:3px solid var(--stone);box-shadow:inset 0 -6px 12px #00000045,inset 0 5px 8px #ffffff45,0 0 0 4px #c0b28680}
/* Step visuals */
.step-text{max-width:500px}
.note-card{position:relative;background:#fbf8f1;padding:36px 42px 30px;max-width:470px;box-shadow:0 1px 0 #e3dccb,0 24px 50px -40px #3b3426;transform:rotate(-.6deg)}
.note-card::before{content:"";position:absolute;inset:10px;border:1px solid #c0b28666;pointer-events:none}
.note-title{font:11px var(--sans);letter-spacing:2.4px;text-transform:uppercase;color:#766b46;margin:0 0 10px!important}
.note-card ul{list-style:none;margin:0;padding:0}
.note-card li{font:italic 22px/1.3 var(--serif);color:#3e3f31;padding:10px 0;border-bottom:1px dashed #c0b2868c}
.note-foot{font:italic 17px var(--serif)!important;color:#7a6a4a;margin-top:16px!important}
.color-study{display:flex;gap:30px;align-items:flex-end}
.color-study figure{margin:0;display:grid;justify-items:start}
.color-study img{display:block;height:150px;width:auto;border:1px solid #c0b28666;padding:6px;background:#fbf8f1}
.color-study i{display:block;width:100%;height:12px;margin-top:10px;background:var(--c);box-shadow:inset 0 -3px 5px #00000030}
.color-study figcaption{font:italic 18px var(--serif);color:#5b5a49;margin-top:8px}
.study-more{display:flex;align-items:center;gap:10px;font:italic 18px var(--serif)!important;color:#6b6450;margin-top:22px!important}
/* 04 — the climax */
.birth{background:var(--forest);color:var(--ivory-text);padding:128px var(--gutter) 64px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:center}
.birth-text{grid-column:1/6}
.birth .num{display:block;font:italic 64px/1 var(--serif);color:var(--gold);margin-bottom:22px}
.birth .step-label{color:#c0b286}
.birth h2{font-size:clamp(54px,5.2vw,78px);letter-spacing:-1.5px;line-height:.96}
.birth p{font-size:18px;line-height:1.75;margin-top:26px;max-width:440px;color:#e7e1d0}
.birth-art{grid-column:6/13;position:relative;height:580px}
.b-sketch{position:absolute;left:0;top:0;width:50%;transform:rotate(-4deg);box-shadow:0 30px 50px -24px #000a;opacity:.94}
.b-swatches{position:absolute;left:8%;top:380px;display:flex;gap:12px}
.b-swatches .dot{width:24px;height:24px}
.b-line{position:absolute;left:21%;top:400px;width:26%;height:110px;overflow:visible}
.b-line path{fill:none;stroke:var(--gold);stroke-width:1.2;stroke-dasharray:4 7;vector-effect:non-scaling-stroke}
.b-piece{position:absolute;right:-3%;top:170px;width:58%;filter:drop-shadow(0 30px 40px #000a)}
.birth .birth-note{grid-column:1/13;max-width:none;font-size:13px;color:#b9b49e;margin-top:40px;padding-top:22px;border-top:1px solid #c0b28626}

@media(max-width:1150px) and (min-width:701px){
  .closer-head{grid-column:1/13}.d1{grid-column:1/8;grid-row:2/4}.d2{grid-column:8/13;grid-row:2}.d3{grid-column:8/13;grid-row:3;max-width:260px}
  .bridge h2{grid-column:1/13;margin-bottom:28px}.bridge > div:last-child{grid-column:1/10;grid-row:3}
  .stories{column-gap:28px}.stories-head{grid-template-columns:1fr;gap:24px}
  .birth-text{grid-column:1/13}.birth-art{grid-column:1/13;height:520px;margin-top:40px}
}
@media(max-width:700px){
  .lede{font-size:17px}
  .plate p.desc{font-size:17px}
  .herbarium div{grid-template-columns:70px 1fr}
  .herbarium dd{font-size:19px}
  .voices li{font-size:16px;gap:12px}
  .voices b{font-size:22px;min-width:64px}
  .aside-line{font-size:21px}
  .float.f1{width:26px;height:26px}.float.f3{width:22px;height:22px;right:-2%}
  .closer{grid-template-columns:1fr 1fr;column-gap:16px;row-gap:34px;padding:84px 24px 76px}
  .closer-head{grid-column:1/3;grid-row:auto}
  .closer-head h2{font-size:46px}
  .closer-head p{font-size:17px;margin-top:20px}
  .d1{grid-column:1/3;grid-row:auto}.d2{grid-column:1/2;grid-row:auto;align-self:start}.d3{grid-column:2/3;grid-row:auto;align-self:start;margin-top:64px}
  .d figcaption{font-size:14px}.d2 figcaption b,.d3 figcaption b{font-size:18px}
  .bridge{display:block;padding:76px 24px 80px}
  .bridge-mark{margin-bottom:34px}
  .bridge h2{font-size:44px;margin-bottom:24px}
  .bridge p{font-size:17px}
  .story h3,.stories-head h2{letter-spacing:-.4px}
  .stories{display:block;padding:80px 24px 84px}
  .stories-head{display:block;margin-bottom:56px}
  .stories-head h2{font-size:46px;letter-spacing:-1px}
  .stories-head p{font-size:17px;margin-top:20px}
  .story{margin-top:64px}.s-a{margin-top:0}
  .arch{max-width:220px}.s-b .arch{margin-left:auto}
  .s-b h3,.s-b p{text-align:right;margin-left:auto}
  .story h3{font-size:30px;margin-top:40px}
  .story p{font-size:16px}
  .step-row p{font-size:17px}
  .note-card{padding:28px 26px 24px}
  .note-card li{font-size:19px;padding:9px 0}
  .color-study{gap:14px}
  .color-study img{height:104px}
  .color-study figcaption{font-size:15px}
  .study-more{font-size:16px!important}
  .birth{display:block;padding:84px 24px 48px}
  .birth .num{font-size:46px}
  .birth h2{font-size:44px;letter-spacing:-1px}
  .birth p{font-size:17px}
  .birth-art{height:360px;margin-top:44px}
  .b-sketch{width:62%}
  .b-piece{width:76%;right:-2%;top:120px}
  .b-swatches{top:236px;left:4%}.b-swatches .dot{width:18px;height:18px}
  .b-line{left:20%;top:250px;width:20%;height:60px}
  .birth .birth-note{font-size:12px;margin-top:30px}
  .faq details p{font-size:16px}
}
.step-row .note-title{font-size:11px;line-height:1.5}.step-row .note-foot,.step-row .study-more{line-height:1.4}

/* ---- V1 readability pass: minimum label size 12px, footer & dialog notes on the inner pages ---- */
.eyebrow,.step-label,.herbarium dt,.step-row .note-title{font-size:12px}
.plate-index .k{font-size:13px}
.seal small{font-size:10px}
.page .footer nav{font-size:13px}
.page .credits-button{font-size:12px}
.page .footer-brand small{font-size:8px}
.page .modal-note{font-size:12px!important;line-height:1.6}
@media(max-width:700px){
  .process-note,.figure-note,.birth .birth-note,.wa-note{font-size:13px}
  .page .footer nav{font-size:14px}
  .page .credits-button{font-size:12px}
}
/* stage 04: label the concept composition where the eye already is */
.birth-art{margin:0}
@media(max-width:1150px){.birth .birth-art{margin-top:48px}}
.b-tag{position:absolute;font:italic 17px/1.2 var(--serif);color:#c0b286;white-space:nowrap}
.b-tag.t1{left:2%;top:318px}
.b-tag.t2{right:2%;top:516px}
.birth .birth-art .birth-note{position:absolute;left:0;right:0;top:calc(100% + 18px);margin:0;padding:0;border:0;font-size:13px;line-height:1.6;color:#b9b49e;max-width:520px}
.birth{padding-bottom:120px}
@media(max-width:1150px) and (min-width:701px){.b-tag.t2{top:auto;bottom:-6px}}
@media(max-width:700px){
  .birth{padding-bottom:104px}
  .b-tag{font-size:15px}
  .b-tag.t1{top:196px;left:0}
  .b-tag.t2{top:auto;bottom:-4px;right:0}
  .birth .birth-art .birth-note{font-size:13px;top:calc(100% + 16px)}
}

/* ---- stage 04 (rev.): nature → drawing → jewel, all on the forest ground, no paper card ---- */
.birth-art .b-line{left:0;top:0;width:100%;height:100%;z-index:0}
.birth-art .b-line path{stroke-dasharray:3 8;opacity:.75}
.b-sprig{position:absolute;left:0;top:30px;width:22%;opacity:.8;transform:rotate(-8deg);-webkit-mask-image:linear-gradient(200deg,#000 55%,transparent 98%);mask-image:linear-gradient(200deg,#000 55%,transparent 98%)}
.birth-art .b-swatches{left:3%;top:300px}
.b-cad{position:absolute;left:23%;top:0;width:52%;filter:drop-shadow(0 18px 26px #0009)}
.birth-art .b-piece{right:-3%;top:205px;width:55%}
.birth-art .b-tag.t1{left:0;top:342px;right:auto}
.birth-art .b-tag.t2{left:36%;top:300px;right:auto}
.birth-art .b-tag.t3{right:3%;top:548px;left:auto;bottom:auto}
@media(max-width:1150px) and (min-width:701px){.birth-art .b-tag.t3{top:auto;bottom:-6px}}
@media(max-width:700px){
  .birth-art{height:470px}
  .b-sprig{width:28%;top:6px}
  .b-cad{left:24%;width:76%;top:0}
  .birth-art .b-swatches{left:2%;top:206px}
  .birth-art .b-tag.t1{top:236px;left:0}
  .birth-art .b-tag.t2{top:212px;left:auto;right:4%}
  .birth-art .b-piece{width:80%;right:-4%;top:250px}
  .birth-art .b-tag.t3{top:auto;bottom:-2px;right:0}
}
.b-cad{left:20%;width:50%}
.birth-art .b-piece{top:276px;width:52%;right:-4%}
.birth-art .b-swatches{top:292px}
.birth-art .b-tag.t1{top:330px}
.birth-art .b-tag.t2{left:34%;top:262px}
.birth-art .b-tag.t3{top:566px}
@media(max-width:700px){
  .b-cad{left:22%;width:78%}
  .birth-art .b-piece{width:80%;right:-4%;top:262px}
  .birth-art .b-swatches{top:206px}.birth-art .b-tag.t1{top:236px}
  .birth-art .b-tag.t2{top:214px;left:auto;right:4%}
  .birth-art .b-tag.t3{top:auto}
}
.b-sprig{left:0;top:118px;width:17%;opacity:.85;transform:rotate(-14deg)}
.birth-art .b-tag.t3{top:604px}
@media(max-width:700px){
  .b-sprig{width:21%;top:58px;left:0}
  .birth-art .b-tag.t3{top:auto;bottom:-26px}
  .birth .birth-art .birth-note{top:calc(100% + 40px)}
  .birth{padding-bottom:128px}
}
.b-sprig{opacity:.98}

/* ==== Site-wide consistency (Demo V1 · 2026-10-11): every image is a paper card on the page ==== */
:root{--card-shadow:0 1px 0 #dcd4c3,0 24px 48px -30px rgba(59,52,38,.62);--card-shadow-dark:0 0 0 1px rgba(192,178,134,.16),0 36px 70px -34px rgba(0,0,0,.78)}
.specimens img,.plate-1 .plate-media img,.plate-2 .plate-media img,.d img,.step-visual .cad-sheet,.color-study img{box-shadow:var(--card-shadow)}
.letter,.note-card{box-shadow:var(--card-shadow)}
/* Pulsar: from full-bleed to a card floating on the forest */
.plate-3{padding-top:112px}
.plate-3 .plate-media{margin:0}
.plate-3 .plate-media img{box-shadow:var(--card-shadow-dark)}
.d2 img,.d3 img{box-shadow:var(--card-shadow)}
@media(max-width:700px){
  .plate-3{padding-top:64px}
  .plate-3 .plate-media{margin:0 0 36px}
  .plate-3 .plate-media img{aspect-ratio:1.25}
}
.arch img{box-shadow:0 24px 44px -30px rgba(59,52,38,.7)}

/* ==== taste-skill review (2026-10-12) ==== */
/* H2: stacked section heads */
.stories-head,.sm-process-head{display:block}
.stories-head p,.sm-process-head p{margin-top:26px;max-width:34em}
.bridge{display:block}
.bridge h2{margin-bottom:30px}
.bridge > div:last-child{max-width:36em}
/* H3: the note card's title as a quiet italic line, not another uppercase label */
.step-row .note-title{font:italic 22px/1.2 var(--serif);text-transform:none;letter-spacing:0;color:#6b5a3c;margin-bottom:6px!important}
/* M6: step 02 breaks the text-left / image-right rhythm: text first, the colour study across the row */
@media(min-width:1151px){
  .steps .step-row:nth-child(2){grid-template-columns:96px minmax(0,1fr);row-gap:40px}
  .steps .step-row:nth-child(2) .step-text{max-width:640px}
  .steps .step-row:nth-child(2) .step-visual{grid-column:2}
  .steps .step-row:nth-child(2) .color-study{gap:56px}
  .steps .step-row:nth-child(2) .color-study img{height:190px}
}
/* M4: plate numbers stand alone */
.plate-no{letter-spacing:.5px}
/* M5: slimmer navigation bar */
@media(min-width:701px){.header{padding-top:13px;padding-bottom:13px}}
/* L4: phone — the three specimens scroll sideways at a readable size */
@media(max-width:700px){
  .specimens{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:24px;gap:14px;margin:0 -24px;padding:6px 24px 26px;scrollbar-width:none}
  .specimens::-webkit-scrollbar{display:none}
  .specimens figure{flex:0 0 64%;scroll-snap-align:start;margin:0}
  .specimens .s2{transform:none}
  .specimens img{aspect-ratio:.8}
}
body{letter-spacing:.005em}

/* Critique pass 2026-10-12 */
/* step numerals align with the step title */
.step-row .step-text{grid-column:2;position:relative}
.step-row .step-text .num{position:absolute;left:-152px;top:-6px}
@media(max-width:1150px) and (min-width:701px){.step-row .step-text .num{left:-108px}}
@media(max-width:700px){.step-row .step-text{grid-column:auto}.step-row .step-text .num{position:static;display:block;margin-bottom:16px}}
/* inline consult entries inside the long process */
.step-cta{margin-top:26px;min-height:48px;font-size:15px}
/* phones: the plate index already leads into Prancha I, so the specimen strip would repeat the same photographs */
@media(max-width:700px){.specimens{display:none}.cr-hero{gap:0}}
/* balanced section heads, no single-word last lines */
main h2{text-wrap:balance}

/* 2026-10-17: the three life-moment titles on Sob medida are single upright headings now; keep their lines even */
.story h3{text-wrap:balance}

/* 2026-10-17: small labels in sentence case. A quiet italic line, like the note-card title, instead of tracked capitals. */
.eyebrow{font:italic 21px/1.3 var(--serif);letter-spacing:0;text-transform:none;color:#6b5a3c;margin-bottom:18px}
.on-dark .eyebrow,.eyebrow--light{color:#c0b286}
.herbarium dt{font:13px/1.4 var(--sans);letter-spacing:.3px;text-transform:none;color:#766b46}
@media(max-width:700px){.eyebrow{font-size:19px;margin-bottom:14px}}

/* ------------------------------ Sob medida opens on the leopard scene (2026-10-24) ------------------------------ */
/* the slogan that used to be the homepage's second screen; the bespoke details follow below */
.sm-world{position:relative;isolation:isolate;overflow:clip;min-height:min(900px,max(620px,100svh));display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--forest);color:var(--ivory-text);padding:150px var(--gutter) 96px}
.sm-world-bg{position:absolute;inset:0;z-index:-2;margin:0}
.sm-world-bg img{width:100%;height:100%;object-fit:cover;object-position:center}
.sm-world::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(#15271bb3,#15271b40 52%,#15271b1a);pointer-events:none}
.sm-world-copy{max-width:780px}
.sm-world h1{font-size:clamp(54px,5.6vw,86px);letter-spacing:-1.8px;line-height:1;margin-top:10px}
.sm-world h1 em{display:block}
.sm-world .lede{color:#efe9d8;max-width:32em;margin:26px auto 0}
.sm-world .cta-row{justify-content:center}
.sm-world-note{position:absolute;right:var(--gutter);bottom:14px;min-height:44px;font-size:12px;letter-spacing:.3px;color:#ede6d2;border-bottom:1px solid transparent}
.sm-world-note:hover{border-bottom-color:currentColor}
@media(max-width:700px){
  .sm-world{padding:120px 24px 84px;min-height:min(820px,max(600px,100svh))}
  .sm-world-bg img{object-position:43.5% center}
  .sm-world h1{font-size:44px;letter-spacing:-1.2px}
  .sm-world .lede{font-size:16px}
  .sm-world-note{left:24px;right:24px;text-align:right;bottom:10px}
}

/* 2026-10-27: the gem painting in "birth" bleeds past the right edge on purpose; the section clips it so the page does
   not scroll sideways (about 7px at 1150px wide) */
.birth{overflow-x:clip}

/* 2026-10-28: every page ends on the same picture: the closing block is dark forest green over the jaguar engraving,
   darker in the middle where the words are (as on the story page); the same on the homepage (final.css) */
.closing-dark{position:relative;isolation:isolate;overflow:clip}
.closing-dark::before{content:"";position:absolute;inset:0;z-index:-2;background:url('media/print-study.webp') center 60%/cover;opacity:.5}
.closing-dark::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at center,rgba(24,39,29,.92) 0%,rgba(24,39,29,.75) 45%,rgba(24,39,29,.35) 100%)}
.closing-dark h2 em{color:#c0b286}
.closing-dark p{color:#efe6d4e0}
.closing-dark .text-link{color:var(--ivory-text)}
/* aesthetic check (2026-10-28), 5: the ring-size tips use the full width of the page, three columns on large screens */
.md-tips{max-width:none}
@media(min-width:1151px){.md-tips ul{columns:3}}
/* 2026-10-28: the closing's leaf rule sits on the block's top edge, between the page margins, mirrored, so it and
   the footer's rule at the bottom edge frame the closing symmetrically, both leaves pointing in */
.closing-dark{padding-top:150px}
.closing-dark .rule{position:absolute;top:-6px;left:var(--gutter);right:var(--gutter);max-width:none;margin:0;transform:scaleY(-1)}
.closing-dark .rule::before,.closing-dark .rule::after{opacity:1;background:rgba(192,178,134,.6)}
.closing-dark .rule svg{color:#c0b286}
@media(max-width:700px){.closing-dark{padding-top:96px}.closing-dark .rule{left:24px;right:24px}}
/* 2026-10-28, later: no rule on the closing's top edge (the footer's rule stays); the closing blocks of the inner pages
   are as tall as the homepage's closing in the same language and at the same screen size, the words centred in them */
.closing-dark .rule{display:none}
.closing-dark{display:flex;flex-direction:column;justify-content:center;padding-top:100px;padding-bottom:90px;min-height:655px}
html[lang^="zh"] .closing-dark{min-height:565px}
@media(max-width:1150px) and (min-width:701px){.closing-dark{min-height:627px}html[lang^="zh"] .closing-dark{min-height:545px}}
@media(max-width:700px){.closing-dark{padding-top:72px;padding-bottom:72px;min-height:480px}html[lang^="zh"] .closing-dark{min-height:494px}}