/* ============================================================
   PRECISE FINAL REFERENCE LAYOUT — 2026-09-12
   The supplied reference screenshot is layout guidance only.
   No asset is cropped or extracted from that screenshot.
   ============================================================ */

/* Exact site font stack — removes the GLISSA-only font mismatch. */
body,button,input,textarea,select,h1,h2,h3,h4,p,a,span,strong,small,li{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
}

/* New Particle Wave Background — exact uploaded file, never extracted from the reference. */
.hero .particleWaveBg{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  z-index:1!important;
  opacity:.62!important;
  margin:0!important;
  filter:brightness(.47) saturate(1.02)!important;
  transform:none!important;
  pointer-events:none!important;
}
.particleWaveOverlay{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  background:
    linear-gradient(90deg,rgba(5,8,15,.74) 0%,rgba(5,8,15,.28) 48%,rgba(5,8,15,.70) 100%),
    linear-gradient(to bottom,rgba(5,8,15,.28) 0%,rgba(5,8,15,.72) 68%,rgba(5,8,15,.94) 100%)!important;
}
.hero.particleHero{padding:24px 0 42px!important;min-height:0!important;}
.particleHeroContent{width:min(1240px,calc(100% - 48px))!important;gap:16px!important;}

/* Pricing layout matched to the reference visual rhythm. */
.heroPricing .pricingInner{
  max-width:1120px!important;
  padding:0 10px 14px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  overflow:visible!important;
}
.heroPricing .pricingHeader{margin:0 auto 14px!important;text-align:center!important;}
.heroPricing .pricingHeader h2{margin:0 0 2px!important;font-size:clamp(30px,3.1vw,44px)!important;line-height:1.08!important;letter-spacing:-.025em!important;}
.heroPricing .pricingHeader h2 span{color:#f3a51a!important;}
.heroPricing .pricingHeader p{margin:0!important;color:#dce2ea!important;font-size:15px!important;line-height:1.4!important;}
.heroPricing .pricingHeader small{display:block!important;margin-top:2px!important;color:#b7c0cc!important;font-size:12px!important;}


/* TEMP 2026-10-25: Keep the 7-Pass bundle code intact but hidden until public activation. */
.heroPricing .pricingGrid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:20px!important;
  align-items:stretch!important;
  max-width:340px!important;
  margin:0 auto!important;
}
.heroPricing .sessionPassCard[hidden]{display:none!important;}
.heroPricing .sessionPassCard{
  border-color:rgba(245,162,11,.72)!important;
  background:linear-gradient(180deg,rgba(40,29,16,.90),rgba(9,19,34,.92))!important;
  box-shadow:0 0 15px rgba(245,162,11,.18),0 14px 36px rgba(0,0,0,.27)!important;
}
.heroPricing .sessionPassButton{
  background:linear-gradient(100deg,#ffbd39,#f0a007)!important;
  color:#171008!important;
  border-color:transparent!important;
  box-shadow:0 10px 26px rgba(238,144,0,.22)!important;
}
.heroPricing .passFeatureList{margin-bottom:14px!important;}
.heroPricing .passBundlePriceRow{align-items:center!important;gap:10px!important;margin-bottom:8px!important;}
.heroPricing .passBundlePriceRow .currentPrice{font-size:40px!important;line-height:.95!important;}
.heroPricing .passPerPass{display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:5px 8px!important;border:1px solid rgba(245,162,11,.45)!important;border-radius:999px!important;background:rgba(245,162,11,.08)!important;color:#f3b33d!important;font-size:12px!important;font-weight:800!important;line-height:1!important;white-space:nowrap!important;}
.heroPricing .passValueNote{margin:-1px 0 12px!important;text-align:center!important;color:#f3b33d!important;font-size:11px!important;font-weight:700!important;line-height:1.35!important;}
.heroPricing .pricingCard{
  min-width:0!important;
  min-height:315px!important;
  overflow:visible!important;
  padding:20px 20px 16px!important;
  border-radius:12px!important;
  background:rgba(9,19,34,.88)!important;
  border:1px solid rgba(84,159,230,.50)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.27)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  text-align:left!important;
}
.heroPricing .pricingCard.recommended{
  border-color:rgba(245,162,11,.88)!important;
  background:linear-gradient(180deg,rgba(48,30,14,.88),rgba(10,17,29,.92))!important;
  box-shadow:0 0 18px rgba(245,162,11,.28),0 18px 42px rgba(0,0,0,.32)!important;
}
.planTopline{display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;margin:0 0 5px!important;flex-wrap:wrap!important;text-align:center!important;}
.planName{font-size:20px!important;line-height:1.16!important;text-align:center!important;}
.planBadge{padding:4px 8px!important;font-size:9px!important;line-height:1!important;border-radius:999px!important;}
.planBadge.recommendedBadge{top:-10px!important;padding:5px 14px!important;background:linear-gradient(100deg,#ffb72b,#ee9000)!important;color:#171008!important;border-color:rgba(255,183,43,.95)!important;box-shadow:0 4px 15px rgba(238,144,0,.28)!important;}
.planCopy{min-height:0!important;margin:0 0 12px!important;text-align:center!important;color:#c5cdd7!important;font-size:12px!important;line-height:1.42!important;}
.priceRow{display:flex!important;justify-content:center!important;align-items:flex-end!important;gap:9px!important;margin:0 0 12px!important;text-align:center!important;}
.currentPrice{font-size:32px!important;line-height:1!important;}
.currentPrice small{font-size:13px!important;}
.oldPrice{font-size:13px!important;padding-bottom:2px!important;}
.planFeatures{list-style:none!important;padding:0!important;margin:0 0 16px!important;display:grid!important;gap:7px!important;}
.planFeatures li{position:relative!important;padding-left:25px!important;color:#eef1f5!important;font-size:12px!important;line-height:1.35!important;min-width:0!important;overflow-wrap:break-word!important;}
.planFeatures li::before{content:'✓'!important;position:absolute!important;left:0!important;top:0!important;width:17px!important;height:17px!important;border:1px solid rgba(245,162,11,.85)!important;border-radius:50%!important;color:#ffb21a!important;display:grid!important;place-items:center!important;font-size:10px!important;font-weight:900!important;line-height:1!important;}
.planButton{padding:11px 14px!important;border-radius:8px!important;font-size:13px!important;margin-top:auto!important;}
.monthlyCard .planButton,.lifetimeCard .planButton{background:rgba(3,9,18,.54)!important;color:#ffb21a!important;box-shadow:none!important;}
.yearlyCard .planButton{background:linear-gradient(100deg,#ffbd39,#f0a007)!important;color:#171008!important;box-shadow:0 10px 26px rgba(238,144,0,.24)!important;}
.heroPricing .trustRow{margin-top:12px!important;gap:10px 24px!important;font-size:11px!important;}
.heroPricing .trustItem img{width:17px!important;height:17px!important;}

/* GLISSA icon/wordmark: exactly 50% of the previous 430px desktop size. */
.glissaWordmarkLockup{
  width:215px!important;
  max-width:215px!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
  margin:0 auto!important;
  filter:none!important;
  transform:none!important;
  opacity:1!important;
}

/* Brand strip directly below plans — reference composition, existing assets only. */
.heroIntro{
  width:min(100%,1120px)!important;
  display:grid!important;
  grid-template-columns:225px minmax(260px,.9fr) minmax(520px,1.7fr)!important;
  gap:20px!important;
  align-items:center!important;
  text-align:left!important;
  padding:14px 18px!important;
  border-radius:12px!important;
  background:rgba(6,15,28,.84)!important;
  border:1px solid rgba(245,162,11,.28)!important;
  overflow:hidden!important;
}
.heroBrandPane{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;min-width:0!important;padding-right:16px!important;border-right:1px solid rgba(255,255,255,.10)!important;}
.heroBrandPane .pill{margin:0 0 6px!important;padding:4px 11px!important;font-size:11px!important;}
.heroBrandCopy{min-width:0!important;}
.heroBrandCopy h2{margin:0 0 7px!important;font-size:15px!important;line-height:1.25!important;color:#fff!important;}
.heroBrandCopy p{margin:0!important;font-size:12px!important;line-height:1.48!important;color:#d0d6df!important;overflow-wrap:break-word!important;}
.heroFeatureAssets{margin:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;min-width:0!important;}
.heroFeatureAsset{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  text-align:center!important;
  padding:10px 7px!important;
  border-radius:10px!important;
  background:rgba(9,20,35,.82)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  overflow:hidden!important;
}
.heroFeatureAsset img{width:36px!important;height:36px!important;max-width:36px!important;object-fit:contain!important;margin:0 auto!important;}
.heroFeatureAsset strong{font-size:11px!important;line-height:1.2!important;}
.heroFeatureAsset span{font-size:9.5px!important;line-height:1.35!important;margin-top:2px!important;}

/* Protocol cards — exact existing orb assets placed beside text, not extracted from screenshot. */
.cards{gap:12px!important;}
.cards .protocolCard{
  min-width:0!important;
  min-height:150px!important;
  display:grid!important;
  grid-template-columns:105px minmax(0,1fr)!important;
  gap:14px!important;
  align-items:center!important;
  text-align:left!important;
  padding:14px 16px!important;
  overflow:hidden!important;
  background:rgba(6,18,32,.86)!important;
}
.protocolCard .protocolIcon{width:98px!important;height:98px!important;max-width:98px!important;object-fit:contain!important;object-position:center!important;margin:0!important;}
.protocolText{min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;}
.protocolText h3{margin:0 0 4px!important;overflow-wrap:break-word!important;}
.protocolText p{margin:0!important;overflow-wrap:break-word!important;}
.protocolLearn{display:inline-flex!important;align-items:center!important;gap:8px!important;margin-top:9px!important;padding:6px 14px!important;border:1px solid rgba(245,162,11,.64)!important;border-radius:999px!important;color:#ffb21a!important;font-size:11px!important;font-weight:800!important;white-space:nowrap!important;}
.calmCard{border-color:rgba(255,96,54,.40)!important;}
.oceanCard{border-color:rgba(45,159,255,.43)!important;}
.meditationCard{border-color:rgba(41,214,177,.40)!important;}
.duration{top:9px!important;right:9px!important;}

/* Lower particle-wave sections now use the same new uploaded wave asset. */
.deep::before,.faq::before,.footer::before{
  background-image:url('assets/particle-wave-final.jpg')!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center center!important;
  opacity:.065!important;
  filter:brightness(.45) saturate(.9)!important;
}
.footer::before{opacity:.045!important;}

/* Self-verification containment: every visual is bounded, all text can wrap safely. */
:where(.heroPricing,.pricingInner,.pricingGrid,.pricingCard,.heroIntro,.heroBrandPane,.heroBrandCopy,.heroFeatureAssets,.heroFeatureAsset,.cards,.protocolCard,.protocolText,.dashboard,.deepGrid,.deepCard,.footerGrid){min-width:0!important;}
:where(.pricingCard,.heroIntro,.heroBrandCopy,.heroFeatureAsset,.protocolCard,.protocolText,.deepCard,.footerGrid) :where(h1,h2,h3,h4,p,span,strong,a,button,li){overflow-wrap:break-word!important;word-wrap:break-word!important;word-break:normal!important;}
img{max-width:100%;height:auto;}
.heroFeatureAsset img,.protocolIcon,.outlineIconAsset,.trustItem img,.approvedBrandLogo,.approvedFooterLogo,.glissaWordmarkLockup{object-fit:contain!important;}
.hero .particleWaveBg{object-fit:cover!important;}

@media(max-width:1050px){
  .heroIntro{grid-template-columns:190px 1fr!important;}
  .heroFeatureAssets{grid-column:1/-1!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .heroBrandPane{border-right:1px solid rgba(255,255,255,.10)!important;}
}
@media(max-width:900px){
  .heroPricing .pricingGrid{grid-template-columns:1fr!important;max-width:520px!important;}
  .heroPricing .pricingCard{min-height:0!important;}
  .heroIntro{grid-template-columns:1fr!important;text-align:center!important;}
  .heroBrandPane{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.10)!important;padding:0 0 12px!important;}
  .heroBrandCopy{text-align:center!important;}
  .heroFeatureAssets{grid-column:auto!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .cards .protocolCard{grid-template-columns:90px minmax(0,1fr)!important;}
  .protocolCard .protocolIcon{width:82px!important;height:82px!important;max-width:82px!important;}
}
@media(max-width:768px){
  .particleHeroContent{width:min(100% - 26px,1240px)!important;}
  .hero .particleWaveBg{object-fit:cover!important;opacity:.50!important;}
  .heroPricing .pricingInner{padding:0 0 10px!important;}
  .heroFeatureAssets{grid-template-columns:1fr!important;}
  .heroFeatureAsset{flex-direction:row!important;justify-content:flex-start!important;text-align:left!important;padding:11px 12px!important;gap:12px!important;}
  .heroFeatureAsset img{width:34px!important;height:34px!important;max-width:34px!important;margin:0!important;}
  .glissaWordmarkLockup{width:180px!important;max-width:180px!important;} /* 50% of prior 360px mobile rule */
  .cards .protocolCard{grid-template-columns:78px minmax(0,1fr)!important;padding:12px!important;gap:12px!important;}
  .protocolCard .protocolIcon{width:72px!important;height:72px!important;max-width:72px!important;}
}
@media(max-width:480px){
  .heroPricing .pricingHeader h2{font-size:30px!important;}
  .heroPricing .pricingCard{padding:18px 16px 15px!important;}
  .currentPrice{font-size:29px!important;}
  .heroPricing .passBundlePriceRow .currentPrice{font-size:35px!important;}
  .heroPricing .passPerPass{font-size:11px!important;padding:5px 7px!important;}
  .heroIntro{padding:14px!important;}
  .cards .protocolCard{grid-template-columns:1fr!important;text-align:center!important;}
  .protocolText{align-items:center!important;text-align:center!important;}
  .protocolCard .protocolIcon{margin:0 auto!important;}
}

/* ============================================================
   PADDLE LOCALIZED PRICING — 2026-09-12
   Current plan totals are supplied by Paddle.PricePreview().
   No currency amount is hardcoded in the pricing UI.
   ============================================================ */
.localizedPriceRow{
  display:flex!important;
  justify-content:center!important;
  align-items:baseline!important;
  gap:7px!important;
  min-height:42px;
}
.localizedPrice{
  display:inline-block;
  min-width:5.5ch;
  white-space:nowrap;
}
.priceSuffix{
  color:#cbd2dd;
  font-size:13px;
  font-weight:600;
  line-height:1;
  white-space:nowrap;
}
.pricingStatus{
  margin:13px auto 0;
  max-width:760px;
  color:#aeb7c6;
  font-size:11px;
  line-height:1.45;
  text-align:center;
}
.pricingStatus.isError{color:#f4bd73;}
.planButton:disabled,
.planButton[aria-disabled="true"]{
  cursor:not-allowed!important;
  opacity:.52!important;
  transform:none!important;
  filter:none!important;
  box-shadow:none!important;
}


/* ============================================================
   TARGETED ALIGNMENT FIXES — 2026-09-12
   Only hero text and protocol-card internal alignment are changed.
   ============================================================ */

/* Hero heading/subheading centered horizontally. */
.heroPricing .pricingHeader{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.heroPricing .pricingHeader h2,
.heroPricing .pricingHeader p,
.heroPricing .pricingHeader small{
  width:100%!important;
  max-width:760px!important;
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Protocol content is vertically stacked and centered inside each existing box. */
.cards .protocolCard{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  gap:10px!important;
}
.protocolCard .protocolIcon{
  margin:0 auto 2px!important;
  flex:0 0 auto!important;
}
.protocolText{
  width:100%!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.protocolText h3,
.protocolText p{
  width:100%!important;
  max-width:100%!important;
  text-align:center!important;
}
.protocolLearn{
  align-self:center!important;
  justify-content:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}