/* Builders — Hovarns website studio. Sakura sumi-e world.
   Every rule is scoped under [data-site="builders"] so this sheet can coexist
   with the Monarch sheet during an in-place world change. */

@font-face{font-family:"Builders Fraunces";src:url(/builders/assets/fonts/fraunces-latin.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Builders Fraunces";src:url(/builders/assets/fonts/fraunces-italic-latin.woff2) format("woff2");font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:"Builders Inter";src:url(/builders/assets/fonts/inter-latin.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"Builders Roboto";src:url(/builders/assets/fonts/roboto-500-gsi.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Builders Mincho";src:url(/builders/assets/fonts/noto-serif-jp-subset.woff2?v=8) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}

[data-site="builders"]{
  --b-washi:#FBF6EC;
  --b-washi-2:#F4ECDD;
  --b-mark-cream:#FFFDF7;
  --b-mark-line:#E8E2D3;
  --b-mark-orange:#F26A1B;
  --b-ink:#1E1A17;
  --b-ink-2:#4B413A;
  --b-ink-3:#6B5E55;
  --b-line:rgba(30,26,23,.16);
  --b-sakura:#F6C9D4;
  --b-sakura-2:#EFA9BB;
  --b-sakura-field:#F7E0E5;
  --b-hero-pink:#F5DCE2;
  --b-paper:#FFFDF8;
  --b-beni:#A3284F;
  --b-beni-deep:#7E1A3B;
  --b-shu:#B8321E;
  --b-on-ink:#F6EFE4;
  --b-on-ink-2:#D8CCBF;
  --b-serif:"Builders Fraunces",Georgia,"Times New Roman",serif;
  --b-sans:"Builders Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --b-jp:"Builders Mincho","Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --b-gut:clamp(16px,4.5vw,64px);
  --b-max:1240px;
  --b-ease:cubic-bezier(.16,1,.3,1);
  --b-washi-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .12 0 0 0 0 .09 0 0 0 0 .07 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --b-washi-fibre:url(/builders/assets/washi-fibre.svg);
}

html[data-site="builders"]{color-scheme:light;scroll-padding-top:72px;-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--b-washi)}
[data-site="builders"] *,[data-site="builders"] *::before,[data-site="builders"] *::after{box-sizing:border-box}
html[data-site="builders"] body{
  margin:0;min-height:100vh;color:var(--b-ink);
  background-color:var(--b-washi);
  background-image:var(--b-washi-fibre),var(--b-washi-grain);
  font:400 1rem/1.65 var(--b-sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;
}
[data-site="builders"] ::selection{background:var(--b-sakura);color:var(--b-ink)}
html.lenis[data-site="builders"],html.lenis[data-site="builders"] body{height:auto}
[data-site="builders"].lenis-stopped{overflow:hidden}
html[data-site="builders"]{accent-color:var(--b-beni);caret-color:var(--b-beni);scrollbar-color:var(--b-ink-3) var(--b-washi-2)}
[data-site="builders"] :focus-visible{outline:2px solid var(--b-beni);outline-offset:3px;border-radius:2px}
[data-site="builders"] img,[data-site="builders"] svg{display:block;max-width:100%}
[data-site="builders"] a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em}
[data-site="builders"] h1,[data-site="builders"] h2,[data-site="builders"] h3,[data-site="builders"] p{margin:0}
[data-site="builders"] .b-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
[data-site="builders"] .b-skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--b-ink);color:var(--b-on-ink);padding:10px 14px;border-radius:4px;font-weight:600;text-decoration:none}
[data-site="builders"] .b-skip:focus{top:10px}
[data-site="builders"] [lang="ja"]{font-family:var(--b-jp)}

/* ---------- Mark (exact 築 logo: #F26A1B on #FFFDF7, rx 12/64, serif 600) ---------- */
[data-site="builders"] .b-mark{
  --s:36px;
  inline-size:var(--s);block-size:var(--s);flex:none;display:grid;place-items:center;
  background:var(--b-mark-cream);border:calc(var(--s)*2/64) solid var(--b-mark-line);border-radius:calc(var(--s)*12/64);
  color:var(--b-mark-orange);font:600 calc(var(--s)*52/64)/1 var(--b-jp);
  padding-top:calc(var(--s)*.02);
  view-transition-name:site-mark;
}
[data-site="builders"] .b-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--b-ink)}
[data-site="builders"] .b-wordmark{font:500 1.28rem/1 var(--b-serif);letter-spacing:.005em;font-variation-settings:"opsz" 30}

/* ---------- Top bar (tight side padding, owner request) ---------- */
[data-site="builders"] #site-bar{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;gap:8px;
  padding:10px 12px;min-height:58px;
  background:rgba(251,246,236,.9);
  -webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--b-line);
}
[data-site="builders"] .b-nav{margin-left:auto;display:flex;align-items:center;gap:6px}
[data-site="builders"] .b-nav__list{display:none;list-style:none;margin:0;padding:0;align-items:center;gap:2px}
[data-site="builders"] .b-nav__list a{display:inline-flex;align-items:center;min-height:40px;padding:0 11px;border-radius:999px;text-decoration:none;font-size:.94rem;color:var(--b-ink-2);transition:background-color .2s,color .2s}
[data-site="builders"] .b-nav__list a:hover{background:rgba(163,40,79,.08);color:var(--b-ink)}
[data-site="builders"] .b-nav__list a[aria-current="page"]{color:var(--b-ink)}
[data-site="builders"] .b-nav__sep{inline-size:1px;block-size:18px;background:var(--b-line);margin:0 6px}
[data-site="builders"] .b-nav__world{gap:7px}
[data-site="builders"] .b-nav__world svg{inline-size:14px;block-size:14px}

