/* ============================================================
   GSLEY DIGITAL · COMPONENT STYLESHEET
   ------------------------------------------------------------
   Design TOKENS live in theme.json. This file holds only the
   components theme.json cannot express: header, nav, footer,
   buttons, section helpers, WhatsApp FAB, scroll-reveal.

   The block :root below aliases the short token names used in
   the Phase 1 design reference to the custom properties that
   theme.json generates, so the ported component CSS stays
   byte-identical to the approved design.
   ============================================================ */
:root{
  --ink-900:var(--wp--preset--color--ink-900);
  --ink-700:var(--wp--preset--color--ink-700);
  --ink-500:var(--wp--preset--color--ink-500);
  --ink-300:var(--wp--preset--color--ink-300);
  --paper:var(--wp--preset--color--paper);
  --bone:var(--wp--preset--color--bone);
  --line:var(--wp--preset--color--line);
  --accent-market:var(--wp--preset--color--accent-market);
  --accent-digital:var(--wp--preset--color--accent-digital);
  --teal-900:var(--wp--preset--color--teal-900);
  --teal-700:var(--wp--preset--color--teal-700);
  --danger:var(--wp--preset--color--danger);
  --success:var(--wp--preset--color--success);
  --warning:var(--wp--preset--color--warning);

  --font-display:var(--wp--preset--font-family--display);
  --font-body:var(--wp--preset--font-family--body);
  --font-mono:var(--wp--preset--font-family--mono);

  --fs-h1:var(--wp--preset--font-size--h1);
  --fs-h2:var(--wp--preset--font-size--h2);
  --fs-h3:var(--wp--preset--font-size--h3);
  --fs-body:var(--wp--preset--font-size--body);
  --fs-small:var(--wp--preset--font-size--small);
  --fs-mono:var(--wp--preset--font-size--mono);

  --lh-tight:var(--wp--custom--line-height--tight);
  --lh-snug:var(--wp--custom--line-height--snug);
  --lh-base:var(--wp--custom--line-height--base);
  --lh-loose:var(--wp--custom--line-height--loose);

  --sp-1:var(--wp--preset--spacing--1);
  --sp-2:var(--wp--preset--spacing--2);
  --sp-3:var(--wp--preset--spacing--3);
  --sp-4:var(--wp--preset--spacing--4);
  --sp-6:var(--wp--preset--spacing--6);
  --sp-8:var(--wp--preset--spacing--8);
  --sp-12:var(--wp--preset--spacing--12);
  --sp-16:var(--wp--preset--spacing--16);
  --sp-24:var(--wp--preset--spacing--24);
  --sp-32:var(--wp--preset--spacing--32);

  --r-sm:var(--wp--custom--radius--sm);
  --r-md:var(--wp--custom--radius--md);
  --r-lg:var(--wp--custom--radius--lg);
  --r-pill:var(--wp--custom--radius--pill);

  --ease-out:var(--wp--custom--ease--out);
  --dur-fast:var(--wp--custom--duration--fast);
  --dur-base:var(--wp--custom--duration--base);
  --dur-slow:var(--wp--custom--duration--slow);

  --focus:var(--wp--custom--focus--color);
  --container-max:1200px;
  --container-narrow:var(--wp--custom--container--narrow);
  --container-read:var(--wp--custom--container--read);
  --gutter:var(--wp--custom--gutter);
}

/* ============================================================ RESET (theme-scoped) */
body{
  font-family:var(--font-body);font-size:var(--fs-body);
  line-height:var(--lh-base);color:var(--ink-900);background:var(--paper);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:2px;}

/* ============================================================ LAYOUT */
.wrap{max-width:var(--container-max);margin-inline:auto;padding-inline:var(--gutter);}
.narrow{max-width:var(--container-narrow);}
.section{padding-block:var(--sp-24);border-top:1px solid var(--line);}
.section--bone{background:var(--bone);}
.section--ink{background:var(--ink-900);color:var(--paper);border-top-color:var(--ink-700);}

/* Section marker:  § 01  ————  ARCHITECTURE */
.marker{
  display:flex;align-items:center;gap:var(--sp-3);
  font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-500);margin-bottom:var(--sp-8);
}
.marker__rule{height:1px;width:48px;background:currentColor;opacity:.4;}
.section--ink .marker{color:var(--accent-digital);}

