
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/fraunces-600.woff2) format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 700;font-stretch:75% 125%;font-display:swap;src:url(assets/fonts/archivo-var.woff2) format('woff2');}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/dmmono-400.woff2) format('woff2');}

:root{ --pg:#EDEBE6; --pk:#1B1815; --pd:#6F6A63; --ph:rgba(27,24,21,.15) }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --pg:#111010; --pk:#E9E5DE; --pd:#8D877F; --ph:rgba(233,229,222,.17) } }
:root[data-theme="dark"]{ --pg:#111010; --pk:#E9E5DE; --pd:#8D877F; --ph:rgba(233,229,222,.17) }
*{box-sizing:border-box}
body{margin:0;background:#FDF4E6;color:#241610;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-family:'Archivo',ui-sans-serif,system-ui,sans-serif}




/* ===================== THE SITE ===================== */
.site{
  --vermillion:#D02C13; --amber:#F8B040; --umber:#965128;
  --char:#241610; --ink:#1B110C; --cream:#FDF4E6; --clay:#7A6355; --sheet:#FFFBF3; --white:#fff;
  --onDark:#F4EADF; --onDarkDim:rgba(244,234,223,.64); --hairDark:rgba(244,234,223,.14);
  --t1:clamp(.7rem,.85vw,.76rem); --t2:clamp(.92rem,1.05vw,1.02rem);
  --t3:clamp(1.3rem,1.85vw,1.6rem); --t4:clamp(2rem,3.6vw,3.1rem);
  --t5:clamp(2.8rem,5.8vw,4.5rem); --t6:clamp(5.5rem,16vw,14rem);
  --ease:cubic-bezier(.165,.84,.44,1);
  /* one warm treatment across every photograph, so mismatched phone shots read as a set */
  --photo:sepia(.2) saturate(1.06) contrast(1.05) brightness(1.02);
  position:relative;background:var(--cream);color:var(--char);
  overflow:hidden;font-size:16px;line-height:1.62;
}
/* ATMOSPHERE 1 — grain */
.site::before{content:"";position:absolute;inset:0;z-index:6;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
.site h1,.site h2,.site h3{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;margin:0;letter-spacing:-.024em;line-height:1.03;text-wrap:balance}
.site p{margin:0}
.site img{display:block;max-width:100%;height:auto}
.site a{color:inherit;text-decoration:none}
.site .m{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:var(--t1);letter-spacing:.18em;text-transform:uppercase;line-height:1.4}
.site :focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.pad{padding-left:clamp(18px,5.2vw,88px);padding-right:clamp(18px,5.2vw,88px)}
.photo{filter:var(--photo)}

/* 1 — METADATA HEADER */
.meta{position:relative;z-index:7;background:var(--char);color:var(--onDark);padding-top:9px;padding-bottom:9px}
.meta .row{display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:space-between;align-items:center}
.utilnav{display:flex;flex-wrap:wrap;gap:2px 24px}
.site .utilnav a{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:var(--t1);letter-spacing:.16em;
  text-transform:uppercase;color:var(--onDarkDim);padding:5px 0;position:relative;transition:color .24s var(--ease)}
.site .utilnav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--amber);transition:right .3s var(--ease)}
.site .utilnav a:hover{color:var(--amber)}
.site .utilnav a:hover::after{right:0}
.site .utilnav a[aria-current]{color:var(--amber)}
.site .utilnav a[aria-current]::after{right:0;height:2px}
.meta .m{color:var(--onDarkDim)}
.meta .tick{height:2px;width:54px;background:var(--amber);margin-top:8px;margin-left:auto}

/* nav */
.nav{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;justify-content:space-between;
  padding-top:15px;padding-bottom:15px;transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.site[data-scrolled="1"] .nav{background:rgba(253,244,230,.95);backdrop-filter:blur(9px);box-shadow:0 1px 0 rgba(36,22,16,.14)}
.nav .lock{display:flex;align-items:center;gap:9px}
.nav .lock .mark{display:block;flex:0 0 auto;height:30px;width:30px;object-fit:contain}
.nav .lock .wm img{display:block;height:16px;width:auto}
.nav .lock em{font-style:normal;display:block;text-align:center;font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:8.5px;letter-spacing:.17em;text-indent:.17em;color:var(--umber);margin-top:4px;line-height:1.1}
/* segmented line control, carried over from V4 */
.navswitch{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(36,22,16,.22);margin-left:auto}
@media (max-width:820px){ .navswitch{margin-left:0} }
.site .navswitch a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 24px;
  font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--clay);transition:background .26s var(--ease),color .26s var(--ease)}
.site .navswitch a + a{border-left:1px solid rgba(36,22,16,.22)}
.site .navswitch a:hover,.site .navswitch a:focus-visible{background:var(--char);color:var(--cream)}
.site .navswitch a.on{background:var(--char);color:var(--cream)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 21px;
  font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  background:var(--amber);color:var(--char);border:1px solid var(--amber);
  transition:transform .22s var(--ease),box-shadow .22s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(36,22,16,.2)}
.btn.line{background:transparent;border-color:currentColor}
.btn.line:hover{box-shadow:none;opacity:.78}

/* 3 — HERO (V1 shape: 62/38 vermillion + photograph) */
.hero{position:relative;display:grid;grid-template-columns:62fr 38fr;background:var(--vermillion);color:#FFF8EF;overflow:hidden}
.hero .ghost{position:absolute;left:-3.4%;bottom:-9%;z-index:0;font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;
  font-size:var(--t6);line-height:.78;letter-spacing:-.05em;color:#fff;opacity:.06;pointer-events:none;user-select:none}
.hero-copy{position:relative;z-index:1;padding-top:clamp(46px,6.6vw,102px);padding-bottom:clamp(46px,6.6vw,102px);
  display:flex;flex-direction:column;gap:21px;justify-content:center}
.hero-copy .m{color:rgba(255,248,239,.8)}
.hero h1{font-size:var(--t5);max-width:15ch}
.hero .sub{font-size:var(--t2);line-height:1.56;max-width:39ch;color:rgba(255,248,239,.88)}
.hero .acts{display:flex;flex-wrap:wrap;gap:11px;margin-top:5px}
.hero-img{position:relative;z-index:1}
.hero-img img{width:100%;height:100%;object-fit:cover;min-height:300px}
.hero-img figcaption{position:absolute;left:0;right:0;bottom:0;padding:11px 16px;color:#FFF8EF;
  background:linear-gradient(transparent,rgba(27,17,12,.85))}
@media (max-width:880px){ .hero{grid-template-columns:1fr} .hero-img img{min-height:230px} }

/* 4 — THE NUMBER (V1) */
.num{position:relative;background:var(--char);color:var(--onDark);overflow:hidden;
  padding-top:clamp(44px,5.6vw,84px);padding-bottom:clamp(44px,5.6vw,84px)}
/* ATMOSPHERE 2 — structural hairlines */
.num::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;
  background-image:repeating-linear-gradient(to bottom,#F4EADF 0 1px,transparent 1px 36px)}
.num .g{position:relative;z-index:1;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(22px,4.4vw,64px);align-items:center}
.bignum{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:var(--t6);line-height:.76;letter-spacing:-.05em;color:var(--amber)}
.bignum sup{font-size:.26em;vertical-align:super;letter-spacing:0}
.num h2{font-size:var(--t3);max-width:23ch}
.num .facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(126px,1fr));gap:15px 24px;margin-top:20px;padding-top:16px;border-top:1px solid var(--hairDark)}
.num .facts b{display:block;font-size:1.18rem;font-weight:600}
.num .facts span{font-size:.79rem;color:var(--onDarkDim)}
@media (max-width:780px){ .num .g{grid-template-columns:1fr} }

/* marquee */
.strip{background:var(--sheet);border-top:1px solid rgba(36,22,16,.13);border-bottom:1px solid rgba(36,22,16,.13);padding:14px 0;overflow:hidden}
.strip .track{display:flex;gap:52px;width:max-content;animation:slide 36s linear infinite}
.strip:hover .track{animation-play-state:paused}
.strip span{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:.73rem;letter-spacing:.16em;text-transform:uppercase;color:var(--clay);white-space:nowrap}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* section scaffolding */
.sec{padding-top:clamp(48px,6.4vw,104px);padding-bottom:clamp(48px,6.4vw,104px)}
.sec.dark{background:var(--ink);color:var(--onDark)}
.head{max-width:56ch;margin-bottom:clamp(24px,3.2vw,42px)}
.head .m{color:var(--umber)}
.sec.dark .head .m{color:var(--amber)}
.head h2{font-size:var(--t4);margin-top:11px}
.head p{color:var(--clay);font-size:var(--t2);margin-top:13px;max-width:52ch}
.sec.dark .head p{color:var(--onDarkDim)}

/* 6 — TWO LINES (V2 shape: full-bleed duo, distinct registers) */
.duo{display:grid;grid-template-columns:57fr 43fr;gap:1px;background:rgba(36,22,16,.16)}
@media (max-width:880px){ .duo{grid-template-columns:1fr} }
.panel{position:relative;scroll-margin-top:104px;padding:clamp(26px,3.2vw,46px);display:flex;flex-direction:column;gap:13px;
  min-height:352px;justify-content:flex-end;overflow:hidden}
.panel .pbg{position:absolute;inset:0;z-index:0}
.panel .pbg img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.panel:hover .pbg img{transform:scale(1.05)}
.panel .pscrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(27,17,12,.5),rgba(27,17,12,.95))}
.panel > *{position:relative;z-index:2}
.panel h3{font-size:var(--t3)}
.panel h3 span{color:var(--ac)}
.panel .tag{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:1.05rem;color:var(--ac)}
.panel .m{color:var(--ac)}
.panel p{font-size:.93rem;line-height:1.56;max-width:44ch}
.panel .chips{display:flex;flex-wrap:wrap;gap:6px}
.panel .chips i{font-style:normal;font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;padding:5px 8px;border:1px solid currentColor;opacity:.66}
.panel .btn{align-self:flex-start;margin-top:5px}
/* the switch emphasises the chosen line — V3 keeps both panels, one steps forward */
.panel{transition:opacity .38s var(--ease),outline-color .38s var(--ease);outline:2px solid transparent;outline-offset:-2px}
.site[data-line="projects"] .panel.ho,
.site[data-line="home"] .panel.pr{opacity:.38}
.site[data-line="projects"] #projects,
.site[data-line="home"] #home{outline-color:var(--amber)}
.panel.pr{--ac:var(--amber);background:var(--ink);color:var(--onDark)}
.panel.pr p{color:var(--onDarkDim)}
.panel.ho{--ac:var(--umber);background:var(--sheet);color:var(--char);
  border-top:3px solid var(--umber);box-shadow:inset 0 0 0 1px rgba(36,22,16,.09)}
