:root {
  --paper:#fbfaf5;
  --ink:#151316;
  --muted:#6b6259;
  --line:rgba(21,19,22,.16);
  --soft-line:rgba(21,19,22,.08);
  --hot:#ff1493;
  --violet:#6c2cff;
}

* { box-sizing:border-box; }

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

a { color:inherit; }

.page,
.site {
  max-width:1220px;
  margin:0 auto;
  min-height:100vh;
  background:var(--paper);
}

.topline {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  align-items:center;
  padding:16px 28px 12px;
  border-bottom:1px solid var(--line);
  color:#62584f;
  font-size:11px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.topline--single { grid-template-columns:1fr; }
.topline div:last-child { text-align:right; }
.topline--single div:last-child { text-align:center; }

.masthead {
  padding:34px 28px 30px;
  border-bottom:1px solid var(--line);
}

.article-masthead {
  display:grid;
  justify-items:center;
  padding:22px 28px 20px;
  border-bottom:1px solid var(--line);
}

.masthead-logo,
.logo {
  display:block;
  height:auto;
  filter:drop-shadow(0 10px 22px rgba(111,40,255,.18));
}

.masthead-logo {
  width:min(300px,64vw);
  margin:0 auto;
  filter:drop-shadow(0 16px 30px rgba(111,40,255,.25));
}

.logo { width:180px; }

.nav {
  display:flex;
  justify-content:center;
  gap:clamp(20px,4vw,56px);
  padding:12px 28px 11px;
  border-bottom:1px solid var(--soft-line);
  font-size:12px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.nav a {
  text-align:center;
  text-decoration:none;
}

.nav li {
  list-style:none;
}

.nav .menu-item {
  margin:0;
}

.front-intro {
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:44px;
  align-items:end;
  padding:30px 28px 24px;
}

.front-kicker,
.meta,
.reel-label,
.article-kicker {
  color:var(--hot);
  font-size:11px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.front-title {
  margin:10px 0 0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(42px,6.4vw,82px);
  font-weight:400;
  line-height:.96;
}

.front-note {
  margin:0;
  max-width:660px;
  color:#4c453e;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(22px,2.6vw,34px);
  line-height:1.16;
}

.feature-grid {
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:34px;
  padding:0 28px 44px;
  border-bottom:1px solid var(--line);
}

.article-card,
.story-card,
.meme-sidebar-image,
.reel-item {
  color:inherit;
  text-decoration:none;
}

.art-crop {
  display:block;
  width:100%;
  min-height:420px;
  background-size:cover;
  background-position:center;
}

.lead-card .art-crop,
.secondary-card .art-crop { min-height:560px; }

.meta {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}

.article-card h2 {
  margin:14px 0 0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(34px,4.8vw,62px);
  font-weight:400;
  line-height:.98;
  letter-spacing:0;
}

.secondary-card h2 {
  font-size:clamp(30px,3.4vw,44px);
  line-height:1;
}

.article-card p {
  margin:12px 0 0;
  max-width:760px;
  color:var(--muted);
  font-size:16px;
  line-height:1.5;
}

.secondary-card p { font-size:14px; }

.more-features {
  padding:32px 28px 38px;
  border-bottom:1px solid var(--line);
}

.section-heading {
  display:grid;
  grid-template-columns:.65fr 1fr;
  gap:28px;
  align-items:end;
  margin-bottom:22px;
}

.section-heading h2 {
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:42px;
  font-weight:400;
  line-height:.98;
}

.section-heading p {
  margin:0;
  max-width:600px;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}

.story-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}

.more-features-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,260px);
  gap:34px;
  align-items:start;
}

.more-features-layout .story-grid {
  grid-template-columns:repeat(2,1fr);
}

.story-crop {
  display:block;
  height:250px;
  margin-bottom:13px;
  background-size:cover;
  background-position:center;
}

.story-card h3,
.reel-item h3,
.newsletter h3,
.archive h3 {
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
}

.story-card h3 {
  margin:8px 0 0;
  font-size:26px;
  line-height:1.04;
}

