/* OD-LAYOUT-PRIMITIVES v1: structure only. */
@layer od-layout {
  :where(.od-stack,.od-row,.od-row-top,.od-cluster,.od-grid,.od-field,.od-stat,.od-cell,.od-tile)>:where(*){min-width:0}
  .od-stack{display:flex;flex-direction:column;gap:var(--od-gap,8px)}
  .od-row{display:flex;align-items:center;gap:var(--od-gap,8px)}
  .od-row-top{display:flex;align-items:flex-start;gap:var(--od-gap,8px)}
  .od-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--od-gap,8px)}
  .od-fill{flex:1 1 0;min-width:0}.od-fixed{flex:none}
  .od-grid{display:grid;gap:var(--od-gap,12px);grid-template-columns:repeat(var(--od-cols,3),minmax(0,1fr))}
  .od-stat,.od-field,.od-cell{display:grid;gap:var(--od-gap,2px)}
  :where(.od-stat,.od-field,.od-cell)>:where(*){display:block}
  .od-tile{display:grid;grid-template-rows:auto 1fr}:where(.od-tile)>:where(*){display:block}
  .od-media{display:block;width:100%;height:auto}
  .od-media-cover{object-fit:cover}
  .od-truncate{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .od-clamp-2,.od-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
  .od-clamp-2{-webkit-line-clamp:2}.od-clamp-3{-webkit-line-clamp:3}
  .od-lines-2{min-height:calc(2 * 1.4em)}.od-nowrap{white-space:nowrap}
  .od-keep{word-break:keep-all;overflow-wrap:anywhere}
  .od-screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%}
  .od-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0}
  .od-rail{display:flex;gap:var(--od-gap,8px);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-inline:var(--od-rail-pad,16px);scroll-padding-inline:var(--od-rail-pad,16px)}
  .od-rail::-webkit-scrollbar{display:none}:where(.od-rail)>:where(*){flex:none;scroll-snap-align:start}:where(.od-rail)>:where(:last-child){margin-inline-end:var(--od-rail-pad,16px)}
  .od-spacer{flex:none;visibility:hidden;pointer-events:none}.od-touch{min-width:44px;min-height:44px}
}
/* /OD-LAYOUT-PRIMITIVES v1 */
:root{--canvas:#f7f3ec;--surface:#fff;--ink:#24231f;--muted:#5e554d;--accent:#923c2c;--rule:#d8cec1;--stage:#e6eeeb;--stage-alt:#e6ebf1;--display:Georgia,'Times New Roman',serif;--body:'Segoe UI',Helvetica,sans-serif;--tiny:.875rem;--body-size:1.125rem;--small:1rem;--h3:1.5rem;--h2:clamp(2rem,3.5vw,3rem);--h1:clamp(2.5rem,5.2vw,4.5rem);--space-1:4px;--space-2:8px;--space-3:16px;--space-4:24px;--space-5:32px;--space-6:48px;--space-7:64px;--space-8:96px;--radius:4px;--duration:180ms;--measure:70ch;--max:1200px}
[data-direction=blue]{--canvas:#f5f6f5;--ink:#17243a;--muted:#4b596c;--accent:#174d85;--rule:#ced7df;--stage:#e5edf5;--stage-alt:#e8eeef;--display:'Avenir Next',Candara,'Trebuchet MS',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--canvas);color:var(--ink);font-family:var(--body);font-size:var(--body-size);line-height:1.65}button,input,select,textarea{font:inherit;color:inherit}button,a,summary,input[type=checkbox]{-webkit-tap-highlight-color:transparent}button,summary,select{cursor:pointer}img{max-width:100%}a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:5px;overflow-wrap:anywhere}button{border-radius:var(--radius)}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:5px}::selection{background:var(--accent);color:var(--surface)}h1,h2,h3,h4,p,figure{margin:0}h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;text-wrap:balance;overflow-wrap:anywhere}h1{font-size:var(--h1);letter-spacing:-.035em}h2{font-size:var(--h2);letter-spacing:-.025em}h3{font-size:var(--h3);line-height:1.3}h4{font-size:var(--body-size)}p{max-width:var(--measure)}[hidden]{display:none!important}.wrap{width:min(calc(100% - 96px),var(--max));margin-inline:auto}.skip{position:fixed;top:8px;left:8px;z-index:20;background:var(--surface);padding:16px;transform:translateY(-160%)}.skip:focus{transform:none}
.site-header{border-bottom:1px solid var(--rule)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-4)}.wordmark{color:var(--ink);text-decoration:none;display:grid;line-height:1.25;min-height:44px;align-content:center}.wordmark strong{font-size:1.25rem;font-weight:600;letter-spacing:-.02em}.wordmark small{font-size:var(--tiny);color:var(--muted)}.desktop-nav{display:flex;align-items:center;gap:var(--space-4)}.nav-link{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-size:var(--small);text-decoration:none;white-space:nowrap}.nav-link[aria-current=page]{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:8px}.language{display:flex;gap:var(--space-2);align-items:center;font-size:var(--tiny)}.language a,.language span{display:flex;min-height:44px;min-width:36px;align-items:center;justify-content:center;color:var(--ink)}.language span{font-weight:700}.language a{text-decoration:none}.language a:hover{text-decoration:underline}.mobile-nav{display:none}.eyebrow{font-size:var(--tiny);font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);display:block}.meta{font-size:var(--small);color:var(--muted)}.prototype-note{font-size:var(--tiny);color:var(--muted);padding-top:var(--space-4)}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--space-7);align-items:center;padding-block:var(--space-7) var(--space-8)}.hero-copy{--od-gap:24px}.hero-copy h1{max-width:12ch}.hero-copy .intro{font-size:1.25rem;line-height:1.6}.hero .location{font-size:var(--small);color:var(--muted)}.actions{--od-gap:16px;align-items:center}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 24px;background:var(--accent);color:var(--surface);border:1px solid var(--accent);text-decoration:none;font-size:var(--small);font-weight:600}.button.secondary{background:transparent;color:var(--accent)}.text-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-weight:600}.arrow{font-size:1.375rem;line-height:1;font-family:var(--body)}.screen-stage{background:var(--stage);padding:var(--space-5);display:grid;gap:var(--space-4);border-radius:var(--radius)}.screen-composition{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);align-items:center}.screen-composition .phone-image{display:block;width:100%;height:auto}.screen-composition .image-column{display:grid;gap:16px}.image-caption{font-size:var(--small);line-height:1.55;color:var(--muted)}.stage-label{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:var(--tiny);color:var(--ink)}.stage-label span{display:block}.section{padding-block:var(--space-7);border-top:1px solid var(--rule);scroll-margin-top:24px}.section-heading{display:flex;justify-content:space-between;gap:var(--space-5);align-items:baseline;margin-bottom:var(--space-6)}.section-heading h2{max-width:22ch}.project-row{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--space-7);align-items:center;padding-block:var(--space-6)}.project-row+.project-row{border-top:1px solid var(--rule)}.project-copy{--od-gap:20px}.project-copy h3{font-size:clamp(1.75rem,3vw,2.5rem)}.project-media{display:grid;gap:16px;padding:32px;background:var(--stage);color:var(--ink);text-decoration:none;border-radius:var(--radius)}.project-media.alt{background:var(--stage-alt)}.project-media .screen-composition{max-width:360px;width:100%;margin:auto}.project-media .image-caption{color:var(--ink)}.row-label{font-size:var(--tiny);color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.approach{display:grid;grid-template-columns:1fr 1.3fr;gap:var(--space-7)}.principle{padding-block:24px;border-bottom:1px solid var(--rule);--od-gap:8px}.principle:first-child{padding-top:0}.principle h3{font-family:var(--body);font-weight:600;font-size:1.25rem}.feature{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7);align-items:start}.feature .od-stack{--od-gap:24px}.quote-heading{font-family:var(--display);font-size:clamp(2rem,3.6vw,3rem);line-height:1.2;max-width:21ch}.track-list{display:grid;gap:24px}.track{border-top:2px solid var(--accent);padding-top:16px;--od-gap:8px}.journal-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.article-card{color:var(--ink);text-decoration:none;display:grid;align-content:start;gap:16px;border-top:1px solid var(--rule);padding-top:24px;min-width:0}.article-card h3{font-size:1.625rem}.article-card .text-link{color:var(--accent)}.article-number{font-family:var(--display);font-size:2.5rem;line-height:1;color:var(--accent)}.contact-section{padding-block:var(--space-7);border-top:1px solid var(--rule);display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:48px}.contact-section .od-stack{--od-gap:16px}.contact-section .actions{justify-content:flex-end}.footer{border-top:1px solid var(--rule);padding-block:32px}.footer-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}.footer small{font-size:var(--tiny);color:var(--muted)}.footer a{font-size:var(--small);display:inline-flex;align-items:center;min-height:44px}
.page-head{padding-block:64px 48px;max-width:960px;--od-gap:24px}.page-head h1{max-width:22ch}.page-head .lede{font-size:1.375rem;line-height:1.6;max-width:60ch}.breadcrumbs{font-size:var(--small);display:flex;flex-wrap:wrap;gap:12px;align-items:center}.breadcrumbs a{display:inline-flex;align-items:center;min-height:44px}.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;border-block:1px solid var(--rule);padding-block:24px;margin-bottom:48px}.facts dt{font-size:var(--tiny);color:var(--accent);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}.facts dd{margin:0;font-size:var(--small)}.case-hero{background:var(--stage);padding:48px;display:grid;gap:24px;margin-bottom:64px}.case-hero .screen-composition{max-width:720px;width:100%;margin:auto;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}.case-hero.cdp .screen-composition{grid-template-columns:repeat(2,minmax(0,1fr));max-width:500px}.chapter{display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;padding-block:48px;border-top:1px solid var(--rule)}.chapter-label{--od-gap:12px}.chapter-label h2{font-family:var(--body);font-size:1.125rem;font-weight:600;line-height:1.5}.chapter-content{--od-gap:24px;max-width:var(--measure)}.chapter-content h3{font-size:1.75rem}.chapter-content ul,.article-body ul,.article-body ol{margin:0;padding-left:24px}.chapter-content li,.article-body li{margin-bottom:12px}.image-grid{--od-cols:3;--od-gap:24px;align-items:start}.image-grid.two{--od-cols:2}.image-figure{display:grid;gap:16px;align-content:start;min-width:0}.image-figure .image-frame{background:var(--stage);padding:24px;display:flex;align-items:start;justify-content:center}.image-frame img{width:100%;height:auto;display:block}.image-figure figcaption{font-size:var(--small);color:var(--muted);line-height:1.55}.zoom-button{background:transparent;border:1px solid var(--rule);color:var(--accent);font-size:var(--small);min-height:44px;padding:8px 12px;justify-self:start}.case-plate{display:grid;gap:24px;padding-block:32px}.chapter.wide .chapter-content{max-width:none}.limits{border-block:1px solid var(--rule);padding-block:24px;--od-gap:12px}.limits h3{font-family:var(--body);font-size:1.125rem;font-weight:600}.next-story{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;border-top:1px solid var(--rule);padding-block:48px}.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:64px;padding-bottom:64px}.about-grid>.od-stack{--od-gap:24px}.about-aside{padding:32px;background:var(--stage);--od-gap:24px}.about-aside h2{font-size:2rem}.cv-state{border-block:1px solid var(--rule);padding-block:32px;--od-gap:16px}.status-label{font-size:var(--tiny);font-weight:600;color:var(--accent)}.contents{padding:24px 0 48px;display:flex;flex-wrap:wrap;gap:8px 24px}.contents a{min-height:44px;display:inline-flex;align-items:center;font-size:var(--small)}.track-heading{padding-block:32px 24px;--od-gap:12px}.track-heading h2{font-size:2rem}.ai-module{padding-block:40px;border-top:1px solid var(--rule);display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;scroll-margin-top:24px}.module-label{--od-gap:12px}.module-label h3{font-family:var(--body);font-size:1.25rem;font-weight:600}.module-content{--od-gap:20px;min-width:0}.teaching-example{background:var(--surface);padding:24px;border:1px solid var(--rule);--od-gap:16px}.teaching-example h4{font-size:1.125rem}.example-grid{--od-cols:2;--od-gap:24px}.example-cell{--od-gap:12px}.example-cell h4{color:var(--accent);font-size:var(--small)}.judgment{--od-gap:8px}.judgment strong{font-size:var(--small)}.source-list{font-size:var(--small);--od-gap:8px}.source-list a{display:inline-flex;min-height:44px;align-items:center}.demo-form{--od-gap:20px}.demo-form label{display:grid;gap:8px;font-weight:600;font-size:var(--small)}.demo-form input,.demo-form select{display:block;width:100%;min-height:48px;border:1px solid var(--muted);border-radius:var(--radius);background:var(--surface);padding:8px 12px}.field-error{font-weight:400;color:var(--accent);font-size:var(--small)}.demo-status{font-size:var(--small);color:var(--ink)}.demo-status:empty{display:none}.checklist{display:grid;gap:16px}.checklist label{display:flex;gap:12px;align-items:flex-start;font-size:var(--small);min-height:44px;cursor:pointer}.checklist input{width:24px;height:24px;flex:none;margin-top:3px;accent-color:var(--accent)}.manual-path{--od-gap:16px}.manual-path summary{color:var(--accent);font-weight:600;min-height:44px}.manual-path[open] summary{margin-bottom:16px}
.article-header{max-width:960px;margin:auto;padding-block:64px 48px;--od-gap:24px}.article-header h1{max-width:22ch}.article-header .lede{font-size:1.375rem;line-height:1.6;max-width:65ch}.article-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;padding-bottom:64px}.article-nav{font-size:var(--small);--od-gap:8px;align-self:start}.article-nav a{display:flex;min-height:44px;align-items:center}.article-body{--od-gap:40px;max-width:var(--measure)}.article-body section{--od-gap:20px;scroll-margin-top:24px}.article-body h2{font-size:clamp(1.75rem,3vw,2.25rem)}.article-body h3{font-size:1.5rem}.article-body .teaching-example{--od-gap:16px}.article-body .image-grid{--od-cols:2}.article-body .image-frame{padding:16px}.article-end{border-top:1px solid var(--rule);padding-top:32px;--od-gap:16px}.review-shell{padding-block:48px 64px}.direction-grid{--od-cols:2;--od-gap:32px;align-items:start}.direction-panel{padding:32px;display:grid;gap:24px;border:1px solid var(--rule);background:var(--canvas);color:var(--ink)}.direction-panel h2{font-size:2.5rem}.direction-panel .mini-display{font-family:var(--display);font-size:clamp(1.75rem,3vw,2.25rem);line-height:1.2}.direction-panel .screen-composition{max-width:280px;margin:auto}.direction-panel a{min-height:44px;display:inline-flex;align-items:center}.comparison-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;border-top:1px solid var(--rule);padding-top:24px}.compare-notes{--od-gap:24px;margin-top:48px}.compare-notes h2{font-size:2rem}.compare-notes .od-grid{--od-cols:3;--od-gap:24px}.compare-notes h3{font-family:var(--body);font-size:1.125rem;font-weight:600}.compare-notes .od-stack{--od-gap:12px}
dialog{width:min(720px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:1px solid var(--rule);background:var(--canvas);color:var(--ink);border-radius:8px;padding:24px}dialog::backdrop{background:rgb(20 24 28 / .75)}.dialog-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:24px}.dialog-header h2{font-family:var(--body);font-size:1.125rem;line-height:1.5}.dialog-close{min-width:44px;min-height:44px;border:1px solid var(--rule);background:var(--surface);padding:8px 16px}.dialog-figure{display:grid;gap:16px}.dialog-figure img{width:auto;max-width:100%;height:auto;justify-self:center}.dialog-figure figcaption{font-size:var(--small)}
@media(hover:hover){.nav-link:hover,.wordmark:hover,.article-card:hover h3,.text-link:hover{color:var(--accent)}.button:hover{background:var(--ink);border-color:var(--ink);color:var(--surface)}.button.secondary:hover{background:var(--accent);color:var(--surface);border-color:var(--accent)}.project-media:hover{outline:1px solid var(--accent);outline-offset:4px}.zoom-button:hover,.dialog-close:hover{background:var(--surface);border-color:var(--accent)}}
@media(min-width:1440px){.wrap{width:min(calc(100% - 128px),var(--max))}}
@media(max-width:1023px){.wrap{width:calc(100% - 64px)}.hero,.project-row,.feature,.approach{gap:32px}.desktop-nav{gap:16px}.chapter,.ai-module,.article-layout{grid-template-columns:176px minmax(0,1fr);gap:32px}.hero h1{font-size:clamp(2.5rem,5.4vw,4rem)}.screen-stage,.project-media{padding:24px}.journal-list{gap:24px}.about-grid{gap:32px}.case-hero{padding:32px}}
@media(max-width:767px){.wrap{width:calc(100% - 48px)}.header-inner{flex-wrap:wrap;gap:16px;padding-block:16px}.wordmark{flex:1}.desktop-nav{display:none}.mobile-nav{display:block;width:100%;border-top:1px solid var(--rule);padding-top:8px}.mobile-nav summary{min-height:44px;display:list-item;list-style-position:inside;font-size:var(--small);font-weight:600}.mobile-nav nav{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;padding-block:8px}.hero{grid-template-columns:1fr;gap:32px;padding-block:40px 48px}.hero-copy h1{max-width:15ch}.hero-copy .intro{font-size:1.125rem}.screen-stage{max-width:540px;width:100%}.screen-composition{max-width:400px;margin:auto;gap:16px}.section{padding-block:40px}.section-heading{display:grid;gap:16px;margin-bottom:24px}.project-row{grid-template-columns:1fr;gap:24px;padding-block:32px}.project-media{grid-row:1}.approach,.feature,.contact-section,.about-grid{grid-template-columns:1fr;gap:32px}.journal-list{grid-template-columns:1fr}.article-card{grid-template-columns:48px 1fr;gap:12px 24px}.article-card .article-number{grid-row:1 / 5}.article-card>:not(.article-number){grid-column:2}.contact-section{padding-block:40px}.contact-section .actions{justify-content:flex-start}.page-head,.article-header{padding-block:40px 32px}.page-head .lede,.article-header .lede{font-size:1.125rem}.facts{grid-template-columns:1fr;gap:24px;margin-bottom:32px}.case-hero{padding:24px;margin-bottom:40px}.case-hero .screen-composition{gap:16px}.chapter,.ai-module,.article-layout{grid-template-columns:1fr;gap:24px;padding-block:32px}.chapter-label,.module-label{grid-template-columns:auto 1fr;align-items:start;gap:16px}.chapter-label .eyebrow,.module-label .eyebrow{min-width:48px}.image-grid{--od-cols:1}.image-grid.two{--od-cols:1}.image-figure .image-frame img{max-width:292px}.image-figure .image-frame{padding:24px}.case-plate{padding-block:16px}.article-nav{border-block:1px solid var(--rule);padding-block:16px;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}.article-nav .eyebrow{grid-column:1 / -1}.article-body{--od-gap:32px}.article-body .image-grid{--od-cols:1}.direction-grid{--od-cols:1}.compare-notes .od-grid{--od-cols:1}.direction-panel{padding:24px}.comparison-row{grid-template-columns:1fr}.example-grid{--od-cols:1}.next-story{grid-template-columns:1fr;gap:16px}.about-aside{padding:24px}.contents{padding-bottom:24px}.footer-inner{align-items:flex-start}.contact-section h2{max-width:18ch}}
@media(max-width:374px){.wrap{width:calc(100% - 32px)}.screen-stage,.project-media,.case-hero{padding:16px}.screen-composition{gap:12px}.actions{align-items:stretch}.hero h1{font-size:2.5rem}.button{padding-inline:16px}.case-hero .screen-composition{grid-template-columns:1fr}.case-hero .image-column{max-width:240px;margin:auto}.case-hero.cdp .screen-composition{grid-template-columns:1fr}.stage-label{flex-wrap:wrap}.article-card{grid-template-columns:32px 1fr;gap:12px 16px}.article-nav{grid-template-columns:1fr}.article-nav .eyebrow{grid-column:1}.teaching-example{padding:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}