/* Typography helpers */
.display{font-family:var(--font-display);line-height:var(--lh-tight);font-weight:400;letter-spacing:-.02em;}
.h2{font-family:var(--font-display);font-size:var(--fs-h2);line-height:var(--lh-snug);font-weight:400;letter-spacing:-.015em;}
.h3{font-family:var(--font-display);font-size:var(--fs-h3);line-height:var(--lh-snug);font-weight:600;}
.lede{font-size:clamp(1.0625rem,1.4vw,1.25rem);color:var(--ink-700);line-height:var(--lh-base);}
.mono-tag{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);}

/* ============================================================ BUTTONS */
.btn{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  padding:var(--sp-3) var(--sp-6);border-radius:var(--r-sm);
  font-size:var(--fs-small);font-weight:500;letter-spacing:.01em;
  transition:transform var(--dur-fast) var(--ease-out),background var(--dur-base) var(--ease-out),color var(--dur-base);
}
.btn:hover{transform:translateY(-1px);}
.btn--solid{background:var(--ink-900);color:var(--paper);}
.btn--solid:hover{background:var(--ink-700);}
.btn--ghost{border:1px solid var(--line);color:var(--ink-900);}
.btn--ghost:hover{border-color:var(--ink-900);}
.btn--digital{background:var(--accent-digital);color:var(--ink-900);}
.section--ink .btn--ghost{border-color:rgba(250,249,245,.25);color:var(--paper);}
.section--ink .btn--ghost:hover{border-color:var(--paper);}
.arrow{transition:transform var(--dur-base) var(--ease-out);}
.btn:hover .arrow{transform:translate(2px,-2px);}

/* Skip-link */
.skip-link{position:absolute;left:-999px;top:0;z-index:100;}
.skip-link:focus{left:8px;top:8px;}

/* ============================================================ HEADER */
.site-header{
  position:sticky;top:0;z-index:50;background:rgba(250,249,245,.85);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line);
}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{display:flex;align-items:baseline;gap:var(--sp-2);font-family:var(--font-display);font-weight:600;font-size:1.25rem;letter-spacing:-.01em;}
.brand__g{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1.5px solid var(--ink-900);border-radius:50%;font-size:1rem;line-height:1;}
.brand__digital{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-500);font-family:var(--font-mono);align-self:center;}
.nav{display:none;}
.nav a{font-size:var(--fs-small);color:var(--ink-700);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-sm);transition:color var(--dur-base);}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink-900);}
.nav a[aria-current="page"]{background:var(--bone);}
.header-cta{display:none;}
.nav-toggle{display:flex;flex-direction:column;gap:5px;padding:var(--sp-2);}
.nav-toggle span{width:22px;height:1.5px;background:var(--ink-900);transition:var(--dur-base);}
.mobile-nav{display:none;flex-direction:column;gap:var(--sp-2);padding:var(--sp-4) 0 var(--sp-8);border-top:1px solid var(--line);}
.mobile-nav.open{display:flex;}
.mobile-nav a{font-size:1.125rem;padding:var(--sp-3) 0;border-bottom:1px solid var(--line);}

/* ============================================================ FOOTER */
.site-footer{background:var(--bone);border-top:1px solid var(--line);padding-block:var(--sp-16) var(--sp-8);}
.footer-grid{display:grid;gap:var(--sp-12);margin-bottom:var(--sp-16);}
.footer-brand p{color:var(--ink-500);font-size:var(--fs-small);max-width:30ch;margin:var(--sp-4) 0;}
.footer-brand .contact{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--ink-700);line-height:var(--lh-loose);}
.footer-col h4{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-small);font-weight:600;margin-bottom:var(--sp-4);}
.footer-col h4 .dot{width:7px;height:7px;border-radius:1px;}
.footer-col h4 .dot--m{background:var(--ink-900);}
.footer-col h4 .dot--d{background:var(--accent-digital);}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:var(--sp-2);}
.footer-col a{font-size:var(--fs-small);color:var(--ink-500);transition:color var(--dur-base);}
.footer-col a:hover{color:var(--ink-900);}
.footer-bottom{display:flex;flex-wrap:wrap;gap:var(--sp-4);justify-content:space-between;align-items:center;padding-top:var(--sp-8);border-top:1px solid var(--line);font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.08em;color:var(--ink-500);text-transform:uppercase;}
.whatsapp-pill{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);background:var(--success);color:#fff;border-radius:var(--r-pill);font-family:var(--font-body);font-size:var(--fs-small);text-transform:none;letter-spacing:0;}

