/* ============================================================
   STĚHOVÁNÍ PROFI — base.css  (v1.1 — QA fixes)
   ============================================================ */

/* ---------- 1. TOKENS ---------- */
:root {
  --coral: #FF6B35; --coral-hover: #FF8456; --coral-soft: #FFE6D6;
  --navy: #0D2A4F; --navy-soft: #4A5B7A;
  --cream: #FAF7F2; --white: #FFFFFF; --border: #E5DFD3;
  --success: #639922; --success-soft: #EAF2DE;
  --font: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-6:24px; --s-8:32px; --s-12:48px; --s-16:64px; --s-24:96px;
  --r-sm:4px; --r-md:8px; --r-lg:16px; --r-pill:999px;
  --container:1200px; --gutter:24px;
  --shadow-sm:0 1px 3px rgba(13,42,79,.08);
  --shadow-md:0 4px 16px rgba(13,42,79,.10);
  --shadow-lg:0 12px 40px rgba(13,42,79,.14);
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
html, body { overflow-x:hidden; max-width:100%; }   /* prevents off-screen mobile drawer from creating horizontal scroll */
body {
  font-family:var(--font); font-size:16px; line-height:1.6;
  color:var(--navy); background:var(--cream);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; }
svg { flex-shrink:0; }   /* icons never stretch to fill */

/* ---------- 3. TYPOGRAPHY ---------- */
h1,h2,h3,h4 { color:var(--navy); letter-spacing:-0.02em; line-height:1.15; font-weight:700; }
h1 { font-size:clamp(1.85rem,5vw,3rem); font-weight:800; }
h2 { font-size:clamp(1.45rem,3.5vw,2rem); }
h3 { font-size:1.25rem; font-weight:600; }
h4 { font-size:1rem; font-weight:600; }
p { color:var(--navy); }
.text-secondary { color:var(--navy-soft); }
.eyebrow { font-size:.75rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--coral); }

/* ---------- 4. LAYOUT ---------- */
.container { width:100%; max-width:var(--container); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }
.section { padding-top:var(--s-12); padding-bottom:var(--s-12); }
@media (min-width:768px){
  :root { --gutter:48px; }
  .section { padding-top:var(--s-24); padding-bottom:var(--s-24); }
}

/* ---------- 5. BUTTONS ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  font-weight:600; font-size:.95rem; padding:13px 22px; border-radius:var(--r-md);
  transition:transform .15s ease, background .15s ease, box-shadow .15s ease;
  white-space:nowrap; line-height:1;
}
.btn:active { transform:translateY(1px); }
.btn-primary { background:var(--coral); color:var(--white); }
.btn-primary:hover { background:var(--coral-hover); box-shadow:var(--shadow-md); }
.btn-secondary { background:var(--white); color:var(--navy); border:1px solid var(--navy); }
.btn-secondary:hover { background:var(--navy); color:var(--white); }
.btn-ghost { color:var(--coral); padding:10px 4px; }
.btn-ghost:hover { text-decoration:underline; text-underline-offset:4px; }
.btn svg { width:18px; height:18px; }

/* ---------- 6. TRUST PILL ---------- */
.trust-pill {
  display:inline-flex; align-items:center; gap:var(--s-2);
  background:var(--white); border:1px solid var(--coral); border-radius:var(--r-pill);
  padding:6px 14px; font-size:.8rem; font-weight:600; color:var(--navy); white-space:nowrap;
}
.trust-pill::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--success); flex-shrink:0; }
.trust-pill.no-dot::before { display:none; }

/* ---------- 7. CARD ---------- */
.card { background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg); padding:var(--s-6); }

