/* Modern visual refresh — layered over the existing design system. */
:root{
  --canvas:#0b0a09;
  --surface:#151311;
  --surface-2:#211d19;
  --line:rgba(238,225,199,.13);
  --gold:#e2ba72;
  --mint:#2fd6a2;
  --blue:#73a7ff;
  --red:#ff6a5e;
  --ease:cubic-bezier(.16,1,.3,1);
  --radius-lg:28px;
  --radius-md:18px;
}
html.light{
  --canvas:#f7f1e6;
  --surface:#fffaf1;
  --surface-2:#ede3d1;
  --line:rgba(31,24,14,.14);
  --gold:#9f6e17;
}
body{
  background:
    radial-gradient(circle at 82% -10%,color-mix(in srgb,var(--gold) 15%,transparent) 0 24rem,transparent 42rem),
    radial-gradient(circle at -8% 22%,color-mix(in srgb,var(--mint) 8%,transparent) 0 19rem,transparent 38rem),
    var(--canvas);
}
::selection{background:var(--gold);color:var(--canvas)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:8px}
a,button,input{touch-action:manipulation}

/* ------- modern landing ------- */
.nav{
  position:fixed;inset:14px 18px auto;z-index:40;
  border:1px solid color-mix(in srgb,var(--line) 78%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--canvas) 72%,transparent);
  backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 20px 60px rgba(0,0,0,.24);
  transition:background .3s,border-color .3s,transform .4s var(--ease);
}
.nav.scrolled{background:color-mix(in srgb,var(--canvas) 90%,transparent);border-color:color-mix(in srgb,var(--gold) 20%,var(--line))}
.nav-mark{min-width:44px;min-height:44px;padding:6px 12px}
.nav-mark img{height:30px;width:auto}
.nav-links a{padding:10px 8px;color:var(--muted);position:relative}
.nav-links a::after{content:"";position:absolute;left:8px;right:8px;bottom:5px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-links a:hover{color:var(--text)}
.nav-tools,.lang-sw{align-items:center}
.lang-sw{backdrop-filter:blur(10px)}
.lang-sw button{min-height:36px;padding:8px 11px}
.theme-sw{min-width:38px;width:38px;height:38px;min-height:38px}
.hero-mark{width:clamp(70px,6vw,94px);height:auto;margin-bottom:20px;opacity:.9;filter:drop-shadow(0 12px 30px rgba(226,186,114,.16))}

.hero{
  min-height:100svh;
  padding:clamp(112px,14vh,170px) clamp(20px,5vw,64px) clamp(44px,6vh,74px);
  justify-content:center;
  isolation:isolate;
}
.hero::before{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:
    linear-gradient(90deg,var(--canvas) 0 48%,transparent 72%),
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--line) 35%,transparent) 0 1px,transparent 1px calc(100%/6));
  mask-image:linear-gradient(#000 68%,transparent);
}
.hero h1{max-width:11.5ch;font-size:clamp(44px,7.8vw,110px);letter-spacing:-.045em}
.hero-meta{margin-top:clamp(26px,4.4vh,46px)}
.hero-sub{font-size:clamp(16px,1.35vw,19px);max-width:620px}
.hero-actions{
  display:flex;gap:13px;flex-wrap:wrap;margin-top:34px;
  opacity:0;transform:translateY(18px);animation:rise .9s var(--ease) .7s forwards;
}
.hero-actions .btn-hero,
.hero-actions .btn-ghost{
  min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 23px;border-radius:999px;font-weight:700;font-size:14px;letter-spacing:.03em;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .3s;
}
.btn-hero{background:var(--gold);color:var(--canvas);box-shadow:0 16px 44px -18px var(--gold)}
.btn-hero:hover{transform:translateY(-3px);box-shadow:0 22px 60px -18px var(--gold)}
.btn-ghost{border:1px solid var(--line);color:var(--text);background:color-mix(in srgb,var(--surface) 72%,transparent)}
.btn-ghost:hover{transform:translateY(-3px);border-color:var(--gold)}
.hero-visual{
  position:absolute;right:clamp(22px,6vw,92px);top:50%;z-index:-1;
  width:min(43vw,600px);transform:translateY(-50%);
  opacity:0;animation:visual-in 1.2s var(--ease) .45s forwards;
}
@keyframes visual-in{from{opacity:0;transform:translateY(calc(-50% + 30px)) rotate(1deg)}to{opacity:1;transform:translateY(-50%)}}
.hero-visual-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;transform:rotate(-2deg)}
.visual-card{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:24px;
  background:color-mix(in srgb,var(--surface) 82%,transparent);box-shadow:0 36px 90px rgba(0,0,0,.34);
}
.visual-card img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform 5s var(--ease)}
.visual-card:hover img{transform:scale(1.05)}
.visual-card.main{grid-row:span 2;aspect-ratio:.78}
.visual-card:not(.main){aspect-ratio:1.45}
.visual-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.5))}
.visual-chip{
  position:absolute;left:14px;bottom:13px;z-index:1;padding:7px 10px;border-radius:999px;
  background:rgba(10,9,8,.66);color:#fff3dc;border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(8px);font-size:11px;font-weight:700;letter-spacing:.05em;
}
.visual-orb{
  position:absolute;right:-26px;bottom:-18px;width:130px;height:130px;border-radius:50%;
  background:radial-gradient(circle at 35% 28%,#fff1c9,var(--gold) 35%,#6f4210);
  box-shadow:0 30px 80px color-mix(in srgb,var(--gold) 40%,transparent);
  display:grid;place-items:center;font:600 15px/1.2 var(--font-display);color:#17110a;text-align:center;
  animation:orb-float 5s ease-in-out infinite alternate;
}
@keyframes orb-float{to{transform:translateY(-16px) rotate(8deg)}}
html.light .visual-card{box-shadow:0 30px 70px rgba(104,79,32,.18)}
html.light .visual-chip{color:#fff}

.section{position:relative;padding-block:clamp(78px,12vh,138px)}
.section.prod:nth-of-type(odd){background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--prod) 4%,transparent) 45%,transparent)}
.split{align-items:center}
.copy,.shot{position:relative;z-index:1}
.shot-window,.more-card{
  border-radius:24px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 88%,#fff 5%),var(--surface));
  border-color:color-mix(in srgb,var(--line) 82%,transparent);
}
.shot-bar{background:color-mix(in srgb,var(--canvas) 45%,transparent)}
.tag,.more-card,.shot-window,.logo-badge{will-change:transform}
.cta{border-radius:999px;min-height:52px;padding:16px 25px;box-shadow:0 16px 42px -20px var(--prod,var(--gold))}
.tag{background:color-mix(in srgb,var(--surface) 70%,transparent)}
.more-list{gap:20px}
.more-card{transition-duration:.45s}
.more-body{padding:22px}
.principle{padding:28px 0}
.f-grid{align-items:flex-end}
.f-brand{font-size:26px}

