/* CUT TO: Hollywood — Webfonts. All four families supplied by the brand. */

/* Playfair Display — editorial serif / expressive brand voice */
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/playfair-400.ttf") format("truetype")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/playfair-italic-400.ttf") format("truetype")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/playfair-700.ttf") format("truetype")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:700;font-display:swap;src:url("../fonts/playfair-italic-700.ttf") format("truetype")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/playfair-900.ttf") format("truetype")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:900;font-display:swap;src:url("../fonts/playfair-italic-900.ttf") format("truetype")}

/* Satoshi — brand-forward sans serif */
@font-face{font-family:"Satoshi";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/satoshi-400.otf") format("opentype")}
@font-face{font-family:"Satoshi";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/satoshi-italic-400.otf") format("opentype")}
@font-face{font-family:"Satoshi";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/satoshi-500.otf") format("opentype")}
@font-face{font-family:"Satoshi";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/satoshi-700.otf") format("opentype")}
@font-face{font-family:"Satoshi";font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/satoshi-900.otf") format("opentype")}

/* Manrope — functional sans serif (body) */
@font-face{font-family:"Manrope";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/manrope-300.otf") format("opentype")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/manrope-400.otf") format("opentype")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/manrope-500.otf") format("opentype")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/manrope-600.otf") format("opentype")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/manrope-700.otf") format("opentype")}

/* Courier New — monospaced editorial detail */
@font-face{font-family:"CTH Courier";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/courier-400.ttf") format("truetype")}

/* CUT TO: Hollywood — Color tokens.
   Cinematic, warm, editorial. Warm ivory replaces white; softened near-black replaces pure black. */
:root{
  /* --- Brand & base palette (raw values) --- */
  --color-warm-ivory:#FBF5E9;      /* primary light background */
  --color-cinematic-black:#0F0F11; /* primary dark brand */
  --color-soft-rust:#B96744;       /* primary expressive accent */
  --color-soft-apricot:#E7B98E;    /* light accent / surface */
  --color-muted-sage:#8F9882;      /* natural supporting accent */
  --color-deep-espresso:#3C2B23;   /* warm dark supporting */
  --color-soft-charcoal:#222222;   /* default body text / UI dark */
  --color-pure-white:#FFFFFF;

  /* --- Neutrals --- */
  --color-neutral-black:#0F0F11;
  --color-neutral-charcoal:#222222;
  --color-neutral-warm-gray:#66615D;   /* secondary text, captions, metadata */
  --color-neutral-stone-gray:#AAA39B;  /* disabled / placeholder */
  --color-neutral-light-stone:#DDD6CD; /* borders, dividers, input outlines */

  /* --- State colors --- */
  --color-info:#3478D4;    /* Ocean Blue */
  --color-success:#3F8F63; /* Algae Green */
  --color-warning:#D99E28; /* Grammy Gold */
  --color-error:#C94D4D;   /* Error Red */

  /* --- Semantic aliases (light theme is default) --- */
  --background-primary:var(--color-warm-ivory);
  --background-secondary:var(--color-pure-white);
  --background-accent:var(--color-soft-apricot);
  --background-muted:var(--color-neutral-light-stone);

  --surface-primary:var(--color-pure-white);
  --surface-secondary:var(--color-warm-ivory);
  --surface-sage:var(--color-muted-sage);
  --surface-apricot:var(--color-soft-apricot);
  --surface-espresso:var(--color-deep-espresso);
  --surface-dark:var(--color-cinematic-black);

  --text-primary:var(--color-soft-charcoal);
  --text-strong:var(--color-cinematic-black);
  --text-secondary:var(--color-neutral-warm-gray);
  --text-disabled:var(--color-neutral-stone-gray);
  --text-accent:var(--color-soft-rust);
  --text-inverse:var(--color-warm-ivory);

  --border-subtle:var(--color-neutral-light-stone);
  --border-default:var(--color-neutral-stone-gray);
  --border-strong:var(--color-soft-charcoal);
  --border-accent:var(--color-soft-rust);

  --action-primary-background:var(--color-cinematic-black);
  --action-primary-text:var(--color-warm-ivory);
  --action-primary-hover:var(--color-soft-rust);

  --action-secondary-background:transparent;
  --action-secondary-text:var(--color-soft-charcoal);
  --action-secondary-border:var(--color-soft-charcoal);
  --action-secondary-hover:var(--color-soft-apricot);

  --link-default:var(--color-soft-rust);
  --link-hover:var(--color-deep-espresso);

  --focus-ring:var(--color-soft-rust);
}

/* --- Dark theme scope --- */
[data-theme="dark"]{
  --background-primary:var(--color-cinematic-black);
  --background-secondary:var(--color-deep-espresso);
  --background-accent:var(--color-soft-charcoal);

  --surface-primary:var(--color-soft-charcoal);
  --surface-secondary:var(--color-deep-espresso);
  --surface-accent:var(--color-muted-sage);

  --text-primary:var(--color-warm-ivory);
  --text-strong:var(--color-pure-white);
  --text-secondary:var(--color-neutral-light-stone);
  --text-disabled:var(--color-neutral-stone-gray);
  --text-accent:var(--color-soft-apricot);
  --text-inverse:var(--color-cinematic-black);

  --border-subtle:var(--color-soft-charcoal);
  --border-default:var(--color-neutral-warm-gray);
  --border-strong:var(--color-neutral-light-stone);
  --border-accent:var(--color-soft-rust);

  --action-primary-background:var(--color-warm-ivory);
  --action-primary-text:var(--color-cinematic-black);
  --action-primary-hover:var(--color-soft-apricot);

  --action-secondary-background:transparent;
  --action-secondary-text:var(--color-warm-ivory);
  --action-secondary-border:var(--color-warm-ivory);
  --action-secondary-hover:var(--color-soft-charcoal);

  --link-default:var(--color-soft-apricot);
  --link-hover:var(--color-pure-white);
}

/* CUT TO: Hollywood — Typography tokens.
   Four families with distinct roles. Values reflect the Desktop breakpoint of the responsive scale;
   fluid clamp() ranges span Mobile -> Large-desktop. */
:root{
  /* Family tokens */
  --font-serif-display:"Playfair Display",Georgia,"Times New Roman",serif;
  --font-sans-brand:"Satoshi","Helvetica Neue",Arial,sans-serif;
  --font-sans-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --font-mono:"CTH Courier","Courier New",ui-monospace,monospace;

  /* Weights */
  --weight-light:300;
  --weight-regular:400;
  --weight-medium:500;
  --weight-semibold:600;
  --weight-bold:700;
  --weight-black:900;

  /* Fluid display + heading sizes (min mobile -> max large-desktop) */
  --type-display-01:clamp(46px,8vw,112px);
  --type-display-02:clamp(38px,6vw,80px);
  --type-heading-01:clamp(32px,4.2vw,56px);
  --type-heading-02:clamp(27px,3vw,40px);
  --type-heading-03:clamp(22px,1.8vw,28px);
  --type-serif-accent:clamp(27px,3vw,42px);

  /* Body + label sizes */
  --type-lead:clamp(18px,1.6vw,22px);
  --type-body-lg:18px;
  --type-body:16px;
  --type-body-sm:14px;
  --type-label:14px;
  --type-mono:13px;

  /* Line heights */
  --leading-display:0.92;
  --leading-heading:1.08;
  --leading-heading-tight:1.05;
  --leading-serif-accent:1.16;
  --leading-lead:1.5;
  --leading-body:1.6;
  --leading-body-relaxed:1.65;
  --leading-label:1.2;
  --leading-mono:1.4;

  /* Tracking */
  --tracking-display:-0.035em;
  --tracking-heading:-0.025em;
  --tracking-tight:-0.015em;
  --tracking-normal:0;
  --tracking-label:0.02em;
  --tracking-mono:0.08em;
}

/* CUT TO: Hollywood — Spacing, layout & breakpoint tokens. 4px base unit. */
:root{
  --space-0:0;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
  --space-10:40px;
  --space-12:48px;
  --space-14:56px;
  --space-16:64px;
  --space-20:80px;
  --space-24:96px;
  --space-28:112px;
  --space-32:128px;
  --space-36:144px;
  --space-40:160px;

  /* Breakpoints (min-width) */
  --breakpoint-large-desktop:1440px;
  --breakpoint-desktop:1024px;
  --breakpoint-tablet:768px;
  --breakpoint-mobile:0px;

  /* Max content widths */
  --content-max-large:1440px;
  --content-max-standard:1280px;
  --content-max-reading:760px;
  --content-max-narrow:600px;

  /* Page gutters (fluid: mobile 20px -> large desktop 64px) */
  --page-gutter:clamp(20px,5vw,64px); /* @kind spacing */

  /* Section rhythm (fluid) */
  --section-standard:clamp(72px,10vw,144px); /* @kind spacing */
  --section-hero:clamp(104px,11vw,160px); /* @kind spacing */
  --section-compact:clamp(48px,7vw,96px); /* @kind spacing */
  --section-immersive:clamp(80px,11vw,160px); /* @kind spacing */

  /* Grid gaps */
  --grid-gap:clamp(16px,2vw,32px);
  --grid-gap-compact:clamp(12px,1.4vw,20px);

  /* Component padding */
  --button-padding-y:14px;
  --button-padding-x:24px;
  --button-padding-y-lg:17px;
  --button-padding-x-lg:30px;
  --button-min-height:48px;

  --card-padding:clamp(20px,2.4vw,32px);
  --card-padding-featured:clamp(24px,3.4vw,48px);

  --field-padding-y:14px;
  --field-padding-x:16px;
  --field-min-height:48px;
}

/* CUT TO: Hollywood — Border, radius & shadow tokens.
   Editorial shape language: fine 1px rules, restrained radii, soft warm shadows.
   Avoid applying the same radius to every element. */
:root{
  /* Radii */
  --radius-none:0;
  --radius-control:4px;   /* small interface controls */
  --radius-card:8px;      /* standard cards */
  --radius-featured:12px; /* featured cards */
  --radius-panel:16px;    /* large image / content panels */
  --radius-pill:999px;    /* pills & badges, used selectively */

  /* Border widths */
  --border-hairline:1px;
  --border-accent-width:2px;

  /* Shadows — warm-tinted, soft, editorial (not digital-crisp) */
  --shadow-xs:0 1px 2px rgba(15,15,17,0.06);
  --shadow-sm:0 2px 8px rgba(15,15,17,0.08);
  --shadow-md:0 8px 24px rgba(15,15,17,0.10);
  --shadow-lg:0 18px 48px rgba(15,15,17,0.16);
  --shadow-card-hover:0 14px 36px rgba(60,43,35,0.18);

  /* Film-frame inset used on art-directed imagery */
  --frame-inset:inset 0 0 0 1px rgba(251,245,233,0.14);
}

/* CUT TO: Hollywood — Motion tokens. Cinematic, edited, restrained. */
:root{
  /* Durations */
  --duration-instant:100ms; /* @kind other */
  --duration-fast:180ms;    /* @kind other */
  --duration-standard:300ms;/* @kind other */
  --duration-slow:500ms;    /* @kind other */
  --duration-editorial:800ms;/* @kind other */
  --duration-cinematic:1200ms;/* @kind other */

  /* Easing */
  --ease-standard:cubic-bezier(0.2,0,0,1); /* @kind other */
  --ease-enter:cubic-bezier(0.16,1,0.3,1); /* @kind other */
  --ease-exit:cubic-bezier(0.7,0,0.84,0); /* @kind other */
  --ease-editorial:cubic-bezier(0.22,1,0.36,1); /* @kind other */
  --ease-linear:linear; /* @kind other */

  /* Common composed transitions */
  --transition-hover:color var(--duration-fast) var(--ease-standard),background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard); /* @kind other */
  --transition-card:transform var(--duration-slow) var(--ease-editorial),box-shadow var(--duration-slow) var(--ease-editorial),border-color var(--duration-slow) var(--ease-editorial); /* @kind other */
}
@media (prefers-reduced-motion:reduce){
  :root{
    --duration-instant:0ms; /* @kind other */
    --duration-fast:0ms; /* @kind other */
    --duration-standard:0ms; /* @kind other */
    --duration-slow:0ms; /* @kind other */
    --duration-editorial:0ms; /* @kind other */
    --duration-cinematic:0ms; /* @kind other */
  }
}

/* CUT TO: Hollywood — "The Cutting Room" design system.
   Global entry point. Consumers link this one file. Imports only. */



  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  /* one consistent anchor landing: clear of the fixed nav, breathing room above each destination */
  :root{--cth-anchor-offset:clamp(96px,10vh,116px);}
  #course,#community,#founders,#work,#testimonials,#pricing,#faq{scroll-margin-top:var(--cth-anchor-offset);}
  #top{scroll-margin-top:0;}
  /* Contact lands on the mailing-list card, which carries no section padding of its own */
  #contact{scroll-margin-top:clamp(120px,13.5vh,150px);}
  body{margin:0;background:#0F0F11;font-family:"Manrope","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;}
  a{color:var(--color-soft-rust);}
  a:hover{color:#8f4c30;}
  :focus-visible{outline:2px solid var(--color-soft-rust);outline-offset:3px;}
  @keyframes cthRise{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
  @keyframes cthImg{from{opacity:0;transform:scale(1.06);}to{opacity:1;transform:scale(1);}}
  @keyframes cthLine{from{transform:scaleX(0);}to{transform:scaleX(1);}}

  .cth-grain{position:absolute;inset:0;pointer-events:none;opacity:0.055;background:url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22140%22 height=%22140%22%3E%3Cfilter id=%22n%22%3E%3CfeTurbulence type=%22fractalNoise%22 sc-camel-base-frequency=%220.85%22 sc-camel-num-octaves=%222%22/%3E%3C/filter%3E%3Crect width=%22100%25%22 height=%22100%25%22 filter=%22url(%23n)%22/%3E%3C/svg%3E');}

  /* ---- Opening film leader: 3 · 2 · CUT TO: HOLLYWOOD ---- */
  #cth-leader{position:fixed;inset:0;z-index:9999;background:#5B5751;display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;animation:cthLeaderOut 2.6s cubic-bezier(0.33,0,0.67,1) forwards;}
  #cth-leader.is-off{display:none;}
  /* nothing inside the leader paints until it is armed: no logo/ring/digit frame before the "3" */
  #cth-leader:not(.is-armed)>*{visibility:hidden;}
  #cth-leader:not(.is-armed),#cth-leader:not(.is-armed) *{animation-play-state:paused !important;}
  @keyframes cthLeaderOut{0%,81%{opacity:1;}100%{opacity:0;}}
  @keyframes cthWeave{0%{transform:translate3d(0,0,0);}23%{transform:translate3d(-0.8px,0.5px,0);}47%{transform:translate3d(0.5px,-0.7px,0);}71%{transform:translate3d(-0.3px,-0.3px,0);}100%{transform:translate3d(0,0,0);}}
  @keyframes cthBreathe{0%,100%{opacity:0.045;}37%{opacity:0.072;}63%{opacity:0.032;}}
  @keyframes cthGrainDrift{0%{transform:translate3d(0,0,0);}25%{transform:translate3d(-1.5%,1%,0);}50%{transform:translate3d(1%,-1.5%,0);}75%{transform:translate3d(-1%,-1%,0);}100%{transform:translate3d(0,0,0);}}
  @keyframes cthSweep{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
  @keyframes cthNum{0%{opacity:0;}12%{opacity:1;}82%{opacity:1;}100%{opacity:0;}}
  /* the opening digit is already on screen at first paint — it holds, then hands off on the same beat */
  @keyframes cthNumFirst{0%,82%{opacity:1;}100%{opacity:0;}}
  @keyframes cthRingsOut{0%{opacity:1;transform:scale(1);}100%{opacity:0;transform:scale(1.1);}}
  @keyframes cthTitleIn{0%{opacity:0;}100%{opacity:1;}}
  /* one fixed center point; digits are optically corrected off it, never repositioned */
  .cth-num{position:absolute;left:50%;top:50%;opacity:0;display:block;margin:0;padding:0;width:0.62em;height:1em;font-family:'Satoshi','Satoshi Variable',system-ui,sans-serif;font-weight:500;font-size:clamp(122px,19vw,196px);line-height:1;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:'lnum' 1,'tnum' 1;letter-spacing:0;text-align:center;color:#2B2926;animation:cthNum 0.65s linear both;will-change:opacity;}
  .cth-num:first-of-type{opacity:1;animation-name:cthNumFirst;}
  #cth-leader .cth-num{font-family:'CTH Countdown','Satoshi','Satoshi Variable',system-ui,sans-serif;}
  .cth-ring{position:absolute;border-radius:50%;border:1px solid rgba(240,236,228,0.62);}

  /* ---- Credibility grid ---- */
  .cth-cred{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;justify-items:center;column-gap:clamp(20px,2.8vw,44px);row-gap:clamp(28px,3.8vh,46px);}
  @media (max-width:1000px){.cth-cred{grid-template-columns:repeat(4,minmax(0,1fr));}}
  @media (max-width:620px){.cth-cred{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(14px,4.4vw,24px);row-gap:clamp(22px,3.4vh,32px);}}
  .cth-cred img{width:auto;max-width:100%;opacity:0.78;}
  /* below 620 the marks are capped by both axes so nothing distorts or overflows */
  @media (max-width:620px){.cth-cred img{height:auto !important;max-height:clamp(20px,6.4vw,30px);}}

  /* ---- Curriculum: the route map ---- */
  .cth-route{position:relative;--acc:var(--color-soft-rust);--accsoft:rgba(185,103,68,0.14);}
  .cth-route.is-seed{--acc:var(--color-muted-sage,#7c8a6f);--accsoft:rgba(124,138,111,0.16);}
  .cth-routeline{position:absolute;left:0;right:0;top:37px;height:1px;background:rgba(15,15,17,0.15);z-index:0;}
  .cth-route.is-seed .cth-routeline{background:repeating-linear-gradient(90deg,rgba(15,15,17,0.2) 0 5px,transparent 5px 11px);}
  .cth-routefill{position:absolute;left:0;top:0;height:1px;width:0;background:var(--acc);transition:width 520ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));}
  .cth-track{position:relative;z-index:1;display:flex;align-items:stretch;gap:12px;overflow-x:hidden;overflow-y:hidden;scrollbar-width:none;list-style:none;margin:0;padding:14px 16px 26px;scroll-snap-type:none;scroll-padding-left:16px;scroll-behavior:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;}
  .cth-card{scroll-snap-align:start;}
  .cth-track::-webkit-scrollbar{display:none;}
  .cth-card{position:relative;cursor:pointer;flex:0 0 calc((100% - 36px)/4);display:flex;flex-direction:column;height:258px;padding:14px 16px 16px;border-radius:8px;background:transparent;box-shadow:0 0 0 1px transparent;transition:background 300ms var(--ease-standard,ease),box-shadow 300ms var(--ease-standard,ease);}
  .cth-node{position:relative;flex:0 0 auto;width:19px;height:19px;margin-bottom:14px;display:flex;align-items:center;justify-content:center;}
  .cth-node::before{content:"";position:absolute;inset:0;border-radius:999px;background:#FBF5E9;transform:scale(1.5);}
  .cth-route.is-seed .cth-card:not(.is-active) .cth-node::before{background:#FBF5E9;}
  .cth-dot{position:relative;width:9px;height:9px;border-radius:999px;border:1px solid rgba(15,15,17,0.34);background:#FBF5E9;transition:width 420ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)),height 420ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)),background 320ms var(--ease-standard,ease),border-color 320ms var(--ease-standard,ease),box-shadow 420ms var(--ease-standard,ease);}
  .cth-route.is-seed .cth-dot{border-radius:2px;}
  .cth-card.is-done .cth-dot{background:rgba(15,15,17,0.28);border-color:transparent;}
  .cth-card:hover .cth-dot{border-color:var(--acc);}
  .cth-card.is-active .cth-dot{width:13px;height:13px;background:var(--acc);border-color:var(--acc);box-shadow:0 0 0 5px var(--accsoft);}
  .cth-ico{width:21px;height:21px;color:#7d766a;transition:color 260ms var(--ease-standard,ease),transform 300ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));}
  .cth-ico svg{width:100%;height:100%;display:block;}
  .cth-card:hover .cth-ico{color:#463f39;transform:translateY(-2.5px);}
  .cth-card.is-active .cth-ico{color:var(--acc);transform:translateY(-1px) scale(1.06);}
  .cth-num2{display:block;margin-top:12px;font-family:'CTH Courier','Courier New',monospace;font-size:10.5px;letter-spacing:0.13em;text-transform:uppercase;color:#7d766c;transition:color 260ms var(--ease-standard,ease);}
  .cth-card.is-active .cth-num2{color:var(--acc);}
  .cth-ttl{display:flex;align-items:flex-end;min-height:calc(2 * 1.22em);margin-top:12px;font-family:'Satoshi',sans-serif;font-weight:600;font-size:clamp(15px,1.32vw,17.5px);line-height:1.22;letter-spacing:-0.012em;color:#514a43;text-wrap:pretty;transition:color 260ms var(--ease-standard,ease);}
  .cth-card:hover .cth-ttl{color:var(--color-cinematic-black);}
  .cth-card.is-active .cth-ttl{color:var(--color-cinematic-black);}
  .cth-card.is-done:not(.is-active) .cth-ttl{color:#7d766c;}
  .cth-insight{margin-top:10px;min-height:calc(3 * 1.34em);opacity:0;transform:translateY(7px);font-family:'Playfair Display',serif;font-style:italic;font-weight:500;font-size:14.5px;line-height:1.34;color:#5f5852;transition:opacity 180ms var(--ease-exit,ease-in),transform 180ms var(--ease-exit,ease-in);}
  .cth-card.is-active .cth-insight{opacity:1;transform:none;transition:opacity 260ms var(--ease-enter,cubic-bezier(0.2,0.65,0.2,1)) 90ms,transform 300ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)) 90ms;}
  .cth-card:hover:not(.is-active){background:rgba(255,253,249,0.5);}
  .cth-card.is-active{background:#FFFDF9;box-shadow:0 0 0 1px var(--acc),0 20px 38px -26px rgba(35,28,24,0.5);}
  .cth-arrow{cursor:pointer;width:38px;height:38px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(15,15,17,0.18);background:transparent;color:#5f5852;font-family:'CTH Courier','Courier New',monospace;font-size:15px;transition:background 200ms var(--ease-standard,ease),color 200ms var(--ease-standard,ease),border-color 200ms var(--ease-standard,ease),opacity 200ms var(--ease-standard,ease);}
  .cth-arrow:hover:not([disabled]){border-color:var(--color-cinematic-black);color:var(--color-cinematic-black);background:rgba(15,15,17,0.04);}
  .cth-arrow[disabled]{opacity:0.28;cursor:default;}
  .cth-controls span{white-space:nowrap;}
  .cth-actrule{display:flex;align-items:center;gap:clamp(16px,3vw,30px);}
  .cth-actrule span{flex:1;height:1px;background:rgba(15,15,17,0.14);}

  /* ---- The solution: uncertainty resolving into clarity ---- */
  #cth-revealimg{position:absolute;left:-4%;top:-7%;width:108%;height:114%;object-fit:cover;object-position:58% 24%;will-change:transform,filter;}
  .cth-frag{position:absolute;left:50%;top:50%;font-family:'Playfair Display',serif;font-style:italic;font-weight:500;font-size:clamp(15px,1.6vw,26px);line-height:1;white-space:nowrap;color:var(--color-soft-apricot);text-shadow:0 1px 20px rgba(15,15,17,0.55);will-change:transform,opacity,filter;}
  #cth-revealhead,#cth-revealsub{opacity:1;filter:none;transform:none;}

  /* ---- Community: curated moments ---- */
  .cth-frame{position:relative;overflow:hidden;border:1px solid rgba(15,15,17,0.18);border-radius:12px;box-shadow:0 40px 78px -48px rgba(15,15,17,0.42);}
  .cth-frame img{width:100%;height:clamp(320px,48vh,520px);object-fit:cover;display:block;filter:saturate(0.94) contrast(1.03);transform:scale(1.02);animation:cthPush 34s var(--ease-standard,ease-in-out) infinite alternate;}
  @keyframes cthPush{from{transform:scale(1.02) translate3d(0,0,0);}to{transform:scale(1.11) translate3d(-1.2%,-0.8%,0);}}
  .cth-frame .cth-grain{opacity:0.07;}
  .cth-moments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(36px,6vw,110px);}
  .cth-moment{position:relative;padding:clamp(26px,3.6vh,40px) 0;border-top:1px solid rgba(15,15,17,0.13);}
  .cth-moment:first-child,.cth-moment:nth-child(2){border-top:0;}
  .cth-moment em{display:block;font-family:'CTH Courier','Courier New',monospace;font-style:normal;font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--color-soft-rust);margin-bottom:clamp(12px,1.6vh,16px);}
  .cth-moment p{margin:0;font-family:'Playfair Display',serif;font-style:italic;font-weight:500;font-size:clamp(20px,2.15vw,29px);line-height:1.24;letter-spacing:-0.005em;color:var(--color-cinematic-black);text-wrap:pretty;}
  .cth-moment span{display:block;margin-top:clamp(12px,1.6vh,17px);max-width:40ch;font-size:15px;line-height:1.6;color:#6b6459;}
  .cth-moment--wide{grid-column:1 / -1;}
  .cth-moment--wide p{max-width:26ch;font-size:clamp(23px,2.8vw,38px);}
  .cth-cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(40px,6vw,104px);row-gap:0;}
  .cth-citem{padding:clamp(24px,3.4vh,36px) 0;border-top:1px solid rgba(15,15,17,0.13);text-align:left;}
  .cth-citem:nth-child(-n+2){border-top:0;padding-top:0;}
  .cth-citem b{display:block;font-family:'CTH Courier','Courier New',monospace;font-weight:700;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--color-soft-rust);margin-bottom:clamp(12px,1.6vh,16px);}
  .cth-citem p{margin:0;max-width:38ch;font-family:'Satoshi',sans-serif;font-weight:500;font-size:clamp(16.5px,1.5vw,20px);line-height:1.4;letter-spacing:-0.012em;color:#3d3831;text-wrap:pretty;}
  @media (max-width:760px){.cth-cgrid{grid-template-columns:1fr;}.cth-citem:nth-child(2){border-top:1px solid rgba(15,15,17,0.13);padding-top:clamp(24px,3.4vh,36px);}}
  .cth-detail{display:flex;align-items:baseline;gap:14px;padding:13px 0;border-top:1px solid rgba(15,15,17,0.1);font-size:15px;line-height:1.5;color:#5f5852;}
  .cth-detail b{flex:0 0 auto;font-family:'CTH Courier','Courier New',monospace;font-weight:400;font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:#8f887d;}
  .cth-bullet{display:inline-block;width:5px;height:5px;border-radius:999px;background:var(--color-soft-rust);margin-right:8px;vertical-align:middle;}

  /* ---- Founders: full-spread editorial profiles ---- */
  .cth-profile{display:grid;grid-template-columns:0.82fr 1.18fr;gap:clamp(32px,5vw,86px);align-items:center;}
  .cth-det{overflow:hidden;max-height:0;opacity:0;transition:max-height 780ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)),opacity 560ms var(--ease-standard,ease);}
  .cth-det.is-open{max-height:1800px;opacity:1;}
  .cth-more{cursor:pointer;display:inline-flex;align-items:center;gap:14px;background:none;border:0;padding:0;font-family:'CTH Courier','Courier New',monospace;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--color-cinematic-black);}
  .cth-more::after{content:"";display:block;width:40px;height:1px;background:var(--color-soft-rust);transition:width 320ms var(--ease-standard,ease);}
  .cth-more:hover::after{width:66px;}

  /* ---- Proof: one featured story at a time ---- */
  .cth-quotes{position:relative;min-height:clamp(300px,34vh,400px);}
  .cth-quote{position:absolute;left:0;right:0;top:0;opacity:0;transform:translateY(20px);transition:opacity 900ms var(--ease-standard,ease),transform 900ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));pointer-events:none;}
  .cth-quote.is-on{opacity:1;transform:none;}
  .cth-qbtn{cursor:pointer;background:none;border:0;border-top:1px solid rgba(15,15,17,0.16);padding:13px 0 0;text-align:left;font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:#9a9288;transition:color 260ms var(--ease-standard,ease),border-color 260ms var(--ease-standard,ease);}
  .cth-qbtn:hover{color:var(--color-cinematic-black);}
  .cth-qbtn.is-on{color:var(--color-soft-rust);border-color:var(--color-soft-rust);}

  /* ---- Fixed nav + premium mobile menu ---- */
  #cth-nav{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(16px,2.4vw,30px) clamp(20px,5vw,64px);border-bottom:1px solid transparent;background:rgba(15,15,17,0);backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);box-shadow:0 0 0 rgba(0,0,0,0);transition:background 300ms cubic-bezier(0.4,0,0.2,1),border-color 300ms cubic-bezier(0.4,0,0.2,1),backdrop-filter 300ms cubic-bezier(0.4,0,0.2,1),-webkit-backdrop-filter 300ms cubic-bezier(0.4,0,0.2,1),box-shadow 300ms cubic-bezier(0.4,0,0.2,1);}
  #cth-nav.is-stuck{background:rgba(15,15,17,0.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom-color:rgba(251,245,233,0.13);box-shadow:0 10px 30px rgba(0,0,0,0.28);}
  #cth-page.menu-open #cth-nav{background:transparent;border-bottom-color:transparent;}
  .cth-navlinks{display:flex;align-items:center;gap:clamp(18px,2.4vw,34px);}
  .cth-navlinks>*{flex:0 0 auto;white-space:nowrap;}
  .cth-navlink{position:relative;white-space:nowrap;font-family:'CTH Courier','Courier New',monospace;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(251,245,233,0.78);text-decoration:none;transition:color 260ms var(--ease-standard,ease);}
  .cth-navlink::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--color-soft-rust);transform:scaleX(0);transform-origin:left;transition:transform 320ms var(--ease-standard,ease);}
  .cth-navlink:hover{color:var(--color-warm-ivory);}
  .cth-navlink:hover::after{transform:scaleX(1);}
  .cth-signin{display:inline-flex;align-items:center;gap:7px;font-family:'Satoshi','Satoshi Variable',sans-serif;font-weight:500;font-size:14px;line-height:1;color:#FBF5E9;text-decoration:none;padding:6px 0;transition:color 200ms var(--ease-standard,ease);}
  .cth-signin svg{transition:transform 200ms var(--ease-standard,ease);}
  .cth-signin:hover{color:var(--color-soft-apricot);}
  .cth-signin:hover svg{transform:translateX(3px) translateY(-1px);}
  .cth-burger{display:none;cursor:pointer;background:none;border:0;width:44px;height:44px;flex-direction:column;align-items:flex-end;justify-content:center;gap:7px;padding:0;}
  .cth-burger span{display:block;height:1px;background:var(--color-warm-ivory);transition:transform 420ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)),opacity 200ms var(--ease-standard,ease),width 420ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));}
  .cth-burger span:nth-child(1){width:28px;}
  .cth-burger span:nth-child(2){width:18px;}
  #cth-page.menu-open .cth-burger{align-items:center;}
  #cth-page.menu-open .cth-burger span:nth-child(1){width:18px;transform:translateY(8px) rotate(45deg);}
  #cth-page.menu-open .cth-burger span:nth-child(2){opacity:0;width:18px;}
  #cth-page.menu-open .cth-burger span:nth-child(3){width:18px;transform:translateY(-8px) rotate(-45deg);}
  .cth-burger span:nth-child(3){width:28px;}
  #cth-menu{position:fixed;inset:0;z-index:880;background:#0F0F11;display:flex;flex-direction:column;justify-content:flex-start;overflow-y:auto;padding:clamp(84px,12vh,108px) clamp(24px,7vw,72px) clamp(32px,5vh,56px);opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity 480ms var(--ease-standard,ease),transform 680ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)),visibility 0s linear 500ms;}
  #cth-page.menu-open #cth-menu{opacity:1;visibility:visible;transform:none;transition-delay:0s,0s,0s;}
  .cth-menuitem{display:flex;align-items:baseline;gap:clamp(14px,4vw,20px);padding:clamp(13px,2.1vh,18px) 0;border-top:1px solid rgba(251,245,233,0.13);text-decoration:none;color:var(--color-warm-ivory);opacity:0;transform:translateY(20px);}
  #cth-page.menu-open .cth-menuitem{animation:cthRise 720ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)) forwards;}
  .cth-menuitem b{font-family:'CTH Courier','Courier New',monospace;font-weight:400;font-size:11px;letter-spacing:0.16em;color:var(--color-soft-rust);}
  .cth-menuitem i{font-family:'Playfair Display',serif;font-style:normal;font-weight:500;font-size:clamp(28px,7.6vw,40px);line-height:1.02;letter-spacing:-0.015em;}
  .cth-menucta{display:flex;flex-direction:column;gap:12px;margin-top:clamp(28px,4.4vh,44px);}
  #cth-page.menu-open .cth-menucta{animation:cthRise 720ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1)) 330ms forwards;opacity:0;transform:translateY(16px);}
  .cth-menucta a{width:100%;min-height:54px;}
  /* primary CTA system: ivory default on dark chrome, Soft Rust on hover, everywhere */
  #cth-page,#cth-page [data-theme="dark"],#cth-nav,#cth-menu{--action-primary-hover:#B96744;}
  #cth-nav,#cth-menu{--action-primary-background:var(--color-warm-ivory);--action-primary-text:var(--color-cinematic-black);}
  .cth-menucta a.cth-menu-secondary{background:transparent !important;color:var(--color-warm-ivory) !important;border-color:rgba(251,245,233,0.32) !important;}

  /* ---- Problem: one centered sequence over a darkened house ---- */
  .cth-pstage{position:sticky;top:0;height:100vh;overflow:hidden;}
  /* z0 · one continuous tonal field — charcoal at the top of the frame, near-black at the floor */
  .cth-pstage::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(27,28,32,0) 0%,rgba(20,21,25,0.35) 30%,rgba(14,14,17,0.72) 56%,rgba(10,10,12,0.92) 76%,#08080A 92%,#08080A 100%);}
  /* z0b · the tonal plate. Geometry in vh so travel is bounded by real bleed: the layer spans
     300vh from -100vh and never translates more than ±75vh — an edge cannot reach the frame.
     Every stop fades to full transparency, so there is no hard tonal boundary anywhere in it. */
  .cth-ptone{position:absolute;left:-45%;right:-45%;top:-100vh;height:300vh;z-index:0;pointer-events:none;will-change:transform;opacity:0.9;background:
    radial-gradient(150vh 95vh at 66% 30%,rgba(66,68,74,0.21) 0%,rgba(52,54,60,0.10) 42%,rgba(40,41,47,0.03) 68%,rgba(40,41,47,0) 100%),
    radial-gradient(135vh 85vh at 26% 74%,rgba(46,47,53,0.20) 0%,rgba(30,31,36,0.07) 46%,rgba(20,21,25,0) 100%);}
  /* z0c · the projector bloom — a soft charcoal wash that sweeps the full height of the frame */
  .cth-pbloom{position:absolute;left:-60%;right:-60%;top:-120vh;height:340vh;z-index:0;pointer-events:none;will-change:transform;background:
    radial-gradient(105vh 52vh at 50% 50%,rgba(128,126,120,0.125) 0%,rgba(104,103,99,0.062) 38%,rgba(70,70,68,0.018) 66%,rgba(0,0,0,0) 100%);}
  /* z0c2 · the projector sweep — one oversized, feathered charcoal band raked across the frame.
     Spans 420vh from -160vh and is rotated once at author time; only the translation animates,
     so no edge of the band can enter the frame across the section's full scroll range. */
  .cth-psweep{position:absolute;left:-80%;right:-80%;top:-160vh;height:420vh;z-index:0;pointer-events:none;will-change:transform;opacity:0.95;background:
    radial-gradient(124vh 36vh at 50% 46%,rgba(156,154,148,0.195) 0%,rgba(126,125,120,0.115) 34%,rgba(88,88,86,0.042) 62%,rgba(60,60,60,0.011) 82%,rgba(0,0,0,0) 100%),
    radial-gradient(166vh 62vh at 50% 54%,rgba(100,100,102,0.100) 0%,rgba(72,73,76,0.044) 48%,rgba(40,41,45,0) 100%);}
  @media (max-width:1023px){.cth-psweep{left:-110%;right:-110%;background:
    radial-gradient(100vh 30vh at 50% 46%,rgba(156,154,148,0.208) 0%,rgba(126,125,120,0.122) 34%,rgba(88,88,86,0.044) 62%,rgba(60,60,60,0.011) 82%,rgba(0,0,0,0) 100%),
    radial-gradient(136vh 54vh at 50% 54%,rgba(100,100,102,0.104) 0%,rgba(72,73,76,0.046) 48%,rgba(40,41,45,0) 100%);}}
  @media (max-width:767px){.cth-psweep{left:-150%;right:-150%;background:
    radial-gradient(76vh 26vh at 50% 46%,rgba(156,154,148,0.222) 0%,rgba(126,125,120,0.128) 34%,rgba(88,88,86,0.046) 62%,rgba(60,60,60,0.011) 82%,rgba(0,0,0,0) 100%),
    radial-gradient(110vh 46vh at 50% 54%,rgba(100,100,102,0.110) 0%,rgba(72,73,76,0.048) 48%,rgba(40,41,45,0) 100%);}}
  /* z0d · theatrical framing — the edges hold black wherever the moving layers happen to sit */
  .cth-pvig{position:absolute;inset:0;z-index:0;pointer-events:none;background:
    radial-gradient(86% 70% at 50% 42%,rgba(0,0,0,0) 36%,rgba(6,6,8,0.58) 80%,rgba(4,4,6,0.88) 100%),
    linear-gradient(180deg,rgba(6,6,8,0.46) 0%,rgba(6,6,8,0) 24%,rgba(6,6,8,0) 60%,rgba(5,5,7,0.6) 100%);}
  @media (max-width:767px){.cth-ptone{left:-70%;right:-70%;}.cth-pbloom{left:-90%;right:-90%;background:radial-gradient(78vh 46vh at 50% 50%,rgba(128,126,120,0.125) 0%,rgba(104,103,99,0.062) 38%,rgba(70,70,68,0.018) 66%,rgba(0,0,0,0) 100%);}}
  /* z1 · faint projected light, the only thing that shifts with scroll */
  .cth-thlight{position:absolute;inset:-8%;z-index:1;pointer-events:none;will-change:transform,opacity;background:
    radial-gradient(56% 46% at 50% 36%,rgba(236,230,216,0.058) 0%,rgba(236,230,216,0.02) 48%,rgba(236,230,216,0) 76%),
    radial-gradient(44% 36% at 26% 62%,rgba(236,230,216,0.022) 0%,rgba(236,230,216,0) 72%);}
  /* z2 · the reading band — a fixed percentage zone in the upper frame, wholly above the seat line.
     Copy rests here; only its entry/exit travel dips behind the house. */
  /* the statements' OWN clip region — the header layer is not inside it, so a statement can be
     cropped at the top of the frame without the eyebrow ever being clipped with it */
  #cth-problem{--pb-top:calc(var(--cth-navh,96px) + clamp(46px,7vh,96px));--pb-bot:clamp(250px,23vw,400px);--pb-gut:clamp(28px,7vw,110px);--pb-lift:168px;--pb-eyebrow:max(calc(var(--cth-navh,96px) + 8px),calc((var(--pb-top) + 100vh - var(--pb-bot))/2 - var(--pb-lift)));}
  .cth-pinner{position:absolute;left:0;right:0;top:0;height:100%;z-index:2;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:var(--pb-top) var(--pb-gut) var(--pb-bot);}
  /* THE PERSISTENT HEADER LAYER — top-level layer inside the sticky stage, outside the statements'
     clip region and never touched by the sequence. Absolute (not sticky) so it is ALREADY in its
     locked position the moment the section appears — no settle, no drift into place. Parked below
     the fixed nav (measured at runtime into --cth-navh); the nav's glass panel sits at z-index 900. */
  .cth-phead{position:absolute;left:0;right:0;top:var(--pb-eyebrow);height:0;z-index:7;overflow:visible;pointer-events:none;}
  #cth-problem .cth-plabel{position:relative;margin:0;padding:0 clamp(20px,5vw,64px);opacity:1 !important;filter:none !important;transform:none !important;visibility:visible !important;pointer-events:none;}
  /* z5 · the eyebrow's own masking band, in the section's own top tone: statements travelling
     upward dissolve into it and vanish behind the persistent header rather than colliding with it */
  .cth-pveil{position:absolute;left:0;right:0;top:0;height:calc(var(--pb-eyebrow,300px) * 1.55);z-index:5;pointer-events:none;background:linear-gradient(180deg,#1E1F23 0%,#1E1F23 46%,rgba(30,31,35,0.92) 62%,rgba(30,31,35,0.62) 78%,rgba(30,31,35,0.24) 90%,rgba(30,31,35,0) 100%);}
  /* every state occupies the same centred focal zone */
  .cth-pstack{display:grid;place-items:center;width:100%;max-width:1240px;}
  .cth-pstate{grid-area:1 / 1;width:100%;text-align:center;pointer-events:none;will-change:transform,opacity,filter;}
  .cth-pline{margin:0 auto;max-width:24ch;font-family:'Satoshi',sans-serif;font-weight:600;font-size:clamp(30px,4.2vw,58px);line-height:1.02;letter-spacing:-0.026em;color:#FFFCF4;text-wrap:pretty;}
  .cth-pline em{display:block;margin-top:0.16em;font-family:'Playfair Display',serif;font-style:italic;font-weight:500;color:rgba(251,245,233,0.74);}
  /* z3 · the house as the foreground plane. A true alpha cut-out, so no mask and no crop:
     full-bleed width at natural aspect (never stretched), bottom-anchored, then pushed 27% of its
     own height past the fold so the nearest seat backs leave the frame and every head stays whole.
     Copy (z2) travels up from behind it. */
  .cth-pfloor{position:absolute;left:0;right:0;bottom:0;z-index:3;pointer-events:none;line-height:0;}
  .cth-pfloor img{display:block;width:100%;height:auto;transform:translateY(35%);filter:saturate(0.84) contrast(1.05) brightness(0.9);}
  /* short viewports: the seat band's on-screen height comes from the image's WIDTH, so on a low
     frame it climbs toward the copy — push it further out of frame to hold the reading clearance */
  @media (max-height:760px) and (min-width:901px){.cth-pfloor img{transform:translateY(46%);}#cth-problem{--pb-bot:clamp(200px,19vw,300px);}}
  /* major section eyebrow — the reusable chapter marker */
  .cth-plabel{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2vw,22px);margin:0 0 clamp(30px,5.4vh,72px);font-family:'CTH Courier','Courier New',monospace;font-weight:700;font-size:clamp(13px,1.1vw,15.5px);letter-spacing:0.34em;text-transform:uppercase;color:rgba(251,245,233,0.9);}
  .cth-plabel::before,.cth-plabel::after{content:"";width:clamp(34px,6vw,84px);height:1px;background:rgba(251,245,233,0.34);}
  /* the intro-to-pillars handoff: one small chevron, close to both ends of the sequence */
  .cth-handoff{display:flex;justify-content:center;padding:clamp(14px,2vh,22px) 0 clamp(18px,2.6vh,28px);color:var(--color-neutral-warm-gray);}
  .cth-handarrow{display:block;width:15px;height:8px;opacity:0.42;}
  /* the hero wears the same marker, justified to the hero's own left-aligned composition */
  .cth-heroeyebrow{justify-content:flex-start;margin:0 0 clamp(24px,3.4vh,38px);}
  .cth-heroghost{max-width:none;text-align:right;white-space:nowrap;overflow:visible;line-height:1;padding-bottom:0.1em;}
  @media (max-width:1140px){.cth-heroghost{display:none;}#cth-herobg{object-position:56% 52%;}}
  .cth-heroeyebrow::before{width:clamp(24px,3vw,44px);}
  .cth-plabel.is-light{color:rgba(20,18,16,0.82);}
  .cth-plabel.is-light::before,.cth-plabel.is-light::after{background:rgba(20,18,16,0.24);}

  /* ---- Founders: two editorial columns, then the work ---- */
  .cth-fcards{display:grid;grid-template-columns:1fr 1px 1fr;gap:clamp(24px,3.6vw,58px);}
  .cth-fsep{background:rgba(15,15,17,0.1);}
  .cth-flabel{font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:#6d6660;}
  .cth-fcard{display:flex;flex-direction:column;background:none;border:0;padding:0;text-align:left;font:inherit;color:inherit;transition:opacity 460ms var(--ease-standard,ease);}
  .cth-fcards.has-sel .cth-fcard:not(.is-sel){opacity:0.42;}
  .cth-fportrait{position:relative;aspect-ratio:16/9;overflow:hidden;background:#231C18;}
  .cth-fportrait img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1100ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));}
  .cth-fportrait figcaption{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 9px;background:none;font-family:'CTH Courier','Courier New',monospace;font-size:9.5px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(251,245,233,0.86);}
  .cth-fcard h3{margin:clamp(18px,2.2vh,26px) 0 0;font-family:'Playfair Display',serif;font-weight:600;font-size:clamp(30px,3.4vw,46px);line-height:0.98;letter-spacing:-0.018em;color:var(--color-cinematic-black);}
  .cth-fq{margin:clamp(14px,1.8vh,20px) 0 0;max-width:34ch;font-family:'Playfair Display',serif;font-style:italic;font-weight:500;font-size:clamp(18px,1.65vw,23px);line-height:1.26;color:#3a342f;text-wrap:pretty;}
  .cth-frole{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin:clamp(16px,2vh,22px) 0 0;font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:#6d6660;}
  .cth-frole i{font-style:normal;color:var(--color-soft-rust);}
  .cth-fsee{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(16px,2vh,22px);font-family:'CTH Courier','Courier New',monospace;font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--color-cinematic-black);}
  .cth-fsee::after{content:"";width:26px;height:1px;background:var(--color-soft-rust);transition:width 340ms var(--ease-standard,ease);}
  .cth-fcard.is-sel .cth-fsee::after{width:48px;}
  /* the communal founder moment — one wide editorial statement, then the cut to the credits */
  .cth-fsay{position:relative;margin:clamp(64px,9vh,116px) auto 0;max-width:940px;padding-top:clamp(40px,5.6vh,68px);border-top:1px solid rgba(34,34,34,0.12);}
  .cth-fsay blockquote{margin:0;font-family:'Playfair Display',serif;font-style:italic;font-weight:500;font-size:clamp(22px,2.5vw,34px);line-height:1.3;letter-spacing:-0.014em;color:var(--color-cinematic-black);text-wrap:pretty;}
  .cth-fsay .cth-fsayby{display:flex;align-items:center;gap:12px;margin:clamp(26px,3.6vh,40px) 0 0;font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:#6d6660;}
  .cth-fsay .cth-fsayby::before{content:"";width:clamp(22px,3vw,40px);height:1px;background:var(--color-soft-rust);}
  /* the cut into Selected Credits — spacing only, no gradient */
  .cth-fsay{margin-bottom:0;}
  /* ---- Community voices: three columns, print-quiet ---- */
  .cth-vhead{display:grid;grid-template-columns:1fr auto;gap:clamp(18px,3vw,60px);align-items:end;margin-bottom:clamp(40px,6vh,72px);}
  .cth-vwall{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,28px);align-items:start;}
  .cth-vcol{display:flex;flex-direction:column;gap:clamp(18px,2vw,28px);will-change:transform;}
  .cth-vcol[data-vcol="1"]{margin-top:clamp(22px,4vh,54px);}
  .cth-vcol[data-vcol="2"]{margin-top:clamp(8px,1.6vh,22px);}
  .cth-vcard{margin:0;padding:clamp(22px,2.4vw,32px);background:#FFFDF9;border:1px solid rgba(15,15,17,0.09);border-radius:12px;box-shadow:0 12px 30px -22px rgba(46,43,40,0.4);transition:transform 420ms var(--ease-standard,ease),box-shadow 420ms var(--ease-standard,ease);will-change:filter,opacity;}
  .cth-vcard:hover{transform:translateY(-4px);box-shadow:0 20px 44px -26px rgba(46,43,40,0.5);}
  .cth-vcard blockquote{margin:0;font-family:'Playfair Display',serif;font-weight:400;font-size:clamp(17px,1.5vw,21px);line-height:1.42;letter-spacing:-0.008em;color:var(--color-cinematic-black);text-wrap:pretty;}
  .cth-vcard blockquote::before{content:"\201C";}
  .cth-vcard blockquote::after{content:"\201D";}
  .cth-vcard blockquote em{font-style:italic;color:var(--color-soft-rust);}
  .cth-vcard figcaption{margin-top:clamp(18px,2.2vh,26px);padding-top:14px;border-top:1px solid rgba(15,15,17,0.1);display:flex;flex-direction:column;gap:4px;}
  .cth-vcard figcaption b{font-family:'Satoshi',sans-serif;font-weight:600;font-size:14.5px;letter-spacing:-0.005em;color:var(--color-cinematic-black);}
  .cth-vcard figcaption i{font-family:'CTH Courier','Courier New',monospace;font-style:normal;font-size:11px;letter-spacing:0.11em;text-transform:uppercase;color:#8a8177;}
  /* paged film strip: in paged mode every card keeps one width, so featuring a lesson
     never shifts the cards after it — the active state is colour/shadow/type only */
  .cth-track.is-paged>.cth-card,.cth-track.is-paged>.cth-card.is-active{flex:0 0 calc((100% - 36px)/4) !important;width:auto !important;max-width:none !important;}
  @media (min-width:768px) and (max-width:1140px){
    .cth-track.is-paged>.cth-card,.cth-track.is-paged>.cth-card.is-active{flex:0 0 calc((100% - 24px)/3) !important;}
  }
  /* regular desktop / laptop: the cluster centres in the frame with a real floor under the CTAs,
     so a short laptop viewport can never crop the button row */
  @media (min-width:1141px) and (max-width:1440px){
    #top{min-height:100svh;}
    #top>div:last-child{margin-top:auto !important;margin-bottom:auto !important;padding-top:calc(var(--cth-navh,96px) + clamp(24px,4vh,56px)) !important;padding-bottom:clamp(44px,6.5vh,88px) !important;}
  }
  /* ================= LARGE DESKTOP / ULTRAWIDE (>=1441px) =================
     backgrounds stay full-bleed; the full-width layers (fixed nav, the credits strip and its
     chapter marker) align to the same centred 1320px band the section wrappers already use */
  @media (min-width:1441px){
    #cth-nav{padding-left:max(clamp(20px,5vw,64px),calc((100vw - 1320px)/2));padding-right:max(clamp(20px,5vw,64px),calc((100vw - 1320px)/2));}
    #work .cth-wstrip,#work .cth-wover,#work .cth-wgrid{padding-left:max(clamp(28px,6vw,86px),calc((100vw - 1320px)/2));padding-right:max(clamp(28px,6vw,86px),calc((100vw - 1320px)/2));}
    #cth-problem .cth-pinner{padding-left:max(clamp(28px,7vw,110px),calc((100vw - 1320px)/2));padding-right:max(clamp(28px,7vw,110px),calc((100vw - 1320px)/2));}
    /* hero: a slightly wider band than regular desktop, with the cluster drawn in from the edge so
       it sits against the oversized CUT TO type rather than hugging the frame */
    /* the cluster centres between the nav and the foot of the frame instead of hanging from the
       bottom, with a little extra floor so it reads just above true centre */
    #top>div:last-child{max-width:1400px !important;padding-left:clamp(64px,6vw,132px) !important;padding-right:clamp(64px,6vw,132px) !important;margin-top:auto !important;margin-bottom:auto !important;padding-bottom:clamp(96px,12vh,168px) !important;}
    #top>div:last-child>h1{max-width:20ch !important;}
    #top>div:last-child>p:not(.cth-plabel){max-width:56ch !important;}
  }
  /* paged film strip: three lessons per page between 768 and 1140 */
  @media (min-width:768px) and (max-width:1140px){
    .cth-track{overflow-x:hidden;padding-left:16px;padding-right:16px;scroll-snap-type:none;}
    .cth-card{flex:0 0 calc((100% - 24px)/3);width:auto;max-width:none;}
  }
  @media (prefers-reduced-motion:reduce){
    .cth-vcol{transform:none !important;}
    .cth-vcard{filter:none !important;opacity:1 !important;}
  }
  @media (max-width:900px){
    .cth-vwall{grid-template-columns:1fr;gap:clamp(20px,3vh,28px);}
    .cth-vcol{margin-top:0 !important;}
  }
  /* ---- Pricing: the closing spread ---- */
  .cth-price{display:grid;grid-template-columns:1fr 1.02fr;column-gap:clamp(38px,5.5vw,88px);row-gap:0;align-items:start;max-width:100%;}
  /* left column owns its own flow so the value list's height can never wedge the headline off the price */
  .cth-offer{grid-column:1;display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:100%;}
  .cth-value{min-width:0;max-width:100%;}
  .cth-value{grid-column:2;}
  /* decision block: price, label and both CTAs read as one unit */
  .cth-decide{position:relative;margin-top:clamp(8px,1vh,14px);padding-top:clamp(18px,2.2vh,24px);}
  .cth-pricefig{display:flex;align-items:flex-start;gap:5px;min-width:0;max-width:100%;box-sizing:border-box;}
  .cth-pricecur{margin-top:0.3em;font-family:'Playfair Display',serif;font-weight:500;font-size:clamp(20px,2vw,28px);color:var(--color-soft-rust);}
  .cth-priceamt{font-family:'Playfair Display',serif;font-weight:500;font-size:clamp(66px,8.4vw,118px);line-height:0.78;letter-spacing:-0.038em;color:var(--color-cinematic-black);}
  .cth-pricenote{align-self:flex-end;margin-left:12px;padding-bottom:0.62em;font-family:'CTH Courier','Courier New',monospace;font-size:10.5px;line-height:1.55;letter-spacing:0.1em;text-transform:uppercase;color:#6d6660;}
  .cth-cta{display:flex;align-items:center;gap:clamp(12px,1.3vw,18px);flex-wrap:wrap;margin-top:clamp(30px,3.8vh,44px);}
  /* value column: curated, dense, elegant */
  .cth-inclhead{display:block;margin-bottom:clamp(14px,1.9vh,19px);font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--color-soft-rust);}
  .cth-incl{list-style:none;margin:0;padding:0;}
  .cth-incl li{padding:clamp(15px,1.9vh,19px) 0;border-top:1px solid rgba(15,15,17,0.13);}
  .cth-incl li:last-child{border-bottom:1px solid rgba(15,15,17,0.13);}
  .cth-incl b{display:block;font-family:'Satoshi',sans-serif;font-weight:600;font-size:clamp(15.5px,1.32vw,17.5px);letter-spacing:-0.005em;color:var(--color-cinematic-black);}
  .cth-incl span{display:block;margin-top:7px;max-width:52ch;font-size:clamp(14px,1.18vw,15.5px);line-height:1.56;color:#6d6660;}
  .cth-incl span em{font-family:'Playfair Display',serif;font-style:italic;color:#4a443d;}
  .cth-incl li.is-warranty b{color:var(--color-soft-rust);}
  .cth-incl li.is-warranty b::before{content:"\2014\00a0";}
  /* the guarantee: the reassurance that closes the purchase, sitting under the CTA */
  .cth-guar{width:100%;max-width:520px;margin-top:clamp(22px,3vh,32px);padding:clamp(20px,2.2vw,28px);background:#FDF7EC;border:1px solid rgba(15,15,17,0.12);border-radius:12px;box-shadow:0 14px 34px -28px rgba(46,43,40,0.42);}
  .cth-guar .cth-guarlabel{display:flex;align-items:center;gap:10px;font-family:'CTH Courier','Courier New',monospace;font-size:10.5px;letter-spacing:0.18em;text-transform:uppercase;color:var(--color-soft-rust);}
  .cth-guar .cth-guarlabel::after{content:"";flex:1;height:1px;background:rgba(185,103,68,0.34);}
  .cth-guar b{display:block;margin-top:12px;font-family:'Satoshi',sans-serif;font-weight:600;font-size:clamp(17px,1.5vw,20px);line-height:1.24;letter-spacing:-0.012em;color:var(--color-cinematic-black);}
  .cth-guar p{margin:9px 0 0;max-width:46ch;font-size:clamp(14px,1.18vw,15.5px);line-height:1.58;color:#6d6660;text-wrap:pretty;}
  @media (max-width:900px){
    .cth-price{grid-template-columns:1fr;row-gap:clamp(30px,4.5vh,42px);}
    .cth-offer,.cth-value{grid-column:1;}
    /* nothing in the offer may set its own width at mobile — the container owns it */
    .cth-pricefig{width:auto !important;height:auto !important;max-width:100%;}
    .cth-guar,.cth-incl,.cth-incl li,.cth-cta{max-width:100%;box-sizing:border-box;min-width:0;}
    .cth-cta>*{max-width:100%;}
  }
  /* tablet only (768–1140): the offer reads as one centred stack, not a squeezed desktop column */
  @media (min-width:768px) and (max-width:1140px){
    #pricing>div>.cth-plabel{text-align:center;}
    #pricing .cth-price{grid-template-columns:1fr;row-gap:clamp(52px,7vh,78px);justify-items:center;}
    #pricing .cth-offer,#pricing .cth-value{grid-column:1;width:100%;}
    #pricing .cth-offer{display:flex;flex-direction:column;align-items:center;text-align:center;}
    #pricing .cth-intro h2{max-width:20ch;margin:0 auto;}
    #pricing .cth-decide{display:flex;flex-direction:column;align-items:center;margin-top:clamp(40px,5.4vh,60px);}
    #pricing .cth-pricefig{justify-content:center;width:auto;}
    #pricing .cth-pricenote{text-align:left;}
    #pricing .cth-cta{justify-content:center;margin-top:clamp(32px,4.2vh,44px);}
    /* the guarantee stays tethered to the CTA it reassures */
    #pricing .cth-guar{margin-top:clamp(22px,2.8vh,30px);max-width:560px;text-align:left;}
    #pricing .cth-guar p{max-width:none;}
    /* benefits: centred container, left-aligned reading */
    #pricing .cth-value{max-width:620px;margin:0 auto;text-align:left;}
    #pricing .cth-inclhead{text-align:center;}
    #pricing .cth-incl span{max-width:none;}
  }
  /* ---- The work: step inside the founders' portfolio ---- */
  .cth-wpin{position:relative;}
  .cth-wstage{position:relative;height:min(100vh,900px);min-height:620px;overflow:hidden;}
  /* the artwork IS the environment */
  .cth-ambwrap{position:absolute;inset:0;}
  .cth-amb{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.04) translate3d(0,calc(var(--wp,0) * -26px),0);transition:opacity 350ms var(--ease-standard,ease),transform 1400ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));}
  .cth-amb.is-on{opacity:1;transform:scale(1.075) translate3d(0,calc(var(--wp,0) * -26px),0);}
  .cth-ambveil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,15,17,0.86) 0%,rgba(15,15,17,0.7) 52%,rgba(15,15,17,0.52) 100%);}
  .cth-ambscrim{position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(transparent,rgba(15,15,17,0.8));}
  .cth-wframe{position:absolute;inset:clamp(14px,1.6vw,24px);border:1px solid rgba(251,245,233,0.12);pointer-events:none;}
  /* left-aligned placard, layered over the scene */
  .cth-wgrid{position:absolute;left:0;right:0;top:50%;transform:translateY(-54%);padding:0 clamp(28px,6vw,86px);}
  .cth-weyebrow{display:flex;align-items:center;gap:12px;margin-bottom:clamp(20px,2.8vh,32px);font-family:'CTH Courier','Courier New',monospace;font-size:11.5px;letter-spacing:0.2em;text-transform:uppercase;color:var(--color-soft-rust);}
  .cth-weyebrow::before{content:"";width:38px;height:1px;background:var(--color-soft-rust);}
  .cth-wplates{position:relative;min-height:min(clamp(220px,30vh,300px),42vh);}
  /* sequenced credit change: the outgoing plate clears first, the incoming one follows */
  .cth-plate{position:absolute;inset:0;opacity:0;transform:translateY(10px);pointer-events:none;will-change:opacity,transform;
    transition:opacity 190ms cubic-bezier(0.4,0,1,1),transform 220ms cubic-bezier(0.4,0,1,1);transition-delay:0ms;}
  .cth-plate.is-on{opacity:1;transform:none;
    transition:opacity 400ms var(--ease-standard,ease),transform 520ms var(--ease-editorial,cubic-bezier(0.2,0.65,0.2,1));transition-delay:200ms;}
  /* paged film strip: in paged mode every card keeps one width, so featuring a lesson
     never shifts the cards after it — the active state is colour/shadow/type only */
  .cth-track.is-paged>.cth-card,.cth-track.is-paged>.cth-card.is-active{flex:0 0 calc((100% - 36px)/4) !important;width:auto !important;max-width:none !important;}
  @media (min-width:768px) and (max-width:1140px){
    .cth-track.is-paged>.cth-card,.cth-track.is-paged>.cth-card.is-active{flex:0 0 calc((100% - 24px)/3) !important;}
  }
  /* paged film strip: three lessons per page between 768 and 1140 */
  @media (min-width:768px) and (max-width:1140px){
    .cth-track{overflow-x:hidden;padding-left:16px;padding-right:16px;scroll-snap-type:none;}
    .cth-card{flex:0 0 calc((100% - 24px)/3);width:auto;max-width:none;}
  }
  @media (prefers-reduced-motion:reduce){.cth-plate,.cth-plate.is-on{transition-delay:0ms;}}
  .cth-wrole{display:block;font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.22em;text-transform:uppercase;color:rgba(251,245,233,0.6);}
  .cth-wtitle{margin:clamp(14px,1.8vh,20px) 0 0;max-width:16ch;font-family:'Playfair Display',serif;font-weight:500;font-size:clamp(42px,6.4vw,104px);line-height:0.92;letter-spacing:-0.026em;color:var(--color-warm-ivory);text-shadow:0 24px 60px rgba(0,0,0,0.5);text-wrap:pretty;}
  .cth-wwho{display:flex;align-items:center;gap:12px;margin:clamp(22px,2.8vh,32px) 0 0;font-family:'Satoshi',sans-serif;font-weight:500;font-size:clamp(15px,1.4vw,19px);color:var(--color-soft-apricot);}
  .cth-wwho::before{content:"";width:22px;height:1px;background:var(--color-soft-rust);}
  .cth-wstudio{margin:8px 0 0;padding-left:34px;font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(251,245,233,0.66);}
  .cth-wstudio i{font-style:normal;color:rgba(251,245,233,0.3);margin:0 9px;}
  /* film strip — navigation, not the show */
  .cth-wstrip{position:absolute;left:0;right:0;bottom:clamp(24px,3.4vh,42px);display:flex;flex-direction:column;align-items:stretch;gap:clamp(12px,1.6vh,18px);padding:0 clamp(28px,6vw,86px);}
  .cth-wscroll{flex:0 0 auto;min-width:0;padding-top:8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;padding-bottom:2px;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,0.25) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,0.25) 100%);}
  .cth-wscroll::-webkit-scrollbar{display:none;}
  .cth-wtrack{--fw:clamp(84px,8vw,116px);--gap:10px;display:flex;align-items:flex-end;gap:var(--gap);width:max-content;}
  .cth-wcard{flex:0 0 var(--fw);width:var(--fw);min-width:0;opacity:0.62;scroll-snap-align:center;transition:opacity 380ms var(--ease-standard,ease),transform 380ms var(--ease-standard,ease);}
  .cth-wcard:hover{opacity:0.88;}
  .cth-wcard.is-on{transform:translateY(-4px);}
  .cth-wcard.is-on{opacity:1;}
  .cth-wpin[data-hint="0"] .cth-wcard[data-f="1"],.cth-wpin[data-hint="1"] .cth-wcard[data-f="0"]{opacity:0.16;}
  .cth-wkey{position:relative;aspect-ratio:16/10;overflow:hidden;background:#231C18;display:flex;align-items:center;justify-content:center;border:1px solid rgba(251,245,233,0.14);transition:border-color 700ms var(--ease-standard,ease);}
  .cth-wcard.is-on .cth-wkey{border-color:var(--color-soft-rust);}
  .cth-wkey u{text-decoration:none;font-family:'CTH Courier','Courier New',monospace;font-size:8px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(251,245,233,0.3);}
  .cth-wkey img{width:100%;height:100%;object-fit:cover;display:block;}
  .cth-wcap{display:block;margin-top:8px;font-family:'CTH Courier','Courier New',monospace;font-size:10.5px;letter-spacing:0.09em;text-transform:uppercase;color:rgba(251,245,233,0.68);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .cth-wprog{flex:0 0 auto;display:flex;align-items:center;justify-content:flex-start;gap:14px;padding-bottom:0;font-family:'CTH Courier','Courier New',monospace;font-size:11px;letter-spacing:0.16em;color:rgba(251,245,233,0.66);}
  .cth-wprog em{font-style:normal;}
  .cth-wprog em#cth-wnow{color:var(--color-warm-ivory);}
  .cth-wrail{position:relative;width:clamp(54px,7vw,96px);height:1px;background:rgba(251,245,233,0.2);}
  .cth-wrail b{position:absolute;left:0;top:0;height:1px;width:0%;background:var(--color-soft-rust);transition:width 220ms linear;}
  /* the chapter marker rides on the artwork itself, with a faint scrim for legibility */
  .cth-wover{position:absolute;left:0;right:0;top:clamp(118px,15vh,158px);z-index:4;margin:0;padding:0 clamp(28px,6vw,86px);color:var(--color-warm-ivory);}
  .cth-wtopveil{position:absolute;left:0;right:0;top:0;height:clamp(240px,32vh,340px);z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(10,10,12,0.62) 0%,rgba(10,10,12,0.3) 46%,rgba(10,10,12,0) 100%);}
  .cth-warrows{display:flex;gap:6px;margin-right:4px;}
  .cth-warrow{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;background:none;border:1px solid rgba(251,245,233,0.24);border-radius:999px;color:rgba(251,245,233,0.78);font-size:13px;line-height:1;cursor:pointer;transition:border-color 180ms var(--ease-standard,ease),color 180ms var(--ease-standard,ease),opacity 180ms var(--ease-standard,ease);}
  .cth-warrow:hover:not(:disabled){border-color:var(--color-soft-rust);color:var(--color-warm-ivory);}
  .cth-warrow:disabled{opacity:0.3;cursor:default;}
  .cth-wticks{display:none;}

  @media (max-height:720px) and (min-width:901px){
    .cth-pgrid{padding-top:clamp(76px,11vh,104px);padding-bottom:clamp(28px,4vh,44px);}
    .cth-plist{min-height:clamp(210px,30vh,260px);}
  }
  @media (max-width:900px){
    .cth-moments{grid-template-columns:1fr;}
    .cth-moment:nth-child(2){border-top:1px solid rgba(15,15,17,0.13);}
    .cth-pgrid{grid-template-columns:1fr;gap:clamp(30px,5vh,48px);}
    .cth-pdiv{display:none;}
    .cth-profile{grid-template-columns:1fr;}
    .cth-fcards{grid-template-columns:1fr;gap:clamp(34px,5vh,52px);}
    .cth-fsep{display:none;}
    .cth-ptrk{--pw:clamp(148px,44vw,200px);}
  }
  @media (max-width:1140px){
    .cth-navlinks{display:none;}
    .cth-burger{display:flex;}
  }
  @media (min-width:768px) and (max-width:1024px){
    .cth-track{flex-direction:row;overflow-x:auto;align-items:stretch;gap:12px;padding:12px 16px 22px;scroll-snap-type:x mandatory;}
    .cth-card{flex:0 0 min(52vw,306px);width:min(52vw,306px);min-height:0;height:228px;flex-direction:column;align-items:stretch;gap:0;padding:14px 16px 16px;border-radius:8px;}
    .cth-card:hover{transform:none;}
    .cth-node{margin-bottom:11px;}
    .cth-num2{margin-top:10px;}
    .cth-ttl{margin-top:10px;min-height:calc(2 * 1.24em);font-size:16px;line-height:1.24;}
    .cth-insight{font-size:14.5px;}
    .cth-controls{display:flex !important;}
    .cth-rail{display:none !important;}
  }
  /* fixed pixel sizes from direct edits must never constrain a full-bleed section */
  #course{width:auto !important;height:auto !important;}
  #curriculum h2,#curriculum h3{width:auto !important;height:auto !important;}
  /* ================= MOBILE REFINEMENT ================= */
  @media (max-width:900px){
    /* fixed pixel sizes from direct edits must never escape the viewport */
    #course{padding-top:clamp(60px,9vh,84px) !important;padding-bottom:clamp(60px,9vh,84px) !important;}
    #course figure{justify-self:stretch !important;max-width:none !important;transform:rotate(-1deg) !important;}
    #course figure img{height:clamp(230px,38vh,320px) !important;}
    #course>div{gap:clamp(30px,5vh,44px) !important;}
    .cth-vwall{grid-template-columns:1fr;}
    .cth-vcol{margin-top:0 !important;}
    .cth-vcol[data-vcol="1"],.cth-vcol[data-vcol="2"]{margin-top:0;}
    /* the work: keep the placard and strip clear of each other */
    .cth-wplates{min-height:36vh;}
    .cth-wgrid{transform:translateY(-58%);}
    .cth-wtrack{--fw:clamp(80px,24vw,104px);}
    .cth-wstudio{padding-left:0;}
    .cth-wwho::before{display:none;}
    /* pricing: the figure stays the loudest thing on the screen */
    .cth-pricefig{flex-wrap:wrap;}
    .cth-pricenote{margin-left:0;flex-basis:100%;padding-bottom:0;padding-top:12px;}
  }
  @media (min-width:768px) and (max-width:1024px){
    .cth-card.is-active{flex-basis:min(52vw,306px);background:#FFFDF9;box-shadow:0 12px 30px -22px rgba(46,43,40,0.45);}
    .cth-card.is-active .cth-ttl{font-size:17.5px;}
    .cth-card.is-active .cth-insight{max-height:150px;margin-top:8px;}
    .cth-card.is-active .cth-num2{color:var(--acc);}
  }
  @media (max-width:720px){
    /* section rhythm: consistent editorial breathing, never abandoned */
    #community,#pricing{padding-top:clamp(64px,10vh,92px) !important;padding-bottom:clamp(64px,10vh,92px) !important;}
    #founders{padding-top:clamp(64px,10vh,92px) !important;padding-bottom:clamp(64px,10vh,92px) !important;}
    #proof,#curriculum{padding-top:clamp(60px,9vh,88px) !important;}
    .cth-vhead h2,.cth-fcard h3{max-width:16ch;}
    .cth-fq{font-size:clamp(17px,4.6vw,20px);}
    .cth-fportrait{aspect-ratio:3/2;}
    .cth-fsay blockquote{font-size:clamp(20px,4.9vw,26px);}
    .cth-vcard blockquote{font-size:clamp(18px,4.8vw,21px);}
    /* touch targets */
    .cth-wcard,.cth-fcard{min-height:44px;}
  }
  /* ================= MOBILE (<=767px) — a responsive translation, not a different site ================= */
  @media (max-width:767px){
    /* 1 · the oversized outlined word is desktop scenery; on mobile it only crowds the message */
    .cth-heroghost{display:none !important;}
    #cth-herobg{object-position:58% 60% !important;}
    /* 2 · hero rhythm tightens once that space is reclaimed */
    #top>div:last-child{padding-top:clamp(112px,16vh,132px) !important;padding-bottom:clamp(38px,6vh,58px) !important;}
    /* 3 · CTAs stay tappable; they stack rather than squeeze */
    .cth-herocta{gap:12px;}
    .cth-herocta>*{min-height:48px;}
    @media (max-width:400px){.cth-herocta{flex-direction:column;align-items:stretch;}}
    /* 4+5 · the problem chapter marker sits high, the focal track starts sooner, no overlap */
    #cth-problem{height:290vh;}
    #cth-problem .cth-plabel{padding:0 26px;}
    #cth-problem{--pb-top:calc(var(--cth-navh,96px) + clamp(38px,5.5vh,74px));--pb-bot:clamp(120px,19vw,210px);--pb-gut:26px;--pb-lift:142px;}
    #cth-problem .cth-pinner{height:100%;align-items:center;text-align:center;}
    .cth-pline{font-size:clamp(25px,7.4vw,34px);}
    /* the house drops further out of frame so the reading zone keeps its margin */
    .cth-pfloor img{transform:translateY(44%);}
    .cth-thaud{bottom:0;height:auto;overflow:visible;}
    .cth-thaud img{position:static;}
    /* 7–14 · pillars keep the connected horizontal timeline, snap-scrolled one card at a time */
    /* the strip bleeds to the screen edges; its own padding replaces the section gutter rather than adding to it */
    .cth-track{flex-direction:row;overflow-x:auto;gap:12px;margin-left:-26px;margin-right:-26px;padding:14px 26px 26px;padding-right:calc(100% - min(84vw,340px));scroll-snap-type:x mandatory;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-padding-left:26px;}
    .cth-card{flex:0 0 84vw;width:84vw;max-width:340px;min-height:0;height:246px;flex-direction:column;align-items:stretch;gap:0;padding:15px 17px 17px;border:1px solid rgba(15,15,17,0.12);border-top:1px solid rgba(15,15,17,0.12);border-radius:8px;scroll-snap-align:start;}
    .cth-card:hover{transform:none;}
    .cth-card.is-active{flex-basis:84vw;background:#FFFDF9;box-shadow:0 12px 30px -22px rgba(46,43,40,0.45);}
    .cth-ttl{margin-top:0;font-size:19px;line-height:1.24;}
    .cth-card.is-active .cth-ttl{font-size:20px;}
    .cth-insight{font-size:14.5px;}
    .cth-card.is-active .cth-insight{max-height:120px;}
    .cth-routeline{left:26px;right:26px;}
    .cth-controls{display:flex !important;}
    .cth-rail{display:none !important;}
    /* 15 · the close gradient must never sit under live offer copy */
    #pricing{padding-bottom:clamp(300px,42vh,380px) !important;}
    .cth-offerfade{height:200px !important;}
    /* 17 · eyebrow rules never squeeze the label */
    .cth-plabel{gap:12px;font-size:11px;letter-spacing:0.26em;}
    .cth-plabel::before,.cth-plabel::after{width:22px;}
    /* 19 · one consistent mobile gutter */
    #top>div:last-child,#course>div,#curriculum>div,#community>div,#founders>div,#testimonials>div,#pricing>div,footer>div,
    section[data-screen-label="01b Credibility"]>div,section[data-screen-label="11 Final CTA"]>div{padding-left:26px !important;padding-right:26px !important;}
    .cth-wover,.cth-wgrid,.cth-wstrip{padding-left:26px !important;padding-right:26px !important;}
    /* mobile alignment system: one centered editorial rhythm, Pillars cards excepted */
    #top>div:last-child,#cth-problem .cth-pinner,#course>div,#community>div,#founders>div,#testimonials>div,#pricing>div{text-align:center;}
    .cth-heroeyebrow{justify-content:center;}
    .cth-herocta,.cth-cta,.cth-actrule{justify-content:center;}
    #top h1,#top p,#course h2,#course p,.cth-vhead h2,.cth-vhead p{margin-left:auto;margin-right:auto;}
    .cth-offer{align-items:center;}
    .cth-pricefig{justify-content:center;}
    .cth-incl li{text-align:center;}
    .cth-guar{margin-left:auto;margin-right:auto;text-align:center;}
    .cth-guar .cth-guarlabel{justify-content:center;}
    .cth-guar .cth-guarlabel::after{display:none;}
    .cth-guar p{margin-left:auto;margin-right:auto;}
    .cth-incl span{margin-left:auto;margin-right:auto;}
    /* founder details centre under each portrait */
    .cth-fcard{text-align:center;align-items:center;}
    .cth-fq,.cth-fcard h3{margin-left:auto;margin-right:auto;}
    /* the communal quote follows the same centred rhythm */
    .cth-fsay{text-align:center;}
    .cth-fsay .cth-fsayby{flex-direction:column;gap:16px;align-items:center;}
    .cth-frole{justify-content:center;}
    /* selected credit detail copy centres with the artwork */
    .cth-wgrid{text-align:center;}
    .cth-wtitle{margin-left:auto;margin-right:auto;}
    .cth-wwho{justify-content:center;}
    .cth-wwho::before{display:none;}
    .cth-wstudio{padding-left:0;}
    /* the Pillars keep their left-aligned card content */
    .cth-card,.cth-track,.cth-route{text-align:left;}
    /* the purchase decision reads as one block: headline → price → commitment → CTA */
    /* one decision sequence: headline → price → commitment → CTA → value */
    .cth-decide{margin-top:0;padding-top:clamp(10px,1.4vh,14px);}
    /* $ and 599 stay one lockup, centred as a group; the label drops to its own centred line */
    .cth-pricefig{flex-direction:row;justify-content:center;align-items:flex-start;flex-wrap:wrap;gap:4px;}
    .cth-priceamt{font-size:clamp(60px,17vw,76px);}
    .cth-pricenote{flex-basis:100%;align-self:auto;margin:10px 0 0;padding:0;text-align:center;letter-spacing:0.16em;line-height:1.5;}
    .cth-cta{margin-top:clamp(26px,3.2vh,34px);}
    .cth-cta>*{min-height:52px;width:auto;max-width:300px;}
    .cth-value{margin-top:clamp(22px,3vh,30px);}
    #pricing .cth-intro h2{margin-bottom:0;}
    #pricing .cth-intro h2{max-width:18ch;}
    .cth-incl span{max-width:34ch;}
    /* 4+5 · the guarantee is the natural end of the offer — no leftover void beneath it */
    #pricing{padding-bottom:clamp(190px,26vh,240px) !important;}
    .cth-offerfade{height:150px !important;}
    .cth-incl li:last-child{padding-bottom:clamp(6px,1vh,10px);}
    /* 18 · type scale: hierarchy preserved, no runaway headlines */
    .cth-vcard blockquote{font-size:19px;}
    .cth-wtitle{font-size:clamp(28px,8vw,40px);}
  }
  /* ================= RESPONSIVE RHYTHM PASS — tablet & mobile only, desktop untouched ================= */
  /* --- shared below 1141px: vertical rhythm, not layout --- */
  @media (max-width:1140px){
    /* course intro hands off to Pillar I as one connected move */
    #course{padding-bottom:clamp(52px,7vh,80px) !important;}
    #curriculum{padding-top:clamp(20px,3vh,36px) !important;}
    #curriculum>div>div[data-reveal]:not(.cth-route){margin-bottom:clamp(22px,3.2vh,34px) !important;}
    #curriculum>div>div[data-reveal]:not(.cth-route)>span{font-size:13px !important;margin-bottom:clamp(12px,1.8vh,18px) !important;}
    #curriculum>div>div[data-reveal]:not(.cth-route)>p{font-size:clamp(28px,3.9vw,36px) !important;}
  }
  /* tablet only: each founder profile centres within its column */
  @media (min-width:768px) and (max-width:1140px){
    .cth-fcard{text-align:center;align-items:center;}
    .cth-fcard h3,.cth-fq{margin-left:auto;margin-right:auto;}
    .cth-fq{max-width:38ch;}
    .cth-frole{justify-content:center;}
    .cth-fportrait{width:100%;}
  }
  /* founders → selected credits: a cut, not a gap. Tablet only — 1280/1366 are laptop
     widths and must keep the desktop closing margin. */
  @media (max-width:1140px){
    #founders>div:first-of-type{padding-bottom:0 !important;}
    .cth-fcards{margin-bottom:0 !important;}
    .cth-fsay{margin-top:clamp(40px,5.2vh,64px) !important;padding-top:clamp(28px,3.8vh,42px) !important;}
    .cth-fsay .cth-fsayby{margin-top:clamp(16px,2.2vh,24px) !important;}
    #founders{padding-bottom:clamp(34px,4.6vh,52px) !important;}
    #work .cth-wover{top:clamp(84px,11vh,124px) !important;}
  }
  /* --- tablet landscape --- */
  @media (min-width:901px) and (max-width:1140px){
    #top{min-height:88vh !important;}
    #top>div:last-child{padding-top:clamp(104px,12vh,118px) !important;padding-bottom:clamp(48px,7vh,84px) !important;}
    #cth-problem{height:190vh !important;}
    #cth-problem{--pb-top:calc(var(--cth-navh,150px) + clamp(22px,3vh,34px));--pb-bot:30vh;--pb-gut:clamp(28px,5vw,64px);--pb-lift:136px;}
    #cth-problem .cth-pfloor{left:-7.5%;right:-7.5%;}
    #cth-problem .cth-pfloor img{transform:translateY(46%);}
    #cth-problem .cth-pline{font-size:clamp(28px,3.5vw,38px);max-width:24ch;}
  }
  /* --- tablet portrait --- */
  @media (min-width:768px) and (max-width:900px){
    #top{min-height:82vh !important;}
    #top>div:last-child{padding-top:clamp(98px,11vh,110px) !important;padding-bottom:clamp(40px,6vh,68px) !important;}
    #cth-problem{height:172vh !important;}
    #cth-problem{--pb-top:calc(var(--cth-navh,145px) + clamp(20px,2.8vh,30px));--pb-bot:21vh;--pb-gut:clamp(26px,4.5vw,54px);--pb-lift:144px;}
    #cth-problem .cth-pfloor{left:-15%;right:-15%;}
    #cth-problem .cth-pfloor img{transform:translateY(48%);}
    #cth-problem .cth-pline{font-size:clamp(26px,4vw,34px);max-width:22ch;}
    /* community examples read as centred cards, not a left-hung list */
    .cth-cgrid{justify-items:center;}
    .cth-citem{text-align:center;}
    .cth-citem p{max-width:40ch;margin-left:auto;margin-right:auto;}
  }
  /* --- standard mobile --- */
  @media (max-width:767px){
    #top{min-height:76vh !important;}
    #top>div:last-child{padding-top:clamp(92px,10.5vh,104px) !important;padding-bottom:clamp(34px,5vh,52px) !important;}
    #cth-problem{height:178vh !important;}
    #cth-problem{--pb-top:calc(var(--cth-navh,140px) + clamp(16px,2.4vh,24px));--pb-bot:23vh;--pb-gut:26px;--pb-lift:182px;}
    #cth-problem .cth-pfloor{left:-32%;right:-32%;}
    #cth-problem .cth-pfloor img{transform:translateY(54%) !important;}
    #cth-problem .cth-pline{font-size:clamp(32px,8.6vw,40px) !important;max-width:17ch;}
    #curriculum>div>div[data-reveal]:not(.cth-route)>p{font-size:clamp(25px,6.6vw,31px) !important;}
    #curriculum>div>div[data-reveal]:not(.cth-route){margin-bottom:clamp(18px,2.6vh,26px) !important;}
    #proof,#curriculum{padding-top:clamp(20px,3vh,34px) !important;}
    .cth-cgrid{justify-items:center;}
    .cth-citem{text-align:center;}
    .cth-citem b{text-align:center;}
    .cth-citem p{max-width:42ch;margin-left:auto;margin-right:auto;}
    .cth-fsay{margin-top:clamp(32px,4.4vh,46px) !important;padding-top:clamp(22px,3vh,32px) !important;}
    .cth-fsay .cth-fsayby{margin-top:clamp(18px,2.4vh,26px) !important;}
    #founders{padding-bottom:clamp(28px,3.8vh,40px) !important;}
    #work .cth-wover{top:clamp(72px,10vh,104px) !important;}
  }
  /* --- narrow mobile --- */
  @media (max-width:480px){
    #top{min-height:72vh !important;}
    #top>div:last-child{padding-top:clamp(86px,10vh,96px) !important;padding-bottom:clamp(28px,4.2vh,40px) !important;}
    #cth-problem{height:168vh !important;}
    #cth-problem{--pb-top:calc(var(--cth-navh,135px) + clamp(14px,2vh,20px));--pb-bot:18vh;--pb-gut:26px;--pb-lift:178px;}
    #cth-problem .cth-pfloor{left:-36%;right:-36%;}
    #cth-problem .cth-pfloor img{transform:translateY(56%) !important;}
    #cth-problem .cth-pline{font-size:clamp(30px,8.9vw,35px) !important;max-width:16ch;}
    #curriculum>div>div[data-reveal]:not(.cth-route)>p{font-size:clamp(23px,7vw,27px) !important;}
    .cth-citem p{max-width:36ch;}
    #founders{padding-bottom:26px !important;}
  }
  /* paged film strip: in paged mode every card keeps one width, so featuring a lesson
     never shifts the cards after it — the active state is colour/shadow/type only */
  .cth-track.is-paged>.cth-card,.cth-track.is-paged>.cth-card.is-active{flex:0 0 calc((100% - 36px)/4) !important;width:auto !important;max-width:none !important;}
  @media (min-width:768px) and (max-width:1140px){
    .cth-track.is-paged>.cth-card,.cth-track.is-paged>.cth-card.is-active{flex:0 0 calc((100% - 24px)/3) !important;}
  }
  /* paged film strip: three lessons per page between 768 and 1140 */
  @media (min-width:768px) and (max-width:1140px){
    .cth-track{overflow-x:hidden;padding-left:16px;padding-right:16px;scroll-snap-type:none;}
    .cth-card{flex:0 0 calc((100% - 24px)/3);width:auto;max-width:none;}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none !important;}
    #cth-leader{display:none !important;}
    .cth-frame img{animation:none !important;}
    .cth-menuitem{opacity:1 !important;transform:none !important;}
  }