/* Houseplant — the house in section, front door to basement.
   Paleta medida no CSS real (MARCA.json) e nas capturas da home; fontes OFL equivalentes (DIRECAO.md §7). */

@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/anton-400.woff2) format('woff2')}
@font-face{font-family:'Arimo';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/arimo-400.woff2) format('woff2')}
@font-face{font-family:'Arimo';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/arimo-700.woff2) format('woff2')}
@font-face{font-family:'Young Serif';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/young-serif-400.woff2) format('woff2')}

:root{
  /* primitivos da marca */
  --cream:#f4f1e0;
  --basement:#321e1e;
  --shelf:#e8e3cb;
  --butter:#faeaa1;
  --mint:#a8e8e2;
  --line:#bdb498;
  --ember:#c0270b;
  --focus:#87adf5;
  /* papéis */
  --tx:var(--basement);
  --tx-soft:#5e4a44;
  --sobre-escuro:var(--cream);
  --sobre-escuro-soft:#d9d2bd;
  --acao:var(--butter);
  --shout:'Anton',Impact,'Haettenschweiler','Arial Narrow Bold',sans-serif;
  --talk:'Arimo','Helvetica Neue',Helvetica,Arial,sans-serif;
  --letter:'Young Serif','New Spirit',Georgia,'Times New Roman',serif;
  --gut:clamp(12px,4.45vw,86px);
  --room-gap:clamp(56px,7.4vw,118px);
  --corner:10px;
  --ease-out:cubic-bezier(.23,1,.32,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:92px;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{margin:0;overflow-x:clip;background-color:var(--cream);color:var(--tx);font:400 16px/1.5 var(--talk);touch-action:manipulation}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote,table{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit}
::selection{background:var(--butter);color:var(--basement)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:2px}

/* ---------- pacote: faixa, menu, rodapé ---------- */
.pular{position:absolute;left:12px;top:-60px;z-index:100;background:var(--butter);color:#212326;padding:12px 18px;font-weight:700;border-radius:3px;text-decoration:none}
.pular:focus{top:8px}
.rascunho{background-color:var(--basement);color:var(--cream);font-size:13px;line-height:1.4;text-align:center;padding:8px var(--gut)}
.pacote{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px var(--gut);background-color:var(--cream);border-bottom:1.5px solid var(--basement)}
.pacote-abas{display:flex;flex-wrap:wrap;gap:4px clamp(14px,2.2vw,34px)}
.pacote-abas a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;font-size:15px;letter-spacing:-.01em;text-decoration:none;color:var(--tx);box-shadow:inset 0 -3px 0 transparent;transition:box-shadow .15s ease}
.pacote-abas a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--basement)}
.pacote-abas .curto{display:none}
.chat{display:inline-flex;align-items:center;min-height:44px;padding:0 22px;background-color:var(--basement);color:var(--cream);font-weight:700;font-size:15px;text-decoration:none;border-radius:3px;white-space:nowrap;transition:transform .15s ease-out}
.chat:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .pacote-abas a:hover{box-shadow:inset 0 -3px 0 var(--line)}
  .pacote-abas a[aria-current="page"]:hover{box-shadow:inset 0 -3px 0 var(--basement)}
}
@media (max-width:860px){
  .pacote-abas .longo{display:none}
  .pacote-abas .curto{display:inline}
  .pacote-abas a{font-size:14px}
}
.rodape{background-color:var(--basement);color:var(--cream);padding:40px var(--gut) 56px;font-size:14px;display:grid;gap:14px;justify-items:center;text-align:center;border-top:1.5px solid #5a4343}
.rodape p{max-width:70ch}
.rodape-chat{display:inline-flex;align-items:center;min-height:46px;padding:0 28px;background-color:var(--butter);color:#212326;font-weight:700;text-decoration:none;border-radius:3px}
.rodape-fontes{color:var(--sobre-escuro-soft);font-size:13px}

/* ---------- casa: largura, placas, corrimão ---------- */
main{display:block}
section{position:relative;overflow-x:clip;padding-block:calc(var(--room-gap) / 2)}
section > .house-width,.house-width{width:min(100% - 2 * var(--gut),1750px);max-width:1750px;margin-inline:auto}

h2{font:400 clamp(34px,3.5vw,58px)/1 var(--shout);text-transform:uppercase;letter-spacing:.005em;text-wrap:balance}
h3{font:700 18px/1.25 var(--talk);letter-spacing:-.01em;text-wrap:balance}
p{text-wrap:pretty}
.plate-small{font-weight:700;font-size:17px;letter-spacing:-.01em;margin-bottom:6px}

.room-plate{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:clamp(24px,3vw,40px)}
.room-plate .plate-small{grid-column:1}
.room-plate h2{grid-column:1}
.room-plate .plate-lede{grid-column:2;grid-row:1 / span 2;font-size:clamp(18px,1.55vw,23px);line-height:1.35;letter-spacing:-.01em}

.inline-door{font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.inline-door-cream{color:var(--cream)}

/* a linha dupla da marca: grossa + fina, atravessando o botão */
.handrail{display:flex;align-items:center;gap:12px;color:var(--basement)}
.handrail::before,.handrail::after{content:"";flex:1 1 0;min-width:12px;height:9px;border-top:3px solid currentColor;border-bottom:1px solid currentColor}
.handrail-cream{color:var(--cream)}
.handrail-mint{color:var(--mint)}
.knob{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px clamp(20px,2.6vw,38px);font:700 16px/1.2 var(--talk);letter-spacing:-.01em;text-decoration:none;text-align:center;border-radius:3px;border:2px solid transparent;transition:transform .15s ease-out,background-color .15s ease,color .15s ease}
.knob:active{transform:scale(.97)}
.knob-cream{background-color:var(--cream);color:var(--basement)}
.knob-butter{background-color:var(--butter);color:#212326}
.knob-mint{background-color:var(--mint);color:var(--basement)}
.knob-ghost{background-color:var(--basement);color:var(--cream);border-color:var(--cream)}
@media (hover:hover) and (pointer:fine){
  .knob-cream:hover,.knob-mint:hover{background-color:var(--butter);color:#212326}
  .knob-butter:hover{background-color:var(--cream)}
  .knob-ghost:hover{background-color:var(--cream);color:var(--basement)}
}

/* laje entre andares: a linha dupla de ponta a ponta */
.slab{height:10px;border-top:4px solid var(--basement);border-bottom:1.5px solid var(--basement);margin-bottom:var(--room-gap);transform-origin:left center}
.slab + .house-width{margin-top:0}
section:has(> .slab){padding-top:calc(var(--room-gap) / 2)}

/* molduras */
.tile-photo{border-radius:var(--corner);overflow:hidden;background-color:var(--shelf)}
.tile-photo img{width:100%;height:100%;object-fit:cover}
.shelf-niche{display:block;border-radius:var(--corner);overflow:hidden;background-color:var(--shelf);aspect-ratio:620 / 776}
.shelf-niche img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.tag-price{font-size:17px;font-variant-numeric:tabular-nums;white-space:nowrap}
.tag-note{font-size:14px;color:var(--tx-soft)}

/* ---------- the stairwell (elemento memorável) ---------- */
.stairwell{display:none}
@media (min-width:1280px) and (min-height:700px){
  .stairwell{display:block;position:fixed;left:calc((var(--gut) - 36px) / 2);top:50%;transform:translateY(-46%);z-index:30;width:36px;padding:10px 0 8px;background-color:var(--cream);border:1.5px solid var(--basement);border-radius:18px;color:var(--basement)}
  .stairwell-roof{display:block;margin:0 auto 6px;width:20px;height:16px}
  .stairwell-floors{position:relative}
  .stairwell-floors a{position:relative;display:block;height:24px}
  .stairwell-floors a::before{content:"";position:absolute;left:11px;right:11px;top:11px;height:2px;background-color:var(--line);transition:left .2s ease,right .2s ease,background-color .2s ease}
  .stairwell-floors a.is-here::before{left:6px;right:6px;height:3px;background-color:var(--basement)}
  .stairwell-floors a span{position:absolute;left:44px;top:50%;transform:translateY(-50%);padding:5px 11px;background-color:var(--basement);color:var(--cream);font:700 13px/1.2 var(--talk);white-space:nowrap;border-radius:3px;opacity:0;pointer-events:none;transition:opacity .15s ease}
  .stairwell-floors a:focus-visible span,.stairwell-floors a.just-arrived span{opacity:1}
  .stairwell-ember{position:absolute;left:-5px;top:40px;width:8px;height:8px;border-radius:50%;background-color:var(--ember);transform:translateY(calc(var(--floor,0) * 24px));transition:transform .45s var(--ease-out)}
  .stairwell-b{display:block;margin-top:4px;text-align:center;font:400 15px/1 var(--shout)}
}
@media (min-width:1280px) and (min-height:700px) and (hover:hover) and (pointer:fine){
  .stairwell-floors a:hover span{opacity:1}
  .stairwell-floors a:hover::before{background-color:var(--basement)}
}

/* ---------- 1 · front door ---------- */
.front-door{padding-top:clamp(12px,1.4vw,22px);padding-bottom:calc(var(--room-gap) / 2.4)}
.door-card{position:relative;display:grid;align-items:end;min-height:clamp(600px,calc(100svh - 176px),780px);border-radius:var(--corner);overflow:hidden;background-color:var(--basement);color:var(--cream);--pad:clamp(16px,4.4vw,64px)}
.door-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%}
.door-veil{position:absolute;inset:0;background:linear-gradient(to top,rgba(38,20,20,.94) 0%,rgba(38,20,20,.78) 38%,rgba(38,20,20,.38) 68%,rgba(38,20,20,.3) 100%)}
.door-words{position:relative;padding:clamp(120px,16vh,200px) var(--pad) clamp(28px,4.4vw,60px);text-align:center;background-color:transparent}
.door-tagline{font-weight:700;font-size:clamp(15px,1.3vw,19px);letter-spacing:-.01em;margin-bottom:12px}
.door-title{font:400 clamp(40px,6.5vw,112px)/.94 var(--shout);text-transform:uppercase;letter-spacing:.005em;max-width:15em;margin-inline:auto;text-wrap:balance}
.door-about{max-width:56ch;margin:18px auto 26px;font-size:clamp(15px,1.25vw,18px);line-height:1.45}
.door-words .handrail{margin-inline:calc(-1 * var(--pad))}
.door-mat{display:flex;justify-content:space-between;gap:16px;padding-top:14px;font-weight:700;font-size:15px;letter-spacing:-.01em}

/* ---------- 2 · hallway ---------- */
.hallway{padding-top:calc(var(--room-gap) / 2.4)}
.hall-run{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding-inline:max(var(--gut),calc((100% - 1750px) / 2));scroll-padding-inline:var(--gut);scroll-snap-type:x proximity}
.hall-run::-webkit-scrollbar{display:none}
.hall-doors{display:flex;gap:clamp(14px,1.7vw,24px);width:max-content}
.hall-doors li{flex:0 0 clamp(158px,21.5vw,330px);width:clamp(158px,21.5vw,330px);scroll-snap-align:start}
.hall-doors a{display:block;text-decoration:none}
.door-frame{display:block;border-radius:var(--corner);overflow:hidden;background-color:var(--shelf);aspect-ratio:620 / 776}
.door-frame img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.hall-doors strong{display:block;margin-top:14px;font-size:clamp(17px,1.45vw,21px);letter-spacing:-.02em;white-space:nowrap}
.hall-doors small{display:block;margin-top:4px;font-size:14px;line-height:1.4;color:var(--tx-soft)}
.hall-progress{margin-top:26px;height:2px;background-color:var(--line)}
.hall-progress i{display:block;height:2px;margin-top:-0px;background-color:var(--basement);box-shadow:0 -1px 0 var(--basement);transform-origin:left center;transform:scaleX(.42)}
@media (hover:hover) and (pointer:fine){
  .hall-doors a:hover .door-frame img,.shelf-piece:hover .shelf-niche img{transform:scale(1.035)}
}

/* ---------- 3 · sofa ---------- */
.sofa-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(520px,54vw,800px);border-radius:var(--corner);overflow:hidden;background-color:var(--basement);color:var(--cream)}
.sofa-letter{--pad:clamp(20px,4.4vw,64px);display:flex;flex-direction:column;justify-content:center;padding:var(--pad);background-color:var(--basement)}
.sofa-shout{font:400 clamp(60px,8.6vw,150px)/.9 var(--shout);margin-bottom:26px}
.sofa-text{max-width:34em;font-size:clamp(16px,1.3vw,19px);line-height:1.5}
.sofa-sign{margin-top:4px;font-size:clamp(16px,1.3vw,19px)}
.sofa-letter .handrail{margin:44px calc(-1 * var(--pad)) 0}
.handrail-left::before{flex:0 0 var(--pad)}
.sofa-photo{min-height:100%}
.sofa-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}

/* ---------- 4 · studio ---------- */
.studio-pan{border-radius:var(--corner);overflow:hidden;background-color:var(--shelf);aspect-ratio:2400 / 841}
.studio-pan img{width:100%;height:100%;object-fit:cover;object-position:78% 50%}
.studio-bench{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4.6vw,72px);margin-top:clamp(32px,4vw,60px);align-items:start}
.studio-note{position:sticky;top:104px}
.studio-letter{margin-top:22px;font:400 clamp(21px,2.05vw,32px)/1.28 var(--letter);letter-spacing:-.01em}
.studio-letter p + p{margin-top:.8em}
.studio-wheel h3{font:400 clamp(24px,2.2vw,34px)/1.05 var(--shout);text-transform:uppercase;margin-bottom:16px}
.studio-wheel p{font-size:17px;line-height:1.6}
.studio-shot{margin-block:30px;border-radius:var(--corner);overflow:hidden;background-color:var(--shelf);aspect-ratio:1776 / 1152}
.studio-shot img{width:100%;height:100%;object-fit:cover}

/* ---------- 5 · standards ---------- */
.standards-shout{font:400 clamp(44px,9.3vw,172px)/.9 var(--shout);letter-spacing:0}
.standards-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,1.7vw,24px);margin-top:clamp(28px,3.6vw,52px);align-items:stretch}
.standards-row .tile-photo{aspect-ratio:4 / 5}
.standards-col{display:flex;flex-direction:column;gap:14px;padding:22px 0 0;border-top:4px solid var(--basement)}
.standards-col h3{font:400 clamp(24px,2vw,30px)/1.04 var(--shout);text-transform:uppercase}

