/* Velaturo — site stylesheet
   Concept: a white gallery wall that lets the paintings carry the colour,
   and a stretcher label (the commission record) as the one signature element. */

@font-face{font-family:"Newsreader";src:url(/assets/fonts/newsreader.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(/assets/fonts/inter.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}


:root{
  --wall:#FFFFFF;
  --linen:#EEEAE1;
  --linen-deep:#E4DFD3;
  --ink:#1A1A18;
  --stone:#6B6A63;
  --rule:#DCD8CE;
  --prussian:#1F3A5F;
  --prussian-deep:#162B47;

  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  --gutter:clamp(1.25rem,4vw,3rem);
  --page:min(1240px,calc(100vw - 2*var(--gutter)));
  --section:clamp(4rem,9vw,7.5rem);
  --measure:62ch;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{margin:0;background:var(--wall);color:var(--ink);font:400 1rem/1.62 var(--sans);letter-spacing:-.006em;font-feature-settings:"tnum" 1,"lnum" 1;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
p{margin:0 0 1em;text-wrap:pretty}
p:last-child{margin-bottom:0}
b,strong{font-weight:600}

/* ---------- type scale ---------- */
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.022em;margin:0;text-wrap:balance;font-variation-settings:"opsz" 72}
h1{font-size:clamp(2.5rem,5.4vw,4.4rem);line-height:1.02}
h2{font-size:clamp(1.9rem,3.4vw,2.8rem);line-height:1.08}
.line{display:block}
h3{font-family:var(--sans);font-weight:600;font-size:1.0625rem;line-height:1.35;letter-spacing:-.012em;margin:0}
.lede{font-size:clamp(1.08rem,1.5vw,1.25rem);line-height:1.5;color:var(--stone);max-width:44ch;margin-top:1.4rem}

/* links inside running text: Prussian underline */
.prose a,.text-link{color:var(--prussian);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.prose a:hover,.text-link:hover{text-decoration-thickness:2px}
.text-link{display:inline-block;font-weight:500;font-size:.95rem}

/* ---------- a11y ---------- */
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:99}
:focus-visible{outline:2px solid var(--prussian);outline-offset:3px}

/* ---------- layout ---------- */
.wrap{width:var(--page);margin-inline:auto}
.narrow{width:var(--page)}

/* long-form sections: one left edge for the whole site, section titles as side-heads */
section.narrow{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:clamp(2rem,6vw,6rem);align-items:start}
section.narrow > *{grid-column:2;max-width:var(--measure)}
section.narrow > h2{grid-column:1;max-width:none;font-size:clamp(1.5rem,2.3vw,1.95rem);line-height:1.15}
section.narrow > h2.sec{margin:0}
section.narrow + section.narrow{padding-top:0}
section.narrow.block:has(+ section.narrow.block){padding-bottom:clamp(2.75rem,5vw,4rem)}

.block{padding-block:var(--section)}
.band{background:var(--linen)}
.sec{margin-bottom:clamp(1.8rem,3vw,2.6rem)}

/* section header: title left, short context right */
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,26rem);gap:1.25rem 3rem;align-items:start;margin-bottom:clamp(2rem,4vw,3.25rem)}
.sec-head p{color:var(--stone);margin:0;padding-top:.55rem}
.sec-head .text-link{margin-top:.8rem}

/* ---------- header ---------- */
.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transition:border-color .2s}
.site.scrolled{border-bottom-color:var(--rule)}
.bar{display:flex;align-items:center;gap:2.25rem;min-height:72px}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;font-family:var(--serif);font-size:1.35rem;letter-spacing:.02em}
.brandmark{width:20px;height:auto;flex:none}
.brandmark.big{width:30px}
.nav{display:flex;gap:1.75rem;margin-left:auto;font-size:.9375rem}
.nav a{text-decoration:none;color:var(--stone);padding:.35rem 0;position:relative}
.nav a:hover,.nav a[aria-current]{color:var(--ink)}
.nav a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--ink)}
.cta-sm{text-decoration:none;font-size:.9375rem;font-weight:500;padding:.6rem 1.15rem;background:var(--prussian);color:#fff;border-radius:2px;white-space:nowrap}
.cta-sm:hover{background:var(--prussian-deep)}
.menu{display:none;background:none;border:0;padding:.6rem;margin-right:-.6rem;cursor:pointer}
.menu span{display:block;width:22px;height:1.5px;background:var(--ink);margin:5px 0}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font:500 1rem/1 var(--sans);padding:1rem 1.6rem;background:var(--prussian);color:#fff;border:1px solid var(--prussian);border-radius:2px;cursor:pointer}
.btn:hover{background:var(--prussian-deep);border-color:var(--prussian-deep)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.hero-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:2.25rem}

/* ---------- inner-page hero ---------- */
.hero{padding:clamp(3.5rem,8vw,6.5rem) 0 clamp(2.5rem,5vw,4rem)}
.hero h1{max-width:20ch}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(2.5rem,6vw,6rem);align-items:end}

