/* Youtopia shared site styles */

:root{
  --ink:#1c2e2e;
  --paper:#ffffff;
  --paper-2:#ffffff;
  --moss:#b0f3ec;
  --moss-rgb:176,243,236;
  --teal-text:#0e7d7d;
  --rust:#a8532b;
  --rust-rgb:168,83,43;
  --line: rgba(28,46,46,0.15);
  --line-strong: rgba(28,46,46,0.4);
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:880px;margin:0 auto;padding:0 28px;}
a{color:var(--rust);}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--teal-text);
}
.dateline{
  display:flex;justify-content:space-between;align-items:center;
  padding:6px 0;
  border-bottom:1px solid var(--line);
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--ink);opacity:0.75;
}
header.masthead{padding:30px 0 0;text-align:center;}
.back-link{
  display:inline-block;margin-bottom:14px;
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.06em;
  text-transform:uppercase;text-decoration:none;color:var(--teal-text);
}
h1.name{
  font-family:'Fraunces',serif;
  font-weight:700;
  font-size:clamp(38px,7vw,64px);
  letter-spacing:-0.01em;
  margin:0;
  line-height:1;
}
.byline{
  margin:12px 0 0;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-weight:500;
  font-size:clamp(15px,2vw,19px);
  color:var(--rust);
}
.rule-double{border:none;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink);height:4px;margin:24px 0 0;}

section{padding:44px 0;}
section.tight{padding-top:0;}

.pullquote{
  font-family:'Fraunces',serif;font-weight:500;font-size:clamp(19px,2.6vw,24px);
  line-height:1.5;text-align:center;max-width:680px;margin:0 auto;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:36px 0;
}
.note{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.04em;
  text-align:center;opacity:0.65;margin:14px auto 0;max-width:680px;
}

h2.section-h{
  font-family:'Fraunces',serif;font-weight:500;font-size:clamp(22px,3vw,28px);margin:0 0 20px;
}
h3.sub-h{
  font-family:'Fraunces',serif;font-weight:500;font-size:18px;margin:28px 0 10px;
}
p{font-size:15px;line-height:1.7;opacity:0.92;margin:0 0 16px;}
ul.body-list{margin:0 0 16px;padding-left:20px;}
ul.body-list li{font-size:15px;line-height:1.7;opacity:0.92;margin-bottom:8px;}

.credit-block{
  margin-top:20px;padding:16px 20px;background:none;border-left:2px solid var(--teal-text);
  font-size:13px;line-height:1.6;opacity:0.85;
}

.facts-band{background:var(--moss);margin:0 -28px;padding:52px 28px;}
.facts-band .wrap{max-width:880px;}
.facts-band .eyebrow{color:var(--teal-text);opacity:1;}
.facts-band h2.section-h{color:var(--ink);}
.facts-band p{color:var(--ink);}
.facts-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 40px;margin-top:24px;}
.fact{border-top:1px solid var(--teal-text);padding-top:14px;}
.fact .num{font-family:'Fraunces',serif;font-weight:600;font-size:30px;display:block;color:var(--teal-text);}
.fact .desc{font-size:13.5px;line-height:1.5;opacity:0.85;margin-top:4px;color:var(--ink);}
.facts-source{font-family:'IBM Plex Mono',monospace;font-size:10.5px;opacity:0.6;margin-top:28px;line-height:1.6;color:var(--ink);}

.map-table{width:100%;border-collapse:collapse;margin-top:8px;font-size:13.5px;}
.map-table th{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.06em;text-transform:uppercase;
  text-align:left;color:var(--teal-text);border-bottom:1px solid var(--line-strong);padding:8px 10px;
}
.map-table td{padding:8px 10px;border-bottom:1px solid var(--line);}
.map-table tr:hover td{background:var(--moss);}

.nav-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:var(--line-strong);border:1px solid var(--line-strong);margin-top:8px;
}
.nav-item{
  background:var(--paper-2);padding:16px 18px;text-decoration:none;color:var(--ink);
  display:flex;flex-direction:column;gap:4px;transition:background 0.15s;
}
.nav-item:hover{background:var(--moss);}
.nav-item .nav-title{font-family:'Fraunces',serif;font-weight:500;font-size:15.5px;}
.nav-item .nav-num{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--teal-text);letter-spacing:0.04em;}

.chapter-num{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--teal-text);margin-bottom:8px;display:block;
}
.chapter-img{
  background:var(--paper-2);border:1px solid var(--line);
  box-shadow:0 2px 10px rgba(var(--moss-rgb),0.35);
  overflow:hidden;
}
.chapter-img img{width:100%;height:auto;display:block;}

.brand-mark{
  display:block;max-width:520px;margin:28px auto 0;
  border:1px solid var(--line);box-shadow:0 2px 10px rgba(var(--moss-rgb),0.35);
}
.brand-mark img{width:100%;height:auto;display:block;}

.cta{
  display:inline-block;margin-top:22px;
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:0.06em;
  text-transform:uppercase;color:var(--rust);text-decoration:none;border-bottom:1px solid var(--rust);
  padding-bottom:2px;
}

footer{padding:44px 0 60px;text-align:center;}
footer .name-small{font-family:'Fraunces',serif;font-size:20px;margin-bottom:6px;}
footer .contact{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.06em;color:var(--ink);opacity:0.7;}
footer .contact a{color:var(--rust);text-decoration:none;}

@media(max-width:760px){
  .facts-grid{grid-template-columns:1fr 1fr;}
  .nav-grid{grid-template-columns:1fr;}
  .facts-band{margin:0 -20px;padding:48px 20px;}
}