/* ═══════════════════════════════════════════════════════════════════
   Y7 — Deep Field compositions, on top of y7-system.css + site.css.
   Adopted from the 9 September mock v2 (featured issue, collection list,
   light reader panel), re-set on the system: spacing on the --s ladder,
   type roles from the screen scale, one new token for teal on bone.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  /* Teal for text on bone surfaces: --signal (#1FB8A0) is ≈2:1 on bone; this is ≈4.7:1.
     Candidate for y7-system.css once agreed. */
  --signal-ink:#147A70;
}

/* ─── Rail: Intelligence group (06 · Weekly Briefs / Deep Field) ─── */
aside.rail nav .nav-group{display:flex;flex-direction:column;padding:10px 0 var(--s-3);border-top:1px solid var(--slate-700)}
aside.rail nav .nav-group .nav-parent{display:flex;align-items:baseline;gap:14px;color:var(--bone);font-size:13px}
aside.rail nav .nav-group .nav-parent .num{font-family:var(--mono);font-size:10px;color:var(--slate-500);letter-spacing:.08em;width:28px;flex-shrink:0}
aside.rail nav .nav-group .nav-children{display:flex;flex-direction:column;padding-left:42px;padding-top:6px}
aside.rail nav .nav-group .nav-children a{border-top:0;padding:6px 0;font-size:12px;line-height:1.4;color:var(--slate-300)}
aside.rail nav .nav-group .nav-children a.active{color:var(--signal)}
aside.rail nav .nav-group .nav-children a:hover{color:var(--signal-hot)}
aside.rail nav .nav-group + a{border-top:1px solid var(--slate-700)}
@media (max-width:760px){
  aside.rail nav .nav-group{flex-direction:row;align-items:baseline;gap:6px var(--s-3);padding:6px 0;border-top:0;flex-wrap:wrap}
  aside.rail nav .nav-group .nav-parent{font-size:12px;gap:6px}
  aside.rail nav .nav-group .nav-parent .num{width:auto}
  aside.rail nav .nav-group .nav-children{flex-direction:row;gap:var(--s-3);padding:0}
  aside.rail nav .nav-group .nav-children a{padding:0;white-space:nowrap}
}

/* ─── Page frame ───────────────────────────────────────────────── */
.df{padding:var(--s-8) var(--s-8) var(--s-9);max-width:1400px}
@media (max-width:1024px){.df{padding:var(--s-7) var(--s-5) var(--s-8)}}
.df-overline{display:flex;flex-wrap:wrap;align-items:center;gap:2px var(--s-4);min-width:0;font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--signal)}
.df-overline::after{content:"";height:1px;width:48px;background:var(--slate-700)}
.df-meta{font-family:var(--mono);font-size:11px;line-height:1.8;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-500)}
.df-meta .sep{margin:0 .4em}
.df-meta .tag{color:var(--signal)}
.nowrap{white-space:nowrap}

/* ─── Index: intro ─────────────────────────────────────────────── */
.df-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-6);padding-bottom:var(--s-6);border-bottom:1px solid var(--slate-700)}
.df-intro h1{font-family:var(--serif);font-weight:500;font-size:var(--type-screen-display);line-height:1;letter-spacing:-.035em;color:var(--bone);margin-top:var(--s-5)}
.df-intro p{font-size:var(--type-screen-lead);line-height:1.5;color:var(--slate-300);max-width:38ch;text-align:left;flex-shrink:0}
.df-intro p .l1{display:block;color:var(--bone)}
.df-intro p .l2{display:block;text-wrap:balance}
@media (max-width:1100px){.df-intro{display:block} .df-intro p{max-width:44ch;margin-top:var(--s-5)}}

/* ─── Index: featured issue ────────────────────────────────────── */
.df-feature{display:grid;grid-template-columns:minmax(200px,.8fr) minmax(0,1.3fr);gap:clamp(var(--s-6),5vw,var(--s-9));align-items:center;padding:var(--s-7) 0 var(--s-8)}
.df-cover{display:block;width:100%;height:auto;border:1px solid var(--slate-700);box-shadow:0 16px 36px rgba(0,0,0,.35)}
.df-feature-cover{display:block;max-width:285px;width:100%;margin:auto;transition:transform var(--d-3) var(--ease)}
.df-feature-cover:hover{transform:translateY(-4px)}
.df-feature h2{font-family:var(--serif);font-weight:500;font-size:var(--type-screen-h1);line-height:1.03;letter-spacing:-.025em;color:var(--bone);margin:var(--s-5) 0;text-wrap:balance}
.df-feature h2 a{color:inherit}
.df-feature h2 a:hover{color:var(--signal-hot)}
.df-standfirst{font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.6vw,24px);line-height:1.4;color:var(--slate-300);margin-bottom:var(--s-5)}
.df-feature .summary{font-size:15px;line-height:1.75;color:var(--slate-300);max-width:52ch}
.df-feature .df-meta{margin:var(--s-5) 0}
.df-actions{display:flex;gap:var(--s-5);align-items:center;flex-wrap:wrap}
.df-textlink{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-300);padding:var(--s-3) 0}
.df-textlink:hover{color:var(--signal)}
@media (max-width:1100px){.df-feature{gap:var(--s-6)} .df-feature-cover{max-width:245px}}
@media (max-width:760px){
  .df-feature{grid-template-columns:96px minmax(0,1fr);gap:var(--s-5);padding:var(--s-6) 0 var(--s-7);align-items:start}
  .df-feature-cover{margin:0}
  .df-feature h2{font-size:32px;margin-top:var(--s-3)}
  .df-feature .summary{grid-column:1/-1}
  .df-feature .df-overline::after{display:none}
}

