@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{color-scheme:dark;--bg:#0c090e;--surface:#151017;--text:#f7f2f3;--muted:#b4a7b1;--line:#ffffff20;--accent:#ff7654;--pink:#d9348f;--font:'DM Sans',Arial,sans-serif;--display:'Manrope',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.65}button,a,summary{-webkit-tap-highlight-color:transparent}button,input{font:inherit}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px}button{border:0}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:650;line-height:1.08}em{font-family:Georgia,serif;font-weight:400;color:var(--accent)}::selection{background:#bc3179;color:#fff}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:24px;background:white;color:black;padding:12px;z-index:100}.skip-link:focus{top:15px}
.site-header{position:fixed;inset:0 0 auto;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:24px 5.5%;transition:background .25s,padding .25s}.site-header.scrolled{background:#0c090ef2;backdrop-filter:blur(15px);border-bottom:1px solid var(--line);padding-top:16px;padding-bottom:16px}.brand{font-family:var(--display);font-size:28px;font-weight:800;letter-spacing:-1.7px;line-height:1}.brand span{color:var(--accent)}nav{display:flex;gap:36px}nav a{font-size:14px;color:#ede2e9}nav a:hover{color:var(--accent)}.nav-cta{display:flex;align-items:center;gap:24px;background:var(--text);color:#171018;border-radius:30px;padding:8px 8px 8px 20px;font-size:14px;font-weight:600}.nav-cta span{display:grid;place-items:center;width:30px;height:30px;background:var(--accent);border-radius:50%;font-size:20px}
.hero{position:relative;min-height:850px;height:100svh;max-height:1180px;overflow:hidden;background:#160b16}.hero-portrait{position:absolute;right:0;top:0;width:65%;height:100%;overflow:hidden}.hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;transform:scale(1.03);will-change:transform}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#130b14 0%,#130b14ef 18%,#130b1455 45%,transparent 66%),linear-gradient(0deg,#0c090e 0%,transparent 26%,#0c090e35 100%)}.hero-content{position:relative;z-index:2;margin-left:8%;padding-top:clamp(175px,22vh,285px);width:62%;padding-bottom:150px}.eyebrow{font-size:12px;letter-spacing:2.2px;font-weight:500;text-transform:uppercase;color:var(--muted)}.hero-intro{color:#e0c2d2;margin-bottom:32px;letter-spacing:1.7px}.hero-intro span{color:var(--accent);padding:0 12px}h1{font-size:clamp(65px,7.5vw,120px);line-height:.98;letter-spacing:-6px;font-weight:750;max-width:850px}h1 span{display:block}h1 .amp{font-family:Georgia,serif;font-style:italic;font-size:.7em;color:var(--accent);padding:10px 0 14px;line-height:.8;font-weight:400}.outline{color:#f7f2f3}.hero-description{font-size:17px;line-height:1.65;color:#d4c6cf;margin:32px 0}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:34px;border-radius:35px;padding:15px 24px;font-size:14px;font-weight:600;min-height:52px;transition:transform .25s,background .25s}.button:hover{transform:translateY(-3px)}.button span{font-size:21px;line-height:1}.primary{background:var(--accent);color:#190d10}.primary:hover{background:#ff9879}.secondary{border:1px solid #ffffff45;color:var(--text)}.secondary:hover{background:#ffffff0b}.hero-aside{position:absolute;right:5.5%;bottom:170px;text-align:right;z-index:3}.tiny-label{font-size:12px;letter-spacing:2px;color:#ffd4dd}.hero-aside p{font-family:var(--display);font-size:19px;line-height:1.4;margin-top:12px}.hero-bottom{position:absolute;bottom:30px;left:5.5%;right:5.5%;display:flex;justify-content:space-between;align-items:center;z-index:3;font-size:11px;letter-spacing:1.6px;color:#c9b4c3}.hero-bottom p span{margin:0 10px;color:var(--accent)}.hero-bottom a span{font-size:22px;margin-left:16px}.disciplines{display:flex;justify-content:space-between;align-items:center;padding:28px 8%;border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:20px;font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:1px}.disciplines i{font-size:26px;color:var(--accent);font-style:normal}
.section{padding:125px 8%;max-width:1700px;margin:auto}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:45px}.section-heading .eyebrow,.about-label .eyebrow{margin-bottom:26px}h2{font-size:clamp(40px,4.5vw,70px);letter-spacing:-2.8px;line-height:1.12}.section-note{color:var(--muted);font-size:15px;line-height:1.7;padding-bottom:5px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:38px 0 35px}.filter{background:transparent;border:1px solid transparent;border-radius:30px;padding:8px 19px;font-size:14px;color:var(--muted);transition:background .2s}.filter:hover{color:#fff}.filter.active{border-color:#ffffff38;background:#ffffff08;color:#fff}.filter span{font-size:11px;color:var(--accent);margin-left:10px}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 30px}.project[hidden]{display:none}.project-open{width:100%;background:none;padding:0;text-align:left;display:block}.project-cover{height:355px;border-radius:4px;padding:25px 30px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;position:relative;transition:transform .45s,filter .45s}.project-open:hover .project-cover{transform:translateY(-5px);filter:brightness(1.12)}.cover-top,.cover-bottom{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:1.5px;font-weight:500}.cover-bottom{font-size:13px;letter-spacing:.3px}.cover-bottom>span:last-child{font-size:27px}.cover-name{font-family:var(--display);font-weight:750;font-size:clamp(40px,4.3vw,66px);letter-spacing:-3px;line-height:.95}.cover-name span{display:block}.cover-convertly{background:#daddeb;color:#292338}.cover-convertly .cover-name span{color:#5943b9}.cover-techzone{background:#692035;color:#fff0e8}.cover-techzone .cover-name{font-size:clamp(50px,5vw,80px);font-weight:800;letter-spacing:-5px}.cover-techzone .cover-name span{color:#ff8867}.cover-techzone sup{display:none}.cover-voice{background:#202023;color:#eeebe5}.cover-voice .cover-name{font-size:clamp(35px,3.5vw,56px);line-height:1.05}.cover-voice .cover-name span{font-family:Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-2px;color:#ff9b6c}.cover-experiments{background:#222c44;color:#d8e4ff}.cover-experiments .cover-name span{color:#9bacff}.project-caption{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:20px}.project-caption h3{font-size:21px;letter-spacing:-.5px}.project-caption p{font-size:14px;color:var(--muted);margin-top:6px}.round-arrow{flex-shrink:0;display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;font-size:22px}.project-open:hover .round-arrow{background:var(--accent);color:#170e16;border-color:var(--accent)}.work-footnote{margin-top:35px;font-size:14px;color:var(--muted)}.work-footnote a{color:var(--text);border-bottom:1px solid #ff76547a;padding-bottom:3px}.expertise-section{border-top:1px solid var(--line)}.expertise-list{margin-top:50px}.expertise{border-top:1px solid var(--line);padding:28px 0}.expertise:last-child{border-bottom:1px solid var(--line)}summary{list-style:none;display:flex;align-items:center;gap:30px;cursor:pointer}summary::-webkit-details-marker{display:none}.service-number{font-size:12px;color:var(--muted);min-width:35px}.expertise h3{font-size:clamp(23px,2.7vw,39px);letter-spacing:-1px}.service-toggle{margin-left:auto;font-size:28px;font-weight:400;transition:transform .2s}.expertise[open] .service-toggle{transform:rotate(45deg);color:var(--accent)}.service-body{padding:22px 50px 5px 65px;display:flex;justify-content:space-between;gap:40px}.service-body p{max-width:560px;font-size:16px;color:var(--muted)}.tags{display:flex;gap:8px;flex-wrap:wrap;align-content:flex-start;max-width:250px}.tags span{border:1px solid var(--line);border-radius:20px;padding:4px 12px;font-size:12px;color:#cabac6;white-space:nowrap}
.about-section{display:grid;grid-template-columns:1fr 1.55fr;gap:80px;background:linear-gradient(120deg,#1a0d1700,#26101d70);border-top:1px solid var(--line)}.signature{font-family:Georgia,serif;font-style:italic;font-size:64px;letter-spacing:-4px;color:#d883a8}.about-copy h2{font-size:clamp(37px,3.4vw,54px);margin-bottom:32px}.about-copy p{font-size:17px;color:var(--muted);margin-bottom:20px;max-width:650px}.text-link{font-size:14px;display:inline-flex;gap:40px;border-bottom:1px solid #ffffff40;padding:12px 0}.text-link span{color:var(--accent)}.contact-section{text-align:center;padding:125px 8% 115px;background:radial-gradient(ellipse at 50% 110%,#67203875 0%,#23111b40 48%,transparent 75%);border-top:1px solid var(--line)}.contact-section .eyebrow{margin-bottom:30px}.contact-section h2{font-size:clamp(45px,6.1vw,96px);letter-spacing:-4px}.contact-section h2 em{color:#f89581}.contact-inner>p:not(.eyebrow){color:var(--muted);margin-top:25px}.contact-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:35px}.email-line{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:26px;font-size:14px;color:var(--muted);flex-wrap:wrap}.email-line button{font-size:12px;color:#efdae4;border:1px solid #ffffff25;padding:4px 10px;border-radius:5px;background:transparent}footer{padding:35px 5.5%;display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line)}footer p,footer a:not(.brand){font-size:12px;color:var(--muted)}footer>div{display:flex;gap:25px}dialog{width:min(650px,calc(100vw - 32px));max-height:85svh;border:1px solid #ffffff30;background:#191019;color:var(--text);padding:50px;border-radius:10px;box-shadow:0 30px 150px #000b}dialog::backdrop{background:#08050bcc;backdrop-filter:blur(8px)}dialog .eyebrow{margin:20px 0}dialog h2{font-size:40px;letter-spacing:-1.5px}dialog>p:not(.eyebrow){margin:24px 0;color:var(--muted)}dialog h3{font-size:17px}dialog ul{padding-left:20px;color:var(--muted);margin:15px 0 30px}dialog li{padding:4px 0}.dialog-close{position:absolute;right:18px;top:12px;background:none;font-size:32px;line-height:1;width:40px;height:40px}.js-motion .reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}.js-motion .reveal.visible{opacity:1;transform:translateY(0)}body.dialog-open{overflow:hidden}
@media(min-width:1600px){.hero-content{padding-top:250px}.hero-portrait{width:61%}}
@media(max-width:1000px){.hero{min-height:780px}.hero-content{margin-left:6%;width:72%}h1{font-size:85px;letter-spacing:-4px}.hero-portrait{width:75%;right:-7%}.hero-aside{display:none}.section{padding:95px 6%}.project-cover{height:315px;padding:23px}.service-body{display:block}.tags{max-width:none;margin-top:20px}.about-section{gap:40px;grid-template-columns:1fr 1.6fr}.about-label .eyebrow{font-size:11px}.signature{font-size:50px}.disciplines{padding:24px 6%;font-size:11px;letter-spacing:.5px}}
@media(max-width:680px){html{scroll-padding-top:85px}.site-header{padding:20px 6%;gap:15px}.brand{font-size:25px}nav{gap:15px}nav a{font-size:12px}nav a[href='#about']{display:none}.nav-cta{font-size:12px;padding:5px 5px 5px 12px;gap:9px}.nav-cta span{width:26px;height:26px}.hero{height:920px;max-height:none;min-height:850px}.hero-portrait{width:100%;height:650px;right:0;top:0}.hero-portrait img{object-position:50% 20%}.hero-shade{background:linear-gradient(0deg,#0c090e 0%,#0c090e 16%,#0c090ecc 32%,#0c090e22 60%,#0c090e55 100%)}.hero-content{padding-top:470px;padding-bottom:90px;width:88%;margin-left:6%}.hero-intro{font-size:10px;letter-spacing:1.1px;margin-bottom:20px}.hero-intro span{padding:0 5px}h1{font-size:clamp(49px,11vw,72px);letter-spacing:-3px;line-height:1}h1 .amp{display:inline;font-size:.75em;padding:0 8px 0 0}h1 .outline{display:inline}.hero-description{font-size:15px;margin:23px 0}.button{padding:13px 20px;gap:22px;font-size:13px;min-height:49px}.hero-bottom{bottom:22px;left:6%;right:6%;font-size:9px;letter-spacing:1px}.hero-bottom a{font-size:0}.hero-bottom a span{font-size:24px}.hero-bottom p span{margin:0 5px}.disciplines{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:center;padding:22px 6%;font-size:11px}.disciplines i{display:none}.section{padding:75px 6%}.section-heading{display:block;margin-bottom:30px}.section-heading .eyebrow{margin-bottom:20px}h2{font-size:42px;letter-spacing:-1.8px}.section-note{margin-top:25px;font-size:14px}.section-note br{display:none}.filters{gap:0;margin:25px 0}.filter{padding:7px 13px;font-size:12px}.filter span{margin-left:6px}.project-grid{grid-template-columns:1fr;gap:32px}.project-cover{height:315px;padding:25px}.cover-name{font-size:62px}.cover-techzone .cover-name{font-size:75px}.cover-voice .cover-name{font-size:49px}.project-caption h3{font-size:19px}.project-caption p{font-size:13px}.expertise-list{margin-top:32px}.expertise{padding:23px 0}summary{gap:14px}.service-number{min-width:20px}.expertise h3{font-size:23px;letter-spacing:-.8px}.service-body{padding:20px 0 5px 34px}.service-body p{font-size:15px}.tags span{font-size:11px}.about-section{display:block}.signature{display:none}.about-label{margin-bottom:24px}.about-copy h2{font-size:39px}.about-copy p{font-size:16px}.contact-section{padding:80px 6%}.contact-section h2{font-size:50px;letter-spacing:-2.5px}.contact-section h2 em{font-size:.91em}.contact-section .eyebrow{font-size:10px}.contact-inner>p:not(.eyebrow){font-size:15px}.contact-actions{flex-direction:column;align-items:center}.contact-actions .button{width:260px}.email-line{font-size:12px}footer{padding:28px 6%;flex-wrap:wrap}footer p{font-size:11px}footer>div{width:100%;justify-content:space-between}dialog{padding:35px 25px}dialog h2{font-size:33px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js-motion .reveal{opacity:1;transform:none}.hero-portrait img{transform:none!important}}

/* Portfolio edition 2: user-supplied copy and interactive portrait. */
.hero{min-height:940px;max-height:1200px}
.hero-content{padding-top:165px;padding-bottom:140px;width:55%;margin-left:7%}
.hero-intro{font-size:12px;line-height:1.8;letter-spacing:1.2px;max-width:530px;margin-bottom:28px}
.hero-intro span{padding:0 4px}
h1{font-size:clamp(76px,7.5vw,122px);line-height:.96;letter-spacing:-5px}
h1 em{color:#f1b3bc;font-style:normal;font-family:var(--display);font-weight:500}
.hero-tagline{font-family:var(--display);font-size:24px;letter-spacing:-.5px;line-height:1.45;font-weight:550;margin-top:29px;max-width:550px}
.hero-description{font-size:16px;line-height:1.75;max-width:465px;margin:20px 0 28px;color:#d3c5cf}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-actions .button{gap:22px;padding:14px 22px}
.hero-portrait{width:62%;isolation:isolate;pointer-events:none}
.portrait-motion{width:100%;height:100%;will-change:transform;transform-origin:50% 52%}
.hero-portrait img{object-position:50% 30%;transform-origin:50% 40%;transform:scale(1.075)}
.hero-shade{pointer-events:none;background:linear-gradient(90deg,#130b14 0%,#130b14f5 20%,#130b1450 49%,transparent 72%),linear-gradient(0deg,#0c090e 0%,transparent 25%,#0c090e33 100%)}
.project-summary{color:var(--muted);font-size:16px;line-height:1.65;margin-top:15px;padding-right:25px}
.cover-experiments .cover-name{font-size:clamp(38px,4vw,60px)}
.expertise h3{font-size:clamp(23px,2.4vw,36px)}
.about-copy p{max-width:690px}.about-label .eyebrow{line-height:1.7}
.approach-section{border-top:1px solid var(--line)}
.approach-intro{max-width:425px;font-size:16px;line-height:1.75;color:var(--muted)}
.approach-steps{list-style:none;margin:60px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.approach-steps li{border-top:1px solid #fc8b7750;padding-top:25px}
.approach-steps li>span{font-size:13px;color:var(--accent);letter-spacing:1px}
.approach-steps h3{margin-top:24px;font-size:24px;line-height:1.35;letter-spacing:-.7px}
.contact-inner>p:not(.eyebrow){max-width:610px;margin-left:auto;margin-right:auto}
.contact-details{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:38px}
.contact-details>div{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;font-size:14px}
.contact-details>div>span:first-child{color:var(--muted);font-size:12px;letter-spacing:1px;text-transform:uppercase}
.contact-details a:hover{color:var(--accent)}
#copy-email{font-size:12px;border:1px solid #ffffff35;background:transparent;border-radius:5px;padding:3px 10px;color:#decbd8}
.contact-inner .location{font-size:14px;color:var(--muted);margin-top:27px}
@media(min-width:1600px){.hero-content{padding-top:190px}.hero-description{max-width:540px}}
@media(max-width:1000px){.hero-content{width:64%;padding-top:155px;margin-left:6%}.hero{min-height:930px}.hero-portrait{width:73%;right:-7%}h1{font-size:87px}.hero-tagline{font-size:22px;max-width:470px}.hero-description{max-width:405px}.hero-actions{max-width:460px}.hero-actions .button{font-size:13px;padding:13px 18px;gap:18px}.approach-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.approach-intro{margin-top:25px}}
@media(max-width:680px){
 .hero{min-height:0;max-height:none;height:auto;padding-bottom:65px}
 .hero-portrait{width:100%;height:650px;right:0;top:0}
 .hero-portrait img{object-position:50% 24%}
 .hero-shade{background:linear-gradient(0deg,#0c090e 0%,#0c090e 22%,#0c090ee8 41%,#0c090e12 70%,#0c090e50 100%)}
 .hero-content{padding-top:450px;padding-bottom:60px;width:88%;margin-left:6%}
 .hero-intro{font-size:12px;letter-spacing:.6px;line-height:1.8;margin-bottom:18px;max-width:340px}
 .hero-intro span{padding:0 3px}
 h1{font-size:clamp(58px,15vw,84px);letter-spacing:-3px;line-height:.98}
 .hero-tagline{font-size:21px;margin-top:23px;line-height:1.5}
 .hero-tagline br{display:none}
 .hero-description{font-size:16px;margin:18px 0 25px;max-width:none}
 .hero-actions{gap:12px;max-width:none}
 .hero-actions .button{font-size:14px;gap:16px;padding:12px 18px;min-height:48px}
 .hero-bottom{align-items:center;bottom:26px;line-height:1.6}
 .hero-bottom p{font-size:12px;letter-spacing:.4px;max-width:270px}
 nav a{font-size:14px}.nav-cta{font-size:14px}
 .hero-bottom a{min-width:32px;text-align:right}
 .project-summary{font-size:16px;padding-right:0}
 .cover-experiments .cover-name{font-size:56px}
 .filter{font-size:14px;padding:8px 12px}.cover-top{font-size:12px}.cover-bottom{font-size:14px}
 .project-caption p{font-size:14px}.expertise h3{font-size:23px;line-height:1.25}
 .service-body p{font-size:16px}.tags span{font-size:12px}.service-number{font-size:12px}
 .approach-steps{margin-top:35px;gap:28px 20px}.approach-steps h3{font-size:21px;margin-top:18px}
 .contact-details{align-items:stretch}.contact-details>div{gap:8px;font-size:14px}.contact-details>div:first-child{flex-wrap:wrap}
 .contact-details>div:first-child>span:first-child{width:100%}.contact-section h2{font-size:clamp(38px,10vw,52px)}
 .contact-section h2 em{font-size:1em}.contact-section .eyebrow{font-size:12px}.contact-inner .location{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.portrait-motion,.hero-portrait img{transform:none!important;will-change:auto}}

/* Cinematic scroll camera: sticky portrait with a reversible camera path. */
.hero{height:280svh;min-height:0;max-height:none;overflow:visible;padding:0}
.hero-stage{position:sticky;top:0;height:100svh;min-height:720px;overflow:hidden;background:#160b16;isolation:isolate}
.hero-portrait{inset:0 0 0 auto;width:62%;height:100%;overflow:visible;transform:none}
.portrait-motion{height:100%;width:100%;transform-origin:50% 42%;backface-visibility:hidden}
.hero-portrait img{height:100%;width:100%;object-fit:cover;object-position:50% 30%;transform-origin:50% 38%;backface-visibility:hidden}
.hero-shade{z-index:1}
.hero-content{z-index:3;transform-origin:0 45%;padding-top:clamp(125px,17vh,190px);width:55%;will-change:transform,opacity}
.hero-intro{margin-bottom:20px}
h1{font-size:clamp(64px,6.9vw,110px)}
.hero-tagline{margin-top:20px;font-size:22px}
.hero-description{margin:16px 0 23px;font-size:16px}
.hero-actions{position:relative}
.hero-bottom{z-index:6;bottom:25px;gap:30px;left:5.5%;right:5.5%}
.motion-toggle{display:inline-flex;align-items:center;gap:14px;padding:9px 14px;min-height:42px;border:1px solid #ffffff45;border-radius:30px;background:#1a101bd9;color:#f2dde9;font-size:12px;letter-spacing:.6px;white-space:nowrap}
.motion-toggle span{color:var(--accent)}
.camera-progress{height:2px;background:#ffffff20;max-width:260px;width:23%;overflow:hidden;margin-left:auto}
.camera-progress span{height:100%;display:block;background:var(--accent);transform:scaleX(0);transform-origin:0 50%}
.camera-caption{position:absolute;z-index:4;left:7%;top:45%;max-width:45%;opacity:0;pointer-events:none;will-change:transform,opacity}
.camera-caption>span{font-size:12px;letter-spacing:2px;color:#e4a8c1}
.camera-caption p{font-family:var(--display);font-size:clamp(42px,5.8vw,84px);font-weight:600;letter-spacing:-3px;line-height:1.12;margin-top:25px;max-width:540px}
.camera-caption p em{color:#f3b3c5}
body.motion-off .hero{height:auto}
body.motion-off .hero-stage{position:relative;min-height:940px}
body.motion-off .hero-content{opacity:1!important;transform:none!important;visibility:visible!important}
body.motion-off .camera-caption{display:none}
body.motion-off .camera-progress{display:none}
body.motion-off .hero-bottom>a{margin-left:auto}
body.motion-off .portrait-motion,body.motion-off .hero-portrait img{transform:none!important}
body.motion-on .portrait-motion{transform:var(--camera-layer,none)!important;will-change:transform}
body.motion-on .hero-portrait img{transform:var(--camera-image,scale(1.1))!important;will-change:transform}
@media(max-width:1000px){.hero-content{width:61%;margin-left:6%}.hero-portrait{width:73%;right:-7%;left:auto}.hero-tagline{font-size:20px}.hero-description{max-width:400px}.hero-actions .button{font-size:13px;padding:12px 15px}.camera-caption{left:6%;max-width:46%}.camera-caption p{font-size:56px}}
@media(max-width:680px){
 .hero{height:300svh;padding:0}
 .hero-stage{height:100svh;min-height:760px}
 .hero-portrait{top:0;left:0;right:0;width:100%;height:500px}
 .hero-portrait img{object-position:50% 27%}
 .hero-content{padding-top:340px;padding-bottom:80px;margin-left:6%;width:88%}
 .hero-intro{font-size:12px;line-height:1.6;margin-bottom:10px;max-width:370px}
 h1{font-size:clamp(48px,13vw,70px);line-height:.9;letter-spacing:-2.5px}
 h1 br{display:none}h1 em{margin-left:8px}
 .hero-tagline{font-size:18px;line-height:1.4;margin-top:14px}
 .hero-description{font-size:14px;line-height:1.6;margin:12px 0 16px;max-width:100%}
 .hero-actions{gap:8px}.hero-actions .button{font-size:12px;gap:13px;min-height:42px;padding:9px 13px}
 .hero-shade{background:linear-gradient(0deg,#0c090e 0%,#0c090e 24%,#0c090ebf 45%,#0c090e05 69%,#0c090e55 100%)}
 .hero-bottom{bottom:17px;gap:15px;left:6%;right:6%}
 .motion-toggle{font-size:12px;padding:8px 12px;min-height:40px}
 .camera-progress{width:27%;max-width:130px}
 .camera-caption{top:auto;bottom:145px;max-width:88%;left:6%}
 .camera-caption p{font-size:clamp(38px,10vw,55px);letter-spacing:-1.6px;max-width:340px;margin-top:18px}
 .camera-caption>span{font-size:12px;letter-spacing:1.5px}
 body.motion-off .hero-stage{min-height:810px}
}
@media(min-width:681px) and (max-height:760px){.hero-stage{min-height:710px}.hero-content{padding-top:110px}h1{font-size:76px}.hero-intro{margin-bottom:16px}.hero-tagline{font-size:20px;margin-top:16px}.hero-description{font-size:15px;max-width:460px;margin:12px 0 20px}}

.hero-stage{top:min(0px,calc(100svh - 720px))}
@media(max-width:680px){.hero-stage{top:min(0px,calc(100svh - 760px))}}

/* Video hero edition: the uploaded cinematic B-roll replaces photo transforms. */
.hero{
  height:100svh;
  min-height:720px;
  max-height:1100px;
  overflow:hidden;
  padding:0;
}
.hero-stage{
  position:relative;
  top:auto;
  height:100%;
  min-height:inherit;
  overflow:hidden;
}
.hero-video-wrap{
  position:absolute;
  inset:0;
  background:#150b15 url('./assets/huraira-video-poster.webp') center/cover no-repeat;
  overflow:hidden;
}
.hero-video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:scale(1.005);
}
.video-paused .hero-video{opacity:0}
.hero-shade{
  z-index:1;
  background:
    linear-gradient(90deg,#100911 0%,#100911e8 15%,#100911a8 34%,#10091122 59%,transparent 77%),
    linear-gradient(0deg,#0c090ea8 0%,transparent 26%,#0c090e30 100%);
}
.hero-content{
  position:relative;
  z-index:3;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  padding-top:clamp(130px,17vh,190px);
}
.hero-bottom{z-index:4}
body.motion-on .hero,body.motion-off .hero{height:100svh}
body.motion-on .hero-stage,body.motion-off .hero-stage{position:relative;min-height:inherit}

@media(max-width:1000px){
  .hero-video{object-position:58% center}
}
@media(max-width:680px){
  .hero{height:100svh;min-height:800px;max-height:none;padding:0}
  .hero-stage{height:100%;min-height:inherit;top:auto}
  .hero-video-wrap{height:100%}
  .hero-video{height:100%;object-position:68% center;transform:scale(1.01)}
  .hero-shade{
    background:
      linear-gradient(0deg,#0c090ef7 0%,#0c090edb 30%,#0c090e72 51%,#0c090e1a 75%,#0c090e38 100%),
      linear-gradient(90deg,#0c090e85 0%,transparent 70%);
  }
  .hero-content{padding-top:340px;padding-bottom:90px}
  .hero-bottom{bottom:17px}
}
@media(prefers-reduced-motion:reduce){
  .hero-video{transform:none}
}