.panel.ho p{color:var(--clay)}
.panel.ho .btn{background:var(--vermillion);border-color:var(--vermillion);color:#FFF6EF}
.panel.ho .btn:hover{box-shadow:0 7px 20px rgba(208,44,19,.3)}

/* 5 — MECHANISM (V2 shape: horizontal rail, on dark) */
.rail{display:grid;grid-template-columns:repeat(auto-fit,minmax(156px,1fr));border-top:1px solid var(--hairDark)}
.rail .st{position:relative;padding:22px 19px 25px;border-right:1px solid var(--hairDark);border-bottom:1px solid var(--hairDark);
  display:flex;flex-direction:column;gap:7px}
.rail .st:last-child{border-right:0}
.rail .bar{position:absolute;top:-1px;left:0;height:2px;width:100%;background:var(--amber);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease)}
.reveal.in .rail .bar{transform:scaleX(1)}
.rail .st:nth-child(2) .bar{transition-delay:.1s} .rail .st:nth-child(3) .bar{transition-delay:.2s}
.rail .st:nth-child(4) .bar{transition-delay:.3s} .rail .st:nth-child(5) .bar{transition-delay:.4s}
.rail .st:nth-child(6) .bar{transition-delay:.5s}
.rail .n{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.18em;color:var(--amber)}
.rail b{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:1.04rem}
.rail span{font-size:.8rem;color:var(--onDarkDim);line-height:1.48}

