/* DAHMION — additions for the rebuilt site (same tokens as site.css) */
.team-photo{margin:0 0 clamp(30px,4vw,52px);overflow:hidden;border:1px solid var(--line-soft);background:var(--bg-2);}
.team-photo img{display:block;width:100%;height:auto;}
.team-photo figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);padding:12px 16px;}
.people .person{border-top:1px solid var(--line);padding-top:20px;}
.person .n{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:12px;}
.person b{font-size:19px;font-weight:400;letter-spacing:-.01em;}
.markets .vs ul{margin-bottom:0;}
.vs p.lead{color:var(--muted);font-size:16px;line-height:1.6;margin:0 0 18px;max-width:46ch;}
.legal{max-width:74ch;}
.legal h3{font-weight:400;font-size:clamp(19px,1.8vw,23px);letter-spacing:-.01em;margin:clamp(30px,4vw,44px) 0 12px;}
.legal p,.legal li{color:var(--muted);font-size:16px;line-height:1.72;}
.legal ul{padding-left:20px;}
.legal a{color:var(--accent);}
.legal .updated{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);}
.work-item p.plan{margin-top:10px;}

/* ================= phones & small tablets ================= */
/* Service cards: the description belongs in the text column, not under the 44px number column */
@media (max-width:879px){
  .mx{grid-template-columns:36px minmax(0,1fr);gap:8px 16px;}
  .mx p{grid-column:2;}
  .mx .moves{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:4px 12px;}
  .mx .moves b:empty{display:none;}
}
@media (max-width:760px){
  /* readable labels (the 9–10px mono labels are fine on desktop, too small on a phone) */
  .eyebrow,.crumb,.mx .num,.rail-step .n,.fig-note,.fig-src,.vs .tag,.work-meta,.post .meta,.post .more,
  .field label,.form-note,.person .n,.team-photo figcaption,.legal .updated{font-size:11px;letter-spacing:.14em;}
  .mx .moves span{font-size:10.5px;}
  .btn{font-size:11px;}
  /* contact links: big enough to tap */
  .addr a{display:inline-block;padding:10px 0;}
  /* legal pages: comfortable reading width on small screens */
  .legal p,.legal li{font-size:16px;}
  .legal p a,.legal li a{word-break:break-word;}
}

/* Mobile header: show the DAHMION name next to the mark; menu scrolls on short phones */
@media (max-width:760px){
  .frame-logo b{display:inline-block;font-size:12px;letter-spacing:.32em;}
  .menu{overflow-y:auto;-webkit-overflow-scrolling:touch;}
}

/* ================= fullscreen menu (rebuilt right panel) ================= */
/* left list: size to the screen height too, so all 8 items always fit */
.menu-left{overflow-y:auto;}
.menu-left a{font-size:clamp(28px,min(4.2vw,6.2vh),58px);line-height:1.28;}
/* right panel: top → CTA, middle → links, bottom → location */
.menu-right{display:flex;flex-direction:column;justify-content:space-between;gap:clamp(20px,3.6vh,48px);align-content:normal;overflow-y:auto;padding-top:clamp(84px,11vh,130px);padding-bottom:clamp(28px,5vh,60px);}
.menu-kicker{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);}
.menu-kicker::before{content:"";width:28px;height:1px;background:var(--accent);}
.menu-cta-h{font-size:clamp(28px,3vw,46px);font-weight:200;letter-spacing:-.03em;line-height:1.08;margin:18px 0 14px;color:var(--menu-ink);max-width:14ch;}
.menu-cta-h b{font-weight:400;color:var(--accent);}
.menu-cta-p{color:rgba(245,245,247,.55);font-size:15px;line-height:1.6;max-width:40ch;margin:0 0 26px;}
.menu-btn-cta{display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border-radius:999px;background:var(--menu-ink);color:var(--menu-bg);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);}
.menu-btn-cta:hover{background:var(--accent);color:#fff;transform:translateY(-2px);}
.menu-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:28px 40px;padding-top:clamp(24px,4vh,40px);border-top:1px solid rgba(255,255,255,.1);}
.menu-col h4{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;color:rgba(245,245,247,.45);margin-bottom:16px;}
.menu-col li{font-size:15.5px;color:rgba(245,245,247,.75);}
.menu-col a{transition:color .3s var(--ease);}
.menu-h4-gap{margin-top:28px;}
.menu-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,245,247,.4);}
/* phones & tablets: single column — keep the CTA and contact, drop the service list (it's one tap away) */
@media (max-width:1100px){
  .menu-left{justify-content:flex-start;padding-top:92px;padding-bottom:6px;overflow:visible;}
  .menu-right{justify-content:flex-start;gap:26px;padding-top:28px;padding-bottom:40px;overflow:visible;}
  .menu-services{display:none;}
  .menu-grid{grid-template-columns:1fr;padding-top:22px;}
  .menu-cta-h{font-size:28px;}
  .menu-cta-p{display:none;}
}

