/* BN719 - Depth system for the public pages: lit surfaces, lifted cards with a light top edge, raised icon tiles, glass cards on the
   green bands, a timeline of raised keys, pressable buttons, a swinging tag display. Tilt-on-hover comes from bn719-depth2.js. */
:root{--lift-1:0 1px 1px rgba(16,24,40,.05),0 2px 4px -1px rgba(16,24,40,.06),0 10px 22px -12px rgba(16,24,40,.2);--lift-2:0 1px 1px rgba(16,24,40,.06),0 8px 16px -6px rgba(16,24,40,.14),0 26px 48px -22px rgba(16,24,40,.3);--edge:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(16,24,40,.04)}
/* lit backgrounds */
section.why,section.trial,#pricing{position:relative;isolation:isolate}
section.why::before,section.trial::before,#pricing::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(60% 45% at 15% 10%,rgba(21,128,61,.07),transparent 70%),radial-gradient(50% 40% at 90% 85%,rgba(180,140,60,.07),transparent 70%)}
/* buttons */
.btn{transition:transform .12s ease,box-shadow .2s ease,background-color .2s ease}
.btn.btn-primary{background-image:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 55%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 1px rgba(16,24,40,.2),0 8px 18px -8px rgba(21,128,61,.6)!important}
.btn.btn-ghost{box-shadow:var(--edge),0 1px 2px rgba(16,24,40,.06),0 6px 14px -8px rgba(16,24,40,.25)!important;background:#fff!important}
.btn:active{transform:translateY(1px) scale(.985)}
@media (hover:hover) and (pointer:fine){.btn:hover{transform:translateY(-1px)}}
/* why grid: cards with raised icon tiles */
.why-item{background:#fff;border:1px solid #e9ebef;border-radius:18px;padding:18px 18px 16px!important;box-shadow:var(--edge),var(--lift-1);transform-style:preserve-3d;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease}
.why-item>svg{width:44px!important;height:44px!important;padding:10px;border-radius:12px;color:#166534;background:linear-gradient(160deg,#f0fdf4,#dcfce7);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -2px 0 rgba(21,128,61,.12),0 6px 12px -6px rgba(21,128,61,.45);transform:translateZ(18px)}
/* mall band: lit recessed panel + glass points */
section.why+section{position:relative;isolation:isolate;box-shadow:inset 0 18px 30px -20px rgba(0,0,0,.45),inset 0 -18px 30px -20px rgba(0,0,0,.35)}
section.why+section::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(55% 70% at 20% 0%,rgba(255,255,255,.14),transparent 70%),radial-gradient(40% 60% at 95% 100%,rgba(0,0,0,.25),transparent 70%)}
section.why+section ul li{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.06))!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:14px!important;backdrop-filter:blur(6px);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 12px 24px -14px rgba(0,0,0,.6)}
/* trial calendar: raised keys, charged days pressed */
.cal .day{background:linear-gradient(180deg,#fff,#f4f6f8)!important;border:1px solid #e3e7ec!important;border-radius:10px!important;box-shadow:inset 0 1px 0 #fff,0 2px 0 #d6dbe1,0 6px 10px -6px rgba(16,24,40,.3)}
.cal .day.mark{background:linear-gradient(180deg,#166534,#14532d)!important;border-color:#14532d!important;box-shadow:inset 0 2px 4px rgba(0,0,0,.35),0 1px 0 rgba(255,255,255,.4);transform:translateY(2px)}
.trial-notes>div{background:#fff;border:1px solid #e9ebef;border-radius:14px;padding:12px 14px;box-shadow:var(--edge),var(--lift-1)}
/* pricing: lifted cards, featured raised */
#pricing .plans{perspective:1400px}
#pricing .plan,#pricing .plan-free,#malls>div>div{background:#fff!important;border:1px solid #e9ebef!important;border-radius:20px!important;box-shadow:var(--edge),var(--lift-1)!important;transform-style:preserve-3d;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease}
#pricing .plan.feature,#malls>div>div:nth-child(2){box-shadow:var(--edge),0 0 0 2px #15803d,0 30px 60px -28px rgba(21,128,61,.55),0 10px 20px -10px rgba(16,24,40,.25)!important;transform:translateY(-10px)}
#pricing .plan .price strong,#malls>div>div>div:nth-child(2){text-shadow:0 1px 0 #fff,0 2px 6px rgba(16,24,40,.12)}
/* FAQ as stacked cards */
section details{background:#fff;border:1px solid #e9ebef!important;border-radius:14px!important;margin:0 0 8px!important;box-shadow:var(--edge),0 1px 2px rgba(16,24,40,.05),0 8px 16px -12px rgba(16,24,40,.25);overflow:hidden}
section details>summary{padding:14px 16px!important}
section details[open]{box-shadow:var(--edge),var(--lift-2)}
/* closer: lit band + swinging tags */
section.closer{position:relative;isolation:isolate;box-shadow:inset 0 18px 30px -20px rgba(0,0,0,.45)}
section.closer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(50% 80% at 80% 20%,rgba(255,255,255,.14),transparent 70%)}
section.closer svg g{filter:drop-shadow(0 8px 10px rgba(0,0,0,.35));transform-box:fill-box;transform-origin:50% 0;animation:bn719swing 6s ease-in-out infinite}
section.closer svg g:nth-of-type(2){animation-delay:-2s}section.closer svg g:nth-of-type(3){animation-delay:-4s}
@keyframes bn719swing{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
@media (max-width:900px){#pricing .plan.feature,#malls>div>div:nth-child(2){transform:none}}
@media (prefers-reduced-motion:reduce){section.closer svg g{animation:none}.why-item,#pricing .plan,#malls>div>div,.btn{transition:none}}
