/* Layout: an atelier folio. Dark sample-board panels set against warm chalk walls; asymmetric splits, generous air, light raking across the hero. */
:root{
  color-scheme: light;
  --chalk:#F3EFE8; --chalk-2:#EBE5DB; --travertine:#D7C9B7; --linen:#B7AB9D; --clay:#A89984;
  --bronze:#5B402B; --copper:#B7754D; --copper-ink:#8E5434; --olive:#5B5C45; --charcoal:#292A27; --soot:#1F201D;
  --ink:#2A2824; --ink-soft:#5E574D; --on-dark:#EDE6DA; --on-dark-soft:#B9AE9F;
  --rule:rgba(42,40,36,.16); --rule-dark:rgba(237,230,218,.18);
  --display:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --body:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(16px,4.5vw,64px);
  --max:1240px;
  --s1:clamp(.75rem,.7rem + .2vw,.8125rem); --s2:1rem; --s3:clamp(1.125rem,1rem + .5vw,1.3rem);
  --s4:clamp(1.6rem,1.2rem + 1.6vw,2.4rem); --s5:clamp(2.2rem,1.4rem + 3.2vw,4rem); --s6:clamp(2.6rem,1.6rem + 4.2vw,5.2rem);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--chalk);color:var(--ink);font-family:var(--body);font-weight:300;font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:300;line-height:1.08;margin:0;text-wrap:balance;letter-spacing:-.005em}
p{margin:0}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--body);font-size:var(--s1);font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--copper-ink)}
.dark .eyebrow,.hero .eyebrow{color:var(--copper)}
.lede{font-size:var(--s3);line-height:1.6;color:var(--ink-soft);max-width:36em}
.dark{background:var(--charcoal);color:var(--on-dark)}
.dark .lede{color:var(--on-dark-soft)}
.btn{display:inline-flex;align-items:center;gap:.8em;font-family:var(--body);font-size:var(--s1);font-weight:500;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:1.05em 1.6em;border:1px solid currentColor;transition:background .3s,color .3s}
.btn-solid{background:var(--copper);border-color:var(--copper);color:var(--soot)}
.btn-solid:hover{background:var(--travertine);border-color:var(--travertine)}
.btn-line:hover{background:var(--on-dark);color:var(--charcoal)}
.textlink{font-size:var(--s1);font-weight:500;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.3em}
.concept{font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-soft)}

/* Header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(243,239,232,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.head-row{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:1rem}
.brand{display:flex;align-items:center;gap:.9rem;text-decoration:none}
.brand svg{width:26px;height:40px;flex:none}
.wordmark{display:flex;flex-direction:column;line-height:1}
.wordmark b{font-family:var(--display);font-weight:400;font-size:1.45rem;letter-spacing:.42em;margin-right:-.42em}
.wordmark span{font-size:.56rem;letter-spacing:.36em;text-transform:uppercase;color:var(--ink-soft);margin-top:.35rem}
.nav{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2.2rem)}
.nav a{font-size:var(--s1);font-weight:400;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft);padding-block:.4rem;border-bottom:1px solid transparent}
.nav a:hover{color:var(--ink);border-color:var(--copper)}
.nav .nav-cta{color:var(--ink);border:1px solid var(--ink);padding:.6rem 1rem}
.nav .nav-cta:hover{background:var(--ink);color:var(--chalk)}
.menu-btn{display:none;background:none;border:1px solid var(--rule);color:var(--ink);font:500 var(--s1)/1 var(--body);letter-spacing:.2em;text-transform:uppercase;padding:.7rem .9rem;cursor:pointer}
@media (max-width:940px){
  .menu-btn{display:block}
  .nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--chalk);border-bottom:1px solid var(--rule);padding:.5rem var(--gutter) 1.25rem}
  .nav[data-open="false"]{display:none}
  .nav a{padding-block:.9rem;border-bottom:1px solid var(--rule)}
  .nav .nav-cta{margin-top:1rem;text-align:center}
}

/* Hero */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--soot);color:var(--on-dark)}
.hero-copy{display:flex;flex-direction:column;justify-content:center;gap:2rem;padding:clamp(3rem,7vw,7rem) var(--gutter) clamp(3rem,6vw,6rem) max(var(--gutter),calc((100vw - var(--max))/2 + var(--gutter)))}
.hero h1{font-size:var(--s6);max-width:11em}
.hero h1 em{font-style:italic;color:var(--travertine)}
.hero .lede{color:var(--on-dark-soft);max-width:30em}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:center}
.hero-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;padding-top:1.5rem;border-top:1px solid var(--rule-dark);font-size:var(--s1);letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-soft)}
.hero-figure{position:relative;margin:0;min-height:420px;overflow:hidden}
.hero-figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:35% 80%}
.hero-figure::after{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 35%,rgba(255,236,205,.16) 48%,transparent 60%);transform:translateX(-30%);animation:sun 14s ease-in-out infinite alternate;pointer-events:none}
@keyframes sun{to{transform:translateX(25%)}}
.hero-figure figcaption{position:absolute;left:1.25rem;bottom:1.1rem;color:var(--chalk);opacity:.8;text-shadow:0 1px 6px rgba(0,0,0,.4)}
@media (max-width:860px){.hero{grid-template-columns:1fr}.hero-figure{min-height:0;aspect-ratio:4/4.4;max-width:100%}.hero-copy{padding-inline:var(--gutter)}}

