@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&display=swap');

:root{
  /* Option 3: Luxury Clean (Teal + Gold) */
  --bg:#fbfbfd;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#64748b;
  --primary:#0F766E;      /* teal */
  --primary-2:#0B4F48;    /* deep teal */
  --accent:#C9A227;       /* gold */
  --border:rgba(15,23,42,.08);
  --radius:18px;
  --shadow:0 18px 48px rgba(16,24,40,.10);
}

html,body{height:100%;}
body{background:var(--bg); color:var(--text); font-family:'Cairo',system-ui,-apple-system,"Segoe UI",Tahoma,Arial; }
a{color:inherit}
.containerx{max-width:1100px;margin:0 auto;padding:18px;}
.cardx{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);}
.px{padding:18px;}
.btnx{
  border:0;border-radius:14px;padding:.7rem 1rem;font-weight:900;cursor:pointer;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;
  box-shadow:0 14px 34px rgba(15,118,110,.18);
}
.btnx:disabled{opacity:.7;cursor:not-allowed;}
.btnx-outline{
  border:1px solid var(--border); background:#fff; color:var(--text);
  border-radius:14px;padding:.7rem 1rem;font-weight:800;cursor:pointer;
}
.inputx{
  width:100%;padding:.78rem .95rem;border-radius:14px;border:1px solid var(--border);
  background:#fff;outline:none;
}
.inputx:focus{border-color:rgba(15,118,110,.35);box-shadow:0 0 0 4px rgba(15,118,110,.12);}
.small-muted{color:var(--muted);font-size:.92rem;}
.topbarx{
  position:sticky;top:0;z-index:50;background:rgba(251,251,253,.82);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.topbarx .rowx{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.badgex{display:inline-flex;align-items:center;gap:8px;padding:.38rem .7rem;border-radius:999px;border:1px solid var(--border);background:#fff;}
.grid2{display:grid;grid-template-columns:1.25fr .75fr;gap:14px;}
@media (max-width: 900px){.grid2{grid-template-columns:1fr;}}
/* Make Bootstrap cards/buttons match the vibe when used */
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2))!important;border:0!important;border-radius:14px!important;font-weight:900;}
.form-control,.form-select{border-radius:14px!important;border-color:var(--border)!important;}
.form-control:focus,.form-select:focus{box-shadow:0 0 0 4px rgba(15,118,110,.12)!important;border-color:rgba(15,118,110,.35)!important;}

/* Tooth placeholder (subtle) */
.tooth-watermark{position:relative; overflow:hidden;}
.tooth-watermark:before{
  content:"";
  position:absolute;
  /* Watermark should stay mostly behind the right hero, not over the form */
  inset:0;
  background:
    radial-gradient(600px 300px at 85% 35%, rgba(201,162,39,.10), transparent 60%),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 220 260"><path d="M60 22C38 22 22 40 22 62C22 92 40 112 44 140C50 178 52 238 78 238C92 238 92 208 100 186C108 208 108 238 122 238C148 238 150 178 156 140C160 112 178 92 178 62C178 40 162 22 140 22C126 22 116 30 100 30C84 30 74 22 60 22Z" fill="none" stroke="%230F766E" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" opacity="0.10"/></svg>') no-repeat;
  background-position: 112% 46%;
  background-size: 360px auto;
  opacity:.55;
  pointer-events:none;
}

/* HIDE UPPER ARCH LINE & FILL */
.arch-line.upper, .arch-fill.upper{display:none !important;}
.upper-arch, .upper-curve{display:none !important;}