/* ============================================================
   Cashmere Events & Décor – Complete Stylesheet
   Day Mode: White + Gold  |  Night Mode: Black + Green
   ============================================================ */

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --primary:#C49A22; --primary-dark:#9E7A10; --primary-light:#FDF8EC;
  --accent:#B8860B; --success:#16A34A; --danger:#DC2626;
  --warning:#D97706; --info:#0EA5E9;
  --bg:#FFFFFF; --bg-sidebar:#F8F6F0; --bg-card:#FFFFFF;
  --border:#E5DDD0; --border-light:#F0EBE2;
  --text:#1A1A1A; --text-secondary:#4A4A4A; --color-muted:#7A7A7A;
  --primary-text:#FFFFFF;
  --font-body:'Inter',system-ui,sans-serif;
  --font-heading:'Cormorant Garamond','Georgia',serif;
  --radius:10px; --radius-lg:16px; --shadow:0 2px 12px rgba(0,0,0,.08);
  --shadow-lg:0 8px 32px rgba(0,0,0,.12); --transition:.2s ease;
  --navbar-h:64px; --sidebar-w:240px;
}
[data-theme="night"] {
  --primary:#22C55E; --primary-dark:#16A34A; --primary-light:#052E16;
  --accent:#4ADE80; --bg:#0A0A0A; --bg-sidebar:#111111; --bg-card:#161616;
  --border:#2A2A2A; --border-light:#1E1E1E; --text:#E8E8E8;
  --text-secondary:#B0B0B0; --color-muted:#606060; --primary-text:#0A0A0A;
}

