/* ===== High Life — depth & immersion layer (transform/opacity only, reduced-motion safe) ===== */
:root{--neon:#3dff9a;--neon-soft:rgba(61,255,154,.35);--glass:rgba(22,26,35,.62);--glass-line:rgba(255,255,255,.08)}

/* ---------- HERO: layered depth ---------- */
.hero{perspective:1200px;isolation:isolate;padding-bottom:120px}
.hero .glow{will-change:transform;transform:translate3d(0,calc(var(--sy,0) * .25px),0)}
.hero .g1{background:radial-gradient(circle at 40% 40%,var(--violet),transparent 70%)}
.hero .g2{background:radial-gradient(circle at 50% 50%,var(--neon),transparent 70%);opacity:.28}
.orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(40px);opacity:.5;z-index:-1;will-change:transform;
  transform:translate3d(calc(var(--px,0) * var(--z) * 1px),calc(var(--py,0) * var(--z) * 1px + var(--sy,0) * var(--zs) * 1px),0)}
.orb::after{content:"";position:absolute;inset:0;border-radius:inherit;animation:orbFloat 14s ease-in-out infinite alternate}
.orb.o1{width:220px;height:220px;left:6%;top:12%;background:radial-gradient(circle,rgba(61,255,154,.55),transparent 70%);--z:-14;--zs:.35}
.orb.o2{width:300px;height:300px;right:30%;top:-60px;background:radial-gradient(circle,rgba(139,123,255,.45),transparent 70%);--z:10;--zs:.15}
.orb.o3{width:160px;height:160px;right:6%;bottom:16%;background:radial-gradient(circle,rgba(61,255,154,.4),transparent 70%);--z:22;--zs:-.2}
.smoke{position:absolute;inset:-20% -10% auto -10%;height:120%;z-index:-1;pointer-events:none;opacity:.5;
  background:radial-gradient(40% 30% at 20% 30%,rgba(61,255,154,.10),transparent 70%),radial-gradient(35% 28% at 75% 20%,rgba(139,123,255,.12),transparent 70%),radial-gradient(30% 25% at 55% 75%,rgba(61,255,154,.07),transparent 70%);
  animation:smokeDrift 26s ease-in-out infinite alternate;will-change:transform}
@keyframes smokeDrift{0%{transform:translate3d(-2%,0,0) scale(1)}100%{transform:translate3d(3%,-3%,0) scale(1.08)}}
@keyframes orbFloat{0%{transform:translateY(0)}100%{transform:translateY(-18px)}}
/* perspective grid floor */
.grid-floor{position:absolute;left:-25%;right:-25%;bottom:-2px;height:240px;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(61,255,154,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(61,255,154,.22) 1px,transparent 1px);
  background-size:56px 56px;transform:perspective(500px) rotateX(62deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(to top,#000 10%,transparent 85%);mask-image:linear-gradient(to top,#000 10%,transparent 85%);opacity:.55}
.hero-inner{transform:translate3d(calc(var(--px,0) * -6px),calc(var(--sy,0) * -.06px),0);will-change:transform}
.hero h1{text-shadow:0 2px 0 rgba(0,0,0,.4),0 18px 40px rgba(0,0,0,.45)}
.hero .grad{text-shadow:none;background:linear-gradient(90deg,var(--neon),var(--mint) 45%,var(--violet));-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 18px rgba(61,255,154,.28))}
.hero .eyebrow{color:var(--neon);text-shadow:0 0 12px var(--neon-soft)}
/* hero photo: tilting 3D frame */
.hero-stage{perspective:1000px;transform:translate3d(0,calc(var(--sy,0) * .08px),0);will-change:transform}
.hero-photo{transform-style:preserve-3d;transform:rotateY(calc(-8deg + var(--px,0) * 8deg)) rotateX(calc(4deg - var(--py,0) * 6deg)) rotateZ(1deg);
  transition:transform .25s ease-out;box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 0 1px rgba(61,255,154,.15),0 0 60px rgba(61,255,154,.12);position:relative;overflow:visible;background:var(--card)}
.hero-photo img{border-radius:24px 24px 0 0;transform:translateZ(30px)}
.hero-photo figcaption{transform:translateZ(18px);background:var(--card);border-radius:0 0 24px 24px}
.hero-photo::before{content:"";position:absolute;inset:-14px;border-radius:30px;border:1px solid rgba(61,255,154,.28);transform:translateZ(-40px);box-shadow:0 0 30px rgba(61,255,154,.15) inset;pointer-events:none}
.hero-photo::after{content:"";position:absolute;inset:0;border-radius:24px;pointer-events:none;transform:translateZ(31px);
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.12) 48%,transparent 60%);background-size:250% 100%;background-position:calc(50% + var(--px,0) * 60%) 0;mix-blend-mode:screen}
.hero-facts li{background:var(--glass);border-color:var(--glass-line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06)}
.hero-facts strong{color:var(--neon);text-shadow:0 0 14px var(--neon-soft)}

