/* ANGELIC FELLOWSHIP CLOUD — cosmic.css · one stylesheet for every page (2026-10-07)
   Homepage design: "cosmic sanctuary"
   Deep space indigo → violet · nebula violet, teal, gold · luminous gold headings · glass cards.
   Center Law kept: every line centered. */
:root{
  --space-0:#05040f;
  --space-1:#0b0820;
  --space-2:#160d33;
  --gold:#f2d38c;
  --gold-glow:rgba(242,211,140,.38);
  --gold-hair:rgba(242,211,140,.28);
  --white:#f8f6ff;
  --text:rgba(238,234,255,.88);
  --mute:rgba(222,216,250,.70);
  --violet:#a98bff;
  --teal:#5fe1cf;
  --glass:rgba(255,255,255,.055);
  --glass-edge:rgba(255,255,255,.13);
  --measure:60ch;
  --gutter:clamp(20px,5.5vw,64px);
  --display:'Cinzel',Georgia,'Times New Roman',serif;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--space-0);color-scheme:dark}
body{
  position:relative;min-height:100vh;overflow-x:hidden;
  background:linear-gradient(180deg,var(--space-0) 0%,var(--space-1) 30%,var(--space-2) 62%,var(--space-1) 85%,var(--space-0) 100%);
  color:var(--text);font-family:var(--sans);font-weight:400;
  font-size:clamp(16px,.6vw + 13.5px,18px);line-height:1.8;
  text-align:center;-webkit-font-smoothing:antialiased;
}
body *{text-align:center}

