/* Lewis Ink — site layer v2 (2026-09-10 evening): the $15-20k upgrade. Sits on kit.css + palette.css + motion.css.
   Research behind each move: DESIGN-BRIEF.md and client-site-design/reference/families/11-tattoo-studios.md.
   The kit floors are untouched: header 100/86px, body 17px, secondary 15px, labels 11px, taps 44px. */

/* ── 1. type: Cormorant 300 display, Geist text, Geist Mono for every small label ── */
body{font-family:var(--sans)}
h1,h2,h3,h4,.dhead,.pbanner h1{font-family:var(--serif);font-weight:300;letter-spacing:-.005em}
.h-display,.hero h1{font-weight:300;letter-spacing:-.012em;line-height:1}
.hero h1{font-size:var(--display);max-width:11ch}
@media(max-width:640px){.hero h1{font-size:clamp(2.6rem,11.5vw,3.6rem)}}
.hero h1 em,.h-display em,.aname-xl em,.pbanner h1 em{font-style:italic;font-weight:300;color:var(--lume-hot)}
.eyebrow,.crumbs,.gcap,.lb-cap,.lb-n,.fld label,.lab,.hrow .d,.hrow .t,.astyle,.an,.mno,.cno,.sn,.facts-m li,.hcite,.aud,
.aud-s,.cp-count,.chip,.opt-c span,.opt i,.mfoot .k,.foot h4,.fbot,.tlink,.iline .k,.astyle-m,.csteps span,.care-idx li span{font-family:var(--mono)}
.eyebrow{font-size:12.5px;letter-spacing:.14em;font-weight:500;color:var(--lume)}
.btn{font-family:var(--sans);letter-spacing:.09em;text-transform:uppercase;font-weight:500}
.pull blockquote{font-weight:300}
.brand .w1{font-weight:400;letter-spacing:.2em;text-transform:uppercase}
.brand .w2{font-family:var(--mono);letter-spacing:.14em;font-size:10.5px;text-transform:uppercase}
.brand .mk,.chathead .mk{color:var(--mark)}

/* the quiet second action: texting stays one tap away without a second button verb */
.btns{align-items:center}
.tlink{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 2px;font-size:13.5px;letter-spacing:.05em;
  color:var(--lume-hot);text-decoration:underline;text-decoration-color:rgba(201,184,163,.45);text-underline-offset:5px;
  text-decoration-thickness:1px;transition:color .2s,text-decoration-color .2s}
.tlink:hover{color:#fff;text-decoration-color:currentColor}
.tlink .arw{transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.tlink:hover .arw{transform:translateX(4px)}

/* ── 2. header: mark, one CTA, MENU (navMin on every page) ── */
.burger{width:auto;min-width:52px;padding:0 16px 0 14px;gap:12px;border-radius:var(--btn-r)}
.burger .bl{font-family:var(--mono);font-weight:500;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:#FBF8F1}
.burger .bl i{font-style:normal}
.burger .bl .c{display:none}
body.menu-open .burger .bl .o{display:none}
body.menu-open .burger .bl .c{display:inline}
@media(max-width:420px){.burger .bl{display:none}.burger{padding:0;width:52px}}
body.dark-top .nav{background:linear-gradient(180deg,rgba(11,11,12,.82) 0%,rgba(11,11,12,.34) 100%)}
body.menu-open .nav{background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}

/* ── 3. the full-screen menu (kit drawer, restyled): huge serif links, a preview, the studio at the foot ── */
body.nav-min .drawer.menu{display:block;inset:0;max-height:none;height:100dvh;padding:calc(var(--nav-h) + 20px) 0 30px;
  transform:none;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility 0s linear .4s;background:rgba(11,11,12,.988);
  border:0;box-shadow:none;overflow-y:auto;overscroll-behavior:contain}
body.menu-open .drawer.menu{opacity:1;visibility:visible;transition:opacity .4s ease}
body.menu-open{overflow:hidden}
.menu-in{display:grid;grid-template-columns:1.45fr 1fr;grid-template-rows:1fr auto;gap:28px 64px;min-height:100%}
.mlist{display:flex;flex-direction:column;justify-content:center}
.drawer.menu a.ml{display:flex;align-items:baseline;gap:22px;border-bottom:1px solid var(--edge);padding:12px 0;
  font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,5vw,4.3rem);line-height:1.06;color:#FBF8F1;text-decoration:none;
  transition:color .25s,padding-left .35s cubic-bezier(.2,.7,.3,1)}
.drawer.menu a.ml:hover,.drawer.menu a.ml:focus-visible{color:var(--lume-hot);padding-left:14px}
.drawer.menu a.ml[aria-current]{color:var(--lume-hot)}
.ml .mno{font-size:12.5px;letter-spacing:.14em;color:var(--lume-2);min-width:2.4em;transform:translateY(-.9em)}
.mprev{margin:0;align-self:center;aspect-ratio:4/5;max-height:62vh;border:1px solid var(--edge);overflow:hidden;background:var(--panel-2)}
.mprev img{width:100%;height:100%;object-fit:cover;transition:opacity .3s ease}
.mprev img.swap{opacity:.2}
.mfoot{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr) auto;gap:22px 40px;align-items:end;border-top:1px solid var(--edge);padding-top:24px}
.mfoot .k{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--lume);margin-bottom:6px}
.mfoot p{margin:0;font-size:15px;line-height:1.75;color:var(--txt-2)}
.drawer.menu .mfoot p a{display:inline-block;border:0;padding:14px 0;margin:-10px 0;font-family:var(--sans);font-size:15px;color:#FBF8F1}
.drawer.menu .dbtns{margin:0;display:flex;gap:12px}
.drawer.menu .dbtns .btn{width:auto}
@media(max-width:1000px){.menu-in{grid-template-columns:1fr}.mprev{display:none}.mfoot{grid-template-columns:1fr 1fr}
  .drawer.menu .dbtns{grid-column:1/-1;flex-direction:column}.drawer.menu .dbtns .btn{width:100%}}
@media(max-width:560px){.mfoot{grid-template-columns:1fr}.drawer.menu a.ml{font-size:clamp(2rem,9.5vw,2.8rem);padding:10px 0}}

/* ── 4. the monogram draws itself once in the home hero (static under reduced motion) ── */
.hmark{width:clamp(64px,7vw,92px);color:var(--lume-hot);margin-bottom:26px}
.hmark .mk{width:100%;height:auto;display:block}
@media (prefers-reduced-motion:no-preference){
  .mk-draw .mk-r,.mk-draw .mk-l,.mk-draw .mk-i{stroke-dasharray:1;stroke-dashoffset:1;animation:mk-draw 1.8s cubic-bezier(.6,.1,.2,1) .15s forwards}
  .mk-draw .mk-l{animation-delay:.6s}.mk-draw .mk-i{animation-delay:.9s}
  .mk-draw .mk-d{opacity:0;animation:mk-dot .5s ease 1.7s forwards}
}
@keyframes mk-draw{to{stroke-dashoffset:0}}
@keyframes mk-dot{to{opacity:1}}
.fseal{width:72px;color:var(--lume);opacity:.9;margin:0 0 clamp(34px,4vw,54px)}
.fseal .mk{width:100%;height:auto;display:block}

/* ── 5. hero: the split wall, one line of names in mono, the photo settling as you scroll ── */
.hline{display:flex;flex-wrap:wrap;gap:6px 28px;margin:24px 0 0;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2);font-family:var(--mono)}
.hero .btns{margin-top:34px}
@media(min-width:900px){
  .hero.wall{display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch;padding:0;min-height:min(94dvh,920px)}
  .hero.wall .hero-img{position:relative;inset:auto;grid-column:2;grid-row:1;min-height:100%;overflow:hidden}
  .hero.wall .hero-img img{object-position:50% 40%}
  .hero.wall .hero-img::after{background:
    linear-gradient(180deg,rgba(11,11,12,.96) 0%,rgba(11,11,12,.62) 11%,rgba(11,11,12,0) 30%),
    linear-gradient(90deg,var(--ground) 0%,rgba(11,11,12,.55) 14%,rgba(11,11,12,0) 42%),
    linear-gradient(0deg,rgba(11,11,12,.5) 0%,rgba(11,11,12,0) 38%)}
  .hero.wall .hero-in{grid-column:1;grid-row:1;align-self:end;width:auto;margin:0;
    padding:calc(var(--nav-h) + 80px) 40px 84px max(22px,calc((100vw - var(--wrap)) / 2))}
}
@supports (animation-timeline: scroll()){@media (prefers-reduced-motion:no-preference){
  .hero-img img{animation:settle linear both;animation-timeline:scroll(root);animation-range:0px 90vh}
}}
@keyframes settle{from{scale:1.06}to{scale:1}}

