/* Content-led sizing keeps the profile link inside the hero on short screens. */
.hero.hero--standalone{display:grid;grid-template-columns:minmax(0,1fr) clamp(260px,35vw,620px);align-items:stretch;height:auto;min-height:max(620px,100svh);padding:0;overflow:hidden}
.hero--standalone .intro{grid-column:1;grid-row:1;width:100%;height:auto;min-height:max(620px,100svh);padding:clamp(40px,7svh,80px) clamp(28px,5.2vw,96px) clamp(32px,5svh,64px);display:flex;flex-direction:column}
.hero--standalone h1{font-size:clamp(62px,min(9.1vw,17svh),160px);line-height:1.02}
.hero--standalone .role{font-size:clamp(11px,1.05vw,18px);margin-top:clamp(16px,3svh,28px)}
.hero--standalone .location{font-size:clamp(10px,.85vw,16px)}
.hero--standalone .copyright{margin-top:clamp(16px,3svh,24px);font-size:clamp(9px,.7vw,12px);color:#777}
.hero--standalone .hero-quote-space{min-height:100px;padding:clamp(24px,4svh,44px) 0;max-width:none;flex:1}
.hero--standalone .hero-quote{white-space:normal;font-size:clamp(26px,2.65vw,50px);line-height:1.2}
.hero--standalone .linkedin{position:relative;z-index:4;display:inline-flex;visibility:visible;min-height:52px;padding:15px 24px;font-size:12px;border-color:#a38660;background:#0a0907;max-width:100%}
.hero--standalone .portrait{grid-column:2;grid-row:1;position:relative;order:0;align-self:end;width:100%;height:min(88svh,940px);min-height:520px;right:auto;bottom:auto;opacity:1;transform-origin:center center;will-change:transform,opacity}
.hero--standalone .portrait img{animation:none;object-fit:cover;object-position:50% 0}
.hero--standalone .intro-logo{display:none}.intro-hello{display:none}
.intro-pending .hero .intro-logo,.hero.intro-playing .intro-logo{display:flex;position:absolute;inset:0;z-index:8;background:#000;align-items:center;justify-content:center;flex-direction:column;gap:28px;pointer-events:none}
.logo-reveal{position:relative;width:clamp(150px,21vw,340px);overflow:hidden;animation:logo-arrive 1.1s cubic-bezier(.22,1,.36,1) both}
.logo-reveal img{display:block;width:100%;height:auto}
.logo-glint{position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#fff8 48%,transparent 70%);transform:translateX(-120%);mix-blend-mode:overlay;animation:logo-glint 1s .15s ease-in-out both}
.logo-caption{font-size:8px;letter-spacing:.3em;color:#bda681;animation:soft-enter .6s .35s both}
.hero.intro-playing .intro-logo{animation:logo-leave .55s 1.05s ease-in both}
.hero.intro-playing .intro-hello{display:block;position:absolute;left:50%;top:7%;z-index:6;transform:translateX(-50%);margin:0;font-family:'Cormorant Garamond',serif;font-size:clamp(42px,5vw,76px);font-style:italic;font-weight:300;animation:hello-wave 1.55s 1.25s both;pointer-events:none}
.intro-hello span{color:var(--gold)}
.hero.intro-playing .hero-stars{opacity:.4;animation:none}
.hero.intro-playing:not(.text-entering) .hero-heading,.hero.intro-playing:not(.text-entering) .hero-quote,.hero.intro-playing:not(.text-entering) .linkedin,.hero.intro-playing:not(.text-entering) .scroll{opacity:0}
.hero.intro-playing:not(.text-entering) .reveal-letter{animation-play-state:paused}
.hero.text-entering .reveal-letter{animation-delay:var(--letter-delay)}
.hero.intro-playing .linkedin{animation-delay:.9s}.hero.intro-playing .scroll{animation-delay:1.05s}
@keyframes logo-arrive{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(8px)}50%{opacity:1}100%{opacity:1;clip-path:inset(0);transform:none}}
@keyframes logo-glint{to{transform:translateX(120%)}}
@keyframes logo-leave{to{opacity:0;visibility:hidden}}
@keyframes hello-wave{0%{opacity:0;translate:0 12px}25%,65%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -12px}}
.voices{position:relative;padding-top:clamp(72px,9vw,150px);padding-bottom:clamp(60px,7vw,120px);background:radial-gradient(ellipse at 50% 0,#201b122e,transparent 65%)}
.voices-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:16px 40px;margin-bottom:clamp(40px,5vw,76px)}
.voices-heading .eyebrow{grid-column:1/-1;font-size:10px;letter-spacing:.23em;margin:0 0 12px}
.voices h2{font-size:clamp(44px,5.3vw,86px);line-height:1.03;letter-spacing:-.035em;margin:0}
.voices h2 em{font-family:'Cormorant Garamond',serif;font-weight:300;color:#c8ad83}
.voices-note{font-size:13px;line-height:1.8;color:#8c8c8c;justify-self:end;margin:0 0 8px}
.voices-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,84px)}
.voice{margin:0;min-width:0;border-top:1px solid #51412d;padding-top:24px}
.voice-person{position:relative;display:flex;align-items:end;gap:24px;min-height:145px;margin-bottom:24px}
.voice-photo{flex:none;width:clamp(100px,10vw,160px);aspect-ratio:1;background:radial-gradient(ellipse at bottom,#38302488,transparent 72%);overflow:hidden}
.voice-photo img{width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:grayscale(1);display:block}
.voice figcaption{padding-bottom:9px;min-width:0}
.voice figcaption strong{display:block;font-size:18px;font-weight:400;margin-bottom:8px}
.voice figcaption span,.voice figcaption small{display:block;font-size:10px;line-height:1.7;color:#aaa}
.voice figcaption small{color:#706a61;margin-top:4px;font-size:9px}
.voice-mark{font-family:Georgia,serif;font-size:96px;line-height:1;position:absolute;right:0;top:14px;color:#b99c7055}
.voice-quote{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(27px,2.65vw,43px);line-height:1.25;font-weight:300;letter-spacing:-.015em;margin:0;color:#e9e3d8}
.voice-line-mask{display:block;overflow:clip;padding-bottom:.14em;margin-bottom:-.14em}
.voice-line{display:block;transform-origin:left bottom}
.voices-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;border-bottom:1px solid #30281c;padding:40px 0 30px;margin-top:24px}
.voices-footer>span{font-size:8px;letter-spacing:.18em;color:#716a60}
.voices-link{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:15px 18px;border:1px solid #8b7350;color:#d4b98f;font-size:10px;letter-spacing:.12em;min-height:48px;transition:background .25s,border-color .25s}
.voices-link:hover{background:#282014;border-color:#dbbe8f}.voices-link span{font-size:19px}
@media(prefers-reduced-motion:no-preference){.voices.motion-ready .voice-photo,.voices.motion-ready .voice figcaption,.voices.motion-ready .voice-line{opacity:0;transform:translateY(28px)}.voices.motion-ready .voice-photo{transform:translate(-32px,12px)}.voices .voice.is-visible .voice-photo{animation:voice-photo .9s cubic-bezier(.42,0,.15,1) both}.voices .voice.is-visible figcaption{animation:soft-enter .8s .18s both}.voices .voice.is-visible .voice-line{animation:voice-line .9s var(--row-delay,.32s) cubic-bezier(.22,1,.36,1) both}}
@keyframes voice-photo{from{opacity:0;transform:translate(-32px,12px)}to{opacity:1;transform:none}}
@keyframes voice-line{from{opacity:0;transform:translateY(108%) rotate(2deg)}to{opacity:1;transform:none}}
@media(max-width:767px){.hero.hero--standalone{display:block;min-height:max(700px,100svh)}.hero--standalone .intro{min-height:max(700px,100svh);padding:48px 24px 36px}.hero--standalone h1{font-size:clamp(60px,14vw,100px)}.hero--standalone .portrait{position:absolute;right:-4%;bottom:0;width:58%;height:65%;min-height:0;opacity:.75}.hero--standalone .hero-quote-space{max-width:65%;padding:44px 0;min-height:190px}.hero--standalone .hero-quote{font-size:clamp(24px,6vw,34px)}.hero--standalone .role{font-size:11px;max-width:300px}.hero--standalone .location{font-size:9px}.hero--standalone .linkedin{padding:14px 20px;font-size:11px;min-height:50px}.voices-heading{grid-template-columns:1fr}.voices-note{justify-self:start;margin-top:12px}.voices-grid{gap:24px}.voice-person{display:block;min-height:0;margin-bottom:18px}.voice-photo{width:100%;max-width:160px}.voice figcaption{padding-top:16px}.voice figcaption strong{font-size:16px}.voice figcaption span{font-size:9px}.voice figcaption small{font-size:8px}.voice-mark{display:none}.voice-quote{font-size:clamp(23px,5vw,31px);line-height:1.25}.voices-footer{align-items:flex-start;flex-direction:column;gap:20px}.voices-link{align-self:flex-end}.voices-heading .eyebrow{font-size:8px}}
@media(max-width:359px){.voices-grid{grid-template-columns:1fr}.voice-person{display:flex}.voice-photo{width:100px}.voice figcaption{padding:0}.hero--standalone h1{font-size:56px}}
@media(prefers-reduced-motion:reduce){.intro-logo,.intro-hello{display:none!important}.hero--standalone .portrait{will-change:auto}.voice-line,.voice-photo{transform:none!important;opacity:1!important}}

.intro-pending .hero>.portrait,.intro-pending .hero>.intro,.intro-pending .hero>.scroll{visibility:hidden}
.voice-photo{border-radius:50%;background:#181714;border:1px solid #51412d}
.voice-photo img{object-fit:cover}
/* Portraits float across the fine rule, matching the supplied composition. */
.voice{border:0;padding-top:0}
.voice-person{isolation:isolate;align-items:center;min-height:280px;gap:clamp(22px,2vw,34px);margin-bottom:10px}
.voice-person::before{content:'';position:absolute;left:0;right:0;top:28px;height:1px;background:#80735d55;z-index:-1}
.voice-photo{position:relative;z-index:1;flex:0 0 43%;width:43%;max-width:250px;height:280px;aspect-ratio:auto;border:0;border-radius:0;background:none;overflow:visible}
.voice-photo img{height:100%;width:100%;object-fit:contain;object-position:50% 100%;border:0;border-radius:0;background:none;mask-image:linear-gradient(to bottom,#000 0%,#000 92%,transparent 100%)}
.voice figcaption{padding:45px 0 0;flex:1}
.voice figcaption strong{font-size:clamp(19px,1.65vw,27px);margin-bottom:10px}
.voice figcaption span{font-size:clamp(10px,.85vw,14px);line-height:1.6;color:#ccc}
.voice figcaption small{font-size:10px;color:#8c8070;margin-top:10px}
.voice-mark{top:70px;font-size:80px}
.voice-quote{font-size:clamp(27px,2.15vw,36px);line-height:1.35}
@media(prefers-reduced-motion:no-preference){.voices .voice.is-visible .voice-photo{animation-delay:.12s}.voices .voice.is-visible figcaption{animation-delay:.3s}}
@media(max-width:767px){.voices-grid{grid-template-columns:1fr 1fr;gap:20px}.voice-person{display:flex;flex-direction:column;align-items:flex-start;gap:0;min-height:0;margin-bottom:22px}.voice-person::before{top:22px}.voice-photo{flex:none;width:100%;max-width:210px;height:210px}.voice figcaption{padding:18px 0 0}.voice figcaption strong{font-size:18px}.voice figcaption span{font-size:10px;line-height:1.6}.voice figcaption small{font-size:8px}.voice-quote{font-size:23px;line-height:1.35}}
@media(max-width:479px){.voices-grid{grid-template-columns:1fr;gap:48px}.voice-person{display:flex;flex-direction:row;align-items:center;gap:20px}.voice-photo{width:45%;height:230px}.voice figcaption{padding-top:30px}.voice figcaption span{font-size:10px}.voice-quote{font-size:28px}}
.voice-person::before{top:60px}
@media(max-width:767px){.voice-person::before{top:40px}}
@media(max-width:767px){.voice-person::before{top:90px}}
@media(max-width:479px){.voice-person::before{top:100px}}
/* The supplied mark is traced into four Bezier paths, each drawn in code. */
.logo-reveal{overflow:visible;animation:none}
.mm3d-vector{display:block;width:100%;height:auto;overflow:visible}
.logo-vector-part{fill:#fff;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill}
.hero.intro-playing .logo-vector-part{animation:logo-path-draw 1.15s var(--path-start,0s) cubic-bezier(.4,0,.2,1) both,logo-path-fill .5s 1.12s ease-in-out both;stroke-dasharray:1000;stroke-dashoffset:0}
.logo-vector-part-0{--path-start:0s}.logo-vector-part-1{--path-start:.12s}.logo-vector-part-2{--path-start:.24s}.logo-vector-part-3{--path-start:.36s}
.hero.intro-playing .intro-logo{animation:logo-leave .35s 1.85s ease-in both}
.hero.intro-playing .intro-hello{animation:hello-wave 1.05s 1.95s both}
@keyframes logo-path-draw{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
@keyframes logo-path-fill{from{fill:transparent;stroke-width:5}to{fill:#fff;stroke-width:0}}
@media(prefers-reduced-motion:reduce){.logo-vector-part{animation:none;stroke-dashoffset:0}}
/* Keep the vector hidden before its drawing animation owns the first frame. */
.logo-vector-part{fill:transparent;stroke:#fff;stroke-width:5;stroke-dasharray:1000;stroke-dashoffset:1000}
.intro-pending .logo-vector-part{visibility:hidden}
.voices{padding-top:clamp(32px,4vw,64px)}
.showreel{padding-bottom:8px}
@media(min-width:768px){.showreel{padding-bottom:12px}}
