/* ==========================================================================
   features.css - /features overview and individual feature pages
   (reuses cards, steps, code, faq and cta styles from sections.css)
   ========================================================================== */

/* Page hero */
.fhero{padding:56px 0 64px;background:radial-gradient(600px 360px at 90% 20%,rgba(18,140,126,.14),transparent 70%),linear-gradient(180deg,#fff,var(--bg));border-bottom:1px solid var(--border)}
.fhero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.fhero.solo .wrap{grid-template-columns:1fr;max-width:900px}
.fhero h1{font-size:clamp(2rem,4vw,3.1rem);font-weight:800}
.fhero .lead{max-width:560px}
.fhero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}

/* Breadcrumb */
.crumbs{margin-bottom:22px;font-size:.84rem;color:var(--muted)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.crumbs li+li::before{content:"/";margin-right:8px;color:#b8c0cc}
.crumbs a{color:var(--green-dark);font-weight:500}
.crumbs a:hover{text-decoration:underline}

/* Sections */
.fsec{padding:70px 0}
.fsec.alt{background:#fff;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.fsec .answer-c{max-width:none}
.prose{max-width:780px}
.prose h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;margin-bottom:14px}
.prose p{color:#475467;margin-bottom:14px}
.prose ul{margin:0 0 16px 22px;color:#475467}
.prose li{margin-bottom:8px}
.prose pre{margin:8px 0 16px}
.prose .code{margin:8px 0 16px}
.prose-links{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:6px}
.prose-links a,.inline-link{color:var(--green-dark);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* Code block without tabs */
.code .tabs span{padding:12px 18px;color:#fff;font:600 .85rem 'Poppins',sans-serif;border-bottom:3px solid var(--lime)}
.code pre{white-space:pre}

/* Stacked narrow list of steps */
.fsec .steps{max-width:780px}

/* Cards that link to other pages */
a.card{display:block}
.card .card-link{margin-top:12px}
.fsec .uc .card h3{font-size:1.02rem}

/* Hero lead text (hero.css is not loaded on feature pages) */
.fhero .lead{margin:18px 0 24px;font-size:1.08rem;color:var(--muted);max-width:560px}