/* The ink raster remains untouched; motion is composed around the hero. */
.heading-line{display:block}.portrait-window{overflow:hidden;position:relative;background:var(--accent)}.portrait-window img{transform-origin:50% 50%}.portrait-caption{display:flex;align-items:center;gap:14px}.portrait-caption::before{content:'';width:28px;height:3px;background:var(--accent)}
.has-directed-motion .reveal{transition:none}.reading-progress{position:fixed;inset:0 0 auto;height:3px;background:var(--accent);box-shadow:0 1px 0 var(--ink);z-index:30;transform-origin:left center;pointer-events:none;transform:scaleX(0)}
.has-directed-motion .impact{position:relative}.has-directed-motion .impact>div{border-left:1px solid var(--line);padding-left:22px}.has-directed-motion .impact>div:first-child{border-left:0;padding-left:0}
.has-directed-motion .project summary{grid-template-columns:60px 1.3fr 1fr 40px;position:relative;isolation:isolate}.project-number{font-size:12px;color:var(--muted);align-self:center;font-variant-numeric:tabular-nums}.has-directed-motion .project-name{transition:transform .45s cubic-bezier(.2,.7,.2,1)}.has-directed-motion .project summary:hover .project-name{transform:translateX(8px)}.has-directed-motion .project-body{padding-left:90px}.has-directed-motion .project-plus{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;font-size:26px;line-height:1}
.conviction-columns{padding:0;background:var(--ink);color:var(--paper);overflow:hidden}.conviction-columns .manifesto-tabs{display:flex;flex-wrap:nowrap;gap:0;border:0;padding:0}.conviction-columns .manifesto-tabs button{position:relative;flex:1 1 0;min-width:0;height:600px;margin:0;padding:28px;border:0;border-right:1px solid #43433e;border-radius:0;color:var(--paper);text-align:left;overflow:hidden;transition:background-color .4s,color .4s}.conviction-columns .manifesto-tabs button:last-child{border-right:0}.conviction-columns .manifesto-tabs button[aria-selected=true]{background:var(--accent);color:var(--ink)}.conviction-columns .manifesto-tabs button:focus-visible{outline:3px solid var(--paper);outline-offset:-8px}.conviction-columns .tab-number{position:absolute;top:30px;left:28px;font:12px var(--body);opacity:.65}.conviction-columns .tab-name{position:absolute;bottom:35px;left:25px;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--display);font-size:clamp(24px,2.8vw,43px);font-weight:500;letter-spacing:-.045em;line-height:1}.conviction-columns button[aria-selected=true] .tab-name{top:60px;bottom:auto;left:28px;writing-mode:horizontal-tb;transform:none;font-size:24px}.conviction-symbol{position:absolute;top:145px;left:50%;width:clamp(65px,8vw,115px);height:clamp(65px,8vw,115px);margin-left:calc(clamp(65px,8vw,115px) / -2);opacity:.65;pointer-events:none}.conviction-symbol svg{width:100%;height:100%}.conviction-columns button[aria-selected=true] .conviction-symbol{top:33px;left:auto;right:28px;margin-left:0;width:90px;height:90px;opacity:1}.conviction-columns .conviction{position:absolute;bottom:38px;min-height:0;padding:0;color:var(--ink)}.conviction-columns .conviction h3{font-size:clamp(40px,4.3vw,67px);font-weight:500;line-height:.98;letter-spacing:-.055em;max-width:none}.conviction-columns .conviction p{font-size:16px;line-height:1.4;max-width:350px;margin-top:26px}.conviction-columns .conviction-count{position:static;display:block;margin-bottom:22px;font-size:11px;opacity:.6}.has-directed-motion .manifesto-intro{position:relative}
.has-directed-motion .email{position:relative;border-bottom-color:var(--line);--underline:1}.has-directed-motion .email::after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:3px;background:var(--accent);transform:scaleX(var(--underline));transform-origin:left}.has-directed-motion .contact{background:var(--ink);color:var(--paper);border-top:0}.has-directed-motion .contact .label{color:var(--accent)}.has-directed-motion .contact a:focus-visible{outline-color:var(--accent)}.has-directed-motion .contact .email:hover{color:var(--accent)}.has-directed-motion footer{background:var(--ink);color:var(--paper);border-top-color:#33332e}.has-directed-motion .contact-bottom a{transition:color .2s}.has-directed-motion .contact-bottom a:hover{color:var(--accent)}
@media(max-width:1100px) and (min-width:900px){.conviction-columns .conviction h3{font-size:43px}.conviction-columns .conviction p{font-size:14px}.conviction-columns button[aria-selected=true] .conviction-symbol{width:70px;height:70px}}
@media(max-width:899px){.conviction-columns{padding:24px;background:var(--accent);color:var(--ink)}.conviction-columns .manifesto-tabs{gap:4px;flex-wrap:wrap;border-bottom:1px solid #799a00;padding-bottom:20px}.conviction-columns .manifesto-tabs button{height:auto;flex:initial!important;padding:10px 13px;border:1px solid transparent;border-radius:24px;color:var(--ink);overflow:visible;background:transparent}.conviction-columns .manifesto-tabs button[aria-selected=true]{background:var(--ink);color:var(--paper)}.conviction-columns .manifesto-tabs button:focus-visible{outline-color:var(--ink);outline-offset:3px}.conviction-columns .tab-number,.conviction-columns .conviction-symbol{display:none}.conviction-columns .tab-name,.conviction-columns button[aria-selected=true] .tab-name{position:static;writing-mode:horizontal-tb;transform:none;font:13px var(--body)}.conviction-columns .conviction{position:relative;bottom:auto;left:auto;width:auto;min-height:370px;padding:34px 0 5px}.conviction-columns .conviction h3{font-size:clamp(40px,7vw,63px)}.conviction-columns .conviction p{font-size:15px}}
@media(max-width:767px){.has-directed-motion .project summary{grid-template-columns:30px 1fr 30px;column-gap:12px}.has-directed-motion .project-name{grid-column:2;font-size:clamp(27px,7vw,34px)}.has-directed-motion .project-type{grid-column:2}.has-directed-motion .project-plus{grid-column:3;width:28px;height:28px;font-size:23px}.project-number{grid-column:1;grid-row:1/3;font-size:10px}.has-directed-motion .project-body{padding-left:42px}.has-directed-motion .impact>div{padding-left:14px}.has-directed-motion .impact>div:nth-child(3){padding-left:0;border-left:0}.has-directed-motion .contact{padding-top:70px}.conviction-columns .conviction{min-height:390px}.conviction-columns .conviction h3{font-size:clamp(37px,8.6vw,58px)}}
@media(prefers-reduced-motion:reduce){.portrait-window{clip-path:none!important}.portrait-window img{transform:none!important}.reading-progress{display:none}}

/* A solid editorial voice for the human phrases; padding protects italic terminals. */
.editorial-mask{display:block;overflow:hidden;padding:.12em .08em .22em;margin:-.12em -.08em -.22em}
.editorial-accent{display:block;font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-optical-sizing:auto;font-size:.96em;letter-spacing:-.04em;line-height:1.12;color:inherit;-webkit-text-stroke:0}
.about-heading .editorial-mask{margin-top:.07em;margin-bottom:-.12em}
.contact-heading-line{display:block}
.contact .editorial-accent{font-size:.94em}

/* Next Feeling: stable evidence, one deliberate human moment, a quiet close. */
/* Hero copy inverts over paper/film like the masthead. Blending needs the hero as backdrop,
   so .hero-bottom and .hero-actions must not create stacking contexts of their own. */
.hero .hero-bottom{z-index:auto}
.hero-bottom>p,.hero-actions button,.hero-actions>span{position:relative;z-index:3}
.hero-bottom>p,.hero-actions>span{color:#fff;mix-blend-mode:difference}
.has-directed-motion .impact::after{content:'';position:absolute;bottom:-1px;left:var(--gutter);right:var(--gutter);height:3px;background:var(--accent);transform:scaleX(var(--impact-rule,1));transform-origin:left}
@media(min-width:768px){.about .portrait-wrap{grid-column:2;grid-row:1 / span 2}.about-copy{margin-top:0}}
.leadership{display:block;padding-top:65px;border-top:1px solid var(--line)}
.leadership-heading{margin-bottom:45px}.leadership-heading h2{margin-bottom:0}.leadership-heading .editorial-accent{display:inline}
.leadership-detail{display:grid;grid-template-columns:1fr 1fr;gap:9%;margin-top:45px}.leadership-detail>p{padding-top:15px}.leadership-detail .career{margin-top:0}
@media(max-width:767px){
  .hero{min-height:620px;height:min(100svh,740px)}.hero__title{top:44%}
  .hero__video{top:44%}.hero-bottom{bottom:28px;gap:22px}
  .masthead-role{display:block;position:absolute;top:102px;left:var(--gutter);font-size:11px}
  .leadership-heading{margin-bottom:30px}.leadership-heading h2{font-size:clamp(39px,9vw,60px)}
  .leadership-detail{grid-template-columns:1fr;gap:30px;margin-top:30px}
}
@media(max-width:360px){.masthead nav{gap:12px}.nav-contact{padding:10px}.masthead nav a{white-space:nowrap}.wordmark{font-size:26px}}

/* Manifesto palette: each section borrows one act from MANIFESTO26.pdf.
   Coloured sections remap --muted/--line so existing rules keep working; tints pass 4.5:1. */
.work{position:relative;z-index:2;--muted:var(--ink);--line:#7a3400;background:var(--orange);color:var(--ink)}
.work :focus-visible{outline-color:var(--ink)}
/* Colour (Impeccable critique 8 Oct 2026, MANIFESTO26 Act 3): lime means "this one". Hover draws a
   thin lime underline that the open row's 65% marker replaces; no ink tint band (it went muddy).
   --line #7a3400 = 3.19:1 on orange (WCAG 1.4.11); --muted = ink (the brown tint added no hierarchy). */
.has-directed-motion .project:not([open]) .project-name{width:fit-content;background:linear-gradient(transparent 88%,var(--accent) 88%) no-repeat 0 0/0% 100%;transition:transform .45s cubic-bezier(.2,.7,.2,1),background-size .5s cubic-bezier(.2,.7,.2,1)}
.has-directed-motion .project:not([open]) summary:hover .project-name,.has-directed-motion .project:not([open]) summary:focus-visible .project-name{background-size:100% 100%}
/* work.js: the label wipes open (heynesh .label width 0 → auto), so keep it on one line. */
.work .section-heading .label{display:inline-block;overflow:hidden;white-space:nowrap;vertical-align:top}
.has-directed-motion .contact{--muted:#d6e1fc;--line:#5a8ff5;background:var(--cobalt)}
.contact .editorial-accent{color:var(--accent)}

/* Convictions: Legacy act 1 and People act 5 are cobalt; Trust teal; Thinking orange; Evolution lime. */
#tab-people,.manifesto-stage:has(#tab-people[aria-selected=true]){--act:var(--cobalt);--act-fg:var(--accent)}
#tab-trust,.manifesto-stage:has(#tab-trust[aria-selected=true]){--act:var(--teal);--act-fg:var(--accent)}
#tab-thinking,.manifesto-stage:has(#tab-thinking[aria-selected=true]){--act:var(--orange);--act-fg:var(--ink)}
#tab-evolution,.manifesto-stage:has(#tab-evolution[aria-selected=true]){--act:var(--accent);--act-fg:var(--teal)}
#tab-legacy,.manifesto-stage:has(#tab-legacy[aria-selected=true]){--act:var(--cobalt);--act-fg:var(--paper)}
.conviction-columns .conviction{color:var(--act-fg)}
@media(min-width:900px){
  .conviction-columns .manifesto-tabs button,.conviction-columns .manifesto-tabs button[aria-selected=true]{background:var(--act);color:var(--act-fg);border-right:0}
  .conviction-columns .manifesto-tabs button:focus-visible{outline-color:var(--act-fg)}
}
@media(max-width:899px){
  .conviction-columns{background:var(--act);color:var(--act-fg);transition:background-color .4s,color .4s}
  .conviction-columns .manifesto-tabs{border-bottom-color:var(--act-fg)}
  /* Pills follow the stage's active act, not their own. */
  .conviction-columns .manifesto-tabs button{--act:inherit;--act-fg:inherit;color:inherit}
  .conviction-columns .manifesto-tabs button[aria-selected=true]{background:var(--act-fg);color:var(--act)}
  .conviction-columns .manifesto-tabs button:focus-visible{outline-color:var(--act-fg)}
}

/* Room scene: Trust and Clarity take their manifesto colours, Room settles on ink. */

/* Cut-out conviction marks (convictions.js): solid shapes that act out each conviction. */
#tab-people,#tab-trust,#tab-evolution,#tab-legacy{--act-alt:var(--orange)}
#tab-thinking{--act-alt:var(--teal)}
.conviction-symbol .cut{fill:currentColor}.conviction-symbol .cut-alt{fill:var(--act-alt)}
.conviction-symbol svg{overflow:visible}
@media(min-width:900px){
  .conviction-symbol{top:120px;width:clamp(72px,7.6vw,124px);height:clamp(72px,7.6vw,124px);margin-left:calc(clamp(72px,7.6vw,124px) / -2);opacity:1}
  .conviction-columns button[aria-selected=true] .conviction-symbol{top:30px;right:30px;width:clamp(150px,15vw,230px);height:clamp(150px,15vw,230px)}
}

/* Sticker sheet replaces the target circle; stickers open convictions. */
.sticker-sheet{display:flex;flex-wrap:wrap;gap:6px 14px;margin:26px 0 40px}
.sticker{position:relative;display:block;width:78px;cursor:pointer;touch-action:manipulation}
.sticker-art{display:block;filter:drop-shadow(0 4px 5px rgb(0 0 0 / .2))}
.sticker svg{display:block;width:100%;height:auto;overflow:visible}
.sticker.is-active .sticker-art{filter:drop-shadow(0 12px 12px rgb(0 0 0 / .26))}
.sticker-ghost{display:none}
.sticker-sheet.is-loose{position:absolute;right:max(var(--gutter),calc(50% - 1000px + var(--gutter)));top:clamp(70px,8vw,130px);width:min(40%,520px);height:300px;margin:0;z-index:2}
.is-loose .sticker,.is-loose .sticker-ghost{position:absolute;left:0;top:0}
.is-loose .sticker{cursor:grab;touch-action:none;will-change:transform}
.is-loose .sticker.is-lifted{cursor:grabbing}
.is-loose .sticker.is-lifted .sticker-art{filter:drop-shadow(0 20px 18px rgb(0 0 0 / .3))}
.is-loose .sticker-ghost{display:block;pointer-events:none}
.sticker-ghost svg{display:block;width:100%;height:auto;overflow:visible}
.sticker-ghost .die>*{fill:rgb(255 255 255 / .12);stroke:rgb(255 255 255 / .12)}
@media(max-width:899px){.sticker-sheet{margin:26px 0 8px}.sticker{width:64px}}

.contact{position:relative}

/* Meet Barry (meet.js): name behind, person in front. Structure and values follow heynesh.com
   (research/heynesh/REVERSE-ENGINEERED.md): a fixed layer (name, portrait, stat cards) stays
   while the copy scrolls over it; the portrait blurs into a backdrop for the second screen. */
.meet{--pad:max(var(--gutter),calc(50% - 1000px + var(--gutter)));position:relative;padding:0;border:0}
/* The copy pulls up under the sticky layer (not the reverse), so the layer releases at the section end. */
/* Sticky only while meet.js's scroll blur runs (.is-live); without it (no JS, reduced motion) the
   copy would scroll over a sharp photo, so the first screen scrolls away as one piece instead. */
.meet-fixed{position:relative;top:0;height:100svh;min-height:680px;overflow:hidden;z-index:0}
.meet:has(.meet-journey.is-live) .meet-fixed{position:sticky}
.meet-flow{position:relative;z-index:1;margin-top:-100svh}
.meet-screen{position:relative;height:100svh;min-height:680px}
.meet-name{position:absolute;top:clamp(18px,3.5vh,44px);left:var(--pad);right:var(--pad);z-index:1;margin:0;text-align:center;white-space:nowrap;user-select:none;font:800 24vw/.8 var(--display);letter-spacing:-.05em;color:var(--accent)}
/* The inner box is the letter mask (heynesh: the SVG's own bounds) and travels during the intro. */
.meet-name-inner{display:inline-flex;overflow:hidden;padding-top:.04em}
.meet-name-inner>span{display:inline-block}
.meet-name-inner>span:last-child{letter-spacing:0}
.meet-portrait{position:absolute;left:50%;bottom:0;z-index:2;height:90%;transform:translateX(-50%)}
/* Fade the photo's cropped sides on the inner box so the scroll blur on the outer box spreads freely. */
.meet-portrait-in{height:100%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.meet-photo{display:block;height:100%;width:auto;max-width:none;overflow:visible}
.meet-stats{position:absolute;z-index:3;right:var(--pad);bottom:clamp(28px,5vh,56px);display:grid;gap:10px;margin:0;padding:0;list-style:none}
.meet-card{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;width:min(17vw,250px);padding:12px 16px;border-radius:10px;color:var(--paper);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 12px 28px rgb(11 11 11 / .16)}
.meet-card strong{font:600 clamp(34px,3vw,50px)/1 var(--display);letter-spacing:-.06em;color:var(--accent)}
.meet-card strong span{font-size:.5em;vertical-align:top}
.meet-card>span{font-size:12px;line-height:1.3}
.meet-card-teal{background:rgb(1 96 100 / .86)}
.meet-card-cobalt{background:rgb(0 80 236 / .86)}
.meet-card-orange{background:rgb(254 109 0 / .9);color:var(--ink)}.meet-card-orange strong{color:var(--ink)}
.meet-col{position:absolute;bottom:clamp(28px,5vh,56px);display:flex;flex-direction:column;gap:22px}
.meet-col-left{left:var(--pad);width:min(24vw,400px)}
.meet-heading{margin:0;font:500 clamp(36px,3.6vw,62px)/.96 var(--display);letter-spacing:-.05em}
.meet-line{display:block}
.meet-serif{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;letter-spacing:-.04em;line-height:1.08}
.meet-actions{display:flex;flex-wrap:wrap;gap:10px}
.meet-button{display:inline-flex;gap:14px;align-items:center;padding:13px 18px;border-radius:12px;background:var(--accent);color:var(--ink);font-size:14px;font-weight:600;text-decoration:none;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.meet-button:hover{transform:translateY(-2px)}
.meet-about{display:grid;min-height:100svh;padding:clamp(56px,9vh,96px) var(--pad) 80px}
.meet-about-copy{display:grid;gap:28px}
/* Desktop: card 1 shares the copy's row, top-right, as heynesh's first card sits beside its heading. */
.meet-journey.is-live{grid-area:1/1;margin-top:0}
/* Runway after the last card (heynesh .about-section padding-bottom 15vw) so '26 reaches mid-screen before Work slides over. */
.meet-about:has(.is-live){padding-bottom:max(15vw,45vh)}
.meet-about:has(.is-live) .meet-about-copy{grid-area:1/1;align-self:start;max-width:min(58%,860px);position:relative;z-index:2}
.meet-note{margin:0;font:500 clamp(18px,1.5vw,24px)/1.1 var(--display);letter-spacing:-.03em}
.meet-note span{color:var(--teal)}
.meet-lead{margin:0;max-width:18ch;font:500 clamp(42px,4.6vw,78px)/.98 var(--display);letter-spacing:-.05em}
.meet-right{display:grid;grid-template-columns:repeat(2,minmax(0,34ch));gap:12px 40px;font-size:16px;line-height:1.55}
.meet-right p{margin:0}
/* Journey (meet.js): heynesh "About Me (&) My Journey". Card 1 sits in flow at the right and the
   line starts at its bottom-right corner (dot 1); cards 2+ hang by a bottom corner from their dot
   (heynesh MagneticPositions). Card values from its webflow.css .about-card / -year / -heading. */
.meet-journey{display:flex;flex-direction:column;align-items:flex-end;margin-top:clamp(32px,4vw,64px)}
.meet-steps{display:grid;gap:14px;width:100%;margin:0;padding:0;list-style:none}
.meet-step-card{padding:clamp(18px,2.08vw,32px);border:1px solid rgb(255 255 255 / .4);border-radius:12px;background:rgb(243 243 238 / .78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 12px 28px rgb(11 11 11 / .1)}
.meet-step-year{display:flex;margin:0 0 6px;font:700 clamp(48px,4.4vw,80px)/1 var(--display);letter-spacing:-.05em;color:var(--teal)}
.meet-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.meet-step-year [data-year]{display:flex}.meet-digit{display:block;height:1em;overflow:hidden}.meet-digit-track{display:block}.meet-digit-track>span{display:block;height:1em}
.meet-step-title{margin:0 0 6px;font:500 clamp(20px,1.67vw,30px)/1.1 var(--display);letter-spacing:-.03em}
.meet-step-text{margin:0 0 14px;font-size:15px;line-height:1.5}
.meet-step-meta{margin:0;font-size:12px;line-height:1.4;color:var(--muted)}
.meet-journey-track{display:none}
.meet-journey.is-live .meet-steps{display:block;position:relative}
.meet-journey.is-live .meet-step{position:absolute;top:0;left:0;width:clamp(340px,29.58vw,560px);z-index:1}
.meet-journey.is-live .meet-step:first-child{position:relative;margin-left:auto}
.meet-journey.is-live .meet-step-card{transform-origin:50% 100%}
.meet-journey.is-live .meet-journey-track{display:block;position:relative;width:100%}
.meet-journey-line{position:absolute;top:0;left:0;right:0;height:0;overflow:hidden}
.meet-journey-line svg{display:block;width:100%}
.meet-journey-line path{fill:none;stroke:var(--ink);stroke-width:2;vector-effect:non-scaling-stroke;opacity:.6}
.meet-journey-dots{display:block;width:100%;height:auto;overflow:visible}
.meet-journey-dots circle{fill:var(--accent);stroke:var(--ink);stroke-width:2;opacity:0}
@media(max-width:899px){
  .meet{display:flex;flex-direction:column;padding:56px var(--pad) 64px}
  .meet-fixed{position:relative;height:auto;min-height:0;overflow:visible;display:flex;flex-direction:column}
  .meet-flow{margin-top:0}
  .meet-name{position:relative;top:auto;left:auto;right:auto;font-size:25vw}
  .meet-portrait{position:relative;left:auto;bottom:auto;transform:none;height:auto;width:min(100%,520px);align-self:center;margin-top:-14vw}
  .meet-portrait-in,.meet-photo{height:auto;width:100%}
  .meet-stats{position:relative;left:auto;top:auto;right:auto;bottom:auto;grid-template-columns:repeat(3,1fr);margin-top:-48px}
  .meet-card{width:auto;grid-template-columns:1fr;gap:6px;padding:12px}
  .meet-card strong{font-size:34px}
  .meet-screen{height:auto;min-height:0}
  .meet-col{position:relative;bottom:auto;left:auto;right:auto;width:auto;margin-top:30px}
  .meet-heading{font-size:clamp(40px,11vw,60px)}
  .meet-about{grid-template-columns:1fr;min-height:0;padding:44px 0 0;gap:20px}
  .meet-about-copy{gap:20px}
  .meet-journey{margin-top:12px}
  .meet-lead{font-size:clamp(34px,9vw,52px)}
  .meet-right{grid-template-columns:1fr;font-size:15px}
}
@media(max-width:520px){.meet-stats{grid-template-columns:1fr}.meet-card{grid-template-columns:auto 1fr;gap:14px}}

/* Goo (research/gooey): shared filters live in index.html. */
.goo-defs{position:absolute;width:0;height:0;overflow:hidden}

/* "felt." is the emotion: it beats, and each beat ripples through the heading (felt.js). */
.has-directed-motion .manifesto-intro h2{position:relative;z-index:1}
.manifesto-intro .felt{position:relative;display:inline-block;transform:rotate(-5deg);background:none;padding:.12em .32em .2em;margin-left:.04em;line-height:1}
.felt-patch{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:0;pointer-events:none}
.felt-fill{fill:var(--accent)}
.felt-word{position:relative;z-index:1;display:inline-block;font-family:'Oi',serif;font-weight:400;font-size:.64em;letter-spacing:0;color:var(--ink)}
.felt-ripple-char{display:inline-block;will-change:transform}
.felt-rings{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:0}
.felt-ring{fill:none;stroke:var(--accent);stroke-linejoin:round}


/* Leadership (leadership.js): "Give them trust / clarity / room" as rings of Oi type orbiting Barry.
   Each new word bursts from his head like an idea, falls into orbit (behind his head, in front of
   his chest), then blows away for the next. TRIONN headline burst + Made With GSAP letter orbit
   (research/wda-gsap/); scroll stops after OnePROM fly-v2. Concept: concepts/leadership/type.html.
   Without JS or with reduced motion: the three chapters as a still list beside the photo. */
.orbit-stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:end;overflow:hidden;background:var(--teal);color:var(--paper)}
.orbit-barry{grid-column:2;grid-row:1;display:block;width:100%;height:auto;max-height:620px;object-fit:contain;object-position:bottom}
.orbit-copy{grid-column:1;grid-row:1;align-self:center;display:grid;gap:34px;margin:0;padding:48px 7%;list-style:none}
.leadership p.orbit-phrase{max-width:none;color:inherit;margin:0;font:600 clamp(30px,3.4vw,52px)/1 var(--display);letter-spacing:-.04em}
.orbit-phrase strong{display:block;font:400 1.15em/1.05 Oi;color:var(--accent);letter-spacing:-.02em}
.leadership p.orbit-note{margin:12px 0 0;max-width:36ch;font-size:16px;line-height:1.45;color:rgb(243 243 238 / .88)}
.orbit-ring,.orbit-hud{display:none}
.orbit.is-live{height:var(--len,600vh)}
.orbit.is-live .orbit-stage{position:sticky;top:0;display:block;height:100vh;height:100svh}
.orbit.is-live .orbit-barry{position:absolute;left:50%;bottom:0;z-index:2;width:auto;height:86%;max-width:none;max-height:none;transform:translateX(-50%);pointer-events:none}
.orbit.is-live .orbit-ring{display:block;position:absolute;inset:0;pointer-events:none}
.orbit-back{z-index:1}.orbit-front{z-index:3}
.orbit-ring span{position:absolute;left:0;top:0;font:400 clamp(44px,7.4vw,136px)/1 Oi;white-space:pre;will-change:transform,opacity}
.orbit.is-live .orbit-copy{display:block;padding:0}
.orbit.is-live .orbit-chapter{position:absolute;inset:8vh 5vw 9vh;z-index:4;display:flex;flex-direction:column;justify-content:space-between;opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s;pointer-events:none}
.orbit.is-live .orbit-chapter.is-on{opacity:1;transform:none}
.leadership .orbit.is-live p.orbit-phrase{font-size:clamp(26px,3vw,48px)}
.orbit.is-live .orbit-phrase strong{display:inline}
.leadership .orbit.is-live p.orbit-note{max-width:30ch;font-size:17px}
.orbit.on-lime .orbit-stage{color:var(--ink)}
.orbit.on-lime .orbit-phrase strong{color:var(--cobalt)}
.leadership .orbit.on-lime p.orbit-note{color:rgb(11 11 11 / .86)}
.orbit.is-live .orbit-hud{position:absolute;right:3vw;top:50%;z-index:9;transform:translateY(-50%);display:grid;justify-items:center;gap:12px;color:#fff;mix-blend-mode:difference}
.orbit-hud b{font:600 13px/1 var(--body,inherit);font-variant-numeric:tabular-nums}
.orbit-bar{display:block;width:2px;height:28vh;background:rgb(255 255 255 / .25);overflow:hidden}
.orbit-bar i{display:block;height:100%;background:#fff;transform-origin:top;transform:scaleY(0)}
@media(max-width:899px){
  .orbit-stage{grid-template-columns:1fr}
  .orbit-barry{grid-column:1;grid-row:2;justify-self:center;width:min(86%,420px)}
  .orbit-copy{padding:32px 22px;gap:26px}
  .orbit.is-live .orbit-barry{width:auto;height:72%}
  .orbit.is-live .orbit-chapter{inset:6vh 22px 6vh}
  /* On phones the note sits over his shirt: back it with the stage colour. */
  .leadership .orbit.is-live p.orbit-note{align-self:flex-start;padding:10px 12px;border-radius:10px;background:var(--orbit-bg,var(--teal));font-size:15px}
  .orbit.is-live .orbit-hud{display:none}
}
/* Leadership, live: one continuous piece. The orbit runs full bleed; the heading opens the stage
   on paper; the stage ends on lime and the career detail continues that lime below it. */
.leadership:has(.orbit.is-live){padding-top:0;padding-bottom:0;border-top:0}
.orbit.is-live{margin-inline:calc(50% - 50vw)}
.orbit.is-live .leadership-heading{position:absolute;left:var(--gutter);top:clamp(70px,12vh,140px);z-index:5;margin:0;color:var(--ink);pointer-events:none;will-change:opacity,transform}
.orbit.is-live .leadership-heading h2{font-size:clamp(34px,3.6vw,62px)}
.orbit.is-live + .leadership-detail{margin:0 calc(50% - 50vw);padding:clamp(60px,8vw,120px) var(--gutter) clamp(70px,9vw,150px);background:var(--accent);color:var(--ink);align-items:start}
.leadership .orbit.is-live + .leadership-detail>p{max-width:30ch;padding-top:0;color:var(--ink);font:500 clamp(22px,2.1vw,32px)/1.25 var(--display);letter-spacing:-.02em}
.orbit.is-live + .leadership-detail .career p{border-top-color:rgb(11 11 11 / .25);color:var(--ink)}
.orbit.is-live + .leadership-detail .career span{color:rgb(11 11 11 / .7)}
/* The photo's cut edge: the lime career block rises as a hill over the stage's bottom, so Barry
   sinks behind it instead of ending on a hard line; the curve flattens as it rises (Made With GSAP's
   curved section edge, research/wda-gsap/aw-madewithgsap.png 33-35s). --dome set by leadership.js. */
.orbit.is-live + .leadership-detail{position:relative;z-index:6}
.orbit.is-live + .leadership-detail::before{content:'';position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:26vh;background:inherit;border-radius:50% 50% 0 0 / 100% 100% 0 0;transform-origin:50% 100%;transform:scaleY(var(--dome,1));pointer-events:none}
.orbit.is-leaving .orbit-chapter.is-on{opacity:0;transform:translateY(-12px)}
/* iOS draws the "↗" arrow as an emoji; U+FE0E in the markup asks for text, this backs it up. */
a span[aria-hidden="true"]{font-variant-emoji:text}
/* Phones: the open conviction's looping mark sits in the panel's empty lower right, in the act's
   foreground colour (the pill it lives in is hidden behind its own fill otherwise). */
@media(max-width:899px){
  .conviction-columns{position:relative}
  .conviction-columns .manifesto-tabs button{position:static}
  .conviction-columns button[aria-selected=true] .conviction-symbol{display:block;position:absolute;top:auto;left:auto;right:24px;bottom:28px;width:min(38vw,170px);height:min(38vw,170px);margin:0;opacity:1;color:var(--act-fg);pointer-events:none}
}
/* Short landscape phones: the hero title fills the height and runs into the tagline. */
@media(orientation:landscape) and (max-height:500px){.masthead-role{display:none}}