/* labels only: a one-glyph face whose capital A has no crossbar (Inter Tight's lambda); the text stays a real A */
@font-face{font-family:'JS Label A';src:url(../assets/InterTight-A.woff2) format('woff2');font-weight:100 900;unicode-range:U+0041}
:root{
  --sec-top:100px; --sec-bot:clamp(80px,8vw,120px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2.2' intercept='-.6'/%3E%3CfeFuncG type='linear' slope='2.2' intercept='-.6'/%3E%3CfeFuncB type='linear' slope='2.2' intercept='-.6'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --paper:#F3F2EF; --ink:#1C1B19; --mute:#8D8B86; --line:rgba(28,27,25,.12);
  --coral:#FF502E;
  --g:clamp(18px,4vw,80px);
  --sans:'Inter Tight',system-ui,sans-serif; --mono:'JS Label A','Inter Tight',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{position:relative;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.mono{font-family:var(--mono);font-weight:600;font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.label{color:var(--coral);margin-bottom:28px}
h2{font-weight:900;font-size:clamp(40px,6.2vw,108px);line-height:.92;letter-spacing:-.045em}
h2 span{color:var(--mute)}
.placeholder{color:var(--coral)}

/* GRID: vertical column lines on the hero only, 12 on desktop, 4 on phone */
.grid{position:absolute;z-index:1;inset:0 var(--g);pointer-events:none;display:flex;justify-content:space-between}
.grid i{width:1px;height:100%;background:rgba(128,128,124,.22);transform-origin:top}

/* GRAIN: one static film grain sheet laid over the whole page, scrolls with it */
.grain{position:absolute;z-index:100;inset:0;pointer-events:none;opacity:.26;
  background-image:var(--grain)}

/* LOADER: the screen starts coral and shrinks into the full stop */
.loader{position:fixed;inset:0;z-index:90;background:var(--coral);clip-path:circle(150% at 50% 50%)}
.loader__count{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-weight:800;font-size:clamp(28px,2.6vw,44px);line-height:1;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.loader__count::after{content:'%'}
.veil{position:fixed;inset:0;z-index:85;background:var(--paper);opacity:.55;pointer-events:none}
.flydot{position:fixed;z-index:95;left:0;top:0;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;background:var(--coral);opacity:0;pointer-events:none}
.no-loader .loader,.no-loader .veil,.no-loader .flydot{display:none}

/* NAV */
.nav{position:fixed;z-index:50;top:0;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:40px;padding:22px var(--g);background:var(--paper)}
.nav.solid{background:var(--paper)}
.nav__grid{z-index:-1}
@media (min-width:761px){.hero__portrait{top:93px;bottom:auto}
  .about .about__l1{padding-left:0}
  .about .about__l2{padding-right:0;padding-left:1.6em}}
.nav__name{font-size:14px}
.nav__tag{text-align:center}
.nav .btn{justify-self:end}
.nav .btn.fit{justify-content:center;padding-left:0;padding-right:0;gap:10px}
.btn{display:inline-flex;align-items:center;gap:14px;padding:16px 26px;position:relative;overflow:hidden;isolation:isolate}
.btn--ink{background:var(--ink);color:#fff}
.btn::before{content:"";position:absolute;inset:0;background:var(--coral);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.7,0,.2,1);z-index:-1}
.btn:hover::before{transform:scaleX(1)}
.btn .arrow{transition:transform .3s}
.btn:hover .arrow{transform:translateX(4px)}

/* HERO */
.hero{position:relative;min-height:100vh;min-height:100svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:0 var(--g);overflow:hidden}
.hero__copy{position:relative;display:flex;flex-direction:column;justify-content:center;padding-top:110px;padding-bottom:calc(134px + clamp(36px,8vh,90px))}   /* keeps the headline where it sat when the tagline was below it */
.hero__kick{position:absolute;top:max(calc(26vh - 100px),115px);left:0;font-weight:500;font-size:clamp(24px,2.6vw,44px);letter-spacing:-.02em}
.hero__line{position:relative;margin-top:clamp(28px,7vh,80px);top:7vh;font-weight:900;font-size:clamp(64px,10.4vw,190px);line-height:.86;letter-spacing:-.035em}
/* the headline inverts where it crosses the portrait: difference blend, colour chosen so it reads as off-black on the paper */
.hero__line .row{position:relative;z-index:3;display:block;width:max-content;overflow:hidden;padding:.06em .12em .22em .04em;margin:-.06em -.12em -.22em -.04em;color:#31302E}
/* paper-coloured copy cut to the tee, so the line goes fully light where it crosses it */
.tee{position:absolute;top:0;left:0;width:max-content;height:calc(100% + .4em);z-index:4;pointer-events:none;-webkit-mask:url(../assets/james-tee-mask.png?v=1793943619) no-repeat;mask:url(../assets/james-tee-mask.png?v=1793943619) no-repeat}
.hero__line .tee .row{color:var(--paper);mix-blend-mode:normal;opacity:1}
.hero__line .w{display:inline-block}
.dotslot{display:inline-block;width:.2em;height:.2em;margin-left:.045em;vertical-align:baseline}
.dot{position:fixed;z-index:6;left:0;top:0;border-radius:50%;background:var(--coral);pointer-events:none}
.hero__foot{margin-top:clamp(36px,8vh,90px);position:relative;top:7vh}
.rule{display:block;width:48px;height:3px;background:var(--ink);margin-bottom:28px}
.hero__foot p{line-height:1.7;font-size:13px}
.hero__visual{position:absolute;right:0;bottom:0;width:62%;height:100%;z-index:2;pointer-events:none}
.hero__portrait{position:absolute;right:auto;left:19.35%;translate:-50% 0;bottom:0;height:min(92vh,96%);width:auto;max-width:none;filter:contrast(1.05)}
.hero__block{position:absolute;left:9%;right:0;bottom:0;height:calc(28% - 20px);background:var(--coral);mix-blend-mode:multiply;transform-origin:bottom}
.hero__go{position:absolute;left:9%;bottom:7%;width:78px;height:78px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:30px;pointer-events:auto;overflow:hidden;z-index:3}
.hero__go span{transition:transform .4s}
.hero__go:hover span{transform:translateY(6px)}
.hero__list{position:absolute;z-index:4;right:var(--g);top:calc(19vh - 15px);list-style:none;padding-left:20px;border-left:3px solid #DAD9D6;display:flex;flex-direction:column;gap:14px;font-size:14px}   /* grid line grey, solid so the line under it does not show through */
.hero__list li{transition:color .3s}
.hero__list li.on{color:var(--coral)}
.hero__marker{position:absolute;left:-3px;top:0;width:3px;height:18px;background:var(--coral);transition:transform .45s cubic-bezier(.7,0,.2,1)}

/* PROBLEM */
.problem{position:relative;min-height:100vh;display:flex;align-items:center;padding:0 var(--g);color:var(--ink)}
.problem__fill{position:absolute;inset:0;background:var(--coral);transform-origin:bottom;z-index:-1}
.problem .label{color:var(--ink)}
.fillword{color:var(--ink)}
.fillword.soft{color:var(--paper)}
.problem__line{letter-spacing:-.025em;margin-top:30px}
.problem__body{margin-top:clamp(30px,2.8vw,46px);max-width:60ch;font-size:clamp(17px,1.4vw,22px);line-height:1.45;font-weight:500}
.problem__body p+p{margin-top:28px}
.problem__inner{display:flex;flex-direction:column;min-height:100vh}
.problem__judge{margin-top:clamp(48px,5.2vw,84px)}
.problem__inner{width:100%;padding:var(--sec-top) 0 var(--sec-bot)}
.problem__judge{font-size:clamp(32px,3.6vw,62px);line-height:1;font-weight:900;letter-spacing:-.025em}
.problem__judge span{color:var(--paper)}
.problem__sign{margin-top:clamp(24px,2.6vw,40px);font-size:clamp(13px,1.15vw,17px);letter-spacing:.12em}

/* REASONS */
.reasons{position:relative}
.reasons__pin{min-height:100vh;display:grid;grid-template-columns:5fr 6fr;gap:var(--g);align-items:center;padding:120px var(--g) 80px}
.reasons__levers{list-style:none;margin-top:48px;border-top:1px solid var(--line)}
.reasons__levers li{display:flex;gap:22px;padding:18px 0;border-bottom:1px solid var(--line);color:var(--mute);transition:color .3s}
.reasons__levers li b{font-weight:700}
.reasons__levers li.on{color:var(--ink)}
.reasons__levers li.on b{color:var(--coral)}
.ad{position:relative;aspect-ratio:4/5;max-height:80vh;overflow:hidden;background:#222;justify-self:end;width:100%;max-width:640px}
.ad img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ad::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),transparent 50%)}
.ad__head{position:absolute;z-index:2;left:7%;right:7%;top:6%;color:#fff;font-weight:900;font-size:clamp(30px,3.6vw,60px);line-height:.95;letter-spacing:-.04em}
.ad__tag{position:absolute;z-index:2;left:7%;bottom:5%;color:#fff}
.ad__note{position:absolute;z-index:2;right:7%;bottom:5%;color:rgba(255,255,255,.7);font-size:10px}

/* SECTIONS */
.work,.pillars,.caps{padding:var(--sec-top) var(--g) var(--sec-bot);border-top:1px solid var(--line)}
h3{font-weight:800;letter-spacing:-.03em}

/* WORK */
.wdot{display:inline-block;width:.19em;height:.19em;margin-left:.045em;border-radius:50%;background:var(--coral);vertical-align:baseline}
.work{padding-top:0;padding-bottom:40px}   /* below the pinned panel, so it adds real space before Why me */
.work__pin{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-start;padding-top:var(--sec-top);overflow-x:clip;overflow-y:visible}   /* clip sideways for the track, not upwards, so the falling dot is never cut */
.work__intro{margin-bottom:clamp(28px,3.5vw,56px)}
/* projects run sideways: the track moves left as you scroll, each image drifts inside its frame */
.work__track{display:flex;gap:var(--g);width:max-content;will-change:transform}
.project{flex:0 0 calc(100vw - 2 * var(--g));display:grid;grid-template-columns:7fr 5fr;gap:var(--g);align-items:end}
.project--flip{grid-template-columns:5fr 7fr}.project--flip .project__media{order:2}
.project__media{aspect-ratio:16/10;background:#E6E4DF;overflow:hidden;position:relative}
.project__img{position:absolute;inset:0 -12%;display:grid;place-items:center;color:var(--mute);background:linear-gradient(90deg,#E3E1DC,#ECEAE5 50%,#E3E1DC);will-change:transform}
.project__n{color:var(--coral)}
.project h3{font-size:clamp(36px,4.4vw,76px);line-height:.95;margin:14px 0 16px}
.project__line{font-size:clamp(19px,1.6vw,26px);font-weight:500;line-height:1.3;max-width:24ch}
.project__tags{margin-top:22px;color:var(--mute);font-size:11px}
.project .placeholder{margin-top:18px;font-size:15px}

/* PILLARS */
.pillars__title{white-space:nowrap}
.pillars{background:var(--ink);color:var(--paper);border-top:0;padding-bottom:calc(var(--sec-bot) + 100px)}
.pillars__title .x{color:var(--paper)}
.pillars__title .op{display:inline-block;color:var(--coral);font-weight:700;transform-origin:50% 54%}
.pillars__title.multiplied .op{transform:rotate(45deg)}
.pillars__row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:130px}
.pillars__row article{border-top:3px solid var(--paper);padding-top:22px}
.pillars__row b{color:var(--coral);font-weight:700}
.pillars__row h3{font-size:clamp(24px,2.1vw,34px);line-height:1.05;margin:0 0 14px}
.pillars__row p,.caps__list p{font-size:17px;line-height:1.45;color:#3a3a38;max-width:32ch}
.pillars__row p{color:#B9B6AF}
.judgement{margin-top:clamp(90px,12vw,180px);background:var(--ink);color:var(--paper);padding:clamp(48px,6vw,96px)}
.judgement h3{font-size:clamp(34px,4.4vw,76px);line-height:.95;font-weight:900;letter-spacing:-.045em}
.judgement h3 span{color:var(--coral)}
.judgement p{margin-top:28px;font-size:clamp(17px,1.4vw,21px);line-height:1.5;max-width:52ch;color:#cfcdc8}

/* CAPABILITIES */
/* over the list the pointer becomes the coral dot */
.cursor-dot{position:fixed;z-index:120;left:0;top:0;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:var(--coral);pointer-events:none;transform:scale(0);will-change:transform}
@media (hover:hover) and (pointer:fine){.caps__list,.caps__list *{cursor:none}}
.caps__list{list-style:none;margin-top:72px;border-top:1px solid var(--ink)}
.caps__list li{display:grid;grid-template-columns:80px 1fr 1fr;gap:24px;align-items:baseline;padding:28px 0;border-bottom:1px solid var(--line);transition:padding .35s,background .35s}
.caps__list li:hover{padding-left:18px;background:rgba(255,80,46,.06)}
.caps__list span{color:var(--coral)}
.caps__list h3{font-size:clamp(26px,3vw,50px);line-height:1}

/* ABOUT */
.about{border-top:1px solid var(--line)}
/* full-bleed photo under a warm dark wash; two offset lines of huge paper-coloured type slide across */
.about__stage{position:relative;height:100vh;min-height:640px;overflow:hidden;background:var(--ink);color:var(--paper)}
.about__bg{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;object-position:50% 45%;will-change:transform}
.about__wash{position:absolute;inset:0;background:
  radial-gradient(120% 90% at 40% 45%,transparent 30%,rgba(28,27,25,.75) 100%),
  rgba(28,27,25,.22);mix-blend-mode:normal}
.about__label{position:absolute;z-index:2;left:var(--g);top:var(--sec-top);color:var(--coral)}
.about__big{position:absolute;z-index:2;left:0;right:0;top:30%;white-space:nowrap;color:var(--paper)}
.about__big > span{display:block}
.about__big span{color:var(--paper)}
.about__l1{padding-left:var(--g)}
.about__l2{text-align:right;padding-right:var(--g)}
.about__big .ghost{opacity:.45}
.about__sub{position:absolute;z-index:2;left:var(--g);right:var(--g);top:72%;text-align:center;font-size:clamp(22px,2.4vw,40px);font-weight:600;letter-spacing:-.02em}
.about__foot{position:absolute;z-index:2;left:var(--g);right:var(--g);top:calc(72% + clamp(56px,6vw,90px));text-align:center}
.about__foot .about__path{color:var(--paper)}
.about__foot .about__copy{margin-top:0;font-size:clamp(16px,1.3vw,20px);color:var(--paper)}
.about__foot .placeholder{color:var(--coral)}
.about__path{margin-top:0;font-size:clamp(12px,1.1vw,15px);line-height:2}
.about__path i{color:var(--coral);font-style:normal;padding:0 8px}
.about__copy{margin-top:36px;font-size:clamp(20px,1.8vw,28px);max-width:40ch;line-height:1.35;font-weight:500}

/* CONTACT */
.contact{background:var(--ink);color:var(--paper);padding:var(--sec-top) var(--g) var(--sec-bot)}
.send{margin-top:72px;display:grid;grid-template-columns:1fr 1fr;gap:28px 24px;max-width:980px}
.send__title{grid-column:1/-1;color:var(--coral);font-size:14px}
.send label{display:flex;flex-direction:column;gap:10px}
.send label.wide{grid-column:1/-1}
.send label span{color:#8d8b86;font-size:11px}
.send input,.send textarea{background:transparent;border:0;border-bottom:1px solid rgba(243,242,239,.3);color:var(--paper);font:500 clamp(18px,1.5vw,22px)/1.3 var(--sans);padding:10px 0;outline:none;resize:vertical}
.send input:focus,.send textarea:focus{border-color:var(--coral)}
.send .btn--big{justify-self:start;margin-top:12px;border:0;cursor:pointer}
.contact h2 span{color:var(--coral)}
.btn--big{margin-top:56px;background:var(--paper);color:var(--ink);font-size:clamp(13px,1.2vw,16px);padding:22px 32px}
.btn--big::before{background:var(--coral)}
.foot{display:flex;justify-content:space-between;gap:20px;padding:28px var(--g);background:var(--ink);color:#8d8b86;border-top:1px solid rgba(255,255,255,.1);font-size:11px}

/* PHONE */
@media (max-width:760px){
  .grid i:not(:nth-child(3n+1)){display:none}
  .nav{grid-template-columns:1fr auto;gap:12px;padding:16px var(--g)}
  .nav__tag{display:none}
  .nav .btn{padding:12px 14px;font-size:10px}
  .hero{display:flex;flex-direction:column;min-height:100vh;min-height:100svh;padding-bottom:0;--ph:min(172.3vw,calc(100svh - 140px));--vis:var(--ph)}   /* fills the phone screen; extended photo sits on the bottom edge, a touch smaller on short phones so it always shows whole */
  .hero__copy{display:contents}   /* lets the headline drop below the photo */
  .hero__kick{position:static;order:1;margin-top:96px}
  .hero__line{order:3;z-index:3;margin:calc(-1.78em - 22px) 0 22px}   /* foot of the screen, left aligned; the tee mask flips it to paper where it crosses him */
  .hero__visual{order:2;margin-top:auto!important}
  .hero__line,.hero__foot{top:0}
  .hero__line{font-size:clamp(40px,12.6vw,90px)}
  .hero__foot{margin-top:28px}
  .hero__visual{position:relative;width:auto;height:var(--vis);margin:24px calc(-1*var(--g)) 0}
  .hero__portrait{left:80%;top:0;bottom:auto;height:var(--ph)}   /* phone cut, AI extended below the arms; pushed right so the face bleeds off the edge */
  .tee{-webkit-mask-image:url(../assets/james-tee-mask-m.png?v=2);mask-image:url(../assets/james-tee-mask-m.png?v=2)}
  .hero__block{left:50%;top:calc(var(--ph)*.3657);bottom:0;height:auto}   /* coral box comes in from the right edge and stops on the middle grid line (3 lines in), runs to the bottom of the screen */
  .hero__go{left:50%;top:calc(var(--ph)*.3657);bottom:auto;width:58px;height:58px;font-size:22px}   /* sits on the box's top left corner */
  .hero__list{top:150px;right:auto;left:var(--g);gap:12px;font-size:13px}   /* phone: left side, under the kicker, bar on the first grid line */
  .reasons__pin{grid-template-columns:1fr;padding-top:80px}
  .ad__note{display:none}
  .project,.project--flip{grid-template-columns:1fr;align-items:start}.project--flip .project__media{order:0}   /* phone: pinned sideways run like desktop, one project per screen */
  .pillars__title{white-space:normal}
  .pillars__row{grid-template-columns:1fr;gap:36px}
  .caps__list li{grid-template-columns:44px 1fr}.caps__list li p{grid-column:2}
  .send{grid-template-columns:1fr}
  .foot{flex-direction:column}
  .about__big{top:34%;white-space:normal}.about__l2{text-align:left;padding-left:var(--g)}
  .about__sub{top:60%;padding:0 var(--g)}
    .about__foot{position:absolute;z-index:2;left:var(--g);right:var(--g);top:calc(72% + clamp(56px,6vw,90px));text-align:center}.about__foot .about__path{font-size:10px;line-height:1.8}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Your move: the header CTA opens this */
.move{border:0;padding:0;margin:auto;background:var(--paper);color:var(--ink);width:min(620px,calc(100vw - 32px));max-width:none;max-height:calc(100vh - 32px);overflow:auto}
.move::backdrop{background:rgba(28,27,25,.62)}
.move[open]{animation:moveIn .55s cubic-bezier(.2,.8,.2,1)}
.move[open]::backdrop{animation:moveFade .4s ease}
@keyframes moveIn{from{opacity:0;transform:translateY(28px)}}
@keyframes moveFade{from{opacity:0}}
.move__form{display:grid;gap:30px;padding:clamp(32px,4.5vw,60px)}
.move__title{font-size:clamp(34px,3.6vw,54px);line-height:.95;padding-right:32px}
.move__lead{font-size:clamp(17px,1.3vw,19px);line-height:1.4;margin-top:-10px}
.move label{display:flex;flex-direction:column;gap:10px}
.move label span{color:var(--mute);font-size:11px}
.move input{background:transparent;border:0;border-bottom:1px solid rgba(28,27,25,.25);border-radius:0;color:var(--ink);font:500 20px/1.3 var(--sans);padding:10px 0;outline:none}
.move input:focus{border-color:var(--coral)}
.move .btn{justify-self:start;border:0;cursor:pointer;margin-top:6px}
.move__note{font-style:italic;color:var(--mute);font-size:15px}
.move__x{position:absolute;top:14px;right:14px;width:44px;height:44px;border:0;background:none;color:var(--ink);font:300 30px/1 var(--sans);cursor:pointer;transition:color .2s,transform .3s}
.move__x:hover{color:var(--coral);transform:rotate(90deg)}
@media (prefers-reduced-motion: reduce){.move[open],.move[open]::backdrop{animation:none}}

/* About: content in normal flow. Heading left, a two column row (lead with coral bar | bio), path between rules, angle centred */
.about .about__stage{height:auto;min-height:0;display:flex;flex-direction:column;align-items:stretch;padding:calc(var(--sec-top) + 60px) var(--g) 72px}
.about .about__big,.about .about__sub,.about .about__foot{position:relative;top:auto;left:auto;right:auto}
.about .about__big{width:max-content;margin-left:11%}
.about__row{position:relative;z-index:2;display:flex;align-items:stretch;margin-top:96px}
.about__lead{border-left:4px solid var(--coral);padding:4px 0 4px 32px}
.about .about__sub{margin:0;padding:0;text-align:left;font-size:clamp(24px,2.5vw,42px);font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--paper)}
.about__sub2{margin-top:10px;font-size:clamp(18px,1.6vw,28px);font-weight:400;letter-spacing:-.01em;line-height:1.25;color:rgba(243,242,239,.85)}
.about__bio{margin-left:44px;padding-left:38px;border-left:1px solid rgba(243,242,239,.45);max-width:calc(42ch + 38px);font-size:clamp(16px,1.2vw,20px);line-height:1.5;color:rgba(243,242,239,.9);align-self:stretch;display:flex;align-items:center}
.about .about__foot{margin-top:84px;display:flex;align-items:center;gap:36px;text-align:center}
.about .about__foot::before,.about .about__foot::after{content:"";flex:1;height:1px;background:rgba(243,242,239,.6)}
.about .about__foot .about__path{white-space:nowrap}
.about .about__angle{position:relative;z-index:2;margin-top:72px;text-align:center;color:var(--paper);white-space:nowrap}
.about .about__angle span{color:var(--coral)}
@media (max-width:760px){
  .about .about__stage{padding:calc(var(--sec-top) + 40px) 0 56px}
  .about .about__big{width:auto;margin-left:0}
  .about__row{flex-direction:column;margin:48px var(--g) 0}
  .about__lead{padding-left:20px}
  .about__bio{margin:28px 0 0;padding:0;border-left:0;max-width:none}
  .about .about__foot{margin:40px var(--g) 0;gap:0}
  .about .about__foot::before,.about .about__foot::after{display:none}
  .about .about__foot .about__path{white-space:normal}
  .about .about__angle{margin-top:48px;padding:0 var(--g);text-align:left;white-space:normal}
}
@media (max-width:760px){br.d-only{display:none}}