/* NewsNow Tamil – bülten ızgarası (NYT) + kayıt sonrası karşılama penceresi (WaPo) */

/* ---------- hızlı kanallar: WhatsApp + bildirim ---------- */
.channels{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:var(--s-4);margin-bottom:var(--s-7)}
.channel{display:flex;align-items:center;gap:var(--s-4);padding:var(--s-4) var(--s-5);border:1px solid var(--c-line);border-radius:6px}
.channel.is-wa{border-color:#bfe3cd;background:var(--c-wa-bg)}
.channel-icon{width:52px;height:52px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:#fff;color:var(--c-ink);border:1px solid var(--c-line)}
.channel.is-wa .channel-icon{color:var(--c-wa);border-color:#bfe3cd}
.channel-icon svg{width:26px;height:26px}
.channel-body{flex:1;min-width:0}
.channel-body h2{font-family:var(--f-head);font-size:var(--fs-lg);font-weight:800;line-height:1.4}
.channel-body p{font-size:var(--fs-sm);color:var(--c-ink-2);line-height:1.6;margin-top:2px}
.btn-wa{background:var(--c-wa);color:#fff;min-height:var(--tap);padding:0 18px}
.btn-wa:hover{background:#0a5f32;color:#fff}

/* ---------- bülten kartları ---------- */
.nl-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-4)}
.nl-head h2{font-family:var(--f-head);font-size:var(--fs-2xl);font-weight:800}
.nl-head p{font:400 var(--fs-md)/1.5 var(--f-ui);color:var(--c-muted)}
.nl-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-5);padding-bottom:var(--s-7)}
.nl-badge:empty{display:none}
.nl-card{position:relative;display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-5) var(--s-4) var(--s-5);border:1px solid #d9d9d9;background:#fff;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.nl-card.is-featured{grid-column:span 2}
.nl-card.is-on{border-color:var(--c-ink);box-shadow:inset 0 0 0 1px var(--c-ink)}
.nl-art{width:92px;height:92px;flex:none;margin-bottom:var(--s-3)}
.nl-card.is-featured .nl-art{width:96px;height:96px}
.nl-art svg{width:100%;height:100%;display:block}
.nl-badge{align-self:flex-start;background:var(--c-brand);color:#fff;font:800 10.5px/1 var(--f-ui);letter-spacing:.08em;padding:5px 7px;border-radius:3px;text-transform:uppercase}
.nl-freq{font:500 11px/1.2 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;color:#5a5a5a}
.nl-card h3{font-family:var(--f-head);font-weight:800;font-size:var(--fs-lg);line-height:1.4}
.nl-card.is-featured h3{font-size:30px;line-height:1.3}
.nl-card p{font:400 var(--fs-md)/1.55 var(--f-body);color:var(--c-ink-2)}
.nl-card.is-featured p{font-size:var(--fs-lg)}

/* + / ✓ düğmesi */
.add-btn{position:absolute;top:var(--s-4);right:var(--s-4);width:var(--tap);height:var(--tap);border-radius:50%;border:2px solid var(--c-ink);background:#fff;color:var(--c-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--t-fast),color var(--t-fast),transform var(--t-fast)}
.add-btn:hover{background:var(--c-bg-soft)}
.add-btn:active{transform:scale(.94)}
.add-btn svg{width:20px;height:20px}
.add-btn .i-on{display:none}
.add-btn[aria-pressed=true]{background:var(--c-ink);color:#fff}
.add-btn[aria-pressed=true] .i-on{display:block}
.add-btn[aria-pressed=true] .i-off{display:none}

/* seçince alttan çıkan kayıt çubuğu */
.nl-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--c-dark);color:#fff;transform:translateY(110%);transition:transform var(--t-base) ease-out;box-shadow:0 -8px 24px rgba(0,0,0,.18)}
.nl-bar.is-open{transform:none}
.nl-bar form{max-width:var(--container);margin:0 auto;padding:var(--s-4) var(--gutter);display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-3)}
.nl-count{font:700 var(--fs-md)/1.4 var(--f-ui);margin-right:auto}
.nl-bar input[type=email]{min-height:var(--tap);min-width:0;flex:1 1 240px;max-width:360px;padding:0 var(--s-4);border:0;border-radius:var(--radius);font:400 var(--fs-base) var(--f-body)}
.nl-bar input[type=email]:focus{outline:3px solid #fff;outline-offset:1px}
.nl-bar .btn{min-height:var(--tap);background:#fff;color:var(--c-ink);padding:0 20px}
.nl-bar .btn:hover{background:var(--c-brand);color:#fff}
.nl-bar .fine{flex-basis:100%;color:#bdbdbd;font-size:12px}
.nl-bar .fine a{color:#fff;text-decoration:underline}
.nl-bar-msg{flex-basis:100%;font:600 var(--fs-sm)/1.5 var(--f-ui)}
.nl-bar-msg.is-error{color:#ff8a8d}
.nl-bar-msg.is-ok{color:#7ee2a8}

/* ---------- karşılama penceresi (kayıt sonrası, 3 adım) ---------- */
.onboard{border:0;padding:0;width:min(1000px,calc(100% - 32px));max-height:calc(100dvh - 32px);border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.35);overflow:hidden}
.onboard[open]{display:flex;flex-direction:column}
.onboard::backdrop{background:rgba(18,18,18,.7)}
.ob-top{position:relative;display:flex;align-items:center;justify-content:center;min-height:56px;border-bottom:1px solid var(--c-line);font:500 var(--fs-md)/1 var(--f-ui)}
.ob-top .icon-btn{position:absolute;right:var(--s-2);top:50%;transform:translateY(-50%);border:0}
.ob-progress{position:absolute;left:0;bottom:-1px;height:3px;background:var(--c-brand);transition:width var(--t-base)}
.ob-body{flex:1;overflow:auto;padding:var(--s-5) var(--s-5) var(--s-4);text-align:center}
.ob-step[hidden]{display:none}
.ob-title{font-family:var(--f-head);font-weight:800;font-size:clamp(21px,1rem + 1.4vw,30px);line-height:1.4}
.ob-sub{font:400 var(--fs-md)/1.5 var(--f-ui);color:var(--c-ink-2);margin-top:var(--s-2)}
.ob-times{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4);margin:var(--s-5) auto 0;max-width:900px}
.ob-time{border:1px solid #d0d0d0;display:flex;flex-direction:column;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.ob-time.is-on{border-color:var(--c-ink);box-shadow:inset 0 0 0 1px var(--c-ink)}
.ob-time>svg{width:100%;height:auto;aspect-ratio:16 / 10;display:block}
.ob-time-body{padding:var(--s-4) var(--s-3) var(--s-5);display:flex;flex-direction:column;align-items:center;gap:var(--s-3)}
.ob-time h3{font:800 var(--fs-lg)/1.3 var(--f-ui)}
.ob-time small{display:block;font:400 var(--fs-sm)/1.3 var(--f-body);color:var(--c-muted);margin-top:4px}
.select-btn{display:inline-flex;align-items:center;gap:var(--s-2);min-height:var(--tap);padding:0 22px;border:1px solid #cfcfcf;border-radius:999px;background:#fff;font:700 var(--fs-md)/1 var(--f-ui);cursor:pointer;transition:background var(--t-fast),color var(--t-fast),border-color var(--t-fast)}
.select-btn:hover{border-color:var(--c-ink)}
.select-btn svg{width:16px;height:16px}
.select-btn .i-on{display:none}
.select-btn[aria-pressed=true]{background:var(--c-ink);color:#fff;border-color:var(--c-ink)}
.select-btn[aria-pressed=true] .i-on{display:block}
.select-btn[aria-pressed=true] .i-off{display:none}
.ob-topics{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-2);margin:var(--s-5) auto 0;max-width:760px}
.ob-topics .select-btn{font-family:var(--f-body);font-weight:700;padding:0 18px}
.ob-topics-h{font:700 11px/1 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted);margin-top:var(--s-5)}
.ob-nl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4);margin:var(--s-5) auto 0;max-width:900px;text-align:left}
.ob-nl .nl-card{padding:var(--s-4)}
.ob-nl .nl-art{width:64px;height:64px}
.ob-done{max-width:520px;margin:var(--s-5) auto 0}
.ob-done-icon{width:72px;height:72px;margin:0 auto var(--s-4);border-radius:50%;background:var(--c-wa-bg);color:var(--c-wa);display:flex;align-items:center;justify-content:center}
.ob-done-icon svg{width:36px;height:36px}
.ob-foot{display:flex;flex-direction:column;align-items:center;gap:var(--s-3);padding:var(--s-4) var(--s-5) var(--s-5);border-top:1px solid var(--c-line)}
.ob-next{width:min(400px,100%);min-height:52px;border:0;border-radius:999px;background:var(--c-ink);color:#fff;font:700 var(--fs-base)/1 var(--f-ui);cursor:pointer;transition:background var(--t-fast)}
.ob-next:hover{background:var(--c-brand)}
.ob-next:disabled{background:#eeeeee;color:#9a9a9a;cursor:not-allowed}
.ob-skip{border:0;background:none;font:400 var(--fs-md)/1.4 var(--f-ui);text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:var(--c-ink);min-height:32px}

/* ---------- duyarlı ---------- */
@media (max-width:1180px){
  .nl-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:900px){
  .nl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .nl-grid{grid-template-columns:minmax(0,1fr);gap:var(--s-3)}
  .nl-card.is-featured{grid-column:auto}
  .nl-card.is-featured h3{font-size:24px}
  .nl-card{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:var(--s-4);row-gap:var(--s-1);padding:var(--s-4) 64px var(--s-4) var(--s-4)}
  .nl-card>*{grid-column:2}
  .nl-card .nl-art{grid-column:1;grid-row:1 / span 4;width:72px;height:72px;margin:0}
  .nl-card.is-featured .nl-art{width:72px;height:72px}
  .channel{flex-wrap:wrap}
  .channel .btn{width:100%}
  .nl-bar .nl-count{flex-basis:100%}
  .nl-bar input[type=email]{max-width:none}
  .onboard{width:100%;max-width:none;height:100dvh;max-height:none;border-radius:0}
  .ob-body{padding:var(--s-4)}
  .ob-times{grid-template-columns:minmax(0,1fr);gap:var(--s-3)}
  .ob-time{flex-direction:row;align-items:center}
  .ob-time>svg{width:96px;flex:none;aspect-ratio:1 / 1;height:auto}
  .ob-time-body{flex:1;min-width:0;gap:var(--s-2);flex-direction:row;justify-content:space-between;padding:var(--s-3);text-align:left}
  .ob-time .select-btn{padding:0 14px}
  .ob-nl{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:360px){
  .ob-time>svg{width:80px}
  .ob-time-body{flex-direction:column;align-items:flex-start}
}

/* =========================================================================
   Günlük bülten kayıt sayfası (/subscribe/) – tek bülten: காலைச் செய்திகள்
   ========================================================================= */
.sb-hero{background:var(--c-bg-soft);border-bottom:1px solid var(--c-line)}
.sb-hero-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,72px);align-items:center;padding:clamp(40px,6vw,84px) 0}
.sb-eyebrow{font:800 11px/1 var(--f-ui);letter-spacing:.18em;color:var(--c-brand);margin-bottom:16px}
.sb-title{font:800 clamp(40px,6vw,64px)/1.2 var(--f-head);color:var(--c-ink)}
.sb-title::after{content:"";display:block;width:64px;height:4px;background:var(--c-brand);margin-top:18px}
.sb-lede{font-size:var(--fs-lg);line-height:1.75;color:var(--c-ink-2);margin-top:18px;max-width:34em}
.sb-meta{list-style:none;display:flex;flex-wrap:wrap;gap:6px 24px;margin:20px 0 28px;padding:0;font:13px/1.5 var(--f-ui);color:var(--c-muted)}
.sb-meta b{color:var(--c-ink)}
.sb-msg{max-width:540px;margin:0 0 16px;padding:12px 16px;border-left:4px solid;font:15px/1.55 var(--f-ui)}
.sb-msg.is-ok{border-color:var(--c-wa);background:var(--c-wa-bg)}
.sb-msg.is-err{border-color:var(--c-brand);background:#fff1f1}
.sb-field{display:flex;max-width:540px;border:2px solid var(--c-ink);background:#fff;transition:box-shadow var(--t-fast)}
.sb-field:focus-within{box-shadow:0 0 0 4px rgba(18,18,18,.12)}
.sb-field input{flex:1;min-width:0;min-height:58px;padding:0 18px;border:0;background:transparent;font:17px var(--f-body);color:var(--c-ink)}
.sb-field input:focus{outline:none}
.sb-field .btn{min-height:58px;padding:0 28px;border-radius:0;font-weight:800;letter-spacing:.02em}
.sb-form .cf-turnstile{margin:14px 0 0!important}
.sb-fine{max-width:540px;margin-top:12px;font:13px/1.6 var(--f-ui);color:var(--c-muted)}
.sb-fine a{color:inherit}

/* sağ: bültenin canlı önizlemesi */
.sb-preview{margin:0}
.sb-mail{max-width:420px;margin-left:auto;padding:0 22px 22px;background:#fff;border:1px solid var(--c-line);border-top:4px solid var(--c-brand);box-shadow:0 26px 60px rgba(0,0,0,.13),0 2px 6px rgba(0,0,0,.06);transform:rotate(1.2deg)}
.sb-mail-top{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--c-line);font:12px/1.4 var(--f-ui);color:var(--c-muted)}
.sb-mail-mast{display:flex;align-items:center;justify-content:center;gap:6px;padding:18px 0 12px}
.sb-mail-mast img{width:104px;height:auto}
.sb-mail-ta{font:800 18px/1 var(--f-head);color:var(--c-brand)}
.sb-mail-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 0;border-top:1px solid var(--c-ink);border-bottom:3px double var(--c-ink);font:12px/1.4 var(--f-ui);color:var(--c-muted)}
.sb-mail-head strong{font:800 19px/1.3 var(--f-head);color:var(--c-ink)}
.sb-mail-kicker{margin:14px 0 2px;font:800 10px/1 var(--f-ui);letter-spacing:.18em;color:var(--c-brand)}
.sb-mail-list{list-style:none;margin:0;padding:0;counter-reset:sb}
.sb-mail-list li{counter-increment:sb;display:grid;grid-template-columns:22px minmax(0,1fr);gap:8px;padding:9px 0;border-bottom:1px solid var(--c-line);font:700 14.5px/1.55 var(--f-head);color:var(--c-ink)}
.sb-mail-list li::before{content:counter(sb);font:800 18px/1.2 var(--f-head);color:var(--c-brand)}
.sb-mail-lead{position:relative;margin-top:14px}
.sb-mail-lead .img{display:block;aspect-ratio:16 / 9}
.sb-mail-lead span{position:absolute;left:10px;top:10px;padding:5px 7px;background:#fff;font:800 10px/1 var(--f-ui);letter-spacing:.16em;color:var(--c-brand)}
.sb-preview figcaption{max-width:420px;margin:22px 0 0 auto;text-align:center;font:12px/1.4 var(--f-ui);color:var(--c-muted)}

/* bölümler */
.sb-h2{margin-bottom:24px;padding-top:12px;border-top:3px solid var(--c-ink);font:800 var(--fs-2xl)/1.3 var(--f-head)}
.sb-h2 span{padding-left:8px;font:800 11px/1 var(--f-ui);letter-spacing:.18em;color:var(--c-brand);vertical-align:middle}
.sb-inside{padding:clamp(44px,6vw,76px) 0 20px}
.sb-features{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.sb-features li{padding-top:16px;border-top:1px solid var(--c-line)}
.sb-num{font:800 13px/1 var(--f-ui);letter-spacing:.12em;color:var(--c-brand)}
.sb-features h3{margin:10px 0 6px;font:800 var(--fs-lg)/1.45 var(--f-head)}
.sb-features p{line-height:1.7;color:var(--c-ink-2)}
.sb-wa{display:flex;align-items:center;gap:20px;margin:28px 0 8px;padding:22px 26px;background:var(--c-wa-bg);border:1px solid #bfe3cd}
.sb-wa-icon{width:52px;height:52px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff;border:1px solid #bfe3cd;color:var(--c-wa)}
.sb-wa-icon svg{width:26px;height:26px}
.sb-wa-body{flex:1;min-width:0}
.sb-wa-body h2{font:800 var(--fs-lg)/1.4 var(--f-head)}
.sb-wa-body p{margin-top:2px;font-size:var(--fs-sm);line-height:1.6;color:var(--c-ink-2)}
.sb-faq{padding:48px 0 96px}
.sb-faq details{padding:16px 0;border-bottom:1px solid var(--c-line)}
.sb-faq summary{display:flex;align-items:baseline;gap:12px;cursor:pointer;list-style:none;font:700 var(--fs-md)/1.5 var(--f-head)}
.sb-faq summary::-webkit-details-marker{display:none}
.sb-faq summary span{font:13px/1.4 var(--f-ui);color:var(--c-muted)}
.sb-faq summary::after{content:"+";margin-left:auto;font:400 22px/1 var(--f-ui);color:var(--c-ink)}
.sb-faq details[open] summary::after{content:"–"}
.sb-faq details p{margin-top:8px;line-height:1.7;color:var(--c-ink-2)}
.sb-social{margin-top:40px}
.sb-social p{margin-bottom:12px;font:13px/1.5 var(--f-ui);color:var(--c-muted)}

@media (max-width:900px){
  .sb-hero-in{grid-template-columns:1fr}
  .sb-mail{margin:0 auto;transform:none}
  .sb-preview figcaption{margin:16px auto 0}
  .sb-features{grid-template-columns:1fr}
  .sb-wa{flex-direction:column;align-items:flex-start}
}
@media (max-width:480px){
  .sb-field{flex-direction:column;gap:10px;border:0;background:none}
  .sb-field:focus-within{box-shadow:none}
  .sb-field input{border:2px solid var(--c-ink);background:#fff}
  .sb-field .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.sb-mail{transform:none}}