[data-site="builders"] .b-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  min-height:46px;padding:0 1.25em;border-radius:999px;
  font:600 .98rem/1 var(--b-sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;
  border:1.5px solid var(--b-ink);
  transition:background-color .25s var(--b-ease),color .25s var(--b-ease),transform .25s var(--b-ease),box-shadow .25s var(--b-ease);
}
[data-site="builders"] .b-btn--ink{background:var(--b-ink);color:var(--b-on-ink)}
[data-site="builders"] .b-btn--ink:hover{background:var(--b-beni-deep);border-color:var(--b-beni-deep);box-shadow:0 8px 22px -10px rgba(126,26,59,.6);transform:translateY(-1px)}
[data-site="builders"] .b-btn--line{background:transparent;color:var(--b-ink)}
[data-site="builders"] .b-btn--line:hover{background:rgba(246,201,212,.45)}
[data-site="builders"] .b-btn--sm{min-height:40px;padding:0 1em;font-size:.9rem}
[data-site="builders"] .b-btn svg{inline-size:16px;block-size:16px;flex:none}

/* mobile menu */
[data-site="builders"] .b-menu{position:relative}
[data-site="builders"] .b-menu>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border-radius:999px;border:1.5px solid var(--b-line);font:500 .9rem/1 var(--b-sans);cursor:pointer;color:var(--b-ink)}
[data-site="builders"] .b-menu>summary::-webkit-details-marker{display:none}
[data-site="builders"] .b-menu>summary svg{inline-size:16px;block-size:16px}
[data-site="builders"] .b-menu[open]>summary{background:var(--b-ink);color:var(--b-on-ink);border-color:var(--b-ink)}
[data-site="builders"] .b-menu__panel{
  position:absolute;right:-4px;top:calc(100% + 10px);min-width:228px;
  background:var(--b-washi);background-image:var(--b-washi-grain);
  border:1px solid var(--b-line);border-radius:10px;padding:8px;
  box-shadow:0 18px 40px -18px rgba(30,26,23,.45);
}
[data-site="builders"] .b-menu__panel ul{list-style:none;margin:0;padding:0}
[data-site="builders"] .b-menu__panel a{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:0 12px;border-radius:6px;text-decoration:none;color:var(--b-ink)}
[data-site="builders"] .b-menu__panel a:hover{background:rgba(246,201,212,.5)}
[data-site="builders"] .b-menu__panel hr{border:0;border-top:1px solid var(--b-line);margin:6px 4px}
[data-site="builders"] .b-menu__panel small{color:var(--b-ink-3);font-size:.8rem}

@media (min-width:1060px){
  [data-site="builders"] #site-bar{padding:10px 20px}
  [data-site="builders"] .b-nav__list{display:flex}
  [data-site="builders"] .b-menu{display:none}
}

/* ---------- Layout ---------- */
[data-site="builders"] .b-wrap{inline-size:100%;max-inline-size:var(--b-max);margin-inline:auto;padding-inline:var(--b-gut)}
[data-site="builders"] .b-section{padding-block:clamp(64px,9.5vw,128px)}
[data-site="builders"] .b-h2{font:400 clamp(1.9rem,4.6vw,3.5rem)/1.06 var(--b-serif);letter-spacing:-.018em;font-variation-settings:"opsz" 120;text-wrap:balance;max-inline-size:18ch}
[data-site="builders"] .b-h2 em,[data-site="builders"] .b-h1 em{font-style:italic;font-weight:350;color:var(--b-beni)}
[data-site="builders"] .b-lede{font-size:clamp(1.03rem,1.4vw,1.18rem);line-height:1.6;color:var(--b-ink-2);max-inline-size:58ch;text-wrap:pretty}

/* ---------- Hero: a signed sumi-e painting ---------- */
[data-site="builders"] .b-hero{--b-petal-fill:#FFF3F6;position:relative;isolation:isolate;overflow:hidden;background-color:var(--b-hero-pink);background-image:var(--b-washi-fibre),var(--b-washi-grain);min-height:calc(100svh - 58px);display:flex;flex-direction:column;justify-content:flex-end;padding-block:0 clamp(36px,7vh,88px)}
[data-site="builders"] .b-hero__art{position:absolute;z-index:-1;inset:0 0 auto auto;inline-size:min(118vw,980px);block-size:auto;aspect-ratio:900/760;pointer-events:none;transform:translate(16%,-6%)}
[data-site="builders"] .b-hero__art svg{inline-size:100%;block-size:100%;overflow:visible}
[data-site="builders"] .b-hero__copy{position:relative;padding-top:clamp(290px,60vw,340px)}
[data-site="builders"] .b-hero__copy .b-lede{padding-right:clamp(0px,9vw,40px)}
[data-site="builders"] .b-h1{
  font:380 clamp(2.2rem,6.3vw,4.75rem)/1.04 var(--b-serif);letter-spacing:-.014em;
  font-variation-settings:"opsz" 144,"SOFT" 30;text-wrap:balance;max-inline-size:12.5ch;
  view-transition-name:site-title;
}
[data-site="builders"] .b-hero .b-lede{margin-top:clamp(18px,2.4vw,28px);max-inline-size:44ch}
[data-site="builders"] .b-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(22px,3vw,34px)}