/* 7 — NAMED INSTALLATIONS (V1 shape: photo above, text below) */
.work{display:grid;grid-template-columns:repeat(auto-fit,minmax(262px,1fr));gap:17px}
.card{background:var(--sheet);border:1px solid rgba(36,22,16,.13);display:flex;flex-direction:column;overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:0 13px 32px rgba(36,22,16,.13)}
.card .f{overflow:hidden;aspect-ratio:16/10}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.card:hover img{transform:scale(1.045)}
.card .b{padding:16px 18px 19px;display:flex;flex-direction:column;gap:5px}
.card .m{color:var(--umber)}
.card h3{font-size:1.06rem}
.card p{font-size:.85rem;color:var(--clay);line-height:1.5}

/* 8 — CATALOGUE (V2 rail) */
.cat{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin}
.cat::-webkit-scrollbar{height:3px}
.cat::-webkit-scrollbar-thumb{background:rgba(36,22,16,.24)}
.cat .it{flex:0 0 clamp(186px,24vw,264px);scroll-snap-align:start;background:var(--white);
  border:1px solid rgba(36,22,16,.13);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.cat .it:hover{transform:translateY(-4px);box-shadow:0 11px 26px rgba(36,22,16,.13)}
.cat .ph{aspect-ratio:4/3;background:var(--white);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cat .ph img{width:100%;height:100%;object-fit:contain;transition:transform .5s var(--ease)}
.cat .it:hover .ph img{transform:scale(1.05)}
.cat .ph.e::after{content:attr(data-code);font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.18em;color:#CFC2B4}
.cat .b{padding:12px 14px 15px;background:var(--sheet);border-top:1px solid rgba(36,22,16,.1)}
.cat b{display:block;font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:.93rem}
.cat span{font-size:.73rem;color:var(--clay)}
.cat-hint{margin-top:11px;color:var(--clay)}

/* 9 — CLOSE */
.close{position:relative;background:var(--umber);color:#FFF6EA;overflow:hidden;
  padding-top:clamp(42px,5.6vw,92px);padding-bottom:clamp(42px,5.6vw,92px)}
.close .gh{position:absolute;right:-3.5%;top:-30%;font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;
  font-size:var(--t6);line-height:.78;color:#fff;opacity:.07;pointer-events:none}
.close .g{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:22px 46px;align-items:flex-end;justify-content:space-between}
.close h2{font-size:var(--t4);max-width:18ch}
.close p{margin-top:11px;color:rgba(255,246,234,.84);font-size:.95rem;max-width:38ch}
.close .btn{background:#FFF6EA;border-color:#FFF6EA;color:var(--umber)}

/* 6 — RULED FOOTER */
.ft{background:var(--char);color:var(--onDarkDim);padding-top:clamp(34px,4.2vw,58px);padding-bottom:26px}
.ft-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:26px 28px}
.ft h4{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin:0 0 10px;font-weight:400}
.ft p,.ft li{font-size:.81rem;line-height:1.64} .ft ul{margin:0;padding:0;list-style:none}
.ft a:hover{color:var(--amber)}
.ft .lock img{height:25px;width:auto}
.ft .lock em{font-style:normal;display:block;font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:8px;letter-spacing:.3em;color:var(--onDarkDim);margin-top:7px}
.ft-rule{height:1px;background:var(--hairDark);margin:27px 0 14px}
.ft-base{display:flex;flex-wrap:wrap;gap:7px 24px;justify-content:space-between}
.ft-base .m{color:rgba(244,234,223,.44)}

/* mobile sticky */
.mob{display:none}
@media (max-width:700px){
  .mob{display:flex;position:sticky;bottom:0;z-index:30;gap:1px;background:rgba(36,22,16,.2)}
  .mob a{flex:1;display:flex;align-items:center;justify-content:center;min-height:50px;padding:15px 8px;
    background:var(--amber);color:var(--char);font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase}
  .mob a.alt{background:var(--char);color:var(--amber)}
}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .72s var(--ease),transform .72s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .strip .track{animation:none}
  .rail .bar{transform:scaleX(1);transition:none}
  .site *{transition:none!important}
}

/* ---------- multi-page components ---------- */
.pagehero{position:relative;background:var(--char);color:var(--onDark);overflow:hidden;
  padding-top:clamp(44px,6vw,88px);padding-bottom:clamp(44px,6vw,88px)}
.pagehero .m{color:var(--amber)}
.pagehero h1{font-size:var(--t4);max-width:22ch;margin-top:12px}
.pagehero .sub{margin-top:14px;font-size:var(--t2);line-height:1.55;max-width:52ch;color:var(--onDarkDim)}
.pagehero.withimg{padding:0;min-height:min(56vh,520px);display:flex;align-items:flex-end}
.pagehero.withimg .ph-img{position:absolute;inset:0}
.pagehero.withimg .ph-img img{width:100%;height:100%;object-fit:cover}
.pagehero.withimg .ph-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,17,12,.72),rgba(27,17,12,.38) 40%,rgba(27,17,12,.9))}
.pagehero.withimg .ph-in{position:relative;z-index:1;width:100%;padding-top:clamp(60px,9vw,120px);padding-bottom:clamp(30px,4.6vw,56px)}