/* Manifesto band */
.band{background:var(--bronze);color:var(--travertine)}
.band ul{list-style:none;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem 2rem;padding-block:1.4rem;font-family:var(--display);font-size:clamp(.95rem,.8rem + .5vw,1.15rem);letter-spacing:.2em;text-transform:uppercase;text-align:center}
@media (max-width:640px){.band ul{grid-template-columns:1fr}}

section{padding-block:clamp(4.5rem,9vw,8.5rem)}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem 4rem;align-items:end;margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.sec-head h2{font-size:var(--s5)}
.sec-head .eyebrow{display:block;margin-bottom:1.25rem}
@media (max-width:760px){.sec-head{grid-template-columns:1fr}}

/* Surfaces */
.families{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2vw,1.75rem)}
.family{display:flex;flex-direction:column;gap:1.1rem}
.family .swatch{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--travertine)}
.family .swatch img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.6,.2,1)}
.family:hover .swatch img{transform:scale(1.04)}
.family .idx{position:absolute;top:.9rem;left:.9rem;font-family:var(--display);font-size:1rem;letter-spacing:.2em;color:var(--chalk);text-shadow:0 1px 8px rgba(0,0,0,.35)}
.family h3{font-size:var(--s4);letter-spacing:.06em}
.family .feel{font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;color:var(--copper-ink)}
.family p.scope{color:var(--ink-soft);font-size:.95rem}
.family .more{margin-top:auto;align-self:flex-start}
.also{margin-top:clamp(2rem,4vw,3rem);padding-top:1.5rem;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;gap:.5rem 2rem;justify-content:space-between;color:var(--ink-soft);font-size:.95rem}
@media (max-width:980px){.families{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.families{grid-template-columns:1fr}.family .swatch{aspect-ratio:4/3}}

/* Commission */
.commission{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:0}
.photo-slot{position:relative;min-height:420px;background:
  repeating-linear-gradient(115deg,rgba(91,64,43,.07) 0 2px,transparent 2px 22px),var(--travertine);
  display:grid;place-items:center;text-align:center;padding:2rem}
.photo-slot div{display:grid;gap:.75rem;justify-items:center;color:var(--bronze)}
.photo-slot svg{width:44px;height:68px;opacity:.7}
.photo-slot p{font-size:var(--s1);letter-spacing:.2em;text-transform:uppercase}
.commission-photo{margin:0;min-height:420px;position:relative;overflow:hidden}
.commission-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.commission-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.5rem,1.2vw,1rem);margin-top:clamp(.5rem,1.2vw,1rem)}
.commission-strip img{width:100%;aspect-ratio:3/4;object-fit:cover}
.also-project a{text-decoration:none;border-bottom:1px solid var(--linen);color:var(--ink)}
.also-project{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--rule);color:var(--ink-soft);display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;align-items:baseline}
@media (max-width:860px){.commission-photo{min-height:0;aspect-ratio:3/4}}
@media (max-width:520px){.commission-strip{grid-template-columns:1fr 1fr}.commission-strip img:last-child{display:none}}
.commission-copy{background:var(--charcoal);color:var(--on-dark);padding:clamp(2.5rem,5vw,4.5rem);display:flex;flex-direction:column;gap:1.5rem}
.commission-copy h3{font-size:var(--s4)}
.spec{display:grid;grid-template-columns:auto 1fr;gap:.85rem 1.5rem;margin:0;padding-top:1.25rem;border-top:1px solid var(--rule-dark);font-size:.95rem}
.spec dt{font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;color:var(--copper);padding-top:.2em}
.spec dd{margin:0;color:var(--on-dark-soft)}
@media (max-width:860px){.commission{grid-template-columns:1fr}.photo-slot{min-height:280px}}

