/* Yodel Mail — shared styles for content pages (privacy, terms) */
:root{
  --twilight:#14202e;
  --twilight-deep:#0d1620;
  --panel:#1b2b3c;
  --snow:#eef3f7;
  --mist:#8ba0b4;
  --mist-dim:#5f7488;
  --glacier:#5fd3d6;
  --glacier-deep:#2f9aa2;
  --hairline:rgba(139,160,180,0.16);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--twilight);
  color:var(--snow);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--glacier);text-decoration:none;}
a:hover{color:#7ce0e2;}
:focus-visible{outline:2px solid var(--glacier);outline-offset:3px;border-radius:2px;}

.wrap{max-width:1080px;margin:0 auto;padding:0 28px;}

/* ---- top bar ---- */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:26px 0;border-bottom:1px solid var(--hairline);
}
.brand{
  display:flex;align-items:center;gap:11px;
  font-family:"Space Grotesk",sans-serif;font-weight:700;
  font-size:1.15rem;letter-spacing:-0.01em;color:var(--snow);
}
.brand:hover{color:var(--snow);}
.brand-mark{width:26px;height:26px;flex:none;}
.brand-mark path{stroke:var(--glacier);stroke-width:1.4;fill:none;}
.brand-mark .tip{fill:var(--glacier);stroke:none;}
.topbar-note{
  font-family:"IBM Plex Mono",monospace;font-size:0.72rem;
  letter-spacing:0.08em;color:var(--mist);text-transform:uppercase;
}

/* ---- page header ---- */
.page-head{padding:72px 0 20px;}
.page-eyebrow{
  font-family:"IBM Plex Mono",monospace;font-size:0.72rem;
  letter-spacing:0.16em;text-transform:uppercase;color:var(--glacier);
  margin-bottom:20px;
}
.page-head h1{
  font-family:"Space Grotesk",sans-serif;font-weight:700;
  font-size:clamp(2.2rem,5.4vw,3.2rem);letter-spacing:-0.02em;
  line-height:1.04;margin-bottom:18px;
}
.page-updated{
  font-family:"IBM Plex Mono",monospace;font-size:0.76rem;
  color:var(--mist-dim);letter-spacing:0.04em;
}

/* ---- plain-language summary card ---- */
.summary{
  max-width:720px;margin:34px 0 8px;
  background:linear-gradient(160deg,var(--panel),var(--twilight-deep));
  border:1px solid var(--hairline);border-radius:14px;
  padding:26px 30px;
}
.summary .tl{
  font-family:"IBM Plex Mono",monospace;font-size:0.7rem;
  letter-spacing:0.16em;text-transform:uppercase;color:var(--glacier);
  margin-bottom:12px;
}
.summary p{color:var(--mist);font-size:1rem;}
.summary p strong{color:var(--snow);font-weight:600;}

/* ---- body content ---- */
.content{padding:44px 0 40px;max-width:720px;}
.section{
  padding:36px 0;border-top:1px solid var(--hairline);
}
.section:first-child{border-top:none;}
.section h2{
  font-family:"Space Grotesk",sans-serif;font-weight:500;
  font-size:1.32rem;letter-spacing:-0.01em;margin-bottom:14px;
  display:flex;align-items:baseline;gap:14px;
}
.section h2 .num{
  font-family:"IBM Plex Mono",monospace;font-size:0.82rem;
  color:var(--glacier);font-weight:400;flex:none;
}
.section p{color:var(--mist);margin-bottom:14px;}
.section p:last-child{margin-bottom:0;}
.section p strong{color:var(--snow);font-weight:600;}
.section ul{list-style:none;margin:4px 0 14px;padding:0;}
.section li{
  color:var(--mist);position:relative;padding-left:22px;margin-bottom:10px;
}
.section li::before{
  content:"";position:absolute;left:0;top:11px;
  width:8px;height:1.5px;background:var(--glacier);
}
.section li strong{color:var(--snow);font-weight:600;}

/* ---- note strip ---- */
.pagenote{
  max-width:720px;margin:8px 0 0;
  font-family:"IBM Plex Mono",monospace;font-size:0.74rem;
  color:var(--mist-dim);line-height:1.7;
}

/* ---- footer ---- */
footer{border-top:1px solid var(--hairline);padding:38px 0 56px;margin-top:36px;}
.foot-row{
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:18px;
}
.foot-brand{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:0.98rem;color:var(--snow);}
.foot-links{display:flex;gap:26px;font-size:0.88rem;}
.foot-links a{color:var(--mist);}
.foot-links a:hover{color:var(--snow);}
.foot-fine{
  font-family:"IBM Plex Mono",monospace;font-size:0.72rem;
  color:var(--mist-dim);margin-top:22px;
}

@media(max-width:760px){
  .page-head{padding:48px 0 12px;}
  .summary{padding:22px 22px;}
  .section h2{flex-direction:column;gap:6px;}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto;}
}