@media(max-width:1100px){
  .hero{padding-right:clamp(20px,5vw,64px)}
  .hero-visual{position:relative;right:auto;top:auto;transform:none;width:min(720px,100%);margin-top:46px;animation:rise .9s var(--ease) .7s forwards;z-index:1}
  .visual-orb{width:104px;height:104px;right:2px;bottom:-16px}
}
@media(max-width:900px){
  .nav{inset:10px 10px auto;border-radius:20px;align-items:flex-start}
  .nav-links{display:flex;overflow-x:auto;gap:14px;width:100%;order:3;padding:8px 8px 2px;scrollbar-width:none}
  .nav-links::-webkit-scrollbar{display:none}
  .nav-links a{padding:8px 2px;font-size:12px;white-space:nowrap}
  .nav{flex-wrap:wrap}
  .nav-tools{margin-left:auto}
  .hero{padding-top:150px}
}
@media(max-width:620px){
  .hero{padding-top:138px}
  .hero-mark{width:74px;margin-bottom:18px}
  .hero-actions{gap:10px}
  .hero-actions a{width:100%}
  .hero-meta{gap:24px}
  .hero-visual-grid{gap:10px;transform:none}
  .visual-card{border-radius:17px}
  .visual-card.main{aspect-ratio:1}
  .visual-chip{left:9px;bottom:9px;font-size:9px;padding:5px 8px}
  .section{padding-inline:18px}
  .split{gap:42px}
  .logo-badge{right:12px;bottom:12px}
}
@media (prefers-reduced-motion:reduce){
  .hero-actions,.hero-visual,.visual-orb{animation:none!important;opacity:1;transform:none}
  .visual-card img{transition:none}
}