/* Method */
.method{background:var(--chalk-2)}
.method-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.method-figure{margin:0;position:sticky;top:6rem}
.method-figure img{width:100%;aspect-ratio:4/5;object-fit:cover}
.method-figure figcaption{margin-top:.75rem;font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(1.5rem,3vw,3rem);counter-reset:step}
.steps li{counter-increment:step;display:grid;grid-template-columns:3.2rem 1fr;gap:.25rem 1rem;padding-block:1.6rem;border-top:1px solid var(--rule)}
.steps li::before{content:counter(step,decimal-leading-zero);grid-row:span 2;font-family:var(--display);font-size:1.7rem;line-height:1;color:var(--copper-ink)}
.steps h3{font-size:1.5rem;letter-spacing:.04em}
.steps p{color:var(--ink-soft);font-size:.95rem}
@media (max-width:860px){.method-grid{grid-template-columns:1fr}.method-figure{position:static}.method-figure img{aspect-ratio:16/10}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* Craft */
.craft{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.craft-figure{margin:0;position:relative}
.craft-figure img{width:100%;aspect-ratio:3/4;object-fit:cover}
.craft-figure .portrait-note{position:absolute;right:-1px;bottom:-1px;background:var(--chalk);padding:1rem 1.25rem;max-width:15rem;font-size:.8125rem;color:var(--ink-soft);border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.craft-copy{display:flex;flex-direction:column;gap:1.75rem}
.craft-copy h2{font-size:var(--s5)}
.craft blockquote{margin:0;padding-left:1.5rem;border-left:1px solid var(--copper);font-family:var(--display);font-style:italic;font-size:var(--s4);line-height:1.2;color:var(--bronze)}
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;padding-top:1.5rem;border-top:1px solid var(--rule)}
.values b{display:block;font-weight:500;font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;margin-bottom:.35rem}
.values span{font-size:.9rem;color:var(--ink-soft)}
@media (max-width:860px){.craft{grid-template-columns:1fr}.craft-figure img{aspect-ratio:4/3}}
@media (max-width:480px){.values{grid-template-columns:1fr}}

/* Trade */
.trade .sec-head h2{color:var(--on-dark)}
.partners{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule-dark)}
.partner{padding:1.75rem 1.5rem 2rem 0;display:flex;flex-direction:column;gap:.75rem}
.partner + .partner{padding-left:1.5rem;border-left:1px solid var(--rule-dark)}
.partner h3{font-size:1.6rem}
.partner p{color:var(--on-dark-soft);font-size:.95rem}
.trade-foot{margin-top:clamp(2.5rem,5vw,4rem);display:flex;flex-wrap:wrap;gap:1.25rem 2rem;align-items:center;justify-content:space-between}
.trade-foot p{font-family:var(--display);font-size:var(--s4);font-style:italic;color:var(--travertine);max-width:22em}
@media (max-width:900px){.partners{grid-template-columns:repeat(2,minmax(0,1fr))}.partner:nth-child(3){padding-left:0;border-left:0}.partner:nth-child(n+3){border-top:1px solid var(--rule-dark)}}
@media (max-width:520px){.partners{grid-template-columns:1fr}.partner,.partner + .partner{padding-left:0;border-left:0}.partner + .partner{border-top:1px solid var(--rule-dark)}}



/* Specification hub */
.spec-hub{background:var(--chalk-2)}
.resources{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.res{background:var(--chalk);padding:clamp(1.5rem,2.5vw,2.25rem);display:flex;flex-direction:column;gap:.9rem;min-width:0}
.res h3{font-size:1.65rem}
.res p{color:var(--ink-soft);font-size:.95rem}
.res .for{margin-top:auto;font-size:.8125rem;color:var(--ink-soft);padding-top:.75rem;border-top:1px solid var(--rule)}
.status{align-self:flex-start;font-size:.6875rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;padding:.35rem .7rem;border:1px solid var(--clay);color:var(--ink-soft)}
.status.live{background:var(--copper);border-color:var(--copper);color:var(--soot)}
.hub-foot{margin-top:clamp(2rem,4vw,3rem);display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
.hub-foot p{max-width:38em;color:var(--ink-soft)}
.btn-ink{color:var(--ink)}
.btn-ink:hover{background:var(--ink);color:var(--chalk)}
@media (min-width:901px){.res4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){.resources{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.resources{grid-template-columns:1fr}}

/* Shop teaser */
.shop{background:var(--olive);color:var(--on-dark)}
.shop-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:end}
.shop h2{font-size:var(--s5)}
.shop .eyebrow{color:var(--travertine);display:block;margin-bottom:1.25rem}
.shop .lede{color:var(--on-dark-soft);margin-top:1.25rem}
.shop form{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem 1.5rem;align-items:end}
.shop select{color:var(--on-dark);border-color:var(--on-dark-soft)}
.shop select option{color:var(--ink)}
.shop .btn{grid-column:1/-1;justify-self:start}
.shop label{color:var(--travertine)}
.shop input{color:var(--on-dark);border-color:var(--on-dark-soft)}
.shop input::placeholder{color:var(--on-dark-soft)}
.shop .btn{color:var(--on-dark);background:transparent;cursor:pointer}
.shop .btn:hover{background:var(--on-dark);color:var(--olive)}
.shop .form-note{background:rgba(0,0,0,.18);color:var(--on-dark)}
@media (max-width:760px){.shop-grid{grid-template-columns:1fr}.shop form{grid-template-columns:1fr}}

/* Pause */
.pause{position:relative;padding:0;background:var(--soot)}
.pause img{width:100%;height:clamp(260px,42vw,520px);object-fit:cover;object-position:50% 50%;opacity:.92}
.pause p{position:absolute;inset:auto 0 clamp(1.5rem,4vw,3rem) 0;text-align:center;font-family:var(--display);font-size:var(--s5);color:var(--chalk);letter-spacing:.08em;text-shadow:0 2px 24px rgba(0,0,0,.45)}
.pause .concept{position:absolute;top:1rem;right:var(--gutter);color:var(--chalk);opacity:.75}

/* Contact */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(2.5rem,6vw,6rem)}
form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 1.5rem}
.field{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.field.full{grid-column:1/-1}
label,legend{font-size:var(--s1);font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
input,select,textarea{font:inherit;font-size:1rem;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--clay);padding:.6rem 0;border-radius:0;width:100%}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);background-position:calc(100% - 10px) 55%,calc(100% - 5px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:1.5rem}
textarea{min-height:7.5rem;resize:vertical;border:1px solid var(--clay);padding:.8rem}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--copper)}
fieldset{border:0;margin:0;padding:0;grid-column:1/-1;display:flex;flex-direction:column;gap:.75rem}
.chips{display:flex;flex-wrap:wrap;gap:.6rem}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-block;padding:.55rem 1rem;border:1px solid var(--linen);font-size:.875rem;cursor:pointer;transition:all .25s}
.chip input:checked + span{background:var(--charcoal);color:var(--on-dark);border-color:var(--charcoal)}
.chip input:focus-visible + span{outline:2px solid var(--copper);outline-offset:2px}
.form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between;padding-top:.5rem}
.form-foot small{color:var(--ink-soft);font-size:.85rem;max-width:28em}
.btn-dark{background:var(--charcoal);color:var(--on-dark);border-color:var(--charcoal);cursor:pointer}
.btn-dark:hover{background:var(--bronze);border-color:var(--bronze)}
.form-note{grid-column:1/-1;padding:1rem 1.25rem;background:var(--chalk-2);border-left:2px solid var(--copper);font-size:.95rem}
.studio{display:flex;flex-direction:column;gap:2rem;padding-top:.25rem}
.studio h3{font-size:var(--s4)}
.studio dl{margin:0;display:grid;gap:1.25rem}
.studio dt{font-size:var(--s1);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--copper-ink);margin-bottom:.3rem}
.studio dd{margin:0;color:var(--ink-soft)}
.studio dd a{text-decoration:none;border-bottom:1px solid var(--linen)}
.hours{display:grid;grid-template-columns:auto 1fr;gap:.2rem 1.5rem;font-variant-numeric:tabular-nums}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
@media (max-width:520px){form{grid-template-columns:1fr}}