/* ── 6. the artist index: the names are the navigation; a portrait follows the pointer on desktop ── */
[hidden]{display:none!important}
.aidx{margin-top:clamp(28px,4vw,52px);border-top:1px solid var(--edge)}
.arow{display:grid;grid-template-columns:52px 72px minmax(0,1fr) auto 36px;align-items:center;gap:22px;padding:20px 0;
  border-bottom:1px solid var(--edge);text-decoration:none;color:#FBF8F1;
  transition:opacity .35s ease,padding-left .45s cubic-bezier(.2,.7,.3,1)}
.arow .an{font-size:12.5px;letter-spacing:.12em;color:var(--lume-2)}
.athumb{display:block;width:72px;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--edge);background:var(--panel-2)}
.athumb img{width:100%;height:100%;object-fit:cover;display:block}
.aname{font-family:var(--serif);font-weight:300;font-size:clamp(2.4rem,6.2vw,5.6rem);line-height:1.02;letter-spacing:-.012em;transition:color .3s ease}
.astyle{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-2);text-align:right}
.arow .arw{font-size:24px;color:var(--lume);transition:transform .4s cubic-bezier(.2,.7,.3,1)}
.arow:hover .aname,.arow:focus-visible .aname{color:var(--lume-hot);font-style:italic}
.arow:hover .arw,.arow:focus-visible .arw{transform:translateX(6px)}
@media (hover:hover) and (pointer:fine){.aidx:hover .arow:not(:hover){opacity:.42}.arow:hover{padding-left:12px}}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) and (min-width:900px){
  .arow{grid-template-columns:52px minmax(0,1fr) auto 36px}.arow .athumb{display:none}}
@media(max-width:700px){
  .arow{grid-template-columns:64px minmax(0,1fr) 24px;grid-template-areas:"t n a" "t s a";gap:4px 16px;padding:16px 0}
  .arow .an{display:none}
  .arow .athumb{grid-area:t;width:64px}
  .aname{grid-area:n;font-size:clamp(1.9rem,8.4vw,2.7rem);align-self:end}
  .astyle{grid-area:s;text-align:left;font-size:12px;align-self:start}
  .arow .arw{grid-area:a;font-size:20px}
}
.plate-s{display:grid;place-items:center;background:radial-gradient(120% 90% at 20% 10%,rgba(201,184,163,.2),transparent 60%),var(--panel-2)}
.plate-s span{font-family:var(--serif);font-weight:300;font-size:1.9rem;line-height:1;color:var(--lume)}

/* the portrait that follows the pointer, and the View ring (mouse only; site.js skips both under reduced motion) */
.cprev{position:fixed;left:0;top:0;z-index:60;width:clamp(200px,17vw,260px);aspect-ratio:4/5;pointer-events:none;opacity:0;
  overflow:hidden;border:1px solid var(--edge-hot);box-shadow:0 40px 80px -30px rgba(0,0,0,.9);transition:opacity .25s ease;will-change:transform}