/* inscription column + seal, the painter's signature */
[data-site="builders"] .b-inscription{position:absolute;right:max(10px,calc(var(--b-gut) - 6px));top:236px;display:flex;flex-direction:column;align-items:center;gap:14px}
[data-site="builders"] .b-tate{writing-mode:vertical-rl;white-space:nowrap;text-orientation:upright;font:400 clamp(.98rem,1.6vw,1.5rem)/1.4 var(--b-jp);letter-spacing:.26em;color:var(--b-ink);margin:0}
[data-site="builders"] .b-seal{inline-size:clamp(38px,4.2vw,56px);block-size:auto;aspect-ratio:1}
[data-site="builders"] .b-seal svg{inline-size:100%;block-size:100%}

/* The finished painting is the default state; GSAP (ctx.gsap) paints it in on init. */
[data-site="builders"] .b-bloom{transform-box:fill-box;transform-origin:center}

@media (min-width:720px){
  [data-site="builders"] .b-hero__copy{padding-top:clamp(300px,40vw,380px)}
  [data-site="builders"] .b-hero .b-inscription{top:clamp(260px,34vw,330px)}
}
@media (min-width:1000px){
  [data-site="builders"] .b-hero{justify-content:center;padding-block:clamp(48px,8vh,96px)}
  [data-site="builders"] .b-hero__art{inline-size:min(62vw,1060px);transform:translate(4%,-2%)}
  [data-site="builders"] .b-hero__copy{padding-top:clamp(40px,10vh,120px)}
  [data-site="builders"] .b-inscription{right:clamp(28px,4vw,72px);top:auto;bottom:clamp(40px,9vh,110px)}
}