/* Footer */
.foot{background:var(--soot);color:var(--on-dark-soft);padding-block:3.5rem 2.5rem}
.foot-row{display:flex;flex-wrap:wrap;gap:2rem;justify-content:space-between;align-items:flex-end}
.foot .wordmark b{color:var(--on-dark)}
.foot .wordmark span{color:var(--on-dark-soft)}
.foot-links{display:flex;flex-wrap:wrap;gap:.75rem 1.75rem;font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:var(--on-dark)}
.foot-base{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--rule-dark);display:flex;flex-wrap:wrap;gap:.5rem 2rem;justify-content:space-between;font-size:.8125rem}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ===== Case study ===== */
/* Case study: the photographs carry the page; copy sits in narrow columns beside them. */
.cs-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);background:var(--soot);color:var(--on-dark)}
.cs-hero .hero-copy{gap:1.75rem}
.cs-hero .lede{color:var(--on-dark-soft)}
.cs-hero .eyebrow{color:var(--copper)}
.cs-hero h1{font-size:var(--s6);max-width:10em}
.cs-hero figure{margin:0;position:relative;min-height:560px}
.cs-hero figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.back{font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--on-dark-soft)}
.back:hover{color:var(--on-dark)}
@media (max-width:860px){.cs-hero{grid-template-columns:1fr}.cs-hero figure{min-height:0;aspect-ratio:4/5}}

.facts{border-bottom:1px solid var(--rule)}
.facts dl{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.facts div{padding-block:1.6rem;padding-right:1.5rem}
.facts div + div{padding-left:1.5rem;border-left:1px solid var(--rule)}
.facts dt{font-size:var(--s1);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--copper-ink);margin-bottom:.35rem}
.facts dd{margin:0;font-family:var(--display);font-size:1.4rem;line-height:1.25}
@media (max-width:760px){.facts dl{grid-template-columns:1fr 1fr}.facts div:nth-child(3){padding-left:0;border-left:0}.facts div:nth-child(n+3){border-top:1px solid var(--rule)}}

.intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(2rem,6vw,6rem)}
.intro h2{font-size:var(--s5)}
.intro .body{display:grid;gap:1.25rem;max-width:38em}
.intro .body p{font-size:var(--s3);line-height:1.65;color:var(--ink-soft)}
@media (max-width:860px){.intro{grid-template-columns:1fr}}

.room{padding-top:0}
.room-head{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.2fr);gap:1rem clamp(1.5rem,4vw,4rem);align-items:baseline;padding-top:2rem;border-top:1px solid var(--rule);margin-bottom:clamp(1.5rem,3vw,2.5rem)}
.room-head .num{font-family:var(--display);font-size:var(--s4);color:var(--copper-ink)}
.room-head h2{font-size:var(--s4)}
.room-head p{color:var(--ink-soft)}
@media (max-width:860px){.room-head{grid-template-columns:auto 1fr}.room-head p{grid-column:1/-1}}
.gallery{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(.5rem,1.2vw,1rem)}
.gallery figure{margin:0;display:flex;flex-direction:column;gap:.5rem;min-width:0}
.gallery img{width:100%;aspect-ratio:3/4;object-fit:cover}
.gallery .lead{grid-row:span 2}
.gallery .lead img{height:100%;aspect-ratio:auto;flex:1}
.gallery figcaption{font-size:.8125rem;color:var(--ink-soft)}
.gallery.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.gallery.three .lead{grid-row:auto}
.gallery.three .lead img{aspect-ratio:3/4;height:auto}
@media (max-width:760px){.gallery,.gallery.three{grid-template-columns:1fr 1fr}.gallery .lead{grid-column:1/-1;grid-row:auto}.gallery .lead img{aspect-ratio:4/5;height:auto}}

