:root{
  --navy:#1B3654;
  --navy-deep:#14293F;
  --sky:#5DA9E9;
  --paper:#FAFAF8;
  --paper-line:#D8D3C6;
  --ink:#2A2A28;
  --ink-soft:#6b6a65;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'EB Garamond', serif;
  font-size:18px;
  line-height:1.6;
}
a{ color:inherit; text-decoration:none; }
.wrap{ max-width:820px; margin:0 auto; padding:0 24px; }

/* header / masthead */
.masthead{ border-bottom:2px solid var(--navy); padding:20px 0; }
.masthead-inner{ display:flex; justify-content:space-between; align-items:center; }
.brand-logo{ height:48px; width:auto; display:block; }
.mainnav a{
  margin-left:24px;
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--navy);
}
.mainnav a:hover{ color:var(--sky); }

/* footer */
.colophon{ border-top:1px solid var(--paper-line); margin-top:60px; padding:24px 0; }
.colophon-inner{ display:flex; justify-content:space-between; font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--ink-soft); letter-spacing:0.04em; }
.colophon-right{ text-align:right; }

/* shared elements */
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--sky);
  font-weight:500;
  margin-bottom:10px;
}
.btn{
  display:inline-block;
  margin-top:20px;
  padding:10px 20px;
  background:var(--navy);
  color:#fff;
  font-family:'IBM Plex Mono', monospace;
  font-size:13px;
  letter-spacing:0.05em;
  border-radius:2px;
}
.btn:hover{ background:var(--navy-deep); }

/* hero (homepage) */
.hero{ padding:60px 0 40px; border-bottom:1px solid var(--paper-line); }
.hero-title{ font-family:'Playfair Display', serif; font-weight:700; font-size:42px; color:var(--navy-deep); margin:0 0 14px; line-height:1.1; }
.hero-dek{ font-size:19px; color:var(--ink); max-width:90%; }
.hero-byline{ margin-top:20px; font-family:'IBM Plex Mono', monospace; font-size:13px; letter-spacing:0.06em; color:var(--navy); text-transform:uppercase; }
.hero-role{ font-style:italic; color:var(--ink-soft); font-size:15px; }

/* section title */
.section-title, .page-title{
  font-family:'Playfair Display', serif; font-weight:700; color:var(--navy-deep);
  font-size:28px; margin:44px 0 20px;
}

/* issue grid / cards */
.issue-grid{ display:flex; flex-wrap:wrap; gap:20px; margin-bottom:50px; }
.issue-card{ display:block; flex:1 1 calc(50% - 10px); min-width:260px; padding:18px; border:1px solid var(--paper-line); border-radius:3px; background:#fff; box-sizing:border-box; }
.issue-card:hover{ border-color:var(--sky); }
.issue-card-meta{ font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--ink-soft); text-transform:uppercase; margin-bottom:8px; }
.issue-card-title{ font-family:'Playfair Display', serif; font-weight:700; color:var(--navy-deep); font-size:19px; margin-bottom:6px; }
.issue-card-guest{ font-size:14px; color:var(--ink-soft); font-style:italic; }

/* single issue page */
.issue{ padding:40px 0 60px; }
.issue-meta-bar{
  display:flex; justify-content:space-between;
  border-bottom:2px solid var(--navy);
  padding-bottom:10px; margin-bottom:34px;
  font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--navy);
}
.issue-title{ font-family:'Playfair Display', serif; font-weight:700; font-size:38px; color:var(--navy-deep); margin:0 0 16px; line-height:1.1; }
.issue-dek{ font-size:19px; color:var(--ink); margin-bottom:36px; }

.editorial-block{ background:#fff; border:1px solid var(--paper-line); border-radius:3px; padding:26px 28px; margin-bottom:44px; }
.editorial-text{ font-size:17px; }
.editorial-sign{ text-align:right; font-style:italic; color:var(--navy); margin-top:14px; }

.guest-block{ display:flex; gap:28px; margin-bottom:44px; }
.guest-photo img{ width:170px; height:auto; border:1px solid var(--paper-line); display:block; }
.guest-name{ font-family:'Playfair Display', serif; font-weight:700; color:var(--navy-deep); font-size:26px; margin:6px 0; }
.guest-title{ font-style:italic; color:var(--ink-soft); margin-bottom:12px; }
.guest-intro{ font-size:17px; }

.conversation-label{
  font-family:'IBM Plex Mono', monospace; font-size:13px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--navy); font-weight:600;
  border-bottom:2px solid var(--navy);
  padding-bottom:8px; margin-bottom:24px;
}
.qa-row{
  display:flex; align-items:flex-start; gap:26px;
  padding:18px 0; border-bottom:1px solid var(--paper-line);
}
.qa-question{
  flex:0 0 220px; max-width:220px;
  font-family:'Georgia', serif; font-weight:700; font-style:italic; color:var(--navy-deep); font-size:17px;
  border-right:1px solid var(--paper-line); padding-right:20px;
}
.qa-answer{ flex:1 1 auto; font-size:17px; text-align:justify; }

.issue-footer{ margin-top:40px; padding-top:16px; border-top:1px solid var(--paper-line); font-style:italic; color:var(--ink-soft); font-size:14px; }

/* about page */
.page-body{ font-size:18px; }
.page-body p{ margin-bottom:18px; }

/* mobile */
@media (max-width:640px){
  .issue-card{ flex:1 1 100%; }
  .guest-block{ flex-direction:column; }
  .qa-row{ flex-direction:column; gap:8px; }
  .qa-question{ flex:1 1 auto; max-width:100%; border-right:none; border-bottom:1px solid var(--paper-line); padding-bottom:10px; padding-right:0; }
  .hero-title, .issue-title{ font-size:30px; }
}