/* ================================================================
   THE PET PAGE — shared site shell, set in the Mars design language:
   Mars blue, bright teal, big heavy sans. The newspaper artifacts on
   each page (the sheets, renders and template example) keep their own
   serif styles — this shell never reaches inside them.
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700;800;900&display=swap');

:root{
  --s-ink:#0000A0; --s-soft:#50506B; --s-paper:#ffffff; --s-warm:#F2F4FC;
  --s-rule:#E3E6F2; --s-rule2:#C8CDE8; --s-mars:#0000A0; --s-adopt:#E5482F; --s-go:#0000A0;
  --s-teal:#1BE0C6; --s-text:#16161E;
  --s-serif:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --s-ui:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
}

/* ---------------- nav ---------------- */
.site-nav{
  background:#fff;color:var(--s-text);font-family:var(--s-ui);
  display:flex;align-items:center;gap:.2rem;flex-wrap:wrap;
  padding:.7rem 1.1rem;position:relative;z-index:500;
  border-bottom:1px solid var(--s-rule);
}
.site-nav a.site-brand{
  font-weight:900;font-size:1rem;letter-spacing:-.01em;color:var(--s-mars);text-decoration:none;
  margin-right:1.1rem;white-space:nowrap;
}
.site-nav a.site-brand span{opacity:.45;font-weight:500}
.site-nav a.site-link{
  color:var(--s-text);text-decoration:none;font-size:.8rem;font-weight:600;
  padding:.38rem .66rem;border-radius:6px;white-space:nowrap;
}
.site-nav a.site-link:hover{background:var(--s-warm);color:var(--s-mars)}
.site-nav a.site-link[aria-current="page"]{background:var(--s-mars);color:#fff}
.site-nav .site-sp{flex:1}
.site-nav .site-cta{
  background:var(--s-mars);color:#fff;text-decoration:none;font-size:.8rem;font-weight:700;
  padding:.44rem .95rem;border-radius:4px;white-space:nowrap;
}
.site-nav .site-cta:hover{background:#000078}

/* ---------------- footer ---------------- */
.site-foot{
  background:var(--s-mars);color:#fff;font-family:var(--s-ui);font-size:.8rem;line-height:1.7;
  padding:2.6rem 1.5rem;margin-top:0;
}
.site-foot .in{max-width:60rem;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
.site-foot h4{font-size:.66rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--s-teal);margin:0 0 .6rem}
.site-foot a{color:var(--s-teal);text-decoration:none;font-weight:600}
.site-foot a:hover{text-decoration:underline}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin-bottom:.3rem}
.site-foot .legal{
  max-width:60rem;margin:2rem auto 0;padding-top:1.3rem;
  border-top:1px solid rgba(255,255,255,.22);font-size:.74rem;color:rgba(255,255,255,.75);
}
@media (max-width:720px){ .site-foot .in{grid-template-columns:1fr;gap:1.4rem} }

/* ---------------- home page ---------------- */
body.site-home{
  margin:0;background:var(--s-warm);color:var(--s-text);
  font-family:var(--s-ui);font-size:17px;line-height:1.62;
}
.site-wrap{max-width:60rem;margin:0 auto;background:var(--s-paper);
  box-shadow:0 2px 40px rgba(10,20,80,.08)}
.site-pad{padding:0 3rem}

.site-hero{
  background:var(--s-ink);color:#fff;padding:4.4rem 3rem 3.4rem;text-align:center;
}
.site-hero .eyebrow{font-family:var(--s-ui);font-size:.68rem;font-weight:800;letter-spacing:.22em;
  text-transform:uppercase;color:var(--s-teal);opacity:1;margin-bottom:1.2rem}
.site-hero h1{font-family:var(--s-ui);font-weight:900;font-size:4.4rem;line-height:.98;
  letter-spacing:-.03em;margin:0 0 1.2rem}
.site-hero p{font-size:1.18rem;line-height:1.55;font-weight:500;opacity:.94;margin:0 auto;max-width:36rem}
.site-hero .lock{
  margin-top:2.4rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.25);
  font-family:var(--s-ui);font-size:.76rem;font-weight:600;letter-spacing:.05em;opacity:.75;
}

