/* ============================================================
   STOIC HEALTHCARE — style.css
   Core design system: variables, typography, layout, utilities
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=Playfair+Display:wght@600;700;800&display=swap');

/* ── VARIABLES ── */
:root {
  --primary:       #1a3a6b;
  --primary-dark:  #0f2240;
  --secondary:     #2196d3;
  --teal:          #4ecdc4;
  --teal-light:    #7ee8e2;
  --wa-green:      #25D366;
  --white:         #ffffff;
  --light:         #f4f8ff;
  --text:          #354a6b;
  --muted:         #6b82a3;
  --grad:          linear-gradient(135deg, #1a3a6b 0%, #2196d3 60%, #4ecdc4 100%);
  --grad-teal:     linear-gradient(135deg, #2196d3 0%, #4ecdc4 100%);
  --grad-text:     linear-gradient(135deg, #2196d3, #4ecdc4);
  --shadow-sm:     0 4px 16px rgba(26, 58, 107, 0.08);
  --shadow:        0 8px 32px rgba(33, 150, 211, 0.15);
  --shadow-lg:     0 20px 60px rgba(26, 58, 107, 0.20);
  --radius:        16px;
  --radius-sm:     10px;
  --transition:    all 0.3s ease;
}

/* ── RESETS ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'DM Sans', sans-serif;
  color: var(--text);
  background: #fff;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
body.loader-active { overflow: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; transition: var(--transition); }
p { line-height: 1.82; }
h1,h2,h3,h4,h5,h6 { font-family: 'Playfair Display', serif; color: var(--primary-dark); line-height: 1.15; }

/* ── UTILITIES ── */
.bg-grad      { background: var(--grad); }
.text-teal    { color: var(--teal) !important; }
.text-grad    { background: var(--grad-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.section-pad  { padding: 5rem 0; }

/* ── SECTION HEADERS ── */
.section-badge {
  display: inline-flex; align-items: center; gap: .4rem;
  background: rgba(33,150,211,.09); border: 1px solid rgba(33,150,211,.2);
  color: var(--secondary); font-size: .73rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .14em;
  padding: .35rem .9rem; border-radius: 50px; margin-bottom: .85rem;
}
.section-badge.light { background: rgba(78,205,196,.15); border-color: rgba(78,205,196,.3); color: #7ee8e2; }
.section-title { font-size: clamp(1.75rem, 3.5vw, 2.65rem); margin-bottom: .9rem; }
.section-sub   { color: var(--muted); font-size: 1rem; line-height: 1.85; max-width: 580px; }
.divider-grad  { width: 50px; height: 4px; border-radius: 2px; background: var(--grad-teal); margin: 1rem 0 1.5rem; }

/* ── LOADER ── */
#pageLoader {
  position: fixed; inset: 0; z-index: 9999; background: #0f2240;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  transition: opacity .65s ease, visibility .65s ease;
}
#pageLoader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-logo-wrap {
  position: relative; width: 130px; height: 130px;
  display: flex; align-items: center; justify-content: center; margin-bottom: 2rem;
}
.loader-s {
  font-family: 'Playfair Display', serif; font-size: 4.2rem; font-weight: 800;
  background: linear-gradient(135deg, #2196d3, #4ecdc4);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  animation: loaderPulse .9s ease-in-out infinite;
}
@keyframes loaderPulse {
  0%,100% { transform: scale(1); filter: brightness(1); }
  50%     { transform: scale(1.1); filter: brightness(1.4); }
}
.hr1 { position:absolute; inset:-10px; border:2px solid rgba(78,205,196,.5); border-radius:50%; animation:rp .9s ease-out infinite; }
.hr2 { position:absolute; inset:-24px; border:2px solid rgba(33,150,211,.3); border-radius:50%; animation:rp .9s ease-out infinite .18s; }
.hr3 { position:absolute; inset:-40px; border:1.5px solid rgba(33,150,211,.15); border-radius:50%; animation:rp .9s ease-out infinite .36s; }
@keyframes rp { 0%{transform:scale(1);opacity:1;} 100%{transform:scale(1.6);opacity:0;} }
.ecg-loader { width:300px; height:64px; margin-bottom:1.5rem; filter:drop-shadow(0 0 6px rgba(78,205,196,.4)); }
.ecg-path { stroke-dasharray:700; stroke-dashoffset:700; animation:drawEcg 1.4s ease-in-out infinite; }
@keyframes drawEcg { 0%{stroke-dashoffset:700;opacity:1;} 75%{stroke-dashoffset:0;opacity:1;} 100%{stroke-dashoffset:0;opacity:0;} }
.loader-brand { color:rgba(255,255,255,.85); font-size:.95rem; font-weight:700; letter-spacing:.25em; text-transform:uppercase; }
.loader-sub   { color:rgba(255,255,255,.4); font-size:.75rem; letter-spacing:.08em; margin-top:.3rem; }
.loader-bar   { width:220px; height:3px; background:rgba(255,255,255,.1); border-radius:2px; overflow:hidden; margin-top:1.5rem; }
.loader-bar-fill { height:100%; background:var(--grad-teal); border-radius:2px; width:0; animation:barFill 2.8s ease-out forwards; }
@keyframes barFill { 0%{width:0;} 60%{width:70%;} 85%{width:90%;} 100%{width:100%;} }

/* ── BUTTONS ── */
.btn-primary-grad {
  background: var(--grad-teal); color: #fff; padding: .85rem 2rem;
  border-radius: 50px; font-weight: 700; font-size: .95rem; border: none;
  display: inline-flex; align-items: center; gap: .5rem;
  box-shadow: 0 8px 24px rgba(33,150,211,.38); transition: var(--transition);
  cursor: pointer; font-family: 'DM Sans', sans-serif;
}
.btn-primary-grad:hover { transform:translateY(-3px); box-shadow:0 14px 36px rgba(33,150,211,.48); color:#fff; }

.btn-outline-white {
  background:transparent; color:#fff; padding:.85rem 2rem; border-radius:50px;
  font-weight:600; font-size:.95rem; border:2px solid rgba(255,255,255,.4);
  display:inline-flex; align-items:center; gap:.5rem; transition:var(--transition);
}
.btn-outline-white:hover { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.8); color:#fff; transform:translateY(-3px); }

.btn-wa { background:var(--wa-green); color:#fff; padding:.55rem 1.25rem; border-radius:50px; font-size:.85rem; font-weight:700; border:none; display:inline-flex; align-items:center; gap:.45rem; text-decoration:none; transition:var(--transition); box-shadow:0 4px 14px rgba(37,211,102,.32); }
.btn-wa:hover { background:#1ebe5d; transform:translateY(-2px); color:#fff; }

.btn-call { background:var(--grad-teal); color:#fff; padding:.55rem 1.25rem; border-radius:50px; font-size:.85rem; font-weight:700; border:none; display:inline-flex; align-items:center; gap:.45rem; text-decoration:none; transition:var(--transition); box-shadow:0 4px 14px rgba(33,150,211,.32); }
.btn-call:hover { opacity:.9; transform:translateY(-2px); color:#fff; }

/* ── FORMS ── */
.form-control, .form-select {
  border: 1.5px solid rgba(33,150,211,.18); border-radius:var(--radius-sm);
  padding:.72rem 1rem; font-size:.93rem; font-family:'DM Sans',sans-serif;
  transition:var(--transition); background:#fff; color:var(--text);
}
.form-control:focus, .form-select:focus { border-color:var(--secondary); box-shadow:0 0 0 3px rgba(33,150,211,.12); outline:none; }
.form-label { font-size:.85rem; font-weight:600; color:var(--primary); margin-bottom:.35rem; }
.btn-form-submit {
  width:100%; background:var(--grad-teal); color:#fff; border:none;
  padding:.9rem 2rem; border-radius:50px; font-weight:700; font-size:.97rem;
  font-family:'DM Sans',sans-serif; cursor:pointer; transition:var(--transition);
}
.btn-form-submit:hover { opacity:.9; transform:translateY(-2px); box-shadow:0 8px 24px rgba(33,150,211,.38); }
.form-success { display:none; background:rgba(37,211,102,.1); border:1px solid rgba(37,211,102,.35); color:#1a7a42; border-radius:var(--radius-sm); padding:1rem; font-weight:600; text-align:center; margin-top:1rem; font-size:.9rem; }

/* ── CONTACT CARDS ── */
.contact-info-card { background:#fff; border-radius:var(--radius); padding:1.4rem; box-shadow:var(--shadow-sm); border:1px solid rgba(33,150,211,.08); display:flex; align-items:flex-start; gap:1rem; transition:var(--transition); }
.contact-info-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.ci-icon { width:48px; height:48px; min-width:48px; border-radius:12px; background:rgba(33,150,211,.09); display:flex; align-items:center; justify-content:center; font-size:1.3rem; color:var(--secondary); }
.ci-title { font-weight:700; font-size:.92rem; color:var(--primary-dark); margin-bottom:.2rem; }
.ci-val { color:var(--muted); font-size:.86rem; line-height:1.65; }

/* ── FLOATING BUTTONS ── */
.wa-float { position:fixed; bottom:1.5rem; left:1.5rem; background:var(--wa-green); color:#fff; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(37,211,102,.48); z-index:998; text-decoration:none; transition:var(--transition); animation:waPulse 2.5s ease-in-out infinite; }
@keyframes waPulse { 0%,100%{box-shadow:0 4px 20px rgba(37,211,102,.48);} 50%{box-shadow:0 4px 32px rgba(37,211,102,.75),0 0 0 12px rgba(37,211,102,.1);} }
.wa-float:hover { transform:scale(1.1); color:#fff; animation:none; box-shadow:0 8px 28px rgba(37,211,102,.6); }
.scroll-top-btn { position:fixed; bottom:1.5rem; right:1.5rem; background:var(--grad-teal); color:#fff; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(33,150,211,.38); z-index:998; cursor:pointer; border:none; opacity:0; transform:translateY(16px); transition:var(--transition); }
.scroll-top-btn.visible { opacity:1; transform:translateY(0); }
.scroll-top-btn:hover { transform:translateY(-3px); opacity:1; }

/* ── TICKER ── */
.ticker-wrap { background:rgba(33,150,211,.06); border-bottom:1px solid rgba(33,150,211,.12); padding:.55rem 0; overflow:hidden; }
.ticker-inner { display:flex; gap:3rem; animation:tickerMove 30s linear infinite; white-space:nowrap; width:max-content; }
.ticker-item { font-size:.8rem; font-weight:600; color:var(--secondary); display:inline-flex; align-items:center; gap:.4rem; }
@keyframes tickerMove { from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ── ECG HERO DECORATION ── */
.ecg-hero-deco { position:absolute; bottom:0; left:0; right:0; opacity:.07; pointer-events:none; }

/* ── HERO FLOAT BADGES ── */
.hero-float { position:absolute; background:#fff; border-radius:14px; padding:.85rem 1.2rem; box-shadow:0 8px 32px rgba(0,0,0,.15); display:flex; align-items:center; gap:.75rem; animation:floatY 3s ease-in-out infinite; }
.hero-float.f1 { bottom:-1rem; left:-2rem; animation-delay:0s; }
.hero-float.f2 { top:1rem; right:-1.5rem; animation-delay:1.5s; }
@keyframes floatY { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);} }
.hero-float .fi-icon { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.hero-float .fi-val { font-weight:700; font-size:1rem; color:var(--primary-dark); }
.hero-float .fi-lbl { font-size:.7rem; color:var(--muted); }

/* ── PROCESS CARDS ── */
.process-card { background:#fff; border-radius:var(--radius); padding:2rem 1.5rem; box-shadow:var(--shadow-sm); text-align:center; border-top:4px solid var(--teal); height:100%; transition:var(--transition); }
.process-card:hover { transform:translateY(-6px); box-shadow:var(--shadow); }
.process-card .p-num { font-family:'Playfair Display',serif; font-size:2.8rem; color:rgba(33,150,211,.12); line-height:1; margin-bottom:-.3rem; }
.process-card .p-icon { font-size:2rem; margin-bottom:.9rem; }
.process-card h5 { font-size:1rem; margin-bottom:.4rem; }
.process-card p { color:var(--muted); font-size:.85rem; }

/* ── CTA BANNER ── */
.cta-banner { background:var(--grad); border-radius:24px; padding:3.5rem; position:relative; overflow:hidden; }
.cta-banner::before { content:''; position:absolute; top:-60px; right:-60px; width:320px; height:320px; background:rgba(78,205,196,.15); border-radius:50%; filter:blur(60px); }
.cta-banner h2 { color:#fff; } .cta-banner p { color:rgba(255,255,255,.75); }

/* ── STATS STRIP ── */
.stats-strip { background:var(--grad-teal); border-radius:var(--radius); padding:2.5rem; }
.stat-item .stat-num { font-family:'Playfair Display',serif; font-size:2.8rem; color:#fff; font-weight:700; line-height:1; }
.stat-item .stat-lbl { color:rgba(255,255,255,.78); font-size:.85rem; margin-top:.3rem; }

/* ── PARALLAX ── */
.parallax-section { position:relative; overflow:hidden; min-height:480px; display:flex; align-items:center; }
.parallax-bg { position:absolute; inset:-12%; width:124%; height:124%; object-fit:cover; will-change:transform; }
.parallax-overlay { position:absolute; inset:0; background:rgba(10,26,53,.84); }

/* ── FAQ ── */
.faq-item { background:#fff; border-radius:var(--radius-sm); padding:1.35rem 1.4rem; box-shadow:var(--shadow-sm); border:1px solid rgba(33,150,211,.08); margin-bottom:.85rem; cursor:pointer; transition:var(--transition); }
.faq-item:hover { box-shadow:var(--shadow); }
.faq-q { font-weight:700; font-size:.95rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; color:var(--primary-dark); }
.faq-icon { color:var(--secondary); font-size:1.2rem; transition:transform .3s ease; flex-shrink:0; }
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-a { color:var(--muted); font-size:.88rem; line-height:1.75; max-height:0; overflow:hidden; transition:max-height .35s ease, padding .3s ease; }
.faq-item.open .faq-a { max-height:250px; padding-top:.8rem; }

/* ── AWARD BADGES ── */
.award-badge { display:flex; align-items:center; gap:1rem; background:#fff; border-radius:var(--radius-sm); padding:1.2rem; box-shadow:var(--shadow-sm); margin-bottom:1rem; transition:var(--transition); }
.award-badge:hover { transform:translateX(5px); box-shadow:var(--shadow); }
.award-badge .ab-icon { font-size:2rem; }
.award-badge h6 { font-size:.92rem; font-weight:700; margin-bottom:.1rem; }
.award-badge p { font-size:.8rem; color:var(--muted); margin:0; }

/* ── TIMELINE ── */
.timeline { position:relative; padding-left:2.5rem; }
.timeline::before { content:''; position:absolute; left:.85rem; top:.3rem; bottom:0; width:2px; background:linear-gradient(to bottom, var(--secondary), var(--teal)); }
.tl-item { position:relative; margin-bottom:2.5rem; }
.tl-dot { position:absolute; left:-2.5rem; top:.25rem; width:18px; height:18px; background:var(--grad-teal); border-radius:50%; border:3px solid #fff; box-shadow:0 0 0 3px rgba(33,150,211,.3); }
.tl-year { font-size:.77rem; font-weight:700; color:var(--secondary); text-transform:uppercase; letter-spacing:.1em; margin-bottom:.3rem; }
.tl-item h5 { font-size:1rem; margin-bottom:.3rem; }
.tl-item p { color:var(--muted); font-size:.87rem; line-height:1.7; }

/* ── VALUE + WHY + TEAM + TESTI ── */
.value-card { background:#fff; border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow-sm); border-left:4px solid var(--teal); height:100%; transition:var(--transition); }
.value-card:hover { transform:translateX(6px); box-shadow:var(--shadow); }
.value-card .vc-icon { font-size:2rem; margin-bottom:.8rem; }
.value-card h5 { font-size:1.1rem; margin-bottom:.4rem; }
.value-card p { color:var(--muted); font-size:.88rem; line-height:1.7; }

.why-card { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius); padding:1.6rem; transition:var(--transition); height:100%; }
.why-card:hover { background:rgba(255,255,255,.12); transform:translateY(-4px); }
.why-card .wc-icon { width:48px; height:48px; background:rgba(78,205,196,.15); border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1rem; }
.why-card h5 { color:#fff; font-size:1.05rem; margin-bottom:.4rem; }
.why-card p { color:rgba(255,255,255,.6); font-size:.87rem; line-height:1.7; }

.team-card { background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); text-align:center; transition:var(--transition); height:100%; }
.team-card:hover { transform:translateY(-6px); box-shadow:var(--shadow); }
.team-card .tc-img { height:220px; overflow:hidden; }
.team-card .tc-img img { width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .5s ease; }
.team-card:hover .tc-img img { transform:scale(1.05); }
.team-card .tc-body { padding:1.3rem; }
.team-card h5 { font-size:1.05rem; margin-bottom:.2rem; }
.team-card .tc-role { color:var(--secondary); font-size:.82rem; font-weight:600; }
.team-card p { color:var(--muted); font-size:.82rem; margin-top:.4rem; line-height:1.6; }

.testi-card { background:#fff; border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow-sm); border:1px solid rgba(33,150,211,.08); height:100%; }
.testi-stars { color:#f59e0b; font-size:1rem; margin-bottom:.75rem; }
.testi-text { color:var(--text); font-size:.92rem; line-height:1.85; font-style:italic; margin-bottom:1.2rem; position:relative; padding-left:.5rem; }
.testi-text::before { content:'"'; font-family:'Playfair Display',serif; font-size:4rem; color:rgba(33,150,211,.1); position:absolute; top:-.8rem; left:-.5rem; line-height:1; }
.testi-author { display:flex; align-items:center; gap:.75rem; }
.testi-av { width:44px; height:44px; border-radius:50%; background:var(--grad-teal); display:flex; align-items:center; justify-content:center; font-weight:700; color:#fff; font-size:1rem; flex-shrink:0; }
.testi-name { font-weight:700; font-size:.9rem; color:var(--primary-dark); }
.testi-role { font-size:.78rem; color:var(--muted); }

/* ── FOOTER ── */
#mainFooter { background:#07122a; color:rgba(255,255,255,.6); padding-top:4rem; }
#mainFooter h6 { color:#fff; font-size:.82rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em; margin-bottom:1.2rem; font-family:'DM Sans',sans-serif; }
#mainFooter a { color:rgba(255,255,255,.55); font-size:.87rem; display:block; margin-bottom:.45rem; }
#mainFooter a:hover { color:var(--teal); }
.footer-social a { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.6); text-decoration:none; transition:var(--transition); margin-right:.4rem; margin-top:.25rem; }
.footer-social a:hover { background:var(--teal); border-color:var(--teal); color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.07); margin-top:3rem; padding:1.5rem 0; font-size:.82rem; }

/* ── SWIPER OVERRIDES ── */
.swiper-button-next, .swiper-button-prev { color:#fff !important; background:rgba(255,255,255,.12); width:44px !important; height:44px !important; border-radius:50%; backdrop-filter:blur(8px); transition:var(--transition); }
.swiper-button-next::after, .swiper-button-prev::after { font-size:1rem !important; font-weight:900; }
.swiper-button-next:hover, .swiper-button-prev:hover { background:var(--secondary); }
.swiper-pagination-bullet { background:rgba(255,255,255,.5) !important; opacity:1 !important; width:8px !important; height:8px !important; }
.swiper-pagination-bullet-active { background:#4ecdc4 !important; width:24px !important; border-radius:4px !important; }

/* ── EMERGENCY STRIP ── */
.emergency-strip { background:linear-gradient(135deg,#e55a2b,#f59e0b); border-radius:var(--radius); padding:2rem; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; }
.emergency-strip h4 { color:#fff; margin-bottom:.3rem; }
.emergency-strip p { color:rgba(255,255,255,.85); font-size:.9rem; margin:0; }