/* Centered cosmic edition — real responsive UI over original artwork. */
body{background:#0b0913}.topbar{border-bottom:1px solid #d6b46e36;min-height:76px}.brand{color:#f3e9d6}.primary-btn{border-radius:999px;background:linear-gradient(120deg,#f8df9a,#e8be6c);color:#16101b;box-shadow:0 3px 24px #e9b96022;font-weight:700}.home-edition{isolation:isolate}.centered-hero{position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;min-height:650px;height:min(760px,calc(100vw * .55));width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;background:#110a1c}.hero-landscape{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 52%;z-index:-2}.centered-hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0b0913ed 0%,#0b0913b5 18%,transparent 39%,transparent 67%,#0b0913a6 86%,#0b0913 100%)}.centered-heading{padding:32px 24px 0;width:100%;text-shadow:0 2px 14px #000}.centered-heading .eyebrow{color:#e8c889;font-size:11px;letter-spacing:.25em}.centered-heading h1{font:normal clamp(32px,3.5vw,53px)/1.2 Georgia,serif;letter-spacing:-.025em;margin:15px 0}.centered-heading h1 em{font-style:normal}.centered-heading p{font:17px/1.65 Georgia,serif;color:#eee4ee;margin:0 auto;max-width:730px}.centered-cta{padding:0 20px 23px;width:100%}.centered-cta .editorial-actions{justify-content:center;gap:30px}.centered-cta>p{font-size:12px;color:#e1d7e4;margin:16px 0 0}.centered-cta .text-link{background:#100b188c;padding:12px 14px;border-radius:4px}.home-shortcuts{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line);padding:21px 0}.home-shortcuts button{display:flex;justify-content:center;gap:18px;align-items:center;color:#d6b777;background:none;border:0;border-right:1px solid var(--line);padding:9px;font-size:18px}.home-shortcuts button:last-child{border:0}.home-shortcuts span{font:14px Georgia,serif;color:#eee2ef}.paths-section{padding:48px 0 60px}.home-edition .section-heading{display:block;text-align:center}.home-edition .section-heading p{max-width:none;margin:0 auto 26px;line-height:1.7}.home-edition .section-heading h2{margin-top:12px}.home-edition .category-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:13px}.home-edition .category-card{min-height:210px;padding:20px 16px;text-align:left;border:1px solid #c4a67840}.home-edition .category-card h3{font-size:22px}.home-edition .category-card p{font-size:11px}.home-edition .category-card:hover{border-color:#e1bf83;transform:translateY(-4px)}.path-top{margin-bottom:18px}.path-index{display:none}.deck-showcase{scroll-margin-top:100px}.home-shortcuts button:hover span{color:#f5d495}
@media(min-width:1700px){.hero-landscape{object-fit:cover;object-position:center 53%}.centered-hero{height:810px}}
@media(max-width:1100px){.home-edition .category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.centered-hero{min-height:600px}.centered-heading h1{font-size:38px}.home-shortcuts button{gap:9px}}
@media(max-width:700px){.centered-hero{height:690px;min-height:0}.hero-landscape{object-fit:cover;object-position:center}.centered-heading{padding:28px 18px 0}.centered-heading h1{font-size:36px;max-width:400px;margin:15px auto}.centered-heading p{font:15px/1.65 Georgia,serif;max-width:340px}.centered-heading .eyebrow{font-size:9px;letter-spacing:.2em}.centered-hero:after{background:linear-gradient(180deg,#0b0913ed,#0b0913a6 25%,transparent 43%,transparent 64%,#0b0913ce 86%,#0b0913)}.centered-cta .editorial-actions{gap:8px;flex-direction:column}.centered-cta{padding-bottom:21px}.centered-cta>p{margin-top:10px}.home-shortcuts{grid-template-columns:1fr 1fr;gap:14px 0;padding:18px 0}.home-shortcuts button:nth-child(2){border:0}.home-shortcuts span{font-size:12px}.home-edition .category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-edition .category-card{min-height:215px}.paths-section{padding-top:38px}.home-edition h2{font-size:34px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.centered-hero{isolation:isolate}body{overflow-x:clip}.centered-heading{position:relative;z-index:1}.centered-cta{position:relative;z-index:1}
@media(min-width:701px) and (max-height:850px){.centered-hero{min-height:550px;height:calc(100svh - 145px)}.centered-heading h1{font-size:clamp(32px,3.3vw,48px)}}

/* Overlay the supplied gold Tarot4U wordmark on the ORIGINAL home hero art.
   It replaces the old "Begin my free reading" button. The artwork file stays untouched. */
.centered-branding{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  padding:0 18px 18px;
}
.hero-wordmark{
  display:block;
  width:min(740px,84vw);
  height:auto;
  max-height:clamp(170px,35vh,290px);
  object-fit:contain;
  filter:drop-shadow(0 3px 6px rgba(12,5,22,.88)) drop-shadow(0 0 15px rgba(220,157,69,.22));
  pointer-events:none;
  user-select:none;
}
.centered-branding>p{
  font-size:12px;
  letter-spacing:.075em;
  color:#f8e7c5;
  text-shadow:0 2px 10px rgba(0,0,0,.95);
  margin:0;
}
@media(max-width:700px){
 .centered-branding{padding:0 14px 20px}
 .hero-wordmark{width:min(96vw,500px);max-height:210px}
 .centered-branding>p{font-size:11px}
}

/* 2026-10-10: Move the gold Tarot4U wordmark BELOW the meditating silhouette.
   Preserve the original landscape image; extend the hero into the water/dark
   foreground instead of enlarging the logo over the girl's chakras. */
.centered-hero {
  height: clamp(920px, 70vw, 1080px);
  min-height: 920px;
}
.hero-landscape {
  inset: 0 0 auto 0;
  height: min(900px, calc(100vw * 941 / 1672));
  object-position: center top;
  -webkit-mask-image: linear-gradient(to bottom, black 0%, black 83%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 0%, black 83%, transparent 100%);
}
.centered-heading { padding-top: 47px; }
.centered-branding { padding-bottom: 27px; }
.hero-wordmark { max-height: 285px; }

@media (max-width: 1100px) {
  .centered-hero { height: 955px; min-height: 955px; }
  .hero-landscape { height: clamp(610px, 73vw, 740px); }
}
@media (max-width: 700px) {
  .centered-hero { height: 900px; min-height: 900px; }
  .hero-landscape { height: 690px; object-position: center top; }
  .centered-heading { padding: 38px 18px 0; }
  .centered-branding { padding: 0 14px 29px; }
  .hero-wordmark { width: min(90vw, 460px); max-height: 205px; }
}
@media (max-width: 380px) {
  .centered-hero { height: 855px; min-height: 855px; }
  .hero-landscape { height: 650px; }
}