/* ---------- 6 · the shelf ---------- */
.shelf-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(28px,3vw,44px) clamp(14px,1.7vw,24px)}
.shelf-piece h3{margin-top:14px}
.shelf-piece .tag-price{margin-top:2px}
.shelf-piece .tag-note{margin-top:2px}

/* ---------- 7 · ashtray cabinet ---------- */
.cabinet-split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4.6vw,72px);align-items:start}
.cabinet-door{position:sticky;top:96px}
.cabinet-lede{margin-top:14px;font-size:16px}
.cabinet-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-top:20px}
.cabinet-pair .tile-photo{aspect-ratio:5 / 4.4}
.cabinet-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:10px}
.cabinet-thumbs .shelf-niche{aspect-ratio:1 / 1}
.cabinet-thumbs small{display:block;margin-top:6px;font-size:12.5px;line-height:1.3;color:var(--tx-soft)}
.price-ladder{border-bottom:1.5px solid var(--basement)}
.rung{display:grid;grid-template-columns:clamp(120px,11vw,170px) minmax(0,1fr);gap:clamp(14px,2vw,28px);padding:22px 0 24px;border-top:1.5px solid var(--basement)}
.rung-price{font:400 clamp(30px,2.7vw,42px)/1 var(--shout);font-variant-numeric:tabular-nums;white-space:nowrap}
.rung h3{font-size:19px;margin-bottom:6px}
.rung p{max-width:72ch}
.rung-spec{margin-top:8px;font-size:14px;color:var(--tx-soft)}