/* ── Reset ─────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);background:var(--bg);color:var(--text);
  line-height:1.6;min-height:100vh;transition:background var(--transition),color var(--transition)}
h1,h2,h3,h4,h5{font-family:var(--font-heading);font-weight:600;
  line-height:1.2;color:var(--text)}
h1{font-size:clamp(2rem,4vw,3rem);font-style:italic}
h2{font-size:clamp(1.6rem,3vw,2.4rem)}
h3{font-size:1.4rem} h4{font-size:1.1rem} h5{font-size:.95rem}
a{color:var(--primary);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--primary-dark)}
img,video{max-width:100%;height:auto;display:block}
ul{list-style:none}
input,select,textarea,button{font-family:inherit}

/* ── Layout Utilities ──────────────────────────────────────── */
.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}
.container-sm{max-width:760px;margin:0 auto;padding:0 1.5rem}
.container-xs{max-width:480px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0} .section-alt{background:var(--bg-sidebar)}
.grid{display:grid;gap:1.5rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.flex{display:flex} .flex-between{display:flex;justify-content:space-between;align-items:center}
.flex-center{display:flex;justify-content:center;align-items:center}
.flex-gap{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.gap-sm{gap:.5rem} .gap-xs{gap:.25rem}
.text-center{text-align:center} .text-right{text-align:right}
.text-muted{color:var(--color-muted)} .text-primary{color:var(--primary)}
.mt-1{margin-top:.5rem} .mt-2{margin-top:1rem} .mt-3{margin-top:1.5rem}
.mt-4{margin-top:2rem} .mb-1{margin-bottom:.5rem} .mb-2{margin-bottom:1rem}
.mb-3{margin-bottom:1.5rem} .mb-4{margin-bottom:2rem}
.hidden{display:none!important} .w-full{width:100%}

/* ── Theme Bar ─────────────────────────────────────────────── */
.theme-bar{background:var(--bg-sidebar);border-bottom:1px solid var(--border);
  padding:.3rem 1.5rem;display:flex;justify-content:flex-end;align-items:center;
  gap:.75rem;font-size:.8rem;color:var(--color-muted)}
.theme-toggle-btn{background:none;border:1px solid var(--border);
  border-radius:20px;padding:.25rem .75rem;cursor:pointer;
  color:var(--text-secondary);font-size:.8rem;display:flex;align-items:center;
  gap:.4rem;transition:all var(--transition)}
.theme-toggle-btn:hover{border-color:var(--primary);color:var(--primary)}

/* ── Navbar ────────────────────────────────────────────────── */
.navbar{position:sticky;top:0;z-index:1000;background:var(--bg-card);
  border-bottom:1px solid var(--border);height:var(--navbar-h);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.nav-inner{max-width:1200px;margin:0 auto;padding:0 1.5rem;
  display:flex;align-items:center;justify-content:space-between;height:100%}
.nav-logo{font-family:var(--font-heading);font-size:1.4rem;
  color:var(--primary);font-weight:700;letter-spacing:.02em}
.nav-logo span{color:var(--text);font-size:.85rem;display:block;
  font-family:var(--font-body);font-weight:400;letter-spacing:.05em;margin-top:-4px}
.nav-links{display:flex;align-items:center;gap:.25rem}
.nav-link{padding:.5rem .9rem;border-radius:6px;color:var(--text-secondary);
  font-size:.9rem;font-weight:500;transition:all var(--transition)}
.nav-link:hover,.nav-link.active{color:var(--primary);background:var(--primary-light)}
.nav-actions{display:flex;align-items:center;gap:.5rem}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;
  padding:.5rem;background:none;border:none}
.hamburger span{width:24px;height:2px;background:var(--text);
  border-radius:2px;transition:all .3s}

/* ── Notification Bell ─────────────────────────────────────── */
.notif-wrap{position:relative}
.notif-btn{position:relative;background:none;border:none;cursor:pointer;
  padding:.5rem;border-radius:8px;font-size:1.1rem;color:var(--text-secondary);
  transition:all var(--transition)}
.notif-btn:hover{background:var(--border-light);color:var(--primary)}
.notif-badge{position:absolute;top:4px;right:4px;background:var(--danger);
  color:#fff;border-radius:50%;width:16px;height:16px;font-size:.6rem;
  display:flex;align-items:center;justify-content:center;font-weight:700}
.notif-dropdown{position:absolute;right:0;top:calc(100% + 8px);
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);width:340px;max-height:480px;overflow:hidden;
  display:flex;flex-direction:column;z-index:2000;opacity:0;
  transform:translateY(-8px);pointer-events:none;transition:all .2s}
.notif-dropdown.open{opacity:1;transform:translateY(0);pointer-events:all}
.notif-dropdown-header{padding:.75rem 1rem;border-bottom:1px solid var(--border);
  display:flex;justify-content:space-between;align-items:center;
  font-size:.85rem;font-weight:600}
.notif-list{overflow-y:auto;flex:1}
.notif-item{padding:.75rem 1rem;border-bottom:1px solid var(--border-light);
  cursor:pointer;transition:background var(--transition)}
.notif-item:hover{background:var(--primary-light)}
.notif-item.unread{border-left:3px solid var(--primary)}
.notif-item-title{font-size:.85rem;font-weight:600;margin-bottom:.2rem}
.notif-item-msg{font-size:.8rem;color:var(--color-muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── User Menu ─────────────────────────────────────────────── */
.user-menu{position:relative}
.user-menu-btn{display:flex;align-items:center;gap:.5rem;background:none;
  border:1px solid var(--border);border-radius:20px;padding:.35rem .85rem;
  cursor:pointer;font-size:.85rem;color:var(--text-secondary);
  transition:all var(--transition)}
.user-menu-btn:hover{border-color:var(--primary);color:var(--primary)}
.user-menu-btn img{width:26px;height:26px;border-radius:50%;object-fit:cover}
.user-menu-dropdown{position:absolute;right:0;top:calc(100% + 8px);
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius);box-shadow:var(--shadow-lg);min-width:180px;
  z-index:2000;opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:all .2s;overflow:hidden}
.user-menu-dropdown.open{opacity:1;transform:translateY(0);pointer-events:all}
.user-menu-dropdown a{display:block;padding:.65rem 1rem;font-size:.875rem;
  color:var(--text-secondary);transition:all var(--transition)}
.user-menu-dropdown a:hover{background:var(--primary-light);color:var(--primary)}
.user-menu-dropdown hr{border:none;border-top:1px solid var(--border);margin:.25rem 0}

/* ── Flash Messages ─────────────────────────────────────────── */
.flash-container{position:fixed;top:calc(var(--navbar-h) + 12px);right:1rem;
  z-index:3000;display:flex;flex-direction:column;gap:.5rem;max-width:360px}
.flash{padding:.85rem 1.25rem;border-radius:var(--radius);
  box-shadow:var(--shadow-lg);font-size:.875rem;font-weight:500;
  display:flex;justify-content:space-between;align-items:center;gap:.75rem}
.flash-success{background:#DCFCE7;color:#166534;border:1px solid #BBF7D0}
.flash-danger{background:#FEE2E2;color:#991B1B;border:1px solid #FECACA}
.flash-warning{background:#FEF3C7;color:#92400E;border:1px solid #FDE68A}
.flash-info{background:#E0F2FE;color:#075985;border:1px solid #BAE6FD}
[data-theme="night"] .flash-success{background:#052E16;color:#86EFAC;border-color:#166534}
[data-theme="night"] .flash-danger{background:#450A0A;color:#FCA5A5;border-color:#991B1B}
[data-theme="night"] .flash-warning{background:#451A03;color:#FCD34D;border-color:#92400E}
[data-theme="night"] .flash-info{background:#082F49;color:#7DD3FC;border-color:#075985}
.flash-close{background:none;border:none;cursor:pointer;opacity:.6;font-size:1rem;
  padding:0;line-height:1;color:inherit}
.flash-close:hover{opacity:1}

/* ── Cards ─────────────────────────────────────────────────── */
.card{background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:1.5rem;
  box-shadow:var(--shadow);transition:box-shadow var(--transition)}
.card-header{display:flex;justify-content:space-between;align-items:center;
  margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:1px solid var(--border)}
.card-header h4{margin:0}
.card:hover{box-shadow:var(--shadow-lg)}

/* ── Stat Cards ─────────────────────────────────────────────── */
.stat-card{background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:1.25rem 1.5rem;
  display:flex;align-items:center;gap:1rem;box-shadow:var(--shadow)}
.stat-icon{font-size:2rem;line-height:1}
.stat-value{font-size:1.6rem;font-weight:700;font-family:var(--font-heading);
  color:var(--primary);line-height:1}
.stat-label{font-size:.8rem;color:var(--color-muted);margin-top:.15rem}

/* ── Buttons ─────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.25rem;
  border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;
  border:2px solid transparent;transition:all var(--transition);
  text-decoration:none;white-space:nowrap;justify-content:center}
.btn-primary{background:var(--primary);color:var(--primary-text);border-color:var(--primary)}
.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark);
  color:var(--primary-text)}
.btn-outline{background:transparent;color:var(--primary);border-color:var(--primary)}
.btn-outline:hover{background:var(--primary);color:var(--primary-text)}
.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--border)}
.btn-ghost:hover{background:var(--border-light);color:var(--text)}
.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger)}
.btn-danger:hover{background:#B91C1C;border-color:#B91C1C;color:#fff}
.btn-success{background:var(--success);color:#fff;border-color:var(--success)}
.btn-sm{padding:.35rem .85rem;font-size:.8rem}
.btn-lg{padding:.85rem 2rem;font-size:1rem}
.btn-full{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* ── Forms ─────────────────────────────────────────────────── */
.form-group{margin-bottom:1.25rem}
.form-label{display:block;font-size:.875rem;font-weight:600;
  margin-bottom:.4rem;color:var(--text-secondary)}
.form-control{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);
  border-radius:8px;background:var(--bg);color:var(--text);
  font-size:.9rem;transition:border-color var(--transition),box-shadow var(--transition)}
.form-control:focus{outline:none;border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(196,154,34,.15)}
.form-control::placeholder{color:var(--color-muted)}
.form-hint{font-size:.78rem;color:var(--color-muted);margin-top:.3rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.req{color:var(--danger)}
select.form-control{cursor:pointer}
textarea.form-control{resize:vertical;min-height:80px}
[data-theme="night"] .form-control{background:var(--bg-sidebar)}

/* ── Tables ─────────────────────────────────────────────────── */
.table-wrapper{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--border)}
table{width:100%;border-collapse:collapse;font-size:.875rem}
thead{background:var(--bg-sidebar)}
th{padding:.75rem 1rem;text-align:left;font-weight:600;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);
  border-bottom:2px solid var(--border)}
td{padding:.75rem 1rem;border-bottom:1px solid var(--border-light);vertical-align:middle}
tbody tr:hover{background:var(--primary-light)}
tbody tr:last-child td{border-bottom:none}
tfoot td{font-weight:600;background:var(--bg-sidebar);padding:.75rem 1rem;
  border-top:2px solid var(--border)}

/* ── Badges ─────────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;padding:.25rem .65rem;
  border-radius:20px;font-size:.75rem;font-weight:600;letter-spacing:.02em}
.badge-primary{background:var(--primary-light);color:var(--primary)}
.badge-success{background:#DCFCE7;color:#166534}
.badge-danger{background:#FEE2E2;color:#991B1B}
.badge-warning{background:#FEF3C7;color:#92400E}
.badge-info{background:#E0F2FE;color:#075985}
.badge-muted{background:var(--border-light);color:var(--color-muted)}
[data-theme="night"] .badge-success{background:#052E16;color:#86EFAC}
[data-theme="night"] .badge-danger{background:#450A0A;color:#FCA5A5}
[data-theme="night"] .badge-warning{background:#451A03;color:#FCD34D}
[data-theme="night"] .badge-info{background:#082F49;color:#7DD3FC}

/* ── Alerts ─────────────────────────────────────────────────── */
.alert{padding:.85rem 1.25rem;border-radius:var(--radius);
  margin-bottom:1rem;font-size:.875rem;border-width:1px;border-style:solid}
.alert-success{background:#DCFCE7;color:#166534;border-color:#BBF7D0}
.alert-danger{background:#FEE2E2;color:#991B1B;border-color:#FECACA}
.alert-warning{background:#FEF3C7;color:#92400E;border-color:#FDE68A}
.alert-info{background:#E0F2FE;color:#075985;border-color:#BAE6FD}
[data-theme="night"] .alert-success{background:#052E16;color:#86EFAC;border-color:#166534}
[data-theme="night"] .alert-danger{background:#450A0A;color:#FCA5A5;border-color:#991B1B}
[data-theme="night"] .alert-info{background:#082F49;color:#7DD3FC;border-color:#075985}

/* ── Pagination ─────────────────────────────────────────────── */
.pagination{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin-top:1.5rem}
.page-btn{padding:.4rem .85rem;border:1px solid var(--border);border-radius:6px;
  font-size:.85rem;color:var(--text-secondary);transition:all var(--transition)}
.page-btn:hover,.page-btn.active{background:var(--primary);color:var(--primary-text);
  border-color:var(--primary)}

/* ── Admin Layout ────────────────────────────────────────────── */
.admin-layout{display:flex;min-height:calc(100vh - var(--navbar-h))}
.sidebar{width:var(--sidebar-w);background:var(--bg-sidebar);
  border-right:1px solid var(--border);padding:1rem 0;
  position:sticky;top:var(--navbar-h);height:calc(100vh - var(--navbar-h));
  overflow-y:auto;flex-shrink:0}
.sidebar-title{display:block;font-size:.7rem;text-transform:uppercase;
  letter-spacing:.12em;color:var(--color-muted);font-weight:700;
  padding:.75rem 1.25rem .25rem}
.sidebar-link{display:flex;align-items:center;gap:.6rem;padding:.6rem 1.25rem;
  color:var(--text-secondary);font-size:.875rem;font-weight:500;
  transition:all var(--transition);border-left:3px solid transparent}
.sidebar-link:hover{color:var(--primary);background:var(--primary-light)}
.sidebar-link.active{color:var(--primary);background:var(--primary-light);
  border-left-color:var(--primary)}
.sidebar-icon{font-size:1rem;width:20px;text-align:center;flex-shrink:0}
.admin-content{flex:1;padding:2rem;overflow:auto;min-width:0}
.page-header{margin-bottom:2rem}
.page-header h1{font-size:clamp(1.5rem,3vw,2rem);font-style:normal;margin-bottom:.25rem}
.page-header p{color:var(--color-muted);font-size:.9rem}

/* ── Hero ─────────────────────────────────────────────────────── */
.hero{position:relative;height:100vh;min-height:600px;max-height:900px;
  display:flex;align-items:center;overflow:hidden}
.hero-slides{position:absolute;inset:0}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease}
.hero-slide.active{opacity:1}
.hero-slide img,.hero-slide>div{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover}
.hero-slide video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(0,0,0,.65) 0%,rgba(0,0,0,.35) 100%);z-index:1}
.hero-content{position:relative;z-index:2;max-width:700px}
.hero-eyebrow{color:var(--primary);font-size:.95rem;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:1rem;font-weight:600}
.hero-title{font-size:clamp(2.5rem,6vw,4.5rem);color:#fff;
  line-height:1.1;margin-bottom:1.25rem}
.hero-subtitle{color:rgba(255,255,255,.85);font-size:1.15rem;
  max-width:560px;margin-bottom:2rem;line-height:1.7}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);
  color:#fff;width:48px;height:48px;border-radius:50%;cursor:pointer;
  font-size:1.25rem;display:flex;align-items:center;justify-content:center;
  transition:all var(--transition);backdrop-filter:blur(4px)}
.hero-arrow:hover{background:rgba(255,255,255,.3)}
.hero-arrow-left{left:1.5rem} .hero-arrow-right{right:1.5rem}
.hero-controls{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  z-index:3;display:flex;gap:.75rem}
.hero-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.5);
  border:none;cursor:pointer;transition:all var(--transition);padding:0}
.hero-dot.active{background:#fff;width:28px;border-radius:5px}

/* ── Section Header ─────────────────────────────────────────── */
.section-title{text-align:center;margin-bottom:3rem}
.section-title h2{margin-bottom:.75rem}
.section-title p{color:var(--color-muted);max-width:560px;margin:0 auto}
.section-divider{width:60px;height:3px;background:var(--primary);
  margin:.75rem auto;border-radius:2px}

/* ── Portfolio Grid ─────────────────────────────────────────── */
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.portfolio-item{position:relative;border-radius:var(--radius);overflow:hidden;
  aspect-ratio:4/3;cursor:pointer;background:var(--bg-sidebar)}
.portfolio-item img,.portfolio-item video{width:100%;height:100%;object-fit:cover;
  transition:transform .5s ease}
.portfolio-item:hover img,.portfolio-item:hover video{transform:scale(1.05)}
.portfolio-overlay{position:absolute;inset:0;background:linear-gradient(
  0deg,rgba(0,0,0,.7) 0%,transparent 60%);opacity:0;transition:opacity .3s;
  display:flex;align-items:flex-end;padding:1rem}
.portfolio-item:hover .portfolio-overlay{opacity:1}
.portfolio-overlay-text h4{color:#fff;font-size:1rem;font-style:normal;margin-bottom:.25rem}
.portfolio-overlay-text span{color:rgba(255,255,255,.75);font-size:.8rem}

/* ── Filter Tabs ─────────────────────────────────────────────── */
.filter-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem;
  justify-content:center}
.filter-tab{padding:.45rem 1.1rem;border-radius:20px;border:1.5px solid var(--border);
  background:none;cursor:pointer;font-size:.875rem;color:var(--text-secondary);
  transition:all var(--transition)}
.filter-tab:hover,.filter-tab.active{background:var(--primary);
  color:var(--primary-text);border-color:var(--primary)}

/* ── Lightbox ─────────────────────────────────────────────────── */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:9000;
  display:none;align-items:center;justify-content:center}
.lightbox.open{display:flex}
.lightbox-inner{position:relative;max-width:90vw;max-height:90vh;
  display:flex;align-items:center;justify-content:center}
.lightbox-img{max-width:90vw;max-height:80vh;border-radius:var(--radius);
  object-fit:contain}
.lightbox-close{position:fixed;top:1rem;right:1rem;background:rgba(255,255,255,.15);
  border:none;color:#fff;font-size:1.75rem;cursor:pointer;
  width:44px;height:44px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;transition:all var(--transition)}
.lightbox-close:hover{background:rgba(255,255,255,.3)}
.lightbox-nav{position:fixed;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.15);
  border:none;color:#fff;font-size:2rem;cursor:pointer;width:52px;height:52px;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  transition:all var(--transition)}
.lightbox-nav:hover{background:rgba(255,255,255,.3)}
.lightbox-nav-left{left:1rem} .lightbox-nav-right{right:1rem}
.lightbox-caption{position:fixed;bottom:1.5rem;left:0;right:0;
  text-align:center;color:#fff;font-size:.9rem}

/* ── Quote Form Steps ─────────────────────────────────────────── */
.quote-steps{display:flex;gap:.5rem;justify-content:center;
  align-items:center;margin-bottom:2rem;flex-wrap:wrap;font-size:.85rem}
.quote-step-indicator{display:flex;align-items:center;gap:.4rem;
  color:var(--color-muted);transition:color var(--transition);padding:.25rem .5rem}
.quote-step-indicator.active{color:var(--primary);font-weight:600}
.quote-step-indicator.done{color:var(--success)}
.quote-step-num{width:26px;height:26px;border-radius:50%;border:2px solid currentColor;
  display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700}
.step-content{display:none}
.step-content.active{display:block}
.event-chooser{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1.5rem}
.event-choice{display:flex;flex-direction:column;align-items:center;gap:.5rem;
  padding:1.25rem;border:2px solid var(--border);border-radius:var(--radius);
  cursor:pointer;transition:all var(--transition);text-align:center}
.event-choice:hover,.event-choice.selected{border-color:var(--primary);
  background:var(--primary-light)}
.event-choice-icon{font-size:2rem}
.event-choice-label{font-size:.85rem;font-weight:500}

/* ── Blog Grid ────────────────────────────────────────────────── */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.blog-card{background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius-lg);overflow:hidden;transition:box-shadow var(--transition)}
.blog-card:hover{box-shadow:var(--shadow-lg)}
.blog-card-img{width:100%;height:200px;object-fit:cover}
.blog-card-body{padding:1.25rem}
.blog-card-category{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;
  color:var(--primary);font-weight:600}
.blog-card-title{font-size:1.1rem;margin:.5rem 0;font-style:normal}
.blog-card-excerpt{font-size:.875rem;color:var(--color-muted);margin-bottom:.75rem}
.blog-card-meta{display:flex;justify-content:space-between;
  font-size:.8rem;color:var(--color-muted)}

/* ── Payment Modal ────────────────────────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);
  z-index:4000;display:none;align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal{background:var(--bg-card);border-radius:var(--radius-lg);
  max-width:500px;width:100%;max-height:90vh;overflow-y:auto;
  box-shadow:var(--shadow-lg)}
.modal-header{display:flex;justify-content:space-between;align-items:center;
  padding:1.25rem 1.5rem;border-bottom:1px solid var(--border)}
.modal-title{font-style:normal;font-size:1.1rem;margin:0}
.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;
  color:var(--color-muted);line-height:1;padding:.25rem}
.modal-close:hover{color:var(--danger)}
.modal form{padding:1.5rem}
.payment-methods{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-bottom:1rem}
.payment-method-btn{display:flex;flex-direction:column;align-items:center;
  gap:.4rem;padding:1rem;border:2px solid var(--border);border-radius:var(--radius);
  cursor:pointer;transition:all var(--transition);background:none}
.payment-method-btn:hover,.payment-method-btn.selected{border-color:var(--primary);
  background:var(--primary-light)}
.method-icon{font-size:1.5rem}
.method-name{font-size:.8rem;font-weight:600}

/* ── Progress Bar ────────────────────────────────────────────── */
.progress{height:6px;background:var(--border);border-radius:3px;overflow:hidden}
.progress-bar{height:100%;background:var(--primary);
  border-radius:3px;transition:width .5s ease}

/* ── Countdown ────────────────────────────────────────────────── */
.countdown-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;
  text-align:center;margin:1rem 0}
.countdown-unit{background:var(--primary-light);border-radius:var(--radius);padding:.75rem .5rem}
.countdown-num{font-size:2rem;font-weight:700;font-family:var(--font-heading);
  color:var(--primary);line-height:1}
.countdown-label{font-size:.7rem;color:var(--color-muted);margin-top:.2rem}

/* ── Charts ──────────────────────────────────────────────────── */
.chart-wrapper{position:relative;height:280px;padding:.75rem}

/* ── Spinner ──────────────────────────────────────────────────── */
.spinner{width:16px;height:16px;border:2.5px solid currentColor;
  border-right-color:transparent;border-radius:50%;
  display:inline-block;animation:spin .6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Footer ───────────────────────────────────────────────────── */
footer{background:var(--bg-sidebar);border-top:1px solid var(--border);
  padding:3rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;margin-bottom:2rem}
.footer-brand{font-family:var(--font-heading);font-size:1.4rem;
  color:var(--primary);margin-bottom:.75rem;display:block}
.footer-about{color:var(--color-muted);font-size:.875rem;line-height:1.7;margin-bottom:1rem}
.footer-heading{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;
  font-weight:700;margin-bottom:.75rem;color:var(--text-secondary)}
.footer-links{display:flex;flex-direction:column;gap:.4rem}
.footer-links a{color:var(--color-muted);font-size:.875rem}
.footer-links a:hover{color:var(--primary)}
.footer-bottom{border-top:1px solid var(--border);padding-top:1.25rem;
  display:flex;justify-content:space-between;align-items:center;
  font-size:.8rem;color:var(--color-muted);flex-wrap:wrap;gap:.5rem}
.social-links{display:flex;gap:.75rem}
.social-link{width:36px;height:36px;border-radius:50%;background:var(--border);
  display:flex;align-items:center;justify-content:center;font-size:.9rem;
  color:var(--color-muted);transition:all var(--transition)}
.social-link:hover{background:var(--primary);color:var(--primary-text)}

/* ── WhatsApp Float ──────────────────────────────────────────── */
.whatsapp-float{position:fixed;bottom:5rem;right:1.5rem;z-index:900;
  background:#25D366;color:#fff;width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;box-shadow:0 4px 16px rgba(37,211,102,.4);
  transition:transform var(--transition)}
.whatsapp-float:hover{transform:scale(1.1);color:#fff}

/* ── Chatbot ─────────────────────────────────────────────────── */
.chatbot-wrap{position:fixed;bottom:1.5rem;right:1.5rem;z-index:800}
.chatbot-toggle{width:52px;height:52px;border-radius:50%;
  background:var(--primary);color:var(--primary-text);
  border:none;font-size:1.3rem;cursor:pointer;
  box-shadow:0 4px 16px rgba(196,154,34,.35);transition:transform var(--transition)}
.chatbot-toggle:hover{transform:scale(1.1)}
.chatbot-window{position:absolute;bottom:calc(100% + 12px);right:0;
  width:300px;background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden}
.chatbot-header{background:var(--primary);color:var(--primary-text);
  padding:.75rem 1rem;font-size:.875rem;font-weight:600;display:flex;
  align-items:center;gap:.5rem}
.chatbot-messages{height:220px;overflow-y:auto;padding:.75rem;
  display:flex;flex-direction:column;gap:.5rem}
.chat-msg{max-width:85%;padding:.5rem .75rem;border-radius:12px;font-size:.85rem}
.chat-msg.user{background:var(--primary);color:var(--primary-text);
  align-self:flex-end;border-bottom-right-radius:4px}
.chat-msg.bot{background:var(--border-light);align-self:flex-start;border-bottom-left-radius:4px}
.chatbot-input{display:flex;gap:.5rem;padding:.75rem;border-top:1px solid var(--border)}
.chatbot-input input{flex:1;border:1px solid var(--border);border-radius:8px;
  padding:.4rem .65rem;font-size:.85rem;background:var(--bg);color:var(--text)}
.chatbot-input button{background:var(--primary);color:var(--primary-text);
  border:none;border-radius:8px;padding:.4rem .85rem;cursor:pointer;font-size:.85rem}

/* ── Invoice Styles ──────────────────────────────────────────── */
.invoice-header{display:flex;justify-content:space-between;align-items:flex-start;
  margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}
.invoice-badge{font-family:var(--font-heading);font-size:1.4rem;color:var(--primary);font-weight:700}
.invoice-total{color:var(--primary)!important}

/* ── Checklist ────────────────────────────────────────────────── */
.task-item{display:flex;align-items:center;gap:.75rem;
  padding:.6rem 0;border-bottom:1px solid var(--border-light)}
.task-check{width:18px;height:18px;accent-color:var(--primary);cursor:pointer;flex-shrink:0}
.task-text{font-size:.875rem}
.task-completed .task-text{text-decoration:line-through;color:var(--color-muted)}
.priority-high{color:var(--danger)} .priority-medium{color:var(--warning)} .priority-low{color:var(--success)}

/* ── Responsive ─────────────────────────────────────────────────── */
@media(max-width:1024px){
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .blog-grid{grid-template-columns:repeat(2,1fr)}
  .portfolio-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .nav-links,.nav-actions .btn{display:none}
  .hamburger{display:flex}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;
    top:var(--navbar-h);left:0;right:0;background:var(--bg-card);
    border-bottom:1px solid var(--border);padding:1rem;gap:.25rem;box-shadow:var(--shadow-lg)}
  .admin-layout{flex-direction:column}
  .sidebar{width:100%;position:static;height:auto;border-right:none;
    border-bottom:1px solid var(--border)}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .blog-grid,.portfolio-grid{grid-template-columns:1fr}
  .event-chooser{grid-template-columns:repeat(2,1fr)}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero{height:80vh}
  .hero-title{font-size:2rem}
  .hero-subtitle{font-size:1rem}
  .payment-methods{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .container,.container-sm{padding:0 1rem}
  .card{padding:1rem}
  .hero{height:70vh;min-height:500px}
  .event-chooser{grid-template-columns:repeat(2,1fr)}
  .quote-steps{font-size:.75rem}
  .countdown-grid{grid-template-columns:repeat(4,1fr);gap:.5rem}
  .countdown-num{font-size:1.4rem}
}

/* ── Print ────────────────────────────────────────────────────── */
@media print{
  .navbar,.sidebar,.footer,.btn,.chatbot-wrap,.whatsapp-float{display:none!important}
  .admin-content,.admin-layout{display:block!important;padding:0!important}
  .card{box-shadow:none!important;border:1px solid #ddd!important}
}