/* ============================================================ WHATSAPP FAB (site-wide) */
.wa-fab{position:fixed;right:20px;bottom:20px;z-index:60;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(0,0,0,.18);transition:transform .2s var(--ease-out),box-shadow .2s;}
.wa-fab:hover{transform:scale(1.06);box-shadow:0 8px 26px rgba(0,0,0,.24);}
.wa-fab::after{content:"Chat with us";position:absolute;right:68px;white-space:nowrap;background:var(--ink-900);color:#fff;font-family:var(--font-body);font-size:.8rem;padding:.4rem .7rem;border-radius:8px;opacity:0;transform:translateX(8px);transition:opacity .2s,transform .2s;pointer-events:none;}
.wa-fab:hover::after{opacity:1;transform:translateX(0);}

/* ============================================================ GLYPHS + LINKS + TAGS */
.glyph{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1.5px solid currentColor;border-radius:var(--r-sm);font-size:.8rem;}
.glyph--market{color:var(--accent-market);}
.glyph--digital{color:var(--accent-digital);}
.open-link{display:inline-flex;align-items:center;gap:var(--sp-2);font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.1em;text-transform:uppercase;}
.open-link--digital{color:var(--accent-digital);}
.tag{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.05em;color:var(--ink-500);padding:var(--sp-1) var(--sp-3);border:1px solid var(--line);border-radius:var(--r-pill);}
.tags{display:flex;flex-wrap:wrap;gap:var(--sp-2);}

/* ============================================================ HERO §00 */
.hero{padding-block:var(--sp-24) var(--sp-16);position:relative;overflow:hidden;}
.hero__rotated{display:none;}
.hero__thesis{max-width:920px;}
.hero h1{font-size:var(--fs-h1);margin-bottom:var(--sp-8);}
.hero h1 .soft{color:var(--ink-300);font-style:italic;}
.hero__grid{display:grid;gap:var(--sp-8);margin-top:var(--sp-12);padding-top:var(--sp-8);border-top:1px solid var(--line);}
.hero__support p{color:var(--ink-700);max-width:46ch;}
.hero__method .mono-tag{display:block;margin-bottom:var(--sp-3);}
.hero__ctas{display:flex;flex-direction:column;gap:var(--sp-3);}
.answer-block{margin-top:var(--sp-12);padding:var(--sp-6);background:var(--bone);border-left:2px solid var(--accent-digital);border-radius:0 var(--r-sm) var(--r-sm) 0;}
.answer-block .mono-tag{display:block;margin-bottom:var(--sp-3);}
.answer-block p{font-size:var(--fs-small);color:var(--ink-700);line-height:var(--lh-loose);}

/* ============================================================ ARCHITECTURE §01 */
.arch-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.arch-cell{background:var(--paper);padding:var(--sp-8);}
.arch-cell__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-6);}
.arch-cell__no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--ink-500);letter-spacing:.1em;}
.arch-cell h3{margin:var(--sp-4) 0 var(--sp-2);}
.arch-cell p{color:var(--ink-500);font-size:var(--fs-small);margin-bottom:var(--sp-4);}

/* ============================================================ PILLARS DETAIL §02 */
.pillars-intro{max-width:760px;margin-bottom:var(--sp-16);}
.pillars-intro .h2 strong{font-weight:600;}
.pillar-detail{display:grid;gap:var(--sp-8);padding-block:var(--sp-12);border-top:1px solid var(--line);}
.pillar-detail:first-of-type{border-top:none;}
.pillar-detail__label{display:flex;align-items:center;gap:var(--sp-3);}
.pillar-detail__label .name{font-family:var(--font-display);font-size:1.25rem;font-weight:600;}
.pillar-detail__label .mono-tag{margin-top:2px;}
.pillar-detail p{color:var(--ink-700);max-width:42ch;}
.service-list{list-style:none;display:flex;flex-direction:column;gap:var(--sp-3);}
.service-list li{display:flex;align-items:baseline;gap:var(--sp-3);font-size:var(--fs-small);color:var(--ink-700);}
.service-list li::before{content:"—";color:var(--ink-300);}