/* ---------- 8 · scent room ---------- */
.scent-card{--pad:clamp(18px,5vw,76px);padding:clamp(44px,6vw,92px) var(--pad);border-radius:var(--corner);background-color:var(--basement);color:var(--cream);text-align:center}
.scent-over{font-weight:700;font-size:clamp(16px,1.4vw,20px);color:var(--mint)}
.scent-shout{font:400 clamp(58px,11.4vw,212px)/.9 var(--shout);color:var(--mint);margin-top:6px}
.scent-line{max-width:38em;margin:18px auto 30px;font-size:clamp(16px,1.4vw,20px)}
.scent-card .handrail{margin-inline:calc(-1 * var(--pad))}
.scent-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,1.7vw,24px);margin-top:clamp(40px,4.6vw,68px);text-align:left}
.scent-four li{padding-top:14px;border-top:1.5px solid var(--mint);font-size:clamp(16px,1.35vw,19px);line-height:1.4}
.scent-four strong{color:var(--mint)}
.scent-triptych{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,1.7vw,24px);margin-top:clamp(28px,3.4vw,48px);text-align:left;align-items:stretch}
.scent-triptych .tile-photo{aspect-ratio:4 / 5}
.tile-cutout img{object-fit:contain}
.scent-card-text{display:flex;flex-direction:column;justify-content:center;gap:12px;padding:clamp(20px,2.2vw,32px);border:1.5px solid var(--mint);border-radius:var(--corner);background-color:var(--basement)}
.scent-card-text h3{display:flex;justify-content:space-between;align-items:baseline;gap:14px;font-size:20px}
.scent-card-text h3:not(:first-child){margin-top:14px;padding-top:22px;border-top:1.5px solid var(--mint)}
.scent-price{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--mint)}
.scent-notes{font-size:14px;color:var(--sobre-escuro-soft)}

