/* daily.css — Styles for /daily reader pages (drop + archive).
   Uses the same design tokens as theme.css. Mobile-first. */

/* ── BODY ────────────────────────────────────────────── */
.daily-body { background:var(--obsidian); color:var(--warm-cream); font-family:var(--font-body); font-weight:300; line-height:1.6; min-height:100vh; }

/* ── NAV ─────────────────────────────────────────────── */
.daily-nav { display:flex; align-items:center; justify-content:space-between; padding:1.25rem 1.5rem; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:100; background:rgba(10,10,10,0.92); backdrop-filter:blur(8px); }
.daily-nav-logo { font-family:var(--font-display); font-weight:900; font-size:1rem; letter-spacing:0.05em; color:var(--warm-cream); text-decoration:none; }
.daily-nav-links { display:flex; gap:1.5rem; }
.daily-nav-links a { font-size:0.75rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--warm-cream); text-decoration:none; opacity:0.5; transition:opacity 0.2s; }
.daily-nav-links a:hover,.daily-nav-links a.active { opacity:1; }

/* ── SHARED TAG ──────────────────────────────────────── */
.drop-label { font-size:0.65rem; font-weight:500; letter-spacing:0.25em; text-transform:uppercase; color:var(--rust); margin-bottom:0.75rem; }

/* ── HERO DROP ───────────────────────────────────────── */
.daily-hero { padding:3rem 1.5rem 4rem; border-bottom:1px solid var(--border); position:relative; overflow:hidden; }
.daily-hero::before { content:''; position:absolute; inset:0; pointer-events:none; opacity:0.07; }
.daily-hero-japan::before  { background:radial-gradient(ellipse at 20% 50%,rgba(60,80,180,1) 0%,transparent 70%); }
.daily-hero-italy::before  { background:radial-gradient(ellipse at 20% 50%,rgba(180,130,40,1) 0%,transparent 70%); }
.daily-hero-korea::before  { background:radial-gradient(ellipse at 20% 50%,rgba(40,80,160,1) 0%,transparent 70%); }
.daily-hero-paris::before  { background:radial-gradient(ellipse at 20% 50%,rgba(200,170,120,1) 0%,transparent 70%); }
.daily-hero-global::before { background:radial-gradient(ellipse at 20% 50%,rgba(184,92,56,1) 0%,transparent 70%); }
.daily-hero-inner { position:relative; max-width:900px; margin:0 auto; }
.drop-meta-row { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; margin-bottom:1.5rem; }
.drop-day { font-size:0.7rem; font-weight:500; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted); }
.hero-layout { display:grid; grid-template-columns:1fr; gap:2.5rem; }
@media (min-width:768px) { .hero-layout { grid-template-columns:1fr minmax(0,360px); align-items:start; } }
.daily-hero-title { font-family:var(--font-display); font-weight:900; font-size:clamp(2.2rem,8vw,5rem); line-height:1.0; letter-spacing:-0.02em; color:var(--warm-cream); margin-bottom:1.5rem; }
.hero-thesis { font-size:1.05rem; font-style:italic; color:var(--cream-mid); line-height:1.6; margin-bottom:1.25rem; border-left:2px solid var(--rust); padding-left:1rem; }
.hero-desc { font-size:0.95rem; font-weight:300; color:var(--text-muted); line-height:1.65; margin-bottom:2rem; }
.hero-caption { background:rgba(245,237,224,0.04); border:1px solid var(--border); border-radius:4px; padding:1.25rem 1.5rem; }
.hero-caption-label { font-size:0.6rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--rust); margin-bottom:0.75rem; }
.hero-caption-text { font-size:0.85rem; font-weight:300; color:var(--warm-cream); line-height:1.65; white-space:pre-line; }
.hero-visual { display:flex; flex-direction:column; gap:0.5rem; }
.hero-moodboard { width:100%; border-radius:4px; object-fit:cover; aspect-ratio:4/5; display:block; border:1px solid var(--border); }
.hero-visual-label { font-size:0.6rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted); }