/* ============================================================ CAPABILITY MAP §03 */
.cap-head{display:grid;gap:var(--sp-6);margin-bottom:var(--sp-16);}
.cap-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.cap-card{background:var(--paper);padding:var(--sp-8);display:flex;flex-direction:column;min-height:220px;}
.cap-card__top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--sp-6);}
.cap-card__id .code{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--ink-900);letter-spacing:.1em;}
.cap-card__id .pillar{display:block;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);margin-top:2px;}
.cap-card h3{font-size:1.125rem;font-weight:600;margin-bottom:var(--sp-3);}
.cap-card p{font-size:var(--fs-small);color:var(--ink-500);}
.cap-card__bars{display:flex;gap:3px;margin-top:auto;padding-top:var(--sp-6);}
.cap-card__bars span{flex:1;height:8px;border-radius:1px;background:var(--line);}
.cap-card__bars span.fill-m{background:var(--ink-900);}
.cap-card__bars span.fill-d{background:var(--accent-digital);}

/* ============================================================ START HERE / SERVICE CARDS §03.5 */
.start-head{max-width:680px;margin-bottom:var(--sp-12);}
.start-grid{display:grid;gap:var(--sp-4);}
.start-card{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--dur-base),transform var(--dur-base) var(--ease-out);}
.start-card:hover{border-color:var(--ink-900);transform:translateY(-2px);}
.start-card h3{font-size:1.0625rem;font-weight:600;font-family:var(--font-body);}
.start-card p{font-size:var(--fs-small);color:var(--ink-500);flex:1;}
.start-card .open-link{margin-top:var(--sp-2);}

/* ============================================================ VALUE LADDER §04 */
.ladder{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.ladder__row{display:grid;gap:var(--sp-2);padding:var(--sp-6);border-top:1px solid var(--line);transition:background var(--dur-base);}
.ladder__row:first-child{border-top:none;}
.ladder__row:hover{background:var(--bone);}
.ladder__no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--ink-500);letter-spacing:.1em;}
.ladder__stage{font-family:var(--font-display);font-size:1.25rem;font-weight:600;}
.ladder__tier-label{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);}
.ladder__what{color:var(--ink-700);font-size:var(--fs-small);}
.ladder__eg{font-size:var(--fs-small);color:var(--ink-500);}
.ladder__eg span{display:block;}

/* ============================================================ TOOLS §05 */
.tools-grid{display:grid;gap:var(--sp-3);}
.tool-chip{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-4) var(--sp-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--dur-base),background var(--dur-base);}
.tool-chip:hover{border-color:var(--accent-digital);}
.tool-chip__name{font-weight:500;font-size:var(--fs-small);}
.tool-chip__meta{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);}

/* ============================================================ ARCHETYPE / METHOD STEPS §06 */
.method-head{max-width:720px;margin-bottom:var(--sp-16);}
.method-head .h2 strong{font-weight:600;}
.steps{display:grid;gap:1px;background:var(--ink-700);border:1px solid var(--ink-700);border-radius:var(--r-md);overflow:hidden;}
.step{background:var(--ink-900);padding:var(--sp-8);}
.step__no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--accent-digital);letter-spacing:.12em;margin-bottom:var(--sp-4);}
.step h3{font-family:var(--font-display);font-size:1.25rem;font-weight:600;margin-bottom:var(--sp-3);color:var(--paper);}
.step p{font-size:var(--fs-small);color:var(--ink-300);}

/* ============================================================ FOUNDER §07 */
.founder{display:grid;gap:var(--sp-12);align-items:start;}
.founder__photo{border-radius:var(--r-md);overflow:hidden;background:var(--bone);aspect-ratio:4/5;max-width:320px;}
.founder__photo img{width:100%;height:100%;object-fit:cover;}
.founder__photo--placeholder{display:flex;align-items:center;justify-content:center;color:var(--ink-300);font-family:var(--font-mono);font-size:var(--fs-mono);text-align:center;padding:var(--sp-8);min-height:240px;}
.founder__body .h2{margin-bottom:var(--sp-6);}
.founder__body p{color:var(--ink-700);margin-bottom:var(--sp-4);max-width:54ch;}
.founder__creds{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.04em;color:var(--ink-500);line-height:var(--lh-loose);margin:var(--sp-6) 0;}
.founder__sign{display:flex;align-items:center;gap:var(--sp-4);margin-top:var(--sp-6);}
.founder__sign .name{font-family:var(--font-display);font-size:1.125rem;}

