:root{--pink:#ff4fb8;--hot-pink:#ff167e;--blue:#4c7dff;--cyan:#5ee7ff;--purple:#9b5cff;--gold:#ffc94d;--dark:#120c24;--text:#241431;--muted:#6d6280;--white:#fff;--shadow:0 24px 70px rgba(38,16,70,.18);--radius:28px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);overflow-x:hidden;position:relative}a{color:inherit;text-decoration:none}
body[data-theme=spring]{--pink:#ff4fb8;--hot-pink:#ff167e;--blue:#4c7dff;--purple:#9b5cff;--gold:#ffc94d;background:radial-gradient(circle at top left,rgba(255,79,184,.18),transparent 34%),radial-gradient(circle at top right,rgba(76,125,255,.18),transparent 32%),#fff8fd}body[data-theme=summer]{--pink:#ff7a59;--hot-pink:#ff5b35;--blue:#00a6ff;--purple:#ff9d00;--gold:#ffd34d;background:#fffaf3}body[data-theme=autumn]{--pink:#d96b3b;--hot-pink:#bf4d1e;--blue:#8c5a2b;--purple:#b44b30;--gold:#e2a23a;background:#fff8f1}body[data-theme=winter]{--pink:#6ca7ff;--hot-pink:#4b8fff;--blue:#4966ff;--purple:#7d8fff;--gold:#d7f3ff;background:#f6fbff}.page-glow{position:fixed;width:420px;height:420px;border-radius:50%;filter:blur(80px);z-index:-1;opacity:.45}.glow-1{top:-90px;left:-120px;background:rgba(255,79,184,.33)}.glow-2{top:240px;right:-140px;background:rgba(76,125,255,.28)}.glow-3{bottom:-100px;left:28%;background:rgba(255,201,77,.24)}
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 5vw}.navbar{max-width:1320px;margin:0 auto;min-height:76px;padding:12px 18px;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.78);backdrop-filter:blur(22px);border-radius:999px;box-shadow:0 15px 45px rgba(58,20,90,.10);display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}.logo-image-wrap{width:86px;height:86px;border-radius:28px;display:grid;place-items:center;background:#fff;box-shadow:0 10px 0 rgba(181,118,160,.18),0 18px 32px rgba(58,20,90,.14);overflow:hidden;flex-shrink:0}.logo-image{width:78px;height:78px;object-fit:contain;display:block}.logo-fallback{color:#fff!important;font-weight:900;font-size:1.55rem;background:linear-gradient(135deg,var(--pink),var(--purple),var(--blue))!important}.brand-text{display:grid;line-height:1.05}.brand-text strong{font-size:1.45rem;letter-spacing:-.02em}.brand-text small{color:var(--muted);font-size:.98rem;margin-top:6px}.nav-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.nav-links a,.btn,.slider-btn,.welcome-pills span,.google-chip,.theme-tile{border-radius:999px}.nav-links a{padding:13px 16px;color:#432b57;font-weight:800;font-size:1rem;background:#fff;box-shadow:0 8px 0 rgba(181,118,160,.18),0 14px 26px rgba(58,20,90,.10)}.nav-links a:hover{color:var(--hot-pink);transform:translateY(-2px)}.menu-toggle{display:none;width:48px;height:48px;border:0;border-radius:16px;background:#fff;cursor:pointer}.menu-toggle span{display:block;width:22px;height:2px;background:var(--dark);margin:5px auto;border-radius:99px}.theme-switcher{display:inline-flex;align-items:center;gap:8px;margin-left:4px;padding:11px 14px;border-radius:999px;background:#fff;box-shadow:0 8px 0 rgba(181,118,160,.18)}.theme-switcher label{font-size:.9rem;font-weight:800;color:#4a355b}.theme-switcher select{border:0;outline:0;font:inherit;font-weight:800;color:#4a355b;background:transparent;cursor:pointer}
.hero{position:relative;min-height:100vh;display:grid;align-items:center;overflow:hidden}.slider{position:absolute;inset:0}.slide{position:absolute;inset:0;background:linear-gradient(135deg,rgba(18,12,36,.42),rgba(255,79,184,.20)),var(--bg) center/cover no-repeat;opacity:0;transform:scale(1.06);transition:opacity 1s ease,transform 5s ease}.slide.active{opacity:1;transform:scale(1)}.slide-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,12,36,.78),rgba(18,12,36,.24),rgba(255,255,255,.04))}.hero-content{position:relative;z-index:4;width:min(1220px,90vw);margin:0 auto;padding-top:130px}.glass-card,.page-hero-card{width:min(760px,100%);padding:clamp(30px,6vw,64px);border-radius:36px;background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.38);color:#fff;backdrop-filter:blur(18px);box-shadow:var(--shadow)}.eyebrow,.section-tag,.mini-tag{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;font-size:.82rem;font-weight:850;text-transform:uppercase;letter-spacing:.12em}.eyebrow{color:#fff3fa;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22)}.hero h1,.page-hero-card h1{margin-top:18px;font-size:clamp(2.6rem,7vw,6.7rem);line-height:.92;letter-spacing:-.075em;max-width:860px}.page-hero-card h1{font-size:clamp(2.4rem,5vw,5.2rem)}.hero-text,.page-hero-card p{margin-top:22px;max-width:650px;color:rgba(255,255,255,.88);font-size:clamp(1.05rem,2vw,1.28rem);line-height:1.7}.hero-actions{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}.page-main{padding-top:120px}.page-hero{padding:70px 5vw 30px}.small-hero{background:linear-gradient(135deg,var(--hot-pink),var(--purple),var(--blue))}.page-hero-card{margin:0 auto;background:rgba(255,255,255,.18)}.btn{display:inline-flex;justify-content:center;align-items:center;min-height:60px;padding:0 32px;border:0;font-weight:900;cursor:pointer;transition:.25s ease;letter-spacing:.01em}.btn:hover{transform:translateY(-4px)}.btn.primary{color:#fff;background:linear-gradient(180deg,#ff9ddd 0%,#ff63bf 28%,#c26aff 62%,#5c87ff 100%);box-shadow:0 12px 0 rgba(113,63,161,.22),0 22px 36px rgba(255,22,126,.26)}.btn.secondary{color:#fff;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.34);box-shadow:0 10px 0 rgba(255,255,255,.12)}.btn.secondary.dark{color:#372146;background:#fff}.slider-controls{position:absolute;z-index:8;left:50%;bottom:28px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;padding:10px;border-radius:999px;background:rgba(255,255,255,.16)}.slider-btn{width:42px;height:42px;border:0;background:#fff;color:var(--dark);font-size:1.8rem}.dots{display:flex;gap:8px}.dot{width:10px;height:10px;border:0;border-radius:999px;background:rgba(255,255,255,.52)}.dot.active{width:28px;background:#fff}
.welcome-strip{padding:0 5vw;margin-top:-42px;position:relative;z-index:8}.welcome-card,.theme-preview-card{width:min(1120px,100%);margin:0 auto;padding:26px 28px;border-radius:28px;background:rgba(255,255,255,.92);box-shadow:var(--shadow)}.welcome-card{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}.mini-tag,.section-tag{color:var(--hot-pink);background:rgba(255,79,184,.09);border:1px solid rgba(255,79,184,.16)}.welcome-card h3{font-size:clamp(1.35rem,3vw,2.25rem);letter-spacing:-.04em}.welcome-pills{display:flex;gap:12px;flex-wrap:wrap}.welcome-pills span,.google-chip{padding:12px 16px;background:linear-gradient(135deg,rgba(255,79,184,.12),rgba(76,125,255,.12));color:#4a2e60;font-weight:800}.theme-preview-section{padding:24px 5vw 0}.theme-preview-card{text-align:center}.theme-preview-card h2{margin-top:14px;font-size:clamp(1.8rem,3vw,3rem)}.theme-preview-grid{margin-top:22px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.theme-tile{border:0;cursor:pointer;font:inherit;font-weight:900;min-height:68px;color:#fff}.theme-tile.spring{background:linear-gradient(180deg,#ff9ddd,#ff63bf,#8d62ff)}.theme-tile.summer{background:linear-gradient(180deg,#ffbf66,#ff7a59,#00a6ff)}.theme-tile.autumn{background:linear-gradient(180deg,#f0b56c,#d96b3b,#8c5a2b)}.theme-tile.winter{background:linear-gradient(180deg,#9be6ff,#6ca7ff,#4966ff)}
.section{padding:clamp(70px,9vw,120px) 5vw}.section-grid,.contact-grid{width:min(1120px,100%);margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,6vw,80px);align-items:center}.section h2,.section-heading h2,.admin-panel h2{margin-top:14px;font-size:clamp(2rem,4vw,4.2rem);line-height:1.02;letter-spacing:-.055em}.section p,.section-heading p{color:var(--muted);font-size:1.04rem;line-height:1.8;margin-top:18px}.stats{margin-top:30px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.stats div{padding:18px;border-radius:22px;background:#fff;box-shadow:0 12px 35px rgba(58,20,90,.08)}.stats strong{display:block;font-size:1.35rem;color:var(--hot-pink)}.about-card{position:relative;min-height:510px;border-radius:36px;background:linear-gradient(135deg,rgba(255,79,184,.20),rgba(76,125,255,.18),rgba(255,201,77,.15));box-shadow:var(--shadow);overflow:hidden}.about-image{position:absolute;inset:22px;border-radius:30px;background:linear-gradient(180deg,rgba(18,12,36,.10),rgba(18,12,36,.24)),url('assets/nt-slides-v9/newtek_uploaded_slide_08_v9.jpg?v=9') center/cover no-repeat}.floating-card{position:absolute;left:34px;right:34px;bottom:34px;padding:22px;border-radius:26px;color:#fff;background:rgba(18,12,36,.58)}.section-heading{width:min(760px,90vw);margin:0 auto 42px;text-align:center}.services-grid{width:min(1120px,100%);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.service-card,.contact-card,.app-form,.admin-panel,.kpi-card{border-radius:var(--radius);background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.75);box-shadow:0 20px 55px rgba(58,20,90,.09)}.service-card{padding:28px;transition:.3s ease}.service-card:hover{transform:translateY(-8px)}.service-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.service-top strong{font-size:1.4rem;color:var(--hot-pink)}.service-icon{width:58px;height:58px;display:grid;place-items:center;font-size:1.75rem;border-radius:20px;background:linear-gradient(135deg,rgba(255,79,184,.18),rgba(76,125,255,.18))}.service-card h3{margin-top:18px;font-size:1.3rem}.service-card p{margin-top:10px;color:var(--muted);line-height:1.7}.center-actions{text-align:center;margin-top:34px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.rating-number{font-size:clamp(3.4rem,6vw,5.2rem);line-height:.9;font-weight:900}.stars{margin-top:10px;color:var(--gold);letter-spacing:.18em;font-size:1.4rem}.contact-card,.app-form{padding:30px}.app-form{display:grid;gap:16px;width:min(950px,100%);margin:0 auto}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.app-form label{display:grid;gap:8px;color:#47325a;font-weight:800}.app-form input,.app-form textarea,.app-form select{width:100%;border:1px solid rgba(58,20,90,.12);border-radius:18px;padding:15px 16px;font:inherit;outline:none;background:#fff}.success-box,.error-box{padding:16px;border-radius:18px;font-weight:800}.success-box{background:#e9fff2;color:#116b35}.error-box{background:#fff0f0;color:#a01d1d}.big-btn{font-size:1.25rem;min-height:72px}.map-card{width:min(1120px,90vw);margin:34px auto 0;overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow)}.map-card iframe{width:100%;height:360px;border:0}.footer{padding:32px 5vw;text-align:center;color:var(--muted);background:#fff;display:grid;gap:6px}.dev-credit{font-weight:800;color:var(--hot-pink)}
.dashboard-kpis{width:min(1120px,100%);margin:0 auto 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.kpi-card{padding:24px}.kpi-card span{color:var(--muted);font-weight:800}.kpi-card strong{display:block;font-size:3rem;color:var(--hot-pink)}.admin-grid{width:min(1280px,100%);margin:0 auto;display:grid;gap:24px}.admin-panel{padding:26px;overflow:hidden}.admin-panel h2{font-size:2rem}.table-wrap{overflow:auto;margin-top:18px}table{width:100%;border-collapse:collapse;min-width:950px}th,td{padding:14px 12px;border-bottom:1px solid rgba(58,20,90,.10);text-align:left;vertical-align:top}th{color:var(--hot-pink);font-size:.9rem;text-transform:uppercase;letter-spacing:.08em}.mini-form{display:flex;gap:6px}.mini-form select,.mini-form button{border:1px solid rgba(58,20,90,.12);border-radius:12px;padding:8px;background:#fff}.mini-form button{font-weight:800;cursor:pointer}.admin-login{max-width:520px}.db-warning{width:min(1100px,92vw);margin:130px auto -90px;padding:18px 22px;border-radius:22px;background:#fff6d6;color:#5b3d00;box-shadow:0 14px 35px rgba(58,20,90,.12);border:1px solid rgba(255,193,7,.45);font-weight:700;line-height:1.6}.db-warning a{color:#b10063;text-decoration:underline}
@media(max-width:1100px){.nav-links{gap:6px}.nav-links a{font-size:.95rem}.theme-switcher label{display:none}}@media(max-width:900px){.navbar{border-radius:28px}.menu-toggle{display:block}.nav-links{position:absolute;top:calc(100% + 12px);left:5vw;right:5vw;display:none;flex-direction:column;align-items:stretch;padding:14px;border-radius:28px;background:rgba(255,255,255,.94);box-shadow:var(--shadow)}.nav-links.open{display:flex}.nav-links a,.theme-switcher{text-align:center;justify-content:center}.section-grid,.contact-grid{grid-template-columns:1fr}.services-grid,.theme-preview-grid,.form-grid,.dashboard-kpis{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.site-header{padding:10px 4vw}.navbar{min-height:68px;padding:10px 12px}.logo-image-wrap{width:64px;height:64px;border-radius:20px}.logo-image{width:60px;height:60px}.brand-text strong{font-size:1.18rem}.brand-text small{font-size:.85rem}.hero-content{width:92vw;padding-top:120px}.glass-card{padding:26px;border-radius:28px}.hero h1{font-size:clamp(2.45rem,14vw,4rem)}.hero-actions{flex-direction:column}.btn{width:100%;min-height:56px;padding:0 24px}.services-grid,.stats,.theme-preview-grid,.form-grid,.dashboard-kpis{grid-template-columns:1fr}.section,.welcome-strip,.theme-preview-section{padding-left:4vw;padding-right:4vw}.about-card{min-height:360px}.slider-controls{bottom:18px}.page-main{padding-top:100px}}


/* V8 hard slideshow fix: use only uploaded nail photos */
.slider-v8 .slide {
  background-position: center center !important;
  background-size: cover !important;
}
.slider-v8::after {
  content: "Real New Tek Nails Photos";
  position: absolute;
  right: 24px;
  bottom: 92px;
  z-index: 9;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.20);
  color: #fff;
  font-weight: 900;
  letter-spacing: .04em;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.28);
}


/* V9 uploaded slideshow fix */
.slider-v9 .slide {
  background-position: center center !important;
  background-size: cover !important;
}
.slider-v9::after {
  content: "Real New Tek Nails Uploaded Photos";
  position: absolute;
  right: 24px;
  bottom: 92px;
  z-index: 9;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.20);
  color: #fff;
  font-weight: 900;
  letter-spacing: .04em;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.28);
}
@media(max-width:700px){
  .slider-v9::after{right:14px;left:14px;bottom:86px;text-align:center;font-size:.8rem}
}


/* V10 Ours Work Gallery */
.ours-work-hero {
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.24), transparent 22%),
    linear-gradient(135deg, var(--hot-pink), var(--purple), var(--blue));
}