/* ------- modern storefront ------- */
.store-page .top{
  position:sticky;top:10px;z-index:30;width:calc(100% - 20px);max-width:1220px;margin:10px auto 0;
  padding:12px 14px;border:1px solid var(--line);border-radius:999px;
  background:color-mix(in srgb,var(--canvas) 74%,transparent);backdrop-filter:blur(18px);
  box-shadow:0 20px 60px rgba(0,0,0,.22);
}
.store-page .brand{padding:3px 10px;border-radius:999px}
.store-page .brand img{width:38px;height:38px;border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.28)}
.store-page .brand>span{font-size:16px}
.store-page .head{max-width:1180px;padding-top:clamp(48px,7vh,82px);position:relative}
.store-page .head::before{
  content:"";position:absolute;right:clamp(18px,5vw,70px);top:20px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--gold) 18%,transparent),transparent 68%);z-index:-1;filter:blur(10px);
}
.store-page .kick{font-size:12px}
.store-page .head h1{max-width:840px;font-size:clamp(40px,6.6vw,82px);line-height:1.02;letter-spacing:-.045em}
.store-page .head p{font-size:clamp(15px,1.5vw,18px);max-width:720px}
.store-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1180px;width:100%;margin:30px auto 0;padding:0 clamp(18px,4vw,48px)}
.trust-item{display:flex;align-items:center;gap:12px;min-height:62px;padding:13px 16px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--surface) 72%,transparent)}
.trust-icon{width:35px;height:35px;flex:none;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--gold)}
.trust-item span:last-child{font-size:12.5px;color:var(--muted);line-height:1.35}
.store-page .grid{max-width:1180px;padding-top:34px;perspective:1200px}
.store-page .card{
  position:relative;border-radius:26px;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 88%,#fff 4%),var(--surface));
  animation:card-in .7s var(--ease) both;
}
@keyframes card-in{from{opacity:0;transform:translateY(28px) scale(.98)}to{opacity:1;transform:none}}
.store-page .card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.14),transparent 35%,color-mix(in srgb,var(--gold) 10%,transparent));
  opacity:0;transition:opacity .35s;
}
.store-page .card:hover::before{opacity:1}
.store-page .card .thumb{aspect-ratio:1005/443;background:#080706}
.store-page .card .b{padding:24px}
.store-page .card h3{font-size:clamp(22px,2vw,27px);line-height:1.2}
.card-kicker{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--gold)}
.card-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 5px color-mix(in srgb,var(--mint) 12%,transparent)}
.store-page .buy{min-width:108px;border-radius:999px;padding:14px 19px;box-shadow:0 15px 38px -18px var(--gold)}
.store-page .buy:hover{transform:translateY(-2px) scale(1.02)}
.store-page footer{max-width:1180px;width:calc(100% - 36px);margin:auto auto 20px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--surface) 70%,transparent);padding:18px 22px}

.store-page .ov{align-items:flex-end;padding:14px}
.store-page .modal{border-radius:30px 30px 18px 18px;box-shadow:0 -24px 100px rgba(0,0,0,.58)}
.store-page .m-prod{padding:30px;background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 8%,transparent),transparent)}
.store-page .m-prod img.cov{border-radius:20px;box-shadow:0 24px 70px rgba(0,0,0,.34)}
.store-page .m-prod .pr::after{content:" USD";font:700 10px/1 var(--font-body);letter-spacing:.12em;color:var(--faint);vertical-align:middle}
.store-page .m-pay{padding:30px;position:relative}
.store-page .m-pay::before{content:"";position:absolute;left:24px;right:24px;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.store-page .finput{border-radius:14px;min-height:54px}
.store-page .btn{border-radius:999px;min-height:54px;font-size:13px;box-shadow:0 16px 44px -18px var(--gold)}
.store-page .btn.alt{box-shadow:none}
.store-page .m-close{background:color-mix(in srgb,var(--surface) 78%,transparent);backdrop-filter:blur(10px)}
.checkout-step{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.checkout-step::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:9px;box-shadow:0 0 0 5px color-mix(in srgb,var(--gold) 13%,transparent)}

@media(min-width:761px){
  .store-page .ov{align-items:center;padding:24px}
  .store-page .modal{border-radius:30px;overflow:hidden}
  .store-page .m-pay::before{top:0;bottom:0;left:0;right:auto;width:1px;height:auto}
}
@media(max-width:760px){
  .store-page .top{border-radius:22px;padding:10px;gap:8px}
  .store-page .brand>span{font-size:14px;white-space:nowrap}
  .store-page .brand img{width:32px;height:32px}
  .store-page .lang-sw button{padding:9px 8px;font-size:11px}
  .store-page .theme-sw{width:34px;height:34px;min-width:34px;min-height:34px}
  .store-page .head{padding-top:36px}
  .store-page .head h1{font-size:clamp(37px,10vw,56px)}
  .store-trust{display:flex;overflow-x:auto;margin-top:20px;padding-bottom:4px;scrollbar-width:none}
  .store-trust::-webkit-scrollbar{display:none}
  .trust-item{min-width:250px;min-height:54px;scroll-snap-align:start}
  .store-page .grid{padding-inline:16px}
  .store-page .card .row{align-items:stretch;flex-direction:column}
  .store-page .buy{width:100%}
  .store-page .m-prod,.store-page .m-pay{padding:22px}
  .store-page footer{width:calc(100% - 28px)}
}
@media (prefers-reduced-motion:reduce){.store-page .card{animation:none}}