/* ---------- the stretcher label (signature element) ---------- */
.record{margin:0;background:var(--linen);color:var(--ink);padding:1.4rem 1.5rem 1.2rem;display:grid;grid-template-columns:auto 1fr;font-size:.875rem}
.record::before{content:attr(data-title);grid-column:1/-1;font-family:var(--serif);font-size:1.3rem;line-height:1;padding-bottom:.9rem;margin-bottom:.35rem;border-bottom:1px solid var(--ink)}
.record:not([data-title])::before{content:none}
.record:not([data-title]){padding-top:.8rem}
.record dt,.record dd{margin:0;padding:.5rem 0;border-bottom:1px solid var(--linen-deep)}
.record dt{color:var(--stone);padding-right:1.25rem}
.record dd{text-align:right;font-weight:500}
.record dt:last-of-type,.record dd:last-of-type{border-bottom:0}
.record-cap{font-size:.8125rem;color:var(--stone);margin-top:.8rem;max-width:40ch}

/* ---------- home hero ---------- */
.home-hero{padding:clamp(2.5rem,5vw,4.5rem) 0 0}
.home-hero .grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,5vw,5rem);align-items:center}
.home-hero h1{font-size:clamp(2.3rem,3.65vw,3.25rem)}
.home-hero .lede{max-width:36ch}
.hero-figure{margin:0;position:relative;padding-bottom:3.5rem}
.hero-figure img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:50% 40%}
.hero-figure .record{position:absolute;left:-2.5rem;bottom:0;width:min(20rem,70%);box-shadow:0 18px 40px -18px rgba(26,26,24,.35)}
.facts{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(3rem,6vw,5rem);border-top:1px solid var(--ink)}
.facts div{padding:1.4rem 1.5rem 0 0}
.facts b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,3vw,2.5rem);line-height:1;margin-bottom:.45rem}
.facts span{font-size:.875rem;color:var(--stone)}

/* ---------- six works in one row ---------- */
.works{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(.9rem,1.6vw,1.4rem)}
.work{text-decoration:none;display:block}
.work .frame{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--linen);margin-bottom:.9rem}
.work .frame img{width:100%;height:100%;object-fit:cover}
.work h3{font-size:.975rem}
.work p{font-size:.84rem;color:var(--stone);margin:.3rem 0 0;line-height:1.45}
.work:hover h3{color:var(--prussian)}
.works-note{margin-top:1.75rem;font-size:.9rem;color:var(--stone);max-width:70ch}

/* ---------- commitments beside the record ---------- */
.commit{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2.5rem,6vw,6rem);align-items:start}
.commit-list{display:grid;grid-template-columns:1fr 1fr;gap:2.25rem 2.5rem;margin-top:2.5rem}
.commit-list h3{margin-bottom:.45rem}
.commit-list p{font-size:.95rem;color:var(--stone)}
.commit > img{width:100%;aspect-ratio:4/5;object-fit:cover}

/* ---------- process: a real sequence, so it is numbered ---------- */
.process{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(1rem,1.8vw,1.5rem);counter-reset:step;list-style:none;margin:0;padding:0}
.process li{counter-increment:step;display:flex;flex-direction:column}
.process .frame{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--linen-deep);margin-bottom:1.1rem}
.process .frame img{width:100%;height:100%;object-fit:cover}
.process h3::before{content:counter(step);display:block;font-family:var(--serif);font-weight:400;font-size:1.6rem;line-height:1;margin-bottom:.6rem;color:var(--prussian)}
.process p{font-size:.9rem;color:var(--stone);margin:.45rem 0 1rem}
.process .when{font-size:.84rem;font-weight:500;margin-top:auto;padding-top:.8rem;border-top:1px solid var(--rule)}

/* ---------- buyers: text index ---------- */
.buyers{display:grid;grid-template-columns:repeat(4,1fr);gap:0 2.5rem;border-top:1px solid var(--rule)}
.buyers a{text-decoration:none;padding:1.35rem 0 1.5rem;border-bottom:1px solid var(--rule)}
.buyers p{font-size:.9rem;color:var(--stone);margin:.35rem 0 0}
.buyers a:hover h3{color:var(--prussian)}

/* ---------- guides + questions side by side ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2.5rem,6vw,6rem)}
.split h2{margin-bottom:1.75rem;font-size:clamp(1.6rem,2.6vw,2.1rem)}
.split .text-link{margin-top:1.5rem}

/* ---------- lists (guides) ---------- */
.list{display:grid;border-top:1px solid var(--rule)}
.list a{display:grid;grid-template-columns:1fr auto;gap:1.5rem;padding:1.35rem 0;border-bottom:1px solid var(--rule);text-decoration:none;align-items:baseline}
.list a:hover h3{color:var(--prussian)}
.list p{margin:.35rem 0 0;color:var(--stone);font-size:.925rem;max-width:58ch}
.list .meta{font-size:.84rem;color:var(--stone);white-space:nowrap}