.ours-work-section {
  padding-top: 70px;
}

.ours-work-slider-wrap {
  width: min(1180px, 94vw);
  height: clamp(480px, 70vw, 760px);
  margin: 0 auto 80px;
  position: relative;
  border-radius: 36px;
  overflow: hidden;
  box-shadow: var(--shadow);
  background: #120c24;
}

.ours-work-slider {
  position: absolute;
  inset: 0;
}

.work-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity .75s ease, transform 4.5s ease;
  margin: 0;
}

.work-slide.active {
  opacity: 1;
  transform: scale(1);
}

.work-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(1.06) contrast(1.03);
}

.work-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18,12,36,.08), rgba(18,12,36,.58)),
    radial-gradient(circle at 80% 18%, rgba(255,255,255,.18), transparent 22%);
}

.work-slide figcaption {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 26px;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  color: #fff;
  padding: 18px 22px;
  border-radius: 24px;
  background: rgba(18,12,36,.42);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(14px);
}

.work-slide figcaption strong {
  font-size: clamp(1.2rem, 3vw, 2.1rem);
}

.work-slide figcaption span {
  color: rgba(255,255,255,.82);
  font-weight: 800;
}

.gallery-arrow {
  position: absolute;
  top: 50%;
  z-index: 5;
  transform: translateY(-50%);
  width: 62px;
  height: 62px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font-size: 2.6rem;
  line-height: 1;
  color: var(--dark);
  background: rgba(255,255,255,.88);
  box-shadow: 0 16px 40px rgba(0,0,0,.18);
}

.gallery-prev { left: 22px; }
.gallery-next { right: 22px; }

.gallery-dots {
  position: absolute;
  z-index: 6;
  left: 50%;
  bottom: 104px;
  transform: translateX(-50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: min(760px, 82vw);
}

.gallery-dot {
  width: 10px;
  height: 10px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.56);
  cursor: pointer;
}

.gallery-dot.active {
  width: 28px;
  background: #fff;
}

.gallery-heading {
  margin-top: 20px;
}