.story-card p,
.reel-item p,
.newsletter p,
.archive p {
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.story-card p,
.reel-item p {
  margin:8px 0 0;
}

.homepage-rail {
  display:grid;
  gap:28px;
}

.homepage-rail section {
  padding-bottom:26px;
  border-bottom:1px solid var(--line);
}

.homepage-rail section:last-child {
  padding-bottom:0;
  border-bottom:0;
}

.homepage-rail h2 {
  margin:0 0 12px;
  color:var(--hot);
  font-size:11px;
  font-weight:700;
  letter-spacing:.12em;
  line-height:1.2;
  text-transform:uppercase;
}

.meme-sidebar-image {
  display:block;
}

.meme-crop {
  display:block;
  width:100%;
  aspect-ratio:4 / 5;
  background-size:cover;
  background-position:center;
}

.rail-reel a {
  display:grid;
  grid-template-columns:74px 1fr;
  gap:12px;
  align-items:center;
  color:inherit;
  text-decoration:none;
}

.rail-reel-thumb {
  display:block;
  width:100%;
  aspect-ratio:9 / 16;
  background-size:cover;
  background-position:center;
}

.rail-reel span:last-child {
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  font-size:18px;
  font-weight:400;
  line-height:1.05;
}

.rail-rabbit-holes ul {
  display:grid;
  gap:9px;
  margin:0;
  padding:0;
}

.rail-rabbit-holes li {
  list-style:none;
}

.rail-rabbit-holes a {
  color:var(--ink);
  font-size:13px;
  font-weight:700;
  letter-spacing:.05em;
  text-decoration:none;
  text-transform:uppercase;
}

.reels-row {
  display:grid;
  grid-template-columns:.8fr 1fr 1fr;
  gap:28px;
  padding:32px 28px;
  border-bottom:1px solid var(--line);
}

.reels-heading {
  font-family:Georgia,"Times New Roman",serif;
  font-size:34px;
  font-weight:400;
  line-height:1;
}

.reel-item {
  display:grid;
  grid-template-columns:86px 1fr;
  gap:15px;
  align-items:center;
}

.reel-thumb {
  position:relative;
  aspect-ratio:9/16;
  overflow:hidden;
  background-size:cover;
}

.reel-thumb::after {
  content:"";
  position:absolute;
  inset:auto auto 9px 9px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:rgba(251,250,245,.94);
}

.reel-thumb::before {
  content:"";
  position:absolute;
  z-index:1;
  left:19px;
  bottom:16px;
  border-left:8px solid var(--ink);
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
}

.reel-item h3 {
  margin:6px 0 0;
  font-size:25px;
  line-height:1.05;
}

.bottom-strip {
  display:grid;
  grid-template-columns:1fr 1.1fr 1fr;
  min-height:170px;
}

.bottom-strip > div {
  padding:24px 28px;
  border-right:1px solid var(--line);
}

.bottom-strip > div:last-child { border-right:0; }

.quote {
  font-family:Georgia,"Times New Roman",serif;
  font-size:25px;
  line-height:1.08;
}

.newsletter h3,
.archive h3 {
  margin:0 0 10px;
  font-size:28px;
  line-height:1;
}

.newsletter p,
.archive p { margin:0; }

.article-hero { padding:42px 28px 30px; }

.article-kicker { margin-bottom:16px; }

.article-hero h1 {
  max-width:1120px;
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(50px,7.3vw,100px);
  font-weight:400;
  line-height:.96;
  letter-spacing:0;
}

.dek {
  max-width:760px;
  margin:22px 0 0;
  color:#4c453e;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(23px,2.7vw,36px);
  line-height:1.16;
}

.byline-row {
  margin-top:26px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:20px;
  align-items:end;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.byline-row strong { color:var(--ink); }

.hero-art { margin-top:36px; }

.hero-art img {
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}

.caption {
  margin-top:10px;
  max-width:860px;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

.article-layout {
  display:grid;
  grid-template-columns:minmax(0,740px) 320px;
  gap:74px;
  padding:34px 28px 64px;
  align-items:start;
}

.article-layout--single {
  grid-template-columns:minmax(0,760px);
  justify-content:center;
}

.page-id-57 .article-layout--single {
  grid-template-columns:minmax(0,920px);
}

.page .page-hero {
  display:grid;
  justify-content:center;
}

.page .page-hero h1 {
  width:min(1120px, 100%);
}

.page-id-57 .page-hero h1 {
  width:min(920px, 100%);
}

.article-body {
  font-family:Georgia,"Times New Roman",serif;
  font-size:21px;
  line-height:1.58;
}

.article-body p { margin:0 0 24px; }

.page-id-57 .article-body > p {
  text-align:justify;
}

.page-id-57 .about-standfirst {
  max-width:760px;
  margin:0 0 22px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:29px;
  font-weight:700;
  line-height:1.15;
  text-align:left;
}

.article-body figure {
  margin:34px 0 38px;
}

.article-body figure img {
  display:block;
  width:100%;
  height:auto;
}

.article-body figcaption {
  margin-top:9px;
  color:var(--muted);
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  font-size:12px;
  line-height:1.45;
}

.article-body .about-art-pair {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr);
  gap:24px;
  align-items:end;
  width:min(980px, calc(100vw - 56px));
  margin:36px 0 44px;
}

.article-body .about-art-pair figure {
  margin:0;
}

.article-body .about-art-pair figure:nth-child(2) {
  max-width:330px;
}

.article-body .about-art-wide {
  width:min(920px, calc(100vw - 56px));
  margin:36px 0 44px;
}

.article-body .about-art-small {
  float:right;
  width:min(280px, 38%);
  margin:6px 0 14px 28px;
}

.article-body h2 {
  margin:48px 0 15px;
  font-size:32px;
  font-weight:400;
  line-height:1.12;
  letter-spacing:0;
}

.pullquote,
.article-body blockquote,
.article-body .wp-block-pullquote {
  margin:44px 0;
  padding:28px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  color:#241f1c;
  font-size:33px;
  line-height:1.12;
}

.article-body blockquote p,
.article-body .wp-block-pullquote p {
  margin:0;
  font-size:inherit;
  line-height:inherit;
}

.inline-detail {
  width:min(100%, var(--detail-width, 100%));
  margin:34px 0 38px;
}

.inline-detail.align-center {
  margin-left:auto;
  margin-right:auto;
}

.inline-detail.align-right {
  margin-left:auto;
}

.inline-detail__crop {
  width:100%;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
}

.inline-detail figcaption {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  margin-top:10px;
  color:var(--muted);
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  font-size:12px;
  line-height:1.45;
}

.inline-detail figcaption span {
  color:var(--ink);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.sidebar {
  position:sticky;
  top:22px;
  display:grid;
  gap:28px;
}

.artist-card,
.sources,
.reel-card,
.sidebar-widget {
  padding-top:18px;
  border-top:1px solid var(--line);
}

.artist-card h3,
.sources h3,
.reel-card h3,
.sidebar-widget h3,
.widget-title {
  margin:0 0 12px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:26px;
  font-weight:400;
  line-height:1.12;
}

.artist-card p,
.sources li,
.reel-card p,
.sidebar-widget,
.sidebar-widget p,
.sidebar-widget li {
  color:#514a43;
  font-size:14px;
  line-height:1.52;
}

.artist-card__image {
  max-width:320px;
  margin:0 0 14px;
}

.artist-card__image img {
  display:block;
  width:100%;
  height:auto;
}

.artist-card__image figcaption {
  margin-top:8px;
  color:var(--muted);
  font-size:11px;
  line-height:1.4;
}

.reel-frame {
  position:relative;
  aspect-ratio:9/16;
  overflow:hidden;
  background-size:cover;
  background-position:center;
}

.reel-frame::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(21,19,22,0) 46%,rgba(21,19,22,.72));
}

.play-mark {
  position:absolute;
  left:16px;
  bottom:16px;
  z-index:1;
  width:42px;
  height:42px;
  border-radius:50%;
  background:rgba(251,250,245,.94);
}

.play-mark::after {
  content:"";
  position:absolute;
  left:17px;
  top:12px;
  border-left:14px solid var(--ink);
  border-top:9px solid transparent;
  border-bottom:9px solid transparent;
}

.reel-card p { margin:0 0 14px; }

.reel-link {
  display:inline-flex;
  align-items:center;
  min-height:34px;
  color:var(--ink);
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
  text-decoration:none;
  text-transform:uppercase;
  border-bottom:1px solid rgba(255,20,147,.45);
}

.sources ul {
  margin:0;
  padding-left:18px;
}

.sources a {
  color:var(--ink);
  text-decoration-color:rgba(255,20,147,.45);
  text-underline-offset:3px;
}

.sidebar-widget ul {
  margin:0;
  padding-left:18px;
}

.sidebar-widget a {
  color:var(--ink);
  text-decoration-color:rgba(255,20,147,.45);
  text-underline-offset:3px;
}

.site-footer {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:28px;
  padding:28px;
  border-top:1px solid var(--line);
}

.footer-widget {
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}

.footer-widget h3 {
  margin:0 0 10px;
  color:var(--ink);
  font-family:Georgia,"Times New Roman",serif;
  font-size:26px;
  font-weight:400;
}

.comments-prompt {
  margin-top:54px;
  padding:26px 0 0;
  border-top:1px solid var(--line);
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
}

.comments-prompt h2 {
  margin:0 0 8px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:28px;
  font-weight:400;
  line-height:1.12;
}

.comments-prompt p {
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.5;
}

@media (max-width:920px) {
  .topline,
  .home .topline,
  .front-intro,
  .feature-grid,
  .section-heading,
  .reels-row,
  .more-features-layout,
  .bottom-strip,
  .article-layout,
  .byline-row {
    grid-template-columns:1fr;
  }

  .topline div:last-child { text-align:left; }
  .logo { width:150px; }
  .nav {
    justify-content:center;
    flex-wrap:wrap;
    gap:14px 24px;
  }
  .art-crop,
  .lead-card .art-crop,
  .secondary-card .art-crop { min-height:420px; }
  .story-grid,
  .more-features-layout .story-grid { grid-template-columns:1fr 1fr; }
  .homepage-rail {
    max-width:520px;
    grid-template-columns:1fr 1fr;
    gap:26px;
  }
  .rail-rabbit-holes {
    grid-column:1 / -1;
  }
  .bottom-strip > div {
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .article-layout { gap:34px; }
  .sidebar { position:static; }
  .reel-frame { max-width:360px; }
}

@media (max-width:640px) {
  .story-grid { grid-template-columns:1fr; }
  .story-crop { height:330px; }
  .article-body .about-art-pair { grid-template-columns:1fr; }
  .article-body .about-art-small {
    float:none;
    width:100%;
    margin:34px 0 38px;
  }
  .inline-detail {
    width:100%;
    margin-left:0;
    margin-right:0;
  }
  .inline-detail figcaption { grid-template-columns:1fr; }
}