/* ---------- 8. LOGO ---------- */
.logo {
  display:inline-flex; flex-direction:column; align-items:flex-start;
  background:var(--cream); border:1px solid var(--coral); border-radius:var(--r-pill);
  padding:7px 16px 5px; line-height:1; transition:box-shadow .15s ease;
}
.logo:hover { box-shadow:var(--shadow-sm); }
.logo-line { display:flex; align-items:baseline; gap:5px; }
.logo-main { font-size:1.15rem; font-weight:800; letter-spacing:-0.035em; color:var(--navy); }
.logo-mod { font-size:.8rem; font-weight:700; letter-spacing:-0.015em; color:var(--coral); display:inline-flex; align-items:center; gap:4px; }
.logo-mod::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--coral); }
.logo-foot { font-size:.48rem; font-weight:600; letter-spacing:.18em; color:var(--navy-soft); margin-top:3px; }

/* ---------- 9. HEADER ---------- */
.site-header { position:sticky; top:0; z-index:100; background:rgba(250,247,242,.92); backdrop-filter:saturate(160%) blur(10px); border-bottom:1px solid var(--border); }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); padding-top:var(--s-3); padding-bottom:var(--s-3); }
.nav-desktop { display:none; }
.nav-desktop ul { display:flex; align-items:center; gap:var(--s-6); }
.nav-desktop a { font-size:.95rem; font-weight:500; color:var(--navy); transition:color .15s ease; }
.nav-desktop a:hover, .nav-desktop a.active { color:var(--coral); }
.header-actions { display:flex; align-items:center; gap:var(--s-2); }
.header-phone { display:none; font-weight:700; color:var(--navy); font-size:.95rem; }
.header-phone:hover { color:var(--coral); }
.burger { display:flex; flex-direction:column; gap:5px; padding:8px; flex-shrink:0; }
.burger span { width:24px; height:2px; background:var(--navy); border-radius:2px; transition:.2s ease; display:block; }
.burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* compact WhatsApp button on mobile so the burger always fits */
@media (max-width:1023px){
  .header-actions .btn-primary .label { display:none; }
  .header-actions .btn-primary { padding:11px 13px; }
  .header-actions .btn-primary svg { width:20px; height:20px; }
}

/* Mobile menu drawer */
.nav-mobile {
  position:fixed; inset:0 0 0 auto; width:min(82%,320px);
  background:var(--white); box-shadow:var(--shadow-lg);
  padding:var(--s-16) var(--s-6) var(--s-6);
  transform:translateX(100%); transition:transform .25s ease;
  z-index:200; display:flex; flex-direction:column; gap:2px;
  overflow-y:auto;
}
.nav-mobile.open { transform:translateX(0); }
.nav-mobile a { font-size:1.05rem; font-weight:600; color:var(--navy); padding:var(--s-3) 0; border-bottom:1px solid var(--border); }
.nav-mobile a:hover { color:var(--coral); }
.nav-mobile .btn { margin-top:var(--s-4); }
.nav-overlay { position:fixed; inset:0; background:rgba(13,42,79,.4); opacity:0; visibility:hidden; transition:.25s ease; z-index:150; }
.nav-overlay.open { opacity:1; visibility:visible; }
@media (min-width:1024px){
  .nav-desktop { display:block; }
  .header-phone { display:inline; }
  .burger { display:none; }
}

