/* site.css: shared by every page.
   Loaded before each page's own <style>; a page can override anything here.
   Edit here and every page in the family follows. */

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:'Titillium Web', sans-serif;color:var(--dark);background:var(--paper);line-height:1.6;}
a{color:inherit;}
h1,h2,h3,h4{font-family:'Libre Baskerville', serif;font-weight:700;margin:0 0 .4em 0;color:var(--dark);}
.brand-stripe{height:5px;width:100%;background:linear-gradient(90deg, var(--blue) 0%, var(--sunset-2) 55%, var(--sunset-1) 100%);}

.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--green-dark);color:var(--white);}
.btn-primary:hover{background:var(--green-hover);}
/* PRESS LOGOS - the real People / Daily Mail marks, recolored to one brand
     tint (drawn as CSS masks, so the color is just the background) so they
     read as credibility without bringing People's cyan into the palette. */
.press-logos{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.press-logo.pp{width:66px;height:26px;-webkit-mask-image:url(/images/press/people.png);mask-image:url(/images/press/people.png);}
.press-logo.dm{width:100px;height:21px;-webkit-mask-image:url(/images/press/dailymail.png);mask-image:url(/images/press/dailymail.png);}
.spotlight-card{
  display:flex;flex-direction:column;background:var(--white);border-radius:4px;
  border:1px solid var(--line);border-top:3px solid transparent;overflow:hidden;
  text-decoration:none;color:inherit;box-shadow:0 1px 3px rgba(21,34,48,0.05);
  transition:border-top-color .15s ease, transform .12s ease, box-shadow .12s ease;
  }
.spotlight-card:hover{border-top-color:var(--green-dark);transform:translateY(-3px);box-shadow:0 10px 24px rgba(21,34,48,0.12);}

.spotlight-dates{font-size:10.5px;font-weight:700;color:var(--green-dark);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;}
.spotlight-title{font-family:'Libre Baskerville',serif;font-size:14px;font-weight:700;line-height:1.35;color:var(--dark);}
/* --- COMPARISON: OPTION 1 — photo-overlay editorial card --- */
.spotlight-card.style-photo{
  position:relative;aspect-ratio:4/3;border-radius:4px;overflow:hidden;outline:none;
  background:linear-gradient(135deg, var(--dark-soft) 0%, var(--blue) 55%, var(--green-dark) 100%);
  text-decoration:none;color:var(--white);box-shadow:0 4px 14px rgba(21,34,48,0.15);
  transition:transform .18s ease, box-shadow .18s ease;
  }
.spotlight-card.style-photo:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(21,34,48,0.28);}
.spotlight-card.style-photo .sp-caption{position:absolute;top:12px;left:14px;font-size:9px;color:rgba(255,255,255,0.55);letter-spacing:.03em;}

.spotlight-card.style-photo .sp-overlay{position:absolute;left:0;right:0;bottom:0;padding:20px 18px 18px;background:linear-gradient(180deg, rgba(21,34,48,0) 0%, rgba(13,22,32,0.88) 68%);}
.spotlight-card.style-photo .spotlight-dates{color:var(--gold);margin-bottom:7px;font-size:11.5px;}
.spotlight-card.style-photo .spotlight-title{color:var(--white);font-size:19px;line-height:1.25;}
.eyebrow{font-size:14px;}
h1,h2,h3{line-height:1.25;}
