/* TAMAKUN — site stylesheet. Tokens match the existing tamakun.com build. */
:root{
  --espresso:#403428; --walnut:#603814; --amber:#E1A62F; --amber-deep:#C68A1C;
  --tan:#C3B59B; --cream:#F0EBE0; --cream-hi:#FAF6EF; --paper:#FAF7F1;
  --ink:#1A1A1A; --muted:#6A5C4C; --soft:#8C7B5E;
  --line:rgba(64,52,40,.14); --line-hi:rgba(240,235,224,.16);
  --maxw:1140px;
  --r:2px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--paper); color:var(--espresso);
  font-family:'Work Sans',-apple-system,system-ui,sans-serif;
  font-size:16px; line-height:1.68; -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:var(--walnut); text-decoration:none; }
a:hover{ color:var(--amber-deep); }
:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; }
h1,h2,h3,h4{ font-family:'Zilla Slab',Georgia,serif; margin:0; text-wrap:balance; }
h1{ font-size:clamp(34px,5.2vw,60px); font-weight:600; line-height:1.04; letter-spacing:-.022em; }
h2{ font-size:clamp(25px,3.4vw,38px); font-weight:600; line-height:1.14; letter-spacing:-.014em; }
h3{ font-size:clamp(18px,2vw,21px); font-weight:600; line-height:1.24; }
h4{ font-size:16px; font-weight:600; line-height:1.3; }
p{ margin:0 0 1.05em; }
p:last-child{ margin-bottom:0; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:24px; }
.eyebrow{ font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--soft); }
.amp{ color:var(--amber); }
.lede{ font-family:'Zilla Slab',Georgia,serif; font-size:clamp(17px,2.1vw,21px); line-height:1.5; color:var(--muted); }
.measure{ max-width:66ch; }
.section{ padding-block:clamp(56px,7vw,96px); }
.section.alt{ background:var(--cream-hi); border-block:1px solid var(--line); }
.section.dark{ background:var(--espresso); color:var(--cream); }
.section.dark h2,.section.dark h3{ color:var(--cream); }
.section.dark .eyebrow{ color:var(--amber); }
.section.dark .lede{ color:var(--tan); }
.section-head{ margin-bottom:clamp(28px,3.6vw,46px); }
.section-head h2{ margin-top:12px; }
.section-head .lede{ margin-top:16px; }

/* nav */
.nav{ position:sticky; top:0; z-index:50; background:rgba(250,247,241,.94);
  backdrop-filter:saturate(140%) blur(8px); border-bottom:1px solid var(--line); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding-block:14px; max-width:var(--maxw); margin:0 auto; padding-inline:24px; }
.brand img{ height:30px; width:auto; }
.links{ display:flex; align-items:center; gap:26px; list-style:none; margin:0; padding:0; }
.links a{ font-size:14px; font-weight:500; color:var(--espresso); letter-spacing:.01em; }
.links a:hover,.links a[aria-current="page"]{ color:var(--amber-deep); }
.links a[aria-current="page"]{ border-bottom:2px solid var(--amber); padding-bottom:2px; }
.btn{ display:inline-flex; align-items:center; gap:9px; font-size:14px; font-weight:600;
  padding:11px 20px; border:1px solid var(--espresso); border-radius:var(--r);
  background:var(--espresso); color:var(--cream); white-space:nowrap; }
.btn:hover{ background:var(--walnut); border-color:var(--walnut); color:var(--cream); }
.btn.amber{ background:var(--amber); border-color:var(--amber); color:var(--espresso); }
.btn.amber:hover{ background:var(--amber-deep); border-color:var(--amber-deep); color:var(--espresso); }
.btn.ghost{ background:transparent; color:var(--espresso); }
.btn.ghost:hover{ background:var(--espresso); color:var(--cream); }
.btn.on-dark{ background:transparent; border-color:var(--tan); color:var(--cream); }
.btn.on-dark:hover{ background:var(--cream); border-color:var(--cream); color:var(--espresso); }
.menu-toggle{ display:none; background:none; border:1px solid var(--line); border-radius:var(--r);
  padding:8px 12px; font:inherit; font-size:13px; font-weight:600; color:var(--espresso); cursor:pointer; }

/* hero */
.hero{ padding-block:clamp(52px,8vw,104px) clamp(40px,5vw,64px); }
.hero h1{ margin-bottom:22px; }
.hero .lede{ max-width:56ch; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.verbs{ display:flex; flex-wrap:wrap; gap:8px 10px; margin-top:30px; }
.verb{ font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line); padding:6px 13px; border-radius:var(--r); }