/* ---------- 10. FOOTER ---------- */
.site-footer { background:var(--navy); color:var(--cream); padding-top:var(--s-16); padding-bottom:var(--s-8); }
.footer-grid { display:grid; grid-template-columns:1fr; gap:var(--s-8); margin-bottom:var(--s-12); }
.footer-col h4 { color:var(--white); margin-bottom:var(--s-4); font-size:.95rem; }
.footer-col a, .footer-col p { color:#B8C5DA; font-size:.9rem; line-height:1.8; display:block; }
.footer-col a:hover { color:var(--coral-hover); }
.footer-logo .logo { background:transparent; border-color:rgba(255,255,255,.3); }
.footer-logo .logo-main { color:var(--white); }
.footer-tagline { color:#B8C5DA; font-size:.9rem; line-height:1.6; margin-top:var(--s-4); max-width:340px; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.12); padding-top:var(--s-6); display:flex; flex-wrap:wrap; gap:var(--s-4); justify-content:space-between; align-items:center; font-size:.8rem; color:#8DA0BC; }
.footer-ico { font-weight:600; color:#B8C5DA; }
@media (min-width:768px){ .footer-grid { grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--s-10); } }

/* ---------- 11. STICKY MOBILE CTA ---------- */
.mobile-cta { position:fixed; right:16px; bottom:16px; z-index:90; display:flex; flex-direction:column; gap:var(--s-3); }
.mobile-cta a { width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-lg); transition:transform .15s ease; }
.mobile-cta a:active { transform:scale(.94); }
.mobile-cta .wa { background:#25D366; }
.mobile-cta .tel { background:var(--coral); }
.mobile-cta svg { width:26px; height:26px; fill:var(--white); }
@media (min-width:1024px){ .mobile-cta { display:none; } }

/* ---------- 12. UTILITIES ---------- */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.flex { display:flex; } .items-center { align-items:center; }
.gap-2 { gap:var(--s-2); } .gap-3 { gap:var(--s-3); } .gap-4 { gap:var(--s-4); }
.wrap { flex-wrap:wrap; } .mt-4 { margin-top:var(--s-4); } .mt-6 { margin-top:var(--s-6); }

/* ============================================================
   SECTION COMPONENTS
   ============================================================ */
.section-head { max-width:640px; margin-bottom:var(--s-12); }
.section-head.center { margin-left:auto; margin-right:auto; text-align:center; }
.section-head .eyebrow { display:block; margin-bottom:var(--s-3); }
.section-head h2 { margin-bottom:var(--s-3); }
.section-head p { color:var(--navy-soft); font-size:1.05rem; }

/* ---------- HERO (centered, image under description) ---------- */
.hero { padding-top:var(--s-12); padding-bottom:var(--s-16); }
.hero-inner { max-width:820px; margin:0 auto; text-align:center; }
.hero-h1 { margin:var(--s-3) 0 var(--s-4); }
.hero-lead { font-size:1.15rem; color:var(--navy-soft); line-height:1.6; margin:0 auto var(--s-6); max-width:620px; }
.hero-rating { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:var(--s-8); font-size:.9rem; color:var(--navy-soft); flex-wrap:wrap; }
.hero-rating .stars { color:#FFB800; letter-spacing:1px; }
.hero-rating strong { color:var(--navy); }
.hero-images { display:grid; grid-template-columns:1fr; gap:var(--s-4); max-width:920px; margin:0 auto var(--s-8); }
.hero-images img { width:100%; border-radius:var(--r-lg); box-shadow:var(--shadow-md); aspect-ratio:800/586; object-fit:cover; }
.hero-img-desktop { display:none; }
.hero-pills { display:flex; gap:var(--s-2); flex-wrap:wrap; justify-content:center; margin-bottom:var(--s-6); }
.hero-ctas { display:flex; gap:var(--s-3); flex-wrap:wrap; align-items:center; justify-content:center; }
.hero-note { font-size:.85rem; color:var(--navy-soft); margin-top:var(--s-4); width:100%; }
@media (min-width:1024px){ .hero-images { grid-template-columns:1fr 1fr; } .hero-img-desktop { display:block; } }

/* ---------- FACTS STRIP ---------- */
.facts-strip { background:var(--navy); color:var(--cream); border-radius:var(--r-lg); display:grid; grid-template-columns:repeat(2,1fr); gap:1px; overflow:hidden; }
.fact { padding:var(--s-6) var(--s-4); text-align:center; background:var(--navy); }
.fact-num { font-size:1.4rem; font-weight:800; color:var(--white); display:block; letter-spacing:-0.02em; line-height:1.2; }
.fact-label { font-size:.85rem; color:#B8C5DA; display:block; margin-top:6px; }
@media (min-width:768px){ .facts-strip { grid-template-columns:repeat(4,1fr); } }

/* ---------- PRICING ---------- */
.pricing-grid { display:grid; grid-template-columns:1fr; gap:var(--s-4); }
.price-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg); padding:var(--s-6); display:flex; flex-direction:column; position:relative; transition:border-color .15s ease, box-shadow .15s ease; }
.price-card:hover { box-shadow:var(--shadow-md); }
.price-card.featured { border:2px solid var(--coral); }
.price-card .ribbon { position:absolute; top:-11px; left:var(--s-6); background:var(--coral); color:var(--white); font-size:.7rem; font-weight:700; letter-spacing:.05em; padding:3px 10px; border-radius:var(--r-sm); }
.price-card .ico { width:42px; height:42px; border-radius:var(--r-md); background:var(--coral-soft); color:var(--coral); display:flex; align-items:center; justify-content:center; margin-bottom:var(--s-4); }
.price-card .ico svg { width:22px; height:22px; }
.price-card h3 { font-size:1.05rem; margin-bottom:var(--s-2); }
.price-card .price { font-size:1.7rem; font-weight:800; color:var(--navy); letter-spacing:-0.02em; }
.price-card .price small { font-size:.9rem; font-weight:600; color:var(--navy-soft); }
.price-card .price-desc { font-size:.9rem; color:var(--navy-soft); margin:var(--s-3) 0 var(--s-4); flex:1; line-height:1.5; }
.price-card .price-min { font-size:.8rem; color:var(--navy-soft); padding-top:var(--s-3); border-top:1px solid var(--border); }
@media (min-width:768px){ .pricing-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .pricing-grid { grid-template-columns:repeat(4,1fr); } }
.price-note { margin-top:var(--s-8); font-size:.9rem; color:var(--navy-soft); line-height:1.7; }
.price-note strong { color:var(--navy); }
.final-price-banner { background:var(--success-soft); border:1px solid var(--success); border-radius:var(--r-md); padding:var(--s-4) var(--s-6); margin-top:var(--s-6); font-size:.95rem; color:var(--navy); line-height:1.6; }
.final-price-banner strong { color:var(--success); }

/* ---------- SERVICES ---------- */
.services-grid { display:grid; grid-template-columns:1fr; gap:var(--s-4); }
.service-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg); padding:var(--s-6); transition:border-color .15s ease, transform .15s ease; display:block; }
.service-card:hover { border-color:var(--coral); transform:translateY(-2px); }
.service-card .ico { width:44px; height:44px; border-radius:var(--r-md); background:var(--coral-soft); color:var(--coral); display:flex; align-items:center; justify-content:center; margin-bottom:var(--s-4); }
.service-card .ico svg { width:24px; height:24px; }
.service-card h3 { font-size:1.1rem; margin-bottom:var(--s-2); }
.service-card p { font-size:.9rem; color:var(--navy-soft); line-height:1.5; }
.service-card .arrow { color:var(--coral); font-weight:600; font-size:.85rem; margin-top:var(--s-3); display:inline-block; }
@media (min-width:640px){ .services-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .services-grid { grid-template-columns:repeat(3,1fr); } }