/* ---------- 9 · gloop room ---------- */
.gloop-top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,3.6vw,56px);align-items:center}
.gloop-macro{border-radius:var(--corner);overflow:hidden;background-color:var(--shelf);aspect-ratio:1272 / 989}
.gloop-macro img{width:100%;height:100%;object-fit:cover}
.gloop-words h2{margin-bottom:18px}
.gloop-words p{font-size:17px;line-height:1.55}
.gloop-words p + p{margin-top:12px}
.gloop-spec{margin-top:18px;padding-top:14px;border-top:1.5px solid var(--basement);font-weight:700;font-size:15px}
.gloop-words .gloop-spec{font-size:15px;line-height:1.6}
.gloop-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(28px,3vw,40px) clamp(14px,1.7vw,24px);margin-top:clamp(40px,4.6vw,68px)}
.gloop-four .shelf-niche{aspect-ratio:1 / 1}
.gloop-four .shelf-niche img{object-fit:contain}
.gloop-four h3{margin-top:14px}
.gloop-four .tag-note{margin-top:4px}
.gloop-floor{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,3.6vw,56px);margin-top:clamp(40px,4.6vw,68px);align-items:center}
.gloop-floor .tile-photo{aspect-ratio:1 / 1}
.rug-plan h3{font:400 clamp(26px,2.4vw,38px)/1.02 var(--shout);text-transform:uppercase;margin-bottom:12px}
.rug-plan > p{font-size:17px;max-width:64ch}
.rug-sizes{width:100%;margin-top:18px;border-collapse:collapse;font-variant-numeric:tabular-nums}
.rug-sizes caption{caption-side:bottom;padding-top:12px;text-align:left;font-size:14px;color:var(--tx-soft)}
.rug-sizes th,.rug-sizes td{padding:13px 0;text-align:left;border-bottom:1px solid var(--line)}
.rug-sizes thead th{font-size:14px;border-bottom:1.5px solid var(--basement)}
.rug-sizes tbody th{font:400 clamp(20px,1.8vw,26px)/1 var(--shout);white-space:nowrap;padding-right:16px}
.rug-sizes td:last-child,.rug-sizes th:last-child{text-align:right;white-space:nowrap;font-weight:700}