/* ---------- FAQ ---------- */
.qa-list{border-top:1px solid var(--rule)}
.qa{padding:1.35rem 0;border-bottom:1px solid var(--rule)}
.qa h3{margin-bottom:.4rem}
.qa p{margin:0;color:var(--stone);max-width:var(--measure)}
details.qa{padding:0}
details.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;padding:1.2rem 0;font-weight:600}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary::after{content:"+";font-weight:400;font-size:1.35rem;line-height:1;color:var(--stone)}
details.qa[open] summary::after{content:"\2212"}
details.qa p{padding:0 0 1.3rem}

/* ---------- prose ---------- */
.prose{max-width:var(--measure)}
.prose h2{font-size:clamp(1.6rem,2.6vw,2.05rem);margin:3rem 0 1rem}
.prose > h2:first-child{margin-top:0}
.prose h3{margin:2rem 0 .6rem}
.prose ul,.prose ol{padding-left:1.15rem;margin:0 0 1.2em}
.prose li{margin-bottom:.45em}
.prose li::marker{color:var(--stone)}
.prose table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.925rem}
.prose th,.prose td{text-align:left;padding:.65rem .75rem .65rem 0;border-bottom:1px solid var(--rule);vertical-align:top}
.prose th{font-weight:600;border-bottom-color:var(--ink)}
section.prose{padding-bottom:var(--section);max-width:none}
section.prose > h2{margin:3.25rem 0 0}
section.prose > h2 + *{margin-top:3.25rem}
section.prose > h2:first-child,section.prose > h2:first-child + *{margin-top:0}
section.prose > table{max-width:none}

/* ---------- steps (detail pages) ---------- */
.steps{counter-reset:s;display:grid;border-top:1px solid var(--rule);padding:0;margin:0}
.steps > li{list-style:none;counter-increment:s;display:grid;grid-template-columns:3rem minmax(0,1fr) auto;gap:1.5rem;padding:1.4rem 0;border-bottom:1px solid var(--rule);align-items:baseline}
.steps > li::before{content:counter(s);font-family:var(--serif);font-size:1.6rem;line-height:1;color:var(--prussian)}
.steps p{margin:.35rem 0 0;color:var(--stone);font-size:.95rem;max-width:56ch}
.steps .dur{font-size:.875rem;font-weight:500;white-space:nowrap}

/* ---------- two columns ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:start}
.two > img{width:100%;aspect-ratio:3/2;object-fit:cover}
.two.narrowleft{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}

/* ---------- painters / specimens ---------- */
.painters,.specimens{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.25rem,2.4vw,2rem)}
.specimens{grid-template-columns:repeat(6,1fr)}
.painter img,.specimen img{width:100%;aspect-ratio:1/1;object-fit:cover;margin-bottom:.9rem}
.painter dl,.specimen dl{margin:0;font-size:.84rem}
.painter dl div,.specimen dl div{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;border-bottom:1px solid var(--rule)}
.painter dt,.specimen dt{color:var(--stone)}
.painter dd,.specimen dd{margin:0;font-weight:500;text-align:right}

/* placeholder slots, for pages that still await photography */
.slot{margin:0;aspect-ratio:var(--ratio,4/5);background:var(--linen);display:grid;place-content:center;text-align:center;padding:1rem;gap:.3rem}
.slot span{font-size:.78rem;color:var(--stone)}
.slot em{font-size:.72rem;color:var(--stone);font-style:normal}

/* ---------- closing call to action ---------- */
.closing{background:var(--prussian);color:#fff}
.closing .inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2.5rem;align-items:end;padding-block:clamp(3.5rem,7vw,5.5rem)}
.closing h2{max-width:none}
.closing p{color:rgba(255,255,255,.74);margin:1rem 0 0;max-width:46ch}
.closing .btn{background:#fff;color:var(--prussian);border-color:#fff}
.closing .btn:hover{background:var(--linen);border-color:var(--linen)}
.closing .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.closing .btn.ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.closing .cta-actions{display:flex;gap:.75rem;flex-wrap:wrap}

/* ---------- footer ---------- */
.site-foot{padding-top:clamp(3.5rem,6vw,5rem);font-size:.9375rem}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:2.5rem}
.foot-grid h3{font-size:.875rem;font-weight:500;color:var(--stone);margin-bottom:1rem}
.foot-grid a{display:block;text-decoration:none;padding:.25rem 0;width:fit-content}
.foot-grid a:hover{color:var(--prussian)}
.foot-grid .brand{display:flex;margin-bottom:1.25rem;width:auto}
.boiler{color:var(--stone);max-width:36ch;font-size:.9rem}
.foot-contact{margin-top:1.5rem;font-size:.9rem}
.foot-contact p{color:var(--stone);margin-top:.9rem}
.foot-legal a{color:inherit}
.form-foot p a{color:inherit}
.foot-legal{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:2rem 0 2.25rem;margin-top:clamp(3rem,5vw,4.5rem);border-top:1px solid var(--rule);color:var(--stone);font-size:.84rem}