.cols2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,4vw,56px)}
@media (max-width:820px){.cols2{grid-template-columns:1fr}}
.cols2 p{color:var(--clay);line-height:1.62}
.sec.dark .cols2 p{color:var(--onDarkDim)}

.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:16px}
.cat-card{background:var(--sheet);border:1px solid rgba(36,22,16,.13);display:flex;flex-direction:column;overflow:hidden;
  scroll-margin-top:104px;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.cat-card:hover{transform:translateY(-3px);box-shadow:0 13px 32px rgba(36,22,16,.13)}
.cat-card .f{aspect-ratio:4/3;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cat-card .f img{width:100%;height:100%;object-fit:contain;transition:transform .5s var(--ease)}
.cat-card:hover .f img{transform:scale(1.04)}
.cat-card .b{padding:15px 17px 18px;border-top:1px solid rgba(36,22,16,.1);display:flex;flex-direction:column;gap:6px}
.cat-card h3{font-size:1.05rem}
.cat-card p{font-size:.85rem;color:var(--clay);line-height:1.5}
.cat-card .txt{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--umber);margin-top:4px;display:inline-flex;min-height:32px;align-items:center}
.cat-card .txt:hover{color:var(--vermillion)}

.namelist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--hairDark);border:1px solid var(--hairDark)}
.namelist li{background:var(--ink);padding:20px 20px 22px;display:flex;flex-direction:column;gap:6px}
.namelist b{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:1.08rem}
.namelist span{font-size:.85rem;color:var(--onDarkDim);line-height:1.5}

