/* Bible Word Journey landing page. Warm sunrise identity from the game,
   structure + cards consistent with the site. Loaded only on its template. */

/* ---------- HERO (signature) ---------- */
.bwj-hero{position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#FFD873 0%,#F7B02E 48%,#EE9412 100%);
  padding:var(--space-8) 0 var(--space-12)}
/* soft sunburst rays behind the content */
.bwj-hero__rays{position:absolute;inset:-40% -10% auto;height:180%;z-index:-1;
  background:repeating-conic-gradient(from 0deg at 50% 0,
    rgba(255,255,255,.22) 0deg 6deg, rgba(255,255,255,0) 6deg 14deg);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0,#000 0%,transparent 70%);
          mask-image:radial-gradient(120% 90% at 50% 0,#000 0%,transparent 70%);
  opacity:.7;pointer-events:none}
.bwj-hero__inner{display:grid;gap:var(--space-8);align-items:center}
.bwj-hero__copy{min-width:0}
.bwj-eyebrow{display:inline-block;margin:0 0 .5rem;padding:.3rem .8rem;border-radius:999px;
  background:rgba(255,255,255,.55);color:#7a4a00;font-weight:800;font-size:1rem;
  text-transform:uppercase;letter-spacing:.04em}
.bwj-titlerow{display:flex;align-items:center;gap:.75rem;margin:0 0 .35rem}
.bwj-appicon{border-radius:20px;box-shadow:0 6px 18px rgba(120,70,0,.28);flex:none}
.bwj-hero h1{color:#2b1d02;margin:0;text-shadow:0 1px 0 rgba(255,255,255,.35)}
.bwj-lede{color:#4a370c;font-size:1.15rem;max-width:34ch;margin:.4rem 0 1rem;font-weight:500}
.bwj-chips{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.25rem;padding:0}
.bwj-chips li{background:rgba(255,255,255,.7);color:#5a3d00;font-weight:700;font-size:1rem;
  padding:.35rem .8rem;border-radius:999px;box-shadow:0 1px 2px rgba(120,70,0,.12)}
/* primary download button — big, high-contrast, unmissable */
.bwj-cta-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;margin:.25rem 0 0}
.bwj-cta{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;
  width:100%;max-width:400px;min-height:68px;padding:1.05rem 2rem;border-radius:18px;
  font-family:var(--font-head);font-weight:800;font-size:1.35rem;line-height:1.1;color:#fff;
  background:linear-gradient(180deg,#3f7bf2 0%,var(--accent) 55%,var(--accent-press) 100%);
  box-shadow:0 12px 26px rgba(37,99,235,.42),inset 0 1px 0 rgba(255,255,255,.25);
  border:0;cursor:pointer;text-align:center;
  transition:transform .15s,filter .15s,box-shadow .15s}
.bwj-cta:hover{transform:translateY(-2px);filter:brightness(1.05);text-decoration:none;
  box-shadow:0 18px 36px rgba(37,99,235,.52),inset 0 1px 0 rgba(255,255,255,.28)}
.bwj-cta:active{transform:translateY(0)}
.bwj-cta svg{width:28px;height:28px;fill:#fff;flex:none}
/* official store badge — now the smaller secondary link */
.bwj-badge{display:inline-block;line-height:0;transition:transform .15s,filter .15s}
.bwj-badge img{height:44px;width:auto}
.bwj-badge:hover{transform:translateY(-2px);filter:brightness(1.03)}
.bwj-frommakers{color:#5a4212;font-size:1rem;margin:.9rem 0 0}
.bwj-frommakers a{color:#7a4a00;font-weight:700;text-decoration:underline}
/* breadcrumbs recolored for the gold hero */
.bwj-hero .bsf-breadcrumbs{margin-bottom:1rem}
.bwj-hero .bsf-breadcrumbs li,
.bwj-hero .bsf-breadcrumbs li+li::before{color:#7a561a}
.bwj-hero .bsf-breadcrumbs a{color:#6b3f00;font-weight:600}
.bwj-hero__shot{justify-self:center}

/* ---------- phone frames ---------- */
.bwj-phone{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:26px;padding:8px;
  box-shadow:0 12px 30px rgba(30,20,0,.18);max-width:300px;margin:0}
.bwj-phone img{border-radius:20px;width:100%;height:auto;display:block}
.bwj-phone--hero{max-width:300px}
.bwj-phone figcaption{font-family:var(--font-head);font-weight:700;font-size:1rem;
  color:var(--text);text-align:center;padding:.7rem .4rem .3rem}

/* ---------- how it plays ---------- */
.bwj-section-lede{font-size:1.15rem;color:var(--muted);max-width:60ch;margin:0 0 var(--space-8)}
.bwj-how__grid{display:grid;grid-template-columns:1fr;gap:var(--space-8);justify-items:center}

/* ---------- features ---------- */
.bwj-feat{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:var(--space-6)}
.bwj-feat li{background:#fff;border:1px solid #ECEEF2;border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);padding:var(--space-6)}
.bwj-feat__ic{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:14px;background:linear-gradient(180deg,#FFD873,#F2A900);color:#5a3d00;
  font-size:1.5rem;margin-bottom:.6rem;box-shadow:0 3px 8px rgba(242,169,0,.35)}
.bwj-feat h3{margin:0 0 .25rem}
.bwj-feat p{margin:0;color:var(--muted);font-size:1.05rem}

/* ---------- gallery ---------- */
.bwj-gallery__scroll{display:flex;gap:var(--space-6);overflow-x:auto;padding:.5rem .25rem 1rem;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.bwj-phone--sm{flex:0 0 auto;max-width:230px;scroll-snap-align:center}

/* ---------- from the makers ---------- */
.bwj-makers__inner{display:flex;gap:var(--space-6);align-items:center;flex-wrap:wrap}
.bwj-makers h2{margin:0 0 .35rem}
.bwj-makers p{margin:0;color:var(--muted);font-size:1.1rem;max-width:60ch}
.bwj-makers a{font-weight:600}

/* ---------- final CTA ---------- */
.bwj-final{background:linear-gradient(180deg,#F7B02E,#EA8E0C);text-align:center;
  padding:var(--space-12) 0}
.bwj-final h2{color:#2b1d02;margin:0 0 .4rem}
.bwj-final p{color:#4a370c;font-size:1.15rem;margin:0 0 1.25rem}
.bwj-final .bwj-cta-wrap{align-items:center;max-width:400px;margin-left:auto;margin-right:auto}
.bwj-final__note{font-size:1rem!important;color:#5a4212;margin:1rem 0 0!important;font-weight:600}
.bwj-final__legal{font-size:1rem;margin:.5rem 0 0}
.bwj-final__legal a{color:#6b3f00;font-weight:600;text-decoration:underline}

/* ---------- desktop ---------- */
@media (min-width:820px){
  .bwj-hero{padding:var(--space-12) 0}
  .bwj-hero__inner{grid-template-columns:1.1fr .9fr;gap:var(--space-12)}
  .bwj-hero__shot{justify-self:end}
  .bwj-how__grid{grid-template-columns:repeat(3,1fr);align-items:start}
  .bwj-feat{grid-template-columns:repeat(3,1fr)}
  .bwj-makers__inner{flex-wrap:nowrap}
}