/* ---------- quote page ---------- */
.quote{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,6vw,6rem);align-items:start;padding-block:clamp(3rem,6vw,5rem) var(--section)}
.quote-intro{position:sticky;top:6.5rem}
.quote-intro h1{font-size:clamp(2.6rem,5vw,4rem)}
.next{list-style:none;counter-reset:n;margin:2.5rem 0 0;padding:0;border-top:1px solid var(--rule)}
.next li{counter-increment:n;display:grid;grid-template-columns:2rem 1fr;gap:.75rem;padding:1rem 0;border-bottom:1px solid var(--rule);font-size:.95rem}
.next li::before{content:counter(n);font-family:var(--serif);font-size:1.3rem;line-height:1.1;color:var(--prussian)}
.next b{font-weight:600;display:block}
.next span{color:var(--stone)}
.direct{margin-top:2.25rem;font-size:.95rem}
.direct a{display:block;width:fit-content;color:var(--prussian);text-underline-offset:.22em;padding:.1rem 0}
.direct p{color:var(--stone);margin-top:1rem;font-size:.875rem}

.form-panel{background:var(--linen);padding:clamp(1.5rem,3.5vw,2.75rem)}
.form{display:grid;gap:2.25rem}
.form fieldset{border:0;margin:0;padding:0;display:grid;gap:1rem;min-width:0}
.form legend{font-family:var(--serif);font-size:1.45rem;line-height:1.1;padding:0;margin-bottom:1.1rem}
.field{display:grid;gap:.4rem}
.field label{font-size:.875rem;font-weight:500}
.field label .opt{font-weight:400;color:var(--stone)}
.field input,.field textarea,.field select{font:inherit;font-size:1rem;width:100%;padding:.8rem .9rem;background:var(--wall);color:var(--ink);border:0;border-radius:2px;box-shadow:inset 0 0 0 1px var(--linen-deep)}
.field input::placeholder,.field textarea::placeholder{color:#9D9A91}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;box-shadow:inset 0 0 0 2px var(--prussian)}
.field textarea{min-height:128px;resize:vertical}
.field select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%231A1A18' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .95rem center;padding-right:2.5rem}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-foot{border-top:1px solid var(--linen-deep);padding-top:1.5rem}
.form-foot .btn{width:100%;padding-block:1.1rem}
.form-foot p{font-size:.84rem;color:var(--stone);margin:.9rem 0 0}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .works{grid-template-columns:repeat(3,1fr);row-gap:2rem}
  .process{grid-template-columns:repeat(3,1fr);row-gap:2.25rem}
  .buyers{grid-template-columns:repeat(2,1fr)}
  .specimens{grid-template-columns:repeat(3,1fr)}
  .nav{gap:1.25rem}
}
@media (max-width:960px){
  .home-hero .grid,.hero-grid,.commit,.split,.quote,.sec-head,section.narrow{grid-template-columns:1fr}
  section.narrow > *{grid-column:1}
  section.narrow > h2{margin-bottom:1.25rem}
  section.prose > h2 + *{margin-top:0}
  .hero-figure .record{left:1rem}
  .quote-intro{position:static}
  .facts{grid-template-columns:repeat(2,1fr)}
  .facts div{padding-bottom:1.2rem}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
  .two,.two.narrowleft{grid-template-columns:1fr}
  .painters{grid-template-columns:repeat(3,1fr)}
  .closing .inner{grid-template-columns:1fr;align-items:start}
  .nav{position:fixed;inset:72px 0 auto;background:var(--wall);border-bottom:1px solid var(--rule);flex-direction:column;gap:0;padding:.5rem var(--gutter) 1.5rem;display:none}
  body.open .nav{display:flex}
  .nav a{padding:.9rem 0;border-bottom:1px solid var(--rule);color:var(--ink)}
  .nav a[aria-current]::after{content:none}
  .menu{display:block;margin-left:auto}
  .cta-sm{display:none}
}
@media (max-width:640px){
  .works,.process,.painters,.specimens{grid-template-columns:repeat(2,1fr)}
  .commit-list,.buyers,.field-row{grid-template-columns:1fr}
  .hero-figure{padding-bottom:0}
  .hero-figure .record{position:relative;left:auto;width:auto;margin:-2.5rem 1rem 0}
  .steps > li{grid-template-columns:2.25rem 1fr;gap:1rem}
  .steps .dur{grid-column:2}
  .foot-grid{grid-template-columns:1fr}
  .list a{grid-template-columns:1fr}
}
/* ============ V20 homepage components ============ */

.facts.words{grid-template-columns:repeat(4,1fr);gap:0 2.5rem}
.facts.words div{padding:1.5rem 0 0}
.facts.words b{font-size:clamp(1.35rem,1.9vw,1.6rem);line-height:1.22;margin-bottom:.6rem;min-height:2.44em;text-wrap:balance}
.facts.words div > span{display:block;font-size:.84rem;line-height:1.5}
@media(max-width:960px){.facts.words{grid-template-columns:1fr 1fr;row-gap:1.5rem}}
@media(max-width:640px){.facts.words{grid-template-columns:1fr;row-gap:0}.facts.words div{padding:1.1rem 0;border-bottom:1px solid var(--rule)}.facts.words b{min-height:0}}
.lines{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.5rem)}
.line-card{text-decoration:none;display:flex;flex-direction:column}
.line-card .frame{display:block;aspect-ratio:4/3;overflow:hidden;margin-bottom:1.25rem}
.line-card .frame img{width:100%;height:100%;object-fit:cover}
.line-card h3{font-family:var(--serif);font-weight:400;font-size:1.75rem;line-height:1.1}
.line-card .for{font-size:.9rem;color:var(--stone);margin:.5rem 0 1rem;min-height:3.2em}
.line-card ul{list-style:none;padding:0;margin:0 0 1.5rem;border-top:1px solid var(--rule)}
.line-card li{padding:.6rem 0;border-bottom:1px solid var(--rule);font-size:.95rem}
.line-card .text-link{margin-top:auto}
.line-card:hover h3{color:var(--prussian)}
@media(max-width:960px){.lines{grid-template-columns:1fr}}

