/* ═══════════════════════════════════════════════════════════════════════════
   INDUSTRY PAGES – Shared CSS (hc-* = Healthcare)
   Palette: rose-pink pastel (#fff1f2 → #fce7f3 → #faf5ff)
   Accent:  Rose #e11d48 · Violet #7c3aed · Pink #db2777
   ═══════════════════════════════════════════════════════════════════════════ */

.hc-page { overflow-x: hidden; }


/* ── Breadcrumb ────────────────────────────────────────────────────────────── */
.hc-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: var(--space-8);
    font-size: var(--text-sm);
    color: #64748b;
    position: relative;
    z-index: 3;
}
.hc-breadcrumb__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #e11d48;
    font-weight: 600;
    text-decoration: none;
    transition: opacity .2s;
}
.hc-breadcrumb__link:hover { opacity: .75; text-decoration: none; }
.hc-breadcrumb__sep { color: #cbd5e1; }
.hc-breadcrumb__current { color: #94a3b8; font-weight: 500; }


/* ══════════════════════════════════════════════════════════════════════════════
   HERO
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(6rem, 12vw, 10rem) 0 clamp(8rem, 15vw, 13rem);
    background: linear-gradient(160deg, #fff1f2 0%, #fce7f3 55%, #faf5ff 100%);
    color: #1e293b;
}

.hc-hero__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

/* Dot grid texture */
.hc-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(225,29,72,.04) 1px, transparent 1px);
    background-size: 30px 30px;
    pointer-events: none;
    z-index: 0;
}

