/* THEBS Company LLC, thebs.company
   Direction "Manifest": warm paper, ink type, one accent, radius 0, no shadows, no gradients.
   Fonts self-hosted, nothing loaded from third-party servers. */

@font-face{font-family:'Archivo';src:url('/assets/fonts/archivo.woff2?v=20260922-1') format('woff2');font-weight:600;font-style:normal;font-display:swap;font-stretch:112%}
@font-face{font-family:'IBM Plex Sans';src:url('/assets/fonts/plex-sans-400.woff2?v=20260922-1') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/assets/fonts/plex-sans-600.woff2?v=20260922-1') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/assets/fonts/plex-mono-400.woff2?v=20260922-1') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{
  --paper:#F5F4EF;
  --surface:#FFFFFF;
  --panel:#ECEAE3;
  --ink:#14181B;
  --muted:#5A6168;
  --line:#D6D3CA;
  --line-strong:#85898C;
  --accent:#A8400F;
  --accent-hover:#8A330B;

  --wrap:1240px;
  --pad-x:clamp(1.25rem,4vw,2.5rem);
  --section-y:clamp(4rem,8vw,7rem);
  --gap:24px;

  --font-display:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:88px}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:400 1.0625rem/1.6 var(--font-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
address{font-style:normal}

::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.skip-link{
  position:absolute;left:-9999px;top:0;z-index:50;
  background:var(--ink);color:var(--paper);
  padding:10px 16px;font:400 .8125rem/1.4 var(--font-mono);
}
.skip-link:focus{left:8px;top:8px}

.wrap{
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--pad-x);
}

/* ---------- type ---------- */

.eyebrow{
  font:400 .75rem/1.4 var(--font-mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 14px;
}
h1{
  font-family:var(--font-display);
  font-weight:600;
  font-stretch:112%;
  font-size:clamp(2.5rem,1.5rem + 3.4vw,4rem);
  line-height:1.02;
  letter-spacing:-.02em;
  max-width:22ch;
  text-wrap:balance;
}
h2{
  font-family:var(--font-display);
  font-weight:600;
  font-stretch:112%;
  font-size:clamp(1.75rem,1.2rem + 1.6vw,2.5rem);
  line-height:1.1;
  letter-spacing:-.015em;
  max-width:30ch;
}
h3{
  font:600 1.125rem/1.3 var(--font-body);
}
.lead{
  font-size:1.25rem;
  line-height:1.5;
  color:var(--ink);
  max-width:46ch;
}
.section > .wrap > h2{margin-bottom:clamp(1.75rem,3vw,2.75rem)}

/* ---------- buttons ---------- */

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:11px 20px;
  font:600 .9375rem/1.2 var(--font-body);
  text-decoration:none;
  border:1px solid transparent;
  transition:background-color 160ms ease-out,color 160ms ease-out,border-color 160ms ease-out;
}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover)}
.btn-ghost{border-color:var(--line-strong);color:var(--ink);background:transparent}
.btn-ghost:hover{border-color:var(--ink);background:var(--panel)}

/* ---------- header ---------- */