.site-h2{font-family:var(--s-ui);font-weight:800;font-size:2.1rem;line-height:1.1;
  color:var(--s-mars);letter-spacing:-.02em;margin:3.2rem 0 1rem}
.site-lead{font-size:1.14rem;font-weight:500}
.site-rule{border:0;border-top:1px solid var(--s-rule);margin:2.8rem 0}

.site-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.1rem;margin:1.6rem 0 2rem}
.site-card{
  border:1px solid var(--s-rule);border-radius:12px;padding:1.5rem 1.6rem;background:#fff;
  text-decoration:none;color:inherit;display:block;transition:.16s;
}
.site-card:hover{border-color:var(--s-mars);box-shadow:0 10px 30px rgba(0,0,160,.12);transform:translateY(-2px)}
.site-card .tag{font-family:var(--s-ui);font-size:.62rem;font-weight:800;letter-spacing:.15em;
  text-transform:uppercase;color:#0AA88E;display:block;margin-bottom:.5rem}
.site-card h3{font-family:var(--s-ui);font-weight:800;font-size:1.32rem;color:var(--s-mars);
  margin:0 0 .45rem;line-height:1.12;letter-spacing:-.015em}
.site-card p{margin:0;font-size:.94rem;line-height:1.5;color:var(--s-soft)}
.site-card .go{display:inline-block;margin-top:.8rem;font-family:var(--s-ui);font-size:.8rem;
  font-weight:800;color:var(--s-mars)}
@media (max-width:720px){
  .site-cards{grid-template-columns:1fr}
  .site-hero{padding:2.8rem 1.4rem 2.3rem}
  .site-hero h1{font-size:2.7rem}
  .site-pad{padding:0 1.4rem}
}

.site-callout{
  background:var(--s-teal);color:#00281F;padding:1.5rem 1.7rem;
  margin:1.8rem 0;border-radius:12px;border-left:0;
}
.site-callout b{font-family:var(--s-ui);font-size:.68rem;font-weight:900;letter-spacing:.14em;
  text-transform:uppercase;color:var(--s-mars);display:block;margin-bottom:.4rem}
.site-callout p{margin:0;font-size:1rem;font-weight:600;line-height:1.55}

.site-figs{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:1.8rem 0 2rem;text-align:center}
.site-fig b{display:block;font-family:var(--s-ui);font-weight:900;font-size:2.4rem;line-height:1;color:var(--s-mars)}
.site-fig span{display:block;font-family:var(--s-ui);font-size:.72rem;font-weight:600;color:var(--s-soft);
  margin-top:.4rem;line-height:1.4}
@media (max-width:720px){ .site-figs{grid-template-columns:repeat(2,1fr)} }

.site-nav .paperlink{opacity:.7;font-style:normal;font-weight:700}
.site-nav .paperlink:hover{opacity:1}

/* ---------------- Mars-theme page furniture overrides ----------------
   Page stylesheets load after this file, so the hero headlines of every
   section page are pinned here. The newspaper artifacts inside pages
   (.sheet, .pp-*, the issue renders) use their own local font variables
   and are untouched. */
.site-hero h1,.n-hero h1,.t-hero h1,.a-hero h1,.i-hero h1,.hero h1{
  font-family:var(--s-ui)!important;font-weight:900!important;letter-spacing:-.028em!important;
}
.n-hero .eyebrow,.t-hero .eyebrow,.a-hero .eyebrow,.i-hero .eyebrow,.hero .eyebrow{
  color:var(--s-teal)!important;opacity:1!important;font-weight:800!important;
}
.tier h2,.iss h2{
  font-family:var(--s-ui)!important;font-weight:800!important;
  color:var(--s-mars)!important;letter-spacing:-.02em!important;
}