/* Reference-led homepage layer. Keeps existing data and navigation intact. */
.ss-home-page {
  --ref-ink: #241210;
  --ref-wine: #7a1711;
  --ref-saffron: #f34b12;
  --ref-gold: #e7a630;
  --ref-cream: #fffaf1;
  --ref-line: rgba(91, 38, 20, .14);
  background: var(--ref-cream);
}

/* Homepage-only navigation treatment; controls and URLs remain in site_header. */
.ss-home-page .ss-header { background: rgba(255, 252, 246, .96); border-bottom: 1px solid rgba(122,23,17,.15); box-shadow: 0 4px 20px rgba(52,21,9,.08); }
.ss-home-page .ss-header__bar { min-height: 68px; }
.ss-home-page .ss-brand__name, .ss-home-page .ss-nav-link, .ss-home-page .ss-nav-btn { color: #351815; }
.ss-home-page .ss-brand__tag { color: #9b6a31; }
.ss-home-page .ss-nav-link.is-active, .ss-home-page .ss-nav-btn.is-active { color: var(--ref-saffron); }
.ss-home-page .ss-header__login { color: var(--ref-wine); border-color: var(--ref-wine); }
.ss-home-page .ss-header__cta { background: linear-gradient(135deg, #ff641b, #e72c09); box-shadow: 0 8px 16px rgba(218,57,12,.22); }
.ss-home-page .ss-slokas { display: none; }

/* Poster-like, image-first hero. */
.ss-home-page .ss-hero,
.ss-home-page .ss-hero:where(*) {
  min-height: min(720px, calc(100svh - 69px));
}
.ss-home-page .ss-hero {
  isolation: isolate;
  background: linear-gradient(90deg, rgba(22,8,5,.73) 0%, rgba(43,13,6,.46) 38%, rgba(33,10,5,.05) 70%), url("../images/homepage-heritage-sunrise-v1.png") 60% center / cover no-repeat;
}
.ss-home-page .ss-hero::before { opacity: .22; background: radial-gradient(circle at var(--ss-pointer-x, 50%) var(--ss-pointer-y, 32%), rgba(255,224,146,.35), transparent 26%); mix-blend-mode: screen; }
.ss-home-page .ss-hero::after { height: 5px; background: linear-gradient(90deg, var(--ref-saffron), #f8cc68, var(--ref-saffron)); }
.ss-home-page .ss-hero__content { align-items: center; min-height: inherit; padding: 74px 0 54px; }
.ss-home-page .ss-hero__copy { max-width: 660px; }
.ss-home-page .ss-hero__logo { width: 64px; height: 64px; padding: 8px; border-radius: 50%; background: rgba(255,248,235,.93); box-shadow: 0 8px 30px rgba(0,0,0,.28); }
.ss-home-page .ss-hero .ss-kicker { color: #ffd57c; font-weight: 800; }
.ss-home-page .ss-hero h1 { color: #fff9ed; font-size: clamp(3.2rem, 7.2vw, 6.7rem); line-height: .9; letter-spacing: -.06em; text-shadow: 0 4px 30px rgba(0,0,0,.38); }
.ss-home-page .ss-hero__headline { color: #fff0cf; font-family: Cinzel, serif; font-size: clamp(1.25rem, 2.5vw, 2rem); font-weight: 700; }
.ss-home-page .ss-hero__text { max-width: 580px; color: rgba(255,250,239,.94); font-size: clamp(1rem, 1.4vw, 1.2rem); }
.ss-home-page .ss-hero__signature { color: #ffe6ae; }
.ss-home-page .ss-action--gold { background: linear-gradient(135deg, #ff6a21, #e8330b); color: #fff; box-shadow: 0 12px 24px rgba(98,24,7,.36); }
.ss-home-page .ss-action--glass { color: #fff; border-color: rgba(255,244,219,.8); background: rgba(38,10,5,.3); backdrop-filter: blur(8px); }
.ss-home-page .ss-hero__console { background: rgba(22,8,5,.68); border-color: rgba(255,210,114,.5); backdrop-filter: blur(12px); }
.ss-home-page .ss-hero__console p, .ss-home-page .ss-hero__console h2 { color: #fff8e9; }
.ss-home-page .ss-hero__pathways { border-color: rgba(255,237,194,.45); }
.ss-home-page .ss-hero__pathways a { color: #fff7e5; }
.ss-home-page .ss-hero__pathways a + a { border-left-color: rgba(255,237,194,.3); }
.ss-home-page .ss-hero__pathways small { color: rgba(255,247,229,.73); }

/* Direct service navigation replaces an abstract first interaction. */
.ss-platform-links { position: relative; z-index: 2; margin-top: -46px; padding-bottom: 20px; }
.ss-platform-links__grid { display: grid; grid-template-columns: repeat(6, 1fr); overflow: hidden; border: 1px solid var(--ref-line); border-radius: 20px; background: rgba(255,253,248,.96); box-shadow: 0 18px 50px rgba(73,32,14,.15); }
.ss-platform-links a { min-height: 152px; padding: 25px 14px; border-right: 1px solid var(--ref-line); color: var(--ref-ink); text-align: center; transition: transform .22s ease, background .22s ease; }
.ss-platform-links a:last-child { border-right: 0; }
.ss-platform-links a:hover, .ss-platform-links a:focus-visible { background: #fff3dd; transform: translateY(-5px); }
.ss-platform-links span { display: grid; width: 47px; height: 47px; place-items: center; margin: 0 auto 13px; border-radius: 50%; background: linear-gradient(145deg, #ff8a32, #e53b0d); color: #fff; font-size: 1.35rem; box-shadow: 0 8px 18px rgba(222,73,15,.24); }
.ss-platform-links a:nth-child(2) span { background: linear-gradient(145deg, #796ee9, #5146c7); }
.ss-platform-links a:nth-child(3) span { background: linear-gradient(145deg, #55b966, #248641); }
.ss-platform-links a:nth-child(4) span { background: linear-gradient(145deg, #ef6070, #bd263d); }
.ss-platform-links a:nth-child(5) span { background: linear-gradient(145deg, #f2b338, #d78012); }
.ss-platform-links a:nth-child(6) span { background: linear-gradient(145deg, #4091dd, #2368bd); }
.ss-platform-links strong, .ss-platform-links small { display: block; }
.ss-platform-links strong { font-family: Cinzel, serif; font-size: .83rem; }
.ss-platform-links small { margin-top: 5px; color: #765b4f; font-size: .72rem; }

.ss-home-page .ss-trust { background: #20100b; }
.ss-home-page .ss-trust__grid { padding: 46px 0; }
.ss-home-page .ss-trust h2 { font-size: clamp(1.7rem, 2.8vw, 3rem); }
.ss-home-page .ss-metrics dt::after { content: "+"; font-size: .42em; vertical-align: top; }

/* Real daily-dharma content gets a dedicated, reference-inspired treatment. */
.ss-wisdom { padding: clamp(76px, 9vw, 128px) 0; background: linear-gradient(180deg, #fffaf1, #f8ecda); }
.ss-wisdom::before { content: ""; display: block; width: min(1160px, calc(100% - 48px)); height: 1px; margin: 0 auto clamp(56px, 7vw, 94px); background: linear-gradient(90deg, transparent, rgba(174,94,35,.38), transparent); }
.ss-wisdom__grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .75fr); gap: clamp(26px, 4vw, 52px); align-items: stretch; }
.ss-wisdom .ss-section-head { margin-bottom: 24px; }
.ss-wisdom .ss-section-head h2 { font-size: clamp(2rem, 3vw, 3.2rem); }
.ss-scripture-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ss-scripture-card { position: relative; display: flex; min-height: 290px; flex-direction: column; justify-content: flex-end; overflow: hidden; padding: 22px; border-radius: 16px; color: #fff; background: linear-gradient(0deg, rgba(19,8,4,.94), rgba(19,8,4,.05) 80%), url("../images/ramayana-cover-original-v1.png") center / cover; box-shadow: 0 14px 28px rgba(83,36,18,.16); transition: transform .25s ease, box-shadow .25s ease; }
.ss-scripture-card::after { content: "→"; position: absolute; right: 16px; bottom: 16px; display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: #fff5df; color: var(--ref-wine); }
.ss-scripture-card:hover, .ss-scripture-card:focus-visible { transform: translateY(-7px); box-shadow: 0 20px 40px rgba(83,36,18,.28); }
.ss-scripture-card--gita { background-image: linear-gradient(0deg, rgba(23,8,4,.95), rgba(23,8,4,.1) 80%), url("../images/gita-poster-background-v1.png"); }
.ss-scripture-card--granthalu { background-image: linear-gradient(0deg, rgba(23,8,4,.95), rgba(23,8,4,.08) 80%), url("../images/daily_slokam_temple.png"); }
.ss-scripture-card span { color: #ffd878; font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.ss-scripture-card strong { max-width: 85%; margin-top: 8px; font-family: Cinzel, serif; font-size: clamp(1.15rem, 1.7vw, 1.5rem); line-height: 1.15; }
.ss-scripture-card small { max-width: 90%; margin-top: 8px; color: rgba(255,249,235,.84); }
.ss-daily-card { position: relative; overflow: hidden; padding: clamp(28px, 3vw, 42px); border: 1px solid rgba(209,139,37,.22); border-radius: 20px; background: #fffdf9; box-shadow: 0 16px 42px rgba(93,44,19,.1); }
.ss-daily-card::before { content: ""; position: absolute; width: 230px; height: 230px; top: -115px; right: -80px; border-radius: 50%; background: radial-gradient(circle, rgba(250,200,95,.25), transparent 70%); }
.ss-daily-card__mark { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 50%; background: #fff0d6; color: var(--ref-saffron); font-size: 1.35rem; }
.ss-daily-card h3 { margin: 10px 0 18px; color: var(--ref-ink); font-family: Cinzel, serif; font-size: 1.35rem; }
.ss-daily-card__verse { color: #402018; font-family: Cinzel, serif; font-size: 1rem; font-weight: 700; line-height: 1.75; }
.ss-daily-card__meaning { color: #6e5043; line-height: 1.65; }
.ss-daily-card .ss-action { margin-top: 11px; }

/* Keep the existing install flow present without obscuring the page it promotes. */
.ss-home-page #pwa-install-banner {
  border: 1px solid rgba(255,216,139,.28);
  border-radius: 16px 16px 0 0;
  box-shadow: 0 -12px 36px rgba(47,10,4,.28);
}
.ss-home-page #pwa-install-banner .banner-content { gap: 12px; }
.ss-home-page #pwa-install-banner .banner-icon { width: 42px; height: 42px; }
.ss-home-page #pwa-install-banner .banner-text strong { font-size: .92rem; }
.ss-home-page #pwa-install-banner .banner-text span { font-size: .76rem; }

/* Polished depth without turning the homepage into a card grid. */
.ss-home-page .ss-portals { position: relative; }
.ss-home-page .ss-portals::before { content: ""; position: absolute; inset: 0 0 auto; height: 190px; pointer-events: none; background: radial-gradient(ellipse at 18% 0, rgba(255,212,127,.2), transparent 60%); }
.ss-home-page .ss-portal { transition: transform .24s ease, border-color .24s ease; }
.ss-home-page .ss-portal:hover { transform: translateY(-6px); border-color: rgba(174,94,35,.46); }
.ss-home-page .ss-directory__panel { position: relative; overflow: hidden; }
.ss-home-page .ss-directory__panel--gold::after { content: ""; position: absolute; inset: auto -25% -62% auto; width: 320px; height: 320px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(239,170,57,.24), transparent 67%); }

@media (max-width: 1080px) {
  .ss-home-page .ss-nav-desktop { display: none; }
  .ss-platform-links__grid { grid-template-columns: repeat(3, 1fr); }
  .ss-platform-links a:nth-child(3) { border-right: 0; }
  .ss-platform-links a:nth-child(-n + 3) { border-bottom: 1px solid var(--ref-line); }
  .ss-wisdom__grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .ss-home-page .ss-header__bar { min-height: 62px; }
  .ss-home-page .ss-brand__tag, .ss-home-page .ss-header__login { display: none; }
  .ss-home-page .ss-header__cta { padding: 10px 13px; font-size: .72rem; }
  .ss-home-page .ss-hero { min-height: 720px; background-position: 59% center; }
  .ss-home-page .ss-hero__content { padding-top: 118px; align-items: start; }
  .ss-home-page .ss-hero h1 { font-size: clamp(3.3rem, 15vw, 4.7rem); }
  .ss-home-page .ss-hero__headline { font-size: 1.2rem; }
  .ss-home-page .ss-hero__console { margin-top: 12px; }
  .ss-platform-links { margin-top: -22px; }
  .ss-platform-links__grid { grid-template-columns: repeat(2, 1fr); border-radius: 15px; }
  .ss-platform-links a { min-height: 130px; border-bottom: 1px solid var(--ref-line); }
  .ss-platform-links a:nth-child(2n) { border-right: 0; }
  .ss-platform-links a:nth-child(5), .ss-platform-links a:nth-child(6) { border-bottom: 0; }
  .ss-scripture-cards { grid-template-columns: 1fr; }
  .ss-scripture-card { min-height: 220px; }
  .ss-home-page .ss-trust__grid { padding: 34px 0; }
  .ss-wisdom::before { width: calc(100% - 28px); margin-bottom: 48px; }
  .ss-home-page #pwa-install-banner { left: 10px; right: 10px; bottom: 10px; border-radius: 14px; }
  .ss-home-page #pwa-install-banner .banner-content { min-height: 72px; gap: 9px; padding: 10px 12px; }
  .ss-home-page #pwa-install-banner .banner-icon { width: 38px; height: 38px; }
  .ss-home-page #pwa-install-banner .banner-text strong { font-size: .82rem; }
  .ss-home-page #pwa-install-banner .banner-text span { font-size: .68rem; }
  .ss-home-page #pwa-install-banner .btn-install { min-height: 38px; padding: 8px 14px; font-size: .78rem; }
}

/* The in-between 600–780px range needs a real single-column hero, not a compressed desktop grid. */
@media (max-width: 780px) {
  .ss-home-page .ss-hero { min-height: auto; }
  .ss-home-page .ss-hero__content {
    grid-template-columns: minmax(0, 1fr);
    gap: 26px;
    align-items: start;
  }
  .ss-home-page .ss-hero__copy { max-width: 570px; }
  .ss-home-page .ss-hero__console {
    width: 100%;
    max-width: 570px;
    min-height: auto;
    margin: 0;
    padding: 24px;
  }
  .ss-home-page #pwa-install-banner { left: 10px; right: 10px; bottom: 10px; border-radius: 14px; }
  .ss-home-page #pwa-install-banner .banner-content { min-height: 72px; gap: 9px; padding: 10px 12px; }
  .ss-home-page #pwa-install-banner .banner-icon { width: 38px; height: 38px; }
  .ss-home-page #pwa-install-banner .banner-text strong { font-size: .82rem; }
  .ss-home-page #pwa-install-banner .banner-text span { font-size: .68rem; }
  .ss-home-page #pwa-install-banner .btn-install { min-height: 38px; padding: 8px 14px; font-size: .78rem; }
}

/* Mobile alignment: keep the hero and the service launcher as two clear,
   consecutive sections rather than letting the launcher float into the hero. */
@media (max-width: 780px) {
  .ss-home-page .ss-platform-links {
    margin-top: 0;
    padding: 14px 0 18px;
    border-radius: 20px 20px 0 0;
  }

  .ss-home-page .ss-platform-links__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid rgba(116, 63, 24, 0.13);
    border-radius: 16px;
    background: rgba(116, 63, 24, 0.13);
  }

  .ss-home-page .ss-platform-links__grid > a {
    min-height: 116px;
    padding: 16px 10px 14px;
    justify-content: center;
    text-align: center;
    background: #fffdfa;
  }

  .ss-home-page .ss-platform-links__grid > a > span {
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
    font-size: 18px;
  }

  .ss-home-page .ss-platform-links__grid > a > strong {
    font-size: 0.83rem;
    line-height: 1.18;
  }

  .ss-home-page .ss-platform-links__grid > a > small {
    margin-top: 5px;
    font-size: 0.68rem;
    line-height: 1.25;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ss-platform-links a, .ss-scripture-card { transition: none; }
}