.site-head{
  position:sticky;top:0;z-index:20;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.head-inner{
  display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);
  min-height:64px;
}
.brand{display:flex;align-items:baseline;gap:8px;text-decoration:none;margin-right:auto}
.brand-name{
  font-family:var(--font-display);font-weight:600;font-stretch:112%;
  font-size:1.125rem;letter-spacing:.04em;
}
.brand-sub{
  font:400 .6875rem/1.4 var(--font-mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
}
.site-nav{display:flex;gap:clamp(1rem,2.2vw,2rem)}
.site-nav a{
  font:400 .875rem/1.4 var(--font-body);
  text-decoration:none;padding:6px 0;
  border-bottom:1px solid transparent;
  transition:border-color 160ms ease-out,color 160ms ease-out;
}
.site-nav a:hover{border-bottom-color:var(--accent);color:var(--accent)}
.nav-drawer{display:none}

/* ---------- hero ---------- */

.hero{padding-top:clamp(2rem,5vw,4rem)}
.hero-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gap);align-items:end;
}
.hero-copy{grid-column:1 / span 8}
.hero-copy .lead{margin-top:20px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-ledger{
  grid-column:9 / span 4;
  background:var(--surface);
  border-top:2px solid var(--ink);
  padding:20px 24px 24px;
}
.hero-ledger dl{display:grid;grid-template-columns:1fr;gap:0;margin:0}
.hero-ledger dt{
  font:400 .6875rem/1.4 var(--font-mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  margin-top:14px;
}
.hero-ledger dt:first-child{margin-top:0}
.hero-ledger dd{
  font:400 .875rem/1.5 var(--font-mono);
  font-variant-numeric:tabular-nums;
  margin:2px 0 0;
  overflow-wrap:anywhere;
}

.hero-media{
  margin:clamp(2.5rem,5vw,4rem) 0 0;
  width:100vw;margin-left:calc(50% - 50vw);
}
.hero-media img{width:100%;aspect-ratio:21/9;object-fit:cover;object-position:50% 62%}
.bleed-media img{width:100%;aspect-ratio:21/9;object-fit:cover;object-position:50% 50%}
figcaption{
  font:400 .75rem/1.5 var(--font-mono);
  color:var(--muted);
  padding:10px max(var(--pad-x),calc((100vw - var(--wrap)) / 2)) 0;
}

/* ---------- sections ---------- */

.section{padding-block:var(--section-y);border-top:1px solid var(--ink)}
.band-photo{padding-block:var(--section-y) calc(var(--section-y) + 3rem)}
.bleed-media{margin:0;width:100vw;margin-left:calc(50% - 50vw)}

/* services: ruled index table */
.index-table{border-bottom:1px solid var(--line)}
.index-row{
  position:relative;
  display:grid;grid-template-columns:4fr 5fr 3fr;gap:var(--gap);
  align-items:baseline;
  padding:22px 0;
  border-top:1px solid var(--line);
}
.index-row:first-child{border-top:none}
.index-row h3{font-size:1.0625rem}
.index-row p{color:var(--ink)}
.index-row::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--accent);
  transform:scaleX(0);transform-origin:left;
  transition:transform 220ms cubic-bezier(.2,.7,.2,1);
}
.index-row:hover::after,.index-row:focus-within::after{transform:scaleX(1)}
.spec{
  font:400 .8125rem/1.5 var(--font-mono);
  letter-spacing:.02em;color:var(--muted);
  text-align:right;
}

/* how we work: numbered rail */
.rail{
  position:relative;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--gap);
  border-top:2px solid var(--ink);
  padding-top:22px;
}
.rail::before{
  content:'';position:absolute;top:-2px;left:0;right:0;height:2px;
  background:var(--accent);
  transform:scaleX(0);transform-origin:left;
}
.rail-num{
  font:400 .875rem/1.4 var(--font-mono);
  color:var(--accent);
  margin:0 0 10px;
}
.rail li h3{margin-bottom:8px}
.rail li p:last-child{font-size:.9375rem;color:var(--ink)}

/* consolidation: full-bleed photo with an overlapping plate */
.plate-wrap{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gap);
  margin-top:-72px;position:relative;z-index:1;
}
.plate{
  grid-column:7 / span 6;
  background:var(--surface);
  border-top:2px solid var(--ink);
  padding:clamp(1.5rem,3vw,2.25rem);
}
.plate p{margin-top:16px;max-width:56ch}
.ticks{margin-top:22px;display:grid;gap:10px}
.ticks li{position:relative;padding-left:26px;font-size:.9375rem}
.ticks li::before{
  content:'';position:absolute;left:0;top:.7em;
  width:14px;height:1px;background:var(--accent);
}