.hc-hero__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(100px);
    opacity: .25;
    will-change: transform;
    animation: hcFloat 18s ease-in-out infinite alternate;
}
.hc-hero__orb--1 { width: 500px; height: 500px; background: #fda4af; top: -12%; left: -8%; }
.hc-hero__orb--2 { width: 400px; height: 400px; background: #f9a8d4; bottom: -15%; right: -8%; animation-delay: -6s; }
.hc-hero__orb--3 { width: 320px; height: 320px; background: #e879f9; top: 28%; right: 20%; animation-delay: -12s; opacity: .15; }

@keyframes hcFloat {
    0%   { transform: translate(0, 0) scale(1); }
    100% { transform: translate(22px, -18px) scale(1.06); }
}

.hc-hero__canvas {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    z-index: 0;
    opacity: .06;
}

.hc-hero__wave {
    position: absolute;
    bottom: -2px; left: 0; right: 0;
    width: 100%;
    height: clamp(80px, 12vw, 160px);
    z-index: 1;
}

.hc-hero .container { position: relative; z-index: 2; }

.hc-hero__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(3rem, 5vw, 5rem);
    align-items: center;
}
@media (min-width: 1024px) {
    .hc-hero__inner { grid-template-columns: 1.15fr .85fr; }
}

/* Badge */
.hc-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(225,29,72,.08);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(225,29,72,.18);
    color: #be123c;
    margin-bottom: var(--space-5);
    padding: 8px 18px;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hc-hero__title {
    font-family: var(--font-heading);
    font-size: var(--text-5xl);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.03em;
    margin-bottom: var(--space-6);
    color: #1e293b;
}

.hc-hero__desc {
    font-size: var(--text-lg);
    line-height: 1.7;
    color: #475569;
    max-width: 560px;
    margin-bottom: var(--space-8);
}

.hc-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-bottom: var(--space-10);
}
.hc-hero__actions .btn--outline {
    border-color: rgba(225,29,72,.3);
    color: #be123c;
}
.hc-hero__actions .btn--outline:hover {
    background: rgba(225,29,72,.06);
    border-color: #be123c;
}

/* Proof bar */
.hc-hero__proof {
    display: inline-flex;
    align-items: center;
    gap: var(--space-6);
    padding: var(--space-5) var(--space-6);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.65);
    border: 1px solid rgba(225,29,72,.1);
    backdrop-filter: blur(12px);
    flex-wrap: wrap;
}
.hc-hero__proof-item { text-align: center; white-space: nowrap; }
.hc-hero__proof-number {
    display: block;
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    font-weight: 800;
    color: #be123c;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}
.hc-hero__proof-label {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #64748b;
    font-weight: 600;
    margin-top: 2px;
}
.hc-hero__proof-divider {
    width: 1px;
    height: 32px;
    background: rgba(225,29,72,.15);
    flex-shrink: 0;
}


/* ══════════════════════════════════════════════════════════════════════════════
   PATIENT PORTAL MOCKUP
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-hero__visual {
    perspective: 1200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hc-portal {
    width: 100%;
    max-width: 440px;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow:
        0 0 0 1px rgba(225,29,72,.09),
        0 30px 80px -10px rgba(225,29,72,.15),
        0 8px 32px -4px rgba(15,23,42,.12);
    transition: transform .6s var(--ease-out), box-shadow .6s var(--ease-out);
}
.hc-portal:hover {
    box-shadow:
        0 0 0 1px rgba(225,29,72,.14),
        0 40px 100px -10px rgba(225,29,72,.2),
        0 12px 48px -4px rgba(15,23,42,.16);
}

/* Window bar */
.hc-portal__bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
}
.hc-portal__dots {
    display: flex;
    gap: 5px;
    flex-shrink: 0;
}
.hc-portal__dot {
    width: 10px; height: 10px;
    border-radius: 50%;
}
.hc-portal__dot--red    { background: #ef4444; }
.hc-portal__dot--yellow { background: #eab308; }
.hc-portal__dot--green  { background: #22c55e; }

.hc-portal__title {
    flex: 1;
    text-align: center;
    font-size: 0.65rem;
    color: #94a3b8;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hc-portal__secure {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.6rem;
    font-weight: 700;
    color: #22c55e;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    flex-shrink: 0;
}

/* Portal body — sidebar + main */
.hc-portal__body {
    display: flex;
    min-height: 260px;
}

/* Sidebar nav */
.hc-portal__sidebar {
    width: 44px;
    background: #fdf2f4;
    border-right: 1px solid #fce7f3;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 0;
    gap: 6px;
    flex-shrink: 0;
}
.hc-portal__nav-item {
    width: 32px; height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: #cbd5e1;
    transition: background .2s, color .2s;
    cursor: default;
}
.hc-portal__nav-item--active {
    background: rgba(225,29,72,.1);
    color: #e11d48;
}

/* Main content area */
.hc-portal__main {
    flex: 1;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.hc-portal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.hc-portal__greeting {
    font-size: 0.75rem;
    font-weight: 700;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hc-portal__nhs-badge {
    flex-shrink: 0;
    font-size: 0.55rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    color: #fff;
    background: #005EB8;
    padding: 3px 7px;
    border-radius: 4px;
}

/* Appointment card */
.hc-portal__appt {
    background: #fff7f8;
    border: 1px solid #fce7f3;
    border-radius: 10px;
    padding: 10px 12px;
}
.hc-portal__appt-label {
    font-size: 0.55rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #be123c;
    font-weight: 700;
    margin-bottom: 6px;
}
.hc-portal__appt-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.hc-portal__appt-avatar {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #fda4af, #c4b5fd);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}
.hc-portal__appt-info {
    flex: 1;
    min-width: 0;
}
.hc-portal__appt-name {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hc-portal__appt-time {
    display: block;
    font-size: 0.6rem;
    color: #64748b;
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hc-portal__appt-status {
    flex-shrink: 0;
    font-size: 0.55rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #16a34a;
    background: #dcfce7;
    padding: 3px 8px;
    border-radius: var(--radius-full);
}

/* Vitals row */
.hc-portal__vitals {
    display: flex;
    gap: 8px;
}
.hc-portal__vital {
    flex: 1;
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 8px;
    padding: 7px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}
.hc-portal__vital-val {
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    font-weight: 700;
    color: #1e293b;
    font-variant-numeric: tabular-nums;
}
.hc-portal__vital-unit {
    font-size: 0.5rem;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
}

/* Notification bar */
.hc-portal__message {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    padding: 8px 12px;
}
.hc-portal__message-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #0ea5e9;
    flex-shrink: 0;
    animation: hcPulse 2s ease-in-out infinite;
}
@keyframes hcPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(14,165,233,.4); }
    50%       { box-shadow: 0 0 0 5px rgba(14,165,233,0); }
}
.hc-portal__message-text {
    flex: 1;
    font-size: 0.65rem;
    color: #0369a1;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hc-portal__message-badge {
    flex-shrink: 0;
    font-size: 0.5rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #fff;
    background: #0ea5e9;
    padding: 2px 7px;
    border-radius: var(--radius-full);
}

/* Footer trust bar */
.hc-portal__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 9px 14px;
    background: #fdf2f4;
    border-top: 1px solid #fce7f3;
    flex-wrap: wrap;
}
.hc-portal__footer-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.55rem;
    font-weight: 600;
    color: #be123c;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
}
.hc-portal__uptime-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 5px rgba(34,197,94,.5);
}


/* ══════════════════════════════════════════════════════════════════════════════
   CHALLENGES
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-challenges {
    padding: var(--section-padding) 0;
    background: var(--surface);
    position: relative;
}

.hc-challenges__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    margin-top: var(--space-12);
}
@media (min-width: 640px) {
    .hc-challenges__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .hc-challenges__grid { grid-template-columns: repeat(3, 1fr); }
}

.hc-challenge {
    padding: clamp(1.75rem, 3vw, 2.5rem);
    border-radius: var(--radius-xl);
    border: 1px solid var(--border-color);
    background: var(--surface);
    position: relative;
    overflow: hidden;
    transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.hc-challenge:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-xl);
}

.hc-challenge__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: var(--space-5);
}
.hc-challenge__icon {
    width: 52px; height: 52px;
    padding: 12px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
}
.hc-challenge__icon svg { width: 100%; height: 100%; }
.hc-challenge--rose   .hc-challenge__icon { background: #fff1f2; color: #e11d48; }
.hc-challenge--violet .hc-challenge__icon { background: #f5f3ff; color: #7c3aed; }
.hc-challenge--teal   .hc-challenge__icon { background: #f0fdfa; color: #0d9488; }

.hc-challenge__number {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 900;
    color: rgba(0,0,0,.04);
    line-height: 1;
}

.hc-challenge__title {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-3);
}

.hc-challenge__desc {
    font-size: var(--text-sm);
    line-height: 1.75;
    color: var(--text-secondary);
    margin-bottom: var(--space-5);
}

.hc-challenge__solve {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    line-height: 1.6;
    font-weight: 500;
}
.hc-challenge--rose   .hc-challenge__solve { background: #fff1f2; color: #9f1239; }
.hc-challenge--violet .hc-challenge__solve { background: #f5f3ff; color: #5b21b6; }
.hc-challenge--teal   .hc-challenge__solve { background: #f0fdfa; color: #115e59; }
.hc-challenge__solve svg { flex-shrink: 0; margin-top: 2px; }
.hc-challenge--rose   .hc-challenge__solve svg { stroke: #e11d48; }
.hc-challenge--violet .hc-challenge__solve svg { stroke: #7c3aed; }
.hc-challenge--teal   .hc-challenge__solve svg { stroke: #0d9488; }


/* ══════════════════════════════════════════════════════════════════════════════
   SOLUTIONS GRID
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-solutions {
    padding: var(--section-padding) 0;
    background: var(--surface-alt, #fafbfd);
    position: relative;
}

.hc-solutions__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    margin-top: var(--space-12);
}
@media (min-width: 640px) {
    .hc-solutions__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .hc-solutions__grid { grid-template-columns: repeat(3, 1fr); }
}

.hc-solution {
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border-radius: var(--radius-xl);
    border: 1px solid var(--border-color);
    background: var(--surface);
    transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.hc-solution:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-xl);
}

.hc-solution__icon {
    width: 56px; height: 56px;
    padding: 13px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-5);
}
.hc-solution__icon svg { width: 100%; height: 100%; }

.hc-solution--rose    .hc-solution__icon { background: #fff1f2; color: #e11d48; }
.hc-solution--violet  .hc-solution__icon { background: #f5f3ff; color: #7c3aed; }
.hc-solution--teal    .hc-solution__icon { background: #f0fdfa; color: #0d9488; }
.hc-solution--blue    .hc-solution__icon { background: #eff6ff; color: #2563eb; }
.hc-solution--emerald .hc-solution__icon { background: #ecfdf5; color: #059669; }
.hc-solution--amber   .hc-solution__icon { background: #fffbeb; color: #d97706; }

.hc-solution__title {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-3);
}

.hc-solution__desc {
    font-size: var(--text-sm);
    line-height: 1.75;
    color: var(--text-secondary);
    margin-bottom: var(--space-5);
}

.hc-solution__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.hc-solution__tag {
    display: inline-flex;
    padding: 4px 10px;
    border-radius: var(--radius-full);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: rgba(225,29,72,.07);
    color: #be123c;
}


/* ══════════════════════════════════════════════════════════════════════════════
   FEATURES BENTO
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-features {
    padding: var(--section-padding) 0;
    background: var(--surface);
    position: relative;
}

.hc-bento {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    margin-top: var(--space-12);
}
@media (min-width: 768px) {
    .hc-bento { grid-template-columns: repeat(3, 1fr); }
    .hc-bento__card--wide { grid-column: span 2; }
}

.hc-bento__card {
    position: relative;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border-radius: var(--radius-xl);
    border: 1px solid var(--border-color);
    background: var(--surface);
    transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
    overflow: hidden;
}
.hc-bento__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-xl);
}

/* Color token system */
.hc-bento__card--rose    { --bento-accent: #e11d48; --bento-bg: #fff1f2; }
.hc-bento__card--violet  { --bento-accent: #7c3aed; --bento-bg: #f5f3ff; }
.hc-bento__card--teal    { --bento-accent: #0d9488; --bento-bg: #f0fdfa; }
.hc-bento__card--blue    { --bento-accent: #2563eb; --bento-bg: #eff6ff; }
.hc-bento__card--emerald { --bento-accent: #059669; --bento-bg: #ecfdf5; }
.hc-bento__card--amber   { --bento-accent: #d97706; --bento-bg: #fffbeb; }

.hc-bento__icon {
    width: 56px; height: 56px;
    padding: 12px;
    border-radius: var(--radius-lg);
    background: var(--bento-bg, #fff1f2);
    color: var(--bento-accent, #e11d48);
    margin-bottom: var(--space-5);
    display: flex;
    align-items: center;
    justify-content: center;
}
.hc-bento__icon svg { width: 100%; height: 100%; }

.hc-bento__title {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-3);
}
.hc-bento__desc {
    font-size: var(--text-sm);
    line-height: 1.75;
    color: var(--text-secondary);
}

/* Gradient wide card — HL7/FHIR */
.hc-bento__card--gradient {
    background: linear-gradient(135deg, #be123c 0%, #7c3aed 100%);
    border-color: transparent;
    color: #fff;
}
.hc-bento__card--gradient .hc-bento__title { color: #fff; }
.hc-bento__card--gradient .hc-bento__desc  { color: rgba(255,255,255,.75); }
.hc-bento__card--gradient:hover { box-shadow: 0 24px 60px rgba(190,18,60,.3); }

.hc-bento__icon--light {
    background: rgba(255,255,255,.18);
    color: #fff;
}

.hc-bento__card-inner {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
@media (min-width: 768px) {
    .hc-bento__card-inner {
        flex-direction: row;
        align-items: flex-start;
    }
    .hc-bento__card-inner > div:first-child { flex: 1; min-width: 0; }
}

/* Healthcare standards pill grid */
.hc-bento__standards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    flex-shrink: 0;
    min-width: 180px;
}
@media (min-width: 768px) {
    .hc-bento__standards { grid-template-columns: repeat(3, 1fr); min-width: 260px; }
}
.hc-bento__standard {
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.12);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .25s;
}
.hc-bento__standard:hover { background: rgba(255,255,255,.22); }
.hc-bento__std-label {
    font-family: var(--font-mono, monospace);
    font-size: 0.62rem;
    font-weight: 700;
    color: rgba(255,255,255,.85);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-align: center;
}


/* ══════════════════════════════════════════════════════════════════════════════
   COMPLIANCE STRIP
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-compliance {
    padding: clamp(3rem, 6vw, 5rem) 0;
    background: #fff9fa;
    border-top: 1px solid #fce7f3;
    border-bottom: 1px solid #fce7f3;
    position: relative;
}

.hc-compliance__strip {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-5);
    margin-top: var(--space-10);
}
@media (min-width: 640px) {
    .hc-compliance__strip { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 900px) {
    .hc-compliance__strip { grid-template-columns: repeat(5, 1fr); }
}

.hc-compliance__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding: var(--space-5) var(--space-4);
    border-radius: var(--radius-xl);
    border: 1px solid var(--border-color);
    background: var(--surface);
    transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out);
}
.hc-compliance__item:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
}

.hc-compliance__icon {
    width: 48px; height: 48px;
    padding: 11px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
}
.hc-compliance__icon svg { width: 100%; height: 100%; }

.hc-compliance__item--blue    .hc-compliance__icon { background: #eff6ff; color: #2563eb; }
.hc-compliance__item--violet  .hc-compliance__icon { background: #f5f3ff; color: #7c3aed; }
.hc-compliance__item--rose    .hc-compliance__icon { background: #fff1f2; color: #e11d48; }
.hc-compliance__item--teal    .hc-compliance__icon { background: #f0fdfa; color: #0d9488; }
.hc-compliance__item--emerald .hc-compliance__icon { background: #ecfdf5; color: #059669; }

.hc-compliance__name {
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--text-primary);
}
.hc-compliance__detail {
    font-size: 0.68rem;
    color: var(--text-secondary);
    line-height: 1.4;
}


/* ══════════════════════════════════════════════════════════════════════════════
   IMPACT METRICS STRIP
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-metrics {
    padding: clamp(3.5rem, 7vw, 6rem) 0;
    background: linear-gradient(135deg, #be123c 0%, #9333ea 60%, #7c3aed 100%);
    position: relative;
    overflow: hidden;
}
.hc-metrics::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 28px 28px;
    pointer-events: none;
}

.hc-metrics__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
    position: relative;
    z-index: 1;
}
@media (min-width: 768px) {
    .hc-metrics__grid { grid-template-columns: repeat(4, 1fr); }
}

.hc-metric {
    text-align: center;
    padding: var(--space-6);
    border-radius: var(--radius-xl);
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.15);
    backdrop-filter: blur(10px);
    transition: background .3s;
}
.hc-metric:hover { background: rgba(255,255,255,.16); }

.hc-metric__icon {
    width: 44px; height: 44px;
    padding: 10px;
    border-radius: var(--radius-lg);
    margin: 0 auto var(--space-4);
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.15);
    color: #fff;
}
.hc-metric__icon svg { width: 100%; height: 100%; }

.hc-metric__value {
    font-family: var(--font-heading);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 900;
    color: #fff;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    margin-bottom: 6px;
}

.hc-metric__label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: rgba(255,255,255,.9);
    line-height: 1.4;
    margin-bottom: 4px;
}

.hc-metric__sub {
    font-size: 0.68rem;
    color: rgba(255,255,255,.55);
    line-height: 1.4;
}


/* ══════════════════════════════════════════════════════════════════════════════
   ESTIMATOR
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-estimator {
    padding: var(--section-padding) 0;
    background: var(--surface-alt, #fafbfd);
    position: relative;
}

.hc-estimator__body {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    margin-top: var(--space-12);
    align-items: start;
}
@media (min-width: 1024px) {
    .hc-estimator__body {
        grid-template-columns: 1fr 360px;
    }
}

/* Wizard card */
.hc-estimator__wizard {
    background: var(--surface);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-2xl);
    padding: clamp(1.75rem, 4vw, 3rem);
    box-shadow: var(--shadow-md);
}

/* Progress */
.hc-estimator__progress {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-bottom: var(--space-8);
}
.hc-estimator__step-dot {
    width: 32px; height: 32px;
    border-radius: 50%;
    border: 2px solid #e2e8f0;
    background: var(--surface);
    cursor: pointer;
    transition: all .25s var(--ease-out);
    flex-shrink: 0;
    position: relative;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hc-estimator__step-dot::after {
    content: '';
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #e2e8f0;
    transition: all .25s var(--ease-out);
}
.hc-estimator__step-dot--active {
    border-color: #e11d48;
    box-shadow: 0 0 0 4px rgba(225,29,72,.12);
}
.hc-estimator__step-dot--active::after { background: #e11d48; }
.hc-estimator__step-dot--done {
    border-color: #e11d48;
    background: #e11d48;
}
.hc-estimator__step-dot--done::after { background: #fff; width: 6px; height: 6px; }
.hc-estimator__step-line {
    flex: 1;
    height: 2px;
    background: #e2e8f0;
    max-width: 80px;
    transition: background .3s;
}

/* Questions */
.hc-estimator__questions { min-height: 260px; }

.hc-estimator__q-title {
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-2);
}
.hc-estimator__q-subtitle {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--space-6);
}

.hc-estimator__options {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
}
@media (min-width: 560px) {
    .hc-estimator__options { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
    .hc-estimator__options { grid-template-columns: repeat(3, 1fr); }
}

.hc-estimator__option {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: var(--space-4) var(--space-4);
    border-radius: var(--radius-lg);
    border: 2px solid var(--border-color);
    background: var(--surface);
    cursor: pointer;
    transition: all .2s var(--ease-out);
    text-align: left;
    position: relative;
}
.hc-estimator__option:hover {
    border-color: rgba(225,29,72,.35);
    box-shadow: 0 4px 18px rgba(225,29,72,.08);
    transform: translateY(-2px);
}
.hc-estimator__option--selected {
    border-color: #e11d48;
    background: #fff5f6;
    box-shadow: 0 4px 18px rgba(225,29,72,.12);
}

.hc-estimator__option-icon {
    font-size: 1.5rem;
    line-height: 1;
    margin-bottom: 4px;
}
.hc-estimator__option-label {
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
}
.hc-estimator__option-desc {
    font-size: 0.7rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* Nav */
.hc-estimator__nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--space-6);
    padding-top: var(--space-6);
    border-top: 1px solid var(--border-color);
}
.hc-estimator__step-counter {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-weight: 500;
}

/* Result panel */
.hc-estimator__result {
    margin-top: var(--space-6);
    padding: var(--space-6);
    border-radius: var(--radius-xl);
    background: linear-gradient(135deg, #fff1f2, #faf5ff);
    border: 1px solid rgba(225,29,72,.15);
    transition: all .4s var(--ease-out);
}
.hc-estimator__result--hidden {
    display: none;
}

.hc-estimator__result-header {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-5);
}
.hc-estimator__result-header svg { stroke: #e11d48; }

.hc-estimator__stats {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    margin-bottom: var(--space-4);
    flex-wrap: wrap;
}
.hc-estimator__stat { flex: 1; min-width: 120px; }
.hc-estimator__stat-label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #64748b;
    font-weight: 600;
    margin-bottom: 4px;
}
.hc-estimator__stat-value {
    font-family: var(--font-heading);
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    font-weight: 900;
    color: #be123c;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}
@keyframes hcStatFlash {
    0%, 100% { opacity: 1; }
    50%       { opacity: .4; }
}
.hc-estimator__stat-value--flash {
    animation: hcStatFlash .4s ease-in-out 2;
}
.hc-estimator__stat-divider {
    width: 1px; height: 50px;
    background: rgba(225,29,72,.15);
    flex-shrink: 0;
}

.hc-estimator__disclaimer {
    font-size: var(--text-xs);
    color: #64748b;
    line-height: 1.6;
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background: rgba(255,255,255,.7);
    border-radius: var(--radius-md);
    border: 1px solid rgba(225,29,72,.08);
}

.hc-estimator__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: var(--space-5);
    min-height: 28px;
}
.hc-estimator__summary-label {
    font-size: 0.7rem;
    font-weight: 600;
    color: #64748b;
    margin-right: 4px;
}
.hc-estimator__summary-tag {
    display: inline-flex;
    padding: 4px 10px;
    border-radius: var(--radius-full);
    background: rgba(225,29,72,.08);
    color: #be123c;
    font-size: 0.68rem;
    font-weight: 600;
}

.hc-estimator__result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: center;
}
.hc-estimator__result-actions .btn--ghost {
    font-size: var(--text-sm);
}

/* Sidebar */
.hc-estimator__sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
@media (min-width: 1024px) {
    .hc-estimator__sidebar { position: sticky; top: 100px; }
}

.hc-estimator__sidebar-card {
    background: var(--surface);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    padding: clamp(1.5rem, 3vw, 2rem);
    box-shadow: var(--shadow-sm);
}
.hc-estimator__sidebar-icon {
    width: 48px; height: 48px;
    padding: 11px;
    border-radius: var(--radius-lg);
    background: #fff1f2;
    color: #e11d48;
    margin-bottom: var(--space-4);
    display: flex;
    align-items: center;
    justify-content: center;
}
.hc-estimator__sidebar-icon svg { width: 100%; height: 100%; }

.hc-estimator__sidebar-title {
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: var(--space-3);
}
.hc-estimator__sidebar-desc {
    font-size: var(--text-sm);
    line-height: 1.7;
    color: var(--text-secondary);
    margin-bottom: var(--space-5);
}

.hc-estimator__checklist {
    list-style: none;
    padding: 0; margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.hc-estimator__checklist li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
}
.hc-estimator__checklist li::before {
    content: '';
    width: 18px; height: 18px;
    border-radius: 50%;
    background: #dcfce7;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='3' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-size: 10px 10px;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
    margin-top: 1px;
}

.hc-estimator__sidebar-contact {
    background: var(--surface);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    padding: var(--space-5);
    text-align: center;
}
.hc-estimator__sidebar-contact p {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--space-4);
}
.hc-estimator__sidebar-contact .btn--whatsapp {
    width: 100%;
    justify-content: center;
}


/* ══════════════════════════════════════════════════════════════════════════════
   FAQ
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-faq {
    padding: var(--section-padding) 0;
    background: var(--surface);
    position: relative;
}

.hc-faq__container {
    max-width: 860px;
}

.hc-faq__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    margin-top: var(--space-10);
}

.hc-faq__item {
    background: var(--surface);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: box-shadow .25s var(--ease-out);
}
.hc-faq__item[open] {
    box-shadow: var(--shadow-md);
    border-color: rgba(225,29,72,.2);
}

.hc-faq__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-6);
    cursor: pointer;
    list-style: none;
    font-family: var(--font-heading);
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--text-primary);
    user-select: none;
    transition: color .2s;
}
.hc-faq__q::-webkit-details-marker { display: none; }
.hc-faq__item[open] .hc-faq__q { color: #be123c; }

.hc-faq__chevron {
    flex-shrink: 0;
    transition: transform .3s var(--ease-out);
    color: #94a3b8;
}
.hc-faq__item[open] .hc-faq__chevron {
    transform: rotate(180deg);
    stroke: #e11d48;
}

.hc-faq__a {
    padding: 0 var(--space-6) var(--space-5);
}
.hc-faq__a p {
    font-size: var(--text-sm);
    line-height: 1.8;
    color: var(--text-secondary);
    border-top: 1px solid var(--border-color);
    padding-top: var(--space-4);
}


/* ══════════════════════════════════════════════════════════════════════════════
   CTA
   ══════════════════════════════════════════════════════════════════════════════ */
.hc-cta {
    position: relative;
    overflow: hidden;
    padding: clamp(5rem, 10vw, 8rem) 0;
    background: linear-gradient(135deg, #1e0a14 0%, #3b0764 45%, #1e1b4b 100%);
    color: #fff;
    text-align: center;
}

.hc-cta__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.hc-cta__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    opacity: .3;
}
.hc-cta__orb--1 { width: 600px; height: 600px; background: #be123c; top: -20%; left: -10%; }
.hc-cta__orb--2 { width: 500px; height: 500px; background: #7c3aed; bottom: -18%; right: -8%; }

.hc-cta__wave {
    position: absolute;
    top: 0; left: 0; right: 0;
    width: 100%;
    height: 80px;
}

.hc-cta .container { position: relative; z-index: 1; }

.hc-cta__inner {
    max-width: 700px;
    margin: 0 auto;
}

.hc-cta__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.2);
    color: rgba(255,255,255,.85);
    padding: 8px 20px;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: var(--space-6);
}

.hc-cta__title {
    font-family: var(--font-heading);
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: #fff;
    margin-bottom: var(--space-5);
}
.hc-cta__title span {
    background: linear-gradient(90deg, #fda4af, #d8b4fe);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hc-cta__desc {
    font-size: var(--text-lg);
    line-height: 1.7;
    color: rgba(255,255,255,.7);
    margin-bottom: var(--space-8);
}

.hc-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    justify-content: center;
    margin-bottom: var(--space-8);
}

.hc-cta__trust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 12px;
    font-size: 0.72rem;
    color: rgba(255,255,255,.45);
    font-weight: 500;
    letter-spacing: 0.02em;
}


/* ══════════════════════════════════════════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
   ══════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1023px) {
    .hc-hero__visual { order: -1; }
}

@media (max-width: 767px) {
    /* Proof bar: 2-col wrap */
    .hc-hero__proof {
        gap: var(--space-4);
        padding: var(--space-4);
    }
    .hc-hero__proof-number { font-size: var(--text-lg); }
    .hc-hero__proof-divider { display: none; }

    /* Bento: 1-col */
    .hc-bento { grid-template-columns: 1fr; }
    .hc-bento__card--wide { grid-column: span 1; }
    .hc-bento__card-inner { flex-direction: column; }

    /* Portal: cap height */
    .hc-portal { max-width: 100%; }

    /* Estimator: full width */
    .hc-estimator__body { gap: var(--space-6); }

    /* Metrics: 2-col */
    .hc-metrics__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }

    /* CTA actions stack */
    .hc-cta__actions { flex-direction: column; align-items: center; }
    .hc-cta__actions .btn { width: 100%; max-width: 360px; justify-content: center; }
}

@media (max-width: 639px) {
    .hc-hero__title { font-size: var(--text-4xl); }

    /* Proof bar: stack safely on narrow phones */
    .hc-hero__proof {
        flex-direction: column;
        gap: var(--space-3);
    }
    .hc-hero__proof-divider {
        display: block;
        width: 40px;
        height: 1px;
    }
    .hc-hero__proof-item {
        white-space: normal;
    }

    /* Challenges: 1-col */
    .hc-challenges__grid { grid-template-columns: 1fr; }

    /* Solution tags: smaller */
    .hc-solution__tag { font-size: 0.62rem; padding: 3px 8px; }

    /* Compliance: 2-col */
    .hc-compliance__strip { grid-template-columns: repeat(2, 1fr); }

    /* Estimator options: 1-col */
    .hc-estimator__options { grid-template-columns: 1fr; }

    /* Estimator stats: stack */
    .hc-estimator__stats { flex-direction: column; gap: var(--space-4); }
    .hc-estimator__stat-divider { display: none; }

    /* Metrics: 1-col on very small screens */
    .hc-metrics__grid { grid-template-columns: 1fr; }
}

@media (max-width: 479px) {
    .hc-hero { padding-top: 5rem; }
    .hc-portal__vitals { gap: 5px; }
    .hc-portal__vital { padding: 6px 5px; }
    .hc-portal__vital-val { font-size: 0.65rem; }
    .hc-estimator__q-title { font-size: var(--text-xl); }
    .hc-estimator__stat-value { font-size: 1.75rem; }
    .hc-cta__trust { gap: 4px 8px; }
}