/* ── pkritiotis.io newsletter — matches the blog ─────────────── */
:root{
  --bg:#f4f5f6; --surface:#fbfcfc; --text:#141719; --muted:#5b6468;
  --line:#d9dee0; --accent:#5f6e78;
  --sans:"IBM Plex Sans","Avenir Next","Segoe UI",sans-serif;
  --serif:"Iowan Old Style","Spectral","Palatino Linotype","Book Antiqua","Times New Roman",serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#232525; --surface:#181d1f; --text:#edf2f3; --muted:#a8b2b5;
    --line:#30383b; --accent:#b3c0c6;
  }
}

html,body{
  margin:0; background:var(--bg) !important; color:var(--text);
  font-family:var(--sans); line-height:1.65; -webkit-font-smoothing:antialiased;
}

/* ── the ONE card (override base .wrap + .container) ── */
.container.wrap{
  width:min(460px,92vw); max-width:none; margin:8vh auto 2rem;
  background:var(--surface); border:1px solid var(--line);
  border-radius:12px; box-shadow:none;
  padding:2rem 1.9rem 2.1rem;
}

/* ── logo → typographic wordmark (Option A) ── */
.header{
  text-align:center; margin:0 0 1.6rem; padding-bottom:1.3rem;
  border-bottom:1px solid var(--line);
}
.header .logo img{ display:none; }              /* remove this line for Option B */
.header .logo a{
  text-decoration:none; font-family:var(--serif);
  font-size:1.35rem; letter-spacing:-0.01em; color:var(--text);
}
.header .logo a::after{ content:"Panayiotis Kritiotis"; }  /* drop this too for Option B */

/* ── section is NOT a card anymore — just content ── */
section{ background:none; border:0; border-radius:0; padding:0; margin:0; }
section > h2{
  font-family:var(--serif); font-weight:400; font-size:1.35rem;
  letter-spacing:-0.005em; margin:0 0 1.1rem;
}
section > p{ color:var(--text); font-size:0.95rem; margin:0 0 0.6rem; }

/* form fields (kill base border/shadow) */
.form p{ margin:0 0 1rem; }
.form label{ display:block; font-size:0.8rem; color:var(--muted); margin-bottom:0.3rem; }
.form input[type=email], .form input[type=text]{
  width:100%; padding:0.55rem 0.75rem; font:inherit; font-size:0.92rem;
  color:var(--text); background:var(--bg);
  border:1px solid var(--line); border-radius:8px; box-shadow:none;
}
.form input[type=email]:focus, .form input[type=text]:focus{
  outline:none; border-color:var(--accent);
}
.nonce{ display:none; }

/* lists — de-emphasised (single list is a formality) */
.lists{ list-style:none; margin:0 0 1.1rem; padding:0; }
.lists > h2{
  font-family:var(--sans); font-size:0.72rem; font-weight:600;
  text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); margin:0 0 0.45rem;
}
.lists li{ display:flex; align-items:center; gap:0.5rem; margin:0; }
.lists input[type=checkbox]{ accent-color:var(--accent); }
.lists label{ margin:0; color:var(--text); font-size:0.9rem; }

/* button (override base background + hover) */
.button{
  min-width:0; padding:0.55rem 1.2rem; font:inherit; font-size:0.92rem;
  color:var(--bg); background:var(--accent);
  border:1px solid var(--accent); border-radius:8px; cursor:pointer;
}
.button:hover{ background:var(--accent); filter:brightness(1.08); color:var(--bg); }

/* links (override base blue + dark hover) */
.right{ margin:0.9rem 0 0 !important; }
.container.wrap a, .right a, section a{ color:var(--accent); }
.container.wrap a:hover, footer.container a:hover{ color:var(--accent); filter:brightness(1.1); }

/* footer */
footer.container{
  width:min(460px,92vw); max-width:none; margin:1.4rem auto 2rem;
  text-align:center; font-size:0.75rem; color:var(--muted);
}
footer.container a{ color:var(--muted); }