/* ================= team change requests (Oct 2026) ================= */
/* CR01 — FAQ sections centred in their band, questions stay left-aligned for easy reading */
.band:has(> .faq) .head{grid-template-columns:1fr;justify-items:center;text-align:center;margin-left:auto;margin-right:auto;}
.band:has(> .faq) .head .eyebrow{justify-content:center;}
.band:has(> .faq) .head p{margin:0 auto;}
.band .faq{margin-left:auto;margin-right:auto;}

/* CR03 — vertical page label sits on the very edge, clear of the content */
.frame-label{left:clamp(6px,1vw,16px);font-size:9px;opacity:.75;}

/* CR04 — "Back to top": a clear round button in the corner on every screen (no rotated text) */
.frame-top{left:auto;right:clamp(16px,2.4vw,36px);bottom:clamp(16px,3vh,32px);writing-mode:horizontal-tb;transform:none;}
.frame-top > span:first-child{display:none;}
.frame-top .circle{width:46px;height:46px;transform:none;background:var(--bg);border-color:var(--line);box-shadow:0 8px 24px rgba(0,0,0,.18);}
.frame-top .circle svg{transform:none;}

/* CR04 — footer: brand + three link groups, then a bottom bar */
footer{padding:clamp(48px,7vw,84px) 0 clamp(26px,3vw,34px);}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px clamp(24px,4vw,64px);}
.foot-logo{display:inline-flex;align-items:center;gap:10px;color:var(--ink);}
.foot-brand .mark{height:26px;filter:var(--mark-filter);}
.foot-brand b{font-weight:300;font-size:15px;letter-spacing:.3em;text-transform:uppercase;}
.foot-brand p{color:var(--muted);font-size:15px;line-height:1.6;max-width:34ch;margin:18px 0 16px;}
.foot-brand a.foot-mail{color:var(--ink);font-size:15px;border-bottom:1px solid var(--line);padding-bottom:2px;transition:color .3s var(--ease),border-color .3s var(--ease);}
.foot-brand a.foot-mail:hover{color:var(--accent);border-color:var(--accent);}
.foot-brand .foot-where{display:block;margin-top:16px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);}
.foot-col h4{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;color:var(--faint);margin:0 0 16px;}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.foot-col a{color:var(--muted);font-size:14.5px;transition:color .3s var(--ease);}
.foot-col a:hover{color:var(--accent);}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 28px;margin-top:clamp(40px,5vw,64px);padding-top:22px;border-top:1px solid var(--line-soft);
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);}
.foot-top{display:inline-flex;align-items:center;gap:10px;background:none;border:1px solid var(--line);border-radius:999px;padding:10px 16px;cursor:pointer;
  font:inherit;text-transform:inherit;letter-spacing:inherit;color:var(--ink);transition:border-color .3s var(--ease),color .3s var(--ease);}
.foot-top:hover{border-color:var(--accent);color:var(--accent);}
.foot-social{display:flex;gap:18px;}
@media (max-width:980px){ .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .foot-brand{grid-column:1 / -1;} }
@media (max-width:560px){
  .foot-grid{grid-template-columns:1fr 1fr;gap:34px 20px;}
  .foot-col a{display:inline-block;padding:10px 0;font-size:15px;}
  .foot-brand a.foot-mail{display:inline-block;padding:10px 0 4px;}
  .foot-col ul{gap:2px;}
  .foot-col.foot-legal-col{grid-column:1 / -1;}
  .foot-col.foot-legal-col ul{display:grid;grid-template-columns:1fr 1fr;gap:2px 20px;}
  .foot-bottom{flex-direction:column;align-items:flex-start;}
}
/* CR05 — section headings that open their page */
.head h2 a.head-link{color:inherit;transition:color .3s var(--ease);}
.head h2 a.head-link:hover{color:var(--accent);}
/* The floating back-to-top button covered content on the right edge — the footer has its own "Back to top" button instead */
.frame-top{display:none !important;}

