:root{--deep:#0c0c0d;--ice:#d7e2ea;--soft-ice:#a8b6c0;--stroke:#30373d;--frost-grad:linear-gradient(180deg,#68707e 0%,#d7e2ea 90%);--magenta-grad:linear-gradient(123deg,#18011f 7%,#b600a8 37%,#7621b0 72%,#be4c00 100%)}
html{background:var(--deep)}
body{background:var(--deep);color:var(--ice);font-family:'Kanit',Arial,sans-serif;font-weight:400}
.page-shell{overflow:clip}
main{display:flex;flex-direction:column;overflow:visible}
main>.hero{order:1}main>.marquee-section{order:2}main>.discipline-strip{display:none}main>.about-section{order:3}main>.services-section{order:4}main>.work-section{order:5}main>.two-sides{order:6}main>.contact-section{order:7}
.site-header{height:88px;max-width:none;padding:0 4vw;border-bottom:1px solid #202428;position:relative;z-index:30;background:var(--deep)}
.brand-mark{background:transparent;color:var(--ice);width:48px;height:46px;font-size:35px;font-family:'Kanit',sans-serif;letter-spacing:-.08em}
.brand-name{color:#cbd7df;font-size:10px;letter-spacing:.07em}
.brand-dot{color:#cc9beb}
.main-nav{gap:clamp(24px,4.7vw,76px)}
.main-nav a{color:var(--ice);font:500 12px 'Kanit',sans-serif;letter-spacing:.1em}
.main-nav a span{color:#f189dd}
.nav-cta,.hero-contact{border:1px solid rgba(255,255,255,.58);background:var(--magenta-grad);box-shadow:inset 2px 2px 12px rgba(245,140,252,.19),0 8px 24px rgba(121,41,161,.19);color:#fff;border-radius:50px;min-width:140px;padding:13px 22px;display:inline-flex;justify-content:center;align-items:center;gap:18px;font:500 12px 'Kanit',sans-serif;letter-spacing:.09em;transition:transform .25s,box-shadow .25s}
.nav-cta:hover,.hero-contact:hover{background:var(--magenta-grad);transform:translateY(-3px);box-shadow:0 12px 35px rgba(168,30,173,.4)}
.skip-link{background:#f7a9e7;color:#111}
.portrait-hero{max-width:none;width:100%;min-height:max(690px,calc(100svh - 88px));padding:0 4vw;position:relative;display:flex;flex-direction:column;isolation:isolate;overflow:hidden}
.portrait-hero::before{content:'';position:absolute;inset:6% 0 0;pointer-events:none;z-index:-2;background:radial-gradient(ellipse at 50% 43%,rgba(90,67,112,.09),transparent 55%)}
.portrait-hero .hero-topline{color:#8d969e;padding:18px 0;font:10px/1.5 var(--mono);letter-spacing:.075em}
.portrait-hero .availability-dot{background:#b5acdb;border-color:#b5acdb;box-shadow:0 0 10px rgba(172,116,231,.4)}
.hero-heading-mask{position:relative;padding-top:min(8vh,95px);width:100%;z-index:1;overflow:visible}
.portrait-hero h1{font-family:'Kanit',sans-serif;font-size:clamp(58px,13.25vw,235px);font-weight:900;line-height:.86;letter-spacing:-.078em;text-align:center;white-space:nowrap;margin:0;background:var(--frost-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--ice)}
.portrait-hero h1>span{display:inline!important;white-space:nowrap}
.portrait-hero h1 .hero-period{padding-left:0;background:linear-gradient(160deg,#e7a6ff,#a156ca);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.portrait-wrap{width:clamp(390px,43vw,660px);aspect-ratio:1/1;position:absolute;z-index:6;left:50%;top:53%;transform:translate(-50%,-50%);touch-action:pan-y;user-select:none;cursor:grab}
.portrait-wrap.dragging{cursor:grabbing;touch-action:none}
.portrait-aura{position:absolute;z-index:-1;inset:13%;border-radius:50%;background:radial-gradient(circle,rgba(130,78,143,.17),rgba(26,29,33,.04) 70%);filter:blur(18px)}
.portrait-inner{position:absolute;inset:0;filter:drop-shadow(0 28px 16px rgba(0,0,0,.35));transition:transform .15s ease-out;will-change:transform}
.portrait-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none;-webkit-user-drag:none}
.portrait-wrap.fallback-motion .portrait-image{animation:head-float 5.8s ease-in-out infinite}
@keyframes head-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
#portraitCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity .3s}
.portrait-wrap.has-webgl #portraitCanvas{opacity:1}
.portrait-wrap.has-webgl .portrait-image{visibility:hidden}
.portrait-hint{position:absolute;bottom:4%;right:-16%;font:10px var(--mono);letter-spacing:.09em;color:#7f8993;transform:rotate(-8deg);pointer-events:none}
.hero-bottom-bar{position:absolute;bottom:82px;left:4vw;right:4vw;display:flex;align-items:end;justify-content:space-between;z-index:3;gap:24px}
.hero-identity-index{display:block;font:10px var(--mono);color:#77828c;letter-spacing:.09em;margin-bottom:22px}
.hero-identity p{font-size:clamp(14px,1.5vw,20px);line-height:1.3;font-weight:300;letter-spacing:.05em;color:var(--ice);margin:0}
.hero-contact{padding:19px 35px;font-size:14px;font-weight:600;min-width:190px;align-self:end}
.hero-contact span{font-size:23px;line-height:1}
.hero-scroll-cue{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;font:10px var(--mono);letter-spacing:.07em;color:#88939a}
.hero-scroll-cue span{font:21px 'Kanit';animation:arrow-nudge 2s ease-in-out infinite}
/* The moving image-wall narrative from the reference film, using Vedang's own projects. */
.marquee-section{padding:80px 0 108px;background:var(--deep);position:relative;overflow:hidden}
.marquee-heading{display:flex;justify-content:space-between;align-items:end;padding:0 4vw 30px;gap:28px;color:#89949a}
.marquee-heading p{font-size:clamp(19px,3vw,41px);font-weight:700;line-height:1.08;letter-spacing:-.04em;color:#d4dee6;margin:0}
.marquee-heading span{font:10px var(--mono);letter-spacing:.06em}
.marquee-row{overflow:hidden;margin-bottom:14px}
.marquee-track{display:flex;gap:14px;width:max-content;will-change:transform;transform:translate3d(-18%,0,0)}
.marquee-tile{width:clamp(280px,31vw,440px);height:clamp(190px,20vw,288px);border-radius:26px;position:relative;overflow:hidden;flex-shrink:0;border:1px solid rgba(255,255,255,.08);display:block;transition:filter .25s}
.marquee-tile:hover{filter:brightness(1.12)}
.marquee-tile::before{content:'';position:absolute;inset:0;opacity:.9}
.marquee-tile::after{content:'↗';position:absolute;right:20px;top:14px;font-size:34px;font-weight:300}
.marquee-tile span{position:absolute;left:24px;top:18px;font:10px var(--mono);letter-spacing:.06em;z-index:1}
.marquee-tile strong{position:absolute;left:24px;bottom:25px;right:28px;font-size:clamp(35px,4.2vw,68px);font-weight:800;line-height:.92;letter-spacing:-.075em;z-index:1;text-wrap:balance}
.marquee-tile em{position:absolute;width:170px;height:170px;border-radius:44% 56% 40% 60%;right:8%;top:8%;transform:rotate(24deg);opacity:.7;z-index:0}
.marquee-tile[data-cover="sweet"]{color:#6b383b;background:linear-gradient(120deg,#f4c8bf,#ffe6d8)}.marquee-tile[data-cover="sweet"] em{background:#f8b1be}
.marquee-tile[data-cover="pizza"]{color:#4d1c12;background:linear-gradient(135deg,#edb46a,#f5d383)}.marquee-tile[data-cover="pizza"] em{background:#bd3c23;border-radius:50%;box-shadow:0 0 0 22px #d45c2f}
.marquee-tile[data-cover="chai"]{color:#fbdec1;background:linear-gradient(135deg,#75291b,#c34c30)}.marquee-tile[data-cover="chai"] em{background:#d7854c}
.marquee-tile[data-cover="aura"]{color:#e7e8e2;background:linear-gradient(135deg,#202c28,#070a09)}.marquee-tile[data-cover="aura"] em{background:#667b71}
.marquee-tile[data-cover="market"]{color:#d3fd5b;background:linear-gradient(135deg,#142326,#061115)}.marquee-tile[data-cover="market"] em{background:#22605f;border-radius:16%}
.marquee-tile[data-cover="atlas"]{color:#cee5e7;background:linear-gradient(125deg,#102c39,#06111d)}.marquee-tile[data-cover="atlas"] em{background:#1b7380;border-radius:50%;box-shadow:0 0 0 18px rgba(81,162,177,.14)}
/* About: high-contrast type and an individual-character scroll reveal. */
.about-section{background:var(--deep);color:var(--ice);max-width:none;width:100%;min-height:880px;padding:115px 4vw 145px;position:relative;overflow:hidden}
.about-section .section-label{border-color:#30363b;color:#89949b}
.about-grid{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:70px;gap:42px;position:relative;z-index:2}
.about-title-group h2{font:900 clamp(75px,13vw,210px)/.84 'Kanit',sans-serif;letter-spacing:-.075em;text-align:center;background:var(--frost-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.about-title-group h2 .lime-period{-webkit-text-fill-color:#c29ae8;color:#c29ae8}
.about-title-group .eyebrow{margin:0 0 18px;color:#9fa9b3}
.about-scribble{display:none}
.about-body{max-width:750px;margin:auto;padding-top:0;text-align:center}
.about-lead{color:#dae6ec;font:500 clamp(19px,2.7vw,32px)/1.45 'Kanit',sans-serif;letter-spacing:-.025em;margin:0 auto 34px;max-width:680px}
.scroll-copy .scroll-char{color:rgba(210,225,232,calc(.21 + var(--char-progress,0) * .79));transition:color .075s}
.about-body>p:not(.about-lead){color:#8996a0;font:300 clamp(14px,1.5vw,18px)/1.8 'Kanit',sans-serif;max-width:660px;margin:0 auto 38px}
.about-facts{border-top:1px solid #364047;max-width:600px;margin:auto}
.about-facts>div{border-color:#2f383f;grid-template-columns:160px 1fr;text-align:left}
.about-facts span{color:#91a0aa}.about-facts strong{font-weight:500;color:#dde7ed}
.about-decor{position:absolute;font-size:clamp(85px,15vw,240px);line-height:1;opacity:.86;filter:drop-shadow(0 15px 21px rgba(0,0,0,.3));user-select:none;pointer-events:none}
.decor-one{left:4%;top:17%;color:#8d7abd;transform:rotate(-20deg)}
.decor-two{right:5%;top:13%;color:#8962be;transform:rotate(17deg)}
.decor-three{right:9%;bottom:14%;color:#d383a1;transform:rotate(-15deg)}
/* White section with numbered capabilities. */
.services-section{background:#fff;color:#0c0c0c;border-radius:58px 58px 0 0;padding:105px 7vw 175px;position:relative;margin-top:-30px;z-index:2}
.chapter-label{font:10px var(--mono);color:#6b6c6a;letter-spacing:.08em;text-align:center;margin-bottom:22px}
.services-section h2{font:900 clamp(75px,12vw,185px)/.9 'Kanit',sans-serif;letter-spacing:-.078em;text-align:center;margin:0 0 80px}
.services-section h2 span{color:#ae43b5}
.services-list{max-width:1180px;margin:auto;border-top:1px solid #cecece}
.service-item{display:grid;grid-template-columns:170px 1fr 34px;gap:35px;align-items:center;min-height:165px;border-bottom:1px solid #d6d6d6;padding:22px 0}
.service-number{font:900 clamp(64px,8vw,130px)/1 'Kanit',sans-serif;letter-spacing:-.08em}
.service-item h3{font:600 clamp(21px,2.5vw,35px)/1.15 'Kanit',sans-serif;letter-spacing:-.03em;margin:0 0 12px}
.service-item p{font:300 clamp(14px,1.4vw,18px)/1.6 'Kanit',sans-serif;color:#686d6b;max-width:670px;margin:0}
.service-plus{font:34px 'Kanit',sans-serif;color:#8a3f99;align-self:start;padding-top:24px}
/* Projects: large sticky cards that progressively layer as the visitor scrolls. */
.work-section{max-width:none;width:100%;background:var(--deep);color:var(--ice);border-radius:55px 55px 0 0;position:relative;margin-top:-53px;z-index:3;padding:100px 4vw 115px}
.work-section .section-label{border-color:#343b42;color:#95a0a8}
.work-head{padding:59px 0 50px}
.work-head h2{font:900 clamp(75px,12vw,185px)/.87 'Kanit',sans-serif;letter-spacing:-.085em;background:var(--frost-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin:0}
.work-head h2 .lime-period{-webkit-text-fill-color:#bf8fdb;color:#bf8fdb}
.work-head .eyebrow{color:#8f9ca5}.work-head>p{color:#a6b3bc;font:300 clamp(15px,1.5vw,20px)/1.6 'Kanit',sans-serif}
.work-filters{border-color:#323b42;padding-bottom:32px;margin-bottom:35px}
.filter{color:#d1dce2;border-color:#45515a;background:#141719;border-radius:100px;font:500 11px 'Kanit',sans-serif;padding:13px 20px;letter-spacing:.05em}
.filter.active,.filter:hover{background:var(--magenta-grad);color:#fff;border-color:#b66eca}
.project-grid{display:block;max-width:1420px;margin:auto}
.project-card{position:sticky;top:9vh;z-index:var(--stack-index,1);display:grid;grid-template-columns:59% minmax(0,1fr);column-gap:30px;height:min(70vh,650px);min-height:480px;margin-bottom:21vh;border-radius:38px;border:1px solid #76818b;background:#161a1e;padding:28px;box-shadow:0 18px 50px rgba(0,0,0,.55);transform-origin:center top;transform:scale(var(--stack-scale,1));transition:transform .1s linear,border-color .25s}
.project-card:hover{border-color:#c1ced8}
.js .project-card.reveal{opacity:1;transform:scale(var(--stack-scale,1));transition:transform .12s linear,border-color .25s}
.project-card:last-child{margin-bottom:40px}
.project-art{aspect-ratio:auto;height:100%;min-width:0;border-radius:27px}
.project-info{padding:4px 0 6px;display:flex;flex-direction:column;align-items:start;justify-content:space-between;color:#dce7eb}
.project-info>div{display:flex;flex-direction:column;align-items:start;height:100%}
.project-num{color:#9faebb;font:10px var(--mono);margin:0 0 auto}
.project-info h3{font:800 clamp(39px,4.1vw,72px)/.94 'Kanit',sans-serif;letter-spacing:-.07em;margin:0 0 19px;max-width:100%}
.project-info p{font:300 clamp(14px,1.5vw,20px)/1.45 'Kanit',sans-serif;color:#9eabb3;margin:0 0 25px}
.project-tags span{border:1px solid #56626b;border-radius:30px;color:#d9e5e8;padding:9px 12px}
.project-go{position:absolute;right:35px;top:31px;border-color:#7c8b97;color:#e0ebef;width:52px;height:52px}
.project-card:hover .project-go{color:#0c0c0c;background:#d6e2e8;transform:rotate(45deg)}
.work-note{border-color:#303941;color:#8c979e;margin-top:22px}
/* Keep the two distinct career paths readable after the cinematic gallery. */
.two-sides{background:#101214;color:#e5edf1;padding:90px 4vw 110px}
.side-heading h2{font:900 clamp(60px,8vw,135px)/.84 'Kanit',sans-serif;letter-spacing:-.08em}
.side-heading em{color:#ce9beb}
.creative-side{background:#e6f0e6;color:#161e17}.technical-side{background:#2a2837;color:#eef0f6;border-color:#656277}
.side-card h3 span{color:#a438b1}.technical-side h3 span{color:#c38bdf}
.side-card a{font-family:'Kanit',sans-serif}
/* The closing CTA is deliberately clean and high contrast. */
.contact-section{background:#f3f5f4;color:#121416;padding:37px 4vw 25px}
.contact-eyebrow{border-color:#a8aeb0;color:#465058}
.contact-content{padding:95px 0 70px}
.contact-content>p{font-size:11px}
.contact-content h2{font:900 clamp(75px,12.7vw,209px)/.82 'Kanit',sans-serif;letter-spacing:-.085em;margin-bottom:70px}
.contact-period{color:#ad47ba}
.contact-bottom p{font-family:'Kanit',sans-serif;font-weight:500;font-size:19px;max-width:475px}
.contact-back{border-color:#25292b;border-radius:40px;font-family:'Kanit',sans-serif;font-size:12px}
.contact-note{border-color:#c8cbcc;color:#68727a}
.footer{background:#0c0c0c;color:#a2afb7;font-family:'DM Mono',monospace}
.footer a:hover{color:#e6a5fa}
@media(max-width:1100px){.portrait-hero h1{font-size:13.5vw}.portrait-wrap{width:clamp(380px,53vw,590px)}.project-card{grid-template-columns:55% 1fr;padding:20px;gap:22px}.project-info h3{font-size:clamp(37px,4.4vw,54px)}.service-item{grid-template-columns:140px 1fr 24px}.services-section{padding-inline:5vw}}
@media(max-width:790px){.site-header{padding-inline:3vw;height:75px}.main-nav{gap:16px}.main-nav a{font-size:10px}.brand-name{display:none}.brand-mark{width:40px}.portrait-hero{min-height:750px;padding-inline:3vw}.portrait-hero h1{font-size:13.5vw}.hero-heading-mask{padding-top:100px}.portrait-wrap{width:min(570px,69vw);top:49%}.hero-bottom-bar{left:3vw;right:3vw;bottom:84px}.hero-identity p{font-size:15px}.hero-contact{min-width:140px;padding:14px 23px}.about-section{padding-inline:5vw}.about-grid{padding-top:80px}.about-title-group h2{font-size:16vw}.about-decor{opacity:.36}.service-item{grid-template-columns:100px 1fr 20px;gap:22px}.service-number{font-size:70px}.service-item h3{font-size:22px}.project-card{height:560px;min-height:0;grid-template-columns:1fr;grid-template-rows:58% 1fr;margin-bottom:23vh}.project-art{height:100%}.project-info{padding:4px 6px}.project-info h3{font-size:36px;margin-bottom:8px}.project-info p{font-size:14px;margin-bottom:10px}.project-info>div{justify-content:end}.project-num{position:absolute;right:24px;bottom:25px;margin:0}.project-go{top:35px;right:36px}.project-tags{margin:0}.work-head h2{font-size:13vw}}
@media(max-width:590px){.site-header{height:64px;padding-inline:17px}.brand-mark{font-size:28px;width:31px}.main-nav{gap:13px}.main-nav a{font-size:8px}.nav-cta{display:none}.portrait-hero{min-height:700px;padding:0 15px}.portrait-hero .hero-topline{font-size:8px;padding-top:17px}.portrait-hero .hero-edition{display:none}.hero-heading-mask{padding-top:95px}.portrait-hero h1{font-size:14vw;line-height:1.05;letter-spacing:-.07em}.portrait-wrap{width:89vw;max-width:440px;top:46%}.portrait-hint{bottom:4%;right:-3%;font-size:8px}.hero-bottom-bar{left:17px;right:17px;bottom:69px;align-items:end}.hero-identity-index{font-size:8px;margin-bottom:12px}.hero-identity p{font-size:11px;line-height:1.5}.hero-contact{font-size:10px;padding:13px 18px;min-width:0;gap:10px}.hero-contact span{font-size:17px}.hero-scroll-cue{bottom:18px;font-size:8px}.marquee-section{padding:45px 0 76px}.marquee-heading{padding:0 17px 24px}.marquee-heading p{font-size:18px}.marquee-heading span{font-size:8px;align-self:end}.marquee-tile{width:270px;height:185px;border-radius:19px}.marquee-tile strong{font-size:39px}.about-section{min-height:710px;padding:80px 17px 100px}.about-grid{gap:35px}.about-title-group h2{font-size:21vw}.about-lead{font-size:21px}.about-body>p:not(.about-lead){font-size:14px}.about-facts>div{grid-template-columns:105px 1fr;gap:13px}.about-decor{font-size:95px;opacity:.2}.services-section{border-radius:35px 35px 0 0;padding:75px 19px 130px}.services-section h2{font-size:18vw;margin-bottom:50px}.service-item{grid-template-columns:69px 1fr;gap:15px;min-height:150px;padding:25px 0}.service-number{font-size:56px}.service-item h3{font-size:18px;margin-bottom:7px}.service-item p{font-size:12px}.service-plus{display:none}.work-section{border-radius:35px 35px 0 0;padding:78px 17px 90px}.work-head{padding:38px 0}.work-head h2{font-size:17vw}.work-filters{gap:6px}.filter{font-size:9px;padding:10px 12px}.project-card{position:relative;top:auto;height:auto;min-height:0;display:flex;flex-direction:column;padding:12px;border-radius:26px;margin-bottom:25px;transform:none!important;box-shadow:0 8px 30px rgba(0,0,0,.2)}.js .project-card.reveal{transform:none!important}.project-art{height:auto;aspect-ratio:1.46;border-radius:18px}.project-info{padding:22px 10px 10px;display:block}.project-info>div{display:block}.project-num{position:static;display:block;margin-bottom:12px}.project-info h3{font-size:32px}.project-info p{font-size:13px}.project-tags span{font-size:8px}.project-go{top:20px;right:20px;width:39px;height:39px;font-size:20px}.two-sides{padding-inline:17px}.side-heading h2{font-size:15vw}.contact-section{padding:26px 17px 20px}.contact-content{padding:70px 0 45px}.contact-content h2{font-size:14vw}.contact-bottom p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.marquee-track{transform:none!important}.portrait-inner{transition:none!important}.portrait-wrap.fallback-motion .portrait-image{animation:none!important}.project-card,.js .project-card.reveal{transform:none!important;transition:none!important}}

/* Contact links — large, readable targets that complement the editorial contact section. */
.contact-content{padding-bottom:64px}
.contact-content h2{margin-bottom:45px}
.contact-intro{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:34px}
.contact-intro p{max-width:550px;margin:0;font:500 clamp(16px,1.65vw,22px)/1.5 var(--reading-font);letter-spacing:-.015em}
.contact-intro span{font:500 10px/1.5 'DM Mono',monospace;letter-spacing:.08em;white-space:nowrap}
.contact-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:58px}
.contact-link{position:relative;min-width:0;min-height:168px;padding:24px 22px;background:#111416;color:#f5f6f6;border:1px solid #111416;border-radius:17px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;transition:transform .25s ease,background .25s ease,box-shadow .25s ease}
.contact-link-label{font:500 10px/1.4 'DM Mono',monospace;letter-spacing:.09em;color:#bbc2c2}
.contact-link strong{font:600 clamp(15px,1.65vw,23px)/1.22 var(--reading-font);overflow-wrap:anywhere;max-width:calc(100% - 14px);letter-spacing:-.035em}
.contact-link-arrow{position:absolute;right:20px;top:17px;font-size:24px;line-height:1}
.contact-link-whatsapp{background:#e6c4f1;color:#18131b;border-color:#c28ed3}
.contact-link-whatsapp .contact-link-label{color:#5e346d}
.contact-link:hover{transform:translateY(-6px);box-shadow:0 14px 24px rgba(16,18,19,.14)}
.contact-link:focus-visible{outline:3px solid #9228bb;outline-offset:4px}
.contact-bottom{padding-top:23px;border-top:1px solid #c8cbcc}
.contact-note{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media(max-width:790px){.contact-links{grid-template-columns:1fr;gap:10px}.contact-link{min-height:125px;gap:14px}.contact-link strong{font-size:20px}.contact-intro{align-items:start;flex-direction:column;gap:15px}}
@media(max-width:590px){.contact-links{margin-bottom:38px}.contact-link{padding:20px;min-height:120px}.contact-link strong{font-size:19px}.contact-intro{margin-bottom:24px}.contact-intro p{font-size:17px}.contact-content{padding-bottom:42px}}

/* Refinement pass: softer editorial typography, calmer hierarchy, and safe text wrapping. */
:root{--display-font:'Outfit',sans-serif;--reading-font:'DM Sans',sans-serif;--sans:var(--reading-font)}
body{font-family:var(--reading-font);font-weight:400;letter-spacing:0}
.brand-mark{font-family:var(--display-font);font-weight:700;letter-spacing:-.07em}
.brand-name{font-family:var(--reading-font);font-weight:700}
.main-nav a,.nav-cta,.hero-contact,.filter,.side-card a,.contact-back{font-family:var(--reading-font)}
.main-nav a{font-weight:600;letter-spacing:.055em}
.nav-cta,.hero-contact{font-weight:600;letter-spacing:.035em}
.portrait-hero h1{
  font-family:var(--display-font);
  font-size:clamp(65px,10vw,166px);
  font-weight:700;
  letter-spacing:-.064em;
  line-height:.99;
}
.hero.portrait-hero h1 > span.hero-period{padding-left:0}
.hero-heading-mask{padding-top:min(9vh,86px)}
.portrait-wrap{width:clamp(370px,42vw,620px);top:54%}
.hero-identity p{font-family:var(--reading-font);font-weight:500;letter-spacing:.005em;line-height:1.45;font-size:clamp(13px,1.15vw,16px)}
.hero-scroll-cue span{font-family:var(--display-font)}
.marquee-heading p{font-family:var(--display-font);font-weight:600;line-height:1.18;letter-spacing:-.03em;font-size:clamp(19px,2.5vw,34px)}
.marquee-tile strong{font-family:var(--display-font);font-weight:700;letter-spacing:-.045em;font-size:clamp(32px,3.6vw,53px);line-height:1.04}
.about-grid{gap:38px}
.about-title-group h2{font:700 clamp(68px,9vw,143px)/.98 var(--display-font);letter-spacing:-.055em}
.about-body{width:min(100%,740px);overflow-wrap:break-word}
.about-lead{font:500 clamp(18px,2.05vw,26px)/1.6 var(--reading-font);letter-spacing:-.02em;max-width:700px;width:100%;white-space:normal;overflow-wrap:break-word}
.scroll-copy .scroll-char{display:inline;white-space:normal}
.about-body>p:not(.about-lead){font:400 clamp(14px,1.22vw,17px)/1.85 var(--reading-font);max-width:650px}
.about-facts strong{font-family:var(--reading-font);font-weight:600}
.about-decor{font-size:clamp(85px,10vw,150px);opacity:.43}
.services-section h2{font:700 clamp(62px,8.5vw,135px)/1 var(--display-font);letter-spacing:-.055em;margin-bottom:65px}
.service-item{grid-template-columns:135px 1fr 30px;min-height:145px;gap:26px}
.service-number{font:700 clamp(55px,6vw,92px)/1 var(--display-font);letter-spacing:-.05em}
.service-item h3{font:600 clamp(19px,2.05vw,29px)/1.28 var(--display-font);letter-spacing:-.025em}
.service-item p{font:400 clamp(13px,1.15vw,16px)/1.7 var(--reading-font)}
.service-plus{font-family:var(--display-font)}
.work-head h2{font:700 clamp(64px,8.7vw,140px)/1 var(--display-font);letter-spacing:-.06em}
.work-head>p{font:400 clamp(14px,1.25vw,18px)/1.7 var(--reading-font)}
.filter{font-weight:600;letter-spacing:.035em}
.project-info h3{font:700 clamp(34px,3.25vw,54px)/1.06 var(--display-font);letter-spacing:-.045em}
.project-info p{font:400 clamp(14px,1.25vw,18px)/1.55 var(--reading-font)}
.side-heading h2{font:700 clamp(57px,7.2vw,108px)/.99 var(--display-font);letter-spacing:-.055em}
.side-card h3{font-family:var(--display-font);font-weight:700;letter-spacing:-.05em}
.contact-content h2{font:700 clamp(64px,9.5vw,155px)/.99 var(--display-font);letter-spacing:-.065em;margin-bottom:60px}
.contact-bottom p{font-family:var(--reading-font);font-weight:500;font-size:17px}
.footer{font-family:'DM Mono',monospace}
@media(max-width:1100px){
  .portrait-hero h1{font-size:10vw}
  .service-item{grid-template-columns:105px 1fr 25px;gap:22px}
  .project-info h3{font-size:clamp(32px,3.8vw,48px)}
}
@media(max-width:790px){
  .portrait-hero h1{font-size:11vw}
  .portrait-wrap{width:min(540px,70vw);top:49%}
  .hero-heading-mask{padding-top:98px}
  .service-item{grid-template-columns:90px 1fr 20px}
  .project-info h3{font-size:35px}
  .about-title-group h2{font-size:clamp(68px,13vw,105px)}
  .about-lead{font-size:clamp(19px,3vw,24px)}
}
@media(max-width:590px){
  .portrait-hero h1{font-size:11.5vw;white-space:nowrap;letter-spacing:-.065em}
  .portrait-wrap{width:86vw;top:45%}
  .hero-identity p{font-size:11px;line-height:1.55}
  .hero-heading-mask{padding-top:100px}
  .about-title-group h2{font-size:19vw}
  .about-lead{font-size:19px;line-height:1.55;max-width:100%}
  .about-body>p:not(.about-lead){font-size:14px}
  .services-section h2,.work-head h2{font-size:clamp(55px,14vw,72px)}
  .service-item{grid-template-columns:59px 1fr;gap:14px;min-height:135px}
  .service-number{font-size:49px}
  .service-item h3{font-size:17px}
  .service-item p{font-size:12px}
  .project-info h3{font-size:31px}
  .project-info p{font-size:13px}
  .side-heading h2{font-size:14vw}
  .contact-content h2{font-size:clamp(52px,11vw,75px)}
}