.work-grid {
  width: min(1180px, 94vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.work-thumb {
  border: 0;
  cursor: pointer;
  padding: 0;
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 14px 35px rgba(58,20,90,.10);
  aspect-ratio: 1 / 1;
  transition: transform .25s ease, outline .25s ease;
}

.work-thumb:hover,
.work-thumb.active {
  transform: translateY(-4px);
  outline: 4px solid rgba(255,79,184,.35);
}

.work-thumb img,
.admin-photo-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Admin upload gallery */
.upload-note {
  color: var(--muted);
  font-weight: 700;
}

.admin-work-grid {
  align-items: start;
}

.admin-photo-card {
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 14px 35px rgba(58,20,90,.10);
  padding: 12px;
}

.admin-photo-card img {
  height: 230px;
  border-radius: 18px;
}

.admin-photo-card form {
  margin-top: 10px;
}

.delete-photo-btn {
  width: 100%;
  border: 0;
  padding: 12px 16px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 900;
  color: #fff;
  background: linear-gradient(180deg, #ff6d6d, #c90042);
}

.admin-photo-card small {
  display: block;
  margin-top: 10px;
  color: var(--muted);
  word-break: break-all;
}

@media(max-width: 900px) {
  .work-grid { grid-template-columns: repeat(2, 1fr); }
  .work-slide figcaption {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media(max-width: 620px) {
  .ours-work-slider-wrap {
    height: 580px;
    border-radius: 26px;
  }
  .gallery-arrow {
    width: 48px;
    height: 48px;
    font-size: 2rem;
  }
  .gallery-prev { left: 12px; }
  .gallery-next { right: 12px; }
  .gallery-dots { bottom: 118px; }
  .work-grid { grid-template-columns: 1fr; }
}


/* V11 About photo slideshow: New Tek Nails / Relax. Refresh. Shine. */
.about-work-card {
  isolation: isolate;
  background: #120c24;
}

.about-work-slideshow {
  position: absolute;
  inset: 18px;
  border-radius: 30px;
  overflow: hidden;
  z-index: 1;
}

.about-work-slide {
  position: absolute;
  inset: 0;
  background-position: center center;
  background-size: cover;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity .9s ease, transform 5s ease;
}

.about-work-slide.active {
  opacity: 1;
  transform: scale(1);
}

.about-work-slideshow::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18,12,36,.08), rgba(18,12,36,.62)),
    radial-gradient(circle at 82% 18%, rgba(255,255,255,.18), transparent 24%);
  z-index: 2;
}

.about-photo-strip {
  position: absolute;
  z-index: 4;
  top: 34px;
  left: 34px;
  right: 34px;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.about-photo-strip span {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background-position: center;
  background-size: cover;
  border: 2px solid rgba(255,255,255,.75);
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

.enhanced-floating-card {
  z-index: 5;
  display: grid;
  gap: 6px;
}

.mini-gallery-link {
  margin-top: 10px;
  display: inline-flex;
  width: max-content;
  padding: 10px 14px;
  border-radius: 999px;
  color: #fff;
  font-weight: 900;
  background: linear-gradient(180deg, rgba(255,79,184,.95), rgba(76,125,255,.95));
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
}

.about-mini-gallery-preview {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.about-mini-gallery-preview img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(58,20,90,.11);
  border: 3px solid rgba(255,255,255,.82);
}

@media(max-width: 620px) {
  .about-photo-strip {
    left: 22px;
    right: 22px;
    top: 22px;
  }
  .about-photo-strip span {
    width: 46px;
    height: 46px;
    border-radius: 14px;
  }
  .about-mini-gallery-preview {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* V13 appointment thank-you card */
.appointment-thank-you-card {
  margin: 10px 0 22px;
}
.appointment-thank-you-card > div {
  background: #fff;
  box-shadow: 0 18px 50px rgba(58,20,90,.10);
}


/* V15 fit images and gallery lightbox */
/* Homepage slideshow: show the whole image instead of zoom/crop */
.slider .slide,
.slider-v8 .slide,
.slider-v9 .slide {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: #160d24 !important;
}

/* Reduce overlay so photos are easier to see */
.hero .slide-overlay,
.slide-overlay {
  background:
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.12), transparent 28%),
    linear-gradient(90deg, rgba(18,12,36,.58), rgba(18,12,36,.18), rgba(18,12,36,.06)) !important;
}

/* Ours Work large slideshow: fit full vertical/horizontal photos */
.work-slide img {
  object-fit: contain !important;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,79,184,.18), transparent 26%),
    radial-gradient(circle at 80% 18%, rgba(76,125,255,.20), transparent 28%),
    #160d24 !important;
  padding: 10px;
}

.ours-work-slider-wrap {
  background:
    radial-gradient(circle at 20% 20%, rgba(255,79,184,.20), transparent 26%),
    radial-gradient(circle at 80% 15%, rgba(76,125,255,.22), transparent 26%),
    #160d24 !important;
}

/* About section slideshow: fit full images */
.about-work-slide {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: #160d24 !important;
}

.about-work-slideshow {
  background: #160d24 !important;
}

/* Thumbnails and admin previews: show full image */
.work-thumb img,
.admin-photo-card img,
.about-mini-gallery-preview img {
  object-fit: contain !important;
  background: #160d24 !important;
  padding: 4px;
}

/* Make thumbs feel clickable */
.work-thumb {
  position: relative;
}

.work-thumb::after {
  content: "Click to enlarge";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  padding: 7px 9px;
  border-radius: 999px;
  color: #fff;
  background: rgba(18,12,36,.62);
  font-size: .78rem;
  font-weight: 900;
  opacity: 0;
  transform: translateY(5px);
  transition: .2s ease;
  backdrop-filter: blur(8px);
}

.work-thumb:hover::after {
  opacity: 1;
  transform: translateY(0);
}

/* Larger image popup viewer */
.lightbox-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(5, 3, 12, .88);
  backdrop-filter: blur(10px);
}

.lightbox-modal.open {
  display: flex;
}

.lightbox-inner {
  position: relative;
  width: min(1100px, 96vw);
  height: min(820px, 90vh);
  display: grid;
  place-items: center;
}

.lightbox-image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 22px;
  background: #160d24;
  box-shadow: 0 30px 90px rgba(0,0,0,.42);
}

.lightbox-close,
.lightbox-prev,
.lightbox-next {
  position: absolute;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  color: #120c24;
  background: rgba(255,255,255,.92);
  box-shadow: 0 15px 40px rgba(0,0,0,.28);
  font-weight: 900;
}

.lightbox-close {
  top: -12px;
  right: -12px;
  width: 52px;
  height: 52px;
  font-size: 1.7rem;
}

.lightbox-prev,
.lightbox-next {
  top: 50%;
  transform: translateY(-50%);
  width: 58px;
  height: 58px;
  font-size: 2.4rem;
  line-height: 1;
}

.lightbox-prev {
  left: -8px;
}

.lightbox-next {
  right: -8px;
}

.lightbox-caption {
  position: absolute;
  left: 50%;
  bottom: -4px;
  transform: translateX(-50%);
  width: max-content;
  max-width: 90%;
  padding: 10px 16px;
  border-radius: 999px;
  color: #fff;
  background: rgba(18,12,36,.65);
  font-weight: 900;
  text-align: center;
  backdrop-filter: blur(10px);
}

@media(max-width: 760px) {
  .work-slide img {
    padding: 4px;
  }

  .ours-work-slider-wrap {
    height: 640px;
  }

  .lightbox-inner {
    height: 84vh;
  }

  .lightbox-close {
    top: 6px;
    right: 6px;
  }

  .lightbox-prev {
    left: 6px;
  }

  .lightbox-next {
    right: 6px;
  }

  .lightbox-prev,
  .lightbox-next {
    width: 48px;
    height: 48px;
    font-size: 2rem;
  }

  .work-thumb::after {
    opacity: 1;
    transform: none;
    font-size: .72rem;
  }
}


/* V16 FORCE image fit and gallery open */
/* Homepage slideshow photos: show full photo, not zoomed/cropped */
.slider .slide,
.slider-v8 .slide,
.slider-v9 .slide {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: #160d24 !important;
}

/* Make old/remote-style background images clearly fit */
.slide {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}

/* Gallery large slideshow: full image visible */
.work-slide img,
.ours-work-slider img {
  object-fit: contain !important;
  background: #160d24 !important;
  padding: 8px !important;
}

/* About section slideshow: full image visible */
.about-work-slide {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: #160d24 !important;
}

/* Thumbnails show full photo */
.work-thumb img,
.admin-photo-card img,
.about-mini-gallery-preview img,
.about-photo-strip span {
  object-fit: contain !important;
  background-color: #160d24 !important;
}

/* make gallery click obvious */
.work-thumb {
  position: relative !important;
  cursor: zoom-in !important;
}

.work-thumb::before {
  content: "OPEN LARGE";
  position: absolute;
  z-index: 4;
  top: 10px;
  right: 10px;
  padding: 7px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: #120c24;
  font-weight: 900;
  font-size: .72rem;
  box-shadow: 0 8px 20px rgba(0,0,0,.20);
}

/* Lightbox */
.lightbox-modal {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(5,3,12,.92);
  backdrop-filter: blur(10px);
}

.lightbox-modal.open {
  display: flex;
}

.lightbox-inner {
  position: relative;
  width: min(1200px, 96vw);
  height: min(860px, 90vh);
  display: grid;
  place-items: center;
}

.lightbox-image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  background: #160d24;
  border-radius: 20px;
  box-shadow: 0 30px 90px rgba(0,0,0,.48);
}

.lightbox-close,
.lightbox-prev,
.lightbox-next {
  position: absolute;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  color: #120c24;
  background: rgba(255,255,255,.95);
  box-shadow: 0 15px 40px rgba(0,0,0,.28);
  font-weight: 900;
}

.lightbox-close {
  top: 8px;
  right: 8px;
  width: 54px;
  height: 54px;
  font-size: 1.8rem;
}

.lightbox-prev,
.lightbox-next {
  top: 50%;
  transform: translateY(-50%);
  width: 58px;
  height: 58px;
  font-size: 2.5rem;
  line-height: 1;
}

.lightbox-prev { left: 8px; }
.lightbox-next { right: 8px; }

.lightbox-caption {
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  padding: 10px 16px;
  border-radius: 999px;
  color: #fff;
  background: rgba(18,12,36,.70);
  font-weight: 900;
  backdrop-filter: blur(10px);
}

@media(max-width:760px) {
  .ours-work-slider-wrap { height: 650px !important; }
  .work-slide img { padding: 4px !important; }
  .lightbox-prev, .lightbox-next {
    width: 48px;
    height: 48px;
    font-size: 2rem;
  }
}


/* V17 warm appointment message */
.warm-appointment-message {
  font-size: 1.12rem !important;
  line-height: 1.75 !important;
  color: rgba(255,255,255,.94) !important;
  max-width: 720px !important;
}


/* V18 private backend */
.backend-page .dashboard-kpis {
  grid-template-columns: repeat(4, 1fr);
}

