:root{--paper:#f3f0e8;--ink:#242e29;--muted:#626a60;--line:#d7d8cb;--green:#334c3b;--brass:#867342;--serif:'Instrument Serif',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:95px}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
button,a,input,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:focus-visible,a:focus-visible{outline:2px solid var(--brass);outline-offset:6px}
input:focus,textarea:focus{outline:2px solid var(--green);outline-offset:3px}
::selection{background:#d6dfc8}
h1,h2,h3,h4,p{margin:0}
h1,h2,h4{font-family:var(--serif);font-weight:400;line-height:1.03;letter-spacing:-.035em}
em{font-weight:400}
button{border:0}
section[id],article[id]{scroll-margin-top:90px}
.section-width{max-width:1320px;margin:auto;padding-left:64px;padding-right:64px}
.header{height:104px;max-width:1440px;margin:auto;padding:0 64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:inline-flex;align-items:center;gap:12px;line-height:1}
.brand-mark{width:30px;height:36px}
.brand>span{font-size:28px;font-weight:550;letter-spacing:-1.4px}
.brand small{display:block;font-size:8px;letter-spacing:3px;margin-top:8px}
.header nav{display:flex;align-items:center;gap:34px;font-size:12px;font-weight:500}
.header nav a{transition:color .2s}
.header nav a:hover{color:var(--brass)}
.nav-contact{border-bottom:1px solid var(--ink);padding:9px 0}
.nav-contact span{margin-left:25px}
.menu-toggle{display:none}
.skip{position:fixed;top:-60px;left:15px;background:var(--ink);color:white;padding:10px;z-index:99}
.skip:focus{top:10px}
.hero{min-height:700px;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding-top:55px;padding-bottom:65px;gap:10px}
.eyebrow{font-size:9px;letter-spacing:1.8px;line-height:1.5;font-weight:600}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#698059;margin-right:7px}
.hero h1{font-size:clamp(70px,7.4vw,106px);margin-top:26px;line-height:.96;letter-spacing:-3.5px}
.hero h1 em{color:#657654}
.intro{font-size:14px;line-height:1.8;color:var(--muted);margin-top:25px}
.hero-actions{display:flex;align-items:center;gap:26px;margin-top:30px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;background:var(--green);color:#fff;padding:15px 22px;border-radius:3px;font-size:12px;transition:background .2s,transform .2s}
.button:hover{background:#233b2b;transform:translateY(-2px)}
.text-link{font-size:12px;font-weight:550;border-bottom:1px solid #abb1a1;padding-bottom:7px;display:inline-flex;gap:20px}
.text-link:hover span{transform:translate(2px,-2px)}
.text-link span{transition:transform .2s}
.hero-origin{font-size:10px;display:flex;align-items:center;gap:9px;margin-top:42px;flex-wrap:wrap}
.origin-cross{font-size:19px;color:#8a7950}
.origin-place{display:block;width:100%;padding-left:28px;margin-top:-7px;color:var(--muted);font-size:9px}
.hero-art{position:relative;height:560px;min-width:0}
.orbit{position:absolute;inset:50px 0 35px;border:1px solid #d9dbcd;border-radius:50%;transform:rotate(-28deg)}
.orbit-two{inset:10px 70px 0 55px;transform:rotate(32deg)}
.art-label{position:absolute;right:0;top:20px;font-size:8px;letter-spacing:2px;color:#747b6b}
.floating{position:absolute;border:1px solid #e0dfd2;border-radius:8px;box-shadow:0 20px 50px -25px #3d483e55}
.academy-mini{left:10px;top:70px;width:305px;background:#fcfaf4;transform:rotate(-7deg);padding:23px;z-index:2}
.mini-heading{font-family:var(--serif);font-size:29px;line-height:1.2}
.mini-heading>span{float:right;font-family:var(--sans);font-size:18px}
.mini-caption{font-size:10px;color:var(--muted)}
.mini-class{display:flex;gap:12px;align-items:center;margin-top:20px;border-top:1px solid var(--line);padding-top:18px;font-size:11px}
.mini-class>span{background:#e7ebd9;padding:9px;font-family:var(--serif);font-size:20px}
.mini-class small{display:block;font-size:9px;color:var(--muted);margin-top:3px}
.mini-avatars{display:flex;align-items:center;margin-top:18px}
.mini-avatars i,.people i{font-style:normal;font-size:9px;border:2px solid #fbfaf4;display:grid;place-items:center;border-radius:50%;width:27px;height:27px;background:#d4dcc5;margin-left:-5px}
.mini-avatars i:nth-child(2),.people i:nth-child(2){background:#ead7c3}
.mini-avatars i:nth-child(3),.people i:nth-child(3){background:#dbc8b9}
.mini-avatars>span{font-size:8px;margin-left:8px}
.finance-mini{right:-8px;top:210px;width:265px;background:#344a3b;color:#f3f2e8;padding:28px;transform:rotate(7deg);z-index:3}
.finance-mini .eyebrow{font-size:8px;color:#bac5ac;letter-spacing:1.4px}
.finance-mini h3{font:38px/.98 var(--serif);margin:18px 0 22px}
.mini-budget{display:flex;justify-content:space-between;font-size:9px;margin-top:15px}
.mini-budget b{font-weight:400}
.mini-bar{height:4px;width:90%;background:#adba8a;margin-top:7px;transform-origin:left}
.mini-bar.short{width:48%;background:#d0c098}
.mini-footer{display:block;border-top:1px solid #ffffff25;padding-top:15px;margin-top:20px;font-size:8px;color:#d3dac8}
.raha-mini{left:1px;bottom:27px;background:#e1e6d6;padding:21px 25px;width:208px;transform:rotate(-5deg);z-index:4}
.raha-mini>span{font:24px var(--serif)}
.raha-mini i{float:right;font-style:normal}
.raha-mini p{font:31px/1.02 var(--serif);margin:15px 0}
.raha-mini small{font-size:8px}
.art-bottom{position:absolute;bottom:-18px;right:3px;font-size:8px;color:var(--muted)}
.portfolio-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.portfolio-strip>div{display:flex;min-height:104px;gap:34px;align-items:center;justify-content:space-between}
.portfolio-strip>div>span{font-size:8px;letter-spacing:1.5px;color:var(--muted)}
.portfolio-strip a{font:28px var(--serif);white-space:nowrap}
.portfolio-strip small{font:9px var(--sans);display:block;letter-spacing:1px;margin-top:-3px}
.work{padding-top:105px;padding-bottom:85px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:25px}
.section-heading h2{font-size:55px;margin-top:20px}
.section-heading>p{font-size:12px;line-height:1.9;margin-bottom:5px}
.muted{color:var(--muted)}
.product-stories{margin-top:65px}
.product-story{display:grid;grid-template-columns:.9fr 1.1fr;gap:75px;align-items:center;min-height:640px;border-top:1px solid var(--line);padding:65px 0}
.product-index{display:flex;justify-content:space-between;gap:10px;font-size:9px;letter-spacing:.5px}
.status{border:1px solid #c9cdbd;border-radius:20px;padding:1px 9px;font-size:8px;white-space:nowrap}
.product-name{font:24px var(--serif);margin-top:45px}
.product-copy h2{font-size:49px;margin:16px 0 22px}
.product-copy>p{font-size:13px;color:var(--muted);max-width:355px;line-height:1.9}
.product-meta{font-size:9px;color:var(--muted);margin:25px 0}
.product-visual{padding:48px 34px 22px;border-radius:4px;background:#e4e8d9;position:sticky;top:100px;--scene-accent:#607a49}
.product-visual.finance{background:#dfe6de;--scene-accent:#657d56}
.product-visual.raha{background:#e9e4da;--scene-accent:#a8866a}
.product-visual.qaisariyah{background:#eee0d5;--scene-accent:#a4806b}
.scene{background:#fcfaf5;border:1px solid #ffffff80;min-height:360px;border-radius:5px;box-shadow:0 10px 22px -20px #17291a88;overflow:hidden}
.app-top{height:55px;border-bottom:1px solid #e3e2d6;display:flex;align-items:center;justify-content:space-between;padding:0 22px}
.mini-logo{font:25px var(--serif)}
.app-top>span:last-child{font-size:8px;color:var(--muted)}
.app-body{padding:25px}
.app-body .eyebrow{font-size:7px;letter-spacing:1.4px;color:var(--muted)}
.app-body h4{font-size:30px;line-height:1.05;margin:12px 0 22px}
.academy-stats{display:flex;gap:35px;margin-bottom:25px}
.academy-stats strong{font:39px var(--serif);display:block}
.academy-stats span{font-size:9px;color:var(--muted)}
.lesson{display:flex;align-items:center;gap:12px;border:1px solid #e1e3d5;padding:12px;border-radius:4px}
.lesson-icon{background:#e5eadb;padding:6px 10px;font:23px var(--serif)}
.lesson b{font-size:10px;font-weight:500}
.lesson small{display:block;font-size:8px;color:var(--muted)}
.lesson-tag{margin-left:auto;color:#506044;font-size:8px}
.people{display:flex;align-items:center;margin-top:23px}
.people>span{font-size:8px;margin-left:10px}
.scene-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:22px;font-size:7px;letter-spacing:.9px;color:#545e4c}
.replay{background:transparent;color:inherit;font-size:10px;padding:4px;white-space:nowrap}
.money{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:15px}
.money small{font-size:10px}
.money strong{font:30px var(--serif)}
.envelopes>div{display:grid;grid-template-columns:1fr auto;margin-top:17px;font-size:9px;gap:6px}
.envelopes b{font-weight:500}
.envelopes i{height:5px;background:var(--scene-accent);width:var(--fill);grid-column:1/-1;transform-origin:left}
.memory{height:150px;background:#d8dcbf;position:relative;overflow:hidden;border-radius:60% 60% 3px 3px}
.sun{position:absolute;border-radius:50%;background:#f3e9ca;width:50px;height:50px;left:calc(50% - 25px);top:17px}
.hill{position:absolute;width:120%;height:150px;border-radius:50%;left:-50px;top:90px;background:#8d9b70;transform:rotate(-18deg)}
.hill.h2{left:60px;top:95px;background:#617557;transform:rotate(14deg)}
.memory-label{position:absolute;bottom:10px;left:14px;font:17px var(--serif);color:#fff}
.note{display:flex;align-items:center;gap:13px;margin-top:15px}
.note>span{font-size:25px}
.note p{font:20px var(--serif)}
.note small{display:block;font:8px var(--sans);margin-top:5px;color:var(--muted)}
.shop{padding-top:18px}
.bottle-scene{height:200px;position:relative;display:grid;place-items:center;margin:12px 0}
.bottle{width:90px;height:145px;background:#a87555;border-radius:14px 14px 18px 18px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff4e4;position:relative;z-index:2;transform:rotate(-9deg);box-shadow:14px 15px 0 #a8755515}
.bottle:before{content:'';position:absolute;top:-22px;width:54px;height:24px;background:#493b32;border-radius:4px 4px 0 0}
.bottle span{font:24px var(--serif)}
.bottle small{font-size:6px;letter-spacing:1px;margin-top:10px}
.product-arc{position:absolute;inset:2px 30px;background:#ecdec9;border-radius:150px 150px 4px 4px}
.shop-caption{display:flex;align-items:center;justify-content:space-between}
.shop-caption h4{font-size:22px;margin:0}
.shop-caption small{font-size:8px;color:var(--muted)}
.bag{background:#493e33;color:white;padding:5px 12px;border-radius:3px}
.order-note{font-size:9px;border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
.work-note{font-size:11px;color:var(--muted);border-top:1px solid var(--line);padding-top:25px;text-align:center}
.studio{background:#283c30;color:#eeeee2;padding:90px 0 0}
.studio-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px}
.studio h2{font-size:56px;margin-top:22px}
.studio .eyebrow{color:#bcc7ae}
.studio h2 em{color:#b4c297}
.studio-copy>p:first-child{font:28px/1.3 var(--serif);margin-bottom:23px}
.studio-copy>p:nth-child(2){font-size:12px;color:#c6cebf;line-height:1.9}
.principles{display:flex;gap:16px;font-size:8px;flex-wrap:wrap;margin:28px 0 40px}
.principles span{border-bottom:1px solid #62735f;padding-bottom:6px}
.loom{display:flex;align-items:center;gap:35px;border-top:1px solid #ffffff20;padding-top:33px;padding-bottom:35px;margin-top:50px}
.loom-graphic{display:flex;align-items:center;flex-shrink:0}
.loom-graphic>span{border:1px solid #6d7f68;display:grid;place-items:center;width:40px;height:43px;font:20px var(--serif)}
.loom-graphic i{width:15px;height:1px;background:#6d7f68}
.loom h3{font:25px var(--serif);margin:8px 0}
.loom p:last-child{font-size:10px;color:#c6cebf;max-width:490px}
.loom-label{margin-left:auto;font-size:8px;letter-spacing:1px;white-space:nowrap;color:#b8c4ab}
.services{padding-top:105px;padding-bottom:100px}
.service-list{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:55px}
.service-list article{border-top:1px solid var(--line);padding-top:20px}
.service-list article>span{font-size:10px;color:var(--brass)}
.service-list h3{font:32px/1.1 var(--serif);margin:24px 0 20px}
.service-list p{font-size:12px;color:var(--muted);line-height:1.9;min-height:100px}
.service-list small{display:block;font-size:9px;margin-top:20px}
.contact{border-top:1px solid var(--line);padding-top:80px;padding-bottom:90px;display:grid;grid-template-columns:1fr 1fr;gap:70px}
.contact h2{font-size:70px;margin:22px 0}
.contact>div>p:not(.eyebrow){font-size:12px;color:var(--muted)}
.contact-email{font-size:15px;display:inline-block;border-bottom:1px solid var(--ink);margin-top:25px}
.contact form{padding-top:35px}
.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}
label{display:block;font-size:10px}
input,textarea{display:block;width:100%;border:0;border-bottom:1px solid #a9b29f;border-radius:0;background:transparent;padding:14px 0;color:var(--ink);font-size:11px;margin-bottom:30px;resize:vertical}
textarea{min-height:100px}
.form-note{font-size:9px;color:var(--muted);margin-top:15px}
footer{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:125px;border-top:1px solid var(--line)}
footer .brand>span{font-size:22px}
footer .brand-mark{width:25px}
footer>p{font-size:10px;color:var(--muted)}
footer>div{display:flex;gap:18px;font-size:9px;flex-wrap:wrap}
footer>div>span{width:100%;color:var(--muted)}

@keyframes arrive{from{opacity:0;translate:0 25px}
to{opacity:1;translate:0 0}
}
@keyframes grow{from{transform:scaleX(.05)}
to{transform:scaleX(1)}
}
@keyframes drift{0%,100%{translate:0 0}
50%{translate:0 -8px}
}
@media(prefers-reduced-motion:no-preference){
.hero.playing .hero-copy{animation:arrive .85s both}
.hero.playing .academy-mini{animation:arrive .9s .15s both}
.hero.playing .finance-mini{animation:arrive .9s .3s both}
.hero.playing .raha-mini{animation:arrive .9s .45s both}
.playing .scene{animation:arrive .65s both}
.playing .envelopes i{animation:grow 1s .3s both}
.playing .lesson,.playing .people,.playing .note,.playing .order-note{animation:arrive .75s .35s both}
.playing .people{animation-delay:.55s}
.playing .memory{animation:memory-reveal 1s .2s both}
.playing .sun{animation:sunrise 1.1s .25s both}
.playing .bottle{animation:bottle-arrive 1s .2s both}
.section-heading.playing,.studio-grid.playing,.loom.playing,.contact.playing{animation:arrive .75s both}
.service-list.playing article{animation:arrive .65s both}
.service-list.playing article:nth-child(2){animation-delay:.15s}
.service-list.playing article:nth-child(3){animation-delay:.3s}
}
@keyframes memory-reveal{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes sunrise{from{transform:translateY(35px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes bottle-arrive{from{opacity:0;transform:translateY(25px) rotate(-18deg)}to{opacity:1;transform:translateY(0) rotate(-9deg)}}
.motion-paused .floating{animation-play-state:paused}

@media(min-width:1440px){.hero-art{margin-left:25px}
}
@media(max-width:1100px){.section-width{padding-left:35px;padding-right:35px}
.header{padding:0 35px}
.hero h1{font-size:83px}
.hero-art{scale:.9;transform-origin:center right}
.product-story{gap:40px}
.product-visual{padding:32px 22px 20px}
.product-copy h2{font-size:43px}
.section-heading h2{font-size:48px}
.loom-label{display:none}
.portfolio-strip>div{gap:20px}
.hero-actions{gap:18px}
.button{gap:20px}
.studio-grid{gap:40px}
.studio h2{font-size:48px}
}

@media(max-width:760px){html{scroll-padding-top:25px}
.header{height:82px;padding:0 24px;position:relative}
.brand>span{font-size:24px}
.brand-mark{width:25px}
.menu-toggle{display:flex;align-items:center;gap:18px;background:transparent;color:var(--ink);font-size:12px;min-height:44px}
.menu-toggle span{font-size:20px}
.header nav{display:none;position:absolute;top:81px;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);padding:25px;z-index:20;align-items:stretch;gap:20px}
.header nav.open{display:flex;flex-direction:column}
.header nav a{padding:8px 0}
.section-width{padding-left:24px;padding-right:24px}
.hero{grid-template-columns:1fr;padding-top:44px;padding-bottom:40px;gap:0}
.hero h1{font-size:82px;letter-spacing:-3px;margin-top:22px}
.hero .eyebrow{font-size:8px}
.intro{font-size:13px}
.hero-origin{margin-top:27px}
.hero-art{height:465px;max-width:490px;width:100%;margin:25px auto 0;scale:1}
.academy-mini{width:260px;left:8px;top:45px;padding:20px}
.finance-mini{width:218px;right:0;top:180px;padding:22px}
.finance-mini h3{font-size:33px}
.raha-mini{width:173px;bottom:10px;padding:18px;left:4px}
.raha-mini p{font-size:27px;margin:9px 0}
.art-label{font-size:7px;top:0}
.art-bottom{bottom:-20px;font-size:7px}
.portfolio-strip>div{flex-wrap:wrap;justify-content:center;gap:25px 30px;padding-top:25px;padding-bottom:25px}
.portfolio-strip>div>span{width:100%;text-align:center}
.portfolio-strip a{font-size:24px}
.work{padding-top:65px;padding-bottom:55px}
.section-heading{display:block}
.section-heading h2{font-size:43px}
.section-heading>p{margin-top:25px;font-size:12px}
.desktop{display:none}
.product-stories{margin-top:40px}
.product-story{grid-template-columns:1fr;gap:30px;padding:40px 0;min-height:0}
.product-name{margin-top:25px}
.product-copy h2{font-size:43px}
.product-copy>p{max-width:none}
.product-meta{margin:20px 0}
.product-visual{position:relative;top:auto;padding:30px 22px 17px}
.scene{min-height:355px}
.scene-caption{font-size:6px}
.replay{min-height:36px}
.app-body h4{font-size:29px}
.app-body{padding:22px}
.studio{padding-top:60px}
.studio-grid{grid-template-columns:1fr;gap:30px}
.studio h2{font-size:47px}
.studio-copy>p:first-child{font-size:26px}
.loom{margin-top:15px;gap:20px;align-items:flex-start}
.loom-graphic{display:none}
.loom h3{font-size:26px}
.services{padding-top:65px;padding-bottom:60px}
.service-list{grid-template-columns:1fr;gap:30px;margin-top:35px}
.service-list h3{font-size:32px;margin:12px 0}
.service-list p{min-height:0}
.service-list small{margin-top:12px}
.contact{grid-template-columns:1fr;gap:10px;padding-top:55px;padding-bottom:60px}
.contact h2{font-size:65px}
.contact form{padding-top:25px}
.form-pair{grid-template-columns:1fr;gap:0}
footer{flex-wrap:wrap;padding-top:30px;padding-bottom:30px;gap:22px}
footer>div{width:100%}
footer>div>span{width:auto;margin-left:auto}
footer>p{font-size:9px}
}
@media(max-width:370px){.hero h1{font-size:73px}
.hero-actions{gap:15px}
.hero-actions .button{padding:14px 15px;font-size:11px}
.text-link{font-size:11px}
.hero-art{height:440px}
.academy-mini{width:240px}
.finance-mini{width:195px;top:177px}
.raha-mini{width:152px}
.scene-caption{letter-spacing:0}
.lesson-tag{font-size:7px}
.app-body{padding:17px}
.product-visual{padding:25px 15px 15px}
.people>span{font-size:7px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation:none!important;transition:none!important}
.replay{display:none}
}

.hero-art{clip-path:inset(-25px -10px -45px -10px)}
#motion-toggle{background:transparent;color:var(--muted);font-size:9px;text-decoration:underline;text-underline-offset:3px;padding:10px 4px;margin-left:8px}
.user-paused .floating{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){#motion-toggle{display:none}
}
@media(max-width:760px){.hero-art{clip-path:inset(-20px -8px -45px -8px)}
.orbit-one{inset:60px 35px 45px}
.orbit-two{inset:40px 65px 30px 60px}
.art-bottom{font-size:7px;right:0}
#motion-toggle{font-size:8px;margin-left:3px}
.studio h2{font-size:44px}
}


/* Full-width pages, viewport-sized product chapters; small screens grow naturally. */
.section-width,.header{max-width:none;width:100%;padding-left:clamp(24px,5vw,100px);padding-right:clamp(24px,5vw,100px)}
.hero{min-height:calc(100svh - 104px)}
.product-story{min-height:100svh;gap:clamp(40px,7vw,140px)}
.product-visual{position:relative;top:auto;min-width:0;min-height:min(68svh,740px);display:flex;flex-direction:column;justify-content:center;padding:clamp(25px,4vw,70px);transform:translateY(calc((.5 - var(--story-progress, .5)) * -18px)) scale(calc(.985 + var(--story-progress, .5) * .015));transition:transform .15s linear}
.scene{width:100%;max-width:650px;margin-inline:auto}
.scene{transform:translateY(calc((.5 - var(--story-progress, .5)) * 10px))}
.scene-caption{width:100%;max-width:650px;margin-inline:auto}
.product-copy>p{max-width:480px}
.product-copy>.availability{font-size:12px;line-height:1.8;border-left:2px solid var(--line);padding-left:14px;margin:0 0 25px;color:var(--muted)}
.product-index{flex-wrap:wrap;align-items:center}
.status{font-size:10px;padding:3px 11px}
.product-meta{font-size:11px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.user-paused .playing,.user-paused .playing *,.page-hidden .playing,.page-hidden .playing *{animation-play-state:paused!important}
@media(min-width:1440px){.hero h1{font-size:clamp(106px,7.5vw,150px)}.hero-art{width:min(100%,700px);justify-self:center;height:650px}.academy-mini{width:350px;left:5%;top:70px}.finance-mini{width:320px;right:2%;top:230px}.raha-mini{width:250px;left:6%;bottom:35px}.product-copy h2{font-size:clamp(49px,4vw,76px)}.product-copy>p{font-size:16px}.product-name{font-size:30px}.scene{min-height:420px}.app-body{padding:32px}.app-body h4{font-size:38px}}
@media(max-width:760px){.hero{min-height:calc(100svh - 82px)}.product-story{min-height:100svh;gap:30px}.product-visual{min-height:0;padding:30px 22px 17px}.status{font-size:9px}.product-copy>.availability{font-size:12px}.scene{max-width:none}.header{padding-inline:24px}}
@media(max-width:370px){.product-visual{padding:25px 15px 15px}}
/* The header scrolls away; section links can align directly with the viewport. */
html{scroll-padding-top:0}
section[id],article[id]{scroll-margin-top:0}
.hero-art{overflow:clip;overflow-clip-margin:20px}