/* ============================================================
   CAREPOINT CLINIC — Healthcare Basic Styles (Basic Tier)
   Theme: Light clean (#f0f9f7) / medical teal (#0d9488) / navy (#0f172a)
   ============================================================ */

body { font-family:'Inter','Helvetica Neue',sans-serif; background:#f8fffe; color:#1e293b; }
h1,h2,h3,h4 { font-family:'DM Sans','Inter',sans-serif; }

.site-nav { position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 0;background:rgba(248,255,254,0.96);backdrop-filter:blur(16px);box-shadow:0 1px 20px rgba(13,148,136,0.08);transition:all 0.3s; }
.site-nav.scrolled { box-shadow:0 2px 30px rgba(13,148,136,0.12); }
.nav-inner { max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;align-items:center;justify-content:space-between; }
.nav-logo { font-size:1.35rem;font-weight:800;color:#0f172a; }
.nav-logo span { color:#0d9488; }
.nav-links { display:flex;gap:2.5rem;list-style:none; }
.nav-links a { font-size:0.85rem;font-weight:500;color:#475569;transition:color 0.3s; }
.nav-links a:hover,.nav-links a.active { color:#0d9488; }
.nav-cta { background:linear-gradient(90deg,#0d9488,#0f766e);color:#fff;padding:0.55rem 1.4rem;border-radius:8px;font-size:0.82rem;font-weight:600;transition:opacity 0.3s; }
.nav-cta:hover { opacity:0.88; }
.hamburger { background:none;border:none;cursor:pointer;display:none;flex-direction:column;gap:5px;padding:4px; }
.hamburger span { width:22px;height:2px;background:#0d9488;display:block; }
.mobile-nav { list-style:none;max-height:0;overflow:hidden;background:#f8fffe;border-top:1px solid rgba(13,148,136,0.1);transition:max-height 0.4s; }
.mobile-nav.open { max-height:300px;padding:1rem 0; }
.mobile-nav li a { display:block;padding:0.9rem 1.5rem;font-size:0.85rem;color:#475569;border-bottom:1px solid rgba(13,148,136,0.06); }
.mobile-nav li a:hover { color:#0d9488; }

.hero-section { position:relative;min-height:100vh;background:linear-gradient(135deg,#f0f9f7,#e8f5f3,#f0f9f7);display:flex;align-items:center;overflow:hidden; }
.hero-canvas-wrap { position:absolute;inset:0;z-index:0;opacity:0.15; }
.hero-content { position:relative;z-index:2;padding-top:80px;padding-left:5vw;max-width:660px; }
.hero-badge { display:inline-flex;align-items:center;gap:0.5rem;background:#e6f7f5;border:1px solid rgba(13,148,136,0.25);color:#0d9488;font-size:0.75rem;letter-spacing:1px;padding:0.4rem 1rem;border-radius:20px;margin-bottom:1.5rem;font-weight:600; }
.hero-title { font-size:clamp(2.5rem,6vw,4.5rem);color:#0f172a;font-weight:800;line-height:1.05;letter-spacing:-2px;margin-bottom:1.2rem; }
.hero-title span { color:#0d9488; }
.hero-sub { font-size:1rem;color:#64748b;line-height:1.78;margin-bottom:2.5rem;max-width:500px; }
.hero-cta { display:flex;gap:1rem;flex-wrap:wrap; }
.btn-primary { background:linear-gradient(90deg,#0d9488,#0f766e);color:#fff;padding:0.9rem 2rem;border-radius:10px;font-size:0.88rem;font-weight:700;transition:all 0.3s;display:inline-block; }
.btn-primary:hover { transform:translateY(-2px);box-shadow:0 8px 25px rgba(13,148,136,0.3); }
.btn-outline { border:2px solid #0d9488;color:#0d9488;padding:0.9rem 2rem;border-radius:10px;font-size:0.88rem;font-weight:600;transition:all 0.3s;display:inline-block;background:transparent; }
.btn-outline:hover { background:#0d9488;color:#fff; }
.trust-badges { display:flex;gap:2rem;margin-top:3rem;flex-wrap:wrap; }
.trust-item { display:flex;align-items:center;gap:0.5rem;font-size:0.82rem;color:#64748b;font-weight:500; }
.trust-item span.icon { font-size:1.2rem; }

.section { padding:6rem 0; }
.section-alt { background:#f0f9f7; }
.container { max-width:1200px;margin:0 auto;padding:0 2rem; }
.section-label { font-size:0.7rem;letter-spacing:3px;text-transform:uppercase;color:#0d9488;font-weight:700;margin-bottom:0.8rem;display:block; }
.section-title { font-size:clamp(1.9rem,4vw,3rem);color:#0f172a;font-weight:800;line-height:1.15;margin-bottom:1rem;letter-spacing:-0.5px; }
.section-sub { color:#64748b;line-height:1.8;font-size:0.92rem;max-width:540px; }
.section-header { text-align:center;margin-bottom:4rem; }
.section-header .section-sub { margin:0 auto; }

.services-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem; }
.service-card { background:#fff;border:1px solid rgba(13,148,136,0.1);border-radius:16px;padding:2rem;transition:all 0.3s;box-shadow:0 2px 10px rgba(0,0,0,0.04); }
.service-card:hover { transform:translateY(-4px);border-color:rgba(13,148,136,0.25);box-shadow:0 12px 35px rgba(13,148,136,0.1); }
.service-icon { width:56px;height:56px;background:linear-gradient(135deg,#e6f7f5,#c5ede9);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.8rem;margin-bottom:1.2rem; }
.service-title { font-size:1.05rem;color:#0f172a;font-weight:700;margin-bottom:0.5rem; }
.service-desc { font-size:0.83rem;color:#64748b;line-height:1.65; }
.service-link { font-size:0.8rem;color:#0d9488;font-weight:600;margin-top:0.8rem;display:inline-block; }

.stats-bar { background:#0d9488;padding:3.5rem 0; }
.stats-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;text-align:center; }
.stat-num { display:block;font-size:2.6rem;color:#fff;font-weight:800; }
.stat-label { font-size:0.65rem;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.65); }

.doctors-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2rem; }
.doctor-card { background:#fff;border:1px solid rgba(13,148,136,0.1);border-radius:16px;padding:2rem;text-align:center;box-shadow:0 2px 12px rgba(0,0,0,0.04);transition:all 0.3s; }
.doctor-card:hover { transform:translateY(-3px);box-shadow:0 10px 30px rgba(13,148,136,0.1); }
.doctor-avatar { width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#0d9488,#0f766e);display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 1rem; }
.doctor-name { font-size:1rem;color:#0f172a;font-weight:700;margin-bottom:0.2rem; }
.doctor-spec { font-size:0.75rem;color:#0d9488;font-weight:600;letter-spacing:0.5px; }
.doctor-exp { font-size:0.78rem;color:#94a3b8;margin-top:0.3rem; }

.t-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem; }
.t-card { background:#fff;border:1px solid rgba(13,148,136,0.1);border-radius:14px;padding:2rem;box-shadow:0 2px 10px rgba(0,0,0,0.03); }
.t-stars { color:#f59e0b;font-size:0.85rem;margin-bottom:0.8rem; }
.t-card p { font-size:0.88rem;color:#475569;line-height:1.8;font-style:italic;margin-bottom:1rem; }
.t-name { font-size:0.8rem;font-weight:700;color:#0d9488; }
.t-role { font-size:0.72rem;color:#94a3b8; }

.cta-banner { padding:7rem 0;text-align:center;background:linear-gradient(135deg,#0f766e,#0d9488); }
.cta-banner h2 { font-size:clamp(2rem,4vw,3.2rem);color:#fff;font-weight:800;margin-bottom:1rem;letter-spacing:-0.5px; }
.cta-banner p { color:rgba(255,255,255,0.75);margin-bottom:2.5rem;font-size:0.92rem; }
.btn-cta-white { background:#fff;color:#0d9488;padding:1rem 2.5rem;border-radius:10px;font-size:0.9rem;font-weight:700;display:inline-block;transition:all 0.3s; }
.btn-cta-white:hover { transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,0.15); }

.site-footer { background:#0f172a;color:#94a3b8;padding:5rem 0 2rem; }
.footer-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:3rem;margin-bottom:3.5rem; }
.footer-brand { font-size:1.3rem;font-weight:800;color:#fff;margin-bottom:0.8rem; }
.footer-brand span { color:#0d9488; }
.footer-desc { font-size:0.82rem;color:#64748b;line-height:1.8; }
.footer-grid h4 { font-size:0.68rem;letter-spacing:2px;text-transform:uppercase;color:#475569;font-weight:600;margin-bottom:1.2rem; }
.footer-grid ul { list-style:none; }
.footer-grid ul li a { font-size:0.82rem;color:#64748b;line-height:2.4;transition:color 0.3s; }
.footer-grid ul li a:hover { color:#0d9488; }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.06);padding-top:1.5rem;text-align:center;font-size:0.75rem;color:#475569; }

.page-hero { background:linear-gradient(135deg,#f0f9f7,#e8f5f3);padding:10rem 0 5rem;text-align:center;border-bottom:2px solid rgba(13,148,136,0.1); }
.page-hero h1 { font-size:clamp(2.2rem,5vw,3.8rem);color:#0f172a;font-weight:800;letter-spacing:-1px;margin-bottom:1rem; }
.page-hero h1 span { color:#0d9488; }
.page-hero p { color:#64748b;font-size:1rem;max-width:500px;margin:0 auto; }

.contact-grid { display:grid;grid-template-columns:1fr 1.5fr;gap:4rem;align-items:start; }
.contact-info h3 { font-size:1.5rem;color:#0f172a;font-weight:700;margin-bottom:1.5rem; }
.contact-item { display:flex;gap:1rem;margin-bottom:1.5rem;align-items:flex-start; }
.contact-icon { font-size:1.5rem;flex-shrink:0; }
.contact-item h4 { font-size:0.78rem;color:#0d9488;font-weight:700;letter-spacing:1px;margin-bottom:0.2rem; }
.contact-item p { font-size:0.84rem;color:#64748b; }
.contact-form-wrap { background:#fff;border:1px solid rgba(13,148,136,0.15);border-radius:16px;padding:2.5rem;box-shadow:0 4px 20px rgba(13,148,136,0.08); }
.form-group { margin-bottom:1.4rem; }
.form-group label { display:block;font-size:0.8rem;font-weight:600;color:#374151;margin-bottom:0.5rem; }
.form-group input,.form-group textarea,.form-group select { width:100%;background:#f8fffe;border:1.5px solid rgba(13,148,136,0.15);border-radius:8px;padding:0.85rem 1rem;font-size:0.88rem;color:#1e293b;font-family:'Inter',sans-serif;transition:border-color 0.3s;outline:none; }
.form-group input:focus,.form-group textarea:focus { border-color:#0d9488;background:#fff; }
.form-group textarea { height:130px;resize:vertical; }
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:1rem; }
.btn-submit { background:linear-gradient(90deg,#0d9488,#0f766e);color:#fff;border:none;padding:1rem 2rem;border-radius:10px;font-size:0.9rem;font-weight:700;cursor:pointer;width:100%;transition:all 0.3s; }
.btn-submit:hover { opacity:0.88;transform:translateY(-1px); }

.scroll-progress { position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,#0d9488,#34d399);z-index:9999;width:0%; }
.back-to-top { position:fixed;bottom:2rem;right:2rem;width:44px;height:44px;background:linear-gradient(135deg,#0d9488,#0f766e);border:none;border-radius:50%;color:#fff;font-size:1.1rem;cursor:pointer;z-index:500;opacity:0;transform:translateY(10px);transition:all 0.3s;display:flex;align-items:center;justify-content:center; }
.back-to-top.visible { opacity:1;transform:translateY(0); }

@media(max-width:768px) { .nav-links,.nav-cta{display:none} .hamburger{display:flex} .contact-grid{grid-template-columns:1fr} .form-row{grid-template-columns:1fr} }