
/* --- Haldi Elegant Theme --- */
:root{
  --bg:#fffaf2;
  --card:#ffffff;
  --ink:#2b1e13;
  --muted:#7b5b3a;
  --saffron:#f1a10d;
  --marigold:#ffd89a;
  --ring:#ead9bb;
  --accent:#b65e05;
}

html,body{height:100%;}
body{
  margin:0;
  font-family:Inter, system-ui, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(1200px 800px at 110% -10%, #ffeac6 0%, rgba(255,234,198,0) 60%),
    radial-gradient(800px 600px at -10% 110%, #fff0d9 0%, rgba(255,240,217,0) 60%),
    var(--bg);
}

h1,h2,h3{font-family:"Cormorant Garamond", serif; letter-spacing:.2px;}
h1{font-size:clamp(28px,4vw,44px); margin:0 0 6px; color:var(--accent); text-shadow:0 1px 0 #fff;}
.sub{margin:0; color:var(--muted); font-weight:600; letter-spacing:.8px}

.shell{max-width:1100px;margin:22px auto;padding:0 16px;}
.hero{position:relative; text-align:center; padding:24px 6px 8px;}
.garland{width:180px; opacity:.75; filter:drop-shadow(0 1px 0 #fff);}
.garland.top{position:absolute; top:-6px; left:50%; transform:translateX(-50%) scale(1.1);}
.garland.bottom{display:block; margin:12px auto 4px; transform:rotate(180deg) scale(1);}

.wrap{
  background:linear-gradient(180deg, #fffdf8, #fff);
  border:1px solid var(--ring);
  border-radius:22px;
  padding:18px;
  box-shadow:0 10px 30px rgba(182,94,5,.08);
}

.banner{
  padding:12px 14px;
  border:1px solid var(--ring);
  border-radius:14px;
  background: #fffaf1;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.banner strong{color:var(--accent)}

input[type="search"], input[type="text"], input[type="number"]{
  width:100%;
  border:1px solid var(--ring);
  background:#fff;
  border-radius:14px;
  padding:12px 14px;
  outline:0;
  transition:border .2s, box-shadow .2s;
}
input[type="search"]:focus{border-color:#f0c27b; box-shadow:0 0 0 4px rgba(240,194,123,.22)}

.families{display:grid; grid-template-columns:1fr; gap:14px; margin-top:12px}
.family{
  background:var(--card);
  border:1px solid var(--ring);
  border-radius:16px;
  padding:14px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.family:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.05); }

.family h3{ margin:6px 2px 12px; font-size:22px; color:#7b3f00}
.section-title{
  display:flex; align-items:center; gap:8px;
  border:1px dashed #f1dfb7; background:#fffdf6;
  border-radius:12px; padding:10px 12px; color:#8a4d00; font-weight:800;
}

.member-row{display:flex;justify-content:space-between;align-items:center; gap:10px;
  padding:10px 0; border-bottom:1px dashed #efdfc3;}
.member-row:last-child{border-bottom:0}
.name-pill{background:#fff8e6;border:1px solid #f1dfb7;border-radius:999px;padding:6px 12px;font-weight:600}

.btn{
  background:var(--saffron);
  color:#fff; border:1px solid #c77a00;
  border-radius:12px; padding:12px 18px; font-weight:800; cursor:pointer;
  box-shadow:0 6px 16px rgba(241,161,13,.2);
  transition:transform .12s ease, box-shadow .12s ease, background .2s;
}
.btn:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(241,161,13,.25); }
.btn.secondary{ background:#fff; color:#7a3f00; border:1px solid var(--ring); box-shadow:none}
.submit-row{display:flex;gap:10px;align-items:center;margin-top:16px;flex-wrap:wrap}

.family-kids{
  display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:12px;
  padding:12px; border:1px dashed #efdfc3; border-radius:10px; background:#fffdf9;
}

.footer-note{ text-align:center; color:var(--muted); margin:16px 0 6px; font-size:14px }
.hidden{display:none}
.err{color:#b00020;font-weight:700}