/* ---------- 10 · living room ---------- */
.living-set{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:clamp(24px,3.6vw,56px);align-items:start}
.living-wide{position:sticky;top:96px;max-width:1184px;border-radius:var(--corner);overflow:hidden;background-color:var(--shelf);aspect-ratio:1184 / 726}
.living-wide img{width:100%;height:100%;object-fit:cover}
.living-list h2{margin-bottom:18px}
.living-pieces > div{padding:14px 0 16px;border-top:1.5px solid var(--basement)}
.living-pieces dt{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-weight:700;font-size:17px;letter-spacing:-.01em}
.living-pieces dt span{font-variant-numeric:tabular-nums;white-space:nowrap}
.living-pieces dd{margin-top:4px;font-size:15px;color:var(--tx-soft)}
.living-aside{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,3.6vw,56px);margin-top:clamp(36px,4.4vw,64px);align-items:center}
.living-aside .tile-photo{aspect-ratio:5 / 4.6;max-width:620px}
.living-quote{font:400 clamp(23px,2.7vw,44px)/1.18 var(--letter);letter-spacing:-.015em}
.living-quote-small{margin-top:20px;font:400 16px/1.5 var(--talk);letter-spacing:0;color:var(--tx-soft);max-width:68ch}

/* ---------- 11 · dining table ---------- */
.dining-shout{font:400 clamp(40px,6.5vw,118px)/.94 var(--shout)}
.dining-set{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,3.6vw,56px);margin-top:clamp(28px,3.4vw,48px);align-items:start}
.dining-card{padding:clamp(20px,3vw,44px);border-radius:var(--corner);background-color:var(--shelf)}
.dining-intro{font-size:17px;line-height:1.55}
.dining-menu li{margin-top:22px}
.menu-line{display:flex;align-items:baseline;gap:10px}
.menu-line h3{font-size:18px}
.menu-line i{flex:1 1 20px;min-width:20px;border-bottom:2px dotted var(--basement);transform:translateY(-4px)}
.menu-line span{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.dining-menu p{margin-top:4px;font-size:15px;color:var(--tx-soft);max-width:64ch}
.dining-photos{position:sticky;top:96px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(12px,1.4vw,20px);align-items:start}
.dining-photos .tile-photo{aspect-ratio:4 / 5}
.dining-b{margin-top:clamp(40px,7vw,110px)}

/* ---------- 12 · by the door ---------- */
.door-hooks{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,3fr) minmax(0,.85fr);gap:clamp(16px,1.7vw,24px);align-items:stretch}
.hooks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(16px,1.7vw,24px);align-content:start}
.hooks li{padding:14px 0 26px;border-top:4px solid var(--basement)}
.hooks .tag-price{margin:2px 0 8px;font-weight:700}
.hooks p:not(.tag-price){font-size:15px;color:var(--tx-soft)}
.hooks-photo,.hooks-lighter{min-height:260px}