/* ============================================================ PROOF §08 */
.proof{display:flex;flex-wrap:wrap;gap:var(--sp-3);}
.proof__item{display:flex;flex-direction:column;gap:2px;padding:var(--sp-4) var(--sp-6);border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);}
.proof__item .org{font-weight:600;font-size:var(--fs-small);}
.proof__item .what{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-500);}

/* ============================================================ FAQ §09 */
.faq{display:flex;flex-direction:column;border-top:1px solid var(--line);}
.faq__item{border-bottom:1px solid var(--line);}
.faq__q{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);width:100%;text-align:left;padding:var(--sp-6) 0;font-family:var(--font-display);font-size:1.125rem;font-weight:600;}
.faq__q .pm{font-family:var(--font-mono);color:var(--accent-digital);font-size:1.25rem;transition:transform var(--dur-base);}
.faq__item[open] .pm{transform:rotate(45deg);}
.faq__a{padding-bottom:var(--sp-6);color:var(--ink-700);font-size:var(--fs-small);line-height:var(--lh-loose);max-width:68ch;}
.faq__item summary{list-style:none;cursor:pointer;}
.faq__item summary::-webkit-details-marker{display:none;}
/* FAQ built from the core Details block (editable summary + answer) */
.faq .wp-block-details{border-bottom:1px solid var(--line);}
.faq .wp-block-details>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);width:100%;text-align:left;padding:var(--sp-6) 0;font-family:var(--font-display);font-size:1.125rem;font-weight:600;list-style:none;cursor:pointer;}
.faq .wp-block-details>summary::-webkit-details-marker{display:none;}
.faq .wp-block-details>summary::after{content:"+";font-family:var(--font-mono);color:var(--accent-digital);font-size:1.25rem;transition:transform var(--dur-base);}
.faq .wp-block-details[open]>summary::after{transform:rotate(45deg);}
.faq .wp-block-details>*:not(summary){padding-bottom:var(--sp-6);color:var(--ink-700);font-size:var(--fs-small);line-height:var(--lh-loose);max-width:68ch;margin:0;}

/* ============================================================ CLOSING / CTA BAND §10 */
.closing{text-align:left;}
.closing .display{font-size:var(--fs-h2);max-width:18ch;margin-bottom:var(--sp-8);}
.closing .display strong{font-weight:600;}
.closing__ctas{display:flex;flex-wrap:wrap;gap:var(--sp-3);}

/* ============================================================ INNER PAGES
   Components for the hub, service, about, contact, tools and legal pages.
   Ported from the Phase 1 page references. */

/* Teal contrast band (Digital governance) */
.section--teal{background:var(--teal-900);color:var(--paper);border-top-color:var(--teal-700);}
.section--teal .marker{color:rgba(250,249,245,.75);}
.section--ink .btn--ghost,.section--teal .btn--ghost{border-color:rgba(250,249,245,.35);color:var(--paper);}
.section--teal .btn--ghost:hover{border-color:var(--paper);}

/* Page hero (dark band with breadcrumb + meta) */
.page-hero{background:var(--ink-900);color:var(--paper);padding-block:var(--sp-16);}
.page-hero--teal{background:var(--teal-900);}
.page-hero .btn--ghost{border-color:rgba(250,249,245,.35);color:var(--paper);}
.crumb{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-300);margin-bottom:var(--sp-8);}
.crumb a:hover{color:var(--paper);}
.page-hero__glyph{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1.5px solid currentColor;border-radius:var(--r-sm);margin-bottom:var(--sp-6);}
.page-hero h1{font-family:var(--font-display);font-size:var(--fs-h1);line-height:var(--lh-tight);font-weight:400;letter-spacing:-.02em;margin-bottom:var(--sp-6);max-width:20ch;}
.page-hero .lede{color:rgba(250,249,245,.82);max-width:54ch;margin-bottom:var(--sp-8);}
.page-hero__ctas{display:flex;flex-wrap:wrap;gap:var(--sp-3);}
.page-hero__meta{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-top:var(--sp-12);padding-top:var(--sp-8);border-top:1px solid rgba(250,249,245,.15);}
.page-hero__meta div{display:flex;flex-direction:column;gap:2px;}
.page-hero__meta .k{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(250,249,245,.5);}
.page-hero__meta .v{font-size:var(--fs-small);color:var(--paper);}
.page-hero .meta{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.06em;color:var(--ink-300);}