.promises{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--hairDark);border:1px solid var(--hairDark)}
.promises div{background:var(--ink);padding:20px 20px 22px}
.promises b{display:block;font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:1.06rem;margin-bottom:6px;color:var(--amber)}
.promises span{font-size:.86rem;color:var(--onDarkDim);line-height:1.55}

.reachlist{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:0}
.reachlist li{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(36,22,16,.13);align-items:baseline}
.reachlist b{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--clay);font-weight:400}
.reachlist a{text-decoration:underline;text-underline-offset:3px}
.reachlist span{font-size:.92rem;color:var(--char);line-height:1.6}

.rfq{margin-top:18px;display:flex;flex-direction:column;gap:13px;background:var(--sheet);
  border:1px solid rgba(36,22,16,.13);border-top:3px solid var(--umber);padding:clamp(18px,2.4vw,26px)}
.rfq label{display:flex;flex-direction:column;gap:6px;font-family:'DM Mono',ui-monospace,Menlo,monospace;
  font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--clay)}
.rfq .opt{opacity:.6;text-transform:none;letter-spacing:.05em}
.rfq input,.rfq select{font-family:'Archivo',ui-sans-serif,system-ui,sans-serif;font-size:1rem;color:var(--char);
  background:#fff;border:1px solid rgba(36,22,16,.22);padding:11px 12px;min-height:44px;border-radius:0;width:100%}
.rfq input:focus,.rfq select:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:var(--umber)}
.rfq .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.rfq .row2{grid-template-columns:1fr}}
.rfq .btn{border:1px solid var(--amber);cursor:pointer;align-self:flex-start}
.rfq .formnote{font-size:.8rem;color:var(--clay);line-height:1.55}