/* e-commerce: asymmetric image and spec sheet */
.asym-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gap);align-items:start;
}
.asym-media{grid-column:1 / span 5;margin:0}
.asym-media img{width:100%;aspect-ratio:4/5;object-fit:cover}
.asym-copy{grid-column:7 / span 6}
.asym-copy > p{margin-top:16px;max-width:56ch}
.spec-sheet{
  margin:26px 0 0;
  display:grid;grid-template-columns:minmax(7rem,auto) 1fr;gap:0 var(--gap);
  border-top:1px solid var(--line);
}
.spec-sheet dt{
  font:400 .6875rem/1.6 var(--font-mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  padding:12px 0;border-bottom:1px solid var(--line);
}
.spec-sheet dd{
  margin:0;padding:12px 0;border-bottom:1px solid var(--line);
  font-size:.9375rem;
}

/* scope: accordion */
.scope-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gap);
}
.scope-intro{grid-column:1 / span 5}
.scope-intro > p{margin-top:16px;max-width:46ch;color:var(--ink)}
.scope-items{grid-column:7 / span 6}
.scope-items details{border-top:1px solid var(--line)}
.scope-items details:last-child{border-bottom:1px solid var(--line)}
.scope-items summary{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 0;cursor:pointer;
  font:600 1.0625rem/1.3 var(--font-body);
  list-style:none;
}
.scope-items summary::-webkit-details-marker{display:none}
.scope-items summary::after{
  content:'';flex:0 0 auto;
  width:9px;height:9px;
  border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);
  transform:rotate(-45deg);
  transition:transform 160ms ease-out;
  margin-right:4px;
}
.scope-items details[open] summary::after{transform:rotate(45deg)}
.scope-items details[open]{background:var(--panel)}
.scope-items details > *:not(summary){margin-inline:0}
.scope-items ul,.scope-items ol{padding:0 0 16px;display:grid;gap:10px}
.scope-items li{position:relative;padding-left:24px;font-size:.9375rem}
.scope-items ul li::before{
  content:'';position:absolute;left:0;top:.7em;width:12px;height:1px;background:var(--accent);
}
.scope-items ol{counter-reset:none}
.scope-items details p{padding:0 0 16px;font-size:.9375rem;max-width:58ch}
.scope-items details{padding-inline:0}
@media (min-width:900px){
  .scope-items details[open],.scope-items details[open] summary{padding-inline:18px}
}

/* contact */
.contact{border-top:2px solid var(--ink)}
.contact-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gap);align-items:start;
}
.contact-main{grid-column:1 / span 7}
.contact-mail{margin-top:22px}
.contact-mail a{
  font-family:var(--font-display);font-weight:600;font-stretch:112%;
  font-size:clamp(1.5rem,1rem + 2.2vw,2.25rem);
  line-height:1.15;letter-spacing:-.015em;
  color:var(--accent);text-decoration:none;
  overflow-wrap:anywhere;
}
.contact-mail a:hover{color:var(--accent-hover);text-decoration:underline}
.contact-note{margin-top:16px;color:var(--muted);font-size:.9375rem}
.contact-list{grid-column:9 / span 4}
.contact-list h3{margin-bottom:12px}
.contact-list ol{counter-reset:item;display:grid;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.contact-list li{counter-increment:item;position:relative;padding-left:30px;font-size:.9375rem}
.contact-list li::before{
  content:counter(item,decimal-leading-zero);
  position:absolute;left:0;top:0;
  font:400 .75rem/1.6 var(--font-mono);color:var(--accent);
}

/* ---------- footer ---------- */

.site-foot{border-top:2px solid var(--ink);padding-top:clamp(3rem,6vw,5rem)}
.foot-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gap);
  padding-bottom:clamp(2rem,4vw,3rem);
}
.foot-brand{grid-column:1 / span 3}
.foot-brand .brand-name{display:block;font-size:1.375rem}
.foot-brand .brand-sub{display:block;margin-top:2px}
.foot-brand p{margin-top:16px;font-size:.9375rem;max-width:32ch}
.foot-col{grid-column:span 3}
.foot-col:nth-child(2){grid-column:4 / span 3}
.foot-col:nth-child(3){grid-column:7 / span 3}
.foot-col:nth-child(4){grid-column:10 / span 3}
.foot-col h2{
  font:400 .6875rem/1.4 var(--font-mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  margin:0 0 12px;
}
.foot-list{display:grid;gap:8px;font:400 .8125rem/1.6 var(--font-mono)}
.foot-list a,.foot-col address a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-strong)}
.foot-list a:hover,.foot-col address a:hover{border-bottom-color:var(--accent);color:var(--accent)}
.foot-col address{font:400 .8125rem/1.7 var(--font-mono);font-variant-numeric:tabular-nums}
.foot-bottom{
  display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between;
  border-top:1px solid var(--line);
  padding-block:22px 28px;
}
.foot-bottom p{font:400 .75rem/1.6 var(--font-mono);color:var(--muted)}
.credits{max-width:88ch}