.strip{ background:var(--espresso); color:var(--tan); }
.strip .wrap{ display:flex; flex-wrap:wrap; gap:10px 30px; justify-content:center;
  padding-block:15px; font-size:11.5px; font-weight:600; letter-spacing:.19em; text-transform:uppercase; }

/* layered stack */
.stack{ display:flex; flex-direction:column; gap:10px; }
.band{ display:flex; border:1px solid var(--line); background:#fff; }
.band:hover{ border-color:var(--tan); }
.band .bnum{ flex:0 0 112px; background:var(--espresso); color:var(--cream);
  padding:20px 18px; display:flex; flex-direction:column; justify-content:space-between; gap:20px; }
.band .bnum .n{ font-family:'Zilla Slab',Georgia,serif; font-size:20px; font-weight:600; color:var(--amber); line-height:1; }
.band .bnum .t{ font-size:12px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; }
.band .bbody{ flex:1; padding:20px 24px; min-width:0; }
.band .bout{ font-family:'Zilla Slab',Georgia,serif; font-size:17px; font-weight:500; line-height:1.34; }
.band .bcap{ font-size:13px; color:var(--muted); margin-top:9px; line-height:1.55; }

/* tags */
.tags{ display:flex; flex-wrap:wrap; gap:6px 7px; margin-top:14px; }
.tag{ font-size:11.5px; font-weight:500; color:var(--walnut); border:1px solid var(--line);
  background:var(--cream-hi); padding:3px 10px; border-radius:var(--r); white-space:nowrap; }
.tag .ai{ color:var(--amber); }

/* grids and cards */
.grid{ display:grid; gap:16px; }
.g2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.g3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.g4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.card{ border:1px solid var(--line); background:#fff; padding:24px; }
.card h3{ margin-bottom:10px; }
.card p{ font-size:14.5px; color:var(--muted); }
.card .num{ font-family:'Zilla Slab',Georgia,serif; font-size:17px; font-weight:600; color:var(--amber); line-height:1; }
.section.dark .card{ background:#4A3D2F; border-color:var(--line-hi); }
.section.dark .card p{ color:var(--tan); }

/* stats */
.stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0;
  border-block:1px solid var(--line); }
.stat{ padding:24px 22px; border-left:1px solid var(--line); }
.stat:first-child{ border-left:0; padding-left:0; }
.stat .k{ font-family:'Zilla Slab',Georgia,serif; font-size:clamp(30px,4vw,44px); font-weight:600; line-height:1; }
.stat .v{ font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin-top:10px; }

/* portfolio filter */
.filters{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; }
.filter{ font:inherit; font-size:13px; font-weight:600; letter-spacing:.04em; cursor:pointer;
  border:1px solid var(--line); background:#fff; color:var(--espresso);
  padding:9px 17px; border-radius:var(--r); }
.filter:hover{ border-color:var(--tan); }
.filter[aria-pressed="true"]{ background:var(--espresso); border-color:var(--espresso); color:var(--cream); }
.vendors{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.vendor{ border:1px solid var(--line); border-top:2px solid var(--amber); background:#fff; padding:15px 16px; }
.vendor .vn{ font-size:14.5px; font-weight:600; line-height:1.25; }
.vendor .vp{ font-size:12.5px; color:var(--muted); margin-top:5px; line-height:1.45; }
.vendor .vl{ font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--soft); margin-top:10px; }
.vendor[hidden]{ display:none; }
.count{ font-size:13px; color:var(--soft); margin-bottom:18px; }

/* loop diagram */
.loop{ display:flex; flex-wrap:wrap; gap:0; border:1px solid var(--line-hi); }
.loop .step{ flex:1 1 130px; padding:18px 14px; border-left:1px solid var(--line-hi); }
.loop .step:first-child{ border-left:0; }
.loop .step .s{ font-size:11px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--amber); }
.loop .step .d{ font-size:12.5px; color:var(--tan); margin-top:8px; line-height:1.45; }

/* autonomy table */
.tblwrap{ overflow-x:auto; }
table{ border-collapse:collapse; width:100%; min-width:660px; font-size:14px; }
th,td{ text-align:left; padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
thead th{ font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--soft); border-bottom:1px solid var(--espresso); }
tbody tr:hover{ background:var(--cream-hi); }
td.lvl{ font-family:'Zilla Slab',Georgia,serif; font-weight:600; white-space:nowrap; }
td.lvl .badge{ color:var(--amber); }

/* steps */
.steps{ display:flex; flex-direction:column; gap:10px; }
.step-row{ display:flex; gap:0; border:1px solid var(--line); background:#fff; }
.step-row .sn{ flex:0 0 152px; background:var(--espresso); color:var(--cream); padding:18px;
  display:flex; flex-direction:column; justify-content:space-between; gap:16px; }
.step-row .sn .n{ font-family:'Zilla Slab',Georgia,serif; font-size:20px; font-weight:600; color:var(--amber); line-height:1; }
.step-row .sn .t{ font-size:11.5px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; }
.step-row .sb{ flex:1; padding:18px 22px; min-width:0; }
.step-row .sb p{ font-size:14.5px; }
.step-row .sb .k{ font-size:12.5px; color:var(--soft); margin-top:8px; }

/* value chain */
.vc{ border:1px solid var(--line); background:#fff; padding:24px; }
.vc .bar{ background:var(--espresso); color:var(--cream); text-align:center; padding:11px;
  font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.vc .mid{ display:flex; gap:10px; margin-block:10px; align-items:stretch; }
.vc .cell{ flex:1; border:1px solid var(--line); background:var(--paper); padding:16px 10px;
  text-align:center; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:center; }
.vc .col{ flex:1.6; display:flex; flex-direction:column; gap:10px; }
.vc .col .cell{ padding:10px; }
.vc .edge{ flex:0 0 64px; display:flex; flex-direction:column; justify-content:center; gap:4px;
  font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--soft); }

/* insight cards */
.posts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.post{ border:1px solid var(--line); background:#fff; padding:20px; display:flex;
  flex-direction:column; gap:10px; }
.post .cat{ font-size:10.5px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--amber); }
.post h3{ font-size:17px; }
.post p{ font-size:13.5px; color:var(--muted); margin:0; }
.post .meta{ font-size:11.5px; color:var(--soft); margin-top:auto; padding-top:10px; }

/* cta + footer */
.cta{ background:var(--espresso); color:var(--cream); }
.cta h2{ color:var(--cream); max-width:18ch; }
.cta .lede{ color:var(--tan); max-width:52ch; margin-top:18px; }
.cta .hero-cta{ margin-top:28px; }
footer{ background:var(--espresso); color:var(--tan); border-top:1px solid var(--line-hi); }
footer .wrap{ padding-block:44px 34px; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:32px; }
footer img{ height:34px; margin-bottom:16px; }
footer a{ color:var(--cream); font-size:14px; }
footer a:hover{ color:var(--amber); }
.foot-col h4{ font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--amber); margin-bottom:14px; }
.foot-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.foot-bottom{ margin-top:32px; padding-top:20px; border-top:1px solid var(--line-hi);
  display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:space-between; font-size:12px; }

@media (max-width:1040px){
  .g4,.vendors,.posts{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .g3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stats{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stat{ border-left:0; border-top:1px solid var(--line); padding-inline:0; }
  .stat:first-child,.stat:nth-child(2){ border-top:0; }
}
@media (max-width:960px){
  .links{ display:none; }
  .menu-toggle{ display:inline-block; }
  .nav.open .links{ display:flex; position:absolute; left:0; right:0; top:100%;
    flex-direction:column; align-items:flex-start; gap:0; background:var(--paper);
    border-bottom:1px solid var(--line); padding:10px 24px 18px; }
  .nav.open .links li{ width:100%; }
  .nav.open .links a{ display:block; padding:11px 0; border-bottom:1px solid var(--line); }
  .foot-grid{ grid-template-columns:1fr 1fr; }
  .vc .mid{ flex-wrap:wrap; }
  .vc .edge{ flex-basis:100%; flex-direction:row; justify-content:center; gap:8px; }
}
@media (max-width:680px){
  .g2,.g3,.g4,.vendors,.posts{ grid-template-columns:minmax(0,1fr); }
  .band,.step-row{ flex-direction:column; }
  .band .bnum,.step-row .sn{ flex-basis:auto; flex-direction:row; align-items:center; gap:14px; padding:13px 18px; }
  .foot-grid{ grid-template-columns:minmax(0,1fr); }
  .loop .step{ border-left:0; border-top:1px solid var(--line-hi); }
  .loop .step:first-child{ border-top:0; }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ animation:none!important; transition:none!important; }
}