/* ── WEEK STRIP ──────────────────────────────────────── */
.week-strip { padding:3rem 1.5rem; border-bottom:1px solid var(--border); }
.week-strip-inner { max-width:900px; margin:0 auto; }
.week-strip-header { margin-bottom:2rem; }
.week-strip-title { font-family:var(--font-display); font-weight:700; font-size:1.4rem; margin-top:0.25rem; }
.week-strip-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); }
@media (min-width:640px) { .week-strip-grid { grid-template-columns:repeat(3,1fr); } }
@media (min-width:900px) { .week-strip-grid { grid-template-columns:repeat(5,1fr); } }
.strip-card { background:var(--obsidian); padding:1.5rem 1.25rem; text-decoration:none; color:var(--warm-cream); display:flex; flex-direction:column; gap:0.35rem; transition:background 0.2s; cursor:pointer; min-height:160px; position:relative; }
.strip-card:hover { background:var(--charcoal); }
.strip-card-active { background:var(--charcoal); box-shadow:inset 0 2px 0 var(--rust); }
.strip-card-empty { opacity:0.35; cursor:default; }
.strip-card-flag { font-size:1.5rem; line-height:1; margin-bottom:0.25rem; }
.strip-card-day { font-size:0.6rem; font-weight:500; letter-spacing:0.15em; text-transform:uppercase; color:var(--rust); }
.strip-card-title { font-family:var(--font-display); font-weight:700; font-size:0.9rem; line-height:1.3; color:var(--warm-cream); }
.strip-card-country { font-size:0.7rem; color:var(--text-muted); margin-top:auto; padding-top:0.5rem; }

/* ── WEEKEND SCREEN ──────────────────────────────────── */
.daily-weekend { min-height:60vh; display:flex; align-items:center; justify-content:center; padding:4rem 1.5rem; border-bottom:1px solid var(--border); }
.daily-weekend-inner { text-align:center; max-width:560px; }
.countdown-display { font-family:var(--font-display); font-weight:900; font-size:clamp(2.5rem,10vw,6rem); color:var(--warm-cream); line-height:1.0; margin:0.5rem 0 1rem; }
.weekend-sub { font-size:1rem; color:var(--text-muted); margin-bottom:3rem; }
.weekend-last { border-top:1px solid var(--border); padding-top:2rem; text-align:left; }
.weekend-last-label { font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--rust); margin-bottom:0.5rem; }
.weekend-last-title { font-family:var(--font-display); font-size:1.4rem; font-weight:700; margin-bottom:0.25rem; }
.weekend-last-country { font-size:0.8rem; color:var(--text-muted); }

