/* ============================================================
   Bump to Baby — Press & Media page
   (loads after styles.css; reuses its tokens)
   ============================================================ */

/* self-hosted brand fonts (see assets/fonts/OFL.txt) — served locally instead of
   Google Fonts so the press page no longer flashes a fallback font on load.
   url() is resolved relative to this file, i.e. Website/assets/fonts/. */
@font-face{ font-family:'Oswald'; font-style:normal; font-weight:400 700; font-display:swap; src:url("assets/fonts/oswald.woff2") format("woff2"); }
@font-face{ font-family:'Marcellus'; font-style:normal; font-weight:400; font-display:swap; src:url("assets/fonts/marcellus.woff2") format("woff2"); }
@font-face{ font-family:'Caveat'; font-style:normal; font-weight:500 700; font-display:swap; src:url("assets/fonts/caveat.woff2") format("woff2"); }
@font-face{ font-family:'Mulish'; font-style:normal; font-weight:400 700; font-display:swap; src:url("assets/fonts/mulish.woff2") format("woff2"); }

.press-main{ background:var(--white); }

/* ---------- press hero ---------- */
.press-hero{
  position:relative; background:var(--hero-grad); color:#fff;
  padding:150px 0 76px; text-align:center; overflow:hidden;
}
.press-hero .wordmark{
  display:inline-flex; align-items:center; gap:.5em; justify-content:center;
  font-family:var(--f-logo); font-size:1.7rem; color:#fff; margin-bottom:30px;
}
.press-hero .wordmark img{ width:1.5em; height:1.5em; border-radius:.34em; background:var(--brand); padding:.1em; }
.press-hero h1{
  font-family:var(--f-display); font-weight:700; text-transform:uppercase;
  font-size:clamp(2.8rem,6vw,4.8rem); line-height:.98; letter-spacing:.01em; margin:0;
  text-shadow:0 2px 18px rgba(150,40,60,.16);
}
.press-hero .script{ font-family:var(--f-script); font-size:clamp(1.7rem,3.4vw,2.4rem); color:#fff; margin:8px 0 30px; opacity:.97; }
.press-hero .btn-white{ font-size:1rem; }

/* ---------- section scaffold ---------- */
.press-section{ padding:74px 0; }
.press-section.cream{ background:var(--cream); }
.press-section.white{ background:var(--white); }
.sec-label{
  font-family:var(--f-display); text-transform:uppercase; font-weight:700;
  letter-spacing:.14em; font-size:clamp(1.5rem,2.8vw,2.1rem); color:var(--ink); margin:0 0 8px;
}
.sec-sub{ color:var(--ink-soft); font-size:1.05rem; margin:0 0 34px; }

/* intro */
.press-intro{ background:var(--white); padding:54px 0 8px; }
.press-intro p{
  font-family:var(--f-logo); font-size:clamp(1.3rem,2.4vw,1.7rem); line-height:1.5;
  color:var(--ink); max-width:60ch; margin:0 auto; text-align:center;
}

/* story */
.story p{ font-size:1.12rem; color:var(--ink); max-width:none; margin:0 0 22px; }
.story p:last-child{ margin-bottom:0; }

/* at a glance */
.facts-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.fact{
  background:var(--white); border-radius:18px; padding:24px 26px; box-shadow:var(--sh-sm);
  border:1px solid var(--hairline);
}
.fact .k{ font-family:var(--f-display); text-transform:uppercase; letter-spacing:.12em; font-size:.74rem; color:var(--brand); margin-bottom:6px; }
.fact .v{ font-size:1.12rem; font-weight:600; color:var(--ink); }
.fact .v a{ color:var(--brand); }
.fact .v a:hover{ text-decoration:underline; }

/* press release card */
.release-card{
  background:var(--white); border-radius:var(--radius); box-shadow:var(--sh-md);
  padding:44px 40px; text-align:center; border:1px solid var(--hairline);
}
.release-card h3{ font-family:var(--f-display); text-transform:uppercase; font-weight:700; font-size:clamp(1.6rem,3vw,2.2rem); margin:0 0 6px; letter-spacing:.01em; }
.release-card .rsub{ font-family:var(--f-logo); font-size:1.2rem; color:var(--ink-soft); margin:0 0 26px; }
.release-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* screenshots */
.shots-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.shot{ display:flex; flex-direction:column; gap:12px; }
.shot a{
  display:block; border-radius:18px; overflow:hidden; box-shadow:var(--sh-md);
  background:var(--cream); transition:transform .28s ease, box-shadow .28s ease; position:relative;
}
.shot a::after{
  content:"↓ Download"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(236,109,122,.86); color:#fff; font-family:var(--f-display); text-transform:uppercase;
  letter-spacing:.1em; font-size:1rem; opacity:0; transition:opacity .25s ease;
}
.shot a:hover{ transform:translateY(-5px); box-shadow:var(--sh-lg); }
.shot a:hover::after{ opacity:1; }
.shot a:focus-visible::after{ opacity:1; }
.shot img{ width:100%; height:auto; display:block; }
.shot .cap{ font-size:.96rem; color:var(--ink-soft); line-height:1.45; }
.shot .cap b{ color:var(--ink); font-weight:700; }

/* quotes */
.quotes{ display:grid; gap:20px; }
.quote{
  position:relative; background:var(--white); border-left:5px solid var(--brand);
  border-radius:0 18px 18px 0; padding:30px 34px; box-shadow:var(--sh-sm);
}
/* padding-right keeps the first line clear of the absolutely-placed copy button */
.quote p{ font-family:var(--f-logo); font-size:1.22rem; line-height:1.55; color:var(--ink); margin:0 0 16px; padding-right:130px; }
.quote .attr{ font-family:var(--f-display); text-transform:uppercase; letter-spacing:.1em; font-size:.78rem; color:var(--brand); }
.copy-q{
  position:absolute; top:20px; right:20px; border:none; cursor:pointer;
  background:var(--peach); color:var(--brand); border-radius:999px; padding:.5em 1em;
  font-family:var(--f-display); text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; font-weight:600;
  transition:background .2s ease, color .2s ease;
}
.copy-q:hover{ background:var(--brand); color:#fff; }
.copy-q.copied{ background:#1f8a5b; color:#fff; }

/* downloads */
.dl-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.dl-card{
  display:flex; align-items:center; gap:16px; background:var(--white); border-radius:16px;
  padding:20px 22px; box-shadow:var(--sh-sm); border:1px solid var(--hairline);
  transition:transform .2s ease, box-shadow .2s ease;
}
.dl-card:hover{ transform:translateY(-3px); box-shadow:var(--sh-md); }
.dl-ico{ flex:none; width:46px; height:46px; border-radius:12px; background:var(--peach); display:grid; place-items:center; font-size:1.3rem; }
.dl-card .t{ display:block; font-weight:700; color:var(--ink); font-size:1rem; }
.dl-card .s{ display:block; font-size:.82rem; color:var(--ink-soft); }

/* contact */
.contact-band{ background:var(--hero-grad); }
.contact-card{
  text-align:center; color:#fff; max-width:760px; margin:0 auto;
}
.contact-card h2{ font-family:var(--f-display); text-transform:uppercase; font-weight:700; font-size:clamp(1.8rem,3.4vw,2.6rem); margin:0 0 14px; }
.contact-card .lead{ font-family:var(--f-logo); font-size:1.2rem; line-height:1.5; max-width:54ch; margin:0 auto 30px; color:#fff; opacity:.97; }
.contact-detail{
  display:inline-block; background:rgba(255,255,255,.14); backdrop-filter:blur(6px);
  border-radius:20px; padding:26px 40px; text-align:left;
}
.contact-detail .nm{ font-family:var(--f-display); text-transform:uppercase; letter-spacing:.06em; font-weight:600; font-size:1.2rem; }
.contact-detail .ro{ opacity:.9; margin-bottom:10px; }
.contact-detail a{ color:#fff; font-weight:600; }
.contact-detail a:hover{ text-decoration:underline; }

/* reveal */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* responsive */
@media (max-width:900px){
  .shots-grid{ grid-template-columns:repeat(2,1fr); }
  .dl-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
  .facts-grid{ grid-template-columns:1fr; }
  .shots-grid{ grid-template-columns:1fr; }
  .dl-grid{ grid-template-columns:1fr; }
  .press-hero{ padding:120px 0 60px; }
  .release-card{ padding:32px 24px; }
  .quote{ padding:26px 24px; }
  .quote p{ padding-right:0; }
  .copy-q{ position:static; display:inline-block; margin-bottom:14px; }
}