/* ---------- 13 · junk drawer ---------- */
.drawer-top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,3.6vw,56px);align-items:stretch}
.drawer-papers h2{font-size:clamp(34px,4.4vw,76px);line-height:.95}
.paper-prices{width:100%;margin-top:22px;border-collapse:collapse;font-variant-numeric:tabular-nums}
.paper-prices caption{caption-side:top;padding-bottom:12px;text-align:left;font-size:16px;color:var(--tx-soft)}
.paper-prices th,.paper-prices td{padding:14px 6px 14px 0;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}
.paper-prices thead th{font-size:14px;border-bottom:1.5px solid var(--basement)}
.paper-prices th:first-child{text-align:left;white-space:normal}
.paper-prices tbody th{font-size:17px}
.drawer-ocb{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:clamp(20px,2.6vw,38px);border-radius:var(--corner);background-color:var(--shelf)}
.drawer-ocb h3{font:400 clamp(26px,2.3vw,36px)/1.02 var(--shout);text-transform:uppercase}
.drawer-sub{padding-top:14px;border-top:1.5px solid var(--basement);font-size:15px}
.drawer-finds{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,2.6vw,36px) clamp(24px,3.6vw,56px);margin-top:clamp(36px,4.4vw,64px)}
.drawer-finds li{display:grid;grid-template-columns:clamp(104px,13vw,200px) minmax(0,1fr);gap:clamp(14px,1.7vw,24px);align-items:center}
.drawer-finds .shelf-niche{aspect-ratio:1 / 1}
.drawer-finds .tag-price{margin:2px 0 8px;font-weight:700;white-space:normal}
.drawer-finds p:not(.tag-price){font-size:15px;color:var(--tx-soft)}

/* ---------- 14 · guest book ---------- */
.guests{border-bottom:1.5px solid var(--basement)}
.guest{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(12px,4vw,64px);padding:clamp(18px,2vw,28px) 0;border-top:1.5px solid var(--basement);align-items:start}
.guest h3{font:400 clamp(28px,3.5vw,58px)/.98 var(--shout);text-transform:uppercase;letter-spacing:.005em}
.guest h3 a{text-decoration:none}
.guest p{font-size:17px;line-height:1.55;max-width:74ch}
@media (hover:hover) and (pointer:fine){
  .guest h3 a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px}
}

/* ---------- 15 · mailbox ---------- */
.route{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:34px}
.route li{position:relative;padding:36px clamp(16px,3vw,48px) 0 0;border-top:3px solid var(--basement)}
.route li::after{content:"";position:absolute;left:0;right:0;top:4px;border-top:1px solid var(--basement)}
.route-stop{position:absolute;left:0;top:-21px;z-index:1;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background-color:var(--basement);color:var(--cream);font:400 18px/1 var(--shout)}
.route p{font-size:clamp(18px,1.6vw,23px);line-height:1.35;letter-spacing:-.01em}
.route-notes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3.6vw,56px);margin-top:clamp(32px,4vw,56px)}
.route-notes > div{padding:clamp(18px,2.2vw,30px);border-radius:var(--corner);background-color:var(--shelf)}
.route-notes h3{margin-bottom:6px}

/* ---------- 16 · house rules ---------- */
.rules{column-count:2;column-gap:clamp(28px,4.6vw,72px)}
.rule-group{break-inside:avoid;margin-bottom:36px}
.rule-group h3{font:400 clamp(24px,2vw,30px)/1.04 var(--shout);text-transform:uppercase;margin-bottom:10px}
.rule-group details{border-top:1.5px solid var(--basement)}
.rule-group details:last-child{border-bottom:1.5px solid var(--basement)}
.rule-group summary{position:relative;display:flex;align-items:center;min-height:54px;padding:12px 40px 12px 0;font-weight:700;font-size:17px;letter-spacing:-.01em;cursor:pointer;list-style:none}
.rule-group summary::-webkit-details-marker{display:none}
.rule-group summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-52%);font:400 28px/1 var(--shout);transition:transform .2s var(--ease-out)}
.rule-group details[open] summary::after{transform:translateY(-52%) rotate(45deg)}
.rule-group details p{padding:0 40px 14px 0;color:var(--tx-soft);max-width:68ch}