/* ---------- WHY ---------- */
.why-grid { display:grid; grid-template-columns:1fr; gap:var(--s-6); }
.why-item { display:flex; gap:var(--s-4); align-items:flex-start; }
.why-item .ico { width:40px; height:40px; flex-shrink:0; border-radius:var(--r-md); background:var(--navy); color:var(--white); display:flex; align-items:center; justify-content:center; }
.why-item .ico svg { width:22px; height:22px; }
.why-item h3 { font-size:1.05rem; margin-bottom:4px; }
.why-item p { font-size:.92rem; color:var(--navy-soft); line-height:1.5; }
@media (min-width:768px){ .why-grid { grid-template-columns:repeat(2,1fr); gap:var(--s-8); } }

/* ---------- COVERAGE ---------- */
.coverage-band { background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg); padding:var(--s-8); }
.coverage-cities { display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-6); }
.city-chip { background:var(--cream); border:1px solid var(--border); border-radius:var(--r-pill); padding:8px 16px; font-weight:600; font-size:.9rem; color:var(--navy); transition:border-color .15s ease; }
.city-chip:hover { border-color:var(--coral); }
.city-chip.route { background:var(--coral-soft); border-color:var(--coral); color:var(--coral); }

/* ---------- REVIEWS ---------- */
.reviews-grid { display:grid; grid-template-columns:1fr; gap:var(--s-4); }
.review-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg); padding:var(--s-6); }
.review-head { display:flex; align-items:center; gap:var(--s-3); margin-bottom:var(--s-4); }
.review-avatar { width:44px; height:44px; border-radius:50%; background:var(--coral-soft); color:var(--coral); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1.1rem; flex-shrink:0; }
.review-name { font-weight:700; font-size:.95rem; color:var(--navy); }
.review-meta { font-size:.75rem; color:var(--navy-soft); }
.review-stars { color:#FFB800; font-size:.85rem; letter-spacing:1px; margin-bottom:var(--s-2); }
.review-text { font-size:.92rem; color:var(--navy); line-height:1.55; }
@media (min-width:768px){ .reviews-grid { grid-template-columns:repeat(3,1fr); } }

/* ---------- FAQ ---------- */
.faq-list { max-width:760px; margin:0 auto; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-item summary { display:flex; justify-content:space-between; align-items:center; gap:var(--s-4); padding:var(--s-4) 0; cursor:pointer; font-weight:600; font-size:1.05rem; color:var(--navy); list-style:none; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary .plus { flex-shrink:0; width:22px; height:22px; position:relative; }
.faq-item summary .plus::before, .faq-item summary .plus::after { content:""; position:absolute; background:var(--coral); border-radius:2px; transition:.2s ease; }
.faq-item summary .plus::before { top:10px; left:2px; right:2px; height:2px; }
.faq-item summary .plus::after { left:10px; top:2px; bottom:2px; width:2px; }
.faq-item[open] summary .plus::after { transform:rotate(90deg); opacity:0; }
.faq-item .faq-answer { padding:0 0 var(--s-4); color:var(--navy-soft); line-height:1.6; font-size:.98rem; }

/* ---------- CTA BAND ---------- */
.cta-band { background:var(--navy); border-radius:var(--r-lg); padding:var(--s-12) var(--s-6); text-align:center; }
.cta-band h2 { color:var(--white); margin-bottom:var(--s-3); }
.cta-band p { color:#B8C5DA; margin:0 auto var(--s-6); font-size:1.05rem; max-width:520px; }
.cta-band .hero-ctas { justify-content:center; }
.cta-band .btn-secondary { background:transparent; color:var(--white); border-color:rgba(255,255,255,.4); }
.cta-band .btn-secondary:hover { background:var(--white); color:var(--navy); }

/* ---------- TRUST BLOCK ---------- */
.trust-block { display:grid; grid-template-columns:1fr; gap:var(--s-6); align-items:center; }
.trust-block .badges { display:flex; flex-wrap:wrap; gap:var(--s-3); align-items:center; }
@media (min-width:768px){ .trust-block { grid-template-columns:1.3fr 1fr; gap:var(--s-12); } }

/* ---------- INNER PAGE HEADER ---------- */
.page-header { padding-top:var(--s-12); padding-bottom:var(--s-8); border-bottom:1px solid var(--border); background:var(--white); }
.breadcrumb { display:flex; gap:8px; align-items:center; font-size:.85rem; color:var(--navy-soft); margin-bottom:var(--s-4); flex-wrap:wrap; }
.breadcrumb a { color:var(--navy-soft); }
.breadcrumb a:hover { color:var(--coral); }
.breadcrumb .sep { color:var(--border); }
.page-header h1 { margin:var(--s-2) 0 var(--s-4); max-width:780px; }
.page-header .lead { font-size:1.1rem; color:var(--navy-soft); line-height:1.6; max-width:680px; }

/* ---------- PRICE TABLE (add-ons) ---------- */
.price-table { width:100%; border-collapse:collapse; }
.price-table tr { border-bottom:1px solid var(--border); }
.price-table tr:last-child { border-bottom:none; }
.price-table td { padding:var(--s-4) 0; font-size:.95rem; vertical-align:top; }
.price-table td:last-child { text-align:right; font-weight:700; color:var(--navy); white-space:nowrap; padding-left:var(--s-4); }
.price-table .svc { color:var(--navy); font-weight:600; }
.price-table .svc small { display:block; font-weight:500; color:var(--navy-soft); font-size:.85rem; margin-top:3px; }

/* ---------- CHECKLIST ---------- */
.checklist { display:grid; grid-template-columns:1fr; gap:var(--s-3); }
.checklist li { display:flex; gap:var(--s-3); align-items:flex-start; font-size:.95rem; color:var(--navy); }
.checklist li svg { width:20px; height:20px; color:var(--success); flex-shrink:0; margin-top:2px; }
@media (min-width:768px){ .checklist { grid-template-columns:repeat(2,1fr); } }

/* ---------- INFO TWO-COL ---------- */
.info-grid { display:grid; grid-template-columns:1fr; gap:var(--s-8); }
@media (min-width:900px){ .info-grid { grid-template-columns:1fr 1fr; gap:var(--s-12); } }

/* ---------- BLOG ---------- */
.article-hero { max-width:920px; margin:0 auto var(--s-12); }
.article-hero img { width:100%; border-radius:var(--r-lg); box-shadow:var(--shadow-md); aspect-ratio:1200/500; object-fit:cover; }
.article-meta { display:flex; gap:var(--s-3); align-items:center; font-size:.85rem; color:var(--navy-soft); margin-top:var(--s-4); }
.article-meta strong { color:var(--navy); }
.article-body { max-width:760px; margin:0 auto; font-size:1.05rem; line-height:1.75; color:var(--navy); }
.article-body h2 { font-size:1.5rem; margin:var(--s-12) 0 var(--s-4); }
.article-body h3 { font-size:1.2rem; margin:var(--s-8) 0 var(--s-3); }
.article-body p { margin-bottom:var(--s-4); color:var(--navy); }
.article-body ul, .article-body ol { margin:0 0 var(--s-4) var(--s-6); }
.article-body li { margin-bottom:var(--s-2); line-height:1.6; }
.article-body strong { color:var(--navy); font-weight:700; }
.article-body a { color:var(--coral); text-decoration:underline; text-underline-offset:3px; }
.article-table { width:100%; border-collapse:collapse; margin:var(--s-6) 0; font-size:.98rem; }
.article-table th { text-align:left; background:var(--cream); padding:var(--s-3) var(--s-4); font-size:.85rem; border-bottom:1px solid var(--border); }
.article-table td { padding:var(--s-3) var(--s-4); border-bottom:1px solid var(--border); }
.article-table td:last-child { font-weight:700; white-space:nowrap; }

/* Blog index */
.blog-grid { display:grid; grid-template-columns:1fr; gap:var(--s-6); }
.blog-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; transition:border-color .15s ease, transform .15s ease; display:flex; flex-direction:column; }
.blog-card:hover { border-color:var(--coral); transform:translateY(-2px); }
.blog-card img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.blog-card .body { padding:var(--s-6); display:flex; flex-direction:column; flex:1; }
.blog-card h3 { font-size:1.15rem; margin-bottom:var(--s-2); }
.blog-card p { font-size:.92rem; color:var(--navy-soft); line-height:1.5; flex:1; }
.blog-card .arrow { color:var(--coral); font-weight:600; font-size:.85rem; margin-top:var(--s-4); }
@media (min-width:768px){ .blog-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .blog-grid { grid-template-columns:repeat(3,1fr); } }