/* Atalk.TV flagship editorial refinement · v11
   Newsroom hierarchy, cleaner imagery, tighter mobile rhythm, accessible light-only presentation. */
:root{
  --at11-canvas:#fffaf4;
  --at11-paper:#fffefb;
  --at11-ink:#211b17;
  --at11-copy:#51463f;
  --at11-muted:#786b62;
  --at11-line:rgba(67,45,31,.13);
  --at11-accent:#a94732;
  --at11-accent-dark:#763126;
  --at11-soft:#f7eee6;
  --at11-radius:18px;
  --at11-shadow:0 18px 54px rgba(78,48,31,.08);
}

body{
  background:
    radial-gradient(circle at 12% 0%,rgba(226,164,139,.10),transparent 28rem),
    radial-gradient(circle at 88% 10%,rgba(204,188,231,.09),transparent 32rem),
    var(--at11-canvas)!important;
}

.site-header{
  background:rgba(255,254,251,.92)!important;
  border-bottom:1px solid var(--at11-line)!important;
}
.header-main{min-height:68px!important}
.brand-logo{width:116px!important;height:auto!important}
.desktop-nav{gap:clamp(12px,1.7vw,26px)!important}
.desktop-nav a{font-size:.92rem!important;font-weight:720!important;color:#574b43!important}
.desktop-nav a:hover,.desktop-nav a[aria-current="page"]{color:var(--at11-accent-dark)!important}
.header-action{background:rgba(255,255,255,.72)!important;border:1px solid var(--at11-line)!important}

.home-hero{
  padding:clamp(56px,7vw,94px) 0 clamp(42px,5vw,70px)!important;
  min-height:0!important;
  background:transparent!important;
  border-bottom:1px solid var(--at11-line)!important;
}
.home-hero .hero-grid{
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr)!important;
  gap:clamp(32px,6vw,92px)!important;
  align-items:end!important;
}
.home-hero h1{
  max-width:11.5ch!important;
  margin:.15em 0 0!important;
  font-size:clamp(3.15rem,6.4vw,6.7rem)!important;
  line-height:.92!important;
  letter-spacing:-.058em!important;
  color:var(--at11-ink)!important;
}
.home-hero h1 em{color:var(--at11-accent)!important;font-style:normal!important}
.hero-intro>p:first-child{
  max-width:36rem!important;
  margin:0!important;
  font-size:clamp(1.06rem,1.4vw,1.28rem)!important;
  line-height:1.62!important;
  color:var(--at11-copy)!important;
}
.hero-actions{margin-top:24px!important;display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:12px!important}
.button-primary{
  padding-inline:22px!important;
  background:var(--at11-accent)!important;
  border-color:var(--at11-accent)!important;
  color:white!important;
  box-shadow:0 12px 28px rgba(169,71,50,.18)!important;
}
.update-stamp{margin-top:22px!important;font-size:.82rem!important;color:var(--at11-muted)!important}
.signal-strip{background:rgba(255,255,255,.52)!important;border-block:1px solid var(--at11-line)!important}
.signal-inner{padding-block:13px!important;gap:18px!important}
.signal-name{font-weight:790!important;color:var(--at11-ink)!important}

.section{padding-block:clamp(42px,5vw,72px)!important}
.section-heading{margin-bottom:clamp(20px,2.6vw,32px)!important}
.section-heading h2{font-size:clamp(1.9rem,3vw,3rem)!important;letter-spacing:-.04em!important}
.section-heading>p{max-width:38rem!important;font-size:.94rem!important}

.trend-list{border-top:2px solid var(--at11-ink)!important}
.trend-row{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr) auto!important;
  gap:18px!important;
  padding:17px 4px!important;
}
.trend-title-line strong{font-size:clamp(1.02rem,1.35vw,1.2rem)!important}
.trend-main>p{max-width:72ch!important;margin-top:5px!important}

.top-story{
  display:grid!important;
  grid-template-columns:minmax(0,1.34fr) minmax(330px,.86fr)!important;
  gap:clamp(26px,4vw,54px)!important;
  align-items:start!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}
