/* Compact editorial rhythm on screen; print keeps its dedicated page layout. */
@media screen {
 html{scroll-padding-top:76px}
 .portfolio>section{padding:36px max(28px,calc((100% - 1120px)/2));min-height:0;scroll-margin-top:76px}
 .page-bridge{max-width:1120px;margin-top:24px;padding-top:8px;gap:16px}
 .portfolio>.cover{min-height:0;height:clamp(480px,78svh,720px);padding-top:92px;padding-bottom:18px;justify-content:flex-start}
 .cover-title{margin:clamp(30px,7svh,65px) 0 0;width:max-content;max-width:100%}
 .cover h1{font-size:clamp(80px,10.5vw,142px)}
 .cover .signature{font-size:clamp(48px,5.5vw,72px);margin:24px 0 auto;padding:0 8px;line-height:1.2}
 .cover .creator-label{font-size:clamp(16px,1.7vw,22px)}
 .cover .cover-art{width:clamp(160px,18vw,230px);right:max(30px,calc((100% - 1120px)/2));bottom:100px}
 .cover-footer{max-width:1120px;margin-top:24px;font-size:12px}
 .cover>.page-bridge{margin-top:14px}
 .cover-meta{max-width:1176px;padding:8px 28px}
 .portfolio>.about-page{min-height:0}
 .about-layout{max-width:1120px;grid-template-columns:.7fr 1fr;gap:6%;flex:none}
 .about-photo.portrait-filled{min-height:0;height:clamp(360px,52svh,460px);max-width:380px;border-radius:130px 130px 20px 20px}
 .about-text h2{font-size:clamp(32px,3.2vw,44px);margin:14px 0 14px}
 .about-lead{font-size:18px;margin:0 0 14px}
 .about-description{margin:0;line-height:1.6}
 .cv-education{margin-top:18px;padding-top:14px}
 .cv-education .verbatim-copy{margin:10px 0 0;line-height:1.55}
 .portfolio>.toolkit-page{min-height:0;display:flex}
 .toolkit-editorial .skill-full{flex:none;padding:36px max(28px,calc((100% - 1120px)/2)) 20px}
 .toolkit-editorial .tools-full{padding:4px max(28px,calc((100% - 1120px)/2)) 0}
 .toolkit-inner{max-width:1120px}
 .toolkit-editorial .toolkit-heading{margin-bottom:20px}
 .toolkit-editorial .toolkit-heading h2,.cv-section-heading h2{font-size:34px;letter-spacing:-1px}
 .skill-module{padding:22px 26px}
 .skill-symbol{margin-bottom:16px}
 .skill-symbol .line-art{width:42px;height:42px}
 .skill-module h3{font-size:20px;margin-bottom:12px}
 .toolkit-editorial .skill-module .verbatim-copy{font-size:16px;line-height:1.6}
 .tools-layout{grid-template-columns:140px 1fr;gap:24px}
 .toolkit-editorial .tools-full h2{font-size:34px}
 .app-dock{padding:18px;gap:18px;border-radius:24px}
 .app-tile{gap:10px}
 .app-icon{width:68px;height:68px;border-radius:19px}
 .app-icon img{width:42px;height:42px}
 .toolkit-page>.page-bridge{width:min(1120px,calc(100% - 56px));margin:24px auto 18px}
 .cv-section-heading{margin-bottom:24px}
 .cv-section-heading>.line-art,.heading-doodle .line-art{width:40px;height:40px}
 .research-illustration{height:130px}
 .research-illustration>.line-art{width:76px;height:76px}
 .research-caption{padding:18px 20px 22px}
 .research-caption h3{font-size:18px;margin-top:14px;line-height:1.5}
 .research-file:nth-child(2){transform:translateY(10px)}
 .activity-stories{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
 .activity-1{grid-row:auto}
 .activity-art,.activity-2 .activity-art,.activity-3 .activity-art{height:95px}
 .activity-art>.line-art,.activity-2 .activity-art>.line-art,.activity-3 .activity-art>.line-art{width:64px;height:64px}
 .activity-copy{padding:20px}
 .activity-copy h3{font-size:22px;margin-bottom:12px}
 .activity-copy .verbatim-copy{font-size:16px;line-height:1.55;margin:14px 0 0}
 .activities-editorial .cv-certifications{padding:16px 24px;margin-top:20px;gap:20px}
 .certificate-seal{width:60px;height:60px}
 .certificate-seal .line-art{width:38px;height:38px}
 .cv-certifications h2{font-size:18px;margin-bottom:6px}
 .cv-certifications .verbatim-copy{line-height:1.5}
 .case-intro{gap:40px;grid-template-columns:1.1fr 1fr;align-items:start}
 .case .script{font-size:66px}
 .case-intro h3{font-size:23px;margin:18px 0 10px}
 .case-intro p,.case-intro li{font-size:16px;line-height:1.55}
 .case-intro p{margin:12px 0}
 .case-label{margin-bottom:8px}
 .case-media-preview{padding-top:0;gap:20px}
 .case-media-preview .case-video-frame{width:230px;max-width:230px;flex-basis:56%;margin:0}
 .case-media-preview .case-image-frame{width:170px;max-width:170px;flex-basis:42%;margin-top:48px}
 .portfolio>.video-workflow-page{min-height:0;padding-top:30px}
 .video-workflow-heading{margin:26px auto 30px}
 .video-workflow-heading h2{font-size:36px;margin-bottom:16px}
 .video-workflow-steps{padding-bottom:12px}
 .workflow-step p{line-height:1.6}
 .result-card{padding:20px}
 .analytics-row>div{min-height:100px}
 .draft-note{margin-top:20px}
 .visuals>.script{font-size:60px}
 .group-title{margin:24px 0 20px}
 .visual-grid,.ugc-grid{gap:36px}
 .ugc .phone-row{max-width:220px}
 .portfolio>.contact{min-height:0;padding-top:46px}
 .contact h2{font-size:64px}
 .contact-footer{margin-top:36px}
}
@media screen and (min-width:1001px){
 .experience-timeline{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:28px}
 .experience-timeline::before{left:0;right:0;top:53px;bottom:auto;width:auto;height:1px}
 .timeline-entry{display:grid;grid-template-columns:1fr;grid-template-rows:26px 56px auto;gap:0;padding:0;align-content:start}
 .timeline-date{padding:0;font-size:13px}
 .timeline-node{grid-column:1;grid-row:2;width:56px;height:56px}
 .timeline-body{grid-column:1;grid-row:3;padding:12px 0 0;margin:0;border:0;border-radius:0}
 .timeline-body h3{font-size:23px;line-height:1.3;margin:0 0 10px;letter-spacing:-.5px}
 .timeline-body .cv-role{font-size:15px;margin:0 0 16px}
 .timeline-body h4{font-size:14px;margin:16px 0 8px}
 .timeline-body .verbatim-copy{font-size:16px;line-height:1.55;margin:0 0 12px;white-space:normal}
 .timeline-entry:hover .timeline-body{transform:none;background:none}
}
@media screen and (max-width:1000px){
 .portfolio>section{padding:32px 28px}
 .activity-stories{grid-template-columns:1fr 1fr}
 .activity-1{grid-row:span 2}
 .timeline-entry{padding-bottom:20px}
 .timeline-body{padding-top:0;padding-bottom:16px}
 .timeline-body .verbatim-copy{white-space:normal;line-height:1.55;margin:12px 0}
}
@media screen and (max-width:767px){
 .portfolio>section{padding:32px 24px}
 .portfolio>.cover{height:auto;min-height:540px;padding-top:80px;padding-bottom:18px}
 .cover-title{margin:70px 0 0}
 .cover h1{font-size:clamp(60px,16.7vw,110px)}
 .cover .signature{font-size:clamp(42px,10vw,62px);margin:28px 0 100px;text-align:left}
 .cover .cover-art{width:150px;right:24px;bottom:134px}
 .cover-footer{margin:20px 0 0;gap:10px;font-size:12px}
 .cover-footer .view-work{min-height:44px;padding:9px 18px}
 .about-layout{grid-template-columns:1fr;gap:24px}
 .about-photo.portrait-filled{height:380px;width:100%;max-width:340px;border-radius:120px 120px 18px 18px;margin:auto}
 .about-text h2{font-size:34px}
 .toolkit-editorial .skill-full{padding:32px 24px 20px}
 .toolkit-editorial .toolkit-heading{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
 .toolkit-editorial .tools-full{padding:4px 24px 0}
 .skill-module{padding:22px}
 .tools-layout{display:block}
 .toolkit-editorial .tools-full h2{margin-bottom:16px}
 .app-dock{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:20px}
 .toolkit-page>.page-bridge{width:calc(100% - 48px);margin:24px auto 18px}
 .research-file:nth-child(2){transform:none}
 .activity-stories{grid-template-columns:1fr}
 .activity-1{grid-row:auto}
 .activity-art,.activity-2 .activity-art,.activity-3 .activity-art{height:100px}
 .case-intro{grid-template-columns:1fr;gap:24px}
 .case-media-preview{max-width:420px;margin:auto;gap:14px}
 .case-media-preview .case-image-frame{margin-top:40px}
 .video-workflow-heading h2{font-size:30px}
 .video-workflow-heading{margin:24px auto}
 .contact h2{font-size:clamp(40px,10vw,60px)}
 .contact-footer{flex-wrap:wrap;gap:24px}
 .cv-section-heading h2{font-size:28px}
}
@media screen and (min-width:1001px){
 .portfolio>section:not(.cover):not(.toolkit-page){padding-top:28px;padding-bottom:24px}
 .experience-timeline{grid-template-columns:1fr 1fr 1.6fr;gap:24px}
 .timeline-body h3{font-size:22px}
 .timeline-body .cv-role{margin-bottom:10px}
 .timeline-body h4{margin:12px 0 6px}
 .timeline-body .verbatim-copy{line-height:1.5;margin-bottom:8px}
 .activity-stories{grid-template-columns:1.25fr 1fr 1fr}
 .activity-art,.activity-2 .activity-art,.activity-3 .activity-art{height:62px}
 .activity-art>.line-art,.activity-2 .activity-art>.line-art,.activity-3 .activity-art>.line-art{width:44px;height:44px}
 .activity-copy{padding:18px}
 .activity-copy .verbatim-copy{line-height:1.5}
 .activities-editorial .cv-certifications{padding:12px 20px;margin-top:16px}
 .cv-certifications .verbatim-copy{margin:0;font-size:16px;line-height:1.5}
 .cv-certifications h2{font-size:17px;margin:0 0 4px}
 .certificate-seal{width:48px;height:48px}
 .certificate-seal .line-art{width:30px;height:30px}
 .portfolio>.video-workflow-page{padding-top:24px}
 .workflow-page-meta{padding-bottom:12px}
 .video-workflow-heading{margin:18px auto 24px}
 .video-workflow-heading h2{font-size:32px;margin-bottom:12px}
 .workflow-step p{line-height:1.5}
 .workflow-step h3{margin-bottom:12px}
 .ugc .product-grid{max-width:360px}
 .ugc .group-title{margin:18px 0 14px}
 .ugc .phone-row{max-width:200px}
}

@media screen and (min-width:1001px){.video-workflow-heading{margin:12px auto 16px}.ugc .product-grid{max-width:320px}.ugc .phone-row{max-width:180px}}
@media screen{.portfolio>section[id]{scroll-margin-top:0}}
@media screen and (min-width:1001px){.portfolio>section:not(.cover):not(.toolkit-page){padding-bottom:20px}#case-study-02{scroll-margin-top:0}}
/* One shared vertical canvas, with white space outside the portfolio. */
@media screen{
 body{background:#fff;padding:0}
 .portfolio{width:min(1200px,calc(100% - 48px));max-width:1200px;margin:0 auto;border-left:1px solid var(--line);border-right:1px solid var(--line)}
 .portfolio>.cover .cover-meta{width:min(1200px,calc(100% - 48px));max-width:1200px;left:0;right:0;padding-inline:max(28px,calc((100% - 1120px)/2));border-left:1px solid var(--line);border-right:1px solid var(--line)}
}
@media screen and (max-width:767px){
 .portfolio{width:calc(100% - 24px)}
 .portfolio>.cover .cover-meta{width:calc(100% - 24px);padding-inline:8px}
 .cover-navigation a{padding-inline:8px}
}
@media screen and (max-width:360px){
 .portfolio{width:calc(100% - 16px)}
 .portfolio>.cover .cover-meta{width:calc(100% - 16px);padding-inline:4px}
 .cover-navigation a{padding-inline:6px;font-size:12px}
}
/* Header width and padding must stay independent of the outer viewport. */
@media screen{
 .portfolio>.cover .cover-meta{box-sizing:border-box;padding-inline:38px;display:flex;justify-content:space-between;gap:24px}
 .cover-meta>span{white-space:nowrap;flex:0 0 auto}
 .cover-navigation{flex:0 0 auto;flex-wrap:nowrap}
 .cover-navigation a{white-space:nowrap;flex:0 0 auto}
}
@media screen and (max-width:767px){
 .portfolio>.cover .cover-meta{padding-inline:8px;gap:0;justify-content:center}
 .cover-navigation{width:100%;max-width:500px;flex:1 1 auto;justify-content:space-between;gap:2px}
}
@media screen and (max-width:360px){.portfolio>.cover .cover-meta{padding-inline:4px}}
@media screen and (min-width:1001px){
 #case-study-02 .case-intro{grid-template-columns:1.4fr 1fr;gap:32px}
 #case-study-02 .script{font-size:54px}
 #case-study-02 .case-intro h3{font-size:21px;margin:14px 0 8px}
 #case-study-02 .case-intro p,#case-study-02 .case-intro li{line-height:1.5}
 #case-study-02 .case-intro p{margin:8px 0}
 #case-study-02 .case-intro ul{margin:8px 0}
 #case-study-02 .project-type{font-size:14px;line-height:1.5;padding-top:4px}
 #case-study-02 .case-media-preview{padding-top:20px;gap:16px}
}
@media screen and (min-width:1001px){
 #case-study-02{padding-top:24px;padding-bottom:16px}
 #case-study-02 .case-intro{grid-template-columns:2fr 1fr;gap:24px}
 #case-study-02 .script{display:inline-block;vertical-align:middle;margin-right:14px;font-size:48px}
 #case-study-02 .pill{vertical-align:middle}
 #case-study-02 .case-media-preview{gap:12px;padding-top:22px}
 #case-study-02 .case-video-frame{max-width:200px}
 #case-study-02 .case-image-frame{max-width:140px}
 #case-study-02>.page-bridge{margin-top:16px}
}
#case-study-02 .case-intro p{text-wrap:pretty}
@media screen and (min-width:1001px){#case-study-02{padding-top:20px;padding-bottom:12px}#case-study-02>.page-bridge{margin-top:12px}}
#work .case-intro p{text-wrap:pretty}
#work .pill{max-width:100%;white-space:normal;line-height:1.5}
@media screen and (min-width:1001px){
 #work{padding-top:20px;padding-bottom:12px}
 #work .case-intro{grid-template-columns:2fr 1fr;gap:24px}
 #work .script{font-size:48px;display:inline-block;vertical-align:middle;margin-right:14px}
 #work .pill{vertical-align:middle;font-size:15px;max-width:calc(100% - 90px)}
 #work .case-intro h3{font-size:21px;margin:14px 0 8px}
 #work .case-intro p,#work .case-intro li{line-height:1.5}
 #work .case-intro p{margin:8px 0}
 #work .case-intro ul{margin:8px 0}
 #work .project-type{font-size:14px;line-height:1.5;padding-top:4px}
 #work .case-media-preview{gap:12px;padding-top:22px}
 #work .case-video-frame{max-width:200px}
 #work .case-image-frame{max-width:140px}
 #work>.page-bridge{margin-top:12px}
}