/* sanctuary · premium cinematic motion + typography (demo + marketing) */
@import url('/css/brand-type.css');

:root{
  --cinema-ease:cubic-bezier(.22,.61,.36,1);
  --cinema-ink:#1a2838;
  --cinema-sage:#2f5d50;
  --cinema-gold:#c4a574;
  --cinema-paper:#f7f3eb;
  --display:var(--font-brand);
}

/* —— cinematic threshold —— */
.cinema-ovl{background:radial-gradient(ellipse 80% 60% at 50% 20%,rgba(196,165,116,0.12),transparent 55%),rgba(14,20,26,.92)!important}
.cinema-threshold{position:relative;animation:cinema-rise .7s var(--cinema-ease) both}
.cinema-threshold-mark{
  width:64px;height:3px;margin:0 auto 18px;border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--cinema-gold),transparent);
  animation:cinema-glow 3.2s ease-in-out infinite;
}
.cinema-kicker{letter-spacing:.18em!important;color:var(--cinema-gold)!important;font-size:10px!important}
.cinema-title{font-family:var(--display)!important;font-weight:500!important;letter-spacing:-.02em!important;line-height:1.2!important}
.cinema-lead{font-weight:300;opacity:.9}
.cinema-prompt{font-family:var(--display);font-size:1.15rem;font-weight:400;line-height:1.4;max-width:28ch;margin:0 auto}
.cinema-cta{min-width:min(240px,100%);letter-spacing:.02em}
.cinema-chips .ap-chip.on{border-color:var(--cinema-sage);color:var(--cinema-sage);background:rgba(47,93,80,.1)}
.cinema-pace{text-align:left;transition:transform .35s var(--cinema-ease),border-color .35s}
.cinema-pace:hover{transform:translateY(-2px)}

@keyframes cinema-rise{
  from{opacity:0;transform:translateY(18px) scale(.98)}
  to{opacity:1;transform:none}
}
@keyframes cinema-glow{
  0%,100%{opacity:.55;transform:scaleX(.85)}
  50%{opacity:1;transform:scaleX(1)}
}