/* Long-form prose */
.prose p{color:var(--ink-700);margin-bottom:var(--sp-6);max-width:64ch;}
.prose p.first{font-size:1.125rem;color:var(--ink-900);}

/* Method phases */
.phases{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;margin-top:var(--sp-8);}
.phase{background:var(--paper);padding:var(--sp-8);}
.phase .no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--accent-digital);letter-spacing:.12em;}
.phase h3{font-family:var(--font-display);font-size:1.2rem;font-weight:600;margin:var(--sp-3) 0;}
.phase p{font-size:var(--fs-small);color:var(--ink-500);}

/* Two-column intro + included scope */
.two-col{display:grid;gap:var(--sp-8);}
.incl{list-style:none;display:grid;gap:var(--sp-3);margin-top:var(--sp-8);}
.incl li{display:flex;gap:var(--sp-3);align-items:flex-start;font-size:var(--fs-small);color:var(--ink-700);padding-bottom:var(--sp-3);border-bottom:1px solid var(--line);}
.incl li .tick{color:var(--accent-digital);font-weight:600;flex-shrink:0;}

/* Outcomes */
.out{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.out__item{background:var(--paper);padding:var(--sp-8);}
.out__item .big{font-family:var(--font-display);font-size:1.75rem;font-weight:600;letter-spacing:-.01em;}
.out__item p{font-size:var(--fs-small);color:var(--ink-500);margin-top:var(--sp-2);}

/* Companion-tool / matched block */
.matched{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-6);padding:var(--sp-8);background:var(--bone);border:1px solid var(--line);border-radius:var(--r-md);}
.matched h3{font-family:var(--font-display);font-size:1.25rem;font-weight:600;}
.matched p{font-size:var(--fs-small);color:var(--ink-500);margin-top:var(--sp-2);max-width:48ch;}

/* Centered CTA band (inner pages) */
.cta-band{text-align:center;}
.cta-band .display{font-family:var(--font-display);font-weight:400;font-size:var(--fs-h2);max-width:20ch;margin:0 auto var(--sp-8);color:var(--paper);letter-spacing:-.015em;}
.cta-band__btns{display:flex;flex-wrap:wrap;gap:var(--sp-3);justify-content:center;}

/* Service hub: card grid */
.svc-head{max-width:680px;margin-bottom:var(--sp-12);}
.svc-grid{display:grid;gap:var(--sp-4);}
.svc-card{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--dur-base),transform var(--dur-base) var(--ease-out);}
.svc-card:hover{border-color:var(--ink-900);transform:translateY(-2px);}
.svc-card .tagrow{display:flex;align-items:center;justify-content:space-between;}
.svc-card .code{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);}
.svc-card .badge{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:var(--r-pill);background:var(--bone);color:var(--ink-500);}
.svc-card .badge--front{background:var(--ink-900);color:var(--paper);}
.svc-card h3{font-size:1.0625rem;font-weight:600;}
.svc-card p{font-size:var(--fs-small);color:var(--ink-500);flex:1;}

/* About: operating principles */
.principles{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.principle{background:var(--paper);padding:var(--sp-8);}
.principle .no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--ink-500);letter-spacing:.1em;}
.principle h3{font-family:var(--font-display);font-size:1.25rem;font-weight:600;margin:var(--sp-3) 0;}
.principle p{font-size:var(--fs-small);color:var(--ink-500);}
.founder__photo--ph{display:flex;align-items:center;justify-content:center;color:var(--ink-300);font-family:var(--font-mono);font-size:var(--fs-mono);text-align:center;padding:var(--sp-8);min-height:240px;}