.cprev.on{opacity:1}
.cprev img{width:100%;height:100%;object-fit:cover;display:block}
.cring{position:fixed;left:0;top:0;z-index:85;width:78px;height:78px;border-radius:50%;pointer-events:none;display:grid;place-items:center;
  border:1px solid rgba(227,214,196,.75);background:rgba(11,11,12,.28);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:0;scale:.5;transition:opacity .2s ease,scale .3s cubic-bezier(.2,.7,.3,1)}
.cring span{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#FBF8F1}
.cring.on{opacity:1;scale:1}
@media not all and (hover:hover) and (pointer:fine){.cprev,.cring{display:none}}
@media (prefers-reduced-motion:reduce){.cprev,.cring{display:none}}
body.lb-open .cring,body.menu-open .cring,body.menu-open .cprev{display:none}

/* ── 7. "Large by design": pinned and moved sideways by the page's own scroll on desktop (CSS scroll-driven, no library).
   Phones, reduced motion and browsers without scroll timelines get a native swipe row with snap points. ── */
.reel{position:relative;background:var(--ground);border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}
.reel-pin{padding:clamp(64px,8vw,110px) 0}
.reel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;margin-bottom:clamp(28px,3.4vw,44px)}
.reel-head .dhead{margin:0}
.reel-track{display:flex;gap:clamp(14px,1.8vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
  padding:0 max(22px,calc((100vw - var(--wrap)) / 2)) 6px;scroll-padding-inline:max(22px,calc((100vw - var(--wrap)) / 2));scrollbar-width:none}
.reel-track::-webkit-scrollbar{display:none}
.rtile{position:relative;display:block;flex:0 0 auto;width:min(72vw,360px);aspect-ratio:4/5;overflow:hidden;scroll-snap-align:start;
  border:1px solid var(--edge);background:var(--panel-2)}
.rtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.3,1)}
.rtile:hover img{transform:scale(1.035)}
@supports (animation-timeline: view()){
  @media (min-width:900px) and (min-height:620px) and (prefers-reduced-motion:no-preference){
    .reel{height:340vh;view-timeline-name:--reel;view-timeline-axis:block}
    .reel-pin{position:sticky;top:0;height:100vh;padding:calc(var(--nav-h) + 8px) 0 40px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
    .reel-track{overflow:visible;scroll-snap-type:none;width:max-content;align-items:center;
      animation:reel-x linear both;animation-timeline:--reel;animation-range:contain 0% contain 100%}
    .rtile{width:auto;height:min(58vh,560px)}
    .rtile:nth-child(even){height:min(46vh,440px)}
  }
}
@keyframes reel-x{from{transform:translateX(0)}to{transform:translateX(calc(-100% + 100vw))}}

/* ── 8. healed: Owen's own caption, set large ── */
.healed .hq{margin:18px 0 0;font-family:var(--serif);font-weight:300;font-style:italic;font-size:clamp(1.8rem,3.3vw,2.8rem);
  line-height:1.16;color:#FBF8F1;max-width:22ch;text-wrap:balance}
.hcite{margin:20px 0 0;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--lume);line-height:1.7}
.healed .lede{margin-top:22px}
.healed .tlink{margin-top:12px}
.aud{margin:26px 0 0;text-align:center;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--txt-2)}

/* ── 9. create your piece: the five steps as one numbered row ── */
.csteps{list-style:none;margin:0 0 clamp(34px,4vw,48px);padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--edge)}
.csteps li{position:relative;padding:28px 20px 0 0;font-family:var(--serif);font-weight:300;font-size:clamp(1.3rem,1.9vw,1.65rem);line-height:1.2;color:#FBF8F1}
.csteps li::before{content:'';position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--lume);box-shadow:0 0 14px rgba(201,184,163,.7)}
.csteps span{display:block;font-size:12.5px;letter-spacing:.14em;color:var(--lume);margin-bottom:14px}
@media(max-width:900px){.csteps{grid-template-columns:1fr;border-top:0}
  .csteps li{display:grid;grid-template-columns:52px 1fr;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--edge)}
  .csteps li:first-child{border-top:1px solid var(--edge)}
  .csteps li::before{display:none}.csteps span{margin:0}}

/* ── 10. finding us ── */
.fsteps{list-style:none;counter-reset:f;margin:22px 0 0;padding:0}
.fsteps li{counter-increment:f;position:relative;padding:14px 0 14px 46px;border-top:1px solid var(--edge);font-size:17px;line-height:1.6;color:var(--txt)}
.fsteps li:last-child{border-bottom:1px solid var(--edge)}
.fsteps li::before{content:counter(f,decimal-leading-zero);position:absolute;left:0;top:17px;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;color:var(--lume)}
.fsteps b{color:#fff;font-weight:500}

/* ── 11. artists: display names, facts in mono, the portrait that carries into the artist's own page ── */
.dname{font-family:var(--serif);font-weight:300;font-size:clamp(3rem,6.6vw,5.8rem);line-height:.94;letter-spacing:-.014em;margin:12px 0 0;color:#FBF8F1}
.facts-m{list-style:none;margin:26px 0 0;padding:0;max-width:460px}
.facts-m li{display:flex;align-items:center;gap:14px;padding:13px 0;border-top:1px solid var(--edge);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--txt)}
.facts-m li:last-child{border-bottom:1px solid var(--edge)}
.facts-m li::before{content:'';flex:0 0 5px;width:5px;height:5px;border-radius:50%;background:var(--lume)}
.vt-owen{view-transition-name:art-owen}
.vt-kevin{view-transition-name:art-kevin}
.ahero{position:relative;overflow:hidden;margin-top:calc(-1 * var(--nav-h));
  padding:calc(var(--nav-h) + clamp(34px,5vw,72px)) 0 clamp(56px,7vw,104px);
  background:radial-gradient(55% 70% at 88% 30%,rgba(201,184,163,.12),transparent 70%),radial-gradient(40% 50% at 0% 100%,rgba(154,163,173,.08),transparent 70%),var(--ground)}
.ahero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,5vw,84px);align-items:end}
.aname-xl{margin:10px 0 0;font-family:var(--serif);font-weight:300;font-size:clamp(4rem,10vw,9.6rem);line-height:.86;letter-spacing:-.022em;color:#FBF8F1}
.aname-xl em{display:inline-block;padding-left:.42em}
.astyle-m{margin:26px 0 0;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--lume)}
.ahero .btns{margin-top:30px}
.ah-img{position:relative;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--edge);background:var(--panel-2);box-shadow:0 50px 100px -50px rgba(0,0,0,.95)}
.ah-img img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:900px){.ahero-in{grid-template-columns:1fr}.ah-img{max-width:560px}}
@media(max-width:640px){.aname-xl{font-size:clamp(3.4rem,17vw,5.2rem)}}
.igrow{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin:14px 0 0}
.aud-s{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-2)}
.about-l{max-width:780px}
.about-l .lede{margin-top:20px}
.about-l .tlink{margin-top:12px}