/* ---------- 17 · basement stairs ---------- */
.basement-stairs{margin-top:calc(var(--room-gap) / 2);padding-block:var(--room-gap) calc(var(--room-gap) * .8);background-color:var(--basement);color:var(--cream)}
.stairs-head{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(24px,4vw,64px);align-items:end}
.stairs-head h2{font-size:clamp(52px,7.6vw,136px);line-height:.9}
.stairs-talk p{font-size:clamp(16px,1.35vw,19px);line-height:1.55}
.stairs-talk p + p{margin-top:12px}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(40px,5vw,76px);align-items:start}
.step{position:relative;margin-top:calc(var(--i) * clamp(34px,4.4vw,64px));padding:20px clamp(14px,2vw,30px) 0 clamp(14px,1.6vw,24px);border-top:3px solid var(--cream)}
.step::after{content:"";position:absolute;left:0;right:0;top:4px;border-top:1px solid var(--cream)}
.step + .step::before{content:"";position:absolute;left:0;top:calc(-3px - clamp(34px,4.4vw,64px));height:calc(3px + clamp(34px,4.4vw,64px));border-left:3px solid var(--cream)}
.step-no{font-weight:700;font-size:15px;color:var(--butter)}
.step h3{font:400 clamp(30px,3.2vw,50px)/1 var(--shout);text-transform:uppercase;margin:4px 0 10px}
.step p:last-child{color:var(--sobre-escuro-soft);max-width:30ch}

/* ---------- 18 · basement ---------- */
.basement{padding-block:calc(var(--room-gap) * .6) 0;background-color:var(--basement);color:var(--cream)}
.basement-floor{--pad:0px;text-align:center}
.basement-shout{font:400 clamp(60px,12.4vw,232px)/.88 var(--shout)}
.basement-line{max-width:40em;margin:20px auto 30px;font-size:clamp(16px,1.4vw,20px)}
.basement-floor .handrail{margin-inline:calc(-1 * var(--gut))}
.basement-floor .knob{max-width:calc(100% - 48px)}
.basement-or{margin-top:20px}
.basement-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.6vw,40px);margin-top:clamp(44px,5.4vw,84px)}
.basement-notes li{padding-top:16px;border-top:1.5px solid var(--cream)}
.basement-notes h3{margin-bottom:6px}
.basement-notes p{font-size:15px;color:var(--sobre-escuro-soft)}
.basement-wordmark{margin-top:clamp(36px,5vw,72px);height:17.4vw;overflow:hidden;text-align:center;white-space:nowrap;user-select:none;pointer-events:none}
.basement-wordmark::before{content:"HOUSEPLANT";display:block;font:400 23.6vw/.82 var(--shout);letter-spacing:-.01em;color:#3d2828}

/* ---------- movimento: tudo que esconde vive sob .com-js ---------- */
.settle{transition:opacity .7s var(--ease-out),transform .9s var(--ease-out),clip-path 1s var(--ease-out);transition-delay:calc(var(--i,0) * 70ms)}
.com-js .settle:not(.in){opacity:0}
.com-js .settle-rise:not(.in){transform:translateY(22px)}
.com-js .settle-door:not(.in){transform:translateX(26px)}
.com-js .settle-slide:not(.in){transform:translateX(-18px)}
.com-js .settle-pop:not(.in){transform:scale(.94)}
.com-js .settle-drop:not(.in){transform:translateY(-16px)}
.com-js .settle-step:not(.in){transform:translate(-14px,-24px)}
.com-js .settle.settle-wipe:not(.in){opacity:1;clip-path:inset(0 100% 0 0)}
.com-js .settle.settle-rule:not(.in){opacity:1;transform:scaleX(0)}
.settle-step{transition-delay:calc(var(--i,0) * 130ms)}
.com-js .door-words > *{animation:door-in .9s var(--ease-out) both}
.com-js .door-words > :nth-child(2){animation-delay:.08s}
.com-js .door-words > :nth-child(3){animation-delay:.16s}
.com-js .door-words > :nth-child(4){animation-delay:.24s}
@keyframes door-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){
  .settle{transition:opacity .3s ease;transition-delay:0s}
  .com-js .settle:not(.in),.com-js .settle.settle-wipe:not(.in),.com-js .settle.settle-rule:not(.in){opacity:0;transform:none;clip-path:none}
  .com-js .door-words > *{animation:none}
  .stairwell-ember,.door-frame img,.shelf-niche img,.knob,.chat{transition:none}
}

