/* Landing + Blog EN styles v3.1 */
:root{ --ink:#0f172a; --ink-2:#334155; --btn:#28c26b; --btn-hover:#19ad59; --hero-start:#1a7fb0; --hero-end:#25c6a6; }
.sfhs-wrap{ font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--ink); line-height:1.6; }
.container{ width:min(1100px,calc(100% - 48px)); margin:0 auto; }
.sfhs-header{ position:sticky; top:0; z-index:50; backdrop-filter:blur(8px); background:color-mix(in oklab, white 60%, transparent); border-bottom:1px solid #e5e7eb; }
.sfhs-header .container{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; }
.brand{ display:flex; gap:10px; align-items:center; text-decoration:none; } .brand-text{ font-weight:800; font-size:26px; color:#0b172a; } .logo-shield{ width:36px; height:36px; }
.nav a{ margin-left:18px; font-weight:600; color:#1f2937; text-decoration:none; padding:8px 10px; border-radius:10px; } .nav a:hover{ color:#0c9b80; background:#eef2f7; } .nav .nav-cta{ background:#0ea5e9; color:#fff; }
.hero{ background:linear-gradient(135deg,var(--hero-start),var(--hero-end)); color:#fff; padding:80px 0 36px; }
.hero h1{ font-size:clamp(36px,5vw,64px); font-weight:800; line-height:1.1; margin:0 0 18px; } .hero .sub{ font-size:clamp(18px,2.1vw,24px); opacity:.95; margin:0 0 24px; }
.btn{ display:inline-block; background:var(--btn); color:#fff; font-weight:700; padding:14px 22px; border-radius:10px; text-decoration:none; box-shadow:0 6px 14px rgba(16,185,129,.22); transition:transform .05s, background .2s; } .btn:hover{ background:var(--btn-hover); transform:translateY(-1px); }
.trust{ display:flex; gap:26px; flex-wrap:wrap; align-items:center; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.28); padding:16px 18px; margin-top:34px; border-radius:14px; } .i.i-check{ width:20px; height:20px; fill:#fff; }

.compare{ background:#fff; padding:56px 0; }
.table-wrap{ overflow-x:auto; }
.compare-table{ width:100%; border-collapse:separate; border-spacing:0; }
.compare-table th, .compare-table td{ border:1px solid #e5e7eb; padding:12px; text-align:left; }
.compare-table th{ background:#f8fafc; }

/* Latest cards on homepage */
.latest{ background:#f9fafb; padding:44px 0; }
.post-cards{ display:grid; grid-template-columns: repeat(3, 1fr); gap:16px; }
.post-card{ background:#fff; border:1px solid #e5e7eb; border-radius:14px; overflow:hidden; display:flex; flex-direction:column; }
.post-card .thumb img{ display:block; width:100%; height:auto; }
.thumb-fallback{ width:100%; height:auto; display:block; }
.card-body{ padding:12px; }
.card-title{ text-decoration:none; color:var(--ink); }
.card-title h3{ margin:0 0 4px; font-size:20px; }
.meta{ color:#64748b; font-size:14px; margin:0 0 6px; }
.excerpt{ color:#334155; margin:0 0 8px; }
.more{ margin-top:14px; }

/* Blog listing (detailed) */
.page-title{ margin:0 0 6px; }
.post-teaser{ display:grid; grid-template-columns: 320px 1fr; gap:16px; align-items:start; }
.teaser-thumb img{ width:100%; height:auto; border-radius:12px; display:block; }
.teaser-title{ text-decoration:none; color:var(--ink); }
.teaser-title h2{ margin:0 0 4px; }
.divider{ border:0; border-top:1px solid #e5e7eb; margin:18px 0; }
.pagination{ display:flex; gap:10px; justify-content:center; margin-top:18px; }
.single-thumb img{ width:100%; height:auto; border-radius:14px; }

/* Footer & sections */
.policies{ background:#f9fafb; padding:44px 0; } .policy-box{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:18px; }
.sfhs-footer{ background:#0b1220; color:#d1d5db; padding: 22px 0; }
.footer-flex{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.footer-nav a{ color:#d1d5db; text-decoration:none; margin-right:14px; } .footer-nav a:hover{ color:#fff; }

/* Responsive */
@media (max-width: 960px){
  .post-cards{ grid-template-columns: 1fr 1fr; }
  .post-teaser{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .post-cards{ grid-template-columns: 1fr; }
}