/* ─── Index: the collection ────────────────────────────────────── */
.df-collection-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--slate-700);padding-bottom:var(--s-5)}
.df-collection-head h2{font-family:var(--serif);font-weight:500;font-size:var(--type-screen-h3);line-height:1.1;letter-spacing:-.015em}
.df-collection-head .df-meta{line-height:1}
.df-row{display:grid;grid-template-columns:var(--s-8) 1fr 140px 24px;gap:var(--s-6);align-items:center;padding:var(--s-5) 0;border-bottom:1px solid var(--slate-700);transition:background var(--d-2) var(--ease)}
.df-row:hover{background:rgba(31,184,160,.03)}
.df-row h3{font-family:var(--serif);font-weight:500;font-size:clamp(24px,2.2vw,30px);line-height:1.15;letter-spacing:-.012em;color:var(--bone);margin:var(--s-2) 0}
.df-row p{font-size:13px;line-height:1.6;color:var(--slate-300);max-width:60ch}
.df-row .arrow{font-family:var(--mono);color:var(--signal);font-size:24px;line-height:1}
.df-row:hover h3{color:var(--signal-hot)}
@media (max-width:1100px){.df-row{grid-template-columns:var(--s-8) 1fr 24px} .df-row > .df-meta.status{display:none} .df-row h3::after{content:" · " attr(data-status);font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--signal);vertical-align:middle}}
@media (max-width:760px){.df-row{grid-template-columns:56px 1fr 18px;gap:var(--s-4)} .df-row h3{font-size:24px} .df-row p{display:none}}

/* ─── Publisher line (index and issue pages) ───────────────────── */
.df-publisher{padding:var(--s-7) 0 0;display:flex;justify-content:space-between;gap:var(--s-5);align-items:flex-start}
.df-publisher strong{display:block;font-size:12px;font-weight:400;color:var(--slate-300)}
.df-publisher em{display:block;font-family:var(--serif);font-style:italic;font-size:20px;line-height:1.6;color:var(--signal);margin-top:var(--s-2)}
.df-publisher .stamp{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--slate-500)}
@media (max-width:760px){.df-publisher{display:block} .df-publisher .stamp{margin-top:var(--s-5)}}

/* ─── Issue page: dark hero ────────────────────────────────────── */
.df-hero{padding:var(--s-7) var(--s-8) var(--s-8);border-bottom:1px solid var(--slate-700)}
@media (max-width:1024px){.df-hero{padding:var(--s-6) var(--s-5) var(--s-7)}}
.df-back{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--slate-300);padding:var(--s-3) 0;margin-bottom:var(--s-6)}
.df-back:hover{color:var(--signal)}
.df-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:var(--s-7);align-items:center;max-width:var(--content-max)}
.df-hero h1{font-family:var(--serif);font-weight:500;font-size:var(--type-screen-h1);line-height:1.04;letter-spacing:-.025em;color:var(--bone);margin:var(--s-5) 0}
.df-hero .df-standfirst{margin-bottom:var(--s-5)}
@media (max-width:760px){.df-hero-grid{grid-template-columns:minmax(0,1fr) 82px;gap:var(--s-5)} .df-hero h1{font-size:38px} .df-hero .df-standfirst{font-size:20px} .df-hero .df-overline::after{display:none}}

