/* Editorial portfolio inspired by Aviasales; the bar chapter uses its supplied brand assets. */
:root{--blue:#0866ff;--bar-blue:#1000bb;--orange:#ff571c;--paper:#f5f3ee;--ink:#161616;--gap:clamp(20px,4.4vw,68px);--max:1460px;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Golos Text',Arial,sans-serif;font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:.2em}
button{font:inherit;cursor:pointer;color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{border-radius:0}
button:active,.contact-button:active,.light-button:active{transform:translateY(1px)}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid currentColor;outline-offset:5px}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,blockquote{margin:0}
h1,h2{font-weight:700;letter-spacing:0;line-height:1.02}
h2{font-size:clamp(48px,6.2vw,94px)}
p+p{margin-top:1em}
blockquote{position:relative;font-weight:700;letter-spacing:0;line-height:1.12}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gap)}
.section-pad{padding-block:clamp(72px,8vw,132px)}
.skip-link{position:fixed;top:8px;left:8px;z-index:20;padding:12px;background:var(--paper);color:var(--ink);transform:translateY(-180%);opacity:0}
.skip-link:focus{transform:none;opacity:1}
/* Layers: header 10, skip link 20. Everything else remains in document flow. */
.site-header{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:24px;height:80px;padding-inline:var(--gap);background:var(--blue);color:var(--paper);border-bottom:1px solid #ffffff38}
.site-header.is-dark{background:var(--ink);border-bottom-color:#ffffff20}
.identity{display:flex;align-items:baseline;gap:22px;text-decoration:none;white-space:nowrap}
.identity strong{font-size:21px;letter-spacing:0}
.identity span{font-size:13px}
.site-header nav{display:flex;align-items:center;gap:30px;font-size:15px;white-space:nowrap}
.nav-link{text-decoration:none}
.nav-link:hover{text-decoration:underline}
.contact-button,.light-button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;padding:13px 22px;text-decoration:none;font-weight:700;line-height:1.4;white-space:nowrap;border:1px solid transparent;transition:transform .2s var(--ease),background .2s}
.contact-button{background:var(--orange);color:var(--ink)}
.contact-button:hover{background:#ff713f}
.hero{background:var(--blue);color:var(--paper);position:relative}
.hero-inner{padding-top:clamp(32px,4vw,60px);padding-bottom:70px;min-height:min(780px,100svh);display:flex;flex-direction:column}
.hero-address{font-size:15px;margin-bottom:32px}
.hero h1{font-size:clamp(62px,8.8vw,136px);position:relative}
.hero h1 span{display:block}
.hero h1 .hero-second{font-size:.84em;margin-top:8px}
.hero-bottom{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:end;margin-top:clamp(38px,4vw,64px)}
.hero-intro{max-width:590px;font-size:19px;line-height:1.55}
.hero-actions{display:flex;align-items:center;gap:30px;margin-top:30px;flex-wrap:wrap}
.light-button{background:var(--paper);color:var(--ink)}
.light-button:hover{background:#fff}
.plain-link{font-size:15px;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}
.hero-teaser{display:grid;grid-template-columns:130px 1fr;gap:24px;align-items:center;color:var(--paper);background:var(--ink);padding:24px 32px;text-decoration:none;transform:rotate(-3deg);transition:transform .3s var(--ease);position:relative;max-width:535px;justify-self:end}
.hero-teaser:hover{transform:rotate(0deg)}
.hero-mark{width:130px;filter:brightness(0) invert(1)}
.teaser-caption{font-size:12px;display:block;margin-bottom:10px}
.hero-teaser p{font-size:clamp(18px,1.6vw,25px);font-weight:700;line-height:1.15;letter-spacing:0}
.teaser-arrow{position:absolute;right:14px;bottom:10px;font-size:24px}
.hero-end{position:absolute;bottom:0;left:0;width:100%;height:1px}
.works-heading{display:flex;align-items:baseline;justify-content:space-between;gap:40px;margin-bottom:50px}
.works-heading p{font-size:17px;line-height:1.5}
.work-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);margin-bottom:38px}
.work-tab{background:none;border:0;border-bottom:1px solid #16161635;display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0;text-align:left;font-size:23px;font-weight:700;letter-spacing:0}
.work-tab+.work-tab{padding-left:24px}
.work-tab span{font-size:13px;font-weight:400;letter-spacing:0;margin-right:24px}
.work-tab.is-active{color:var(--blue);border-bottom:4px solid var(--blue)}
.work-tab:hover{color:var(--blue)}
.pub-panel+.pub-panel{margin-top:70px}
.js .pub-panel+.pub-panel{margin-top:0}
[hidden]{display:none!important}
.publication-cover{display:grid;grid-template-columns:1.05fr 1fr;gap:50px;align-items:center;min-height:510px}
.quote-context{font-size:17px;margin-bottom:25px;color:#475148}
.publication-quote blockquote{font-size:clamp(42px,4.6vw,72px);color:#163e32}
.publication-description{font-size:18px;max-width:450px;margin-top:28px}
.publication-photos{position:relative;padding:0 26px 55px 0}
.photo-main{width:100%;height:440px;object-fit:cover}
.photo-detail{position:absolute;right:-4px;bottom:0;object-fit:cover;width:45%;height:180px;border:7px solid var(--paper);transform:rotate(5deg)}
.func-cover .publication-quote blockquote{color:var(--blue)}
.merch-cover .publication-quote blockquote{color:var(--ink)}
.publication-meta{display:grid;grid-template-columns:1.2fr 1fr auto;gap:30px;align-items:center;margin-top:25px;padding-block:24px;border-top:1px solid #16161635;font-size:15px}
.publication-meta p+p{margin:0}
.publication-meta strong{display:block;margin-bottom:5px;font-size:13px;font-weight:500;color:#5b5b5b}
.publication-meta a{font-size:14px}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;font-weight:500;padding-block:22px}
summary::-webkit-details-marker{display:none}
summary span{font-size:28px;line-height:1;transition:transform .2s}
details[open]>summary span{transform:rotate(45deg)}
.reading-details{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.reading-layout{display:grid;grid-template-columns:minmax(0,760px) 240px;gap:60px;padding-block:30px 48px;justify-content:space-between}
.reading-text{font-size:19px;line-height:1.7;max-width:70ch;overflow-wrap:anywhere}
.reading-text p+p{margin-top:1.1em}
.reading-text h1,.reading-text h2,.reading-text h3{font-size:28px;line-height:1.2;letter-spacing:0;margin-block:32px 14px;font-weight:700}
.reading-text a{color:#084cb6}
.reading-text code{white-space:normal;font:inherit;background:#16161609;padding:2px 5px}
.reading-text hr{border:0;border-top:1px solid #16161630;margin-block:32px}
.reading-text ul,.reading-text ol{padding-left:24px}
.reading-note{font-size:15px;line-height:1.65;padding-top:5px}
.reading-note strong{font-size:16px}
.archive-note{font-size:13px;color:#60605a;margin-top:32px!important}
.voice-transition{background:var(--ink);color:var(--paper);padding-block:clamp(70px,7vw,120px)}
.transition-inner{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:40px}
.transition-inner p{font-size:17px;margin-bottom:24px}
.transition-inner h2{font-size:clamp(55px,7vw,110px)}
.transition-mark{max-width:360px;justify-self:center;transform:rotate(0deg);position:relative}

.transition-mark img{position:relative}
.triangle-case{background:var(--bar-blue);color:var(--paper);padding-block:70px 64px;overflow:clip}
.triangle-opening{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:0}
.triangle-name{position:relative;z-index:1}
.triangle-name h2{font-size:clamp(58px,7.8vw,120px)}
.triangle-name>p{font-size:clamp(23px,2.7vw,40px);line-height:1.15;letter-spacing:0;margin-top:32px}
.triangle-flower{margin-left:-70px}
.triangle-flower img{width:100%;aspect-ratio:1;object-fit:cover}
.triangle-body{margin-top:70px}
.triangle-intro{max-width:790px;margin-left:20%;font-size:21px;line-height:1.6}
.role-line{font-size:14px;line-height:1.6;margin-top:25px!important;color:#53534f}
.triangle-case .role-line{color:#dad7ff}
.triangle-story{display:grid;grid-template-columns:1fr 2.1fr;gap:8%;margin-top:85px;align-items:start}
.story-sign{position:sticky;top:140px;max-width:320px;padding-top:40px}
.story-sign img{filter:none}
.story-entry{padding-block:34px 60px;border-top:1px solid #f5f3ee65}
.story-entry h3{font-size:16px;font-weight:500;margin-bottom:30px}
.story-entry blockquote,.story-final{font-size:clamp(31px,3.3vw,51px);font-weight:700;letter-spacing:0;line-height:1.12}
.story-entry>p:not(.story-final){font-size:19px;line-height:1.6;margin-top:24px;max-width:590px}
.story-entry>blockquote+p{margin-top:25px}
.bar-reading{margin-top:25px}
.bar-reading summary{font-size:15px;padding-block:14px;border-bottom:1px solid #f5f3ee65}
.bar-reading-text{background:var(--paper);color:var(--ink);padding:30px 34px;font-size:18px;line-height:1.65;margin-top:18px}
.bar-reading-text p+p{margin-top:1em}
.bar-reading-text>a{display:inline-block;font-size:14px;margin-top:20px}
.bar-link{display:inline-block;font-size:15px;margin-top:24px}
.triangle-gallery{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:50px}
.triangle-gallery img{width:100%;height:auto}
.gallery-caption{font-size:13px;margin-top:16px;color:#dad7ff}
.project-label{font-size:16px;margin-bottom:24px}
.tradein-case h2{font-size:clamp(48px,6vw,92px)}
.tradein-case h2>span{color:var(--blue)}
.tradein-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:65px;align-items:start}
.tradein-explanation{font-size:20px;max-width:560px}
.analysis-switch{display:flex;flex-wrap:wrap;gap:8px;margin-top:35px}
.analysis-tab{background:none;border:1px solid #16161650;padding:9px 13px;font-size:14px}
.analysis-tab.is-active{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.analysis-note{font-size:15px;line-height:1.6;margin-top:18px;max-width:450px}
.text-sheet{padding:38px 40px;background:#fff;border:1px solid #16161620;box-shadow:12px 12px 0 #16161608}
.sheet-caption{display:block;font-size:12px;color:#565656;margin-bottom:36px}
.text-sheet h3{font-size:clamp(28px,3.1vw,46px);line-height:1.05;letter-spacing:0;font-weight:900;margin-bottom:30px}
.text-sheet p{font-size:17px;line-height:1.65}
.highlight-fragment{border-left:4px solid var(--blue);padding-left:18px;margin-top:26px!important}
.sheet-footer{border-top:1px solid #16161625;padding-top:20px;font-size:12px!important;color:#5a5a5a;margin-top:36px!important}
.analysis-copy+.analysis-copy{margin-top:35px}
.js .analysis-copy+.analysis-copy{margin-top:0}
.tradein-full{margin-top:50px}
.tradein-full .reading-text{padding-block:28px 40px;margin-inline:auto}
.asya-case{background:#e8ede5}
.asya-heading{max-width:930px}
.asya-heading>p{font-size:20px;margin-top:30px;max-width:670px}
.asya-demo{display:grid;grid-template-columns:1.8fr 1fr;gap:70px;margin-top:60px;align-items:center}
.quiz-screen{background:#dadfd7;padding:10px;border:1px solid #b7bfb4}
.quiz-screen img{width:100%;aspect-ratio:1.28;object-fit:cover;object-position:top}
.quiz-screen-label{font-size:25px;font-weight:700;letter-spacing:0;line-height:1.2;margin-bottom:20px}
.quiz-explanation>p:not(.quiz-screen-label){font-size:17px;line-height:1.65}
.quiz-steps{margin-block:22px 30px}
.quiz-step{width:100%;border:0;border-bottom:1px solid #16161630;background:none;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:18px;padding-block:12px;text-align:left}
.quiz-step.is-active{font-weight:700;color:#10420e}
.quiz-step.is-active span{transform:rotate(45deg)}
.dark-link{color:var(--ink)}
.asya-decisions{display:grid;grid-template-columns:1fr 1fr;gap:65px;margin-top:50px;max-width:1100px}
.asya-decisions p{margin:0;font-size:17px}
.asya-decisions strong{display:block;font-size:15px;margin-bottom:9px}
.experience-case h2{font-size:clamp(48px,6.8vw,104px)}
.experience-intro{font-size:19px;margin-top:32px;max-width:540px}
.career-list{list-style:none;margin:65px 0 0;padding:0}
.career-list li{display:grid;grid-template-columns:1fr 3.4fr;gap:40px;padding-block:28px;border-top:1px solid #16161640}
.career-date{font-size:15px;padding-top:8px;line-height:1.5}
.career-list li>div{display:grid;grid-template-columns:1.3fr 1fr;gap:45px;align-items:start}
.career-list h3{font-size:clamp(24px,2.5vw,39px);font-weight:700;letter-spacing:0;line-height:1.1}
.career-list h3 a{text-decoration:none}
.career-list h3 a:hover{color:var(--blue)}
.career-list h3 a span{font-size:.7em}
.career-list p{font-size:16px;line-height:1.65;max-width:470px}
.education{margin-top:40px;border-top:1px solid #16161640;padding-top:25px;display:flex;justify-content:space-between;gap:40px;align-items:start;font-size:15px}
.education p{max-width:560px}
.education a{white-space:nowrap}
.contact-case{background:var(--blue);color:var(--paper);padding-bottom:28px}
.contact-case h2{font-size:clamp(47px,6.2vw,96px)}
.contact-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:85px;margin-top:60px}
.contact-position{font-size:19px;max-width:650px}
.contact-actions{display:flex;align-items:start;flex-direction:column;gap:17px;justify-content:flex-start}
.contact-button-large{font-size:22px;padding:18px 24px;gap:60px;margin-bottom:6px}
.contact-address{font-size:18px;overflow-wrap:anywhere}
.copy-contact{border:0;border-bottom:1px solid #f5f3ee60;background:none;padding:0 0 3px;font-size:14px;color:var(--paper)}
.copy-status{font-size:13px;min-height:22px}
footer{display:flex;justify-content:space-between;gap:25px;align-items:center;font-size:13px;border-top:1px solid #ffffff50;margin-top:80px;padding-top:25px}
footer a{text-decoration:none}
@media(prefers-reduced-motion:no-preference){.hero h1{animation:hero-in .65s var(--ease) both}.hero-bottom{animation:hero-in .8s var(--ease) both;animation-delay:.1s}.transition-mark img{transition:transform .7s var(--ease)}.voice-transition.is-inview .transition-mark img{transform:rotate(-7deg)}@keyframes hero-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}}
@media(max-width:1100px){.identity{gap:14px}.identity span{font-size:11px}.site-header nav{gap:22px}.hero-bottom{gap:35px}.hero-teaser{grid-template-columns:85px 1fr;padding:22px;gap:15px}.hero-mark{width:85px}.hero-intro{font-size:17px}.publication-cover{gap:30px}.publication-meta{grid-template-columns:1fr 1fr}.publication-meta a{grid-column:1/-1}.tradein-layout{gap:40px}.asya-demo{gap:35px}.career-list li>div{gap:25px}.contact-layout{gap:45px}}
@media(max-width:767px){
  html{scroll-padding-top:82px}.section-pad{padding-block:68px}.site-header{height:68px;gap:12px;padding-inline:20px}.identity{display:block}.identity strong{font-size:17px;display:block}.identity span{font-size:10px;display:block;margin-top:1px}.site-header nav{gap:0}.site-header .nav-link{display:none}.site-header .contact-button{font-size:12px;padding:10px 12px;gap:15px}.hero-inner{min-height:auto;padding-top:32px;padding-bottom:40px}.hero-address{font-size:12px;margin-bottom:24px}.hero h1{font-size:clamp(42px,10.6vw,78px);letter-spacing:0;line-height:1.05}.hero h1 .hero-second{font-size:.88em;margin-top:15px;max-width:530px}.hero-bottom{grid-template-columns:1fr;margin-top:28px;gap:34px;align-items:start}.hero-intro{font-size:16px;max-width:100%}.hero-actions{gap:20px;margin-top:24px}.light-button{padding:11px 17px;font-size:14px;gap:23px}.hero-actions .plain-link{font-size:13px}.hero-teaser{max-width:none;width:calc(100% - 12px);justify-self:center;grid-template-columns:80px 1fr;padding:22px;transform:rotate(-2deg)}.hero-mark{width:80px}.hero-teaser p{font-size:20px}.teaser-caption{font-size:11px}.works-heading{display:block;margin-bottom:30px}.works-heading h2{font-size:46px}.works-heading p{font-size:15px;margin-top:20px}.work-tabs{margin-bottom:30px}.work-tab{font-size:17px;display:block;line-height:1.3;padding-block:14px}.work-tab+.work-tab{padding-left:12px}.work-tab span{display:block;font-size:10px;margin-top:5px;margin-right:0}.publication-cover{grid-template-columns:1fr;min-height:0;gap:28px}.quote-context{font-size:14px;margin-bottom:19px}.publication-quote blockquote{font-size:43px}.publication-description{font-size:16px;margin-top:20px}.publication-photos{padding-right:16px;padding-bottom:42px}.photo-main{height:300px}.photo-detail{height:125px;border-width:5px;right:0}.publication-meta{gap:18px;padding-block:20px;font-size:13px;margin-top:23px}.publication-meta strong{font-size:11px}.publication-meta a{font-size:12px}.reading-layout{grid-template-columns:1fr;gap:25px;padding-block:20px 30px}.reading-text{font-size:17px;line-height:1.7}.reading-note{border-top:1px solid #16161630;padding-top:22px}.reading-details summary{font-size:15px;padding-block:18px}.voice-transition{padding-block:55px}.transition-inner{grid-template-columns:1fr 120px;gap:16px}.transition-inner p{font-size:13px;margin-bottom:20px}.transition-inner h2{font-size:48px}.transition-mark{width:120px}.triangle-case{padding-top:45px;padding-bottom:40px}.triangle-opening{grid-template-columns:1fr;gap:30px}.triangle-name h2{font-size:clamp(51px,12vw,85px)}.triangle-name>p{font-size:25px;margin-top:22px}.triangle-flower{margin-left:0;margin-inline:calc(-1*var(--gap))}.triangle-flower img{aspect-ratio:1.2;width:100%;object-position:50% 42%}.triangle-body{margin-top:38px}.triangle-intro{margin-left:0;font-size:17px}.triangle-story{grid-template-columns:1fr;gap:0;margin-top:40px}.story-sign{position:static;max-width:90px;padding-top:0;padding-bottom:25px}.story-entry{padding-block:26px 38px}.story-entry h3{font-size:13px;margin-bottom:22px}.story-entry blockquote,.story-final{font-size:33px}.story-entry>p:not(.story-final){font-size:16px;margin-top:20px}.bar-reading{margin-top:20px}.bar-reading-text{padding:24px 20px;font-size:16px}.bar-reading summary,.bar-link{font-size:13px}.triangle-gallery{grid-template-columns:1fr;gap:16px;margin-top:20px}.gallery-caption{font-size:11px}.project-label{font-size:13px;margin-bottom:20px}.tradein-case h2{font-size:clamp(37px,8.9vw,62px)}.tradein-layout{grid-template-columns:1fr;gap:32px;margin-top:30px}.tradein-explanation{font-size:17px}.analysis-switch{gap:6px;margin-top:24px}.analysis-tab{font-size:12px;padding:9px 10px}.analysis-note{font-size:14px}.text-sheet{padding:28px 24px;box-shadow:7px 7px 0 #16161608}.text-sheet h3{font-size:34px}.text-sheet p{font-size:16px}.sheet-caption{margin-bottom:25px}.tradein-full{margin-top:38px}.asya-heading h2{font-size:42px}.asya-heading>p{font-size:17px;margin-top:23px}.asya-demo{grid-template-columns:1fr;gap:25px;margin-top:30px}.quiz-screen{padding:5px}.quiz-screen-label{font-size:24px;margin-bottom:15px}.quiz-explanation>p:not(.quiz-screen-label){font-size:16px}.quiz-steps{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin-top:15px;margin-bottom:25px}.quiz-step{font-size:15px}.asya-decisions{grid-template-columns:1fr;gap:25px;margin-top:35px}.asya-decisions p{font-size:16px}.experience-case h2{font-size:43px}.experience-intro{font-size:17px;margin-top:24px}.career-list{margin-top:35px}.career-list li{grid-template-columns:1fr;gap:11px;padding-block:24px}.career-date{font-size:12px;padding:0}.career-list li>div{grid-template-columns:1fr;gap:12px}.career-list h3{font-size:30px}.career-list p{font-size:15px}.education{display:block;font-size:13px;margin-top:20px}.education a{display:inline-block;margin-top:18px}.contact-case h2{font-size:clamp(39px,9.2vw,64px)}.contact-layout{grid-template-columns:1fr;gap:30px;margin-top:30px}.contact-position{font-size:17px}.contact-button-large{font-size:18px;padding:15px 20px;width:100%}.contact-address{font-size:16px}.contact-actions{gap:15px}footer{margin-top:40px;font-size:11px;display:grid;grid-template-columns:1fr auto;gap:10px}footer>span:nth-child(2){grid-row:2}footer>a{grid-column:2;grid-row:1/3}.role-line{font-size:12px}}
@media(max-width:360px){.hero h1{font-size:38px}.contact-button{font-size:11px!important}.publication-quote blockquote{font-size:38px}.transition-inner{grid-template-columns:1fr 90px}.transition-mark{width:90px}.transition-inner h2{font-size:43px}.tradein-case h2{font-size:33px}.work-tab{font-size:15px}.asya-heading h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
@media print{.site-header,.hero-teaser,.hero-actions,.voice-transition,.work-tabs,.copy-contact,.copy-status{display:none!important}body{font-size:11pt;background:white;color:black}.section-pad{padding-block:30px}.wrap{padding-inline:0}h1,h2{font-size:32pt!important;page-break-after:avoid}.hero,.triangle-case,.contact-case,.asya-case{color:black;background:white}.hero-inner{min-height:0;padding:0}.hero-bottom,.triangle-opening,.triangle-story,.tradein-layout,.asya-demo,.contact-layout,.reading-layout{display:block}.hero-intro{max-width:100%}.triangle-flower,.triangle-gallery,.story-sign,.publication-photos{display:none}.triangle-intro{margin:0}.pub-panel[hidden],.analysis-copy[hidden]{display:block!important}.pub-panel+.pub-panel{margin-top:30px}.publication-cover{display:block;min-height:0}.reading-details{border:0}summary{display:none!important}.reading-text{font-size:11pt;max-width:none}details:not([open])>*:not(summary){display:block!important}.career-list li,.career-list li>div{display:block}.triangle-case .role-line,.gallery-caption,.role-line{color:#555}.publication-quote blockquote,.tradein-case h2>span{color:black}.story-entry{border-top-color:#bbb}.story-entry blockquote{font-size:23pt}.contact-actions{margin-top:20px}.contact-button{background:none;color:black;padding:0}.contact-address{font-size:12pt}footer{border-top:1px solid #999}.text-sheet{box-shadow:none}.reading-note{margin-top:15px}.hero-address{margin-block:20px}.hero h1 span{font-size:1em!important}.publication-meta{font-size:10pt}a{color:black!important}}

/* Revised composition after the first live review: typography, images and documents. */
.hero-address{line-height:1.7;font-size:15px}
.hero h1{font-weight:900;font-size:clamp(55px,8vw,124px);line-height:1.1}
.hero h1 .hero-second{font-weight:500;font-size:.83em;line-height:1.15;margin-top:12px}
.hero-teaser{background:none;padding:0;grid-template-columns:150px 1fr;transform:none;gap:25px}
.hero-teaser:hover{transform:none}
.hero-mark{width:150px;transform:rotate(-7deg)}
.hero-teaser p{font-weight:500;font-size:25px;line-height:1.3}
.hero-teaser .teaser-arrow{display:none}
.hero-actions{gap:24px 30px}
.light-button,.contact-button{padding:0;border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:.25em;font-weight:500}
.light-button:hover,.contact-button:hover{background:none}
.light-button{font-size:18px;gap:10px}
.plain-link{font-size:15px;border:0;text-decoration:underline;padding:0}
.works-heading{display:block}
.works-heading p{margin-top:22px}
.work-tabs{display:flex;flex-wrap:wrap;gap:12px 38px;border:0;margin-bottom:55px}
.work-tab,.work-tab+.work-tab{padding:0;border:0;font-size:23px;font-weight:500;background:none}
.work-tab.is-active{border:0;text-decoration:underline;text-underline-offset:9px;text-decoration-thickness:1px}
.publication-cover{display:block;min-height:0}
.publication-quote{max-width:730px;position:relative}
.publication-quote blockquote{font-size:clamp(44px,5vw,76px);font-weight:500;line-height:1.15}
.publication-description{font-size:18px;max-width:500px}
.publication-photos{width:75%;margin:40px 0 60px 25%;padding:0;position:relative}
.photo-main{height:auto;max-height:650px;aspect-ratio:1.55;object-fit:cover}
.photo-detail{width:35%;height:auto;aspect-ratio:1.5;right:-15px;bottom:-35px;border-width:8px;transform:rotate(8deg)}
.hanging-open{position:absolute;left:-.55em}
.hanging-close{display:inline-block;width:0;white-space:nowrap}
.publication-meta{border:0;margin-top:0;padding-top:0}
.reading-details{border:0}
.reading-details>summary{justify-content:flex-start;gap:20px;width:fit-content;text-decoration:underline;text-underline-offset:6px;font-size:16px;font-weight:400;padding-block:16px}
.reading-details>summary span{font-size:22px}
.transition-inner h2{font-weight:500;line-height:1.15}
.transition-mark{background:var(--paper);padding:12px;max-width:260px;transform:rotate(6deg)}
.transition-mark img{transform:none!important}
.triangle-name h2{font-size:clamp(52px,6.3vw,94px);font-weight:700;line-height:1.12}
.triangle-flower{margin-left:-25px}
.triangle-opening{gap:20px}
.story-entry blockquote,.story-final{font-weight:500;line-height:1.2}
.tradein-case{background:var(--orange)}
.tradein-case h2{font-size:clamp(43px,5.5vw,84px);font-weight:500;line-height:1.13}
.tradein-case h2>span{color:var(--ink);text-decoration:underline;text-underline-offset:.12em;text-decoration-thickness:2px}
.tradein-letter{margin-top:45px}
.letter-intro{font-size:20px;max-width:650px}
.tradein-spread{position:relative;margin:65px 150px 55px 7%;max-width:930px}
.tradein-main-copy{padding:50px 60px;background:var(--paper);transform:rotate(-2deg);position:relative}
.tradein-main-copy h3{font-size:clamp(34px,3.6vw,53px);font-weight:700;line-height:1.12;margin-bottom:30px}
.tradein-main-copy p{font-size:18px;line-height:1.7;max-width:580px}
.tradein-main-copy .sheet-caption{font-size:12px;margin-bottom:25px}
.marked-sentence{text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:3px;text-underline-offset:6px}
.tradein-margin{position:absolute;right:-150px;bottom:30px;max-width:200px;transform:rotate(6deg)}
.tradein-margin p{font-size:22px;font-weight:500;line-height:1.3;background:var(--orange);padding:10px}
.tradein-afterword{max-width:690px;font-size:20px}
.tradein-case .role-line,.tradein-case .archive-note{color:var(--ink)}
.tradein-full .reading-text{padding:40px;background:var(--paper);max-width:760px}
.asya-case{background:#e8ede5;overflow:clip}
.asya-heading h2{font-weight:500;line-height:1.15}
.quiz-scene{position:relative;margin:85px auto 70px;max-width:1100px;padding:40px 100px 50px 30px}
.quiz-document{margin:0;position:relative;z-index:1;transform:rotate(-2deg);width:100%}
.quiz-document img{width:100%;background:#e7e4dc;aspect-ratio:1.28;object-fit:cover;object-position:top;box-shadow:0 8px 30px #29432816}
.quiz-document figcaption{font-size:17px;margin-top:22px;font-weight:500;line-height:1.4}
.quiz-backdrop{position:absolute;right:-20px;top:-10px;width:74%;transform:rotate(7deg)}
.quiz-backdrop img{width:100%;aspect-ratio:1.28;object-fit:cover}
.quiz-margin-note{position:absolute;right:-5px;bottom:0;z-index:2;font-size:20px;line-height:1.3;transform:rotate(5deg);background:#e8ede5;padding:15px}
.quiz-reading{max-width:670px;font-size:20px}
.quiz-turn{display:flex;gap:35px;margin-block:25px}
.quiz-turn button{border:0;background:none;padding:0;text-decoration:underline;text-underline-offset:5px;font-size:16px;font-weight:400;min-height:44px}
.career-story{max-width:780px;font-size:23px;line-height:1.6;margin-top:45px}
.career-story p+p{margin-top:1.5em}
.career-details{margin-top:35px}
.career-details>summary{justify-content:flex-start;gap:25px;font-size:17px;text-decoration:underline;text-underline-offset:6px;width:fit-content}
.career-list{margin:25px 0 0;max-width:780px}
.career-list li{border:0;display:block;padding-block:20px}
.career-list li>div{display:block}
.career-date{font-size:13px;display:block;margin-bottom:12px;padding:0}
.career-list h3{font-size:28px;font-weight:500;line-height:1.2}
.career-list p{margin-top:12px;max-width:none}
.education{border:0}
.contact-case h2{font-weight:500;line-height:1.15}
.contact-button-large{font-size:clamp(25px,2.9vw,44px);white-space:normal;gap:18px;line-height:1.3}
@media(max-width:1100px){.tradein-spread{margin-right:100px;margin-left:0}.tradein-main-copy{padding:40px}.tradein-margin{right:-110px;max-width:170px}.tradein-margin p{font-size:18px}.quiz-scene{padding-right:80px;margin-top:65px}.quiz-margin-note{font-size:17px}.hero-teaser{grid-template-columns:100px 1fr;gap:15px}.hero-mark{width:100px}.hero-teaser p{font-size:22px}.triangle-name h2{font-size:clamp(48px,6.3vw,80px)}}
@media(max-width:767px){
html{scroll-padding-top:25px}
.hero-inner{padding-top:25px;padding-bottom:50px;min-height:0}
.hero-address{font-size:12px;margin-bottom:26px}
.hero h1{font-size:clamp(34px,9.5vw,65px);line-height:1.15}
.hero h1 .hero-second{font-size:1em;font-weight:500;margin-top:18px}
.hero-bottom{gap:38px;margin-top:28px}
.hero-teaser{width:100%;grid-template-columns:100px 1fr;gap:20px;justify-self:start;padding:0;transform:none}
.hero-mark{width:100px}
.hero-teaser p{font-size:20px;line-height:1.35}
.hero-actions{gap:18px 24px}
.light-button{font-size:16px;padding:0;gap:9px}
.hero-actions .plain-link{font-size:14px}
.works-heading h2{font-size:42px}
.work-tabs{gap:12px 24px;margin-bottom:40px}
.work-tab,.work-tab+.work-tab{font-size:17px;padding:0}
.publication-cover{display:block}
.publication-quote blockquote{font-size:clamp(35px,9.5vw,56px);font-weight:500}
.publication-description{font-size:16px;margin-top:24px}
.publication-photos{width:100%;margin:30px 0 50px;padding:0}
.photo-main{height:auto;aspect-ratio:1.25;max-height:440px}
.photo-detail{width:38%;height:auto;aspect-ratio:1.4;bottom:-24px;right:0;border-width:5px}
.publication-meta{display:block;margin-top:0;padding-bottom:0;font-size:13px}
.publication-meta p{display:inline-block;margin:0 18px 18px 0}
.publication-meta a{display:block;margin-bottom:15px}
.reading-details>summary{font-size:14px}
.transition-inner{grid-template-columns:1fr 100px;gap:20px}
.transition-inner h2{font-size:clamp(36px,9.5vw,58px);line-height:1.2}
.transition-mark{width:100px;padding:3px}
.triangle-opening{display:block}
.triangle-name h2{font-size:clamp(32px,9.7vw,67px);line-height:1.2}
.triangle-flower{margin:35px calc(-1*var(--gap)) 0}
.triangle-name>p{font-size:23px;line-height:1.3}
.story-entry blockquote,.story-final{font-size:clamp(27px,7.8vw,42px)}
.tradein-case h2{font-size:clamp(30px,8.1vw,54px);line-height:1.2}
.tradein-letter{margin-top:30px}
.letter-intro,.tradein-afterword{font-size:17px}
.tradein-spread{margin:40px 0 35px;padding-bottom:0}
.tradein-main-copy{padding:28px 22px;transform:rotate(-1deg)}
.tradein-main-copy h3{font-size:32px;line-height:1.2}
.tradein-main-copy p{font-size:16px}
.tradein-margin{position:relative;right:auto;bottom:auto;margin:30px 0 0 30%;max-width:250px}
.tradein-margin p{font-size:18px;padding:0}
.tradein-main-copy .sheet-caption{font-size:11px;margin-bottom:22px}
.tradein-full .reading-text{padding:25px 20px}
.asya-heading h2{font-size:clamp(34px,9.1vw,59px);line-height:1.2}
.quiz-scene{margin:65px 0 45px;padding:0 25px 25px 0}
.quiz-backdrop{width:88%;right:-3px;top:-16px;transform:rotate(6deg)}
.quiz-document{transform:rotate(-2deg)}
.quiz-document figcaption{font-size:14px;margin-top:15px;max-width:260px}
.quiz-margin-note{position:relative;right:auto;bottom:auto;margin:20px 0 0 35%;font-size:17px;max-width:240px;padding:0}
.quiz-reading{font-size:17px}
.quiz-turn{gap:24px;margin-block:12px 22px}
.quiz-turn button{font-size:14px}
.experience-case h2{font-size:clamp(33px,8.9vw,58px);line-height:1.2}
.career-story{font-size:18px;margin-top:30px}
.career-list li{padding-block:15px}
.career-list h3{font-size:25px;line-height:1.25}
.contact-case h2{font-size:clamp(33px,8.7vw,58px);line-height:1.2}
.contact-button-large{font-size:27px;width:auto;padding:0;gap:15px}
}
@media print{.quiz-backdrop,.quiz-margin-note,.quiz-turn,.tradein-margin{display:none}.tradein-case{background:white}.tradein-main-copy{transform:none;padding:0}.tradein-spread{margin:20px 0}.quiz-scene{margin:20px 0;padding:0}.quiz-document{transform:none}.hero-mark{transform:none}.career-details>summary{display:none}.career-story{font-size:11pt}.hanging-open{position:static}.contact-button-large{font-size:16pt}.hero-address{margin-top:0}}
@media(max-width:767px){.hero-actions a,.work-tab,.copy-contact,.contact-address{min-height:44px;display:inline-flex;align-items:center}.hero-actions{row-gap:4px}.contact-actions{gap:8px}}

/* The original personal-blog stories remain hidden while the author revises them. */
.hero-teaser{display:block;width:180px;justify-self:end}
.hero-teaser .hero-mark{width:180px}
.transition-inner{grid-template-columns:minmax(0,1fr) 180px;gap:55px}
.transition-inner h2{font-size:clamp(40px,5.5vw,84px);line-height:1.18;max-width:1050px}
#voice-title span{display:block}
.transition-mark{background:none;padding:0;transform:none;width:180px;max-width:none}
.transition-mark img{filter:brightness(0) invert(1)}
.story-sign{mix-blend-mode:screen}
.story-sign img{filter:grayscale(1) invert(1)}
.triangle-gallery{grid-template-columns:1fr}
.triangle-gallery img{max-width:1000px;margin-inline:auto}
@media(max-width:767px){.hero-teaser{width:100px;justify-self:start}.hero-teaser .hero-mark{width:100px}.transition-inner{grid-template-columns:1fr;gap:35px}.transition-inner h2{font-size:clamp(31px,8.3vw,55px);line-height:1.22}.transition-mark{width:95px;justify-self:start}}

/* Reader comments keep their own words; typography sets the reading order. */
.reader-reviews{scroll-margin-top:24px}
.reader-intro{padding-block:90px 70px}
.reader-intro h2{font-size:clamp(48px,6.4vw,92px);font-weight:700;line-height:1.1}
.reader-intro>p{max-width:650px;font-size:20px;line-height:1.55;margin-top:30px}
.reader-wall{background:var(--blue);color:var(--paper);padding-block:85px 45px}
.reader-composition{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:30px;row-gap:95px}
.reader-comment{min-width:0;align-self:start}
.reader-quote{font-size:clamp(28px,3vw,45px);font-weight:400;line-height:1.24;letter-spacing:0;overflow-wrap:break-word}
.reader-quote strong{font-weight:700}
.reader-comment--lead{grid-column:2/12}
.reader-comment--lead .reader-quote{font-size:27px;line-height:1.4}
.reader-comment--lead strong{display:block;font-size:clamp(52px,6.8vw,100px);line-height:1.1;font-weight:900;margin-top:20px}
.reader-comment--lead .hanging-open{top:0}
.reader-comment--long{grid-column:1/6;grid-row:2;margin-top:100px;transform:rotate(-2deg)}
.reader-comment--long .reader-quote{font-size:clamp(26px,2.8vw,41px)}
.reader-comment--ad{grid-column:7/13;grid-row:2;transform:rotate(2deg)}
.reader-comment--ad .reader-quote{font-size:clamp(33px,3.8vw,55px);line-height:1.18}
.reader-comment--ad strong{text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:.08em;text-underline-offset:.1em}
.reader-comment--action{grid-column:2/8;grid-row:3}
.reader-comment--action .reader-quote{font-size:clamp(34px,3.6vw,52px);line-height:1.23}
.reader-comment--voice{grid-column:9/13;grid-row:3;margin-top:125px;transform:rotate(-2deg)}
.reader-comment--voice .reader-quote{font-size:clamp(27px,2.65vw,39px)}
.reader-comment--city{grid-column:5/12;grid-row:4;max-width:800px}
.reader-meta{margin-top:26px}
.reader-meta time{display:block;font-size:13px;color:#e0ebff}
.reader-details>summary{display:flex;justify-content:flex-start;gap:12px;width:fit-content;min-height:44px;padding-block:8px;font-size:14px;font-weight:400;line-height:1.4;text-decoration:underline;text-underline-offset:5px}
.reader-details>summary span{font-size:20px}
.reader-full{padding-top:20px;font-size:18px;line-height:1.65;overflow-wrap:anywhere;max-width:65ch}
.reader-full p+p{margin-top:1em}
.reader-comment:has(details[open]){transform:none}
.reader-source{font-size:14px;color:#e0ebff;margin-top:80px;line-height:1.6}
.reader-source a{display:inline-flex;align-items:center;min-height:44px;color:var(--paper)}
.reader-author{display:inline-flex;align-items:center;gap:7px;min-height:44px;font-size:15px;line-height:1.4;font-weight:500;text-decoration:none}
.reader-author:hover{text-decoration:underline}
@media(max-width:1100px){
  .reader-composition{column-gap:24px;row-gap:70px}
  .reader-comment--lead{grid-column:1/13}
  .reader-comment--lead strong{font-size:clamp(50px,7.5vw,82px)}
  .reader-comment--ad{grid-column:7/13}
  .reader-comment--long{grid-column:1/6;margin-top:65px}
  .reader-comment--action{grid-column:1/8}
  .reader-comment--voice{grid-column:9/13;margin-top:100px}
  .reader-comment--city{grid-column:4/12}
}
@media(max-width:767px){
  .reader-intro{padding-block:65px 45px}
  .reader-intro h2{font-size:clamp(40px,10vw,62px)}
  .reader-intro>p{font-size:17px;margin-top:25px}
  .reader-wall{padding-block:50px 30px}
  .reader-composition{grid-template-columns:minmax(0,1fr);row-gap:58px;padding-inline:28px}
  .reader-comment{grid-column:1;grid-row:auto;transform:none;margin:0;max-width:none}
  .reader-comment--lead .reader-quote{font-size:18px;line-height:1.5}
  .reader-comment--lead strong{font-size:clamp(34px,10.3vw,63px);line-height:1.16;margin-top:16px}
  .reader-comment--ad .reader-quote{font-size:clamp(30px,8.3vw,44px);line-height:1.25}
  .reader-comment--long .reader-quote{font-size:clamp(26px,7.3vw,36px)}
  .reader-comment--action .reader-quote{font-size:clamp(29px,8vw,43px);line-height:1.28}
  .reader-comment--voice{padding-left:24px}
  .reader-comment--voice .reader-quote{font-size:clamp(25px,6.9vw,34px)}
  .reader-comment--city .reader-quote{font-size:clamp(25px,7.1vw,35px)}
  .reader-meta{margin-top:20px}
  .reader-meta time{font-size:12px}
  .reader-full{font-size:16px;padding-top:16px}
  .reader-source{font-size:12px;margin-top:45px;padding-inline:28px}
}
@media print{
  .reader-intro{padding-block:25px}
  .reader-intro>p,.reader-full{font-size:11pt}
  .reader-wall{background:white;color:black;padding-block:15px}
  .reader-composition{display:block}
  .reader-comment{margin:0 0 25px;transform:none;break-inside:avoid}
  .reader-quote,.reader-comment--lead .reader-quote,.reader-comment--lead strong,.reader-comment--ad .reader-quote,.reader-comment--long .reader-quote,.reader-comment--action .reader-quote,.reader-comment--voice .reader-quote{font-size:16pt;line-height:1.3}
  .reader-comment--lead strong{display:inline;margin:0}
  .reader-meta time,.reader-source{color:#444}
  .reader-source{margin-top:20px}
}

/* The writing background replaces the former introductory paragraph and visible chronology. */
.reader-intro{padding-block:75px 55px}
.blog-position{max-width:760px;margin-top:28px;font-size:20px;line-height:1.6}
.blog-position p+p{margin-top:20px}
.blog-press{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:24px;font-size:14px}
.blog-press a,.practice-link{display:inline-flex;align-items:center;min-height:44px}
.reader-wall{padding-top:65px}
.reader-composition{row-gap:65px}
.reader-comment--lead strong{font-size:clamp(48px,5.8vw,84px)}
.reader-comment--ad .reader-quote{font-size:clamp(30px,3.3vw,48px)}
.reader-comment--long{margin-top:60px}
.reader-comment--long .reader-quote{font-size:clamp(25px,2.5vw,36px)}
.reader-comment--action .reader-quote{font-size:clamp(31px,3.1vw,45px)}
.reader-comment--voice{margin-top:75px}
.reader-comment--voice .reader-quote{font-size:clamp(25px,2.4vw,35px)}
.reader-comment--city .reader-quote{font-size:clamp(27px,2.8vw,40px)}
.reader-meta{margin-top:20px}
.reader-source{margin-top:55px}
.editor-practice{margin-top:50px;max-width:1140px}
.teaching-practice{display:grid;grid-template-columns:300px minmax(0,660px);gap:70px;align-items:start}
.teaching-number{font-size:clamp(90px,9vw,125px);font-weight:900;line-height:1;letter-spacing:0}
.teaching-unit{font-size:18px;line-height:1.5;margin-top:16px}
.teaching-copy h3,.slop-practice h3{font-size:clamp(32px,3.1vw,44px);font-weight:500;line-height:1.2;margin:0 0 25px}
.teaching-copy>p,.slop-practice>p{font-size:20px;line-height:1.65}
.practice-link{font-size:14px;margin-top:18px}
.slop-practice{margin:65px 0 0 22%;max-width:760px}
.method-details{margin-top:15px}
.method-details>summary{justify-content:flex-start;width:fit-content;min-height:44px;gap:16px;padding-block:10px;font-size:16px;font-weight:400;text-decoration:underline;text-underline-offset:5px}
.method-details>summary span{font-size:22px}
.method-body{padding-top:22px;font-size:18px;line-height:1.65}
.method-example-label{font-size:13px;margin-top:30px!important}
.method-example{margin-top:18px}
.method-before{font-size:22px;line-height:1.5;color:#575650;text-decoration:line-through;text-decoration-color:var(--orange);text-decoration-thickness:2px}
.method-after{font-size:27px;font-weight:500;line-height:1.4;margin-top:25px!important}
.method-note{font-size:13px;color:#575650;margin-top:22px!important}
.career-details{margin-top:55px}
.career-details .career-story{font-size:20px;margin-top:25px}
@media(max-width:1100px){.teaching-practice{grid-template-columns:240px minmax(0,1fr);gap:45px}.slop-practice{margin-left:12%}}
@media(max-width:767px){
  .reader-intro{padding-block:55px 38px}
  .blog-position{font-size:17px;margin-top:25px}
  .blog-press{display:block;font-size:12px;margin-top:16px}
  .blog-press a{display:flex;width:fit-content}
  .reader-wall{padding-top:40px}
  .reader-composition{row-gap:38px}
  .reader-comment--lead strong{font-size:clamp(30px,9vw,48px)}
  .reader-comment--ad .reader-quote{font-size:clamp(26px,7.4vw,38px)}
  .reader-comment--long .reader-quote{font-size:clamp(24px,6.5vw,32px)}
  .reader-comment--action .reader-quote{font-size:clamp(26px,7vw,37px)}
  .reader-comment--voice .reader-quote,.reader-comment--city .reader-quote{font-size:clamp(23px,6.2vw,31px)}
  .reader-comment--long,.reader-comment--voice{margin-top:0}
  .reader-meta{margin-top:14px}
  .reader-author{font-size:14px}
  .reader-source{margin-top:35px}
  .editor-practice{margin-top:35px}
  .teaching-practice{display:block}
  .teaching-number{font-size:100px}
  .teaching-unit{font-size:16px;margin-top:12px}
  .teaching-unit br{display:none}
  .teaching-copy{margin-top:30px}
  .teaching-copy h3,.slop-practice h3{font-size:31px;margin-bottom:20px}
  .teaching-copy>p,.slop-practice>p{font-size:17px}
  .slop-practice{margin:45px 0 0}
  .practice-link{font-size:12px;margin-top:14px}
  .method-details>summary{font-size:14px}
  .method-body{font-size:16px}
  .method-before{font-size:18px}
  .method-after{font-size:23px}
  .career-details{margin-top:35px}
  .career-details .career-story{font-size:17px}
}
@media print{
  .blog-position,.teaching-copy>p,.slop-practice>p,.method-body,.career-details .career-story{font-size:11pt}
  .blog-press,.practice-link,.reader-author{font-size:10pt}
  .teaching-practice{display:block}
  .teaching-number{font-size:40pt}
  .teaching-unit{font-size:11pt}
  .teaching-copy h3,.slop-practice h3{font-size:20pt}
  .slop-practice{margin:25px 0 0}
  .reader-comment--lead strong{font-size:16pt}
  .method-before,.method-after{font-size:12pt}
}

/* The launch story follows the actual posts, from the map to the bar. */
.voice-transition{padding-block:90px 100px}
.transition-inner{display:flex;flex-direction:column;align-items:center;gap:34px;text-align:center}
.transition-mark{width:105px;align-self:center}
.transition-greeting{width:100%}
.transition-inner h2{font-size:clamp(44px,6.5vw,100px);font-weight:500;line-height:1.18;max-width:1160px;margin-inline:auto}
.transition-inner .transition-greeting>p{font-size:15px;line-height:1.5;color:#d9d7d0;margin:28px 0 0}
.triangle-case{padding-block:85px 65px}
.triangle-prologue h2{font-size:clamp(54px,7.6vw,112px);font-weight:700;line-height:1.12;max-width:1200px}
.triangle-prologue .project-label{font-size:15px;margin-bottom:30px}
.triangle-lead{font-size:23px;line-height:1.6;max-width:790px;margin-top:40px}
.triangle-origin{margin-top:70px}
.triangle-map{margin:0 auto;max-width:1140px}
.triangle-map img{width:100%}
.triangle-map figcaption{font-size:13px;line-height:1.5;color:#dedbff;margin-top:16px}
.triangle-origin-copy{margin-top:65px}
.triangle-pullquote{font-size:clamp(34px,4.3vw,64px);font-weight:500;line-height:1.2;max-width:1000px;margin-left:7%}
.triangle-narrative{font-size:21px;line-height:1.65;max-width:730px;margin-top:35px}
.triangle-origin-copy .triangle-narrative{margin-left:20%;margin-top:40px}
.triangle-reading>summary{justify-content:flex-start;gap:20px;width:fit-content;min-height:44px;padding-block:12px;font-size:15px;font-weight:400;text-decoration:underline;text-underline-offset:5px}
.triangle-reading>summary span{font-size:22px}
.triangle-reading{margin-top:20px}
.triangle-original-text{background:var(--paper);color:var(--ink);padding:35px 40px;margin-top:15px;font-size:18px;line-height:1.7;max-width:70ch;overflow-wrap:anywhere}
.triangle-original-text p+p{margin-top:1em}
.triangle-original-text h4{font-size:24px;line-height:1.3;margin:0 0 22px}
.triangle-original-text>a,.triangle-stat-image>a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;margin-top:16px}
.triangle-evidence{margin-top:75px;margin-bottom:75px}
.triangle-proof-label{font-size:15px;color:#dedbff;margin-bottom:18px}
.triangle-post-stats{display:flex;gap:90px;align-items:center}
.triangle-views strong{font-size:clamp(76px,9vw,136px);font-weight:900;line-height:1;display:block;white-space:nowrap}
.triangle-views span{display:block;font-size:20px;margin-top:12px}
.triangle-shares{display:flex;gap:55px}
.triangle-shares p+p{margin:0}
.triangle-shares strong{font-size:46px;font-weight:500;line-height:1.15;display:block}
.triangle-shares span{font-size:15px;display:block;margin-top:8px}
.triangle-stat-image{margin-top:18px;max-width:1050px}
.triangle-stat-image img{width:100%}
.triangle-threshold{background:var(--ink);padding-block:90px 95px}
.triangle-timing{font-size:17px;margin-bottom:25px}
.triangle-threshold h3{font-size:clamp(70px,9.5vw,142px);font-weight:700;line-height:1.1;letter-spacing:0}
.triangle-threshold .triangle-narrative{margin-left:30%;margin-top:45px}
.triangle-voice{padding-block:90px 80px}
.triangle-voice>h3,.triangle-reveal h3{font-size:clamp(42px,5.4vw,80px);font-weight:500;line-height:1.17;letter-spacing:0}
.triangle-voice>.triangle-narrative{margin-top:35px}
.triangle-dispatch{max-width:790px;margin:70px 0 0 8%}
.dispatch-greeting{font-size:18px;margin-bottom:28px;line-height:1.5}
.triangle-dispatch blockquote{font-size:clamp(32px,4.1vw,61px);font-weight:500;line-height:1.22}
.triangle-dispatch>blockquote+p{font-size:19px;line-height:1.65;max-width:640px;margin-top:30px}
.triangle-dispatch--waiting{margin-left:28%;margin-top:85px}
.triangle-reveal{background:var(--ink);padding-top:80px}
.triangle-reveal h3{font-size:clamp(75px,10.5vw,160px);font-weight:700}
.triangle-reveal .triangle-narrative{margin-left:20%;margin-top:35px;padding-bottom:55px}
.triangle-reveal-photo{margin:0;max-width:1800px;margin-inline:auto}
.triangle-reveal-photo img{width:100%;aspect-ratio:1.6;object-fit:cover;object-position:center 42%}
.triangle-outro{padding-top:50px}
.triangle-role{max-width:800px;font-size:20px;line-height:1.65}
.triangle-outro .triangle-gallery{margin-top:45px}
@media(max-width:1100px){
  .triangle-post-stats{gap:55px}
  .triangle-shares{gap:35px}
  .triangle-shares strong{font-size:39px}
  .triangle-origin-copy .triangle-narrative{margin-left:12%}
  .triangle-threshold .triangle-narrative{margin-left:18%}
  .triangle-dispatch--waiting{margin-left:20%}
}
@media(max-width:767px){
  .voice-transition{padding-block:65px 70px}
  .transition-inner{gap:25px}
  .transition-mark{width:85px}
  .transition-inner h2{font-size:clamp(31px,8.8vw,58px);line-height:1.25}
  .transition-inner .transition-greeting>p{font-size:13px;max-width:290px;margin:24px auto 0}
  .triangle-case{padding-block:55px 40px}
  .triangle-prologue .project-label{font-size:12px;margin-bottom:24px}
  .triangle-prologue h2{font-size:clamp(34px,9.4vw,66px);line-height:1.18}
  .triangle-lead{font-size:18px;line-height:1.6;margin-top:28px}
  .triangle-origin{margin-top:35px}
  .triangle-map{padding-inline:0}
  .triangle-map figcaption{padding-inline:var(--gap);font-size:11px;margin-top:12px}
  .triangle-origin-copy{margin-top:35px}
  .triangle-pullquote{font-size:clamp(28px,7.6vw,48px);line-height:1.28;margin-left:0}
  .triangle-pullquote br{display:none}
  .triangle-narrative{font-size:17px;line-height:1.7;margin-top:28px}
  .triangle-origin-copy .triangle-narrative{margin-left:0;margin-top:28px}
  .triangle-reading>summary{font-size:14px;gap:15px}
  .triangle-original-text{font-size:16px;padding:25px 20px}
  .triangle-original-text h4{font-size:22px}
  .triangle-evidence{margin-top:45px;margin-bottom:45px}
  .triangle-proof-label{font-size:13px}
  .triangle-post-stats{display:block}
  .triangle-views strong{font-size:clamp(67px,19vw,110px)}
  .triangle-views span{font-size:17px;margin-top:8px}
  .triangle-shares{gap:35px;margin-top:28px}
  .triangle-shares strong{font-size:35px}
  .triangle-shares span{font-size:12px}
  .triangle-threshold{padding-block:60px}
  .triangle-timing{font-size:14px;margin-bottom:22px}
  .triangle-threshold h3{font-size:clamp(57px,15vw,98px);line-height:1.15}
  .triangle-threshold .triangle-narrative{margin-left:0;margin-top:30px}
  .triangle-voice{padding-block:55px}
  .triangle-voice>h3{font-size:clamp(32px,8.5vw,56px);line-height:1.23}
  .triangle-voice>h3 br{display:none}
  .triangle-voice>.triangle-narrative{margin-top:26px}
  .triangle-dispatch,.triangle-dispatch--waiting{margin:45px 0 0}
  .dispatch-greeting{font-size:14px;margin-bottom:20px}
  .triangle-dispatch blockquote{font-size:clamp(28px,7.5vw,47px);line-height:1.3}
  .triangle-dispatch>blockquote+p{font-size:17px;margin-top:22px}
  .triangle-reveal{padding-top:50px}
  .triangle-reveal h3{font-size:clamp(65px,18vw,110px)}
  .triangle-reveal .triangle-narrative{margin-left:0;margin-top:25px;padding-bottom:35px}
  .triangle-reveal-photo img{aspect-ratio:1.1;object-position:center}
  .triangle-outro{padding-top:35px}
  .triangle-role{font-size:17px}
  .triangle-outro .triangle-gallery{margin-top:30px}
}
@media print{
  .triangle-case,.triangle-threshold,.triangle-reveal{background:white;color:black;padding-block:20px}
  .triangle-prologue h2,.triangle-threshold h3,.triangle-voice>h3,.triangle-reveal h3{font-size:26pt!important}
  .triangle-lead,.triangle-narrative,.triangle-role,.triangle-dispatch>blockquote+p{font-size:11pt}
  .triangle-map,.triangle-reveal-photo,.triangle-stat-image{display:none}
  .triangle-origin-copy .triangle-narrative,.triangle-threshold .triangle-narrative,.triangle-reveal .triangle-narrative,.triangle-dispatch,.triangle-dispatch--waiting{margin-left:0}
  .triangle-origin,.triangle-origin-copy,.triangle-voice,.triangle-outro{margin:20px 0;padding:0}
  .triangle-pullquote,.triangle-dispatch blockquote{font-size:18pt}
  .triangle-post-stats{gap:30px}
  .triangle-views strong{font-size:35pt}
  .triangle-shares strong{font-size:24pt}
  .triangle-views span,.triangle-shares span,.triangle-proof-label{font-size:10pt;color:black}
  .triangle-evidence{margin-block:25px}
  .triangle-original-text{padding:15px 0;margin-top:0;font-size:11pt;background:white}
}

/* Real interior sets the scene; the dark overlay keeps the greeting readable. */
.voice-transition{background:linear-gradient(#080d16b8,#080d16cc),url('assets/triangle-interior.jpg') center 55%/cover;min-height:650px;display:flex;align-items:center}
.triangle-lead+.triangle-lead{margin-top:22px}
.triangle-map{max-width:430px;margin-left:max(var(--gap),calc((100% - 1240px)/2));margin-right:auto}
.triangle-voice{position:relative;isolation:isolate}
.triangle-voice::before{content:'▲';position:absolute;right:0;top:65px;font-size:clamp(170px,25vw,370px);line-height:1;color:#ffffff12;z-index:-1}
.triangle-voice>.triangle-narrative{max-width:680px}
.triangle-dispatch{background:var(--paper);color:var(--bar-blue);padding:38px 44px 40px;margin:85px 16% 0 0;max-width:870px;position:relative;box-shadow:14px 14px 0 #08005b}
.dispatch-date{display:flex;justify-content:space-between;gap:20px;font-size:12px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:40px}
.dispatch-greeting{font-size:14px;margin-bottom:25px}
.triangle-dispatch blockquote{font-size:clamp(30px,3.5vw,52px)}
.triangle-dispatch .triangle-original-text{padding-inline:0}
.triangle-dispatch--waiting{background:transparent;color:var(--paper);box-shadow:none;border-left:2px solid #ffffff80;padding:20px 0 20px 45px;margin:100px 0 0 30%;max-width:790px}
.triangle-dispatch--waiting .triangle-original-text{padding:25px;color:var(--ink)}
.triangle-results{padding-block:85px 30px}
.triangle-results>h3{font-size:clamp(40px,6vw,88px);line-height:1.15;font-weight:500;margin-top:25px}
.triangle-results-main{display:flex;gap:9%;align-items:end;margin-top:55px}
.result-number{font-size:clamp(75px,10vw,150px);line-height:1;font-weight:700;white-space:nowrap}
.result-number>span{display:block;font-size:17px;font-weight:400;line-height:1.5;margin-top:20px;white-space:normal}
.result-context{max-width:380px;font-size:20px;line-height:1.65;padding-bottom:5px}
.triangle-launch-result{display:flex;gap:45px;align-items:center;margin:75px 0 0 20%;max-width:870px}
.launch-rate{font-size:clamp(110px,14vw,200px);line-height:1;font-weight:700;color:#b5ff76}
.launch-rate>span{font-size:.45em;font-weight:400}
.triangle-launch-result h4{font-size:26px;font-weight:500;line-height:1.3;margin-bottom:15px}
.triangle-launch-result div>p{font-size:18px;line-height:1.65}
.triangle-launch-result .result-method{font-size:12px;opacity:.7;margin-top:20px}
.triangle-award{display:flex;align-items:start;gap:65px;background:#b5ff76;color:var(--ink);padding:45px 50px;margin-top:85px}
.award-year{writing-mode:vertical-rl;font-size:42px;line-height:1;transform:rotate(180deg)}
.triangle-award h4{font-size:clamp(35px,4.6vw,68px);font-weight:500;line-height:1.18;margin:25px 0}
.triangle-award div>p:not(.project-label){font-size:18px;line-height:1.6;max-width:600px}
.triangle-award a{display:inline-flex;align-items:center;min-height:44px;margin-top:20px;font-size:14px}
@media(max-width:767px){
 .voice-transition{min-height:470px;background-position:58% center}
 .triangle-map{max-width:240px;margin-left:var(--gap)}
 .triangle-map figcaption{padding-inline:0}
 .triangle-voice::before{top:40px;font-size:180px}
 .triangle-dispatch{padding:28px 22px 25px;margin:45px 8px 0 0;box-shadow:8px 8px 0 #08005b}
 .dispatch-date{font-size:10px;line-height:1.5;gap:10px;margin-bottom:28px}
 .dispatch-date span{max-width:100px;text-align:right}
 .triangle-dispatch blockquote{font-size:clamp(25px,6.7vw,42px);line-height:1.3}
 .triangle-dispatch--waiting{margin:65px 0 0 10px;padding:0 0 0 22px;box-shadow:none}
 .triangle-results{padding-top:55px}
 .triangle-results>h3{font-size:clamp(30px,8vw,52px)}
 .triangle-results-main{display:block;margin-top:35px}
 .result-number{font-size:clamp(65px,20vw,110px)}
 .result-number>span{font-size:15px;margin-top:15px}
 .result-context{font-size:17px;margin-top:25px}
 .triangle-launch-result{display:block;margin:40px 0 0}
 .launch-rate{font-size:110px;margin-bottom:20px}
 .triangle-launch-result h4{font-size:23px}
 .triangle-launch-result div>p{font-size:17px}
 .triangle-award{padding:28px 24px;margin-top:45px;display:block}
 .award-year{writing-mode:horizontal-tb;transform:none;font-size:22px;margin-bottom:25px}
 .triangle-award h4{font-size:clamp(28px,7.6vw,45px);margin-block:20px}
 .triangle-award .project-label{font-size:12px}
 .triangle-award div>p:not(.project-label){font-size:16px}
}
@media print{
 .voice-transition{background:none;min-height:0}
 .triangle-voice::before{display:none}
 .triangle-dispatch,.triangle-dispatch--waiting{box-shadow:none;border:0;padding:0;margin:20px 0;color:black;background:white}
 .triangle-results{padding-block:25px}
 .triangle-results>h3,.triangle-award h4{font-size:26pt}
 .triangle-results-main,.triangle-launch-result,.triangle-award{display:block;margin:20px 0;padding:0;background:white;color:black}
 .result-number,.launch-rate{font-size:35pt;color:black}
 .award-year{writing-mode:horizontal-tb;transform:none;font-size:14pt}
 .result-context,.triangle-launch-result div>p,.triangle-award div>p:not(.project-label){font-size:11pt}
}

/* Fixed offsets keep the loose composition stable when full comments open. */
.blog-scene{position:relative;isolation:isolate;background:#773b52;color:var(--paper);overflow:hidden}
.blog-portrait{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center}
.blog-scene:before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#773b52 0%,#773b52f0 36%,transparent 58%)}
.blog-scene .reader-intro{padding-block:75px 70px;min-height:970px}
.blog-scene .reader-intro h2{font-size:clamp(64px,6.8vw,100px);line-height:1.08}
.blog-scene .blog-position{max-width:43%;font-size:19px;line-height:1.6}
.blog-scene .blog-press{max-width:43%;gap:0 22px}
.reader-composition{row-gap:48px;column-gap:36px}
.reader-comment--lead{grid-column:1/9;grid-row:1;transform:rotate(-1deg)}
.reader-comment--lead strong{font-size:clamp(46px,5.4vw,76px)}
.reader-comment--beautiful{grid-column:10/13;grid-row:1;margin-top:150px;transform:rotate(5deg)}
.reader-comment--beautiful .reader-quote{font-size:clamp(25px,2.4vw,34px)}
.reader-comment--words{grid-column:2/7;grid-row:2;transform:rotate(-3deg)}
.reader-comment--words .reader-quote{font-size:clamp(28px,3vw,43px)}
.reader-comment--ad{grid-column:8/13;grid-row:2;margin-top:110px;transform:rotate(2deg)}
.reader-comment--long{grid-column:1/5;grid-row:3;margin-top:90px;transform:rotate(-2deg)}
.reader-comment--value{grid-column:6/12;grid-row:3;transform:rotate(3deg)}
.reader-comment--value .reader-quote{font-size:clamp(31px,3.5vw,50px)}
.reader-comment--value strong{color:#ffe78c}
.reader-comment--action{grid-column:2/8;grid-row:4;margin-top:0;transform:rotate(-1deg)}
.reader-comment--voice{grid-column:9/13;grid-row:4;margin-top:125px;transform:rotate(3deg)}
.reader-comment--city{grid-column:4/12;grid-row:5;margin-top:0;transform:rotate(-2deg)}
@media(max-width:1100px){
 .blog-scene .reader-intro{min-height:0;padding-block:60px 25px}
 .blog-scene .reader-intro h2{font-size:clamp(54px,8vw,86px)}
 .blog-scene .blog-position,.blog-scene .blog-press{max-width:760px}
 .blog-portrait{position:relative;z-index:0;display:block;inset:auto;object-fit:cover;object-position:right bottom;height:auto;aspect-ratio:1.5;order:2;mask-image:linear-gradient(to bottom,transparent,#000 12%)}
 .blog-scene{display:flex;flex-direction:column}
 .blog-scene:before{display:none}
 .reader-comment--beautiful{grid-column:10/13;margin-top:110px}
 .reader-composition{column-gap:26px}
}
@media(max-width:767px){
 .blog-scene .reader-intro{padding-block:50px 20px}
 .blog-scene .reader-intro h2{font-size:clamp(48px,13vw,78px)}
 .blog-scene .blog-position{max-width:none;font-size:17px}
 .blog-scene .blog-press{max-width:none}
 .blog-portrait{height:auto;aspect-ratio:1.05;object-fit:cover;object-position:right bottom}
 .reader-composition{row-gap:48px;padding-inline:32px}
 .reader-comment{grid-column:1;grid-row:auto;margin:0;transform:none;padding:0}
 .reader-comment--beautiful{max-width:82%;margin-left:15%;transform:rotate(3deg)}
 .reader-comment--beautiful .reader-quote{font-size:29px}
 .reader-comment--words{padding-right:15px;transform:rotate(-1deg)}
 .reader-comment--words .reader-quote{font-size:29px}
 .reader-comment--ad{margin-left:12px}
 .reader-comment--long{max-width:90%;transform:rotate(-2deg)}
 .reader-comment--value{padding-left:12px;transform:rotate(1deg)}
 .reader-comment--value .reader-quote{font-size:clamp(28px,8vw,40px)}
 .reader-comment--voice{padding-left:22px;transform:rotate(2deg)}
 .reader-comment--lead strong{font-size:clamp(30px,9vw,48px)}
}
@media print{
 .blog-scene{background:white;color:black;display:block}
 .blog-scene:before,.blog-portrait{display:none}
 .blog-scene .reader-intro{min-height:0;padding-block:25px}
 .blog-scene .blog-position,.blog-scene .blog-press{max-width:none}
 .reader-comment{transform:none;margin:0 0 25px;padding:0;max-width:none}
 .reader-comment--lead strong,.reader-comment--beautiful .reader-quote,.reader-comment--words .reader-quote,.reader-comment--value .reader-quote{font-size:16pt}
}

.triangle-award{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(200px,27%);gap:40px;align-items:center}
.triangle-award .award-photo{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;display:block}
.triangle-award h4{font-size:clamp(30px,3.8vw,56px)}
.tradein-case h2>.phone-route{color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:.28em;font-size:.74em}
.phone-arrow{color:var(--blue);font-weight:400}
@media(max-width:1000px){.triangle-award{grid-template-columns:auto minmax(0,1fr);gap:30px}.triangle-award .award-photo{grid-column:2;max-width:320px}.tradein-case h2>.phone-route{flex-wrap:wrap}}
@media(max-width:767px){.triangle-award{display:block}.triangle-award .award-photo{max-width:none;margin-top:28px}.tradein-case h2>.phone-route{display:block;font-size:1em}.phone-arrow{display:block;font-size:.9em;line-height:1.1;margin-block:.15em;transform:rotate(90deg);transform-origin:22px center}}
@media print{.triangle-award{display:block}.triangle-award .award-photo{display:none}.tradein-case h2>.phone-route{display:block}.phone-arrow{display:inline;transform:none}}
@media(max-width:767px){.phone-arrow{width:1em;transform-origin:center}}
.phone-question{display:block;margin-top:.35em}

/* One decorative mark follows the scroll; its source link stays accessible. */
.hero-teaser svg.hero-mark{display:block;filter:none;color:var(--paper)}
.flight-enabled .hero-teaser>.hero-mark{opacity:0}
.logo-flight{position:fixed;top:0;left:0;z-index:20;pointer-events:none;color:var(--paper);transform-origin:center;will-change:transform;visibility:hidden}
.logo-flight>svg{display:block;width:100%;height:100%;overflow:visible}
.logo-flight .flight-silhouette{stroke:#161616;stroke-width:8;paint-order:stroke;stroke-opacity:var(--flight-stroke,0)}
.flight-enabled .contact-actions{padding-top:62px}
@media(max-width:767px){.hero-teaser{justify-self:end}}
@media(prefers-reduced-motion:reduce){.logo-flight{display:none}.flight-enabled .hero-teaser>.hero-mark{opacity:1}.flight-enabled .contact-actions{padding-top:0}}
@media print{.logo-flight{display:none!important}.flight-enabled .contact-actions{padding-top:0}}

/* Overscan keeps the photo inside the screen throughout its slower scroll. */
.voice-transition{position:relative;isolation:isolate;overflow:hidden;background:var(--ink)}
.voice-transition::before{content:'';position:absolute;inset:-90px 0;z-index:-1;background:linear-gradient(#080d16b8,#080d16cc),url('assets/triangle-interior.jpg') center 55%/cover;transform:translate3d(0,var(--bar-parallax,0px),0)}
@media(max-width:767px){.voice-transition::before{inset:-50px 0;background-position:58% center}}
@media(prefers-reduced-motion:reduce){.voice-transition::before{transform:none}}
@media print{.voice-transition::before{display:none}}

/* Nine source letters retain the original reading order; the rest stays accessible. */
.hero h1 .hero-second{font-size:clamp(36px,6.1vw,95px);overflow-wrap:anywhere}
.blog-morph-enabled.blog-scene{overflow:clip}
.blog-morph-enabled .blog-scroll{position:relative;display:flow-root;margin-top:28px;height:var(--morph-height)}
.blog-morph-enabled .blog-position{position:sticky;top:var(--morph-top,24px);margin-top:0}
.blog-morph-enabled .blog-portrait{height:970px;mask-image:linear-gradient(#000 80%,transparent)}
.blog-letters{position:absolute;inset:0;pointer-events:none;opacity:0}
.blog-letter{position:absolute;left:0;top:0;line-height:1.15;white-space:pre;transform-origin:0 0}
.blog-letter-ruler{position:absolute;display:flex;visibility:hidden;pointer-events:none;left:0;top:0;font-weight:900;line-height:1.15;white-space:nowrap}
.blog-position:focus-within .blog-mask,.blog-position:focus-within .blog-pick{opacity:1!important}
.blog-position:focus-within .blog-letters{opacity:0!important}
.blog-morphing .blog-position a{pointer-events:none}
.blog-morphing .blog-position:focus-within a{pointer-events:auto}
@media(max-width:1100px){.blog-morph-enabled .blog-portrait{height:auto;mask-image:linear-gradient(to bottom,transparent,#000 12%)}}
@media(max-width:767px){.hero h1 .hero-second{font-size:clamp(27px,7.8vw,56px)}}
@media print{
 .blog-morph-enabled .blog-scroll{height:auto!important}
 .blog-morph-enabled .blog-position{position:static}
 .blog-mask,.blog-pick{opacity:1!important}
 .blog-letters,.blog-letter-ruler{display:none!important}
}

.hero-address{white-space:nowrap}
@media(max-width:360px){.hero-address{font-size:11px}}