/* 7 Days to Air: homepage paper cut-out ACCENTS.
 * Loaded by landing.html only, after site.css. The base page is the plain site.css
 * look, light mode only. Paper is used for three spotlight moments: the hero
 * opportunity board, the mint "We reuse what we learn" card and the offer card
 * (plus one tape strip on the brief). Straight edges, no outlines, mint + near-black.
 * Reference: intake-promo-paper v2 (sheet #F5F3EE, mint #6EE7B7, ink #14181F). */
html.paper:root {
  color-scheme: light;
  --bg: #F6F8F7; --panel: #FFFFFF; --line: #D9DEE4; --ink: #14181F; --muted: #5B6475;
  --accent: #0F9F6E; --accent-strong: #0B7A55; --on-accent-strong: #FFFFFF; --edge: #7D8696;
  --sheet2: #EFEDE7; --mint: #6EE7B7; --mint-pale: #D4F7E8; --mint-ink: #05281B;
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .08 0 0 0 0 .1 0 0 0 0 .1 0 0 0 .55 -.2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  --grain-soft: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .08 0 0 0 0 .1 0 0 0 0 .1 0 0 0 .55 -.2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E");
  --sh: 0 1px 1px rgba(20,24,31,.10), 0 3px 5px rgba(20,24,31,.07), 0 14px 26px -8px rgba(20,24,31,.16);
  --sh-sm: 0 1px 1px rgba(20,24,31,.10), 0 6px 12px -4px rgba(20,24,31,.14);
}
html.paper body { overflow-x: clip; isolation: isolate; }
html.paper main { overflow-x: clip; }

.paper .tape { position: absolute; z-index: 2; left: 1.5rem; top: -.8rem; width: 5.5rem; height: 1.6rem; background: var(--mint); border-radius: 2px; transform: rotate(-3.5deg);
  box-shadow: 0 1px 2px rgba(20,24,31,.22); }
.paper .tape::after { content: ""; position: absolute; inset: 0; background: var(--grain); background-size: 160px; opacity: .4; mix-blend-mode: multiply; }

/* primary button on brand mint with dark ink (AA); everything else stays site.css */
.paper .btn-primary { background: var(--mint); color: var(--mint-ink); }
.paper .btn-primary:hover { filter: none; background: #86F0C6; }

/* spotlight 1: hero opportunity board, with a stacked sheet behind it */
.board-wrap { position: relative; z-index: 0; padding: 0 .9rem .9rem 0; margin-bottom: 1.25rem; }
.board-wrap::before { content: ""; position: absolute; z-index: -1; inset: 1.1rem 0 0 1.1rem; background: var(--sheet2) var(--grain-soft); background-size: 160px; border-radius: 14px; box-shadow: var(--sh-sm); }
.board { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.board li { position: relative; display: flex; align-items: center; gap: .75rem; padding: .7rem .85rem; background: #fff var(--grain); background-size: 160px; border-radius: 10px; box-shadow: var(--sh-sm); font-weight: 700; font-size: 1.0625rem; letter-spacing: -.01em; }
.board li:nth-child(2) { margin-left: 1.25rem; }
.board li:nth-child(3) { margin-left: .5rem; }
.board .ic { display: grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--ink); color: var(--mint); }
.board .ic svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.board .score { margin-left: auto; display: grid; justify-items: center; padding: .2rem .8rem; background: var(--ink); color: var(--mint); border-radius: 999px; font-size: 1.125rem; line-height: 1.05; }
.board .score small { font-size: .5625rem; letter-spacing: .14em; font-weight: 700; }
.board .rank { position: absolute; z-index: 2; top: -.8rem; left: -.4rem; transform: rotate(-3.5deg); padding: .15rem .6rem; background: var(--mint); color: var(--mint-ink); font-size: .8125rem; border-radius: 2px; box-shadow: 0 1px 2px rgba(20,24,31,.2); }
.paper .brief { position: relative; }
.paper .brief .tape { left: 1.5rem; right: auto; }

/* spotlight 2: mint card */
.paper .catch-lead { position: relative; max-width: none; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); background: var(--mint) var(--grain); background-size: 160px; color: var(--mint-ink); border-radius: 14px; box-shadow: var(--sh); align-self: start; }
.paper .catch-lead::before { content: ""; position: absolute; z-index: -1; inset: .7rem -.7rem -.7rem .7rem; background: var(--mint-pale); border-radius: 14px; }
@media (min-width: 56rem) { .paper .catch { align-items: start; } }

/* spotlight 3: offer card, one tape strip, black ROI chip */
.paper .offer { position: relative; padding-top: 2rem; border: 0; border-radius: 14px; background: #fff var(--grain); background-size: 160px; box-shadow: var(--sh); }
.paper .offer::before { content: ""; position: absolute; z-index: -1; inset: .8rem -.8rem -.8rem .8rem; background: var(--sheet2) var(--grain-soft); background-size: 160px; border-radius: 14px; box-shadow: var(--sh-sm); }
.paper .offer-roi { display: inline-block; padding: .55rem 1rem; border: 0; background: var(--ink); color: var(--mint); border-radius: 10px; }

@media (prefers-reduced-motion: no-preference) {
  .paper .board li { animation: paper-drop .5s cubic-bezier(.22,1,.36,1) both; }
  .paper .board li:nth-child(2) { animation-delay: .1s; }
  .paper .board li:nth-child(3) { animation-delay: .2s; }
}
@keyframes paper-drop { from { opacity: 0; transform: translateY(-10px); } }