/* ================= Oct 2026 round 3 ================= */
/* Top bar backdrop after scrolling — matches the light/dark tone the bar is already painted for */
.frame::before{content:"";position:absolute;left:0;right:0;top:0;height:clamp(74px,8.6vw,108px);pointer-events:none;opacity:0;transition:opacity .35s var(--ease);
  background:color-mix(in srgb,var(--bg) 86%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  -webkit-mask-image:linear-gradient(#000 72%,transparent);mask-image:linear-gradient(#000 72%,transparent);}
.frame.scrolled::before{opacity:1;}
.frame.on-dark::before{background:rgba(10,10,12,.86);}
.frame.on-light::before{background:rgba(255,255,255,.86);}
body.menu-open .frame::before{opacity:0;}

/* Services list: wider right-hand column so labels sit on one line */
@media (min-width:880px){
  .mx{grid-template-columns:44px minmax(0,1fr) minmax(0,1.3fr) 240px;}
  .mx .moves span{white-space:nowrap;}
  .mx .moves b{font-size:24px;}
}

/* "Who we work best with" — card grid */
.fit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line-soft);border:1px solid var(--line-soft);}
.fit{background:var(--bg);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:12px;min-height:200px;transition:background .3s var(--ease);}
.tone-dark .fit{background:var(--bg-2);}
.fit:hover{background:var(--bg-3);}
.fit .n{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--accent);}
.fit h3{font-size:clamp(20px,2vw,27px);font-weight:300;letter-spacing:-.02em;margin-top:auto;}
.fit p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.55;max-width:34ch;}
.fit-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;}
.fit-cta span{color:var(--muted);font-size:14.5px;}
@media (max-width:900px){ .fit-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ .fit-grid{grid-template-columns:1fr;} .fit{min-height:0;} .fit h3{margin-top:4px;} }

/* Checklists (International "The basics", Launch types, Industries, Careers, Creator network):
   a full-width grid of ticked cells instead of a plain bullet list */
.checks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:1px;background:var(--line-soft);border:1px solid var(--line-soft);}
.checks li{position:relative;background:var(--bg);padding:clamp(20px,2.4vw,30px) clamp(20px,2.4vw,30px) clamp(20px,2.4vw,30px) clamp(58px,5vw,70px);
  font-size:clamp(15.5px,1.25vw,17.5px);line-height:1.5;color:var(--ink);min-height:96px;display:flex;align-items:center;transition:background .3s var(--ease);}
.tone-dark .checks li{background:var(--bg-2);}
.checks li:hover{background:var(--bg-3);}
.checks li::before{content:"";position:absolute;left:clamp(20px,2.4vw,30px);top:50%;width:24px;height:24px;margin-top:-12px;border-radius:50%;
  background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat;}
@media (max-width:900px){ .checks{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ .checks{grid-template-columns:1fr;} .checks li{min-height:0;} }

/* ================= Journal articles ================= */
.article-wrap{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:clamp(30px,6vw,110px);align-items:start;}
.article-side{position:sticky;top:clamp(96px,12vh,130px);display:flex;flex-direction:column;gap:26px;}
.article-meta{display:flex;flex-direction:column;gap:8px;margin:0;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);}
.article-toc{display:flex;flex-direction:column;gap:10px;padding-top:22px;border-top:1px solid var(--line-soft);}
.article-toc b{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:400;color:var(--accent);margin-bottom:4px;}
.article-toc a{color:var(--muted);font-size:14px;line-height:1.45;transition:color .3s var(--ease);}
.article-toc a:hover{color:var(--accent);}
.article{max-width:70ch;font-size:clamp(16.5px,1.2vw,18px);line-height:1.75;color:var(--ink);}
.article p{margin:0 0 1.1em;color:var(--ink);opacity:.88;}
.article h2{font-size:clamp(25px,2.6vw,36px);font-weight:300;letter-spacing:-.025em;line-height:1.15;margin:1.9em 0 .6em;scroll-margin-top:110px;}
.article h2:first-child{margin-top:0;}
.article h3{font-size:clamp(19px,1.7vw,23px);font-weight:400;letter-spacing:-.01em;margin:1.6em 0 .5em;}
.article ul,.article ol{margin:0 0 1.2em;padding-left:1.25em;}
.article li{margin:0 0 .55em;opacity:.88;}
.article li::marker{color:var(--accent);}
.article b{font-weight:500;opacity:1;}
.article a{color:var(--accent);border-bottom:1px solid currentColor;}
.article .callout{margin:1.6em 0;padding:clamp(18px,2.2vw,26px) clamp(20px,2.4vw,30px);border-left:3px solid var(--accent);background:var(--bg-2);font-size:.98em;line-height:1.65;}
.journal-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.post p{flex:1;}
@media (max-width:900px){
  .article-wrap{grid-template-columns:1fr;}
  .article-side{position:static;}
  .article-toc{display:none;}
  .journal-2{grid-template-columns:1fr;}
}