/* —— onboarding film —— */
.ob-film{
  position:relative;min-height:100%;display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;isolation:isolate;
}
.ob-film::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 90% 55% at 20% -10%,rgba(196,165,116,.22),transparent 55%),
    radial-gradient(ellipse 70% 50% at 100% 30%,rgba(47,93,80,.14),transparent 50%),
    linear-gradient(165deg,#1a2838 0%,#243848 42%,#2f3f3a 100%);
  animation:ob-sky 14s ease-in-out infinite alternate;
}
.ob-film::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.ob-film-light{
  background:linear-gradient(180deg,#faf7f1 0%,#f3eee4 55%,#ebe4d8 100%)!important;
}
.ob-film-light::before{
  background:
    radial-gradient(ellipse 90% 55% at 12% -8%,rgba(196,165,116,.18),transparent 55%),
    radial-gradient(ellipse 70% 45% at 100% 0%,rgba(47,93,80,.1),transparent 50%),
    linear-gradient(180deg,#faf7f1 0%,#f3eee4 55%,#ebe4d8 100%);
  opacity:1;
}
.ob-film-light::after{opacity:.04}
@keyframes ob-sky{
  from{filter:brightness(1)}
  to{filter:brightness(1.06)}
}
.ob-inner{position:relative;z-index:2;width:100%;max-width:320px;margin:0 auto;padding:28px 8px 40px;text-align:center}
.ob-brand{
  font-family:var(--font-brand);font-size:clamp(1.55rem,6vw,2rem);font-weight:400;
  letter-spacing:.14em;line-height:1.05;color:#f2ebe0;margin:0 0 .7rem;text-transform:lowercase;
  animation:cinema-rise .9s var(--cinema-ease) both;
}
.ob-film-light .ob-brand{color:var(--cinema-ink)}
.ob-headline{
  font-family:var(--font-brand);font-size:clamp(1.25rem,4.2vw,1.55rem);font-weight:300;
  letter-spacing:-.015em;line-height:1.3;color:rgba(242,235,224,.92);margin:0 auto .75rem;max-width:18ch;
  animation:cinema-rise 1s .08s var(--cinema-ease) both;
}
.ob-film-light .ob-headline{color:var(--cinema-ink)}
.ob-sub{
  font-size:14px;font-weight:300;line-height:1.65;color:rgba(214,228,216,.78);max-width:30ch;margin:0 auto 1.25rem;
  animation:cinema-rise 1s .14s var(--cinema-ease) both;
}
.ob-film-light .ob-sub{color:var(--stone,#5a6a5e)}
.ob-truths{display:flex;flex-direction:column;gap:8px;margin:0 auto 1.4rem;max-width:28ch;animation:cinema-rise 1s .2s var(--cinema-ease) both}
.ob-truth{
  font-size:12px;letter-spacing:.02em;color:rgba(196,165,116,.9);padding:8px 0;
  border-bottom:0.5px solid rgba(242,235,224,.12);
}
.ob-film-light .ob-truth{color:var(--cinema-sage);border-color:rgba(26,40,56,.1)}
.ob-cta-row{display:flex;flex-direction:column;align-items:center;gap:10px;animation:cinema-rise 1s .26s var(--cinema-ease) both}
.ob-stone{
  width:72px;height:48px;margin:0 auto 1rem;border-radius:50% / 42%;
  background:radial-gradient(circle at 35% 30%,#8a8276 0%,#5a5348 55%,#3d3830 100%);
  box-shadow:0 14px 28px rgba(0,0,0,.35);animation:ob-stone-breathe 5s ease-in-out infinite;
}
.ob-film-light .ob-stone{box-shadow:0 14px 28px rgba(44,62,80,.18)}
@keyframes ob-stone-breathe{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
.ob-progress{display:flex;gap:6px;justify-content:center;margin-bottom:1.25rem}
.ob-progress i{width:18px;height:2px;border-radius:1px;background:rgba(242,235,224,.2)}
.ob-film-light .ob-progress i{background:rgba(26,40,56,.15)}
.ob-progress i.on{background:var(--cinema-gold)}
.ob-film-light .ob-progress i.on{background:var(--cinema-sage)}

/* —— reasons cinematic —— */
.reasons.cinema-reasons{gap:10px}
.reason.cinema-reason{
  border-radius:4px!important;padding:14px 12px!important;
  transition:transform .35s var(--cinema-ease),border-color .35s,background .35s!important;
}
.reason.cinema-reason:hover{transform:translateY(-3px)}
.reason.cinema-reason .rl{font-family:var(--display);font-size:15px;font-weight:500}

/* —— expedition panel premium —— */
.ex2-ovl .ap-h1,.ap-ovl .ap-h1{
  font-family:var(--display)!important;font-weight:500!important;letter-spacing:-.02em!important;
}
.ex2-ovl .ap-ribbon,.ap-ovl .ap-ribbon{letter-spacing:.14em}

/* —— world-open curtain (first return) —— */
.world-open{
  position:fixed;inset:0;z-index:9998;display:flex;align-items:center;justify-content:center;
  background:rgba(14,20,26,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  animation:world-fade .55s var(--cinema-ease) both;pointer-events:none;
}
.world-open-inner{text-align:center;color:#f2ebe0;padding:2rem;animation:cinema-rise .95s .12s var(--cinema-ease) both}
.world-open-inner strong{
  display:block;font-family:var(--display);font-size:clamp(1.55rem,5vw,2.15rem);
  font-weight:500;letter-spacing:-.02em;margin-bottom:.45rem;
}
.world-open-inner span{font-size:.95rem;opacity:.72;font-weight:300;line-height:1.5}
@keyframes world-fade{from{opacity:0}to{opacity:1}}

/* —— tour coach premium —— */
#tour .coach h4{font-family:var(--display)!important;font-weight:500!important;letter-spacing:-.02em}
#tour .coach{animation:cinema-rise .55s var(--cinema-ease) both}

/* —— anchor vigil (not a breath drill) —— */
.anchor-cinema .scrn-title,.anchor-cinema .display{font-family:var(--display)!important;font-weight:500!important}
.anchor-cinema .fog-line{font-family:var(--display);letter-spacing:-.01em}

/* —— homepage hero · brand-first cinema —— */
.hero-brand{
  font-family:var(--font-brand)!important;
  font-size:11px!important;
  font-weight:400!important;
  letter-spacing:5px!important;
  line-height:1.2!important;
  text-transform:lowercase!important;
  color:rgba(255,255,255,.72)!important;
  margin:0 0 18px!important;
}
.hero h1{
  font-family:var(--font-brand)!important;
  font-weight:400!important;
  letter-spacing:.02em!important;
  font-size:clamp(30px,5.2vw,58px)!important;
  max-width:none;
  margin-left:auto;margin-right:auto;
  color:#fff!important;
}
.hero-sub{max-width:36ch!important}

/* —— marketing display type + atmosphere —— */
.page-hero h1,.pricing-h1{
  font-family:var(--display);
}
.brand{
  font-family:var(--font-brand)!important;
  font-size:13px!important;font-weight:400!important;letter-spacing:.28em!important;
  line-height:1.2!important;text-transform:lowercase!important;
}
.page-hero h1{font-weight:500;letter-spacing:-.03em}
.page-hero{animation:cinema-rise 1.1s var(--cinema-ease) both;position:relative}
.page-hero::before{
  content:'';position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:min(420px,70vw);height:120px;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(196,165,116,.16),transparent 70%);
}
.page-hero > *{position:relative;z-index:1}
.nav-brand-text{font-family:var(--font-brand)!important;letter-spacing:.14em!important;font-weight:500!important;text-transform:lowercase}

/* site shell cohesion — soft film wash on body */
body.premium-site::before{
  background:
    radial-gradient(ellipse 80% 50% at 70% -5%,rgba(196,165,116,.07),transparent 55%),
    radial-gradient(ellipse at 50% 30%,rgba(82,121,111,0.03),transparent 70%)!important;
}

/* marketing mobile rhythm — dock-aware sections */
body.premium-site.has-harbor-dock .page-hero{
  padding-bottom:clamp(28px,4vh,40px);
}
body.premium-site .site-trail{
  letter-spacing:.04em;
}
body.premium-site .announce-bar{
  position:relative;z-index:40;
}

@media (max-width:719px){
  body.premium-site .hero{
    min-height:min(92svh,920px);
  }
  body.premium-site .hero-copy{
    padding-left:max(20px,env(safe-area-inset-left));
    padding-right:max(20px,env(safe-area-inset-right));
  }
}

@media (prefers-reduced-motion:reduce){
  .cinema-threshold,.ob-brand,.ob-headline,.ob-sub,.ob-truths,.ob-cta-row,.page-hero,.world-open,.world-open-inner,#tour .coach{animation:none!important}
  .ob-stone,.cinema-threshold-mark,.ob-film::before{animation:none!important}
  .harbor-dock{animation:none!important}
}