.backend-form {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.backend-subtitle {
  margin-top: 30px;
  font-size: 1.25rem;
}

.backend-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.confirm-btn,
.delete-btn {
  border: 0;
  border-radius: 999px;
  padding: 9px 13px;
  cursor: pointer;
  font-weight: 900;
}

.confirm-btn {
  color: #fff;
  background: linear-gradient(180deg, #2fd175, #079144);
}

.delete-btn {
  color: #fff;
  background: linear-gradient(180deg, #ff6f7d, #c90042);
}

.backend-gallery-grid {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.backend-media-card {
  padding: 12px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 14px 35px rgba(58,20,90,.10);
  display: grid;
  gap: 10px;
}

.backend-media-card.is-hidden {
  opacity: .55;
  filter: grayscale(.5);
}

.backend-media-card img,
.backend-media-card video {
  width: 100%;
  height: 220px;
  object-fit: contain;
  border-radius: 18px;
  background: #160d24;
}

.backend-media-card small {
  color: var(--muted);
  word-break: break-all;
}

/* Ours Work video/image support */
.work-slide video,
.work-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  background: #160d24 !important;
  display: block;
}

.work-thumb video,
.work-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  background: #160d24 !important;
  display: block;
}

.video-pill {
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 5;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #120c24;
  font-weight: 900;
  font-size: .75rem;
}

@media(max-width: 900px) {
  .backend-page .dashboard-kpis,
  .backend-gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media(max-width: 620px) {
  .backend-page .dashboard-kpis,
  .backend-gallery-grid {
    grid-template-columns: 1fr;
  }
}


/* V19 warm contact message */
.contact-warm-note {
  font-size: 1.12rem !important;
  line-height: 1.75 !important;
  color: rgba(255,255,255,.94) !important;
}


/* V20 warm contact submit message */
.contact-warm-note,
.contact-submit-warm-note {
  font-size: 1.12rem !important;
  line-height: 1.75 !important;
}


/* V21 backend confirm button */
.backend-confirm-help-panel {
  width: min(1280px, 100%);
  margin: 0 auto 24px;
  padding: 24px;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(47,209,117,.16), rgba(76,125,255,.13), rgba(255,79,184,.10));
  box-shadow: 0 18px 45px rgba(58,20,90,.10);
  border: 1px solid rgba(255,255,255,.75);
}

.backend-confirm-help-panel h2 {
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  margin: 0 0 10px;
  letter-spacing: -.04em;
}

.backend-confirm-help-panel p {
  color: var(--muted);
  line-height: 1.7;
  font-weight: 700;
}

.confirm-message-preview {
  margin-top: 14px;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(255,255,255,.82);
  display: grid;
  gap: 6px;
}

.confirm-message-preview strong {
  color: #079144;
}

.confirm-message-preview span {
  color: #332044;
  font-weight: 800;
}

.big-confirm-btn {
  min-width: 210px;
  font-size: .92rem;
  box-shadow: 0 8px 22px rgba(7,145,68,.18);
}

.backend-actions {
  align-items: center;
}

@media(max-width: 760px) {
  .big-confirm-btn {
    width: 100%;
    min-width: 0;
  }
}


/* V22 iPhone iOS app responsive layer */
:root {
  --ios-safe-top: env(safe-area-inset-top, 0px);
  --ios-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ios-tab-height: 78px;
}

html {
  -webkit-text-size-adjust: 100%;
  touch-action: manipulation;
}

body {
  -webkit-font-smoothing: antialiased;
  padding-bottom: calc(var(--ios-tab-height) + var(--ios-safe-bottom));
}

button,
.btn,
input,
select,
textarea,
a {
  -webkit-tap-highlight-color: transparent;
}

input,
select,
textarea {
  font-size: 16px !important; /* stops iPhone zooming inputs */
}

/* iOS bottom app navigation */
.ios-bottom-nav {
  display: none;
}

.ios-install-hint {
  display: none;
}

/* Better app-card feel */
.app-form,
.admin-panel,
.contact-card,
.service-card,
.kpi-card,
.welcome-card,
.theme-preview-card {
  backdrop-filter: blur(18px);
}

/* Mobile backend tables: make them scroll like app panels */
.table-wrap {
  -webkit-overflow-scrolling: touch;
}

@media(max-width: 820px) {
  body {
    background-attachment: fixed;
  }

  .site-header {
    padding-top: calc(8px + var(--ios-safe-top)) !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .navbar {
    min-height: 66px !important;
    border-radius: 26px !important;
    padding: 8px 10px !important;
    background: rgba(255,255,255,.82) !important;
    box-shadow: 0 12px 38px rgba(38,16,70,.14) !important;
  }

  .logo-image-wrap {
    width: 58px !important;
    height: 58px !important;
    border-radius: 20px !important;
  }

  .logo-image {
    width: 54px !important;
    height: 54px !important;
  }

  .brand-text strong {
    font-size: 1.1rem !important;
  }

  .brand-text small {
    font-size: .76rem !important;
  }

  .menu-toggle {
    display: grid !important;
    place-items: center;
    width: 46px !important;
    height: 46px !important;
    border-radius: 18px !important;
    box-shadow: inset 0 -3px 0 rgba(0,0,0,.08), 0 10px 22px rgba(58,20,90,.10);
  }

  .nav-links {
    top: calc(100% + 10px) !important;
    left: 10px !important;
    right: 10px !important;
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .nav-links a {
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px !important;
  }

  .ios-bottom-nav {
    position: fixed;
    z-index: 99998;
    left: 10px;
    right: 10px;
    bottom: max(8px, var(--ios-safe-bottom));
    height: 70px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    border-radius: 28px;
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(255,255,255,.65);
    box-shadow: 0 18px 50px rgba(18,12,36,.20);
    backdrop-filter: blur(22px);
  }

  .ios-tab {
    height: 54px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    gap: 1px;
    color: #41234f;
    font-weight: 900;
  }

  .ios-tab span {
    font-size: 1.28rem;
    line-height: 1;
  }

  .ios-tab small {
    font-size: .64rem;
    line-height: 1;
  }

  .ios-tab-main {
    color: #fff;
    background: linear-gradient(180deg, var(--pink), var(--purple), var(--blue));
    transform: translateY(-12px);
    height: 62px;
    border-radius: 24px;
    box-shadow: 0 12px 28px rgba(255,79,184,.32);
  }

  .ios-tab-main span {
    font-size: 1.65rem;
  }

  .hero,
  .page-hero {
    min-height: calc(100svh - 20px);
  }

  .page-main {
    padding-top: calc(94px + var(--ios-safe-top)) !important;
  }

  .section {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .page-hero {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .page-hero-card,
  .glass-card {
    border-radius: 30px !important;
  }

  .page-hero-card h1 {
    font-size: clamp(2.15rem, 11vw, 4rem) !important;
    line-height: .98 !important;
  }

  .page-hero-card p {
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  .btn {
    min-height: 54px !important;
    border-radius: 19px !important;
    font-size: .98rem !important;
  }

  .app-form {
    border-radius: 30px !important;
    padding: 20px !important;
    gap: 14px !important;
  }

  .app-form input,
  .app-form select,
  .app-form textarea {
    min-height: 54px;
    border-radius: 18px !important;
    padding: 14px 15px !important;
  }

  .app-form textarea {
    min-height: 118px;
  }

  .form-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .services-grid,
  .work-grid,
  .backend-gallery-grid,
  .dashboard-kpis,
  .contact-grid,
  .section-grid {
    grid-template-columns: 1fr !important;
  }

  .service-card,
  .contact-card,
  .admin-panel,
  .kpi-card {
    border-radius: 28px !important;
    padding: 20px !important;
  }

  .dashboard-kpis {
    width: min(100%, 94vw) !important;
  }

  .kpi-card strong {
    font-size: 2.1rem !important;
  }

  .admin-grid {
    width: min(100%, 94vw) !important;
  }

  .table-wrap {
    margin-left: -6px;
    margin-right: -6px;
    padding: 0 6px 10px;
  }

  table {
    min-width: 780px !important;
  }

  th,
  td {
    padding: 12px 10px !important;
  }

  .backend-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .confirm-btn,
  .delete-btn,
  .big-confirm-btn {
    width: 100% !important;
    min-height: 44px;
    border-radius: 16px !important;
  }

  .ours-work-slider-wrap {
    width: 100% !important;
    height: min(660px, 76svh) !important;
    border-radius: 28px !important;
  }

  .work-slide figcaption {
    left: 14px !important;
    right: 14px !important;
    bottom: 18px !important;
    border-radius: 22px !important;
    padding: 14px !important;
  }

  .gallery-arrow {
    width: 48px !important;
    height: 48px !important;
    font-size: 2rem !important;
  }

  .gallery-prev { left: 10px !important; }
  .gallery-next { right: 10px !important; }

  .gallery-dots {
    bottom: 92px !important;
    max-width: 86vw !important;
  }

  .work-thumb {
    border-radius: 26px !important;
    min-height: 320px;
  }

  .work-thumb img,
  .work-thumb video {
    height: 100% !important;
  }

  .lightbox-inner {
    width: 96vw !important;
    height: 82svh !important;
  }

  .lightbox-image {
    border-radius: 18px !important;
  }

  .lightbox-close {
    top: 8px !important;
    right: 8px !important;
  }

  .footer {
    padding-bottom: calc(100px + var(--ios-safe-bottom)) !important;
  }

  .ios-install-hint {
    position: fixed;
    z-index: 99997;
    left: 16px;
    right: 16px;
    bottom: calc(86px + var(--ios-safe-bottom));
    display: none;
    padding: 12px 14px;
    border-radius: 18px;
    background: rgba(18,12,36,.82);
    color: #fff;
    font-size: .82rem;
    font-weight: 800;
    text-align: center;
    backdrop-filter: blur(16px);
  }

  body.show-ios-install .ios-install-hint {
    display: block;
  }
}

/* iPhone small screens */
@media(max-width: 430px) {
  .ios-bottom-nav {
    left: 8px;
    right: 8px;
    padding: 7px 8px;
    gap: 4px;
  }

  .ios-tab small {
    font-size: .58rem;
  }

  .brand-text small {
    display: none;
  }

  .page-hero-card h1 {
    font-size: 2.35rem !important;
  }

  .section h2,
  .section-heading h2 {
    font-size: 2.1rem !important;
  }

  .work-thumb {
    min-height: 300px;
  }
}

/* iOS standalone PWA app mode */
@media(display-mode: standalone) {
  .site-header {
    padding-top: calc(14px + var(--ios-safe-top)) !important;
  }

  body {
    user-select: none;
  }

  input,
  textarea {
    user-select: text;
  }
}


/* V23 backend 500 fix */
.backend-confirm-help-panel {
  width: min(1280px, 100%);
  margin: 0 auto 24px;
  padding: 24px;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(47,209,117,.16), rgba(76,125,255,.13), rgba(255,79,184,.10));
  box-shadow: 0 18px 45px rgba(58,20,90,.10);
  border: 1px solid rgba(255,255,255,.75);
}

.backend-confirm-help-panel h2 {
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  margin: 0 0 10px;
}

.confirm-message-preview {
  margin-top: 14px;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(255,255,255,.82);
  display: grid;
  gap: 6px;
}

.confirm-message-preview strong { color: #079144; }
.confirm-message-preview span { font-weight: 800; }

.backend-form {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.backend-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.confirm-btn,
.delete-btn {
  border: 0;
  border-radius: 999px;
  padding: 9px 13px;
  cursor: pointer;
  font-weight: 900;
}

.confirm-btn {
  color: #fff;
  background: linear-gradient(180deg, #2fd175, #079144);
}

.delete-btn {
  color: #fff;
  background: linear-gradient(180deg, #ff6f7d, #c90042);
}

.big-confirm-btn {
  min-width: 210px;
  font-size: .92rem;
}

.backend-subtitle {
  margin-top: 30px;
  font-size: 1.25rem;
}

.backend-gallery-grid {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.backend-media-card {
  padding: 12px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 14px 35px rgba(58,20,90,.10);
  display: grid;
  gap: 10px;
}

.backend-media-card.is-hidden {
  opacity: .55;
  filter: grayscale(.5);
}

.backend-media-card img,
.backend-media-card video {
  width: 100%;
  height: 220px;
  object-fit: contain;
  border-radius: 18px;
  background: #160d24;
}

.backend-media-card small {
  color: var(--muted);
  word-break: break-all;
}

@media(max-width: 900px) {
  .backend-gallery-grid { grid-template-columns: repeat(2,1fr); }
}

@media(max-width: 620px) {
  .backend-gallery-grid { grid-template-columns: 1fr; }
  .backend-actions { display: grid; grid-template-columns: 1fr; }
  .big-confirm-btn { width: 100%; min-width: 0; }
}


/* V24 remove check-in panel */
.hero-actions {
  justify-content: flex-start;
}

@media(max-width: 760px) {
  .hero-actions {
    grid-template-columns: 1fr 1fr !important;
  }
}

@media(max-width: 430px) {
  .hero-actions {
    grid-template-columns: 1fr !important;
  }
}


/* V25 move hero text away from slideshow */
.hero {
  align-items: stretch !important;
}

.hero-text-mini-panel,
.hero .hero-content {
  position: absolute !important;
  z-index: 20 !important;
  top: 132px !important;
  left: 24px !important;
  width: 260px !important;
  max-width: calc(100vw - 48px) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.hero-mini-card,
.hero .glass-card {
  width: 100% !important;
  padding: 14px 14px 15px !important;
  border-radius: 24px !important;
  background: rgba(18, 12, 36, .36) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.16) !important;
  backdrop-filter: blur(12px) !important;
}

.hero-mini-card .eyebrow,
.hero .glass-card .eyebrow {
  padding: 6px 10px !important;
  font-size: .62rem !important;
  letter-spacing: .055em !important;
  white-space: normal !important;
}

.hero-mini-card h1,
.hero .glass-card h1,
.hero h1 {
  margin-top: 9px !important;
  font-size: 1.25rem !important;
  line-height: 1.05 !important;
  letter-spacing: -.035em !important;
  max-width: 100% !important;
}

.hero-mini-card .hero-text,
.hero .glass-card .hero-text {
  margin-top: 8px !important;
  font-size: .76rem !important;
  line-height: 1.35 !important;
  color: rgba(255,255,255,.88) !important;
}

.hero-mini-card .hero-actions,
.hero .glass-card .hero-actions,
.hero-actions {
  margin-top: 11px !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 7px !important;
}

.hero-mini-card .hero-actions .btn,
.hero .glass-card .hero-actions .btn {
  width: 100% !important;
  min-height: 38px !important;
  padding: 0 10px !important;
  font-size: .75rem !important;
  border-radius: 999px !important;
}

/* keep slideshow controls away from text */
.slider-controls {
  left: auto !important;
  right: 20px !important;
  bottom: 20px !important;
  transform: none !important;
}

/* On iPhone, make it a very slim top bar */
@media(max-width: 760px) {
  .hero-text-mini-panel,
  .hero .hero-content {
    top: calc(92px + env(safe-area-inset-top, 0px)) !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
  }

  .hero-mini-card,
  .hero .glass-card {
    padding: 10px 11px !important;
    border-radius: 20px !important;
    background: rgba(18, 12, 36, .30) !important;
  }

  .hero-mini-card h1,
  .hero .glass-card h1,
  .hero h1 {
    font-size: 1.05rem !important;
    margin-top: 5px !important;
  }

  .hero-mini-card .hero-text,
  .hero .glass-card .hero-text {
    display: none !important;
  }

  .hero-mini-card .hero-actions,
  .hero .glass-card .hero-actions {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
    margin-top: 8px !important;
  }

  .hero-mini-card .hero-actions .btn,
  .hero .glass-card .hero-actions .btn {
    min-height: 36px !important;
    font-size: .70rem !important;
    padding: 0 8px !important;
  }

  .slider-controls {
    right: 12px !important;
    bottom: 86px !important;
  }
}

@media(max-width: 430px) {
  .hero-mini-card .eyebrow,
  .hero .glass-card .eyebrow {
    font-size: .58rem !important;
  }

  .hero-mini-card h1,
  .hero .glass-card h1,
  .hero h1 {
    font-size: .98rem !important;
  }
}


/* V26 social likes views visitor counters */
.social-follow-row,
.social-share-row,
.gallery-action-row,
.gallery-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
}

.social-follow-row {
  margin-top: 18px;
}

.social-chip,
.social-mini,
.like-btn,
.share-btn {
  border: 0;
  border-radius: 999px;
  padding: 10px 13px;
  font-weight: 900;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}

.social-chip {
  color: #fff;
  min-height: 42px;
}

.social-chip.facebook,
.social-mini.facebook { background: linear-gradient(180deg,#4b8dff,#1455d9); color:#fff; }

.social-chip.instagram,
.social-mini.instagram { background: linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045); color:#fff; }

.social-chip.tiktok,
.social-mini.tiktok { background: linear-gradient(135deg,#111,#ff0050,#00f2ea); color:#fff; }

.work-card-social {
  border-radius: 28px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.72);
  box-shadow: 0 18px 46px rgba(58,20,90,.10);
  padding: 12px;
  display: grid;
  gap: 12px;
}

.work-card-social .work-thumb {
  width: 100%;
}

.gallery-stats-row {
  justify-content: space-between;
  padding: 8px 10px;
  border-radius: 18px;
  background: rgba(255,79,184,.08);
  color: #3a244d;
  font-weight: 900;
}

.gallery-stats-row span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.gallery-action-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.like-btn {
  color: #fff;
  background: linear-gradient(180deg,#ff70bd,#e91579);
}

.like-btn.liked {
  background: linear-gradient(180deg,#ffb3d9,#ff3f9c);
  transform: scale(.98);
}

.share-btn {
  color: #fff;
  background: linear-gradient(180deg,#7fa2ff,#4c63ff);
}

.social-share-row {
  display: grid;
  grid-template-columns: repeat(3,1fr);
}

.social-mini {
  min-height: 36px;
  padding: 8px 8px;
  font-size: .78rem;
}

.visitor-count-badge {
  position: fixed;
  z-index: 99996;
  right: 18px;
  bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  display: grid;
  gap: 2px;
  min-width: 150px;
  padding: 12px 14px;
  border-radius: 22px;
  background: rgba(18,12,36,.72);
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 48px rgba(0,0,0,.18);
}

.visitor-count-badge span {
  font-size: .72rem;
  opacity: .86;
  font-weight: 800;
}

.visitor-count-badge strong {
  font-size: 1.35rem;
  line-height: 1;
}

.visitor-count-badge small {
  opacity: .78;
  font-weight: 800;
}

.share-toast {
  position: fixed;
  z-index: 1000000;
  left: 50%;
  bottom: calc(120px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%) translateY(10px);
  padding: 12px 16px;
  border-radius: 999px;
  background: rgba(18,12,36,.86);
  color: #fff;
  font-weight: 900;
  opacity: 0;
  pointer-events: none;
  transition: .25s ease;
  backdrop-filter: blur(14px);
}

.share-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

@media(max-width: 760px) {
  .visitor-count-badge {
    right: 12px;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px));
    min-width: 126px;
    padding: 10px 12px;
  }

  .visitor-count-badge span {
    font-size: .66rem;
  }

  .visitor-count-badge strong {
    font-size: 1.12rem;
  }

  .social-share-row {
    grid-template-columns: 1fr;
  }

  .gallery-action-row {
    grid-template-columns: 1fr;
  }
}


/* V27 email only appointment panel */
.appointment-hero-panel .page-hero-card {
  max-width: 920px;
}

.appointment-booking-panel {
  width: min(980px, 94vw);
}

.appointment-panel-title {
  display: grid;
  gap: 6px;
  margin-bottom: 6px;
}

.appointment-panel-title h2 {
  font-size: clamp(2rem, 4vw, 3.2rem);
  margin: 0;
  letter-spacing: -.05em;
}

.appointment-panel-title p,
.email-only-note {
  color: var(--muted);
  font-weight: 800;
}

.required-pill {
  display: inline-flex;
  margin-left: 7px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: .68rem;
  color: #fff;
  background: linear-gradient(180deg,#ff70bd,#e91579);
}

.email-only-note {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  border-radius: 22px;
  background: rgba(76,125,255,.10);
  border: 1px solid rgba(76,125,255,.15);
}

.appointment-submit-btn {
  width: min(420px, 100%);
}

.appointment-full-panel {
  grid-column: 1 / -1;
}

.appointment-card-list {
  display: grid;
  gap: 18px;
}

.appointment-request-card {
  border-radius: 26px;
  padding: 18px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.76);
  box-shadow: 0 14px 34px rgba(58,20,90,.10);
  display: grid;
  gap: 14px;
}

.appointment-request-card.status-confirmed {
  border-color: rgba(7,145,68,.28);
  background: linear-gradient(135deg, rgba(47,209,117,.10), rgba(255,255,255,.95));
}

.appt-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.appt-card-top h3 {
  margin: 0 0 4px;
  font-size: 1.45rem;
}

.appt-card-top p {
  margin: 0;
  color: var(--muted);
  font-weight: 800;
}

.appt-status {
  padding: 8px 12px;
  border-radius: 999px;
  color: #fff;
  font-weight: 900;
  background: linear-gradient(180deg,#7fa2ff,#4c63ff);
}

.status-confirmed .appt-status {
  background: linear-gradient(180deg,#2fd175,#079144);
}

.appt-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.appt-detail-grid p,
.appt-notes {
  margin: 0;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255,79,184,.07);
  color: #3a244d;
}

.email-confirm-form {
  display: grid;
  gap: 12px;
}

.email-confirm-form textarea {
  width: 100%;
  min-height: 92px;
  border-radius: 18px;
}

.email-only-panel {
  background: linear-gradient(135deg, rgba(47,209,117,.16), rgba(76,125,255,.13), rgba(255,255,255,.78));
}

.mini-income-kpis {
  grid-template-columns: repeat(2, 1fr);
  margin-bottom: 16px;
}

@media(max-width: 900px) {
  .appt-detail-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .appt-card-top {
    display: grid;
  }
}

@media(max-width: 620px) {
  .appt-detail-grid {
    grid-template-columns: 1fr;
  }
  .appointment-request-card {
    padding: 14px;
  }
  .backend-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
}


/* V28 separate check-in and tech manager */
.checkin-hero .page-hero-card {
  background: linear-gradient(135deg, rgba(255,79,184,.20), rgba(76,125,255,.14), rgba(255,255,255,.82));
}

.checkin-panel {
  width: min(920px, 94vw);
}

.checkin-submit-btn {
  width: min(360px, 100%);
}

.checkin-list-panel {
  grid-column: 1 / -1;
}

.checkin-card-list,
.tech-list {
  display: grid;
  gap: 16px;
}

.checkin-card,
.tech-card {
  padding: 18px;
  border-radius: 26px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 34px rgba(58,20,90,.10);
  border: 1px solid rgba(255,255,255,.76);
  display: grid;
  gap: 14px;
}

.checkin-card.status-in-service {
  border-color: rgba(76,125,255,.30);
  background: linear-gradient(135deg, rgba(76,125,255,.10), rgba(255,255,255,.95));
}

.checkin-card.status-done {
  border-color: rgba(7,145,68,.28);
  background: linear-gradient(135deg, rgba(47,209,117,.10), rgba(255,255,255,.95));
}

.done-btn {
  background: linear-gradient(180deg, #7de59e, #079144) !important;
}

.tech-manager-panel {
  grid-column: 1 / -1;
}

.tech-card {
  grid-template-columns: 1fr auto auto;
  align-items: center;
}

.tech-card span {
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 900;
  color: #fff;
  background: linear-gradient(180deg,#2fd175,#079144);
}

.tech-card.inactive-tech {
  opacity: .72;
  filter: grayscale(.2);
}

.tech-card.inactive-tech span {
  background: linear-gradient(180deg,#999,#666);
}

@media(max-width: 760px) {
  .tech-card {
    grid-template-columns: 1fr;
  }
}


/* V29 backend-only checkin */
.hero-actions {
  justify-content: flex-start;
}

@media(max-width: 760px) {
  .hero-actions {
    grid-template-columns: 1fr 1fr !important;
  }
}


/* V30 easy gallery upload */
.easy-upload-panel {
  width: min(980px, 94vw);
}

.easy-drop-zone {
  min-height: 240px;
  border: 3px dashed rgba(255,79,184,.34) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 20% 15%, rgba(255,79,184,.16), transparent 28%),
    radial-gradient(circle at 80% 20%, rgba(76,125,255,.16), transparent 28%),
    rgba(255,255,255,.72) !important;
  display: grid !important;
  place-items: center;
  text-align: center;
  gap: 8px;
  padding: 28px !important;
  cursor: pointer;
  position: relative;
}

.easy-drop-zone input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.easy-drop-zone .drop-icon {
  font-size: 3.2rem;
}

.easy-drop-zone strong {
  font-size: 1.5rem;
  color: #2c143d;
}

.easy-drop-zone small {
  color: var(--muted);
  font-weight: 900;
}

.easy-drop-zone em {
  color: rgba(44,20,61,.64);
  font-style: normal;
  font-weight: 800;
  font-size: .9rem;
}

.easy-drop-zone.drag-over {
  border-color: rgba(47,209,117,.75) !important;
  background: rgba(47,209,117,.12) !important;
  transform: scale(.995);
}

.selected-file-preview {
  white-space: pre-line;
  padding: 14px 16px;
  border-radius: 20px;
  background: rgba(76,125,255,.09);
  color: #332044;
  font-weight: 900;
  line-height: 1.6;
}

.easy-upload-btn {
  width: min(380px, 100%);
}

.easy-gallery-grid {
  margin-top: 20px;
}

@media(max-width: 620px) {
  .easy-drop-zone {
    min-height: 210px;
    padding: 22px !important;
  }
  .easy-drop-zone strong {
    font-size: 1.2rem;
  }
}


/* V31 10 complete color themes */
:root,
[data-theme-name="rose-gold"] {
  --pink: #ff4fb8;
  --hot-pink: #ff2e93;
  --purple: #8d5bff;
  --blue: #4c7dff;
  --gold: #f7c873;
  --dark: #24132f;
  --muted: #7f6b8b;
  --cream: #fff8fd;
  --card: rgba(255,255,255,.82);
  --theme-bg-1: #fff8fd;
  --theme-bg-2: #ffe5f3;
  --theme-bg-3: #fff3df;
  --theme-accent: #ff4fb8;
  --theme-accent-2: #8d5bff;
  --theme-text: #24132f;
}

[data-theme-name="ocean-blue"] {
  --pink: #00c2ff;
  --hot-pink: #0099ff;
  --purple: #0b6cff;
  --blue: #00e5ff;
  --gold: #8eefff;
  --dark: #06243d;
  --muted: #527488;
  --cream: #eefbff;
  --card: rgba(244,252,255,.84);
  --theme-bg-1: #eafdff;
  --theme-bg-2: #d9f4ff;
  --theme-bg-3: #e6efff;
  --theme-accent: #0099ff;
  --theme-accent-2: #00d5ff;
  --theme-text: #06243d;
}

[data-theme-name="royal-purple"] {
  --pink: #d36bff;
  --hot-pink: #b12dff;
  --purple: #6a35d9;
  --blue: #7c5cff;
  --gold: #d8b4ff;
  --dark: #24103c;
  --muted: #7a6396;
  --cream: #fbf5ff;
  --card: rgba(252,246,255,.84);
  --theme-bg-1: #fbf5ff;
  --theme-bg-2: #efe1ff;
  --theme-bg-3: #e7dcff;
  --theme-accent: #b12dff;
  --theme-accent-2: #6a35d9;
  --theme-text: #24103c;
}

[data-theme-name="emerald-spa"] {
  --pink: #32d694;
  --hot-pink: #11b979;
  --purple: #0f9f82;
  --blue: #39c7b8;
  --gold: #b8f7d4;
  --dark: #0b3328;
  --muted: #5e8176;
  --cream: #f1fff8;
  --card: rgba(247,255,250,.84);
  --theme-bg-1: #f1fff8;
  --theme-bg-2: #dffdeb;
  --theme-bg-3: #e6fff7;
  --theme-accent: #11b979;
  --theme-accent-2: #0f9f82;
  --theme-text: #0b3328;
}

[data-theme-name="sunset-coral"] {
  --pink: #ff7a59;
  --hot-pink: #ff4f70;
  --purple: #ff8a3d;
  --blue: #ffb45e;
  --gold: #ffd07a;
  --dark: #472218;
  --muted: #936a5a;
  --cream: #fff5ef;
  --card: rgba(255,248,244,.86);
  --theme-bg-1: #fff5ef;
  --theme-bg-2: #ffe3d5;
  --theme-bg-3: #fff0c7;
  --theme-accent: #ff5f45;
  --theme-accent-2: #ff9c42;
  --theme-text: #472218;
}

[data-theme-name="midnight-luxe"] {
  --pink: #a98cff;
  --hot-pink: #7f5cff;
  --purple: #3c2a7a;
  --blue: #2c3e8f;
  --gold: #f5d37a;
  --dark: #f7f0ff;
  --muted: #c8bee0;
  --cream: #0a0714;
  --card: rgba(18,13,34,.88);
  --theme-bg-1: #0a0714;
  --theme-bg-2: #141027;
  --theme-bg-3: #1e1740;
  --theme-accent: #a98cff;
  --theme-accent-2: #f5d37a;
  --theme-text: #f7f0ff;
}

[data-theme-name="cherry-blossom"] {
  --pink: #ff8fbc;
  --hot-pink: #ff5c9a;
  --purple: #ffc0d9;
  --blue: #ffd6e7;
  --gold: #ffe6ef;
  --dark: #4a1c2d;
  --muted: #9a6878;
  --cream: #fff6fa;
  --card: rgba(255,250,253,.88);
  --theme-bg-1: #fff6fa;
  --theme-bg-2: #ffe5f0;
  --theme-bg-3: #fff0f6;
  --theme-accent: #ff5c9a;
  --theme-accent-2: #ffc0d9;
  --theme-text: #4a1c2d;
}

[data-theme-name="gold-diamond"] {
  --pink: #f4bd54;
  --hot-pink: #d9a12f;
  --purple: #b8872b;
  --blue: #f0d58c;
  --gold: #ffe7a3;
  --dark: #3b2a0c;
  --muted: #8c7444;
  --cream: #fffaf0;
  --card: rgba(255,252,242,.88);
  --theme-bg-1: #fffaf0;
  --theme-bg-2: #fff0bf;
  --theme-bg-3: #f8e1a0;
  --theme-accent: #d9a12f;
  --theme-accent-2: #ffe7a3;
  --theme-text: #3b2a0c;
}

[data-theme-name="mint-cloud"] {
  --pink: #8cebd6;
  --hot-pink: #66d9c7;
  --purple: #aee8ff;
  --blue: #6ccfff;
  --gold: #eafffb;
  --dark: #15343d;
  --muted: #688890;
  --cream: #f7fffe;
  --card: rgba(255,255,255,.88);
  --theme-bg-1: #f7fffe;
  --theme-bg-2: #e6fffa;
  --theme-bg-3: #e8f7ff;
  --theme-accent: #66d9c7;
  --theme-accent-2: #6ccfff;
  --theme-text: #15343d;
}

[data-theme-name="ruby-glam"] {
  --pink: #ff3b5f;
  --hot-pink: #d9083c;
  --purple: #8f0f2f;
  --blue: #ff6c86;
  --gold: #ffc0ca;
  --dark: #3f0917;
  --muted: #925464;
  --cream: #fff4f6;
  --card: rgba(255,248,249,.88);
  --theme-bg-1: #fff4f6;
  --theme-bg-2: #ffdce4;
  --theme-bg-3: #ffe8ed;
  --theme-accent: #d9083c;
  --theme-accent-2: #ff6c86;
  --theme-text: #3f0917;
}

/* apply theme across whole website */
body {
  background:
    radial-gradient(circle at 10% 10%, color-mix(in srgb, var(--theme-accent) 20%, transparent), transparent 26%),
    radial-gradient(circle at 90% 15%, color-mix(in srgb, var(--theme-accent-2) 24%, transparent), transparent 28%),
    linear-gradient(135deg, var(--theme-bg-1), var(--theme-bg-2), var(--theme-bg-3)) !important;
  color: var(--theme-text) !important;
}

.site-header .navbar,
.navbar,
.app-form,
.admin-panel,
.contact-card,
.service-card,
.kpi-card,
.work-card-social,
.appointment-request-card,
.checkin-card,
.tech-card,
.backend-media-card,
.page-hero-card,
.glass-card {
  background: var(--card) !important;
  border-color: color-mix(in srgb, var(--theme-accent) 18%, rgba(255,255,255,.65)) !important;
}

.btn.primary,
.appointment-submit-btn,
.easy-upload-btn,
.checkin-submit-btn,
.theme-toggle-10 {
  background: linear-gradient(180deg, var(--theme-accent), var(--theme-accent-2)) !important;
  color: #fff !important;
}

.btn.secondary,
.btn.secondary.dark,
.nav-links a,
.ios-tab.active {
  color: var(--theme-text) !important;
}

.eyebrow,
.section-tag,
.logo-mark {
  background: linear-gradient(135deg, var(--theme-accent), var(--theme-accent-2)) !important;
  color: #fff !important;
}

h1, h2, h3, strong {
  color: var(--theme-text);
}

[data-theme-name="midnight-luxe"] h1,
[data-theme-name="midnight-luxe"] h2,
[data-theme-name="midnight-luxe"] h3,
[data-theme-name="midnight-luxe"] p,
[data-theme-name="midnight-luxe"] label,
[data-theme-name="midnight-luxe"] .brand-text strong,
[data-theme-name="midnight-luxe"] .brand-text small {
  color: var(--theme-text) !important;
}

[data-theme-name="midnight-luxe"] input,
[data-theme-name="midnight-luxe"] select,
[data-theme-name="midnight-luxe"] textarea {
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.22) !important;
}

[data-theme-name="midnight-luxe"] input::placeholder,
[data-theme-name="midnight-luxe"] textarea::placeholder {
  color: rgba(255,255,255,.58) !important;
}

/* theme switcher UI */
.theme-switcher-10 {
  position: fixed;
  z-index: 99995;
  top: calc(96px + env(safe-area-inset-top, 0px));
  right: 18px;
}

.theme-toggle-10 {
  border: 0;
  border-radius: 999px;
  min-height: 44px;
  padding: 0 16px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 14px 32px rgba(0,0,0,.16);
}

.theme-menu-10 {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 238px;
  display: none;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
  border-radius: 24px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(255,255,255,.64);
  box-shadow: 0 22px 55px rgba(20,10,40,.18);
  backdrop-filter: blur(20px);
}

.theme-menu-10.open {
  display: grid;
}

.theme-menu-10 button {
  border: 0;
  border-radius: 16px;
  min-height: 42px;
  padding: 10px 12px;
  cursor: pointer;
  text-align: left;
  font-weight: 900;
  color: #24132f;
  background: rgba(255,255,255,.72);
}

.theme-menu-10 button.active {
  color: #fff;
  background: linear-gradient(135deg, var(--theme-accent), var(--theme-accent-2));
}

@media(max-width: 760px) {
  .theme-switcher-10 {
    top: auto;
    right: 12px;
    bottom: calc(158px + env(safe-area-inset-bottom, 0px));
  }

  .theme-toggle-10 {
    min-height: 42px;
    padding: 0 13px;
    font-size: .82rem;
  }

  .theme-menu-10 {
    top: auto;
    bottom: calc(100% + 10px);
    width: min(260px, calc(100vw - 24px));
    max-height: 55vh;
    overflow-y: auto;
  }
}

/* V34 updated price list */
.price-category-grid{width:min(1180px,94vw);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.price-category-card{border-radius:30px;padding:22px;background:var(--card,rgba(255,255,255,.86));border:1px solid rgba(255,255,255,.70);box-shadow:0 18px 46px rgba(58,20,90,.10);backdrop-filter:blur(16px)}
.price-category-card h3{margin:0 0 16px;font-size:1.25rem;letter-spacing:-.02em;padding-bottom:12px;border-bottom:1px solid rgba(141,91,255,.16)}
.price-items{display:grid;gap:9px}.price-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:11px 12px;border-radius:18px;background:rgba(255,79,184,.07)}
.price-row span{color:var(--theme-text,#24132f);font-weight:800}.price-row strong{color:#fff;background:linear-gradient(180deg,var(--theme-accent,#ff4fb8),var(--theme-accent-2,#8d5bff));border-radius:999px;padding:7px 10px;min-width:56px;text-align:center;box-shadow:0 8px 18px rgba(0,0,0,.10)}
@media(max-width:980px){.price-category-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.price-category-grid{grid-template-columns:1fr}.price-category-card{padding:18px;border-radius:26px}.price-row{padding:10px}}

/* V35 appointment service prices */
.service-select-label select optgroup{font-weight:900;color:#24132f}
.selected-service-price{margin-top:-4px;padding:15px 18px;border-radius:22px;background:rgba(255,79,184,.09);border:1px solid rgba(255,79,184,.15);color:var(--theme-text,#24132f);font-weight:900;box-shadow:0 10px 24px rgba(58,20,90,.07)}
.selected-service-price strong{display:inline-flex;margin-left:8px;padding:6px 10px;border-radius:999px;background:linear-gradient(180deg,var(--theme-accent,#ff4fb8),var(--theme-accent-2,#8d5bff));color:#fff}

/* V36 time schedule lock */
.tech-availability-note,.time-lock-help{padding:14px 16px;border-radius:20px;background:rgba(76,125,255,.10);color:var(--theme-text,#24132f);font-weight:900;line-height:1.55}
.tech-availability-note .available{color:#176dff}.tech-availability-note .unavailable{color:#d4002f}
.time-lock-panel{width:min(1180px,94vw);margin:0 auto 24px}.time-lock-table td,.time-lock-table th{white-space:nowrap}
#appointmentTime,#appointmentTech{font-weight:900}

/* V37 time block range */
.time-lock-panel .form-grid{grid-template-columns:repeat(5,1fr)}
.time-lock-help{background:rgba(255,79,184,.10)!important;border:1px solid rgba(255,79,184,.16)}
@media(max-width:980px){.time-lock-panel .form-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.time-lock-panel .form-grid{grid-template-columns:1fr}}

/* V38 backend 500 repair */
.time-lock-panel{width:min(1180px,94vw);margin:0 auto 24px}
.time-lock-panel .form-grid{grid-template-columns:repeat(5,1fr)}
.time-lock-help{padding:14px 16px;border-radius:20px;background:rgba(255,79,184,.10)!important;border:1px solid rgba(255,79,184,.16);font-weight:900;line-height:1.55}
.time-lock-table td,.time-lock-table th{white-space:nowrap}
@media(max-width:980px){.time-lock-panel .form-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.time-lock-panel .form-grid{grid-template-columns:1fr}}

/* V39 date range block */
.block-range-grid{grid-template-columns:repeat(3,1fr)!important}
.range-help-card{margin:14px 0;padding:14px 16px;border-radius:20px;background:rgba(76,125,255,.10);display:grid;gap:6px;font-weight:900;color:var(--theme-text,#24132f)}
.range-help-card span{font-size:.92rem;opacity:.85}
@media(max-width:900px){.block-range-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:620px){.block-range-grid{grid-template-columns:1fr!important}}


/* V41 unavailable submit warning */
.unavailable-submit-warning {
  padding: 15px 18px;
  border-radius: 22px;
  background: rgba(210, 0, 47, .10);
  color: #b0002e;
  border: 1px solid rgba(210, 0, 47, .22);
  font-weight: 900;
  line-height: 1.55;
  box-shadow: 0 10px 24px rgba(210,0,47,.08);
}

.disabled-submit,
button:disabled {
  opacity: .62 !important;
  cursor: not-allowed !important;
  filter: grayscale(.25);
}


/* V42 all tech blocked / Any Technician disabled */
.tech-availability-note .unavailable,
.unavailable-submit-warning {
  color: #b0002e !important;
}


/* V49 transparent glass strong contrast + admin controlled backgrounds */
:root,
[data-theme-name="rose-glass"] {
  --theme-bg-img:
    radial-gradient(circle at 12% 14%, rgba(255,79,184,.34), transparent 28%),
    radial-gradient(circle at 85% 8%, rgba(141,91,255,.28), transparent 30%),
    radial-gradient(circle at 50% 95%, rgba(247,200,115,.25), transparent 34%),
    linear-gradient(135deg,#fff5fb,#f4edff,#fff7e3);
  --theme-accent:#ff4fb8;
  --theme-accent-2:#8d5bff;
  --theme-text:#24132f;
  --theme-muted:#654f72;
  --glass-bg:rgba(255,255,255,.66);
  --glass-bg-strong:rgba(255,255,255,.82);
  --glass-border:rgba(255,255,255,.68);
}

[data-theme-name="ocean-glass"] {
  --theme-bg-img:
    radial-gradient(circle at 10% 12%, rgba(0,194,255,.34), transparent 30%),
    radial-gradient(circle at 86% 10%, rgba(0,108,255,.28), transparent 31%),
    radial-gradient(circle at 55% 92%, rgba(142,239,255,.33), transparent 34%),
    linear-gradient(135deg,#ecfbff,#e7f1ff,#f8fdff);
  --theme-accent:#0099ff;
  --theme-accent-2:#00d5ff;
  --theme-text:#06243d;
  --theme-muted:#385c70;
  --glass-bg:rgba(247,253,255,.66);
  --glass-bg-strong:rgba(247,253,255,.84);
  --glass-border:rgba(255,255,255,.72);
}

[data-theme-name="emerald-glass"] {
  --theme-bg-img:
    radial-gradient(circle at 10% 12%, rgba(50,214,148,.34), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(15,159,130,.24), transparent 32%),
    radial-gradient(circle at 50% 95%, rgba(184,247,212,.35), transparent 34%),
    linear-gradient(135deg,#f0fff8,#e3fff0,#f6fffb);
  --theme-accent:#11b979;
  --theme-accent-2:#0f9f82;
  --theme-text:#0b3328;
  --theme-muted:#416b5d;
  --glass-bg:rgba(250,255,252,.66);
  --glass-bg-strong:rgba(250,255,252,.84);
  --glass-border:rgba(255,255,255,.72);
}

[data-theme-name="midnight-glass"] {
  --theme-bg-img:
    radial-gradient(circle at 12% 14%, rgba(169,140,255,.30), transparent 28%),
    radial-gradient(circle at 88% 10%, rgba(245,211,122,.20), transparent 30%),
    radial-gradient(circle at 50% 94%, rgba(76,125,255,.18), transparent 34%),
    linear-gradient(135deg,#07040f,#15102a,#241946);
  --theme-accent:#a98cff;
  --theme-accent-2:#f5d37a;
  --theme-text:#fff8ff;
  --theme-muted:#dacff0;
  --glass-bg:rgba(19,13,34,.64);
  --glass-bg-strong:rgba(25,18,43,.82);
  --glass-border:rgba(255,255,255,.20);
}

[data-theme-name="gold-glass"] {
  --theme-bg-img:
    radial-gradient(circle at 10% 12%, rgba(244,189,84,.34), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(255,231,163,.32), transparent 32%),
    radial-gradient(circle at 50% 95%, rgba(217,161,47,.18), transparent 34%),
    linear-gradient(135deg,#fffaf0,#fff0bf,#fff8e7);
  --theme-accent:#d9a12f;
  --theme-accent-2:#f4bd54;
  --theme-text:#3b2a0c;
  --theme-muted:#72551b;
  --glass-bg:rgba(255,252,242,.68);
  --glass-bg-strong:rgba(255,252,242,.86);
  --glass-border:rgba(255,255,255,.74);
}

body {
  background: var(--theme-bg-img) !important;
  color: var(--theme-text) !important;
  background-attachment: fixed !important;
}

.site-header, .navbar, header,
.page-hero-card, .card, .app-form, .admin-panel, .contact-card, .service-card,
.price-category-card, .appointment-request-card, .checkin-card, .tech-card,
.backend-media-card, .kpi-card, .work-card-social, .glass-card {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  backdrop-filter: blur(20px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.35) !important;
  box-shadow: 0 20px 55px rgba(22,10,38,.16) !important;
}

.page-hero-card, .app-form, .admin-panel, .price-category-card {
  background: var(--glass-bg-strong) !important;
}

h1,h2,h3,h4,p,label,span,strong,small,.brand-text strong,.brand-text small {
  color: var(--theme-text);
}

.section-heading p, .made, .muted, .brand-text small {
  color: var(--theme-muted) !important;
}

.btn.primary, button.primary, .appointment-submit-btn, .easy-upload-btn, .checkin-submit-btn,
.price-row strong, .eyebrow, .section-tag, .logo-mark {
  background: linear-gradient(180deg,var(--theme-accent),var(--theme-accent-2)) !important;
  color: #fff !important;
}

input, select, textarea {
  background: rgba(255,255,255,.88) !important;
  color: #171021 !important;
  border-color: rgba(40,20,60,.18) !important;
}

[data-theme-name="midnight-glass"] input,
[data-theme-name="midnight-glass"] select,
[data-theme-name="midnight-glass"] textarea {
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.24) !important;
}

.theme-switcher-10 {
  display: none !important;
}


/* V50 appointment availability contrast */
.availability-legend-v50 {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 14px;
  margin: 22px 0 4px;
  width: min(760px, 100%);
}

.availability-pill {
  display: grid;
  grid-template-columns: 52px 1fr;
  grid-template-areas:
    "dot title"
    "dot note";
  gap: 2px 12px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 24px;
  border: 3px solid rgba(255,255,255,.9);
  box-shadow: 0 18px 42px rgba(0,0,0,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.availability-pill span {
  grid-area: dot;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: rgba(255,255,255,.95);
  font-size: 1.75rem;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.8), 0 8px 18px rgba(0,0,0,.18);
}

.availability-pill strong {
  grid-area: title;
  font-size: 1.22rem;
  line-height: 1.05;
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
}

.availability-pill small {
  grid-area: note;
  color: rgba(255,255,255,.94) !important;
  font-weight: 900;
  font-size: .92rem;
  text-shadow: 0 2px 8px rgba(0,0,0,.25);
}

.availability-pill.available {
  background: linear-gradient(135deg, #005dff, #00c2ff) !important;
  border-color: rgba(185,230,255,.96) !important;
}

.availability-pill.unavailable {
  background: linear-gradient(135deg, #c40035, #ff426d) !important;
  border-color: rgba(255,195,210,.96) !important;
}

.warm-appointment-message {
  color: var(--theme-text, #24132f) !important;
  font-weight: 950 !important;
  font-size: clamp(1.05rem, 2.4vw, 1.32rem) !important;
  line-height: 1.55 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.50);
}

.small-note-v50 {
  margin-top: 12px !important;
  padding: 12px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
}

.tech-availability-note {
  border: 2px solid rgba(255,255,255,.85) !important;
  background: rgba(255,255,255,.88) !important;
  color: #1d1230 !important;
  font-size: 1.02rem !important;
}

.tech-availability-note .available {
  color: #005dff !important;
  font-weight: 1000 !important;
}

.tech-availability-note .unavailable {
  color: #c40035 !important;
  font-weight: 1000 !important;
}

@media (max-width: 680px) {
  .availability-legend-v50 {
    grid-template-columns: 1fr;
  }
  .availability-pill {
    padding: 15px;
  }
}