/* ---------- the sky: nebula + starfield (pure CSS, scrolls with the page) ---------- */
.sky{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.nebula{position:absolute;inset:0;
  background:
    radial-gradient(60vw 46vh at 50% 6%,rgba(169,139,255,.30),transparent 70%),
    radial-gradient(42vw 34vh at 14% 22%,rgba(95,225,207,.14),transparent 70%),
    radial-gradient(38vw 30vh at 88% 16%,rgba(242,211,140,.12),transparent 70%),
    radial-gradient(55vw 40vh at 85% 42%,rgba(126,82,230,.20),transparent 72%),
    radial-gradient(50vw 36vh at 10% 60%,rgba(95,225,207,.10),transparent 72%),
    radial-gradient(60vw 40vh at 60% 80%,rgba(169,139,255,.16),transparent 72%),
    radial-gradient(40vw 30vh at 30% 96%,rgba(242,211,140,.10),transparent 72%);
  animation:breathe 18s ease-in-out infinite alternate;}
.stars{position:absolute;inset:0;background-repeat:repeat}
.stars.s1{background-size:240px 240px;opacity:1;background-image:
  radial-gradient(1px 1px at 20px 30px,#fff,transparent),
  radial-gradient(1px 1px at 140px 60px,rgba(255,255,255,.8),transparent),
  radial-gradient(1px 1px at 90px 180px,rgba(255,255,255,.7),transparent),
  radial-gradient(1px 1px at 210px 130px,rgba(220,210,255,.8),transparent),
  radial-gradient(1px 1px at 50px 120px,rgba(255,255,255,.55),transparent),
  radial-gradient(1px 1px at 180px 220px,rgba(255,255,255,.6),transparent);}
.stars.s2{background-size:420px 420px;animation:twinkle 5.5s ease-in-out infinite alternate;background-image:
  radial-gradient(1.5px 1.5px at 60px 80px,#fff,transparent),
  radial-gradient(1.5px 1.5px at 300px 40px,rgba(242,211,140,.95),transparent),
  radial-gradient(1.5px 1.5px at 360px 300px,rgba(95,225,207,.9),transparent),
  radial-gradient(1.5px 1.5px at 160px 340px,#fff,transparent),
  radial-gradient(1.2px 1.2px at 230px 200px,rgba(169,139,255,.95),transparent);}
.stars.s3{background-size:680px 680px;animation:twinkle 8s ease-in-out 2s infinite alternate-reverse;background-image:
  radial-gradient(2px 2px at 120px 160px,#fff,transparent),
  radial-gradient(2px 2px at 520px 90px,rgba(242,211,140,.95),transparent),
  radial-gradient(2px 2px at 420px 520px,#fff,transparent),
  radial-gradient(2.2px 2.2px at 80px 600px,rgba(95,225,207,.9),transparent);}
@keyframes twinkle{from{opacity:.25}to{opacity:1}}
@keyframes breathe{from{opacity:.75;transform:scale(1)}to{opacity:1;transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .stars.s2,.stars.s3{opacity:.8}
}
header,main,footer{position:relative;z-index:1}

/* ---------- layout ---------- */
.wrap{max-width:1080px;margin-inline:auto;padding-inline:var(--gutter)}
.measure{max-width:var(--measure);margin-inline:auto}
section{padding-block:clamp(56px,8vw,112px)}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--display);font-weight:600;color:var(--gold);letter-spacing:.05em;line-height:1.22}
h1{font-size:clamp(2.2rem,6.6vw,4.4rem);color:var(--white);
  text-shadow:0 0 18px rgba(255,255,255,.35),0 0 46px var(--gold-glow),0 0 90px rgba(169,139,255,.35)}
h1 .gold{color:var(--gold)}
h2{font-size:clamp(1.45rem,2.9vw,2.15rem);text-transform:uppercase;margin-bottom:1.1rem;
  text-shadow:0 0 28px var(--gold-glow)}
h3{font-family:var(--display);font-size:clamp(1rem,1.4vw,1.14rem);letter-spacing:.08em;
  text-transform:uppercase;font-weight:600;margin-bottom:.7rem;text-shadow:0 0 18px var(--gold-glow)}
.eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.34em;text-transform:uppercase;
  color:var(--teal);margin-bottom:1.1rem}
p{margin-bottom:1.15rem}
p:last-child{margin-bottom:0}
.lede{font-size:clamp(1.08rem,1.5vw,1.3rem);line-height:1.7;color:var(--white)}
.small{font-size:.92rem;color:var(--mute);line-height:1.7}
.hl{color:var(--gold);text-shadow:0 0 18px var(--gold-glow)}
em{color:var(--white)}
a{color:var(--gold);text-decoration:none;border-bottom:1px solid var(--gold-hair);transition:color .25s,border-color .25s}
a:hover{color:var(--white);border-bottom-color:var(--gold)}

/* ---------- header ---------- */
header.site{position:sticky;top:0;z-index:50;background:rgba(7,5,26,.72);
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid rgba(255,255,255,.08)}
.bar{display:flex;flex-direction:column;align-items:center;gap:.55rem;padding-block:.8rem}
.brand{display:flex;align-items:center;justify-content:center;gap:.65rem;border:0}
.brand img{width:30px;height:30px;border-radius:50%;display:block;box-shadow:0 0 14px var(--gold-glow)}
.brand span{font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--white);white-space:nowrap}
nav.site{display:flex;flex-wrap:wrap;justify-content:center;gap:.2rem 1.15rem}
nav.site a{border:0;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:500}
nav.site a:hover,nav.site a[aria-current=page]{color:var(--gold);text-shadow:0 0 14px var(--gold-glow)}
@media(max-width:430px){.brand span{font-size:.68rem;letter-spacing:.14em}
  nav.site{gap:.15rem .8rem}nav.site a{font-size:.64rem;letter-spacing:.12em}}

/* ---------- hero ---------- */
.hero{min-height:calc(100svh - 92px);display:flex;align-items:center;justify-content:center;
  padding-block:clamp(48px,8vw,96px)}
.orb{position:relative;width:clamp(140px,22vw,210px);aspect-ratio:1;margin:0 auto 2.2rem}
.orb::before{content:"";position:absolute;inset:-28%;border-radius:50%;
  background:radial-gradient(circle,rgba(242,211,140,.30),rgba(169,139,255,.18) 45%,transparent 70%);
  animation:breathe 7s ease-in-out infinite alternate}
.orb img{position:relative;width:100%;height:100%;border-radius:50%;display:block;
  box-shadow:0 0 0 1px var(--gold-hair),0 0 40px rgba(242,211,140,.35),0 0 90px rgba(169,139,255,.30)}
.hero h1{margin-bottom:1.5rem}
.hero .lede{max-width:44ch;margin-inline:auto}
.hero .cta{margin-top:2.4rem}
.hero .quiet{margin-top:1.4rem;font-size:.9rem;color:var(--mute)}

/* ---------- buttons ---------- */
.btn{display:inline-block;border:1px solid var(--gold-hair);color:var(--gold);border-radius:999px;
  padding:.9em 2.2em;font-size:.76rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  background:rgba(255,255,255,.03);transition:background .3s,box-shadow .3s,color .3s,border-color .3s}
.btn:hover{border-color:var(--gold);color:var(--white);box-shadow:0 0 24px var(--gold-glow);background:rgba(242,211,140,.08)}
.btn.primary{font-size:.86rem;padding:1.1em 2.9em;color:#1a1230;border:0;
  background:linear-gradient(135deg,#fff3cf 0%,#f2d38c 45%,#d9a94e 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 0 30px rgba(242,211,140,.45),0 0 70px rgba(169,139,255,.35)}
.btn.primary:hover{color:#1a1230;box-shadow:0 0 0 1px rgba(255,255,255,.4) inset,0 0 44px rgba(242,211,140,.65),0 0 90px rgba(169,139,255,.45)}
.btn-row{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;align-items:center;margin-top:2rem}

/* ---------- glass ---------- */
.glass{background:var(--glass);border:1px solid var(--glass-edge);border-radius:22px;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 20px 50px rgba(0,0,0,.35)}
.panel{padding:clamp(26px,4.5vw,52px)}
.grid{display:grid;gap:clamp(16px,2.2vw,26px);margin-top:2.2rem}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.grid.three{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(16px,2.2vw,26px);margin-top:2.2rem}
.cards .card{flex:1 1 260px;max-width:330px}
.card{display:block;padding:1.8rem 1.5rem;border-bottom:1px solid var(--glass-edge);color:var(--text);
  transition:transform .3s,border-color .3s,box-shadow .3s}
a.card{border:1px solid var(--glass-edge)}
.card:hover,a.card:hover{transform:translateY(-3px);border-color:rgba(242,211,140,.45);color:var(--text);
  box-shadow:0 0 34px rgba(169,139,255,.22),0 20px 50px rgba(0,0,0,.35)}
.card .go{display:inline-block;margin-top:.9rem;font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}

details{margin-top:1.6rem;font-size:.92rem;color:var(--mute)}
summary{cursor:pointer;color:var(--gold);font-weight:500;letter-spacing:.06em;list-style-position:inside}
details ul{list-style:none;margin-top:1rem;line-height:1.7}
details li{margin-bottom:.35rem}

/* ---------- journey strip ---------- */
.strip{display:grid;gap:10px;margin-top:2.2rem;grid-template-columns:repeat(4,1fr)}
@media(max-width:560px){.strip{grid-template-columns:repeat(2,1fr)}}
.strip a{border:0;display:block;line-height:0;border-radius:14px;overflow:hidden;border:1px solid var(--glass-edge)}
.strip img{width:100%;aspect-ratio:1;object-fit:cover;display:block;transition:transform .45s,filter .45s;filter:saturate(.9)}
.strip a:hover img{transform:scale(1.05);filter:saturate(1.05)}

/* ---------- testimonies ---------- */
blockquote{padding:clamp(24px,3.5vw,38px)}
blockquote p{font-style:italic;font-size:clamp(.98rem,1.3vw,1.05rem);line-height:1.75;color:var(--white)}
blockquote cite{display:block;margin-top:1rem;font-style:normal;font-size:.72rem;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--teal)}

.closing .verse{font-family:var(--display);font-size:clamp(1.3rem,2.8vw,1.9rem);line-height:1.55;color:var(--white);
  text-shadow:0 0 30px var(--gold-glow);max-width:42ch;margin-inline:auto}
.closing cite{display:block;margin-top:1rem;font-style:normal;font-size:.72rem;font-weight:600;letter-spacing:.26em;
  text-transform:uppercase;color:var(--teal)}
@media(max-width:600px){.closing .verse br{display:none}}
.star-rule{display:block;width:120px;height:1px;margin:2rem auto;border:0;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* ---------- footer ---------- */
footer.site{border-top:1px solid rgba(255,255,255,.08);padding-block:clamp(48px,6vw,80px);
  background:linear-gradient(180deg,transparent,rgba(5,4,15,.6))}
.tools{margin-bottom:3rem}
.tool{padding:1.6rem 1.4rem}
.tool .eyebrow{font-size:.66rem;margin-bottom:.6rem}
.tool .name{font-family:var(--display);color:var(--white);font-size:1.05rem;margin-bottom:.5rem}
.tool .small{margin-bottom:.8rem}
.tool .fine{font-size:.76rem;color:var(--mute);margin-top:.6rem}
.cols{display:grid;gap:clamp(24px,4vw,40px);grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));margin-bottom:2.6rem}
footer h4{font-size:.68rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
footer ul{list-style:none}
footer li{margin-bottom:.5rem;font-size:.92rem}
footer .cols a{border:0;color:var(--text)}
footer .cols a:hover{color:var(--gold)}
.colophon{border-top:1px solid rgba(255,255,255,.08);padding-top:2rem}
.colophon p{font-size:.8rem;color:var(--mute);max-width:62ch;margin:0 auto 1rem}
.motto{font-family:var(--display);font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);text-shadow:0 0 18px var(--gold-glow)}

/* ---------- the gate (first visit) ---------- */
#veil{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;
  background:radial-gradient(ellipse 60% 50% at 50% 40%,rgba(169,139,255,.22),transparent 70%),
             radial-gradient(ellipse 34% 30% at 50% 34%,rgba(242,211,140,.10),transparent 70%),#05040f;
  transition:opacity .9s ease}
#veil.lift{opacity:0;pointer-events:none}
.veil-inner{padding:2rem;max-width:36rem}
.veil-emblem{width:clamp(170px,34vw,280px);height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%;
  display:block;margin:0 auto 2rem;animation:veilglow 4.5s ease-in-out infinite}
@keyframes veilglow{0%,100%{filter:drop-shadow(0 0 26px rgba(242,211,140,.30))}50%{filter:drop-shadow(0 0 60px rgba(242,211,140,.55))}}
.veil-line{font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,5vw,2.7rem);line-height:1.4;color:var(--white);
  margin-bottom:1.2rem;text-shadow:0 0 36px var(--gold-glow)}
.veil-sub{color:var(--mute);font-size:.98rem;margin-bottom:2.4rem}
#veil .btn{cursor:pointer;font-family:var(--sans)}

/* ============================================================
   CENTER LAW (kept from center-law.css) — "CENTERED ALWAYS CENTERED! THIS IS LAW."
   ============================================================ */
html body, html body *{text-align:center !important}
html body ol, html body ul{list-style-position:inside !important}

/* ============================================================
   INNER PAGES — the older page classes, drawn in the homepage's cosmic style
   ============================================================ */
:root{
  --night:var(--space-0);
  --night-raise:var(--space-1);
  --night-panel:var(--glass);
  --gold-soft:rgba(242,211,140,.80);
  --gold-faint:rgba(242,211,140,.07);
  --violet-soft:rgba(169,139,255,.70);
  --violet-faint:rgba(169,139,255,.10);
  --pearl:var(--white);
  --pearl-body:var(--text);
  --pearl-mute:var(--mute);
}
.center{margin-inline:auto}
strong{color:var(--white);font-weight:600}
.whisper{font-size:.92rem;color:var(--mute);line-height:1.75}
.violet{color:var(--violet)}
.display{font-family:var(--display);font-weight:600;color:var(--gold);letter-spacing:.05em}
h1 .hl,h2 .hl,h3 .hl{color:var(--gold);text-shadow:0 0 30px var(--gold-glow)}
main h4{font-family:var(--display);color:var(--gold);letter-spacing:.06em}

/* page openers: same glow as the homepage hero, without the full-screen height */
.page-hero,main > section:first-child:not(.hero){padding-block:clamp(64px,10vw,124px) clamp(40px,6vw,72px)}
.page-hero .lede,main > section:first-child:not(.hero) .lede{max-width:52ch;margin-inline:auto}
.page-hero h1,main > section:first-child:not(.hero) h1{margin-bottom:1.2rem}
img.mark{display:block;width:clamp(120px,18vw,180px)!important;height:auto;aspect-ratio:1;margin:0 auto 2.2rem!important;
  border-radius:50%;object-fit:cover;filter:none!important;
  box-shadow:0 0 0 1px var(--gold-hair),0 0 40px rgba(242,211,140,.35),0 0 90px rgba(169,139,255,.30)}

/* rhythm */
section.tight{padding-block:clamp(36px,5vw,68px)}
section[id]{scroll-margin-top:130px}
.divider{border-top:0}
section section{padding-block:clamp(32px,5vw,64px) 0}
.wrap .wrap{padding-inline:0}
.rule{height:1px;border:0;margin:0;background:linear-gradient(90deg,transparent,var(--gold-hair),transparent)}
.rule-short{display:block;width:120px;height:1px;margin:2rem auto;border:0;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* sacred lines */
.pairing,.pull{font-family:var(--display);font-weight:400;color:var(--white);text-transform:none;letter-spacing:.01em;
  text-shadow:0 0 30px var(--gold-glow);max-width:42ch;margin-inline:auto}
.pairing{font-size:clamp(1.2rem,2.5vw,1.7rem);line-height:1.55}
.pull{font-size:clamp(1.2rem,2.5vw,1.7rem);line-height:1.6;margin:2.4rem auto;padding:2rem 1rem;
  border-top:1px solid var(--gold-hair);border-bottom:1px solid var(--gold-hair)}
.pairing cite{display:block;margin-top:1rem;font-family:var(--sans);font-style:normal;font-size:.72rem;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;color:var(--teal)}
@media(max-width:600px){.pairing br,.pull br{display:none}}

/* glass: every panel, card and notice gets the homepage's frosted card */
.panel:not(.plain),.card,.awaiting,.entry{background:var(--glass);border:1px solid var(--glass-edge);border-radius:22px;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 20px 50px rgba(0,0,0,.35)}
.panel.plain{background:none;border:0}
.awaiting{border:1px dashed rgba(242,211,140,.32);padding:clamp(26px,4.5vw,52px)}
.awaiting .eyebrow{margin-bottom:1rem}
.awaiting p{max-width:46ch;margin-inline:auto}
.card{padding:1.8rem 1.5rem}
.card h3{margin-bottom:.8rem}
.card a.cardlink{border:0}
.card .vwrap{border-radius:14px}
.entries{display:grid;gap:clamp(16px,2.2vw,26px);border:0;max-width:760px;margin-inline:auto}
.entry{padding:clamp(24px,3.6vw,40px) clamp(20px,3vw,36px)}
.entry > div{max-width:var(--measure);margin-inline:auto}
.entry h3{margin-bottom:1rem}
.entry .num{font-size:.68rem;letter-spacing:.3em;color:var(--teal);display:block;margin-bottom:.6rem}
.tier{display:inline-block;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;padding:.34em .9em;
  border:1px solid var(--gold-hair);border-radius:999px;color:var(--gold-soft);margin-bottom:.9rem;font-weight:500}
.tier.faith{border-style:dashed}
.tier.solid{border-color:rgba(242,211,140,.5);color:var(--gold)}
.careful{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--gold-hair);font-size:.9rem;line-height:1.75;color:var(--mute)}
.careful b{display:block;margin-bottom:.45rem;color:var(--teal);font-weight:600;letter-spacing:.2em;text-transform:uppercase;font-size:.66rem}

/* buttons: the page's main action wears the homepage's gold */
.btn.solid{font-size:.86rem;padding:1.1em 2.9em;color:#1a1230;border:0;
  background:linear-gradient(135deg,#fff3cf 0%,#f2d38c 45%,#d9a94e 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 0 30px rgba(242,211,140,.45),0 0 70px rgba(169,139,255,.35)}
.btn.solid:hover{color:#1a1230;background:linear-gradient(135deg,#fff3cf 0%,#f2d38c 45%,#d9a94e 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.4) inset,0 0 44px rgba(242,211,140,.65),0 0 90px rgba(169,139,255,.45)}
@media(max-width:430px){.btn,.btn.solid,.btn.primary{padding-inline:1.8em;letter-spacing:.14em}}

/* journey photo deck + video deck */
.pdeck{max-width:920px;margin:2.6rem auto 0}
.pview{overflow:hidden;border:1px solid var(--glass-edge);border-radius:22px;background:rgba(5,4,15,.7);touch-action:pan-y;
  box-shadow:0 0 40px rgba(169,139,255,.18),0 20px 50px rgba(0,0,0,.35)}
.ptrack{display:flex;transition:transform .45s cubic-bezier(.2,.7,.3,1)}
.pslide{flex:0 0 100%;min-width:0}
.pscreen{position:relative;aspect-ratio:4/3;background:transparent;cursor:grab}
.pscreen:active{cursor:grabbing}
.pscreen img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
.pbar{display:flex;align-items:center;justify-content:center;gap:1.6rem;margin-top:1.4rem}
.parrow{width:52px;height:52px;border-radius:50%;border:1px solid var(--gold-hair);background:rgba(255,255,255,.03);color:var(--gold);
  font-size:1.35rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;
  transition:color .3s,border-color .3s,box-shadow .3s}
.parrow:hover{border-color:var(--gold);box-shadow:0 0 20px var(--gold-glow)}
.pcount{font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);min-width:82px}
.pdots{display:flex;justify-content:center;gap:.55rem;margin-top:1.2rem;flex-wrap:wrap}
.pdot{width:9px;height:9px;border-radius:50%;background:rgba(248,246,255,.22);border:0;padding:0;cursor:pointer;transition:background .3s,transform .3s,box-shadow .3s}
.pdot:hover{background:rgba(248,246,255,.5)}
.pdot.on{background:var(--gold);box-shadow:0 0 12px var(--gold-glow);transform:scale(1.25)}
.phint{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);margin-top:1.1rem}
.vd-view{border-radius:22px;border-color:var(--glass-edge)!important;box-shadow:0 0 40px rgba(169,139,255,.18),0 20px 50px rgba(0,0,0,.35)}
.vid .frame{position:relative;aspect-ratio:16/9;background:#000;line-height:0}
.vid .frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* galleries + lightbox (kept for any page that uses them) */
.gallery{column-count:3;column-gap:14px;margin-top:2.6rem}
@media(max-width:900px){.gallery{column-count:2}}
@media(max-width:560px){.gallery{column-count:1}}
.shot{break-inside:avoid;margin:0 0 14px;position:relative;border:1px solid var(--glass-edge);border-radius:14px;overflow:hidden;line-height:0;cursor:zoom-in;transition:border-color .3s,transform .3s}
.shot:hover{border-color:rgba(242,211,140,.45);transform:translateY(-2px)}
.shot img{width:100%;height:auto;display:block}
.shot figcaption{line-height:1.6;padding:.85rem 1rem;font-size:.82rem;color:var(--mute);border-top:1px solid var(--glass-edge)}
#lb{position:fixed;inset:0;z-index:200;display:none;background:rgba(5,4,15,.96);align-items:center;justify-content:center;flex-direction:column;gap:1rem;padding:clamp(14px,4vw,48px)}
#lb.on{display:flex}
#lb img{max-width:100%;max-height:78vh;object-fit:contain;border:1px solid var(--glass-edge);display:block}
#lb .lb-bar{display:flex;align-items:center;gap:1.6rem;justify-content:center}
#lb button{background:none;border:1px solid var(--gold-hair);border-radius:999px;color:var(--gold);font-family:var(--sans);font-size:.9rem;line-height:1;padding:.7em 1.1em;cursor:pointer}
#lb button:hover{color:var(--white);border-color:var(--gold)}
#lb .lb-count{font-size:.7rem;letter-spacing:.26em;color:var(--mute);text-transform:uppercase}
#lb .lb-close{position:absolute;top:clamp(10px,2vw,26px);right:clamp(10px,2vw,26px)}
.striprow{display:grid;gap:10px;margin-top:2.4rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.striprow a{border:0;display:block;line-height:0;position:relative;overflow:hidden;border-radius:14px}
.striprow img{width:100%;aspect-ratio:1;object-fit:cover;display:block;border:1px solid var(--glass-edge);border-radius:14px;transition:transform .45s}
.striprow a:hover img{transform:scale(1.04)}

/* book academy (my work) */
.ba-card{border-radius:16px;border-color:var(--glass-edge)!important;background:var(--glass)!important;overflow:hidden}
.ba-card:hover{border-color:rgba(242,211,140,.45)!important;box-shadow:0 0 30px rgba(169,139,255,.22)!important}
.ba-card img{border-radius:10px}

/* privacy + terms */
.legal{max-width:72ch;margin-inline:auto}
.legal h1{font-size:clamp(1.6rem,4.2vw,2.5rem);margin-bottom:.8rem}
.legal h2{font-size:clamp(1.05rem,2vw,1.3rem);margin:2.4rem 0 .8rem}
.legal p,.legal li{line-height:1.8}
.legal ul{margin:0 0 1.15rem;padding:0}
.legal li{margin-bottom:.5rem}
.legal .eff{color:var(--mute);margin-bottom:1.6rem}
.legal-back{display:inline-block;margin-bottom:1.4rem;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}

/* footer extras */
.legal-links{margin-top:1rem;font-size:.8rem;color:var(--mute)}
.legal-links a{border:0;color:var(--mute)}
.legal-links a:hover{color:var(--gold)}
::selection{background:rgba(169,139,255,.45);color:#fff}