
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:clip}
body{font-family:var(--bf);background:var(--bg);color:var(--ink);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.wrap{width:min(1280px,92vw);margin:0 auto}
h1,h2,h3{font-family:var(--hf);line-height:1.05;overflow-wrap:break-word}
h1{font-size:clamp(44px,6vw,92px)}
h2{font-size:clamp(32px,4vw,60px)}
h3{font-size:22px}
.kick{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--acc);margin-bottom:14px}
.lead{font-size:17px;color:var(--mut);max-width:58ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;background:var(--acc);color:var(--bg);font-weight:600;font-size:15px;border:0;cursor:pointer;transition:.25s;white-space:nowrap}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn-alt{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-alt:hover{background:var(--ink);color:var(--bg)}
.btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
/* header */
.hd{position:sticky;top:0;z-index:50;background:var(--bg);transition:.3s}
.hd-in{display:flex;align-items:center;gap:32px;height:80px}
.logo{display:flex;align-items:center;gap:12px;color:var(--acc)}
.logo .mark{width:40px;height:40px;flex:none}
.wm{font-family:var(--hf);font-size:26px;line-height:.95;display:flex;flex-direction:column;color:var(--ink)}
.wm small{font-family:var(--bf);font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin-top:5px;opacity:.7;font-weight:500}
.nav{display:flex;gap:28px;margin-left:auto;font-size:15px;font-weight:500}
.nav a:hover{color:var(--acc)}
.hd-cta{padding:12px 20px;font-size:14px}
.burger{display:none;margin-left:auto;background:none;border:0;width:44px;height:44px;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.burger i{display:block;width:22px;height:2px;background:var(--ink)}
/* hero common */
.hero{position:relative}
.stats{display:flex;gap:40px;flex-wrap:wrap}
.stat b{display:block;font-family:var(--hf);font-size:40px;line-height:1}
.stat span{font-size:13px;color:var(--mut)}
.hero-full{min-height:92svh;display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.hero-full>img{position:absolute;inset:0}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,0) 35%,rgba(0,0,0,.65))}
.hero-full .hero-in{position:relative;z-index:2;padding:0 0 60px;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.hero-full .lead,.hero-full .stat span{color:rgba(255,255,255,.82)}
.hero-full h1{max-width:13ch;margin-bottom:18px}
.hero-full .btn-alt{color:#fff;box-shadow:inset 0 0 0 1.5px #fff}
.hero-split .hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:20px;padding:20px 0}
.hero-split .hero-txt{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,5vw,70px) 0}
.hero-split h1{margin-bottom:20px}
.hero-ph{position:relative;min-height:540px;overflow:hidden}
.hero-ph img{position:absolute;inset:0}
.hero-badge{position:absolute;left:18px;bottom:18px;background:var(--bg);color:var(--ink);padding:10px 14px;font-size:13px;font-weight:600}
.hero-split .hero-stats{grid-column:1/-1;padding:24px 0;border-top:1px solid var(--line)}
.hero-stacked{padding:40px 0 0}
.hero-stacked h1{max-width:16ch;margin-bottom:24px}
.st-row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.st-row .btns{margin:0}
.st-ph{aspect-ratio:2.2/1;margin-top:40px;overflow:hidden}
.hero-stacked .hero-stats{padding:24px 0;border-bottom:1px solid var(--line)}
/* sections */
.sec{padding:110px 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:44px}
.sec-head h2{max-width:18ch}
.note{max-width:40ch;color:var(--mut);font-size:15px}
.intro-in{display:grid;grid-template-columns:1fr 1.1fr;gap:6vw;align-items:center}
.intro-ph{aspect-ratio:4/5;overflow:hidden}
.intro-txt h2{margin-bottom:22px}
.intro-txt .lead+.lead{margin-top:14px}
.sig{margin-top:24px;font-family:var(--hf);font-size:26px;color:var(--acc)}
.cards{display:grid;gap:20px;grid-template-columns:repeat(3,1fr)}
.cards-4{grid-template-columns:repeat(4,1fr)}
.cards-2{grid-template-columns:repeat(2,1fr)}
.card{display:flex;flex-direction:column;transition:.3s}
.card-ph{aspect-ratio:4/3;overflow:hidden;position:relative}
.card-ph img{transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.card:hover .card-ph img{transform:scale(1.05)}
.tag{position:absolute;top:12px;left:12px;background:var(--bg);color:var(--ink);font-size:12px;font-weight:600;padding:5px 10px}
.card-body{padding:18px 0 0;display:flex;flex-direction:column;flex:1}
.card-body p{color:var(--mut);font-size:15px;margin:8px 0 14px;flex:1}
.card-foot{display:flex;justify-content:space-between;align-items:baseline;gap:10px;border-top:1px solid var(--line);padding-top:12px;font-size:14px}
.meta{color:var(--mut)}
.price{font-family:var(--hf);font-size:20px;white-space:nowrap}
.steps{display:grid;gap:20px;grid-template-columns:repeat(4,1fr)}
.steps-3{grid-template-columns:repeat(3,1fr)}.steps-5{grid-template-columns:repeat(5,1fr)}
.step{padding-top:20px;border-top:2px solid var(--ink)}
.step-n{font-family:var(--hf);font-size:15px;color:var(--acc)}
.step h3{margin:12px 0 8px}
.step p{color:var(--mut);font-size:15px}
.gal{display:grid;gap:14px;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px}
.gal figure{overflow:hidden}
.gal .g0{grid-column:span 2;grid-row:span 2}
.gal-4 .g1{grid-column:span 2}
.quote .q-in{max-width:980px;text-align:center}
.quote blockquote{font-family:var(--hf);font-size:clamp(26px,3vw,44px);line-height:1.25;margin:10px 0 22px}
.quote cite{font-style:normal;color:var(--mut)}
.faq-in{display:grid;grid-template-columns:1fr 1.4fr;gap:60px}
.faq details{border-top:1px solid var(--line);padding:20px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{font-family:var(--hf);font-size:20px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--acc)}
.faq details[open] summary:after{content:"–"}
.faq details p{margin-top:10px;color:var(--mut)}
.cta-band .cta-in{text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}
.cta-band h2{max-width:20ch}
/* footer */
.ft{padding:80px 0 30px;border-top:1px solid var(--line)}
.ft-in{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
.ft h4{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);margin-bottom:12px}
.ft p{font-size:14px;color:var(--mut)}
.ft-brand p{margin-top:16px;max-width:36ch}
.credit{margin-top:60px;padding-top:20px;border-top:1px solid var(--line);font-size:12px;color:var(--mut)}
.credit a{text-decoration:underline}
/* detail */
.d-wrap{padding-top:20px}
.crumb{font-size:13px;color:var(--mut);padding:16px 0}
.crumb a:hover{color:var(--acc)}
.d-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;padding:20px 0 36px}
.d-head h1{font-size:clamp(40px,5.4vw,80px);margin-bottom:14px}
.d-price{text-align:right;flex:none}
.d-price b{display:block;font-family:var(--hf);font-size:clamp(30px,3.4vw,48px);line-height:1.1}
.d-gal{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:260px 260px;gap:12px}
.d-gal figure{overflow:hidden}
.d-gal .dg0{grid-row:span 2}
.d-body{display:grid;grid-template-columns:1.7fr 1fr;gap:6vw;padding:70px 0 20px}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line);margin-bottom:40px}
.facts div{padding:18px 14px 18px 0}
.facts dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);font-weight:600}
.facts dd{font-family:var(--hf);font-size:22px;line-height:1.2;margin-top:4px}
.prose h2{font-size:clamp(26px,2.6vw,38px);margin:40px 0 14px}
.prose h2:first-child{margin-top:0}
.prose p{margin-bottom:14px;max-width:64ch}
.prose ul{list-style:none;columns:2;gap:30px}
.prose li{padding:10px 0;border-bottom:1px solid var(--line);break-inside:avoid}
.prose li:before{content:"— ";color:var(--acc)}
.prose table{width:100%;border-collapse:collapse;font-size:15px}
.prose td{padding:12px 0;border-bottom:1px solid var(--line)}
.prose td:last-child{text-align:right;font-weight:600}
.d-aside{position:sticky;top:110px;align-self:start;padding:30px;border:1px solid var(--line);background:var(--card)}
.d-aside h3{margin-bottom:10px}
.d-aside p{color:var(--mut);font-size:15px;margin-bottom:20px}
.d-aside .btn{width:100%}
.d-aside small{display:block;margin-top:14px;font-size:12px;color:var(--mut)}
/* conversion */
.conv{display:grid;grid-template-columns:1.25fr 1fr;gap:5vw;padding:50px 0 100px}
.form h1{font-size:clamp(38px,4.4vw,64px);margin-bottom:14px}
.form .lead{margin-bottom:30px}
.fld{border:0;margin-bottom:20px}
.fld label,.fld legend{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600}
.fld input,.fld select,.fld textarea{font-size:16px;font-weight:400;padding:13px 15px;border:1.5px solid var(--line);background:var(--card);outline:0;transition:.2s}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--acc)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chips label{display:block}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;padding:10px 16px;border:1.5px solid var(--line);font-size:14px;font-weight:500;cursor:pointer;transition:.2s;background:var(--card)}
.chips input:checked+span{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.form .btn{width:100%;margin-top:8px}
.form-ok{margin-top:16px;padding:16px 18px;background:var(--card);border-left:4px solid var(--acc)}
.side{display:flex;flex-direction:column;gap:16px;align-self:start;position:sticky;top:110px}
.side-ph{aspect-ratio:4/3;overflow:hidden}
.side-box{padding:28px;background:var(--card);border:1px solid var(--line)}
.side-box h3{margin-bottom:12px}
.side-box ul{list-style:none}
.side-box li{padding:10px 0;border-top:1px solid var(--line);font-size:15px}
.side-box li:before{content:"✓ ";color:var(--acc);font-weight:700}
.sum{display:grid;grid-template-columns:1fr auto;margin-bottom:14px}
.sum dt,.sum dd{padding:9px 0;border-top:1px solid var(--line);font-size:15px}
.sum dd{text-align:right;font-weight:600}
/* brand */
.bd section{padding:60px 0;border-top:1px solid var(--line)}
.bd-intro{border:0!important;padding-top:20px!important}
.bd-intro h1{max-width:16ch;margin-bottom:20px}
.style-tag{margin-top:20px;font-size:13px;color:var(--mut)}
.logo-show{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px}
.logo-show>div{aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.ls-a{background:var(--card)}
.ls-a .logo{transform:scale(1.7)}
.ls-b{background:var(--ink);color:var(--bg)}
.ls-c{background:var(--acc);color:var(--bg)}
.swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.sw{aspect-ratio:1;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;font-size:13px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.sw b{font-family:var(--hf);font-size:22px;line-height:1.1}
.type-show{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.ts-h{font-family:var(--hf);font-size:130px;line-height:1}
.ts-b{font-family:var(--bf);font-size:130px;line-height:1}
.apps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.app .wm,.app .logo{color:inherit}.app{aspect-ratio:1.5;padding:24px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media(max-width:1000px){
 .nav,.hd-cta{display:none}.burger{display:flex}
 .nav-open .nav{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--bg);padding:24px 4vw;gap:16px;font-size:20px;border-bottom:1px solid var(--line)}
 .sec{padding:80px 0}
 .hero-split .hero-grid,.intro-in,.faq-in,.d-body,.conv,.type-show{grid-template-columns:1fr}
 .hero-ph{min-height:380px}
 .cards,.cards-4{grid-template-columns:1fr 1fr}
 .steps,.steps-5,.steps-3{grid-template-columns:1fr 1fr}
 .gal{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.gal figure{grid-column:span 1!important;grid-row:span 1!important}.gal .g0{grid-column:span 2!important}
 .ft-in{grid-template-columns:1fr 1fr}.ft-brand{grid-column:span 2}
 .sec-head,.d-head{flex-direction:column;align-items:flex-start}.d-price{text-align:left}
 .facts{grid-template-columns:1fr 1fr}.prose ul{columns:1}
 .d-gal{grid-template-columns:1fr 1fr;grid-template-rows:240px 160px}.d-gal .dg0{grid-column:span 2;grid-row:auto}
 .d-aside,.side{position:static}
 .logo-show,.apps{grid-template-columns:1fr}.ts-h,.ts-b{font-size:90px}
}
@media(max-width:600px){.cards,.cards-4,.cards-2,.steps,.steps-5,.steps-3,.row2{grid-template-columns:1fr}.st-ph{aspect-ratio:4/3}.stats{gap:24px}}

body{font-size:16px;letter-spacing:-.01em}
h1,h2,h3{font-weight:500;letter-spacing:-.045em;line-height:.98}
h1{font-size:clamp(52px,7.4vw,124px)}
h2{font-size:clamp(38px,5vw,84px)}
h3{font-size:24px;letter-spacing:-.025em}
.kick{text-transform:none;letter-spacing:0;font-size:13px;font-weight:500;color:var(--mut)}
.btn{background:var(--acc);color:#fff;border-radius:10px;font-weight:500}
.btn:hover{background:var(--ink);color:#fff}
.btn-alt{border-radius:10px}
.hd{background:var(--bg)}
.hd-in{height:72px}
.wm{font-family:var(--bf);font-weight:500;font-size:24px;letter-spacing:-.03em}
.wm small{letter-spacing:0;text-transform:none;font-size:12px;opacity:.55}
.hd-cta{border-radius:10px}
/* hero: accent panel + full image */
.hero-split .hero-grid{grid-template-columns:5fr 7fr;gap:0;border-radius:16px;overflow:hidden;padding:0;margin-top:12px}
.hero-split .hero-txt{background:var(--acc);color:#fff;padding:clamp(28px,4vw,56px)!important;justify-content:space-between!important;min-height:640px}
.hero-split .hero-txt .kick{color:rgba(255,255,255,.75)}
.hero-split .hero-txt .lead{color:rgba(255,255,255,.88);border-top:1px solid rgba(255,255,255,.4);padding-top:18px}
.hero-split .hero-txt .btn{background:#fff;color:var(--ink)}
.hero-split .hero-txt .btn-alt{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px #fff}
.hero-ph{min-height:640px}
.hero-badge{border-radius:8px;background:var(--acc);color:#fff}
.hero-split .hero-stats{background:var(--ink);color:#fff;padding:30px clamp(28px,4vw,56px);border:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hero-stats .stat{border-top:1px solid rgba(255,255,255,.2);padding-top:14px}
.hero-stats .stat span{color:rgba(255,255,255,.6)}
.stat b{font-family:var(--bf);font-weight:500;font-size:clamp(40px,5vw,84px);letter-spacing:-.05em;color:var(--acc)}
.hero-stacked h1{font-size:clamp(56px,8.6vw,150px)}
.hero-stacked .st-ph{border-radius:16px;aspect-ratio:2.2/1}
.hero-stacked .hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hero-stacked .stat{border-top:1px solid var(--ink);padding-top:12px}
.hero-full{border-radius:16px;margin:12px 4vw 0;min-height:86svh}
.hero-full .hero-box{background:var(--acc);padding:clamp(24px,3.4vw,48px);border-radius:12px;max-width:620px}
.hero-full .hero-box .kick{color:rgba(255,255,255,.75)}
.hero-full .btn{background:#fff;color:var(--ink)}
.hero-full .stat b{color:#fff}
/* chapter-like sections */
.sec-head{display:grid;grid-template-columns:1fr 1fr;align-items:end}
.sec-head .note{justify-self:end}
.intro-ph,.card-ph,.gal figure,.d-gal figure,.side-ph{border-radius:14px}
.intro-in{gap:4vw}
.intro-txt h2{font-size:clamp(34px,3.8vw,60px)}
.card-ph{aspect-ratio:4/3}
.card-foot{border-top:1px solid var(--ink)}
.tag{border-radius:6px;background:var(--acc);color:#fff;font-weight:500}
.price{font-family:var(--bf);font-weight:500;font-size:22px;letter-spacing:-.03em;color:var(--acc)}
.steps-sec{background:var(--ink);color:#fff}
.steps-sec .kick{color:rgba(255,255,255,.6)}
.step{border-top:1px solid rgba(255,255,255,.25)}
.step-n{font-family:var(--bf);font-size:clamp(48px,4.6vw,76px);font-weight:500;letter-spacing:-.05em;color:var(--acc);line-height:1}
.step p{color:rgba(255,255,255,.65)}
.gal{grid-auto-rows:260px}
.quote{background:var(--acc);color:#fff}
.quote .q-in{text-align:left;max-width:none}
.quote .kick{color:rgba(255,255,255,.75)}
.quote blockquote{font-weight:500;letter-spacing:-.035em;font-size:clamp(32px,4vw,64px);line-height:1.05}
.quote cite{color:rgba(255,255,255,.75)}
.faq summary{font-family:var(--bf);font-weight:500}
.faq summary:after{color:var(--acc)}
.cta-band .cta-in{align-items:flex-start;text-align:left}
.cta-band h2{font-size:clamp(52px,8vw,130px)}
.ft{background:var(--ink);color:#fff;border:0}
.ft .wm{color:#fff}.ft .logo{color:var(--acc)}
.ft p,.credit{color:rgba(255,255,255,.55)}
.ft h4{color:var(--acc);letter-spacing:0;text-transform:none;font-size:13px;font-weight:500}
.credit{border-color:rgba(255,255,255,.15)}
.facts{border-top:2px solid var(--acc)}
.facts dd{font-family:var(--bf);font-weight:500;letter-spacing:-.02em}
.d-aside{background:var(--ink);color:#fff;border:0;border-radius:14px}
.d-aside p,.d-aside small{color:rgba(255,255,255,.65)}
.side-box{border-radius:14px}
.fld input,.fld select,.fld textarea{border-radius:10px}
.chips span{border-radius:8px}
.chips input:checked+span{background:var(--acc);border-color:var(--acc);color:#fff}
.logo-show>div,.sw,.app{border-radius:14px}
@media(max-width:1000px){.hero-split .hero-txt,.hero-ph{min-height:auto!important}.hero-split .hero-txt{min-height:420px!important}.hero-split .hero-grid{margin-top:8px}.sec-head{grid-template-columns:1fr}.sec-head .note{justify-self:start}.hero-full{margin:8px}}

@media(max-width:1000px){
 .hero-split .hero-grid,.intro-in,.faq-in{grid-template-columns:1fr!important}
 .hero-ph{min-height:360px!important}
 .st-stack .hero-ph,.st-stack .hero-ph{margin:24px!important}
 .hero-txt{min-height:auto!important}
 .intro-ph{min-height:0!important;aspect-ratio:auto!important;height:340px}
 .stat b{font-size:34px!important}
 .stat{padding:16px!important}
 .gi-ph{width:46vw}
}
@media(max-width:600px){.hero-split .hero-stats{grid-template-columns:1fr 1fr 1fr!important;gap:8px!important}.stat span{font-size:11px}}

.lang-sw{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;letter-spacing:.08em;text-decoration:none;color:inherit;padding:7px 10px;border:1px solid currentColor;border-radius:999px;opacity:.75;line-height:1;white-space:nowrap;margin:0 10px;flex:0 0 auto;justify-self:end;align-self:center;width:auto}.cart{white-space:nowrap}.logo-cell{display:flex;align-items:center;justify-content:space-between}.g>.lang-sw{grid-column:12/13}@media(max-width:900px){.g>.logo{grid-column:1/8!important}.g>.lang-sw{grid-column:8/10}}@media(max-width:700px){.lang-sw{margin:0 6px;padding:6px 8px}}.lang-sw:hover{opacity:1}