.detail{position:relative;padding:0;margin:0;background:var(--soot)}
.detail img{width:100%;height:clamp(240px,38vw,480px);object-fit:cover}
.detail figcaption{position:absolute;left:var(--gutter);bottom:1.25rem;font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;color:var(--chalk);text-shadow:0 1px 8px rgba(0,0,0,.5)}

.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem)}
.principles div{display:grid;gap:.75rem;padding-top:1.5rem;border-top:1px solid var(--rule-dark)}
.principles h3{font-size:1.7rem}
.principles p{color:var(--on-dark-soft)}
@media (max-width:760px){.principles{grid-template-columns:1fr}}

.next{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;align-items:center;justify-content:space-between}
.next h2{font-size:var(--s5);max-width:14em}

/* ===== Application page ===== */
/* Application page: type-led, with the layer build-up as the central drawing. */
.app-hero{background:var(--chalk-2);border-bottom:1px solid var(--rule)}
.app-hero .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:end;padding-block:clamp(3.5rem,8vw,7rem)}
.app-hero h1{font-size:var(--s6);max-width:9em;margin-top:1.25rem}
.app-hero .lede{margin-top:1.5rem}
.back{font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft)}
.uses{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--rule)}
.uses li{padding-block:.9rem;border-bottom:1px solid var(--rule);font-family:var(--display);font-size:1.45rem;display:flex;justify-content:space-between;gap:1rem}
.uses li span{font-family:var(--body);font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);align-self:center;text-align:right}
@media (max-width:860px){.app-hero .wrap{grid-template-columns:1fr}}

.pool-photo{margin:0 auto;max-width:var(--max);padding:clamp(2rem,4vw,3.5rem) var(--gutter) 0}
.pool-photo img{width:100%;height:auto}
.pool-photo figcaption,.shell figcaption{font-size:.8125rem;color:var(--ink-soft);padding-top:.6rem}
.pool-photo figcaption{padding-top:.6rem}
.shell{margin:0 0 clamp(2.5rem,5vw,4rem)}
.shell img{width:100%;aspect-ratio:16/9;object-fit:cover}
.why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2.5rem)}
.why div{display:grid;gap:.6rem;align-content:start;padding-top:1.25rem;border-top:1px solid var(--rule)}
.why h3{font-size:1.6rem}
.why p{color:var(--ink-soft);font-size:.95rem}
@media (max-width:900px){.why{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.why{grid-template-columns:1fr}}

.buildup{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.diagram{margin:0;background:var(--chalk);border:1px solid var(--rule-dark);padding:1rem}
.diagram svg{display:block;width:100%;height:auto}
.diagram figcaption{margin-top:.75rem;font-size:.8125rem;color:var(--ink-soft)}
.layers{list-style:none;margin:0;padding:0;counter-reset:l}
.layers li{counter-increment:l;display:grid;grid-template-columns:3rem 1fr;gap:.2rem 1rem;padding-block:1.25rem;border-top:1px solid var(--rule-dark)}
.layers li::before{content:counter(l,decimal-leading-zero);grid-row:span 2;font-family:var(--display);font-size:1.6rem;line-height:1;color:var(--copper)}
.layers h3{font-size:1.45rem}
.layers p{color:var(--on-dark-soft);font-size:.95rem}
@media (max-width:860px){.buildup{grid-template-columns:1fr}}

.timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--rule)}
.timeline div{padding:1.5rem;display:grid;gap:.4rem;align-content:start}
.timeline div + div{border-left:1px solid var(--rule)}
.timeline b{font-family:var(--display);font-weight:400;font-size:var(--s4);line-height:1;font-variant-numeric:tabular-nums}
.timeline span{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink)}
.timeline p{color:var(--ink-soft);font-size:.9rem}
@media (max-width:820px){.timeline{grid-template-columns:1fr 1fr}.timeline div:nth-child(3){border-left:0}.timeline div:nth-child(n+3){border-top:1px solid var(--rule)}}

.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,4vw,4rem)}
.checks h3{font-size:1.6rem;margin-bottom:1rem}
.checks ul{margin:0;padding-left:1.1rem;display:grid;gap:.6rem;color:var(--ink-soft)}
@media (max-width:760px){.checks{grid-template-columns:1fr}}
.note{margin-top:clamp(2rem,4vw,3rem);padding:1.25rem 1.5rem;background:var(--chalk-2);border-left:2px solid var(--copper);color:var(--ink-soft);font-size:.95rem;max-width:52em}
.next{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;align-items:center;justify-content:space-between}
.next h2{font-size:var(--s5);max-width:14em}

