/* Social stories: hub + moment pages. Builds on site.css tokens. */
.story-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.story-hero .copy{display:grid;gap:16px}
.story-hero .eyebrow a{color:inherit;text-decoration:none}
.story-hero .eyebrow a:hover{text-decoration:underline}
.story-hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
.story-hero figure{margin:0;display:grid;gap:10px}
.story-hero figcaption{font-size:.92rem;color:var(--ink-2)}
.story-hero figcaption b{color:var(--sea)}
.emoji-cover{aspect-ratio:16/10;border-radius:var(--radius);display:grid;place-items:center;font-size:clamp(5rem,12vw,8.5rem);background:radial-gradient(circle at 30% 25%,var(--c1,#FFE7A3),var(--c2,#FDEBDD) 70%);box-shadow:var(--shadow);position:relative;overflow:hidden}
.emoji-cover::after{content:"";position:absolute;inset:auto -10% -35% -10%;height:60%;background:radial-gradient(ellipse at center,rgba(255,255,255,.55),transparent 70%)}
.byline{font-size:.9rem;color:var(--ink-2)}
@media (max-width:860px){.story-hero{grid-template-columns:1fr;gap:24px}.story-hero figure{order:-1}}

.story{padding-top:8px}
.story-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;counter-reset:s}
.story-cards li{position:relative;background:var(--shell);border-radius:var(--radius-s);padding:22px 22px 24px;box-shadow:var(--shadow);display:grid;gap:10px;align-content:start;border:2px solid transparent;transition:border-color .2s var(--ease),transform .2s var(--ease)}
.story-cards li:hover{border-color:var(--sun);transform:translateY(-2px)}
.story-cards .n{position:absolute;top:14px;right:16px;font-family:var(--display);font-weight:800;font-size:.85rem;color:var(--sea-2);background:var(--glow-2);border-radius:999px;min-width:28px;height:28px;display:grid;place-items:center}
.story-cards .e{font-size:2.6rem;line-height:1}
.story-cards p{font-family:var(--display);font-weight:600;font-size:1.18rem;line-height:1.35;color:var(--sea);margin:0;text-wrap:pretty}
.story-cards li:last-child{background:var(--leaf-2)}
.calm-plan{margin-top:26px;background:var(--sea);color:#fff;border-radius:var(--radius);padding:24px 26px;display:grid;gap:14px}
.calm-plan h3{color:#fff;margin:0;font-size:1.25rem}
.calm-plan p{margin:0;color:rgba(255,255,255,.85)}
.calm-plan ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.calm-plan li{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:10px 16px;font-weight:700}
.print-note{display:none}

.cta-card{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;background:var(--coral-2);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}
.cta-card h2{margin:0}
.cta-card p{margin:0}
.cta-card .copy{display:grid;gap:12px}
.cta-card .price-line{font-weight:700;color:var(--sea)}
.cta-card img{width:180px;height:225px;object-fit:cover;border-radius:22px;box-shadow:var(--shadow)}
@media (max-width:700px){.cta-card{grid-template-columns:1fr}.cta-card img{display:none}}

.story-tips .checks li{margin-bottom:6px}
.story-faq details{max-width:860px}
.story-sources p{font-size:.9rem}

.story-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.story-card{background:var(--shell);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);display:grid;grid-template-rows:auto 1fr;border:2px solid transparent;transition:transform .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease)}
.story-card:hover{transform:translateY(-3px);border-color:var(--sun);box-shadow:var(--shadow-hover);color:var(--ink)}
.story-card .cover{aspect-ratio:16/9;display:grid;place-items:center;font-size:4.2rem;background:radial-gradient(circle at 30% 25%,var(--c1,#FFE7A3),var(--c2,#FDEBDD) 70%);position:relative}
.story-card .cover img{width:100%;height:100%;object-fit:cover;display:block}
.story-card .cover .tag{position:absolute;left:12px;top:12px;font-size:.75rem;font-weight:800;background:rgba(255,255,255,.92);color:var(--leaf);border-radius:999px;padding:4px 10px}
.story-card .body{padding:18px 20px 20px;display:grid;gap:8px;align-content:start}
.story-card h3{margin:0;font-size:1.2rem;color:var(--sea)}
.story-card p{margin:0;font-size:.95rem;color:var(--ink-2)}
.story-card .go{font-weight:800;color:var(--coral);font-size:.92rem;margin-top:4px}

@media print{
  header.top,footer,.skip,.story-hero figure,.story-hero .actions,.story-hero .byline,.cta,.story-cta,.story-tips,.story-faq,.story-related,.story-sources,script{display:none!important}
  body{background:#fff}
  .pagehead{padding:0 0 12px}
  .story-cards{grid-template-columns:1fr 1fr;gap:10px}
  .story-cards li{box-shadow:none;border:2px solid #ddd;break-inside:avoid;padding:14px}
  .story-cards p{font-size:15pt}
  .calm-plan{background:#fff;color:#13314B;border:2px solid #ddd;break-inside:avoid}
  .calm-plan h3,.calm-plan p{color:#13314B}
  .calm-plan li{border-color:#ccc;background:#fff}
  .print-note{display:block;margin-top:14px;font-size:10pt;color:#555}
}
@media (max-width:560px){
  .story-cards{gap:10px}
  .story-cards li{grid-template-columns:44px 1fr;align-items:center;column-gap:14px;padding:16px 46px 16px 16px}
  .story-cards .e{font-size:2rem}
  .story-cards p{font-size:1.06rem}
  .story-card .cover{aspect-ratio:16/7;font-size:3.2rem}
}