/* Digital governance stance */
.gov{display:grid;gap:1px;background:rgba(250,249,245,.18);border:1px solid rgba(250,249,245,.18);border-radius:var(--r-md);overflow:hidden;margin-top:var(--sp-8);}
.gov__item{background:var(--teal-900);padding:var(--sp-8);}
.gov__item .no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--paper);opacity:.6;letter-spacing:.12em;}
.gov__item h3{font-family:var(--font-display);font-size:1.125rem;font-weight:600;margin:var(--sp-3) 0;color:var(--paper);}
.gov__item p{font-size:var(--fs-small);color:rgba(250,249,245,.8);}

/* Process step grids (tools "how", contact "next") */
.how,.next{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.how__step,.next__step{background:var(--paper);padding:var(--sp-8);}
.how__step .no,.next__step .no{font-family:var(--font-mono);font-size:var(--fs-mono);color:var(--accent-digital);letter-spacing:.12em;}
.how__step h3,.next__step h3{font-family:var(--font-display);font-size:1.125rem;font-weight:600;margin:var(--sp-3) 0;}
.how__step p,.next__step p{font-size:var(--fs-small);color:var(--ink-500);}

/* Tools hub */
.tool-grid{display:grid;gap:var(--sp-4);}
.tool{display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-8);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--dur-base),transform var(--dur-base) var(--ease-out);}
.tool:hover{border-color:var(--accent-digital);transform:translateY(-2px);}
.tool.flagship{border-color:var(--ink-900);border-width:1.5px;}
.tool__top{display:flex;align-items:center;justify-content:space-between;}
.tool__code{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);}
.tool__meta{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);}
.tool__flag{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;background:var(--ink-900);color:var(--paper);padding:2px 8px;border-radius:var(--r-pill);}
.tool h3{font-size:1.125rem;font-weight:600;}
.tool p{font-size:var(--fs-small);color:var(--ink-500);flex:1;}
.tool__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding-top:var(--sp-4);border-top:1px solid var(--line);}
.tool__get{font-size:.78rem;color:var(--ink-700);}

/* Contact */
.contact-grid{display:grid;gap:var(--sp-16);align-items:start;}
.channel{display:flex;flex-direction:column;gap:var(--sp-6);}
.channel-row{display:flex;flex-direction:column;gap:2px;padding-bottom:var(--sp-6);border-bottom:1px solid var(--line);}
.channel-row .lbl{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);}
.channel-row .val{font-size:1.0625rem;font-weight:500;}
.wa-card{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-6);background:#25D366;color:#fff;border-radius:var(--r-md);transition:transform var(--dur-base) var(--ease-out);}
.wa-card:hover{transform:translateY(-2px);}
.wa-card svg{flex-shrink:0;}
.wa-card .t{font-weight:600;}
.wa-card .s{font-size:var(--fs-small);opacity:.9;}
.socials{display:flex;gap:var(--sp-3);flex-wrap:wrap;}
.socials a{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.08em;text-transform:uppercase;padding:var(--sp-2) var(--sp-4);border:1px solid var(--line);border-radius:var(--r-pill);}
.socials a:hover{border-color:var(--ink-900);}
.form{display:flex;flex-direction:column;gap:var(--sp-4);}
.field{display:flex;flex-direction:column;gap:var(--sp-2);}
.field label{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);}
.field input,.field select,.field textarea{font-family:var(--font-body);font-size:var(--fs-body);padding:var(--sp-3) var(--sp-4);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink-900);transition:border-color var(--dur-base);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent-digital);}
.field textarea{resize:vertical;min-height:120px;}
.form .hint{font-size:var(--fs-small);color:var(--ink-500);}
.form button[type=submit]{align-self:flex-start;margin-top:var(--sp-2);}