/* ===== Shared fixes ===== */
.cs-hero .back{color:var(--on-dark-soft)}
.cs-hero .back:hover{color:var(--on-dark)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== Projects index ===== */
.pj-head{padding-block:clamp(3.5rem,8vw,7rem) clamp(2rem,4vw,3rem)}
.pj-head h1{font-size:var(--s6);margin-top:1.25rem}
.pj-head .lede{margin-top:1.25rem}
.pj-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,2.5rem) clamp(1rem,2vw,1.75rem)}
.pj{display:flex;flex-direction:column;gap:.85rem;text-decoration:none;color:inherit;min-width:0}
.pj .ph{overflow:hidden;background:var(--travertine)}
.pj img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.6,.2,1)}
.pj:hover img{transform:scale(1.035)}
.pj .meta{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink)}
.pj h2{font-size:1.75rem}
.pj p{color:var(--ink-soft);font-size:.95rem}
.pj .go{font-size:var(--s1);font-weight:500;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid currentColor;align-self:flex-start;padding-bottom:.25em}
.pj.wide{grid-column:span 2}
.pj.wide img{aspect-ratio:16/10}
.pj-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(1.5rem,3vw,2.5rem)}
.pj-filter button{font:500 var(--s1)/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:.7rem 1rem;border:1px solid var(--linen);background:transparent;color:var(--ink);cursor:pointer}
.pj-filter button[aria-pressed="true"]{background:var(--charcoal);border-color:var(--charcoal);color:var(--on-dark)}
@media (max-width:900px){.pj-grid{grid-template-columns:1fr 1fr}.pj.wide{grid-column:1/-1}}
@media (max-width:540px){.pj-grid{grid-template-columns:1fr}}

/* ===== Finish page (Patina) ===== */
.fin-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);background:var(--soot);color:var(--on-dark)}
.fin-hero h1{font-size:var(--s6);max-width:9em}
.fin-hero .lede{color:var(--on-dark-soft)}
.fin-hero .eyebrow{color:var(--copper)}
.fin-hero .back{color:var(--on-dark-soft)}
.fin-hero figure{margin:0;position:relative;min-height:560px}
.fin-hero figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.fin-hero{grid-template-columns:1fr}.fin-hero figure{min-height:0;aspect-ratio:4/5}}
.swatches{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.75rem,1.5vw,1.25rem)}
.swatches figure{margin:0;display:grid;gap:.6rem;min-width:0}
.swatches img{width:100%;aspect-ratio:1;object-fit:cover}
.swatches b{font-family:var(--display);font-weight:400;font-size:1.35rem}
.swatches span{font-size:.875rem;color:var(--ink-soft)}
@media (max-width:860px){.swatches{grid-template-columns:1fr 1fr}}
.pieces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,3vw,3rem)}
.piece{margin:0;display:grid;gap:.9rem;align-content:start;min-width:0}
.piece img{width:100%;aspect-ratio:4/5;object-fit:cover}
.piece h3{font-size:1.7rem}
.piece p{color:var(--ink-soft);font-size:.95rem;max-width:34em}
.piece .meta{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink)}
@media (max-width:700px){.pieces{grid-template-columns:1fr}}

/* ===== SABI SYSTEMS (shop teaser), matched to the packaging ===== */
.sys{--sys-ink:#1E1E1C;--sys-taupe:#BDB3A3;--sys-olive:#4E5340;--sys-clay:#8C6A55;--sys-chalk:#ECE7DF;background:var(--sys-ink);color:var(--on-dark)}
.sys .eyebrow{color:var(--sys-taupe)}
.sys-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem 4rem;align-items:end;margin-bottom:clamp(2rem,4vw,3rem)}
.sys-head h2{font-size:var(--s5);margin-top:1rem}
.sys-head .lede{color:var(--on-dark-soft)}
.sys-mark{display:flex;align-items:center;gap:.6rem;margin-top:1.5rem;color:var(--on-dark)}
.sys-mark svg{width:42px;height:24px;flex:none}
.sys-mark span{display:flex;flex-direction:column;line-height:1}
.sys-mark b{font-family:var(--body);font-weight:300;font-size:1.6rem;letter-spacing:.32em}
.sys-mark small{font-size:.62rem;letter-spacing:.42em;text-transform:uppercase;color:var(--sys-taupe);margin-top:.35rem}
.sys-photo{margin:0}
.sys-photo img{width:100%;height:auto}
.sys-photo figcaption{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-soft);padding-top:.6rem}
.kits{list-style:none;margin:clamp(1.5rem,3vw,2.5rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;background:var(--rule-dark);border:1px solid var(--rule-dark)}
.kits li{background:var(--sys-ink);padding:0 1rem 1.1rem;display:grid;gap:.35rem;align-content:start}
.kits .k-band{display:block;height:6px;margin:0 -1rem .8rem}
.kits b{font-family:var(--display);font-weight:400;font-size:1.3rem;line-height:1.15}
.kits span:not(.k-band){font-size:.8125rem;color:var(--on-dark-soft);font-variant-numeric:tabular-nums}
.k-wall .k-band{background:#0F0F0E;outline:1px solid var(--rule-dark)}
.k-floor .k-band{background:var(--sys-taupe)}
.k-wet .k-band{background:var(--sys-olive)}
.k-trowel .k-band{background:var(--sys-clay)}
.k-feature .k-band{background:var(--sys-chalk)}
.k-extra .k-band{background:linear-gradient(90deg,var(--sys-taupe),var(--sys-chalk))}
.sys-join{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1.5rem,4vw,4rem);margin-top:clamp(2.5rem,5vw,4rem);padding-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--rule-dark);align-items:start}
.sys-join h3{font-size:var(--s4)}
.sys-join p{color:var(--on-dark-soft);margin-top:.75rem}
.sys label{color:var(--sys-taupe)}
.sys .btn{border-color:var(--sys-taupe);color:var(--on-dark)}
.sys .btn:hover{background:var(--sys-taupe);color:var(--sys-ink)}
@media (max-width:1000px){.kits{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.sys-head,.sys-join{grid-template-columns:1fr}}
@media (max-width:480px){.kits{grid-template-columns:1fr 1fr}}


/* ===== Material family pages ===== */
.family{position:relative}
.family .more::after{content:"";position:absolute;inset:0}
.fam-nav{border-bottom:1px solid var(--rule);background:var(--chalk)}
.fam-nav ul{list-style:none;margin:0 auto;padding-block:0;display:flex;flex-wrap:wrap;gap:0}
.fam-nav a{display:block;padding:1.1rem 1.5rem 1.1rem 0;margin-right:1.5rem;font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft);border-bottom:2px solid transparent}
.fam-nav a[aria-current="page"]{color:var(--ink);border-color:var(--copper)}
.fam-nav a:hover{color:var(--ink)}
.fin-list{display:grid;gap:clamp(2.5rem,5vw,4.5rem)}
.fin{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,4rem);align-items:center}
.fin:nth-child(even) .fin-img{order:2}
.fin-img{margin:0}
.fin-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.fin-copy{display:grid;gap:1rem;max-width:34em}
.fin-copy .num{font-family:var(--display);font-size:1.2rem;color:var(--copper-ink);letter-spacing:.1em}
.fin-copy h3{font-size:var(--s4)}
.fin-copy p{color:var(--ink-soft)}
.fin-copy dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.5rem 1.5rem;padding-top:1rem;border-top:1px solid var(--rule);font-size:.95rem}
.fin-copy dt{font-size:var(--s1);font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink);padding-top:.2em}
.fin-copy dd{margin:0;color:var(--ink-soft)}
@media (max-width:760px){.fin{grid-template-columns:1fr}.fin:nth-child(even) .fin-img{order:0}}
.ex-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.75rem)}
.ex{margin:0;display:grid;gap:.6rem;align-content:start;min-width:0;text-decoration:none;color:inherit}
.ex img{width:100%;aspect-ratio:4/5;object-fit:cover}
.ex .meta{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink)}
.ex b{font-family:var(--display);font-weight:400;font-size:1.4rem;line-height:1.2}
.ex span.go{font-size:var(--s1);font-weight:500;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid currentColor;justify-self:start}
@media (max-width:860px){.ex-grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.ex-grid{grid-template-columns:1fr}}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.5rem,1vw,1rem)}
.ba figure{margin:0;display:grid;gap:.5rem}
.ba img{width:100%;aspect-ratio:1;object-fit:cover}
.ba figcaption{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}