/* ─── Issue page: light reader panel ───────────────────────────── */
.df-reader{background:var(--bone);color:var(--ink);padding:var(--s-7) var(--s-8) var(--s-8)}
@media (max-width:1024px){.df-reader{padding:var(--s-6) var(--s-5) var(--s-7)}}
.df-reader-inner{max-width:var(--content-max)}
.df-reader-nav{display:flex;gap:var(--s-5);border-bottom:1px solid var(--slate-300);padding-bottom:var(--s-4);margin-bottom:var(--s-7);font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--signal-ink)}
.df-reader-nav a:hover{text-decoration:underline}
.df-block{display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--s-6);margin-bottom:var(--s-7)}
.df-label{font-family:var(--mono);font-size:10px;line-height:1.7;letter-spacing:.12em;text-transform:uppercase;color:var(--signal-ink)}
.df-label span{display:block;font-family:var(--serif);font-size:30px;line-height:1;color:var(--slate-500);margin-bottom:var(--s-3);letter-spacing:0}
.df-body{font-size:17px;line-height:1.75;color:var(--ink)}
.df-body p{margin-bottom:var(--s-4)}
.df-body p.lede{font-family:var(--serif);font-style:normal;font-size:28px;line-height:1.4;color:var(--ink);border-left:2px solid var(--signal-ink);padding-left:var(--s-5)}
.df-body sup{font-size:10px;line-height:0;color:var(--signal-ink)}
.df-body sup a:hover{text-decoration:underline}
.df-reader table{width:100%;table-layout:fixed;border-collapse:collapse}
.df-reader td{vertical-align:top}
.df-stats td{padding:var(--s-4) var(--s-3) var(--s-5) 0;border-top:1px solid var(--slate-500)}
.df-stats .big{font-family:var(--serif);font-size:40px;line-height:1.15;color:var(--signal-ink);white-space:nowrap}
.df-stats .big.md{font-size:32px}
.df-stats .cap{font-size:12px;line-height:1.6;color:var(--slate-700);margin-top:var(--s-3)}
.df-watch td{padding:var(--s-4) 0;border-top:1px solid var(--slate-300);font-size:14px;line-height:1.6}
.df-watch .when{width:25%;padding-right:var(--s-4);font-family:var(--mono);font-size:11px;line-height:1.6;color:var(--signal-ink)}
.df-watch .what{width:75%}
@media (max-width:1100px){.df-block{grid-template-columns:110px minmax(0,1fr);gap:var(--s-5)}}
@media (max-width:760px){
  .df-block{grid-template-columns:1fr;gap:var(--s-4);margin-bottom:var(--s-6)}
  .df-label{display:flex;gap:var(--s-3);align-items:center}
  .df-label span{font-size:24px;margin:0}
  .df-reader-nav{gap:var(--s-4);font-size:10px;margin-bottom:var(--s-6)}
  .df-body{font-size:16px}
  .df-body p.lede{font-size:25px;padding-left:var(--s-4)}
  .df-stats .big{font-size:30px}
  .df-stats .cap{font-size:11px}
}

/* ─── Issue page: what the full issue holds (locked contents) ──── */
.df-locked{border:1px solid var(--slate-300);padding:var(--s-5) var(--s-6);display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--s-6);margin-bottom:var(--s-6)}
.df-locked .df-label{color:var(--slate-700)}
.df-locked ol{list-style:none;columns:2;column-gap:var(--s-6)}
.df-locked li{break-inside:avoid;padding:var(--s-2) 0;border-bottom:1px solid var(--bone-warm);font-family:var(--serif);font-size:17px;line-height:1.35;color:var(--slate-700)}
.df-locked li .n{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--slate-500);margin-right:var(--s-3);vertical-align:middle}
.df-locked li.part{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--signal-ink);border-bottom:0;padding-top:var(--s-4)}
.df-locked li.part:first-child{padding-top:0}
@media (max-width:1100px){.df-locked{grid-template-columns:110px minmax(0,1fr);gap:var(--s-5)}}
@media (max-width:760px){.df-locked{grid-template-columns:1fr;padding:var(--s-4) var(--s-5)} .df-locked ol{columns:1}}

/* ─── Issue page: request band ─────────────────────────────────── */
.df-request{background:var(--bone-warm);border-top:1px solid var(--slate-500);padding:var(--s-6) var(--s-7);display:grid;grid-template-columns:1.4fr 1fr;gap:var(--s-7);align-items:center;position:relative}
.df-request::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--signal)}
.df-request h2{font-family:var(--serif);font-weight:500;font-size:var(--type-screen-h4);line-height:1.15;letter-spacing:-.015em;color:var(--ink);margin-bottom:var(--s-3)}
.df-request p{font-size:14px;line-height:1.65;color:var(--slate-700);max-width:46ch}
.df-request .action{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3);justify-self:end}
.df-request .btn{border-color:var(--signal);color:var(--midnight);background:var(--signal)}
.df-request .btn:hover{background:var(--signal-hot);border-color:var(--signal-hot);color:var(--midnight)}
.df-request .note{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-700)}
@media (max-width:1100px){.df-request{grid-template-columns:1fr;gap:var(--s-5);padding:var(--s-5) var(--s-5)} .df-request .action{justify-self:start}}
.df-reader .df-publisher{border-top:1px solid var(--slate-300);margin-top:var(--s-7)}
.df-reader .df-publisher strong{color:var(--ink)}
.df-reader .df-publisher em{color:var(--signal-ink)}

/* ─── Cross-link block on intelligence.html ────────────────────── */
.df-intel .df-row{grid-template-columns:var(--s-8) 1fr 140px 24px}
.df-intel .all{margin-top:var(--s-5);display:flex;justify-content:flex-end}