.socials{display:flex;flex-wrap:wrap;gap:4px 16px}
.socials a{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;border-bottom:1px solid rgba(244,234,223,.3);padding:4px 0}
.socials a:hover{color:var(--amber);border-color:var(--amber)}
.linklike{background:none;border:none;padding:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.linklike:hover{color:var(--vermillion)}

/* ---------- full catalogue ---------- */
.jumps{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.jumps a{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 14px;
  font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--char);border:1px solid rgba(36,22,16,.24);transition:background .24s var(--ease),color .24s var(--ease)}
.jumps a i{font-style:normal;color:var(--umber)}
.jumps a:hover{background:var(--char);color:var(--cream)}
.jumps a:hover i{color:var(--amber)}
.catintro{padding-bottom:clamp(10px,1.4vw,18px)}
.catsec{padding-top:clamp(30px,4vw,54px);padding-bottom:clamp(30px,4vw,54px);border-top:1px solid rgba(36,22,16,.12);scroll-margin-top:104px}
.cs-head{display:flex;flex-wrap:wrap;gap:6px 26px;align-items:baseline;margin-bottom:20px}
.cs-head h2{font-size:var(--t3)}
.cs-head p{font-size:.9rem;color:var(--clay);max-width:72ch}
.cs-count{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--umber)}
.prodgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
.prodgrid figure{margin:0;background:#fff;border:1px solid rgba(36,22,16,.13);display:flex;flex-direction:column;
  transition:transform .28s var(--ease),box-shadow .28s var(--ease)}
.prodgrid figure:hover{transform:translateY(-3px);box-shadow:0 11px 26px rgba(36,22,16,.13)}
.prodgrid a{display:block;aspect-ratio:1/1;background:#fff;overflow:hidden}
.prodgrid img{width:100%;height:100%;object-fit:contain;transition:transform .45s var(--ease)}
.prodgrid figure:hover img{transform:scale(1.05)}
.prodgrid figcaption{padding:8px 10px;border-top:1px solid rgba(36,22,16,.1);background:var(--sheet);
  font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--clay);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- product lightbox ---------- */
.plbox{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;
  background:rgba(27,17,12,.92);padding:clamp(12px,3vw,36px)}
.plbox.open{display:flex}
.plbox .card{display:flex;flex-direction:column;max-width:min(92vw,860px);max-height:94vh;background:#fff;
  border:1px solid rgba(36,22,16,.2)}
.plbox .ph{background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0}
.plbox .ph img{max-width:100%;max-height:min(66vh,620px);width:auto;height:auto;object-fit:contain}
.plbox .bar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;
  padding:14px 16px;border-top:1px solid rgba(36,22,16,.12);background:var(--sheet)}
.plbox .who{display:flex;flex-direction:column;gap:2px;min-width:0}
.plbox .code{font-family:'DM Mono',ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--umber)}
.plbox .cat{font-family:'Fraunces',ui-serif,Georgia,serif;font-weight:600;font-size:1.05rem;color:var(--char)}
.plbox .bar .btn{white-space:nowrap}
.plbox .x{position:absolute;top:10px;right:10px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  background:var(--amber);color:var(--char);border:0;font-size:20px;line-height:1;cursor:pointer;font-family:'Archivo',sans-serif}
.plbox .x:hover{background:#fff}
@media (prefers-reduced-motion:no-preference){
  .plbox.open .card{animation:plin .22s cubic-bezier(.165,.84,.44,1)}
  @keyframes plin{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
}
body.plopen{overflow:hidden}
