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

:root {
  --navy:#1c2b3a; --navy-lt:#344d63; --slate:#4e6070; --muted:#6b7e8f;
  --mist:#f4f6f8; --mist-dk:#eceef1; --border:#dce1e8; --white:#ffffff;
  --gold:#b89255; --gold-lt:#d4b07a; --accent:#5a7fa0; --success:#1a7a4a;
  --danger:#dc3545;
  --serif:'Cormorant Garamond',Georgia,serif; --sans:'DM Sans',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:300;color:var(--navy);background:var(--mist);line-height:1.7;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh;align-items:stretch}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.2}
a{text-decoration:none;color:inherit}

/* NAV */
nav.site-nav{height:68px;background:rgba(255,255,255,.97);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:200;backdrop-filter:blur(10px)}
.nav-inner{max-width:1080px;margin:0 auto;padding:0 2rem;height:68px;display:flex;align-items:center;justify-content:space-between}
.nav-logo{font-family:var(--serif);font-size:1.25rem;font-weight:600;color:var(--navy)}
.nav-logo .dot{color:var(--gold)}
.nav-menu{display:flex;align-items:center;gap:.25rem;list-style:none}
.nav-back{font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.nav-back:hover{color:var(--navy)}
.nav-logout{color:var(--danger)!important}

/* ADMIN NAV LINKS */
.nav-menu a{display:block;padding:.4rem .85rem;font-size:.78rem;letter-spacing:.07em;text-transform:uppercase;color:var(--slate);border-radius:3px;transition:all .18s}
.nav-menu a:hover{color:var(--navy);background:var(--mist)}
.nav-menu a.active{color:var(--navy);font-weight:500}

/* LAYOUT */
.wrap{max-width:1080px;width:100%;margin:0 auto;padding:36px 2rem 80px;flex:1}
.wrap-sm{max-width:680px;width:100%;margin:0 auto;padding:36px 2rem 80px;flex:1}
.wrap-wide{max-width:1080px;width:100%;margin:0 auto;padding:36px 2rem 80px;flex:1}
.page-wrap{max-width:1080px;width:100%;margin:0 auto;padding:36px 2rem 80px;flex:1}
.page-wrap.wide{max-width:1080px}

.lbl{display:flex;align-items:center;gap:.6rem;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:.75rem}
.lbl::before{content:'';width:1.5rem;height:1px;background:var(--gold)}

.card{background:var(--white);border:1px solid var(--border);border-radius:4px;padding:2rem;margin-bottom:1.25rem}

/* STEP BAR */
.step-bar{display:flex;margin-bottom:2rem;border:1px solid var(--border);overflow:hidden;border-radius:3px;counter-reset:step}
.step-item{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.65rem .5rem;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--white);border-right:1px solid var(--border);counter-increment:step}
.step-item:last-child{border-right:none}
.step-item::before{content:counter(step);width:20px;height:20px;border-radius:50%;background:var(--mist-dk);color:var(--muted);display:flex;align-items:center;justify-content:center;font-size:.68rem;flex-shrink:0}
.step-item.active{background:var(--navy);color:#fff}.step-item.active::before{background:var(--gold);color:#fff}
.step-item.done{color:var(--slate)}.step-item.done::before{background:var(--success);color:#fff;content:'✓'}

/* TYPE CARDS */
.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}
.type-card{background:var(--white);border:2px solid var(--border);border-radius:4px;padding:1.75rem;cursor:pointer;transition:border-color .2s,background .2s}
.type-card:hover{border-color:var(--navy)}.type-card.sel,.type-card.selected{border-color:var(--navy);background:var(--mist)}
.type-card h3{font-size:1.2rem;margin-bottom:.35rem}
.type-card .price{font-family:var(--serif);font-size:1.6rem;color:var(--navy);margin-bottom:.2rem}
.type-card .dur,.type-card .duration{font-size:.8rem;color:var(--muted);margin-bottom:.75rem}
.type-card p{font-size:.84rem;color:var(--slate);line-height:1.55}
.type-badge{display:inline-block;font-size:.68rem;padding:.2rem .65rem;border-radius:100px;border:1px solid var(--border);color:var(--muted);margin-bottom:.65rem;letter-spacing:.04em}
.type-badge.online{border-color:var(--gold);color:var(--gold)}

/* FORMAT TOGGLE */
.fmt-row{display:flex;gap:.5rem;margin-bottom:1.5rem}
.fmt-btn{padding:.55rem 1.5rem;font-size:.82rem;font-family:var(--sans);border:1px solid var(--border);border-radius:3px;background:var(--white);color:var(--slate);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.fmt-btn:hover{border-color:var(--navy);color:var(--navy)}
.fmt-btn.active{background:var(--navy);color:#fff;border-color:var(--navy)}

/* CALENDAR */
.cal-nav-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.cal-btn,.cal-nav{background:none;border:1px solid var(--border);border-radius:3px;padding:.35rem .85rem;cursor:pointer;font-size:.85rem;color:var(--slate);font-family:var(--sans);transition:background .18s,color .18s,border-color .18s;text-decoration:none;display:inline-block}
.cal-btn:hover,.cal-nav:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.cal-grid,.cal-header+div{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:1.25rem}
.cal-dname,.cal-day-name{text-align:center;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:.3rem 0}
.cal-day{height:38px;display:flex;align-items:center;justify-content:center;border-radius:3px;font-size:.85rem;color:#b8c2cc;position:relative;cursor:default}
.cal-day.has-slots,.cal-day.avail{background:#d8e6f0;border:1px solid #a8c4d8;color:var(--navy);cursor:pointer;font-weight:500;transition:background .15s,color .15s,border-color .15s;will-change:background,color}
.cal-day.has-slots:hover,.cal-day.avail:hover{background:var(--navy-lt);color:#fff;border-color:var(--navy-lt)}
.cal-day.sel,.cal-day.selected{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}
.cal-day.today.has-slots,.cal-day.today.avail{border-color:var(--gold)}
.cal-day.today:not(.has-slots):not(.avail){border:1px solid var(--gold);color:#b8c2cc}
.cal-day.past{color:#c8d0d8;opacity:1}
.cal-day.has-slots::after,.cal-day.avail::after{content:'';position:absolute;bottom:4px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--gold);transition:background .15s}
.cal-day.sel::after,.cal-day.selected::after,.cal-day.has-slots:hover::after,.cal-day.avail:hover::after{background:#fff}

/* SLOT GRID */
.slot-panel{border-top:1px solid var(--border);padding-top:1.25rem;margin-top:.25rem}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;margin-top:.75rem}
.slot-btn{padding:.55rem 0;text-align:center;background:var(--white);border:1px solid var(--border);border-radius:3px;font-size:.9rem;color:var(--navy);cursor:pointer;font-family:var(--sans);transition:background .15s,color .15s,border-color .15s}
.slot-btn:hover,.slot-btn.sel,.slot-btn.selected{background:var(--navy);color:#fff;border-color:var(--navy)}

/* WAITLIST BANNER */
.waitlist-banner{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--white);border:1px solid var(--border);border-left:3px solid var(--gold);border-radius:0 4px 4px 0;padding:1.1rem 1.25rem;margin-top:1.5rem;flex-wrap:wrap}
.waitlist-banner p{font-size:.88rem;color:var(--slate);line-height:1.5}
.waitlist-banner strong{color:var(--navy)}
.wl-btn{padding:.55rem 1.25rem;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--navy);border:1px solid var(--navy);border-radius:3px;cursor:pointer;font-family:var(--sans);white-space:nowrap;flex-shrink:0;transition:all .18s;text-decoration:none;display:inline-block}
.wl-btn:hover{background:var(--navy);color:#fff}

/* SUMMARY */
.summary,.summary-box{background:var(--mist);border:1px solid var(--border);border-radius:4px;padding:1.25rem 1.5rem;margin-bottom:1.5rem}
.summary table,.summary-box table{width:100%;border-collapse:collapse;font-size:.9rem}
.summary td,.summary-box td{padding:.4rem 0;border-bottom:1px solid var(--border);color:var(--slate)}
.summary td:last-child,.summary-box td:last-child{text-align:right;color:var(--navy);font-weight:500}
.summary tr:last-child td,.summary-box tr:last-child td{border-bottom:none;font-size:1rem}

/* FORM */
.fg{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.1rem}
.fg label{font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.fg input,.fg select,.fg textarea{border:1px solid var(--border);padding:.7rem 1rem;font-family:var(--sans);font-size:.9rem;color:var(--navy);background:var(--white);border-radius:3px;outline:none;transition:border-color .2s;width:100%}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--accent)}
.fg textarea{resize:vertical;min-height:90px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}

/* PAYMENT METHOD */
.pay-method-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.25rem}
.pay-method-card{border:2px solid var(--border);border-radius:4px;padding:1.25rem 1.5rem;cursor:pointer;transition:border-color .2s,background .2s;display:flex;align-items:flex-start;gap:.85rem}
.pay-method-card:hover{border-color:var(--navy)}.pay-method-card.sel{border-color:var(--navy);background:var(--mist)}
.pmi{width:36px;height:36px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.1rem;background:var(--mist);border:1px solid var(--border)}
.pay-method-card.sel .pmi{background:var(--navy);border-color:var(--navy)}
.pm-title{font-size:.92rem;font-weight:500;color:var(--navy);margin-bottom:.2rem}
.pm-desc{font-size:.77rem;color:var(--muted);line-height:1.45}
.sumup-wrap{display:none;border:1px dashed var(--border);border-radius:4px;padding:1.75rem;background:#fafafa;text-align:center;margin-top:1rem}
.sumup-wrap.show{display:block}
.p24-wrap{display:none;margin-top:1rem}.p24-wrap.show{display:block}

/* BUTTONS */
.btn{display:inline-block;padding:.75rem 1.75rem;font-family:var(--sans);font-size:.78rem;font-weight:400;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:3px;cursor:pointer;border:none;text-align:center;transition:background .18s,color .18s,opacity .18s}
.btn-dark{background:var(--navy);color:#fff}.btn-dark:hover{background:var(--navy-lt)}
.btn-dark:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}
.btn-outline{background:transparent;color:var(--navy);border:1px solid var(--navy)}.btn-outline:hover{background:var(--navy);color:#fff}
.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{opacity:.88}
.btn-full{width:100%;display:block;text-align:center}
.btn-sm{padding:.42rem .9rem;font-size:.71rem;letter-spacing:.06em}

/* ALERTS */
.alert{padding:.9rem 1.1rem;border-radius:3px;font-size:.88rem;margin-bottom:1rem;line-height:1.6}
.alert-info{background:#e8f1fb;border:1px solid #a8c4e8;color:#1a3a6b}
.alert-success{background:#edf7f2;border:1px solid #9fd4b8;color:#1a5c3b}
.alert-error,.alert-danger{background:#fdeaea;border:1px solid #f5b5b5;color:#9b1c1c}

/* BADGES */
.badge{display:inline-block;padding:.2rem .65rem;border-radius:100px;font-size:.72rem;letter-spacing:.05em}
.badge-paid{background:#edf7f2;color:#1a7a4a}
.badge-pending{background:#fef9e8;color:#8a6200}
.badge-cancelled{background:#fdeaea;color:#9b1c1c}

/* CANCEL PAGE */
.cancel-box{max-width:480px;margin:0 auto;text-align:center;padding:60px 2rem}

/* ADMIN TABLE */
.data-table{width:100%;border-collapse:collapse;font-size:.86rem}
.data-table th{text-align:left;padding:.7rem 1.25rem;background:var(--mist);border-bottom:1px solid var(--border);font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:400}
.data-table td{padding:.8rem 1.25rem;border-bottom:1px solid var(--border);color:var(--slate);vertical-align:middle}
.data-table tr:last-child td{border-bottom:none}
.data-table tr:hover td{background:var(--mist)}

/* ADMIN STAT CARDS */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:2rem}
.stat-card{background:var(--white);border:1px solid var(--border);border-radius:4px;padding:1.25rem 1.5rem}
.stat-card .stat-val{font-family:var(--serif);font-size:2.25rem;color:var(--navy);line-height:1;margin-bottom:.25rem}
.stat-card .stat-lbl{font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

/* ADMIN CALENDAR */
.admin-cal-day{background:var(--white);border:1px solid var(--border);border-radius:4px;padding:.75rem .5rem;min-height:80px}
.admin-cal-day .day-num{font-size:.78rem;color:var(--muted);margin-bottom:.4rem}
.slot-chip{font-size:.72rem;background:var(--navy);color:#fff;border-radius:2px;padding:.15rem .4rem;margin-bottom:.2rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slot-chip.booked{background:var(--gold)}
.cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.cal-header h3{font-size:1.25rem}

/* FOOTER */
footer.site-footer{background:var(--navy);width:100%;margin-top:auto}
.footer-inner{max-width:1080px;margin:0 auto;padding:48px 2rem 24px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;padding-bottom:2.5rem;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:1.5rem}
.f-brand-name{font-family:var(--serif);font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:.6rem}
.f-brand-name .dot{color:var(--gold)}
.f-brand p{font-size:.8rem;color:rgba(255,255,255,.35);line-height:1.75}
.f-col h5{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-family:var(--sans);font-weight:400;margin-bottom:.9rem}
.f-col ul{list-style:none;display:flex;flex-direction:column;gap:.45rem}
.f-col ul a,.f-col ul span{font-size:.8rem;color:rgba(255,255,255,.4);transition:color .18s;display:block}
.f-col ul a:hover{color:rgba(255,255,255,.8)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;font-size:.73rem;color:rgba(255,255,255,.18);flex-wrap:wrap;gap:.5rem}
.footer-bottom a{color:rgba(255,255,255,.25)}

@media(max-width:768px){
  .stats-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .type-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .f-row,.pay-method-grid{grid-template-columns:1fr}
  .type-grid{grid-template-columns:1fr!important}
  .step-item span{display:none}
  .wrap,.wrap-sm,.page-wrap{padding:24px 1rem 60px}
  .waitlist-banner{flex-direction:column}
  .stats-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}

/* ── MOBILE RESPONSIVE ──────────────────────────────────── */
@media (max-width: 700px) {
  .wrap { padding: 24px 1rem 48px; }
  .wrap-wide { padding: 24px 1rem 48px; }
  .step-bar { font-size: .6rem; }
  .step-bar .step-item { padding: .5rem .25rem; }
  .type-grid { grid-template-columns: 1fr; }
  .card { padding: 1.25rem; }
  .f-row { flex-direction: column; gap: 0; }
  .summary table { font-size: .85rem; }
  .summary table td:last-child { text-align: right; }
  .cal-grid { gap: 2px; }
  .cal-day { height: 36px; font-size: .85rem; }
  .slot-grid { grid-template-columns: repeat(3,1fr); gap: .4rem; }
  .waitlist-banner { flex-direction: column; gap: .75rem; }
  .waitlist-banner a { width: 100%; text-align: center; }
  .fmt-row { flex-wrap: wrap; }
  .fmt-btn { flex: 1; min-width: 120px; text-align: center; }
  /* Admin */
  .nav-menu { gap: .5rem; flex-wrap: wrap; font-size: .65rem; }
  .data-table { font-size: .78rem; }
  .data-table th, .data-table td { padding: .55rem .65rem; }
  /* Booking form */
  .btn-full { padding: .85rem 1rem; }
  /* Clients booking dropdowns */
  #book-form > div { grid-template-columns: 1fr !important; }
}

.page-title { font-family: var(--serif); font-size: 2rem; font-weight: 400; margin-bottom: 2rem; }
