:root{
  --teal:#0ea5a5; --teal-dark:#0c7c86; --ink:#0b1324; --muted:#6b7280;
  --soft:#f6f8fc; --shadow:0 10px 30px rgba(2,8,23,.08); --r:18px;
}
*{box-sizing:border-box} html,body{margin:0;background:#fff;color:var(--ink);
  font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;text-decoration:none} img{max-width:100%;display:block}
.container{max-width:1180px;margin:0 auto;padding:0 22px}
.header{position:sticky;top:0;background:#fff;border-bottom:1px solid #eef2f7;z-index:50}
.nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0}
.brand{display:flex;gap:10px;align-items:center;font-weight:800}
.brand img{width:48px;height:48px;object-fit:contain}
.links{display:flex;gap:12px;flex-wrap:wrap}
.btn{padding:10px 14px;border-radius:12px;border:1px solid #e5e7eb;background:#fff;box-shadow:var(--shadow)}
.btn.primary{background:linear-gradient(135deg,var(--teal),var(--teal-dark));color:#fff;border-color:transparent}
.btn.call{background:linear-gradient(135deg,#10b981,#06b6d4);color:#fff;border-color:transparent}
.btn.whatsapp{background:#25D366;color:#fff;border-color:#25D366}
.pill{display:inline-block;padding:6px 12px;border-radius:999px;background:#eef9fa;border:1px solid #dff3f6;color:#0c7c86;font-size:13px}
.hero-wrap{background:url('assets/hero-shared.jpg') center/cover no-repeat;min-height:52vh;display:flex;align-items:center}
.hero-card{background:rgba(255,255,255,.95);backdrop-filter:blur(4px);border:1px solid #eef2f7;border-radius:var(--r);padding:22px;box-shadow:var(--shadow);max-width:820px;margin:28px}
.hero-card h1{margin:8px 0 10px 0;font-size:48px}
.hero-card p{margin:0 0 14px 0;color:var(--muted);font-size:18px}
.section{padding:56px 0}
.kicker{font-size:13px;color:var(--muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:8px}
.grid{display:grid;gap:18px}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{border:1px solid #eef2f7;border-radius:var(--r);padding:18px;background:#fff;box-shadow:var(--shadow)}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gallery img{border:1px solid #eef2f7;border-radius:12px;aspect-ratio:4/3;object-fit:cover;box-shadow:var(--shadow)}

/* Treatment grid/cards */
.treat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.treat-card{background:#fff;border:1px solid #eef2f7;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.treat-card img{aspect-ratio:16/10;object-fit:cover;width:100%}
.treat-card h4{margin:12px 12px 6px 12px}
.treat-card p{margin:0 12px 14px 12px;font-size:14px;color:#4b5563}

.footer{background:#0b1220;color:#cbd5e1;margin-top:40px}
.footer .container{padding:34px 22px}
.footer a{color:#e5e7eb}

/* Treatment detail */
.detail{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}
.detail img{border-radius:14px;border:1px solid #eef2f7;box-shadow:var(--shadow)}
.detail .info{background:#fff;border:1px solid #eef2f7;border-radius:14px;padding:18px;box-shadow:var(--shadow)}
.detail ul{margin:0;padding-left:18px}
.back{margin-top:12px}
@media(max-width:900px){.grid.cols-3{grid-template-columns:repeat(2,1fr)}.treat-grid{grid-template-columns:repeat(2,1fr)}.detail{grid-template-columns:1fr}}
@media(max-width:560px){.grid.cols-2,.grid.cols-3,.treat-grid{grid-template-columns:1fr}.hero-card h1{font-size:34px}}



html,body{
  background:
    radial-gradient(1200px 600px at 20% 0%, #e6f6fb 0%, rgba(230,246,251,0) 60%),
    radial-gradient(1000px 500px at 100% 20%, #f0fbf7 0%, rgba(240,251,247,0) 60%),
    linear-gradient(180deg,#f7fbff 0%, #eef7fb 50%, #f9fbfc 100%);
}
.section.alt{background: rgba(255,255,255,0.6); backdrop-filter: blur(2px);}
.card{background: rgba(255,255,255,0.92);}
.hero-wrap{
  position: relative;
  isolation:isolate;
}
.hero-wrap::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(600px 300px at 80% 90%, rgba(14,165,165,.12), transparent 60%),
    radial-gradient(500px 260px at 10% 40%, rgba(12,124,134,.10), transparent 60%);
  z-index:0;
}
.hero-card{position:relative; z-index:1;}
/* Optional decorative separators */
.hr-soft{height:1px;background:linear-gradient(90deg, transparent, rgba(12,124,134,.25), transparent);border:none;margin:26px 0}

/* HEADINGS FONT */
h1,h2,h3,h4,h5{font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif}


/* ===== D'Aura Dark Premium Theme ===== */
:root{
  --navy:#0b1020;         /* page background */
  --navy-2:#0f172a;       /* elevated surfaces */
  --ink:#e5e7eb;          /* main text */
  --muted:#a7b0c0;        /* secondary text */
  --teal:#14b8a6;         /* dental accent */
  --blue:#3b82f6;         /* links / CTAs */
  --pink:#ec4899;         /* aesthetic accent */
  --gold:#f59e0b;         /* highlight */
  --card:#101829;         /* cards */
  --edge:#1f2937;         /* borders */
  --shadow:0 12px 32px rgba(0,0,0,.35);
  --r:18px;
}
*{box-sizing:border-box}
html,body{
  margin:0;background:radial-gradient(1200px 600px at 10% -10%, #101935 0%, #0b1020 45%) fixed;
  color:var(--ink);
  font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;
}
a{color:#9dc1ff;text-decoration:none}
a:hover{color:#bfd6ff}
img{max-width:100%;display:block;border-radius:12px}
.container{max-width:1180px;margin:0 auto;padding:0 22px}

/* Header */
.header{position:sticky;top:0;background:rgba(11,16,32,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--edge);z-index:60}
.nav{display:flex;justify-content:space-between;align-items:center;padding:12px 0;gap:12px}
.brand{display:flex;gap:10px;align-items:center;font-weight:800;letter-spacing:.3px;color:#e2e8f0}
.brand img{width:46px;height:46px;object-fit:contain;border-radius:10px}
.links{display:flex;gap:10px;flex-wrap:wrap}
.btn{padding:10px 14px;border-radius:12px;border:1px solid var(--edge);background:var(--navy-2);box-shadow:var(--shadow);color:var(--ink)}
.btn.primary{background:linear-gradient(135deg,var(--blue),#06b6d4);border-color:transparent;color:#fff}
.btn.call{background:linear-gradient(135deg,#16a34a,#10b981);border-color:transparent;color:#fff}
.btn.whatsapp{background:#22c55e;color:#06130b;border-color:#22c55e}
.pill{display:inline-block;padding:6px 12px;border-radius:999px;background:#0e1a33;border:1px solid #1f2b44;color:#9dc1ff;font-size:13px}

/* Hero (no white overlays) */
.hero-wrap{background:url('assets/hero-shared.jpg') center/cover no-repeat;min-height:56vh;display:flex;align-items:center;position:relative;isolation:isolate}
.hero-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,16,32,.55), rgba(11,16,32,.85));z-index:0}
.hero-card{position:relative;z-index:1;background:rgba(16,24,41,.72);border:1px solid var(--edge);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);max-width:850px;margin:26px}
.hero-card h1{margin:6px 0 10px 0;font-family:'Poppins',system-ui;letter-spacing:.2px;font-size:46px;color:#f3f4f6}
.hero-card p{margin:0 0 12px 0;color:var(--muted);font-size:18px}

/* Sections & cards */
.section{padding:56px 0}
.kicker{font-size:12px;color:#8aa0c4;letter-spacing:.25em;text-transform:uppercase;margin-bottom:8px}
.grid{display:grid;gap:18px}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{border:1px solid var(--edge);border-radius:var(--r);padding:18px;background:var(--card);box-shadow:var(--shadow)}
.card h2,.card h3{font-family:'Poppins',system-ui;margin:6px 0 10px 0;color:#f1f5f9}

/* Galleries */
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gallery img{border:1px solid var(--edge);border-radius:12px;aspect-ratio:4/3;object-fit:cover}

/* Treatment grid/cards */
.treat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.treat-card{background:var(--card);border:1px solid var(--edge);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.treat-card img{aspect-ratio:16/10;object-fit:cover;width:100%;border-radius:0}
.treat-card h4{margin:12px 12px 6px 12px;color:#f8fafc}
.treat-card p{margin:0 12px 14px 12px;font-size:14px;color:#b8c2d3}

/* Footer */
.footer{background:#070b16;color:#cbd5e1;border-top:1px solid var(--edge);margin-top:40px}
.footer .container{padding:34px 22px}
.footer a{color:#cde1ff}

/* Detail layout */
.detail{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}
.detail img{border-radius:14px;border:1px solid var(--edge)}
.detail .info{background:var(--card);border:1px solid var(--edge);border-radius:14px;padding:18px;box-shadow:var(--shadow)}
.detail ul{margin:0;padding-left:18px}
.back{margin-top:12px}

/* Responsive */
@media(max-width:900px){.grid.cols-3{grid-template-columns:repeat(2,1fr)}.treat-grid{grid-template-columns:repeat(2,1fr)}.detail{grid-template-columns:1fr}}
@media(max-width:560px){.grid.cols-2,.grid.cols-3,.treat-grid{grid-template-columns:1fr}.hero-card h1{font-size:34px}}