/* Legal */
.read{max-width:var(--container-read);}
.legal h2{font-family:var(--font-display);font-size:var(--fs-h2);font-weight:600;letter-spacing:-.01em;margin:var(--sp-12) 0 var(--sp-4);scroll-margin-top:90px;}
.legal h2 .no{font-family:var(--font-mono);font-size:1rem;color:var(--ink-500);margin-right:var(--sp-3);}
.legal p{color:var(--ink-700);margin-bottom:var(--sp-4);}
.legal ul{margin:0 0 var(--sp-4) var(--sp-6);color:var(--ink-700);}
.legal li{margin-bottom:var(--sp-2);}
.legal strong{color:var(--ink-900);}
.toc{background:var(--bone);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-6);margin-bottom:var(--sp-12);}
.toc h3{font-family:var(--font-mono);font-size:var(--fs-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);margin-bottom:var(--sp-3);}
.toc ol{margin-left:var(--sp-6);font-size:var(--fs-small);}
.toc a{color:var(--ink-700);text-decoration:none;}
.toc a:hover{color:var(--ink-900);text-decoration:underline;}
.draft-note{background:#FBF3E6;border:1px solid var(--warning);border-left-width:3px;border-radius:var(--r-md);padding:var(--sp-6);margin-bottom:var(--sp-12);}
.draft-note strong{display:block;color:var(--warning);font-family:var(--font-mono);font-size:var(--fs-small);letter-spacing:.04em;text-transform:uppercase;margin-bottom:var(--sp-3);}
.draft-note p{font-size:var(--fs-small);color:var(--ink-700);margin:0;max-width:64ch;}

/* ============================================================ UTILITIES
   Small helpers used by patterns so core blocks can carry design intent via
   className only (validation-safe) instead of inline block style attributes. */
.u-paper{color:var(--paper);}
.u-paper-soft{color:rgba(250,249,245,.82);}
.u-ink-300{color:var(--ink-300);}
.u-ink-700{color:var(--ink-700);}
.u-ink-900{color:var(--ink-900);}
.u-italic{font-style:italic;}
.u-fs-small{font-size:var(--fs-small);}
.u-block{display:block;}
.u-mt-3{margin-top:var(--sp-3);}
.u-mt-4{margin-top:var(--sp-4);}
.u-mt-6{margin-top:var(--sp-6);}
.u-mt-8{margin-top:var(--sp-8);}
.u-mb-12{margin-bottom:var(--sp-12);}

/* ============================================================ REVEAL ANIMATION */
.reveal{opacity:0;transform:translateY(8px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);}
.reveal.in{opacity:1;transform:none;}

/* ============================================================ RESPONSIVE */
@media(min-width:768px){
  .nav{display:flex;gap:var(--sp-1);}
  .header-cta{display:inline-flex;}
  .nav-toggle{display:none;}
  .hero__rotated{display:block;position:absolute;left:0;top:30%;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--font-mono);font-size:.62rem;letter-spacing:.3em;color:var(--ink-300);text-transform:uppercase;}
  .hero{padding-left:var(--sp-16);}
  .hero__grid{grid-template-columns:1.4fr 1fr auto;align-items:start;}
  .hero__ctas{align-items:stretch;}
  .arch-grid{grid-template-columns:1fr 1fr;}
  .pillar-detail{grid-template-columns:240px 1fr 1fr;}
  .cap-head{grid-template-columns:1.2fr 1fr;align-items:end;}
  .cap-grid{grid-template-columns:repeat(3,1fr);}
  .start-grid{grid-template-columns:repeat(2,1fr);}
  .ladder__row{grid-template-columns:60px 200px 1fr 200px;align-items:start;}
  .tools-grid{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:repeat(4,1fr);}
  .founder{grid-template-columns:320px 1fr;}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr;}
  .method-head .h2,.closing .display{font-size:clamp(2rem,3.5vw,3rem);}
  /* inner pages */
  .phases{grid-template-columns:repeat(4,1fr);}
  .incl{grid-template-columns:1fr 1fr;column-gap:var(--sp-8);}
  .out{grid-template-columns:repeat(3,1fr);}
  .two-col{grid-template-columns:1fr 1.3fr;gap:var(--sp-16);align-items:start;}
  .svc-grid{grid-template-columns:repeat(3,1fr);}
  .principles{grid-template-columns:repeat(2,1fr);}
  .gov{grid-template-columns:repeat(3,1fr);}
  .how,.next{grid-template-columns:repeat(3,1fr);}
  .tool-grid{grid-template-columns:repeat(2,1fr);}
  .tool.flagship{grid-column:1 / -1;}
  .contact-grid{grid-template-columns:1fr 1.1fr;}
  .founder{grid-template-columns:320px 1fr;}
}
@media(min-width:1024px){
  .tool-grid{grid-template-columns:repeat(3,1fr);}
  .tool.flagship{grid-column:1 / -1;flex-direction:row;align-items:center;flex-wrap:wrap;}
  .tool.flagship p{flex:1 1 320px;}
}

@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .wa-fab,.wa-fab::after{transition:none;}
  *{scroll-behavior:auto;}
}