/* NewsNow Tamil – abone ol / kayıt ol sayfaları */

.page-head{padding:var(--s-6) 0 var(--s-5);border-bottom:1px solid var(--c-line);margin-bottom:var(--s-6)}
.page-eyebrow{font:800 var(--fs-xs)/1 var(--f-body);color:var(--c-brand);letter-spacing:.04em}
.page-title{font-family:var(--f-head);font-weight:800;font-size:clamp(26px,1.5rem + 1.2vw,38px);line-height:1.35;margin-top:var(--s-2)}
.page-lede{font-size:var(--fs-lg);line-height:1.7;color:var(--c-ink-2);margin-top:var(--s-3);max-width:640px}

/* abonelik seçenekleri */
.options{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s-5);padding-bottom:var(--s-7)}
.option{position:relative;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-5);border:1px solid var(--c-line);border-radius:6px;background:#fff}
.option.is-primary{border:2px solid var(--c-wa);box-shadow:0 8px 24px rgba(14,122,64,.08)}
.option-badge{position:absolute;top:-12px;left:var(--s-5);background:var(--c-wa);color:#fff;font:700 var(--fs-xs)/1 var(--f-body);padding:6px 10px;border-radius:999px}
.option-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--c-bg-soft);color:var(--c-ink)}
.option-icon svg{width:24px;height:24px}
.option.is-primary .option-icon{background:var(--c-wa-bg);color:var(--c-wa)}
.option h2{font-family:var(--f-head);font-size:var(--fs-xl);font-weight:800;line-height:1.4}
.option p{font-size:var(--fs-md);line-height:1.7;color:var(--c-ink-2)}
.option .btn{align-self:flex-start;margin-top:auto}
.btn-wa{background:var(--c-wa);color:#fff;min-height:48px;padding:0 20px;font-size:var(--fs-md)}
.btn-wa:hover{background:#0a5f32;color:#fff}
.checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:var(--fs-md)}
.checklist li{display:flex;gap:var(--s-2);align-items:flex-start}
.checklist svg{width:18px;height:18px;flex:none;margin-top:3px;color:var(--c-wa)}
.fine{font-size:var(--fs-sm);color:var(--c-muted);line-height:1.6}

/* form alanları – görünür etiket, hata alanın hemen altında */
.form{display:flex;flex-direction:column;gap:var(--s-4)}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-weight:700;font-size:var(--fs-md)}
.field-hint{font-size:var(--fs-sm);color:var(--c-muted)}
.field input[type=text],.field input[type=email],.field input[type=password]{min-height:48px;padding:0 var(--s-4);border:1px solid #b5b5b5;border-radius:var(--radius);font:400 var(--fs-base) var(--f-body);background:#fff;width:100%}
.field input:focus{outline:none;border-color:var(--c-ink);box-shadow:0 0 0 3px rgba(26,95,208,.25)}
.field input[aria-invalid=true]{border-color:var(--c-brand);box-shadow:0 0 0 1px var(--c-brand)}
.field-error{display:flex;gap:6px;align-items:center;color:var(--c-brand-dark);font-size:var(--fs-sm);font-weight:600}
.field-error::before{content:"!";flex:none;width:18px;height:18px;border-radius:50%;background:var(--c-brand);color:#fff;font:800 12px/18px var(--f-ui);text-align:center}
.pw-wrap{display:flex;gap:var(--s-2)}
.pw-wrap input{flex:1}
.pw-toggle{min-width:72px;min-height:48px;border:1px solid #b5b5b5;border-radius:var(--radius);background:#fff;cursor:pointer;font-weight:700;font-size:var(--fs-sm)}
.pw-toggle:hover{border-color:var(--c-ink)}
.check{display:flex;gap:var(--s-3);align-items:flex-start;font-size:var(--fs-md);line-height:1.6}
.check input{width:22px;height:22px;margin:3px 0 0;flex:none;accent-color:var(--c-ink)}
.check a{text-decoration:underline;text-underline-offset:3px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}  /* bot tuzağı */
.form-success{display:flex;gap:var(--s-3);align-items:flex-start;padding:var(--s-4);border-radius:var(--radius);background:var(--c-wa-bg);border:1px solid #bfe3cd;color:#0a4f2a;font-weight:600;line-height:1.6}
.form-success svg{width:20px;height:20px;flex:none;margin-top:2px}
.form-success:focus{outline:3px solid var(--c-focus);outline-offset:2px}
.form .btn-brand{min-height:52px;font-size:var(--fs-base)}

/* kayıt sayfası düzeni */
.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:var(--s-7);align-items:start;padding-bottom:var(--s-7)}
.auth-why{padding:var(--s-5);background:var(--c-bg-soft);border-radius:6px}
.auth-why h2{font-family:var(--f-head);font-size:var(--fs-xl);font-weight:800;margin-bottom:var(--s-4)}
.auth-why .checklist{gap:var(--s-3)}
.auth-card{border:1px solid var(--c-line);border-radius:6px;padding:var(--s-5)}
.auth-card h2{font-family:var(--f-head);font-size:var(--fs-xl);font-weight:800;margin-bottom:var(--s-4)}
.auth-switch{margin-top:var(--s-4);font-size:var(--fs-md);text-align:center}
.auth-switch a{font-weight:700;color:var(--c-brand);text-decoration:underline;text-underline-offset:3px}
.divider{display:flex;align-items:center;gap:var(--s-3);color:var(--c-muted);font-size:var(--fs-sm)}
.divider::before,.divider::after{content:"";flex:1;border-top:1px solid var(--c-line)}

@media (max-width:860px){
  .auth{grid-template-columns:1fr}
  .auth-card{order:-1}
}