.craft{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2.5rem,6vw,6rem);align-items:center}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.pair figure,.details figure,.team-grid figure{margin:0}
.pair img,.pair .slot{width:100%;aspect-ratio:4/5;object-fit:cover}
.pair .slot{background:var(--linen-deep)}
figcaption{font-size:.84rem;color:var(--stone);margin-top:.6rem}
.details{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2.25rem}
.details img{width:100%;aspect-ratio:1/1;object-fit:cover}
.team{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,6vw,6rem);align-items:center}
.team-quote{font-family:var(--serif);font-size:clamp(1.35rem,2vw,1.65rem);line-height:1.3;margin:2rem 0;padding-left:1.25rem;border-left:2px solid var(--prussian);max-width:30ch}
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.team-grid img{width:100%;aspect-ratio:1/1;object-fit:cover}
.trial{list-style:none;counter-reset:t;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0 2rem;border-top:1px solid var(--ink)}
.trial li{counter-increment:t;padding-top:1.4rem}
.trial h3::before{content:counter(t);display:block;font-family:var(--serif);font-weight:400;font-size:1.6rem;line-height:1;color:var(--prussian);margin-bottom:.7rem}
.trial p{font-size:.93rem;color:var(--stone);margin-top:.45rem}
.ship{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:clamp(3rem,5vw,4rem);padding-top:2rem;border-top:1px solid var(--rule)}
.ship p{font-size:.93rem;color:var(--stone);margin-top:.4rem}
@media(max-width:960px){.craft,.team{grid-template-columns:1fr}.trial{grid-template-columns:1fr 1fr;row-gap:2rem}.ship{grid-template-columns:1fr}}
@media(max-width:640px){.trial{grid-template-columns:1fr}}

.terms{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem)}
.terms h3{font-family:var(--serif);font-weight:400;font-size:1.6rem;padding-bottom:.9rem;border-bottom:1px solid var(--ink)}
.terms ul{list-style:none;padding:0;margin:0}
.terms li{padding:.95rem 0;border-bottom:1px solid var(--rule)}
.small-lede{color:var(--stone);margin:0 0 1rem}
@media(max-width:960px){.terms{grid-template-columns:1fr}}

/* ============ V21 product-line pages ============ */

.pairs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.5rem)}
.pairs .pair{gap:.6rem}
.subjects{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.5rem)}
.subjects figure{margin:0}.subjects img{width:100%;aspect-ratio:4/5;object-fit:cover}
.subjects figcaption{font-size:.9rem;color:var(--stone);margin-top:.8rem}
.subjects figcaption b{display:block;font-size:1.0625rem;color:var(--ink);font-weight:600;margin-bottom:.2rem}
.commit-list.four{grid-template-columns:repeat(4,1fr);margin-top:0}
.sizes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,26rem);gap:1.25rem 3rem;align-items:start}
.sizes table{width:100%;border-collapse:collapse;font-size:.95rem}
.sizes th,.sizes td{text-align:left;padding:.8rem 1rem .8rem 0;border-bottom:1px solid var(--linen-deep)}
.sizes th{font-weight:600;border-bottom-color:var(--ink)}
.formats{display:grid;gap:1.6rem}.formats p{color:var(--stone);font-size:.95rem;margin-top:.35rem}
.hero-grid .record{align-self:end}
@media(max-width:1080px){.commit-list.four{grid-template-columns:1fr 1fr}}
@media(max-width:960px){.pairs,.sizes{grid-template-columns:1fr}.subjects{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.commit-list.four{grid-template-columns:1fr}}

.designs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.designs figure{margin:0}.designs img{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--linen)}
.designs figcaption{font-size:.875rem;color:var(--stone);margin-top:.6rem}
.designs figcaption b{display:block;color:var(--ink);font-weight:600;font-size:.95rem}
.stance{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,26rem);gap:1.25rem 3rem;align-items:start}
.stance blockquote{margin:0;font-family:var(--serif);font-size:clamp(1.9rem,3.4vw,2.8rem);line-height:1.12;max-width:22ch}
.stance p{color:var(--stone);padding-top:.55rem}
@media(max-width:960px){.designs{grid-template-columns:1fr 1fr}.stance{grid-template-columns:1fr}}

/* ============ V22 interiors ============ */