/* ── 12. the portfolio grid: one large piece with two beside it, every sixth visible piece (site.js keeps the rhythm
   through the filters and alternates the side). Row spans, never CSS columns, so the reading order stays the DOM order. ── */
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:dense;gap:clamp(10px,1.4vw,18px)}
.gi{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--panel-2);border:1px solid var(--edge);text-decoration:none}
.gi img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.3,1)}
.gi:hover img,.gi:focus-visible img{transform:scale(1.035)}
.grid .feat,.grid:not(.js)>:nth-child(6n+1){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.grid .feat-r{grid-column:2 / span 2}
.gcap{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(241,236,228,.92);background:linear-gradient(0deg,rgba(11,11,12,.84),rgba(11,11,12,0));pointer-events:none;transition:opacity .3s ease,transform .3s ease}
@media (hover:hover) and (pointer:fine){.gi .gcap{opacity:0;transform:translateY(6px)}.gi:hover .gcap,.gi:focus-visible .gcap{opacity:1;transform:none}}
@media(max-width:700px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid .feat-r{grid-column:span 2}
  .gcap{padding:30px 10px 10px;font-size:11px;letter-spacing:.06em}}

/* ── 13. images open from a slight inset as they arrive, never from hidden; the end state is no clip at all ── */
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){
  .gi,.split .s-media:not(.mapwrap){animation:clip-open linear backwards;animation-timeline:view();animation-range:entry 0% entry 60%}
  .gi img,.split .s-media:not(.mapwrap) img{animation:img-settle linear backwards;animation-timeline:view();animation-range:entry 0% cover 50%}
}}
@keyframes clip-open{from{clip-path:inset(5% 5% 5% 5%)}to{clip-path:inset(0 0 0 0)}}
@keyframes img-settle{from{scale:1.1}to{scale:1}}