/* ---------- motion ---------- */

@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .rail::before{
      animation:rail-draw linear both;
      animation-timeline:view();
      animation-range:entry 20% cover 45%;
    }
    @keyframes rail-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  }
}
@supports (interpolate-size:allow-keywords){
  :root{interpolate-size:allow-keywords}
  .scope-items details::details-content{
    block-size:0;overflow:hidden;
    transition:block-size 240ms ease-out,content-visibility 240ms allow-discrete;
  }
  .scope-items details[open]::details-content{block-size:auto}
}

/* ---------- responsive ---------- */

@media (max-width:1099px){
  .foot-brand{grid-column:1 / span 6}
  .foot-col:nth-child(2){grid-column:7 / span 6}
  .foot-col:nth-child(3){grid-column:1 / span 6}
  .foot-col:nth-child(4){grid-column:7 / span 6}
  .spec-sheet{grid-template-columns:1fr}
  .spec-sheet dt{padding-bottom:0;border-bottom:none}
  .spec-sheet dd{padding-top:4px}
}

@media (max-width:899px){
  .site-nav,.head-cta{display:none}
  .head-inner{gap:1rem}
  .nav-drawer{display:block;margin-left:auto}
  .nav-drawer summary{
    display:flex;align-items:center;gap:8px;
    min-height:44px;padding:0 4px;cursor:pointer;
    font:400 .8125rem/1.4 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;
    list-style:none;
  }
  .nav-drawer summary::-webkit-details-marker{display:none}
  .nav-drawer summary::after{
    content:'';width:8px;height:8px;
    border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);
    transform:rotate(45deg) translateY(-2px);
  }
  .nav-drawer[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
  .nav-drawer nav{
    position:absolute;left:0;right:0;top:100%;
    background:var(--paper);border-bottom:1px solid var(--ink);
    padding:8px var(--pad-x) 16px;
    display:grid;gap:2px;
  }
  .nav-drawer nav a{
    padding:12px 0;text-decoration:none;font-size:1.0625rem;
    border-bottom:1px solid var(--line);
  }
  .nav-drawer nav a:last-child{border-bottom:none}

  .hero-grid{grid-template-columns:1fr;align-items:start}
  .hero-copy,.hero-ledger{grid-column:1 / -1}
  .hero-ledger{margin-top:8px}
  .hero-media img{aspect-ratio:3/2}
  .bleed-media img{aspect-ratio:3/2}

  .index-row{grid-template-columns:1fr;gap:6px;padding:20px 0}
  .spec{text-align:left}
  .rail{grid-template-columns:1fr;gap:0;border-top:1px solid var(--ink);padding-top:0}
  .rail li{padding:20px 0;border-bottom:1px solid var(--line)}
  .rail li:last-child{border-bottom:none}
  .rail::before{display:none}

  .plate-wrap{grid-template-columns:1fr;margin-top:0}
  .plate{grid-column:1 / -1;border-top:1px solid var(--ink)}

  .asym-grid{grid-template-columns:1fr}
  .asym-media,.asym-copy{grid-column:1 / -1}
  .asym-copy{margin-top:28px}

  .scope-grid{grid-template-columns:1fr}
  .scope-intro,.scope-items{grid-column:1 / -1}
  .scope-items{margin-top:24px}

  .contact-grid{grid-template-columns:1fr}
  .contact-main,.contact-list{grid-column:1 / -1}
  .contact-list{margin-top:32px}

  .foot-grid{grid-template-columns:1fr}
  .foot-brand,.foot-col,.foot-col:nth-child(2),.foot-col:nth-child(3),.foot-col:nth-child(4){
    grid-column:1 / -1;
  }
  .foot-col{margin-top:28px}
}

@media (max-width:599px){
  .hero-actions .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .rail::before{transform:scaleX(1)}
}

@media print{
  .site-head,.skip-link,.nav-drawer{display:none}
  body{background:#fff}
}