/* falling petals (built by JS; decorative) */
[data-site="builders"] .b-petals{position:fixed;inset:0;z-index:30;pointer-events:none;overflow:hidden}
[data-site="builders"] .b-petal{position:absolute;top:-24px;left:0;inline-size:var(--w,12px);block-size:calc(var(--w,12px)*.78);border-radius:100% 0 100% 12%;background:linear-gradient(135deg,#FBE3EA 0%,var(--b-sakura) 55%,var(--b-sakura-2) 100%);opacity:.85;will-change:transform}

/* ---------- What we make: sakura field, two hanging scrolls ---------- */
[data-site="builders"] .b-make{position:relative}
[data-site="builders"] .b-make__head{display:grid;gap:18px;margin-bottom:clamp(40px,6vw,72px)}

[data-site="builders"] .b-scrolls{display:grid;gap:28px}
[data-site="builders"] .b-scroll{position:relative;padding:0 10px}
[data-site="builders"] .b-scroll__rod{display:block;block-size:10px;border-radius:5px;background:linear-gradient(#3A2F29,#1E1A17);margin-inline:-10px;box-shadow:0 3px 6px -3px rgba(30,26,23,.5)}
[data-site="builders"] .b-scroll__rod--bottom{block-size:12px}
[data-site="builders"] .b-scroll__paper{
  background:var(--b-paper);background-image:var(--b-washi-fibre),var(--b-washi-grain);
  border-inline:1px solid rgba(30,26,23,.08);
  padding:clamp(28px,4vw,48px) clamp(22px,3.4vw,44px) clamp(32px,4.4vw,52px);
  display:grid;grid-template-columns:auto 1fr;gap:6px clamp(18px,2.6vw,32px);align-items:start;
  box-shadow:0 26px 44px -30px rgba(30,26,23,.45),0 2px 6px -3px rgba(30,26,23,.18);
}
[data-site="builders"] .b-scroll__kanji{grid-row:span 2;writing-mode:vertical-rl;font:600 clamp(3.2rem,7vw,5rem)/1 var(--b-jp);color:var(--b-beni);margin:0}
[data-site="builders"] .b-scroll h3{font:450 clamp(1.45rem,2.5vw,1.95rem)/1.12 var(--b-serif);letter-spacing:-.012em;font-variation-settings:"opsz" 72;margin-top:6px}
[data-site="builders"] .b-scroll p{color:var(--b-ink-2);max-inline-size:40ch;margin-top:12px}
[data-site="builders"] .b-scroll__gloss{display:block;font:italic 400 .95rem/1.4 var(--b-serif);color:var(--b-beni);margin-top:16px}
@media (max-width:559px){
  [data-site="builders"] .b-scroll__paper{grid-template-columns:1fr}
  [data-site="builders"] .b-scroll__kanji{grid-row:auto;writing-mode:horizontal-tb;font-size:3.2rem}
}
@media (min-width:820px){
  [data-site="builders"] .b-make__head{grid-template-columns:1.1fr 1fr;align-items:end}
  [data-site="builders"] .b-scrolls{grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:start}
  [data-site="builders"] .b-scroll:nth-child(2){margin-top:clamp(56px,8vw,120px)}
}

/* ---------- Philosophy: sumi ink band ---------- */
[data-site="builders"] .b-ink{background:var(--b-ink);color:var(--b-on-ink);position:relative;overflow:hidden;isolation:isolate}
[data-site="builders"] .b-ink::before{content:"";position:absolute;inset:0;z-index:-1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .95 0 0 0 0 .9 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
[data-site="builders"] .b-ink__sprig{position:absolute;z-index:-1;right:-70px;top:0;inline-size:min(48vw,520px);opacity:.95;pointer-events:none}
[data-site="builders"] .b-quote{margin:0}
[data-site="builders"] .b-quote p{max-inline-size:12.5em}
@media (max-width:700px){[data-site="builders"] .b-ink .b-wrap{padding-top:56px}[data-site="builders"] .b-ink__sprig{top:-30px;right:-90px}}
[data-site="builders"] .b-quote p{font:italic 330 clamp(1.95rem,5.3vw,4rem)/1.08 var(--b-serif);letter-spacing:-.02em;font-variation-settings:"opsz" 144;text-wrap:balance}
[data-site="builders"] .b-quote strong{font-weight:600;font-style:normal;color:var(--b-sakura)}
[data-site="builders"] .b-quote footer{margin-top:22px;font-size:.95rem;color:var(--b-on-ink-2)}
[data-site="builders"] .b-tenets{list-style:none;margin:clamp(56px,8vw,104px) 0 0;padding:0;display:grid;gap:0;border-top:1px solid rgba(246,239,228,.18)}
[data-site="builders"] .b-tenet{display:grid;grid-template-columns:auto 1fr;gap:4px 20px;padding:26px 0;border-bottom:1px solid rgba(246,239,228,.18)}
[data-site="builders"] .b-tenet__k{grid-row:span 2;font:400 clamp(2.3rem,4.4vw,3.2rem)/1 var(--b-jp);color:var(--b-sakura)}
[data-site="builders"] .b-tenet h3{font:450 1.22rem/1.2 var(--b-serif);font-variation-settings:"opsz" 36}
[data-site="builders"] .b-tenet p{color:var(--b-on-ink-2);max-inline-size:36ch}
@media (min-width:880px){
  [data-site="builders"] .b-tenets{grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(246,239,228,.18)}
  [data-site="builders"] .b-tenet{grid-template-columns:1fr;border-bottom:0;padding:34px clamp(18px,2.4vw,36px) 38px}
  [data-site="builders"] .b-tenet+.b-tenet{border-left:1px solid rgba(246,239,228,.18)}
  [data-site="builders"] .b-tenet:first-child{padding-left:0}
  [data-site="builders"] .b-tenet__k{grid-row:auto;margin-bottom:18px}
}

/* ---------- Portal: a shoji door ---------- */
[data-site="builders"] .b-portal__grid{display:grid;gap:clamp(36px,6vw,88px);align-items:center}
[data-site="builders"] .b-portal p.b-lede{margin-top:20px}
[data-site="builders"] .b-portal__facts{list-style:none;margin:26px 0 30px;padding:0;display:grid;gap:10px}
[data-site="builders"] .b-portal__facts li{display:flex;gap:12px;align-items:baseline;color:var(--b-ink-2)}
[data-site="builders"] .b-portal__facts li::before{content:"";flex:none;inline-size:9px;block-size:9px;border-radius:50% 0 50% 0;background:var(--b-beni);transform:translateY(-1px) rotate(-20deg)}
[data-site="builders"] .b-shoji{
  position:relative;aspect-ratio:4/5;max-inline-size:min(300px,100%);inline-size:100%;justify-self:center;
  border:12px solid #3A2F29;border-radius:2px;
  background-color:#FCF8EF;
  background-image:
    repeating-linear-gradient(90deg,transparent 0 calc(25% - 3px),#5A4A3F calc(25% - 3px) 25%),
    repeating-linear-gradient(0deg,transparent 0 calc(16.66% - 3px),#5A4A3F calc(16.66% - 3px) 16.66%),
    var(--b-washi-fibre);
  box-shadow:0 30px 60px -36px rgba(30,26,23,.6);
  display:grid;place-items:center;
}
[data-site="builders"] .b-shoji__sprig{position:absolute;left:-30px;bottom:-26px;inline-size:62%;pointer-events:none}
[data-site="builders"] .b-shoji__plate{
  position:relative;display:grid;justify-items:center;gap:10px;padding:22px 26px 20px;
  background:var(--b-washi);border:1px solid var(--b-line);border-radius:4px;
  box-shadow:0 12px 26px -16px rgba(30,26,23,.5);text-align:center;
}
[data-site="builders"] .b-shoji__plate .b-mark{--s:52px;view-transition-name:none}
[data-site="builders"] .b-shoji__plate span{font:500 1.15rem/1.2 var(--b-serif)}
@media (min-width:860px){[data-site="builders"] .b-portal__grid{grid-template-columns:1.1fr .9fr}[data-site="builders"] .b-shoji{max-inline-size:420px}}

/* ---------- Contact: a letter on the sakura field ---------- */
[data-site="builders"] .b-contact{position:relative;padding-top:clamp(40px,6vw,72px)}
[data-site="builders"] .b-letter{
  position:relative;margin-top:clamp(32px,5vw,56px);
  background:var(--b-paper);background-image:var(--b-washi-fibre),var(--b-washi-grain);
  padding:clamp(26px,4vw,52px);border-radius:3px;
  box-shadow:0 28px 50px -34px rgba(30,26,23,.45),0 2px 6px -3px rgba(30,26,23,.16);border:1px solid rgba(30,26,23,.07);
  display:grid;gap:28px;
}
[data-site="builders"] .b-call{display:grid;gap:6px;align-content:start}
[data-site="builders"] .b-call__label{font:italic 400 1.05rem/1.3 var(--b-serif);color:var(--b-beni)}
[data-site="builders"] .b-call__num{font:400 clamp(1.8rem,3.9vw,2.7rem)/1.05 var(--b-serif);letter-spacing:-.01em;font-variant-numeric:lining-nums tabular-nums;text-decoration:none;color:var(--b-ink);white-space:nowrap}
[data-site="builders"] .b-call__num:hover{color:var(--b-beni-deep)}
[data-site="builders"] .b-call .b-actions{margin-top:14px}
[data-site="builders"] .b-letter__seal{position:absolute;right:clamp(16px,3vw,36px);top:clamp(-22px,-2vw,-16px);inline-size:clamp(48px,6vw,64px)}
[data-site="builders"] .b-parent{color:var(--b-ink-2)}
[data-site="builders"] .b-parent a{font-weight:600;color:var(--b-beni-deep)}
@media (min-width:860px){[data-site="builders"] .b-letter{grid-template-columns:1.1fr 1fr;align-items:start}}


/* ---------- Shared small heading ---------- */
[data-site="builders"] .b-h3{font:450 clamp(1.25rem,2vw,1.55rem)/1.2 var(--b-serif);letter-spacing:-.01em;font-variation-settings:"opsz" 48}
[data-site="builders"] .b-lede--ink{color:var(--b-on-ink-2)}

/* ---------- Included list (under the two scrolls) ---------- */
[data-site="builders"] .b-included{margin-top:clamp(56px,8vw,104px);display:grid;gap:22px}
[data-site="builders"] .b-included__list{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1.5px solid var(--b-ink)}
[data-site="builders"] .b-included__list li{display:grid;gap:4px;padding:16px 0;border-bottom:1px solid var(--b-line)}
[data-site="builders"] .b-included__list strong{font:500 1.08rem/1.3 var(--b-serif)}
[data-site="builders"] .b-included__list span{color:var(--b-ink-2)}
@media (min-width:820px){
  [data-site="builders"] .b-included{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:48px;align-items:start}
  [data-site="builders"] .b-included__list li{grid-template-columns:200px 1fr;gap:24px;align-items:baseline}
}

/* ---------- Process: an ink-drawn hand scroll ---------- */
[data-site="builders"] .b-process__head{display:grid;gap:18px;margin-bottom:clamp(36px,6vw,72px)}
@media (min-width:820px){[data-site="builders"] .b-process__head{grid-template-columns:1.1fr 1fr;align-items:end}}
[data-site="builders"] .b-emaki{position:relative;max-inline-size:860px;margin-inline:auto;padding-left:clamp(64px,10vw,120px)}
[data-site="builders"] .b-emaki__line{position:absolute;left:clamp(14px,3.6vw,44px);top:10px;bottom:10px;inline-size:40px;block-size:calc(100% - 20px);overflow:visible}
[data-site="builders"] .b-steps{list-style:none;margin:0;padding:0;display:grid;gap:clamp(30px,5vw,56px)}
[data-site="builders"] .b-step{position:relative;display:grid;grid-template-columns:auto 1fr;gap:6px clamp(16px,2.6vw,28px);align-items:start}
[data-site="builders"] .b-step::before{content:"";position:absolute;left:calc(clamp(64px,10vw,120px) * -1 + clamp(14px,3.6vw,44px) + 12px);top:.7em;inline-size:16px;block-size:16px;border-radius:50% 46% 52% 48%;background:var(--b-ink);box-shadow:0 0 0 5px var(--b-washi)}
[data-site="builders"] .b-step__k{font:600 clamp(2rem,3.6vw,2.7rem)/1 var(--b-jp);color:var(--b-beni);min-inline-size:1.1em}
[data-site="builders"] .b-step h3{font:450 clamp(1.25rem,2vw,1.5rem)/1.2 var(--b-serif);margin-top:2px}
[data-site="builders"] .b-step p{color:var(--b-ink-2);margin-top:6px;max-inline-size:52ch}

/* ---------- Craft: brush-annotated sheet ---------- */
[data-site="builders"] .b-craft .b-h2{max-inline-size:22ch}
[data-site="builders"] .b-craft__board{position:relative;margin-top:clamp(36px,6vw,64px);display:grid;gap:28px}
[data-site="builders"] .b-sheet{margin:0;justify-self:center;inline-size:min(100%,380px);background:var(--b-paper);border:1px solid rgba(30,26,23,.14);border-radius:10px;box-shadow:0 30px 50px -34px rgba(30,26,23,.5);overflow:hidden}
[data-site="builders"] .b-sheet__bar{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--b-line);background:var(--b-washi-2)}
[data-site="builders"] .b-sheet__bar i{inline-size:9px;block-size:9px;border-radius:50%;background:rgba(30,26,23,.22)}
[data-site="builders"] .b-sheet__body{position:relative;padding:26px 24px 30px;display:grid;gap:10px}
[data-site="builders"] .b-sheet__aa{font:400 3.6rem/1 var(--b-serif);letter-spacing:-.03em}
[data-site="builders"] .b-sheet__line{display:block;block-size:8px;border-radius:4px;background:rgba(30,26,23,.14);inline-size:86%}
[data-site="builders"] .b-sheet__line--l{inline-size:100%;background:rgba(30,26,23,.24)}
[data-site="builders"] .b-sheet__line--s{inline-size:58%}
[data-site="builders"] .b-sheet__curve{position:absolute;right:20px;top:24px;inline-size:110px;block-size:55px}
[data-site="builders"] .b-sheet__btn{justify-self:start;margin-top:8px;padding:9px 18px;border-radius:999px;background:var(--b-ink);color:var(--b-on-ink);font:600 .85rem/1 var(--b-sans);outline:2px solid var(--b-beni);outline-offset:3px}
[data-site="builders"] .b-craft__leaders{display:none}
[data-site="builders"] .b-notes{list-style:none;margin:0;padding:0;display:grid;gap:18px}
[data-site="builders"] .b-note{position:relative;padding-left:22px}
[data-site="builders"] .b-note::before{content:"";position:absolute;left:0;top:.5em;inline-size:10px;block-size:10px;border-radius:50% 0 50% 0;background:var(--b-beni);transform:rotate(-20deg)}
[data-site="builders"] .b-note h3{font:italic 450 1.2rem/1.2 var(--b-serif);color:var(--b-beni-deep)}
[data-site="builders"] .b-note p{color:var(--b-ink-2);margin-top:4px;max-inline-size:34ch}
@media (min-width:900px){
  [data-site="builders"] .b-craft__board{display:block;min-height:560px}
  [data-site="builders"] .b-sheet{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
  [data-site="builders"] .b-craft__leaders{display:block;position:absolute;inset:0;inline-size:100%;block-size:100%;pointer-events:none}
  [data-site="builders"] .b-notes{position:absolute;inset:0;display:block}
  [data-site="builders"] .b-note{position:absolute;inline-size:28%;padding-left:0}
  [data-site="builders"] .b-note::before{display:none}
  [data-site="builders"] .b-note--type{left:0;top:6%}
  [data-site="builders"] .b-note--motion{right:0;top:8%;text-align:right}
  [data-site="builders"] .b-note--bl{left:0;bottom:6%}
  [data-site="builders"] .b-note--br{right:0;bottom:6%;text-align:right}
  [data-site="builders"] .b-note--motion p,[data-site="builders"] .b-note--br p{margin-left:auto}
}

/* ---------- Tools: second ink band ---------- */
[data-site="builders"] .b-tools__grid{display:grid;gap:clamp(32px,5vw,72px)}
[data-site="builders"] .b-tools__k{font:400 clamp(2.4rem,4vw,3.2rem)/1 var(--b-jp);color:var(--b-sakura);letter-spacing:.1em;margin-bottom:18px}
[data-site="builders"] .b-tools .b-lede{margin-top:18px}
[data-site="builders"] .b-tools__list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(246,239,228,.18)}
[data-site="builders"] .b-tools__list li{padding:18px 0;border-bottom:1px solid rgba(246,239,228,.18)}
[data-site="builders"] .b-tools__list h3{font:450 1.15rem/1.3 var(--b-serif);color:var(--b-on-ink)}
[data-site="builders"] .b-tools__list p{color:var(--b-on-ink-2);margin-top:4px}
@media (min-width:880px){[data-site="builders"] .b-tools__grid{grid-template-columns:.9fr 1.1fr;align-items:start}}

/* ---------- FAQ ---------- */
[data-site="builders"] .b-faq__grid{display:grid;gap:clamp(28px,5vw,64px)}
[data-site="builders"] .b-faq__k{font:400 clamp(2.4rem,4vw,3.2rem)/1 var(--b-jp);color:var(--b-beni);margin-bottom:16px}
[data-site="builders"] .b-faq__list{border-top:1.5px solid var(--b-ink)}
[data-site="builders"] .b-faq__item{border-bottom:1px solid var(--b-line)}
[data-site="builders"] .b-faq__item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:60px;padding:16px 0;cursor:pointer;font:450 clamp(1.1rem,1.7vw,1.3rem)/1.3 var(--b-serif)}
[data-site="builders"] .b-faq__item summary::-webkit-details-marker{display:none}
[data-site="builders"] .b-faq__item summary:hover{color:var(--b-beni-deep)}
[data-site="builders"] .b-faq__item summary svg{flex:none;inline-size:22px;block-size:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
[data-site="builders"] .b-faq__v{transition:transform .3s var(--b-ease);transform-origin:center;transform-box:fill-box}
[data-site="builders"] .b-faq__item[open] .b-faq__v{transform:scaleY(0)}
[data-site="builders"] .b-faq__a{padding:0 0 20px}
[data-site="builders"] .b-faq__a p{color:var(--b-ink-2);max-inline-size:62ch}
[data-site="builders"] .b-faq__a a{color:var(--b-beni-deep);font-weight:600}
@media (min-width:880px){[data-site="builders"] .b-faq__grid{grid-template-columns:.8fr 1.2fr;align-items:start}[data-site="builders"] .b-faq__intro{position:sticky;top:96px}}

/* ---------- Footer: giant brushed wordmark ---------- */
[data-site="builders"] #site-foot{background:var(--b-ink);color:var(--b-on-ink-2);font-size:.92rem;position:relative;overflow:hidden}
[data-site="builders"] .b-foot{padding-block:clamp(40px,6vw,72px) 26px;max-inline-size:none}
[data-site="builders"] .b-foot .b-brand{color:var(--b-on-ink)}
[data-site="builders"] .b-foot .b-mark{--s:40px;view-transition-name:none}
[data-site="builders"] .b-foot__tag{font:italic 400 1.05rem/1.2 var(--b-serif);color:var(--b-on-ink-2)}
[data-site="builders"] .b-giant{
  margin:clamp(10px,2vw,24px) calc(var(--b-gut) * -1 + 4px) 0;
  font:600 20.4vw/.8 var(--b-serif);letter-spacing:-.035em;font-variation-settings:"opsz" 144,"SOFT" 0;
  text-transform:uppercase;white-space:nowrap;text-align:center;color:var(--b-on-ink);
  padding-bottom:.06em;
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  [data-site="builders"] .b-giant{
    color:transparent;-webkit-background-clip:text;background-clip:text;
    background-color:#F6EFE4;
    background-image:url(/builders/assets/dry-brush.svg),linear-gradient(180deg,#F6EFE4 0%,#EADFD0 62%,#F2C4CF 100%);
    background-size:600px 300px,100% 100%;background-blend-mode:multiply;
  }
}
[data-site="builders"] .b-foot__top,[data-site="builders"] .b-foot__base{max-inline-size:var(--b-max);margin-inline:auto}
[data-site="builders"] .b-foot__base{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;justify-content:space-between;margin-top:clamp(18px,3vw,32px);padding-top:18px;border-top:1px solid rgba(246,239,228,.16)}
[data-site="builders"] .b-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 20px}
[data-site="builders"] .b-foot a{color:var(--b-on-ink);min-height:40px;display:inline-flex;align-items:center}
[data-site="builders"] .b-foot p{margin:0}

/* ---------- Ink: the connective tissue ---------- */
/* bokashi edges: the pink hero bleeds into washi; the ink band fades out over the portal */
[data-site="builders"] .b-hero::after{content:"";position:absolute;z-index:-1;inset:auto 0 0 0;block-size:clamp(60px,10vh,120px);background:linear-gradient(to bottom,rgba(251,246,236,0),var(--b-washi));pointer-events:none}
[data-site="builders"] .b-portal{position:relative}
[data-site="builders"] .b-portal::before{content:"";position:absolute;inset:0 0 auto 0;block-size:clamp(70px,12vw,160px);background:linear-gradient(to bottom,rgba(30,26,23,.16),rgba(30,26,23,0));pointer-events:none}
/* the ink drop: the band's ground is a layer with a soft radial mask GSAP grows as you arrive.
   Default --b-drop is fully inked (no JS / reduced motion = finished ink). */
[data-site="builders"] .b-ink{background:transparent;overflow:visible;overflow-x:clip}
[data-site="builders"] .b-ink__ground{--b-drop:180%;--e:clamp(26px,3.6vw,52px);position:absolute;z-index:-2;inset:calc(var(--e) * -1 + 2px) 0 0 0;pointer-events:none;
  background:linear-gradient(to bottom,transparent var(--e),var(--b-ink) var(--e));
  -webkit-mask-image:radial-gradient(circle at 50% var(--e),#000 var(--b-drop),transparent calc(var(--b-drop) + 16%));
          mask-image:radial-gradient(circle at 50% var(--e),#000 var(--b-drop),transparent calc(var(--b-drop) + 16%))}
[data-site="builders"] .b-ink__edge{position:absolute;left:0;top:0;inline-size:100%;block-size:calc(var(--e) + 1px)}
[data-site="builders"] .b-ink .b-wrap{position:relative}
/* brush-stroke divider */
[data-site="builders"] .b-divider{display:block}
[data-site="builders"] .b-divider svg{inline-size:100%;block-size:clamp(26px,3.2vw,44px);overflow:visible}
/* brushed marks behind key words */
[data-site="builders"] .b-key{position:relative;display:inline-block;white-space:nowrap;z-index:0}
[data-site="builders"] .b-under{position:absolute;z-index:-1;left:-4%;bottom:-.06em;inline-size:108%;block-size:.26em;overflow:visible;opacity:.9}
[data-site="builders"] .b-enso{position:absolute;z-index:-1;left:50%;top:54%;inline-size:2.25em;block-size:auto;transform:translate(-50%,-50%) rotate(-8deg);overflow:visible;opacity:.7}
[data-site="builders"] .b-key--enso{padding-inline:.14em}
/* splatter: dry ink flicked from the brush */
[data-site="builders"] .b-splat{position:absolute;pointer-events:none}
[data-site="builders"] .b-splat--hero{z-index:-1;inline-size:clamp(120px,15vw,210px);right:clamp(90px,15vw,250px);bottom:clamp(24px,7vh,90px);opacity:.5;transform:rotate(-14deg)}
[data-site="builders"] .b-splat--contact{inline-size:110px;right:clamp(84px,10vw,130px);top:-40px;opacity:.4}
@media (max-width:640px){[data-site="builders"] .b-splat--hero{right:auto;left:-34px;bottom:auto;top:210px;opacity:.3}}

/* ---------- Sign-in page ---------- */
[data-site="builders"] .b-signin{display:grid;min-height:calc(100svh - 58px)}
[data-site="builders"] .b-signin__art{position:relative;overflow:hidden;isolation:isolate;min-height:200px;background:var(--b-sakura-field);background-image:var(--b-washi-grain)}
[data-site="builders"] .b-signin__art svg.b-signin__branch{position:absolute;right:-12%;top:-12%;inline-size:120%;max-inline-size:none;z-index:-1}
[data-site="builders"] .b-signin__art{min-height:220px}
[data-site="builders"] .b-signin__art svg.b-signin__branch{inline-size:72%;right:-4%;top:-36px}
[data-site="builders"] .b-signin__art .b-inscription{display:none}
[data-site="builders"] .b-signin__note{position:absolute;left:var(--b-gut);bottom:20px;max-inline-size:15ch;font:italic 400 1.15rem/1.35 var(--b-serif);color:var(--b-beni-deep)}
[data-site="builders"] .b-signin__panel{display:grid;align-content:center;padding:clamp(36px,6vw,80px) var(--b-gut) clamp(48px,7vw,96px)}
[data-site="builders"] .b-signin__inner{inline-size:100%;max-inline-size:440px;margin-inline:auto}
[data-site="builders"] .b-signin .b-h1{font-size:clamp(2rem,4vw,2.95rem);max-inline-size:none}
[data-site="builders"] .b-signin .b-lede{margin-top:14px;font-size:1.05rem}
[data-site="builders"] .b-signin__mark{--s:56px;margin-bottom:22px}
[data-site="builders"] .b-account{margin-top:30px;display:grid;gap:12px;justify-items:start}
/* Google sign-in button, per Google's branding guidelines (light theme): white fill, #747775 1px stroke,
   #1F1F1F Roboto Medium 14px label, standard multi-colour G, 40px tall, pill shape. */
[data-site="builders"] .b-gsi{
  display:inline-flex;align-items:center;gap:10px;block-size:40px;padding:0 12px;
  background:#FFFFFF;border:1px solid #747775;border-radius:20px;color:#1F1F1F;
  font:500 14px/20px "Builders Roboto",Roboto,Arial,sans-serif;letter-spacing:.25px;text-decoration:none;white-space:nowrap;
  transition:background-color .218s,border-color .218s,box-shadow .218s;
}
[data-site="builders"] .b-gsi:hover{background:#F8F8F8;box-shadow:0 1px 2px 0 rgba(60,64,67,.30),0 1px 3px 1px rgba(60,64,67,.15)}
[data-site="builders"] .b-gsi:active{background:#EEEEEE}
[data-site="builders"] .b-gsi__icon{inline-size:20px;block-size:20px;flex:none}
[data-site="builders"] .b-gsi__icon svg{inline-size:20px;block-size:20px}
[data-site="builders"] .b-account__caption{font-size:.9rem;color:var(--b-ink-3);max-inline-size:40ch}
[data-site="builders"] .b-honest{margin-top:26px;padding:14px 16px;border-radius:8px;background:rgba(246,201,212,.35);border:1px solid rgba(163,40,79,.25);font-size:.93rem;color:var(--b-ink-2)}
[data-site="builders"] .b-honest a{color:var(--b-beni-deep);font-weight:600}
[data-site="builders"] .b-signin__help{margin-top:28px;padding-top:20px;border-top:1px solid var(--b-line);font-size:.93rem;color:var(--b-ink-2)}
[data-site="builders"] .b-signin__help a{color:var(--b-beni-deep);font-weight:600}
@media (min-width:960px){
  [data-site="builders"] .b-signin{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  [data-site="builders"] .b-signin__art{min-height:auto}
  [data-site="builders"] .b-signin__art .b-inscription{display:flex}
  [data-site="builders"] .b-signin__art svg.b-signin__branch{inline-size:135%;right:-30%;top:-4%}
  [data-site="builders"] .b-signin__art .b-inscription{top:auto;bottom:clamp(40px,8vh,96px);right:clamp(28px,4vw,64px)}
  [data-site="builders"] .b-signin__note{bottom:clamp(40px,8vh,96px);font-size:1.5rem;max-inline-size:22ch}
}

@media print{[data-site="builders"] .b-petals,[data-site="builders"] #site-bar{display:none}}