/* ── 14. filter chips ── */
.chips-f{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 clamp(26px,3vw,38px)}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--edge);border-radius:var(--btn-r);background:transparent;
  color:var(--txt-2);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.chip:hover{color:#FBF8F1;border-color:var(--edge-hot)}
.chip[aria-pressed="true"]{background:var(--lume-hot);border-color:var(--lume-hot);color:#0B0B0C}
.chip:focus-visible{outline:2px solid var(--lume);outline-offset:3px}
@media(max-width:560px){.chip{padding:0 13px;font-size:12px;letter-spacing:.06em}}

/* ── 15. the lightbox: sized by the viewport so the photograph can never overflow it ── */
.lb{position:fixed;inset:0;z-index:90;display:grid;grid-template-rows:minmax(0,1fr) auto;background:rgba(8,8,9,.97)}
.lb-stage{margin:0;min-height:0;display:flex;align-items:center;justify-content:center;padding:clamp(64px,7vh,84px) clamp(76px,7vw,110px) 8px}
.lb-img{display:block;width:auto;height:auto;max-width:calc(100vw - 2 * clamp(76px,7vw,110px));max-height:calc(100dvh - 160px);
  object-fit:contain;box-shadow:0 40px 120px -40px rgba(0,0,0,.95);transition:opacity .25s ease}
.lb.ld .lb-img{opacity:.3}
.lb-mk{position:absolute;left:clamp(18px,2.4vw,34px);top:clamp(18px,2.4vw,30px);width:38px;color:var(--lume);opacity:.85}
.lb-mk .mk{width:100%;height:auto;display:block}
.lb-bar{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:14px clamp(18px,2.4vw,34px) calc(20px + env(safe-area-inset-bottom))}
.lb-cap{margin:0;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--txt);max-width:70ch;line-height:1.6}
.lb-n{margin:0;font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;color:var(--txt-2);white-space:nowrap}
.lb-x,.lb-prev,.lb-next{position:absolute;display:grid;place-items:center;width:52px;height:52px;padding:0;border:1px solid var(--edge-hot);
  border-radius:var(--btn-r);background:rgba(11,11,12,.5);color:#FBF8F1;cursor:pointer;transition:border-color .2s,background .2s}
.lb-x:hover,.lb-prev:hover,.lb-next:hover{border-color:var(--lume);background:rgba(201,184,163,.12)}
.lb-x{right:clamp(14px,2vw,28px);top:clamp(14px,2vw,24px)}
.lb-prev,.lb-next{top:50%;translate:0 -50%}
.lb-prev{left:clamp(12px,2vw,28px)}.lb-next{right:clamp(12px,2vw,28px)}
@media(max-width:700px){
  .lb-stage{padding:72px 10px 74px}
  .lb-img{max-width:calc(100vw - 20px);max-height:calc(100dvh - 230px)}
  .lb-prev,.lb-next{top:auto;bottom:calc(66px + env(safe-area-inset-bottom));translate:none}
}
body.lb-open{overflow:hidden}
body.lb-open .bookbar,body.lb-open .chatfab,body.lb-open .chattag,body.lb-open .chatpanel{display:none}

/* the menu links arrive in sequence when it opens */
@media (prefers-reduced-motion:no-preference){
  body.menu-open .ml{animation:ml-in .7s cubic-bezier(.2,.7,.2,1) both}
  body.menu-open .ml:nth-child(2){animation-delay:.04s}body.menu-open .ml:nth-child(3){animation-delay:.08s}
  body.menu-open .ml:nth-child(4){animation-delay:.12s}body.menu-open .ml:nth-child(5){animation-delay:.16s}
  body.menu-open .ml:nth-child(6){animation-delay:.2s}
  body.menu-open .mprev,body.menu-open .mfoot{animation:ml-fade .8s ease .15s both}
}
@keyframes ml-in{from{opacity:.15;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes ml-fade{from{opacity:.2}to{opacity:1}}

/* ── 16. /book, "create your piece": one question per screen over a real form. Without JavaScript every step shows
   and the send button submits; site.js adds .is-step and walks the steps. ── */
.bk{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:clamp(30px,4.5vw,72px);align-items:start}
.sec:has(.bk),.sec:has(.care-l){overflow:clip}   /* the kit's overflow:hidden would stop the sticky side column */
.bk-side{position:sticky;top:calc(var(--nav-h) + 26px)}
@media(max-width:980px){.bk{grid-template-columns:1fr}.bk-side{position:static}}
.form.cp{padding:clamp(22px,3.4vw,44px)}
.cp-top{margin:0 0 30px}
.cp:not(.is-step) .cp-top{display:none}
.cp-bar{height:2px;background:var(--edge);overflow:hidden}
.cp-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--lume),var(--lume-hot));transition:width .5s cubic-bezier(.2,.7,.3,1)}
.cp-count{margin:12px 0 0;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--txt-2)}
.cp .step{border:0;margin:0;padding:0;min-width:0}
.cp:not(.is-step) .step+.step{margin-top:38px;padding-top:34px;border-top:1px solid var(--edge)}
.cp legend{display:flex;align-items:baseline;gap:16px;padding:0;margin:0 0 24px;font-family:var(--serif);font-weight:300;
  font-size:clamp(1.8rem,3.2vw,2.5rem);line-height:1.1;color:#FBF8F1}
.cp legend .sn{flex:0 0 auto;font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;color:var(--lume)}
.cp legend:focus:not(:focus-visible),.cp-sum h3:focus:not(:focus-visible){outline:none}
.cp-nav{display:flex;align-items:center;gap:12px;margin-top:34px}
.cp-next{margin-left:auto}
.cp .btn{min-height:52px}
.cp-send{margin-top:30px}
.cp.is-step .cp-send{display:none}
.cp.is-step[data-at="6"]{display:flex;flex-direction:column}
.cp.is-step[data-at="6"] .cp-send{display:inline-flex;order:2;margin-top:26px}
.cp.is-step[data-at="6"] .cp-nav{order:3;margin-top:14px}
/* step 1: the artist cards */
.opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:560px){.opts{grid-template-columns:1fr}}
.opt{position:relative;display:block;cursor:pointer}
.opt input,.opt-c input{position:absolute;left:0;top:0;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.ob{display:grid;grid-template-columns:68px minmax(0,1fr);grid-template-rows:1fr 1fr;column-gap:16px;align-items:center;height:100%;padding:12px;
  border:1px solid var(--edge);background:rgba(255,255,255,.028);transition:border-color .2s,background .2s,box-shadow .2s}
.ob img,.ob .plate-s{grid-row:1 / 3;width:68px;height:85px;object-fit:cover;display:grid}
.ob b{align-self:end;font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.1;color:#FBF8F1}
.ob i{align-self:start;margin-top:5px;font-style:normal;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2);line-height:1.4}
.opt:hover .ob{border-color:var(--edge-hot)}
.opt input:checked+.ob{border-color:var(--lume);background:rgba(201,184,163,.1);box-shadow:inset 0 0 0 1px var(--lume)}
.opt input:focus-visible+.ob,.opt-c input:focus-visible+span{outline:2px solid var(--lume);outline-offset:3px}
/* steps 3 and 4: answers as chips */
.opts-c{display:flex;flex-wrap:wrap;gap:8px}
.opt-c{position:relative;display:inline-flex;cursor:pointer}
.opt-c span{display:inline-flex;align-items:center;min-height:48px;padding:0 18px;border:1px solid var(--edge);border-radius:var(--btn-r);
  font-size:13px;letter-spacing:.03em;color:var(--txt);background:rgba(255,255,255,.02);transition:border-color .2s,background .2s,color .2s}
.opt-c:hover span{border-color:var(--edge-hot)}
.opt-c input:checked+span{background:var(--lume-hot);border-color:var(--lume-hot);color:#0B0B0C}
.lab{margin:0 0 12px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--lume-2)}
.opts-c+.lab{margin-top:28px}
/* step 3: the body map; tapping a region checks the matching answer */
.bmap{display:grid;grid-template-columns:180px minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:center;margin-bottom:26px}
.fig{display:block;height:330px;width:auto;margin:0 auto;overflow:visible}
.fig .head,.fig .rg>*{fill:rgba(255,255,255,.035);stroke:rgba(201,184,163,.45);stroke-width:1.1;transition:fill .2s,stroke .2s}
.fig .rg{cursor:pointer}
.fig .rg:hover>*{fill:rgba(201,184,163,.16);stroke:var(--lume)}
.fig .rg.on>*{fill:rgba(227,214,196,.55);stroke:var(--lume-hot)}
.cp:not(.is-step) .bmap{grid-template-columns:1fr}
.cp:not(.is-step) .fig{display:none}
@media(max-width:600px){.bmap{grid-template-columns:1fr}.fig{height:230px}}
/* step 5 and the review */
.agree{display:flex;align-items:flex-start;gap:14px;margin-top:8px;padding:16px 18px;border:1px solid var(--edge);cursor:pointer;font-size:15.5px;line-height:1.55;color:var(--txt)}
.agree input{flex:0 0 22px;width:22px;height:22px;margin:1px 0 0;accent-color:var(--lume-hot)}
.cp-sum h3{margin:0 0 18px;font-size:clamp(1.8rem,3.2vw,2.5rem)}
.cp-list{margin:0}
.cp-list div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;padding:13px 0;border-top:1px solid var(--edge)}
.cp-list div:last-child{border-bottom:1px solid var(--edge)}
.cp-list dt{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--lume-2);padding-top:3px}
.cp-list dd{margin:0;color:#FBF8F1;font-size:16px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:560px){.cp-list div{grid-template-columns:1fr;gap:4px}}
.cp-sms{margin-top:16px}
/* the side column: text instead */
.bk-side .eyebrow{margin-bottom:6px}
.txrow{display:grid;gap:4px;padding:18px 0;border-bottom:1px solid var(--edge)}
.bk-side .eyebrow+.txrow{border-top:1px solid var(--edge)}
.txrow b{font-family:var(--serif);font-weight:400;font-size:1.4rem;color:#FBF8F1}
.txrow span{font-size:15px;color:var(--txt-2)}
.txrow a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--mono);font-size:15px;letter-spacing:.04em;color:var(--lume-hot);text-decoration:none}
.txrow a:hover{color:#fff}
.fhours .hrow{font-size:15px}

/* ── 17. the style pages: an editorial two-column read ── */
.prose-l{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:clamp(30px,5vw,80px)}
.prose-l h2{margin:0;padding:30px 0 34px;border-top:1px solid var(--edge);font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1.15;color:#FBF8F1}
.prose-l p{margin:0;padding:34px 0;border-top:1px solid var(--edge);font-size:17px;line-height:1.78;color:var(--txt-2);max-width:62ch}
@media(max-width:800px){.prose-l{grid-template-columns:1fr}.prose-l h2{padding:28px 0 12px}.prose-l p{padding:0 0 30px;border-top:0}}

/* ── 18. care: chapters with a sticky index ── */
.care-l{display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(36px,6vw,100px);align-items:start}
.care-idx{position:sticky;top:calc(var(--nav-h) + 28px)}
.care-idx ol{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--edge)}
.care-idx a{display:flex;align-items:center;gap:14px;min-height:46px;padding:6px 0;border-bottom:1px solid var(--edge);font-size:15px;color:var(--txt-2);
  text-decoration:none;transition:color .2s,padding-left .3s}
.care-idx a span{font-size:12px;letter-spacing:.1em;color:var(--lume)}
.care-idx a:hover{color:#FBF8F1;padding-left:6px}
.print-b{margin-top:24px;width:100%}
.chap{scroll-margin-top:calc(var(--nav-h) + 24px);padding-bottom:clamp(44px,5vw,72px)}
.chap+.chap{padding-top:clamp(44px,5vw,72px);border-top:1px solid var(--edge)}
.cno{margin:0;font-size:12.5px;letter-spacing:.14em;color:var(--lume)}
.chap h2{margin:10px 0 8px;font-size:clamp(2rem,3.8vw,3rem)}
.chap p{max-width:62ch;font-size:17px;line-height:1.75}
@media(max-width:900px){.care-l{grid-template-columns:1fr}.care-idx{position:static}.care-idx ol{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}}
@media(max-width:480px){.care-idx ol{grid-template-columns:1fr}}
.care{list-style:none;margin:22px 0 0;padding:0}
.care li{padding:14px 0 14px 26px;position:relative;font-size:17px;line-height:1.6;color:var(--txt);border-top:1px solid var(--edge)}
.care li:last-child{border-bottom:1px solid var(--edge)}
.care li::before{content:'';position:absolute;left:2px;top:24px;width:7px;height:7px;border-radius:50%;background:var(--lume);box-shadow:0 0 12px rgba(201,184,163,.7)}
.care b{color:#fff;font-weight:500}

/* ── 19. footer, Instagram links, the Maya plate, the report ── */
.iglink{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 0;color:var(--lume-hot);text-decoration:none;font-size:15px;letter-spacing:.02em}
.iglink:hover{color:#fff}
.social{display:flex;flex-wrap:wrap;gap:0 24px;margin-top:14px}
.social a.iglink,.foot .social a.iglink{width:auto;height:auto;min-height:44px;margin:0;padding:10px 0;border:0;border-radius:0;background:none;color:var(--lume-hot)}
.social a.iglink:hover{background:none;color:#fff}
.plate{aspect-ratio:4/5;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(120% 80% at 20% 10%,rgba(201,184,163,.18),transparent 60%),radial-gradient(90% 70% at 90% 100%,rgba(154,163,173,.16),transparent 60%),var(--panel-2)}
.plate span{font-family:var(--serif);font-weight:300;font-size:clamp(5rem,12vw,9rem);line-height:1;color:var(--lume);letter-spacing:.04em;text-shadow:0 0 60px rgba(201,184,163,.35)}
.plate.tall{border:1px solid var(--edge);box-shadow:0 40px 80px -40px rgba(0,0,0,.95)}
.rep{max-width:820px}
.rep .finding{border:1px solid var(--edge);padding:26px 28px;margin-bottom:18px;background:linear-gradient(168deg,rgba(255,255,255,.075),rgba(255,255,255,.022))}
.rep .finding h3{font-size:1.5rem;margin-bottom:8px;max-width:30ch}
.rep .finding .k{display:block;margin-bottom:8px;font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--lume);font-weight:500}
.rep table{width:100%;border-collapse:collapse;font-size:15.5px;margin:12px 0 4px}
.rep td,.rep th{padding:11px 10px;border-bottom:1px solid var(--edge);text-align:left;vertical-align:top}
.rep th{font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--lume);font-weight:500}
.rep .bad{color:#F0A28E}.rep .good{color:#9ED7A2}
.rep .finding p,.rep .fnote,.rep .steps p{max-width:62ch}

/* ── 20. carried over from v1, each one measured (audit, probe or a desktop capture on 2026-09-10) ── */
:root{--r:2px;--r-lg:2px}   /* square camp everywhere: split images, the map, the form, the report cards */
.nav{background:rgba(11,11,12,.6)}
body.scrolled .nav,body.dark-top.scrolled .nav{background:rgba(11,11,12,.86);border-bottom-color:var(--edge)}
body.menu-open .nav,body.menu-open.scrolled .nav,body.dark-top.scrolled.menu-open .nav{background:transparent;border-bottom-color:transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none}
@media(max-width:640px){.brand .w1{letter-spacing:.10em}.ncta .btn{padding:12px 14px}}
@media(max-width:560px){.ncta .btn{display:none}}   /* the sticky book bar carries it on phones */
/* inline text links: vertical padding on an inline element grows the tap box, not the line */
main p:not(.crumbs) a:not(.btn):not(.iglink):not(.tlink),.faq .ans a,.note a,.fnote a,.lede a,.care a,.fsteps a{
  padding:15px 0;color:var(--lume-hot);text-decoration:underline;text-decoration-color:rgba(201,184,163,.5);text-underline-offset:3px;text-decoration-thickness:1px}
main p:not(.crumbs) a:not(.btn):not(.iglink):not(.tlink):hover,.faq .ans a:hover,.note a:hover,.fsteps a:hover{text-decoration-color:var(--lume-hot)}
body.menu-open .bookbar,body.menu-open .chatfab,body.menu-open .chattag,body.menu-open .chatpanel{display:none}
.bookbar a{border-radius:var(--btn-r)}
.faq .ans{max-width:60ch}
.split .s-media img{aspect-ratio:4/5;object-fit:cover;width:100%;display:block}
.split .s-media.wide img{aspect-ratio:4/3}
.hero-img,.pbanner .bimg{overflow:hidden}
/* the kit's .foot a and .drawer a out-rank .btn-accent on specificity */
.foot a.btn-accent,.foot a.btn-accent:hover,.drawer a.btn-accent{color:#0B0B0C}
.foot a.btn-out,.drawer a.btn-out{color:#FBF8F1}
/* the gold stays inside this palette: #0B0B0C on #B3A088 computes 7.8:1, on #E3D6C4 13.8:1 */
.btn-accent{background:linear-gradient(150deg,var(--lume-hot),#B3A088);color:#0B0B0C;box-shadow:0 0 34px -12px rgba(227,214,196,.45)}
.btn-accent:hover{background:linear-gradient(150deg,#F3EADC,var(--lume));box-shadow:0 0 44px -10px rgba(227,214,196,.6)}
.bookbar .b1{background:linear-gradient(150deg,var(--lume-hot),#B3A088);color:#0B0B0C}
.btn-out:hover,.btn-ink:hover{background:rgba(201,184,163,.12);border-color:var(--lume);box-shadow:none}
.drawer a.btn{font-family:var(--sans);font-size:14.5px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;border-bottom:1px solid transparent}
.drawer a.btn-out{border:1px solid var(--edge-hot)}
.fld input[type=file]{padding:6px 0;border:0;background:none;color:var(--txt-2);font-size:15px}
.fld input[type=file]::file-selector-button{font:500 13px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:#FBF8F1;background:transparent;
  border:1px solid var(--edge-hot);border-radius:var(--btn-r);padding:15px 20px;margin-right:16px;cursor:pointer}
.fld input[type=file]::file-selector-button:hover{border-color:var(--lume);background:rgba(201,184,163,.1)}
.mapwrap{background:var(--panel-2);min-height:420px}
.mapwrap iframe{display:block}
::selection{background:var(--lume-hot);color:#0B0B0C}
:focus-visible{outline-color:var(--lume-hot)}

/* ── 21. page transitions: a short cross-fade, the header holds still, and the portrait carries from /artists into the
   artist's own page. Browsers without cross-document view transitions simply navigate. ── */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  .nav{view-transition-name:site-nav}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}
  ::view-transition-group(art-owen),::view-transition-group(art-kevin){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
  @supports (animation-timeline: scroll()){
    .pbanner .bimg img{animation:settle linear both;animation-timeline:scroll(root);animation-range:0px 70vh}
  }
}

/* ── 22. print: the care guide on paper ── */
@media print{
  .nav,.drawer,.skip,.bookbar,.chatfab,.chattag,.chatpanel,.lb,.cprev,.cring,.foot,.cta,.pbanner .bimg,.pbanner .btns,.care-idx,.crumbs{display:none!important}
  html,body{background:#fff!important;color:#111!important}
  .sec::before,.sec::after{display:none!important}
  .sec,.pbanner{padding:0 0 14pt!important;margin:0!important;min-height:0!important;background:none!important;overflow:visible!important}
  h1,h2,h3,.pbanner h1,.chap h2{color:#111!important;text-shadow:none!important}
  p,li,.lede,.care li,.chap p{color:#222!important}
  .care li::before{background:#111!important;box-shadow:none!important}
  .care b,.care li b{color:#111!important}
  .care-l{display:block!important}
  .chap{break-inside:avoid-page;padding:10pt 0!important;border-color:#bbb!important}
  .cno{color:#555!important}
  a{color:#111!important;text-decoration:none!important;padding:0!important}
}

/* ── 23. the kit's chat, book bar and section glows carry the reference build's tints (green-black ground, ochre and
   blue light). Repainted in this palette: the black of the work, skin under the wash, the grey wash. ── */
.sec::before,.sec-tight::before{background:radial-gradient(38% 46% at 6% 8%,rgba(201,184,163,.16),transparent 68%),
  radial-gradient(40% 48% at 96% 96%,rgba(154,163,173,.12),transparent 68%)}
.sec-paper{border-top-color:var(--edge);border-bottom-color:var(--edge)}
.sec-paper::before{background:radial-gradient(42% 50% at 94% 6%,rgba(201,184,163,.18),transparent 68%),
  radial-gradient(38% 46% at 2% 98%,rgba(154,163,173,.13),transparent 68%)}
.sec-alt::before{background:radial-gradient(44% 52% at 14% 2%,rgba(201,184,163,.19),transparent 66%),
  radial-gradient(40% 48% at 92% 100%,rgba(154,163,173,.14),transparent 68%)}
.sec+.sec,.sec+.sec-tight,.sec-tight+.sec{border-top-color:var(--edge)}
.eyebrow,.eyebrow.on-dark,.hrow.today .d,.hrow.today .t{text-shadow:none}
.faq details,.hrow,.iline{border-bottom-color:var(--edge)}
.nav .burger,body.dark-top.scrolled .nav .burger,body.menu-open .nav .burger{border-color:var(--edge-hot)}
.foot{border-top-color:var(--edge)}
.fld input:focus,.fld select:focus,.fld textarea:focus{box-shadow:0 0 0 3px rgba(201,184,163,.16)}
.thanks .tick{background:linear-gradient(150deg,var(--lume-hot),#B3A088);color:#0B0B0C;box-shadow:0 0 40px -10px rgba(227,214,196,.5)}
.err404 .code{color:rgba(201,184,163,.22)}
.bookbar{background:rgba(11,11,12,.94);border-top-color:var(--edge)}
.bookbar .b1{box-shadow:none}
.bookbar .b2{border-color:var(--edge-hot)}
.chatfab{background:linear-gradient(150deg,#28282C,#111113);border-color:var(--edge-hot);color:var(--lume-hot);
  box-shadow:0 0 30px -12px rgba(227,214,196,.35),0 18px 40px -18px rgba(0,0,0,.9)}
.chatfab:hover{box-shadow:0 0 40px -10px rgba(227,214,196,.5),0 18px 40px -18px rgba(0,0,0,.9)}
.chattag{background:linear-gradient(150deg,#28282C,#111113);border-color:var(--edge-hot)}
.chatpanel{background:linear-gradient(168deg,#1C1C1F,#111113);border-color:var(--edge-hot)}
.chathead{border-bottom-color:var(--edge);background:rgba(201,184,163,.06)}
.msg.bot{border-color:var(--edge)}
.msg.me,.chatact .p,.chatform button{background:linear-gradient(150deg,var(--lume-hot),#B3A088);color:#0B0B0C}
.chips button{border-color:var(--edge-hot)}
.chips button:hover{background:rgba(201,184,163,.14)}
.chatact .s{border-color:var(--edge-hot)}
.chatform{border-top-color:var(--edge)}
.chatform input{border-color:var(--edge)}
.chatform input:focus{box-shadow:0 0 0 3px rgba(201,184,163,.14)}

/* ── 24. fixes from the first headless captures (2026-09-10 evening) ── */
/* The in-app pane showed a 1px light seam down the left edge of the desktop hero photo: the scroll-scaled image is
   composited and snaps differently from the dark overlay painted over it. Full-bleed heroes and banners have no inside
   edge, so they keep the settle. */
@media(min-width:900px){.hero.wall .hero-img img{animation:none}}
.dhead,.shead h2,.cta h2{text-wrap:balance}
.fhours .hrow .d,.fhours .hrow .t{white-space:nowrap}
.foot .fhours .hrow{gap:14px}
.social a.iglink,.foot .social a.iglink{display:inline-flex;flex-direction:row;align-items:center;gap:8px}
@media(min-width:761px){.fbot{padding-right:200px}}   /* the chat label sits over the credit line otherwise */
body.nav-min.menu-open .nav .burger span{background:transparent}   /* the kit's dark layer repaints the middle bar, turning the X into an asterisk */
.lb{background:rgba(8,8,9,.992)}
/* phone hero: a taller photograph centred on the piece, and the overlay in this palette's black (the kit's is green-black) */
@media(max-width:700px){
  .hero.wall .hero-img{height:min(104vw,500px);max-height:none}
  .hero.wall .hero-img img{object-position:66% 40%}
  .hero.wall .hero-img::after{background:linear-gradient(180deg,rgba(11,11,12,.6) 0%,rgba(11,11,12,.06) 38%,rgba(11,11,12,.12) 70%,rgba(11,11,12,.92) 100%)}
}
@media(min-width:701px) and (max-width:899px){
  .hero.wall .hero-img::after{background:linear-gradient(180deg,rgba(11,11,12,.7) 0%,rgba(11,11,12,.2) 40%,rgba(11,11,12,.9) 100%)}
}
/* the kit's banner and closing-band scrims are green-black; the same gradients in this palette's black */
.pbanner .bimg::after{background:linear-gradient(180deg,rgba(11,11,12,.62) 0%,rgba(11,11,12,.34) 44%,rgba(11,11,12,.84) 100%),
  linear-gradient(96deg,rgba(11,11,12,.82) 0%,rgba(11,11,12,.6) 36%,rgba(11,11,12,.14) 70%,rgba(11,11,12,0) 100%)}
.cta .cimg::after{background:linear-gradient(180deg,rgba(11,11,12,.72),rgba(11,11,12,.9))}
/* measure: the luxury grammar warns above 40em; the kit's 62ch is 41em in Geist */
.lede,.chap p,.prose-l p,.rep .finding p,.rep .fnote,.rep .steps p{max-width:58ch}
/* the large tile keeps its own 4:5 box. With aspect-ratio:auto it took its height from the tiles beside it, and a
   two-column phone has none, so it collapsed to 10px (audit TAP rows, 2026-09-10 evening) */
.grid .feat,.grid:not(.js)>:nth-child(6n+1){aspect-ratio:4/5}