/* ---------- telas menores ---------- */
@media (max-width:1100px){
  .standards-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .standards-row .tile-photo{aspect-ratio:5 / 4}
  .door-hooks{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .hooks{grid-column:1 / -1;grid-row:2}
  .hooks-photo,.hooks-lighter{aspect-ratio:5 / 4;min-height:0}
  .cabinet-split{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  .rung{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  html{scroll-padding-top:120px}
  .room-plate{grid-template-columns:minmax(0,1fr);row-gap:10px}
  .room-plate .plate-lede{grid-column:1;grid-row:auto}
  .door-card{min-height:640px}
  .door-words .handrail{flex-direction:column;margin-inline:0}
  .door-words .handrail::before,.door-words .handrail::after{display:none}
  .door-words .knob{width:100%}
  .sofa-card{grid-template-columns:minmax(0,1fr)}
  .sofa-photo{order:-1;aspect-ratio:1662 / 1100;min-height:0}
  .sofa-letter{align-items:center;text-align:center;padding-block:36px 40px}
  .sofa-letter .handrail{align-self:stretch}
  .handrail-left::before{flex:1 1 0}
  .studio-pan{aspect-ratio:4 / 3}
  .studio-bench,.cabinet-split,.gloop-top,.gloop-floor,.living-set,.living-aside,.dining-set,.drawer-top,.guest,.stairs-head,.route-notes{grid-template-columns:minmax(0,1fr)}
  .studio-note,.cabinet-door,.living-wide,.dining-photos{position:static}
  .shelf-grid,.gloop-four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cabinet-thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scent-four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scent-triptych{grid-template-columns:minmax(0,1fr)}
  .scent-triptych .tile-photo{aspect-ratio:5 / 4}
  .hooks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .drawer-finds{grid-template-columns:minmax(0,1fr)}
  .route{grid-template-columns:minmax(0,1fr);row-gap:44px}
  .rules{column-count:1}
  .steps{grid-template-columns:minmax(0,1fr)}
  .step{margin-top:0;margin-left:calc(var(--i) * 22px);padding:16px 0 26px 14px;border-left:3px solid var(--cream)}
  .step + .step::before{display:none}
  .basement-notes{grid-template-columns:minmax(0,1fr)}
  .basement-wordmark{height:17vw}
  .dining-b{margin-top:40px}
  .living-aside .tile-photo{max-width:none}
}
@media (max-width:560px){
  .standards-row{grid-template-columns:minmax(0,1fr)}
  .hooks{grid-template-columns:minmax(0,1fr)}
  .door-hooks{grid-template-columns:minmax(0,1fr)}
  .hooks{grid-row:auto}
  .paper-prices th,.paper-prices td{font-size:14px;padding-right:4px}
  .paper-prices tbody th{font-size:15px}
  .menu-line{flex-wrap:wrap}
  .menu-line i{display:none}
  .menu-line h3{flex:1 1 60%}
  .knob{font-size:15px}
}

/* Rodada 2b (Sensei): corpo da landing >= 16 px em 1440 e >= 15 px em 390. So CSS. */
@media (min-width:900px){#by-the-door p,#dining-table p,#junk-drawer p,#living-room dd,#ashtray-cabinet p.rung-spec,#gloop-room p.tag-note,#gloop-room p.gloop-spec,#basement p,#the-shelf p.tag-note,#scent-room p.scent-notes{font-size:16px}}
@media (max-width:899px){#ashtray-cabinet p.rung-spec,#gloop-room p.tag-note,#the-shelf p.tag-note,#scent-room p.scent-notes{font-size:15px}}
/* Rodada 2: a caixa da palavra gigante do rodape ganha fundo proprio (o medidor de vazios nao enxerga pseudo-elemento nem texto transparente); FAQ: o 3o grupo abre a 2a coluna para equilibrar. So CSS. */
.basement-wordmark{background-color:var(--basement);width:min(100%,88vw);margin-inline:auto}
@media (min-width:900px){.rule-group:nth-child(3){break-before:column}}