/* ── ARCHIVE CTA (on /daily) ─────────────────────────── */
.archive-cta { padding:3rem 1.5rem; border-bottom:1px solid var(--border); }
.archive-cta-inner { max-width:900px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.archive-cta-text p { font-size:0.9rem; color:var(--text-muted); margin-top:0.25rem; }
.archive-link { font-size:0.8rem; font-weight:500; letter-spacing:0.08em; text-transform:uppercase; color:var(--warm-cream); text-decoration:none; border:1px solid var(--border); padding:0.75rem 1.5rem; transition:border-color 0.2s,color 0.2s; white-space:nowrap; }
.archive-link:hover { border-color:var(--rust); color:var(--rust); }

/* ── ARCHIVE PAGE ────────────────────────────────────── */
.archive-header { padding:4rem 1.5rem 2.5rem; border-bottom:1px solid var(--border); background:var(--charcoal); }
.archive-header-inner { max-width:900px; margin:0 auto; }
.archive-title { font-family:var(--font-display); font-weight:900; font-size:clamp(2.5rem,8vw,5rem); line-height:1.0; letter-spacing:-0.02em; margin:0.5rem 0 1rem; }
.archive-sub { font-size:0.9rem; color:var(--text-muted); }
.filter-bar { border-bottom:1px solid var(--border); overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.filter-bar::-webkit-scrollbar { display:none; }
.filter-bar-inner { display:flex; gap:0; max-width:900px; margin:0 auto; }
.filter-pill { font-size:0.7rem; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--warm-cream); text-decoration:none; padding:1rem 1.25rem; border-right:1px solid var(--border); opacity:0.5; transition:opacity 0.2s,background 0.2s; white-space:nowrap; }
.filter-pill:hover { opacity:1; background:var(--charcoal); }
.filter-pill.active { opacity:1; color:var(--rust); }
.archive-grid-section { padding:2.5rem 1.5rem; }
.archive-grid { max-width:900px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:1px; background:var(--border); }
@media (min-width:480px) { .archive-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:768px) { .archive-grid { grid-template-columns:repeat(3,1fr); } }
.archive-card { background:var(--obsidian); padding:1.75rem 1.5rem; display:flex; flex-direction:column; gap:0.5rem; transition:background 0.2s; position:relative; overflow:hidden; }
.archive-card:hover { background:var(--charcoal); }
.archive-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; opacity:0.6; }
.archive-card-japan::before  { background:rgba(60,80,180,0.8); }
.archive-card-italy::before  { background:rgba(180,130,40,0.8); }
.archive-card-korea::before  { background:rgba(40,80,160,0.8); }
.archive-card-paris::before  { background:rgba(200,170,120,0.8); }
.archive-card-global::before { background:var(--rust); }
.archive-card-top { display:flex; align-items:center; gap:0.5rem; margin-bottom:0.25rem; }
.archive-card-flag { font-size:1.1rem; }
.archive-card-country { font-size:0.6rem; font-weight:500; letter-spacing:0.15em; text-transform:uppercase; color:var(--rust); }
.archive-card-week { font-size:0.6rem; color:var(--text-muted); margin-left:auto; letter-spacing:0.1em; }
.archive-card-title { font-family:var(--font-display); font-weight:700; font-size:1.05rem; line-height:1.25; color:var(--warm-cream); }
.archive-card-desc { font-size:0.8rem; color:var(--text-muted); line-height:1.55; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.archive-card-thesis { display:none; }
.archive-card-meta { font-size:0.65rem; color:var(--text-muted); letter-spacing:0.1em; text-transform:uppercase; margin-top:auto; padding-top:0.75rem; }
.archive-empty { grid-column:1/-1; padding:4rem 2rem; text-align:center; color:var(--text-muted); background:var(--obsidian); }
.pagination { padding:2rem 1.5rem; border-top:1px solid var(--border); }
.pagination-inner { max-width:900px; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:2rem; }
.page-btn { font-size:0.75rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--warm-cream); text-decoration:none; padding:0.6rem 1.25rem; border:1px solid var(--border); transition:border-color 0.2s; }
.page-btn:hover { border-color:var(--rust); color:var(--rust); }
.page-btn-disabled { opacity:0.3; cursor:default; }
.page-info { font-size:0.7rem; color:var(--text-muted); letter-spacing:0.1em; }
.back-to-daily { padding:1.5rem 1.5rem 2rem; max-width:900px; margin:0 auto; }
.back-to-daily a { font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); text-decoration:none; transition:color 0.2s; }
.back-to-daily a:hover { color:var(--warm-cream); }

/* ── FOOTER ──────────────────────────────────────────── */
.daily-footer { padding:2rem 1.5rem; border-top:1px solid var(--border); }
.daily-footer-inner { max-width:900px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0.75rem; }
.footer-logo-link { font-family:var(--font-display); font-weight:900; font-size:0.9rem; letter-spacing:0.05em; color:var(--warm-cream); text-decoration:none; }
.daily-footer-tag { font-size:0.65rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted); }