/* ===== Atelier page ===== */
.at-hero h1{font-size:var(--s6);max-width:8.5em}
.pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2.5vw,2rem)}
.pillar{display:grid;gap:.85rem;align-content:start;min-width:0}
.pillar img{width:100%;aspect-ratio:4/5;object-fit:cover}
.pillar h3{font-size:1.8rem}
.pillar p{color:var(--ink-soft);font-size:.95rem}
@media (max-width:900px){.pillars{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.pillars{grid-template-columns:1fr}}
.vs{border-top:1px solid var(--rule-dark)}
.vs-row{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr) minmax(0,1fr);gap:1rem 2rem;padding-block:1.2rem;border-bottom:1px solid var(--rule-dark);align-items:baseline}
.vs-row b{font-family:var(--display);font-weight:400;font-size:1.45rem}
.vs-row span{color:var(--on-dark)}
.vs-row span:last-child{color:var(--on-dark-soft);text-decoration:line-through;text-decoration-color:rgba(183,117,77,.6);text-decoration-thickness:1px}
.vs-head span{font-size:var(--s1);letter-spacing:.18em;text-transform:uppercase;color:var(--copper)!important;text-decoration:none!important}
@media (max-width:700px){.vs-row{grid-template-columns:1fr}.vs-head{display:none}.vs-row span:nth-child(2)::before{content:"With SABI: ";color:var(--copper)}}
.details{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--rule)}
.details li{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:.4rem 2rem;padding-block:1.1rem;border-bottom:1px solid var(--rule)}
.details b{font-family:var(--display);font-weight:400;font-size:1.4rem}
.details span{color:var(--ink-soft)}
@media (max-width:600px){.details li{grid-template-columns:1fr}}
.values6{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem clamp(1.5rem,3vw,3rem)}
.values6 div{display:grid;gap:.4rem;padding-top:1.1rem;border-top:1px solid var(--rule)}
.values6 b{font-size:var(--s1);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--copper-ink)}
.values6 span{color:var(--ink-soft)}
@media (max-width:760px){.values6{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.values6{grid-template-columns:1fr}}
.house{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.house h2{font-size:var(--s5);margin-top:1rem}
.house .lede{margin-top:1.25rem}
.house-sign{font-family:var(--display);font-style:italic;font-size:var(--s4);line-height:1.35;color:var(--bronze);padding-left:1.5rem;border-left:1px solid var(--copper)}
@media (max-width:760px){.house{grid-template-columns:1fr}}
/* homepage atelier statement */
.atelier-line{font-family:var(--display);font-size:var(--s1);letter-spacing:.3em;text-transform:uppercase}
.at-intro{padding-block:clamp(4rem,8vw,7rem) 0}
.at-intro-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.at-intro h2{font-size:var(--s5);line-height:1.12}
.at-intro h2 .atelier-line{font-family:var(--body);font-size:var(--s1);font-weight:500;letter-spacing:.22em;color:var(--copper-ink)}
.at-intro-grid > div{display:grid;gap:1.5rem;justify-items:start}
.at-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 0}
.at-steps li{font-family:var(--display);font-style:italic;font-size:1.35rem;color:var(--bronze)}
.at-steps li + li::before{content:"·";margin:0 .7rem;color:var(--clay);font-style:normal}
@media (max-width:760px){.at-intro-grid{grid-template-columns:1fr}}
#surfaces{padding-top:clamp(3.5rem,7vw,6rem)}

/* ===== People ===== */
.people{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2.25rem)}
.person{display:grid;gap:.6rem;align-content:start;min-width:0}
.portrait{aspect-ratio:4/5;background:repeating-linear-gradient(115deg,rgba(91,64,43,.07) 0 2px,transparent 2px 22px),var(--travertine);display:grid;place-items:center;align-content:center;gap:.75rem;color:var(--bronze);margin-bottom:.4rem}
.portrait svg{width:40px;height:62px;opacity:.7}
.portrait span{font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase}
.crew-mark{background:var(--charcoal);color:var(--on-dark)}
.crew-mark b{font-family:var(--display);font-weight:300;font-size:6rem;line-height:1;color:var(--travertine)}
.crew-mark span{color:var(--on-dark-soft)}
.person .role{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink)}
.person h3{font-size:1.8rem}
.person p{color:var(--ink-soft);font-size:.95rem}
@media (max-width:900px){.people{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.people{grid-template-columns:1fr}}

/* ===== Artist imagery tag ===== */
.tag-artist{position:absolute;left:1rem;top:1rem;z-index:1;font-size:.6875rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;padding:.4rem .65rem;background:rgba(31,32,29,.72);color:var(--chalk)}
.fin-hero figure .tag-artist{top:auto;bottom:1.1rem;left:1.25rem}

/* ===== Rock walling ===== */
.rk-feature{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.rk-main{margin:0}
.rk-main img{width:100%;aspect-ratio:4/5;object-fit:cover}
.rk-copy{display:grid;gap:1.25rem;align-content:start}
.rk-copy h2{font-size:var(--s5)}
.rk-copy p{color:var(--ink-soft);font-size:var(--s3);line-height:1.6}
.rk-video{margin:.5rem 0 0;max-width:20rem}
.rk-video video{width:100%;aspect-ratio:9/16;object-fit:cover;display:block;background:var(--travertine)}
.rk-video figcaption{font-size:var(--s1);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);padding-top:.6rem}
@media (max-width:860px){.rk-feature{grid-template-columns:1fr}.rk-video{max-width:16rem}}

/* ===== Ideas ===== */
.ideas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.75rem)}
.idea{position:relative;display:grid;gap:.5rem;align-content:start;text-decoration:none;color:inherit;min-width:0}
.idea img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.6,.2,1)}
.idea:hover img{transform:scale(1.02)}
.idea.tall{grid-column:span 1}
.idea .meta{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--copper-ink);margin-top:.35rem}
.idea b{font-family:var(--display);font-weight:400;font-size:1.45rem;line-height:1.2}
@media (min-width:861px){.ideas{grid-template-columns:repeat(6,minmax(0,1fr))}.idea{grid-column:span 2}.idea.tall{grid-column:span 3}.idea.tall img{aspect-ratio:3/4}}
@media (max-width:860px){.ideas{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.ideas{grid-template-columns:1fr}}
.fin-soon{aspect-ratio:4/3;background:repeating-linear-gradient(115deg,rgba(91,64,43,.07) 0 2px,transparent 2px 22px),var(--travertine);display:grid;place-items:center;align-content:center;gap:.75rem;color:var(--bronze)}
.fin-soon svg{width:40px;height:62px;opacity:.7}
.fin-soon span{font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase}
.fin-img{position:relative}
.ba-final{margin:0;display:grid;gap:.5rem}
.ba-final img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ba-final figcaption{font-size:var(--s1);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}

/* ===== WhatsApp button ===== */
.wa-float{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:30;display:inline-flex;align-items:center;gap:.55rem;padding:.75rem 1.1rem .75rem .85rem;background:var(--charcoal);color:var(--on-dark);text-decoration:none;font-size:var(--s1);font-weight:500;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 6px 24px rgba(0,0,0,.18);border:1px solid rgba(237,230,218,.15);transition:background .25s}
.wa-float svg{width:22px;height:22px;color:#25D366;flex:none}
.wa-float:hover{background:var(--bronze)}
@media (max-width:520px){.wa-float span{display:none}.wa-float{padding:.8rem;border-radius:50%}}

/* ===== FAQ ===== */
.faq{display:grid;border-top:1px solid var(--rule);max-width:52rem}
.faq details{border-bottom:1px solid var(--rule);padding-block:1.1rem}
.faq summary{cursor:pointer;font-family:var(--display);font-size:1.45rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--copper-ink);font-family:var(--body);font-weight:300}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--ink-soft);margin-top:.75rem;max-width:44em}