.kinds{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,2.5rem)}
.kinds img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:1.25rem}
.kinds h3{font-family:var(--serif);font-weight:400;font-size:1.75rem;line-height:1.1}
.kinds .for{font-size:.9rem;color:var(--stone);margin:.5rem 0 1rem}
.kinds ul{list-style:none;padding:0;margin:0;border-top:1px solid var(--linen-deep)}
.kinds li{padding:.65rem 0;border-bottom:1px solid var(--linen-deep);font-size:.95rem}
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.25rem,2.5vw,2rem)}
.case{text-decoration:none;display:block}
.case .slot,.case .poster{display:block;margin-bottom:1rem}
.case h3{margin-bottom:.6rem}
.case dl{margin:0;display:grid;grid-template-columns:auto 1fr;font-size:.875rem;border-top:1px solid var(--rule)}
.case dt,.case dd{margin:0;padding:.45rem 0;border-bottom:1px solid var(--rule)}
.case dt{color:var(--stone);padding-right:1rem}.case dd{text-align:right;font-weight:500}
.case.video p{font-size:.9rem;color:var(--stone);margin-top:.35rem}
.poster{position:relative}.poster img{width:100%;aspect-ratio:4/3;object-fit:cover}
.play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.92)}
.play::after{content:"";position:absolute;left:26px;top:20px;border-style:solid;border-width:12px 0 12px 19px;border-color:transparent transparent transparent var(--prussian)}
.case.video:hover h3{color:var(--prussian)}
@media(max-width:960px){.kinds,.cases{grid-template-columns:1fr}}


/* ============ V23 studio ============ */
.tabs{border-bottom:1px solid var(--rule)}
.tabs .wrap{display:flex;gap:2.25rem;overflow-x:auto;scrollbar-width:none}
.tabs a{padding:1.05rem 0;text-decoration:none;color:var(--stone);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;font-size:.95rem}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-current]{color:var(--ink);border-bottom-color:var(--ink)}
.hero:has(+ .tabs){padding-bottom:clamp(2rem,4vw,3rem)}
.timeline{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.timeline li{display:grid;grid-template-columns:12rem minmax(0,1fr);gap:1.5rem;padding:1.4rem 0;border-bottom:1px solid var(--rule);align-items:baseline}
.timeline b{font-family:var(--serif);font-weight:400;font-size:1.5rem;line-height:1;color:var(--prussian)}
.timeline p{color:var(--stone);margin:.35rem 0 0}
.band .stance{padding-block:var(--section)}
@media(max-width:640px){.timeline li{grid-template-columns:1fr;gap:.5rem}}


/* ============ V25 quote form ============ */
.chips{gap:.9rem!important}
.chips legend{font-family:var(--sans);font-size:.875rem;font-weight:500;margin-bottom:.7rem}
.chip-row{display:flex;flex-wrap:wrap;gap:.55rem}
.chip-row label{position:relative;cursor:pointer}
.chip-row input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip-row span{display:inline-block;padding:.62rem 1.05rem;background:var(--wall);border-radius:999px;box-shadow:inset 0 0 0 1px var(--linen-deep);font-size:.95rem;transition:background .15s,color .15s,box-shadow .15s}
.chip-row label:hover span{box-shadow:inset 0 0 0 1px var(--ink)}
.chip-row input:checked+span{background:var(--prussian);color:#fff;box-shadow:none}
.chip-row input:focus-visible+span{outline:2px solid var(--prussian);outline-offset:2px}
.excl{display:none;align-items:center;gap:.6rem;font-size:.9rem}
.excl input{width:1.05rem;height:1.05rem;accent-color:var(--prussian)}
.form:has(input[value="Original series"]:checked) .excl{display:flex}
.form{gap:1.5rem}

/* utilities (replace inline styles so a strict CSP can be used) */
.pt-s{padding-top:clamp(2.5rem,5vw,4rem)!important}.pt-0{padding-top:0!important}.pt-section{padding-top:var(--section)!important}
.pb-0{padding-bottom:0!important}.mt-2{margin-top:2rem}.mw-none{max-width:none!important}
.legal-note{font-size:.8125rem;color:var(--stone)}

.three{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.three > img{width:100%;aspect-ratio:3/2;object-fit:cover}
.spaces{margin-top:clamp(2.5rem,5vw,4rem)}
.spaces img{aspect-ratio:3/2!important}
.crate{padding-bottom:clamp(2rem,4vw,3rem)}
.crate img{width:100%;aspect-ratio:21/9;object-fit:cover}
@media(max-width:960px){.three{grid-template-columns:1fr}}

.kicker{font-size:.875rem;margin:0 0 1rem}
.kicker a{color:var(--prussian);text-decoration:none}
.kicker a:hover{text-decoration:underline}
.read{font-size:.875rem;color:var(--stone);margin-top:1rem}
.hero .lede a{color:var(--prussian)}
.qa p a{color:var(--prussian);text-underline-offset:.2em}

.buyer-hero{padding:clamp(2.5rem,5vw,4.5rem) 0 clamp(1rem,2vw,1.5rem)}
.buyer-hero .grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,5vw,5rem);align-items:center}
.buyer-hero h1{font-size:clamp(2.4rem,4.4vw,3.8rem)}
.buyer-hero img{width:100%;aspect-ratio:3/2;object-fit:cover}
.buyer-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,24rem);gap:clamp(2rem,5vw,5rem);align-items:start}
.buyer-split h2{margin-bottom:1.75rem}
@media(max-width:960px){.buyer-hero .grid,.buyer-split{grid-template-columns:1fr}}