/* ---------- Section depth & dividers ---------- */
.section{position:relative}
.section+.section::before{content:"";position:absolute;top:-1px;left:10%;right:10%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(61,255,154,.55),rgba(139,123,255,.45),transparent);box-shadow:0 0 18px rgba(61,255,154,.35)}
.alt{background:radial-gradient(1200px 400px at 50% 0%,rgba(61,255,154,.05),transparent 60%),linear-gradient(180deg,#10131a,#0d1016)}
.h2{text-shadow:0 10px 30px rgba(0,0,0,.45)}

/* ---------- Cards: glass + 3D tilt ---------- */
.card,.photo-gallery figure{background:linear-gradient(160deg,rgba(30,35,48,.85),rgba(18,21,29,.92));border-color:var(--glass-line);
  box-shadow:0 14px 34px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.05)}
.tilt{position:relative;transform-style:preserve-3d;will-change:transform;
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translate3d(0,var(--lift,0px),0);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}
.tilt.is-tilting{transition:transform .08s linear,box-shadow .35s,border-color .35s}
.tilt:hover,.tilt.is-tilting{--lift:-6px;border-color:rgba(61,255,154,.35);
  box-shadow:0 30px 60px rgba(0,0,0,.5),0 0 0 1px rgba(61,255,154,.12),0 0 40px rgba(61,255,154,.12)}
.pcard:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translate3d(0,var(--lift,0px),0)}
.tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.10),rgba(61,255,154,.05) 30%,transparent 60%)}
.tilt:hover::after,.tilt.is-tilting::after{opacity:1}
/* depth layering: image floats above text plane */
.tilt .product-photo,.tilt .loc-photo,.tilt .map{transform:translateZ(36px);box-shadow:0 16px 30px rgba(0,0,0,.45)}
.tilt h3,.tilt .badge,.tilt .loc-phone,.tilt .rating{transform:translateZ(22px)}
.tilt .stars,.tilt blockquote{transform:translateZ(16px)}
.tilt .ico{transform:translateZ(30px)}
.loc .badge{box-shadow:0 0 16px rgba(61,255,154,.18)}
.loc .loc-phone{color:var(--neon);text-shadow:0 0 12px rgba(61,255,154,.3)}
/* compliance boxes stay flat & fully readable on top */
.tilt .nic,.tilt .hemp{transform:translateZ(10px);position:relative}
.photo-gallery figure.tilt{overflow:visible}
.photo-gallery figure.tilt a{border-radius:var(--r) var(--r) 0 0;overflow:hidden;transform:translateZ(12px)}
.stat{background:var(--glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 12px 30px rgba(0,0,0,.35)}
.stat strong{color:var(--neon);text-shadow:0 0 14px var(--neon-soft)}
.about-photo{box-shadow:0 30px 60px rgba(0,0,0,.5),0 0 0 1px rgba(61,255,154,.12);transform:perspective(1000px) rotateX(3deg);transform-origin:50% 0}
.nav{background:rgba(11,13,18,.7);box-shadow:0 8px 30px rgba(0,0,0,.35)}

/* ---------- Buttons: depth, press, glow ---------- */
.btn{position:relative;transform:translateY(0);transition:transform .15s ease,box-shadow .2s ease,filter .2s}
.btn-primary{background:linear-gradient(135deg,var(--neon),var(--mint) 45%,var(--violet));
  box-shadow:0 5px 0 #1d7a55,0 12px 28px rgba(61,255,154,.28),inset 0 1px 0 rgba(255,255,255,.45)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 7px 0 #1d7a55,0 18px 40px rgba(61,255,154,.42),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-primary:active{transform:translateY(4px);box-shadow:0 1px 0 #1d7a55,0 6px 14px rgba(61,255,154,.3),inset 0 2px 6px rgba(0,0,0,.2)}
.btn-ghost{background:rgba(255,255,255,.03);box-shadow:0 4px 0 rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06)}
.btn-ghost:hover{transform:translateY(-2px);border-color:var(--neon);box-shadow:0 6px 0 rgba(0,0,0,.55),0 0 22px rgba(61,255,154,.25)}
.btn-ghost:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(0,0,0,.55)}
.btn:focus-visible{outline:2px solid var(--neon);outline-offset:3px}

/* ---------- Scroll reveal (only when JS active) ---------- */
.reveal-on .reveal{opacity:0;transform:translate3d(0,34px,0) scale(.98);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.reveal-on .reveal.in{opacity:1;transform:none}
.reveal-on .tilt.reveal.in{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translate3d(0,var(--lift,0px),0)}

/* ---------- Touch: no pointer tilt ---------- */
@media (hover:none),(pointer:coarse){
  .hero-photo{transform:rotateY(-4deg) rotateX(3deg)}
  .tilt:hover{--lift:0px}
  .tilt .product-photo,.tilt .loc-photo,.tilt .map,.tilt h3,.tilt .badge,.tilt .loc-phone,.tilt .rating,.tilt .stars,.tilt blockquote,.tilt .ico,.tilt .nic,.tilt .hemp,.photo-gallery figure.tilt a{transform:none}
  .hero-inner{transform:translate3d(0,calc(var(--sy,0) * -.04px),0)}
}
@media (max-width:720px){.grid-floor{height:160px;background-size:40px 40px}.orb.o2{width:200px;height:200px}.hero-photo::before{inset:-8px}}

/* ---------- Reduced motion: everything static ---------- */
@media (prefers-reduced-motion:reduce){
  .orb,.orb::after,.smoke,.hero .glow,.hero-inner,.hero-stage{animation:none!important;transform:none!important}
  .hero-photo{transform:rotate(1deg)!important;transition:none}
  .tilt,.tilt:hover,.pcard:hover{transform:none!important;transition:box-shadow .2s,border-color .2s}
  .tilt *{transform:none!important}
  .reveal-on .reveal{opacity:1!important;transform:none!important;transition:none!important}
  .btn,.btn:hover,.btn:active{transform:none!important}
  .about-photo{transform:none}
}