.top-story-media,.story-media{
  display:block!important;
  overflow:hidden!important;
  background:var(--at11-soft)!important;
  border-radius:var(--at11-radius)!important;
  border:1px solid var(--at11-line)!important;
}
.top-story-media{aspect-ratio:16/10!important}
.story-media{aspect-ratio:16/10!important}
.top-story-media img,.story-media img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  transform:scale(1.001);
  transition:transform .35s ease,filter .35s ease!important;
}
.top-story-media:hover img,.story-media:hover img{transform:scale(1.018)}
.top-story-copy{padding-top:4px!important}
.top-story-copy h3{font-size:clamp(2rem,3.25vw,3.45rem)!important;line-height:1!important;letter-spacing:-.042em!important}
.top-dek{font-size:clamp(1rem,1.3vw,1.14rem)!important;line-height:1.62!important;color:var(--at11-copy)!important}
.why-matters{margin-top:20px!important;padding:16px 0 0!important}

.latest-layout{gap:clamp(28px,4vw,54px)!important}
.story-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(22px,2.7vw,34px)!important}
.story-card{min-width:0!important}
.story-copy{padding-top:14px!important}
.story-copy h3{font-size:clamp(1.22rem,1.65vw,1.58rem)!important;line-height:1.12!important}
.story-copy>p{font-size:.95rem!important;line-height:1.58!important;color:var(--at11-copy)!important}
.compact-stack{border-top:2px solid var(--at11-ink)!important}
.compact-story{padding:17px 0!important}

.topic-grid{gap:0!important;border-top:2px solid var(--at11-ink)!important}
.topic-card{padding:20px 6px!important;border-bottom:1px solid var(--at11-line)!important}
.topic-card h3{font-size:1.25rem!important}

.article-hero{padding-top:clamp(46px,6vw,82px)!important}
.article-hero h1{max-width:16ch!important;font-size:clamp(2.7rem,5.25vw,5.25rem)!important}
.article-figure{
  margin-top:10px!important;
  overflow:hidden!important;
  border-radius:var(--at11-radius)!important;
  background:var(--at11-soft)!important;
}
.article-figure img{
  width:100%!important;
  height:auto!important;
  display:block!important;
  border-radius:var(--at11-radius)!important;
}
.article-layout{align-items:start!important}
.article-main{max-width:760px!important}
.article-section>p{color:var(--at11-copy)!important}
.article-aside{position:sticky!important;top:92px!important}
.aside-card{background:rgba(255,255,255,.54)!important;border-radius:14px!important;padding:18px!important}

.ecosystem-promo{
  background:linear-gradient(135deg,#6f3025 0%,#9f4935 55%,#c16c50 100%)!important;
  border-radius:24px!important;
  padding:clamp(28px,4vw,48px)!important;
  box-shadow:var(--at11-shadow)!important;
}
.watch-strip{background:rgba(247,238,230,.66)!important;border-top:1px solid var(--at11-line)!important}
.site-footer{background:rgba(255,254,251,.84)!important}

@media(max-width:980px){
  .home-hero .hero-grid,.top-story{grid-template-columns:1fr!important}
  .home-hero .hero-grid{align-items:start!important}
  .hero-intro{max-width:680px!important}
  .top-story-media{aspect-ratio:16/9!important}
  .story-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .article-aside{position:static!important}
}

@media(max-width:700px){
  .site-header{backdrop-filter:blur(14px) saturate(120%)!important}
  .header-main{min-height:62px!important}
  .brand-logo{width:102px!important}
  .home-hero{padding:42px 0 34px!important}
  .home-hero h1{max-width:10.5ch!important;font-size:clamp(2.75rem,14vw,4.45rem)!important;line-height:.95!important}
  .hero-actions{align-items:stretch!important}
  .hero-actions .button{width:100%!important;justify-content:center!important}
  .signal-inner{display:block!important}
  .signal-inner p{margin-top:6px!important}
  .section{padding-block:38px!important}
  .section-heading{align-items:start!important;gap:8px!important}
  .story-grid{grid-template-columns:1fr!important}
  .story-media,.top-story-media{aspect-ratio:16/10!important;border-radius:14px!important}
  .trend-row{grid-template-columns:34px minmax(0,1fr)!important;gap:11px!important;padding:15px 0!important}
  .trend-direction{display:none!important}
  .trend-facts{gap:6px 10px!important}
  .top-story-copy h3{font-size:clamp(1.85rem,9vw,2.65rem)!important}
  .article-hero h1{font-size:clamp(2.45rem,11.5vw,3.8rem)!important}
  .article-layout{padding-top:32px!important}
  .article-main{max-width:none!important}
  .ecosystem-promo{border-radius:18px!important;padding:26px 20px!important}
}

@media(prefers-reduced-motion:reduce){
  .top-story-media img,.story-media img{transition:none!important;transform:none!important}
}