/* serif at smaller display sizes: medium optical size */
.facts b,.facts.words b,.line-card h3,.kinds h3,.team-quote,.stance blockquote,.record::before,.terms h3,.form legend,.timeline b,.brand,.split h2,section.narrow > h2,.process h3::before,.steps > li::before,.next li::before{font-variation-settings:"opsz" 36}
.brand{letter-spacing:.01em}

/* V34 refinements */
.promise{font-size:.84rem;color:var(--stone);margin:1rem 0 0;letter-spacing:0}
.form-foot .promise{margin-top:.9rem}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.cta-sm[aria-current]{background:transparent;color:var(--prussian);box-shadow:inset 0 0 0 1px var(--prussian)}
.kicker a{display:inline-block;padding:.5rem 0}
.hero .lede a,.qa p a{display:inline-block;padding:.2rem 0}
@media(max-width:640px){.tabs .wrap{gap:1.35rem}.tabs a{font-size:.9rem}}

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

/* ===== inline enquiry form (v36) ===== */
.vq{background:var(--canvas,#F5F1E8);border-top:1px solid var(--line,#DCD7CC);border-bottom:1px solid var(--line,#DCD7CC);padding:clamp(2.5rem,5vw,4rem) 0}
.vq-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,4vw,3.5rem);align-items:start}
.vq h2{margin:0 0 .8rem}
.vq-left p{color:var(--grey,#6E6B64);margin:0 0 1.2rem;max-width:42ch}
.vq-points{list-style:none;padding:0;margin:0;border-top:1px solid var(--line,#DCD7CC)}
.vq-points li{padding:.6rem 0;border-bottom:1px solid var(--line,#DCD7CC);font-size:.92rem}
.vq-form{display:grid;gap:1rem}
.vq-form [name="_gotcha"]{position:absolute;left:-9999px}
.vq-field{display:grid;gap:.35rem}
.vq-field label{font-size:.88rem;color:var(--grey,#6E6B64)}
.vq-field label span{opacity:.75}
.vq-field input[type=email],.vq-field textarea{font:inherit;font-size:.95rem;padding:.7rem .8rem;border:1px solid var(--line,#DCD7CC);background:#FCFBF8;color:inherit;border-radius:0;width:100%}
.vq-field input[type=email]:focus,.vq-field textarea:focus{border-color:currentColor;outline:2px solid transparent}
.vq-field textarea{resize:vertical;min-height:110px}
.vq-file input[type=file]{font:inherit;font-size:.86rem;padding:.55rem;border:1px dashed #C9C2B4;background:#FCFBF8;width:100%}
.vq-hint{font-size:.8rem;color:var(--grey,#6E6B64);margin:.4rem 0 0;line-height:1.5}
.vq-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.82rem;color:var(--grey,#6E6B64);line-height:1.5}
.vq-consent input{margin-top:.2rem;flex:none}
.vq-btn{font:inherit;font-size:.95rem;padding:.8rem 1.6rem;background:#1C1B19;color:#FCFBF8;border:1px solid #1C1B19;cursor:pointer;justify-self:start}
.vq-btn:hover{background:#6B4A2F;border-color:#6B4A2F}
.vq-foot{font-size:.82rem;color:var(--grey,#6E6B64);margin:.2rem 0 0}
@media(max-width:860px){.vq-wrap{grid-template-columns:1fr}}

/* ===== image cropping fixes (v39) ===== */
/* Category cards: subjects (pets, people) sit in the upper part of the frame.
   Anchor the crop near the top so faces are never cut. Landscape images in a
   4:3 box have no vertical overflow, so this rule does not affect them. */
.line-card .frame img{object-position:50% 14%}

/* Product grid: never crop a painting. A painting is a composed whole; a buyer
   choosing designs must see all of it. Portrait designs (4:5) fill the frame
   exactly; landscape designs are shown whole on a linen mat. */
.designs img{object-fit:contain;object-position:50% 50%;padding:0;box-sizing:border-box}

/* Packing scene: keep the gloved hand at upper left in frame. */
img[src*="shipping-crate-01"]{object-position:50% 40%}

/* ===== utility classes (v42) — replaces inline styles blocked by CSP ===== */
.u-tight{margin:-.3rem 0 .2rem}
.u-consent-gap{margin:.4rem 0 1rem}
.u-field-gap{margin:.6rem 0 1rem}
.u-mt1{margin-top:1rem}
.u-mt12{margin-top:1.2rem}
.u-mt2{margin-top:2rem}

/* Keep a compact quote button on mobile (was hidden below 960px) */
@media (max-width:960px){
  .cta-sm{display:inline-flex !important;padding:.45rem .8rem;font-size:.85rem;margin-left:auto;margin-right:.6rem}
}
@media (max-width:360px){ .cta-sm{padding:.4rem .6rem;font-size:.8rem} }

/* v43: new illustrated logo */
.brand .brandmark{width:auto;height:44px;display:block}
.brand > span{text-transform:uppercase;letter-spacing:.16em;font-size:1.2rem}
.foot-brand .brand-vertical{display:inline-block;margin-bottom:1.25rem;line-height:0}
.foot-brand .brand-vertical img{width:210px;height:auto;display:block}
@media(max-width:640px){.brand .brandmark{height:38px}.brand > span{font-size:1.05rem;letter-spacing:.13em}}


/* v43: social links + floating WhatsApp */
.foot-social{display:flex;gap:1.1rem;margin-top:.9rem}
.foot-social a{display:inline-flex;align-items:center;gap:.45rem}
.foot-social svg{width:18px;height:18px;flex:none;fill:currentColor}
.wa-float{position:fixed;right:calc(1.25rem + env(safe-area-inset-right,0px));bottom:calc(1.25rem + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.18);text-decoration:none;transition:transform .2s,box-shadow .2s}
.wa-float:hover,.wa-float:focus-visible{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.22)}
.wa-float:focus-visible{outline:2px solid var(--prussian);outline-offset:3px}
.wa-float svg{width:30px;height:30px;fill:#fff}
body.open .wa-float{display:none}
@media(max-width:640px){.wa-float{width:52px;height:52px;right:calc(1rem + env(safe-area-inset-right,0px));bottom:calc(1rem + env(safe-area-inset-bottom,0px))}.wa-float svg{width:28px;height:28px}}
@media (prefers-reduced-motion:reduce){.wa-float{transition:none}}
@media print{.wa-float{display:none}}
.brand picture{display:block;flex:none;line-height:0}
.foot-legal{padding-right:76px}
@media(max-width:640px){.brand{gap:.5rem}.brand .brandmark{height:32px}.brand > span{font-size:.92rem;letter-spacing:.06em}}
.brand{flex:none}

/* v45: header separation */
.site{border-bottom:1px solid var(--rule);transition:box-shadow .25s,background-color .25s,border-color .25s}
.site.scrolled{background:rgba(255,255,255,.97);border-bottom-color:transparent;box-shadow:0 1px 0 var(--rule),0 8px 24px -12px rgba(22,43,71,.28)}
@media(min-width:961px){
  .bar{transition:min-height .25s}
  .brand .brandmark{transition:height .25s}
  .site.scrolled .bar{min-height:60px}
  .site.scrolled .brand .brandmark{height:36px}
}
@media (prefers-reduced-motion:reduce){.site,.bar,.brand .brandmark{transition:none}}

/* v45: footer, five balanced columns */
.site-foot{padding-top:clamp(2.75rem,4.5vw,4rem);border-top:1px solid var(--rule)}
.foot-grid{grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,.9fr)) minmax(0,1.2fr);gap:2.25rem}
.foot-brand .brand-vertical{margin-bottom:1rem}
.foot-brand .brand-vertical img{width:170px}
.foot-brand .boiler{color:var(--stone);font-size:.875rem;max-width:30ch}
.foot-contact{margin-top:0;font-size:.9375rem}
.foot-contact .ci{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.foot-contact .ci a{display:flex;align-items:flex-start;gap:.65rem;padding:0;width:auto}
.foot-contact .ci span{display:flex;flex-direction:column;line-height:1.3}
.foot-contact .ci small{font-size:.8125rem;color:var(--stone);margin-top:.1rem;white-space:nowrap}
.foot-contact .ci a:hover small{color:var(--prussian)}
.foot-contact .ic{width:18px;height:18px;flex:none;color:var(--prussian);margin-top:.1rem}
.foot-contact .ci-note{display:flex;gap:.65rem;align-items:flex-start;color:var(--stone);font-size:.8125rem;line-height:1.45;margin-top:1rem}
.foot-contact .ci-note + .ci-note{margin-top:.6rem}
.foot-contact .ci-note .ic{width:16px;height:16px;color:var(--stone);margin-top:.15rem}
.foot-legal{margin-top:clamp(2.5rem,4vw,3.5rem)}
@media(max-width:1080px){.foot-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.foot-brand{grid-column:1/-1;display:flex;align-items:center;gap:2rem}.foot-brand .brand-vertical{margin-bottom:0}}
@media(max-width:960px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.foot-grid{grid-template-columns:1fr 1fr;gap:2rem 1.5rem}.foot-brand{flex-direction:column;align-items:flex-start;gap:1rem}.foot-brand .brand-vertical img{width:150px}.foot-contact{grid-column:1/-1}}

/* v45: contact page, tighter gap above footer */
.quote{padding-bottom:clamp(3rem,6vw,4.5rem)}
.foot-contact .nw{display:inline;white-space:nowrap}

/* v46: on phones narrower than 400px the illustration is unreadable and the header cannot fit both;
   keep the wordmark so new visitors can still read the brand. */
@media(max-width:400px){.brand picture{display:none}}
@media(max-width:340px){.bar{gap:.75rem}.cta-sm{padding:.4rem .6rem !important;font-size:.8rem !important;margin-right:.3rem !important}}