/* CMS theme roles keep the exact original palette as fallbacks.
   Status/validation colors, RAL samples, photographs and optical masks are independent. */
/* Restore the navy/gold depth of the saved design and the supplied photo_1–13 references. */
:root {
  --midnight: var(--theme-primary, #162f49);
  --ink: var(--theme-text, #1a334c);
  --paper: var(--theme-page, #ffffff);
  --stone: var(--theme-surface-alt, #f4f8fb);
  --muted: var(--theme-muted, #57697b);
  --brass: var(--theme-accent, #b88d4c);
  --champagne: var(--theme-highlight, #fae3b6);
  --line: var(--theme-border, #dfe6ed);
  --color-primary: var(--theme-primary, #18334e);
  --color-primary-dark: var(--theme-primary-deep, #12283e);
  --color-bg-page: var(--theme-page, #ffffff);
  --color-bg-alt: var(--theme-surface-alt, #f4f8fb);
  --color-text-main: var(--theme-text, #182e44);
  --color-text-muted: var(--theme-muted, #57697b);
  --color-gold: var(--theme-accent, #b88d4c);
  --color-gold-light: var(--theme-highlight, #fae3b6);
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 4px 18px color-mix(in srgb, var(--theme-primary, rgb(23 44 64)) 6%, transparent);
  --shadow-md: 0 14px 34px color-mix(in srgb, var(--theme-primary, rgb(23 44 64)) 10%, transparent);
  --surface-glow: linear-gradient(125deg, var(--theme-accent-soft, #f0d59e), var(--theme-accent, #c49a5b) 45%, var(--theme-highlight, #faebd0) 70%, var(--theme-accent-soft, #d4a764));
  --section-space: 64px;
  --header-height: 66px;
}
body { background: var(--paper); color: var(--color-text-main); }
.section-alt, .studio-portfolio, .studio-estimate, .studio-appointment { background: var(--stone); }
:root {
  --bg-dark-photo-url: url('/assets/images/hero-interior.webp');
}
/* ==========================================================================
   AUTHENTIC LUXURY HEADER — CLEAN, REAL & PROFESSIONAL (NO AI GLOWS)
   ========================================================================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 10000 !important;
  background: var(--theme-primary, #111e2e) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 8%, transparent) !important;
  box-shadow: var(--theme-header-shadow, 0 4px 16px rgba(0, 0, 0, 0.18)) !important;
  transition: background 0.25s ease, box-shadow 0.25s ease;
}

.site-header::before,
.site-header::after {
  display: none !important;
}

.site-header.scrolled {
  background: var(--theme-primary-deep, #0d1724) !important;
  box-shadow: var(--theme-header-shadow, 0 6px 20px rgba(0, 0, 0, 0.28)) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 10%, transparent) !important;
}

/* 1. Brand Logo */
.site-header .logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.site-header .logo-title {
  color: var(--theme-on-primary, #ffffff) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em;
  line-height: 1.15;
  text-shadow: none !important;
}
.site-header .logo-title span {
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}
.site-header .logo-subtitle {
  color: var(--theme-on-primary-muted, #94a3b8) !important;
  font-size: 0.55rem !important;
  letter-spacing: 0.16em;
  font-weight: 600;
  margin-top: 2px;
}
.site-header .logo-icon ellipse:nth-child(2) {
  stroke: var(--theme-on-primary, #ffffff) !important;
  stroke-opacity: 0.95 !important;
}

/* 2. Clean Navigation Links */
.site-header .nav-menu {
  display: flex;
  align-items: center;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.site-header .nav-link {
  color: var(--theme-on-primary-muted, #cbd5e1) !important;
  font-weight: 500 !important;
  font-size: 0.88rem !important;
  padding: 8px 12px !important;
  border-radius: 4px;
  letter-spacing: 0.01em;
  text-decoration: none;
  position: relative;
  background: transparent !important;
  text-shadow: none !important;
  transition: color 0.18s ease, background 0.18s ease;
}
.site-header .nav-link:hover {
  color: var(--theme-on-primary, #ffffff) !important;
  background: color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 5%, transparent) !important;
  text-shadow: none !important;
}
.site-header .nav-link.active {
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  font-weight: 600 !important;
  background: transparent !important;
  text-shadow: none !important;
}
.site-header .nav-link.active::after {
  display: none !important;
}

/* 3. Header Phone & CTA Buttons */
.site-header .header-phone-box {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.site-header .phone-link {
  color: var(--theme-on-primary, #ffffff) !important;
  font-weight: 600 !important;
  font-size: 0.96rem !important;
  letter-spacing: 0.01em;
  text-shadow: none !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0;
  transition: color 0.2s ease;
}
.site-header .phone-link svg {
  stroke: var(--theme-accent-on-primary, #dfc38f) !important;
  filter: none !important;
}
.site-header .phone-link:hover {
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  text-shadow: none !important;
}
.site-header .header-phone-sub {
  color: var(--theme-on-primary-muted, #94a3b8) !important;
  background: transparent;
  border: 0;
  font-size: 0.74rem !important;
  font-weight: 500 !important;
  cursor: pointer;
  letter-spacing: 0.02em;
  padding: 0;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 50%, transparent);
  text-underline-offset: 2px;
  transition: color 0.2s ease;
}
.site-header .header-phone-sub:hover {
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  text-shadow: none !important;
}

.site-header .btn-gold-sm,
.site-header .btn-gold {
  background: var(--theme-button-fill, var(--theme-accent, #c89d59)) !important;
  color: var(--theme-on-button, var(--theme-on-accent, #0b1520)) !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  padding: 10px 22px !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
  border-radius: 6px !important;
  text-shadow: none !important;
  transition: all 0.2s ease !important;
}
.site-header .btn-gold-sm:hover,
.site-header .btn-gold:hover {
  background: var(--theme-button-fill, var(--theme-accent, #d8af6b)) !important;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--theme-accent, rgb(200 157 89)) 30%, transparent) !important;
  transform: translateY(-1px);
}
.site-header .btn-gold-sm:active,
.site-header .btn-gold:active {
  transform: translateY(0);
}

/* 4. Mobile Toggle & Header Responsive Layout */
.site-header .mobile-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  padding: 0;
  border-radius: 6px;
  background: color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 8%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 35%, transparent) !important;
  color: var(--theme-on-primary, #ffffff) !important;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
  transition: all 0.2s ease;
}
.site-header .mobile-toggle svg {
  stroke: var(--theme-on-primary, #ffffff) !important;
  pointer-events: none;
}
.site-header .mobile-toggle:hover,
.site-header .mobile-toggle:active,
.site-header .mobile-toggle[aria-expanded="true"] {
  background: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 20%, transparent) !important;
  border-color: var(--theme-accent, #dfc38f) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

@media (max-width: 1199px) {
  .site-header .mobile-toggle {
    display: inline-flex !important;
  }
}

@media (max-width: 767px) {
  .site-header .header-container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 10px !important;
    height: 64px !important;
    padding-inline: 16px !important;
  }
  .site-header .logo {
    gap: 8px !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
  }
  .site-header .logo-title {
    font-size: 0.98rem !important;
    white-space: nowrap !important;
  }
  .site-header .logo-icon {
    width: 32px !important;
    height: 32px !important;
    flex-shrink: 0 !important;
  }
  .site-header .logo-icon svg {
    width: 32px !important;
    height: 32px !important;
  }
  .site-header .logo-subtitle {
    display: none !important;
  }
  .site-header .header-phone-sub {
    display: none !important;
  }
  .site-header .header-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
  }
  .site-header .header-actions > .btn {
    display: none !important;
  }
  .site-header .phone-link {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    background: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 18%, transparent) !important;
    border: 1.5px solid color-mix(in srgb, var(--theme-accent, rgb(223 183 112)) 45%, transparent) !important;
    font-size: 0 !important;
    color: transparent !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  }
  .site-header .phone-link svg {
    width: 20px !important;
    height: 20px !important;
    stroke: var(--theme-highlight, #fce4b3) !important;
    display: block !important;
    margin: 0 !important;
  }
  .site-header .mobile-toggle {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 8px !important;
  }
}

.skip-link:not(:focus) {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Base rich dark sections with multi-depth ambient gradients - brightened sapphire */
:is(.lead-banner,.studio-quote,.studio-trust,.question-aside,.material-specimen) {
  position: relative;
  background:
    radial-gradient(ellipse at 88% 12%, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 22%, transparent), transparent 55%),
    radial-gradient(ellipse at 12% 88%, color-mix(in srgb, var(--theme-primary-soft, rgb(78 150 240)) 18%, transparent), transparent 60%),
    linear-gradient(135deg, var(--theme-primary-deep, #142c44) 0%, var(--theme-primary, #193856) 50%, var(--theme-primary-soft, #1f446a) 100%) !important;
  overflow: hidden;
}

/* Dark section with photo fading smoothly into dark gradient - luminous & clear */
body.has-dark-photo-bg :is(.lead-banner,.studio-quote,.studio-trust,.question-aside,.material-specimen) {
  position: relative;
  background-image:
    linear-gradient(115deg, color-mix(in srgb, var(--theme-primary, rgb(17 35 54)) 82%, transparent) 0%, color-mix(in srgb, var(--theme-primary, rgb(23 46 70)) 74%, transparent) 50%, color-mix(in srgb, var(--theme-primary, rgb(15 32 50)) 85%, transparent) 100%),
    radial-gradient(circle at 85% 15%, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 25%, transparent), transparent 55%),
    radial-gradient(circle at 15% 85%, color-mix(in srgb, var(--theme-primary-soft, rgb(70 145 225)) 20%, transparent), transparent 55%),
    var(--bg-dark-photo-url, url('/assets/images/hero-interior.webp')) !important;
  background-size: cover !important;
  background-position: center 35% !important;
  background-repeat: no-repeat !important;
  overflow: hidden;
}

/* Animated floating luminous lights (track streaks and glowing ambient orbs) */
.ambient-light-container {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 1;
}

body:not(.has-bg-animations) .ambient-light-container {
  display: none !important;
}

.ambient-light-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  mix-blend-mode: screen;
  filter: blur(55px);
  will-change: transform, opacity;
}

.ambient-light-orb.orb-gold {
  width: 360px;
  height: 250px;
  background: radial-gradient(circle, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 55%, transparent) 0%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 15%, transparent) 50%, transparent 70%);
  top: -10%;
  left: 15%;
  animation: ambientFloat1 16s ease-in-out infinite alternate;
}

.ambient-light-orb.orb-blue {
  width: 400px;
  height: 280px;
  background: radial-gradient(circle, color-mix(in srgb, var(--theme-primary-soft, rgb(82 155 235)) 45%, transparent) 0%, color-mix(in srgb, var(--theme-primary, rgb(45 105 175)) 15%, transparent) 50%, transparent 70%);
  bottom: -15%;
  right: 12%;
  animation: ambientFloat2 20s ease-in-out infinite alternate;
}

.ambient-light-streak {
  position: absolute;
  width: 500px;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 30%, transparent) 20%, color-mix(in srgb, var(--theme-highlight, rgb(255 245 220)) 95%, transparent) 50%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 30%, transparent) 80%, transparent 100%);
  box-shadow: 0 0 16px color-mix(in srgb, var(--theme-accent, rgb(220 180 115)) 65%, transparent), 0 0 32px color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 30%, transparent);
  top: 40%;
  left: -20%;
  transform: rotate(-12deg);
  animation: lightStreakTravel 14s ease-in-out infinite alternate;
}

@keyframes ambientFloat1 {
  0% { transform: translate(0, 0) scale(1); opacity: 0.4; }
  50% { transform: translate(70px, 35px) scale(1.18); opacity: 0.65; }
  100% { transform: translate(-30px, 60px) scale(0.92); opacity: 0.35; }
}

@keyframes ambientFloat2 {
  0% { transform: translate(0, 0) scale(1); opacity: 0.4; }
  50% { transform: translate(-80px, -45px) scale(1.22); opacity: 0.6; }
  100% { transform: translate(45px, -25px) scale(0.88); opacity: 0.35; }
}

@keyframes lightStreakTravel {
  0% { transform: translateX(0) translateY(0) rotate(-12deg); opacity: 0.2; }
  50% { transform: translateX(200px) translateY(35px) rotate(-9deg); opacity: 0.65; }
  100% { transform: translateX(400px) translateY(-10px) rotate(-14deg); opacity: 0.2; }
}

:is(.lead-banner,.studio-quote,.studio-trust,.question-aside,.material-specimen) > *:not(.ambient-light-container) {
  position: relative;
  z-index: 2;
}

/* White background micro-effects */
body.has-light-effects {
  background-color: var(--theme-page, #fafbfc);
  background-image: 
    radial-gradient(circle at 10% 15%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 5%, transparent) 0%, transparent 35%),
    radial-gradient(circle at 90% 85%, color-mix(in srgb, var(--theme-primary, rgb(16 36 57)) 4%, transparent) 0%, transparent 40%),
    radial-gradient(color-mix(in srgb, var(--theme-primary, rgb(16 36 57)) 3.8%, transparent) 1.2px, transparent 1.2px);
  background-size: 100% 100%, 100% 100%, 28px 28px;
  background-attachment: fixed;
}

body.has-light-effects :is(.process-card, .material-row, .review-card, .editorial-form, .appointment-form, .contact-info-card) {
  background: color-mix(in srgb, var(--theme-surface, rgb(255 255 255)) 94%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-color: color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 22%, transparent);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--theme-primary, rgb(15 29 46)) 5%, transparent);
}
:is(.lead-banner,.studio-quote,.question-aside,.material-specimen) { border:1px solid color-mix(in srgb, var(--theme-accent-strong, #b7995f) 27.05882%, transparent); border-radius:12px; box-shadow:0 15px 35px color-mix(in srgb, var(--theme-primary, rgb(18 42 59)) 12%, transparent); }
:is(.appointment-form,.editorial-form,.calc-card,.picker-controls,.contact-info-card,.privacy-content) { background:var(--theme-surface, #fff); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-md); }
:is(.appointment-form,.editorial-form,.calc-card,.picker-controls) { transition:border-color .3s,box-shadow .3s; }
:is(.appointment-form,.editorial-form,.calc-card,.picker-controls):focus-within { border-color:var(--theme-accent, #c4a26a); box-shadow:0 10px 32px color-mix(in srgb, var(--theme-accent, rgb(154 120 67)) 12%, transparent); }
.form-input,.form-select,.form-textarea,.studio-estimate-form input,.studio-estimate-form select { border-radius:5px; border-color:var(--theme-border, #d8e0e5); background:var(--theme-surface, #fcfdfe); }
.form-input:focus,.form-select:focus,.form-textarea:focus { border-color:var(--theme-accent-strong, #b7955a); box-shadow:0 0 0 3px color-mix(in srgb, var(--theme-accent, #cbaa68) 12.54902%, transparent); }
.modal-content { border-radius:12px; border:1px solid var(--theme-accent, #cdb183); box-shadow:0 20px 70px #0004; }.modal-header { background:var(--stone); }
/* A framed surface gets one subtle light edge; animation is interaction driven. */
:is(.work-card,.studio-project,.service-catalog-grid article,.offer-card,.review-card,.promotion-card,.inspire-card,.quick-card) { transition:transform .3s,box-shadow .3s,border-color .3s; }
@media(hover:hover) {
 :is(.work-card,.studio-project,.offer-card,.inspire-card,.quick-card):hover { transform:translateY(-4px); box-shadow:0 13px 32px color-mix(in srgb, var(--theme-primary, rgb(27 46 64)) 12%, transparent),0 0 0 1px color-mix(in srgb, var(--theme-accent, #c6a36a) 40%, transparent); }
 :is(.service-catalog-grid article,.review-card,.promotion-card):hover { border-color:var(--theme-accent-strong, #bfa16d); box-shadow:0 8px 28px color-mix(in srgb, var(--theme-accent, rgb(164 128 65)) 10%, transparent); }
}
.studio-home h1 em,.studio-home h2 em,.page-hero-title span { color:var(--theme-accent-strong, #8e6938); }
/* Home returns to the layered photographic masthead in photo_2, using retained factual copy. */
.recovered-hero { position:relative; overflow:hidden; background:var(--theme-primary, #111e2e); padding:0; color:var(--theme-on-primary, #fff); }
.recovered-hero .hero-title { font-family:var(--font-serif); font-size:clamp(3rem,4.1vw,4rem); line-height:1.1; font-weight:600; color:var(--theme-on-primary, #fff); margin:0 0 24px; letter-spacing:-.03em; }
.recovered-hero .hero-title-main { display:block; color:var(--theme-on-primary, #fff); }.recovered-hero .hero-title-city { font-size:1em; color:var(--theme-accent-on-primary, var(--champagne)); display:block; font-style:italic; margin-top:8px; }
.recovered-hero .hero-subtitle { max-width:440px; color:var(--theme-on-primary-muted, #d5dee5); font-size:1rem; line-height:1.8; margin-bottom:27px; }
.recovered-hero .badge-tag { color:var(--theme-accent-on-primary, #e4c68f); font-size:.7rem; margin-bottom:24px; }
.recovered-hero .hero-buttons { flex-direction:row; gap:14px; flex-wrap:wrap; }.recovered-hero .hero-buttons .btn { padding:14px 20px; }
.recovered-hero .hero-note { color:var(--theme-on-primary-muted, #c5d2dd); font-size:.76rem; line-height:1.7; margin-top:23px; max-width:420px; }
.recovered-hero .hero-card { position:relative; width:100%; height:100%; margin:0; border:0; border-radius:18px; box-shadow:none; overflow:hidden; }
.recovered-hero .hero-card img { width:100%; height:100%; object-fit:cover; object-position:center 35%; border-radius:18px; }
.recovered-hero .hero-floating-badge { left:auto; bottom:26px; right:24px; max-width:285px; padding:20px 24px; border-radius:9px; background:color-mix(in srgb, var(--theme-primary, #122739) 90.98039%, transparent); border:1px solid color-mix(in srgb, var(--theme-accent, #e0c790) 40%, transparent); box-shadow:0 12px 40px #0003; z-index:2; }
.recovered-hero .hero-badge-title { color:var(--theme-on-primary, #fff); font-size:.9rem; line-height:1.6; }.recovered-hero .hero-badge-link { color:var(--theme-accent-on-primary, var(--champagne)); font-size:.79rem; }
.recovered-benefits { background:var(--theme-surface, #fff); border-bottom:1px solid var(--line); }
.recovered-benefits .studio-benefits { margin:0; padding:25px 0; }
.home-tools { background:var(--paper); padding:26px 0 0; }.quick-cards-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:0; }
.quick-card { display:flex; flex-direction:row; align-items:center; gap:22px; padding:22px; border:1px solid var(--line); border-radius:10px; background:linear-gradient(125deg,var(--theme-surface, #fff),var(--theme-surface-alt, #f7fafc)); box-shadow:var(--shadow-sm); }
.quick-card>div { flex:1; }.quick-card-icon { display:none; }.quick-card-title { font-size:1rem; margin:0 0 8px; }.quick-card-desc { font-size:.84rem; line-height:1.65; margin:0; color:var(--muted); }
.circle-arrow-btn { width:36px; height:36px; color:var(--theme-accent-strong, #956e34); background:var(--theme-accent-tint, #f2e8d7); border:1px solid var(--theme-accent, #dac49f); box-shadow:inset 0 1px 0 var(--theme-surface, #fff); }
.studio-materials { padding-top:52px; }.studio-materials .material-layout { gap:48px; }
.material-figure { background:var(--theme-surface, #fff); border:1px solid var(--line); padding:12px; border-radius:12px; box-shadow:var(--shadow-sm); }
.material-figure .material-image { border-radius:6px; aspect-ratio:1.55; }.material-figure figcaption { padding:16px 6px 6px; }
.studio-projects { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.studio-project { display:block; background:var(--theme-surface, #fff); border:1px solid var(--line); border-radius:11px; overflow:hidden; box-shadow:var(--shadow-sm); }
.studio-project-photo img { aspect-ratio:4/3; object-position:center 0; }.studio-project-meta { padding:20px 22px 23px; }.studio-project-meta h3 { font-size:1.35rem; }.studio-project-meta p { font-size:.69rem; }
.studio-detail-grid { gap:28px; }.studio-detail-grid>a { display:block; padding:12px 12px 23px; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow-sm); background:linear-gradient(160deg,var(--theme-surface, #fff),var(--theme-surface-alt, #f5f8fa)); }.studio-detail-grid img { border-radius:6px; }.studio-detail-grid>a>p,.studio-detail-grid h3,.studio-detail-grid small { margin-inline:10px; }
.studio-estimate-grid { gap:70px; }.studio-quote { padding:32px; }.studio-quote h3 { color:var(--theme-on-primary, #fff); }
.studio-steps article { padding:23px; background:var(--theme-surface, #fff); border:1px solid var(--line); border-top:2px solid var(--theme-accent, #c4a270); border-radius:8px; box-shadow:var(--shadow-sm); }
.studio-process { background:var(--theme-surface-alt, #f8fafb); }.studio-process .studio-section-heading { margin-bottom:27px; }
.studio-trust { border-radius:0; }.studio-trust h2 { color:var(--theme-on-primary, #fff); }.studio-trust h2 em { color:var(--theme-accent-on-primary, var(--champagne)); }
.studio-archive a { display:block; border:1px solid color-mix(in srgb, var(--theme-muted, #78909e) 33.33333%, transparent); border-radius:8px; padding:8px; background:color-mix(in srgb, var(--theme-surface, #ffffff) 3.13725%, transparent); }.studio-archive img { border-radius:4px; }.studio-archive a>span { padding:0 6px 6px; }
.studio-faq .faq-item,.faq-page .faq-item,.calculator-page .faq-item { border:1px solid var(--line); border-radius:7px; padding:0 20px; margin-bottom:10px; background:var(--theme-surface, #fff); box-shadow:0 3px 10px color-mix(in srgb, var(--theme-primary, #19374f) 1.56863%, transparent); }
.faq-item.active { border-color:var(--theme-accent, #c5a46c); }.faq-question { border:0; }.faq-answer { padding-left:0; padding-right:0; }
.studio-appointment { background:linear-gradient(145deg,var(--theme-surface-alt, #eaf0f5),var(--theme-surface-alt, #f4f7f9)); }.appointment-story img { border-radius:10px; border:1px solid var(--theme-border, #cfd9df); box-shadow:0 10px 26px color-mix(in srgb, var(--theme-primary, #152c40) 6.27451%, transparent); }
/* Full width intro photographs fade into copy instead of abutting a hard navy panel. */
.recovered-intro { position:relative; isolation:isolate; overflow:hidden; background:var(--midnight); padding:0; }
.recovered-intro .page-hero-grid { display:block; position:relative; min-height:310px; z-index:0 !important; }
.recovered-intro .page-hero-copy { position:relative; z-index:2; max-width:690px; padding:32px 0 40px; }
.recovered-intro .page-hero-title,.recovered-intro .page-hero-title span { color:var(--theme-on-primary, #fff); font-size:clamp(2.3rem,3.4vw,3.1rem); line-height:1.18; }
.recovered-intro .page-hero-subtitle { color:var(--theme-on-primary-muted, #d3dee6); max-width:540px; }
.recovered-intro .page-hero-photo { position:absolute; left:30%; top:0; right:calc(-1 * var(--gutter)); bottom:0; margin:0; height:auto; min-height:0; z-index:0; }
.recovered-intro .page-hero-photo img { width:100%; height:100%; object-fit:cover; object-position:center 20%; }
.recovered-intro .page-hero-grid::after { content:""; position:absolute; inset:0 calc(-1 * var(--gutter)); z-index:1; background:linear-gradient(90deg,var(--theme-primary, #102439) 0%,color-mix(in srgb, var(--theme-primary, #102439) 96.86275%, transparent) 32%,color-mix(in srgb, var(--theme-primary, #102439) 76.86275%, transparent) 47%,color-mix(in srgb, var(--theme-primary, #102439) 31.37255%, transparent) 62%,transparent 88%); pointer-events:none; }
.recovered-intro .page-hero-photo figcaption { position:absolute; bottom:18px; right:26px; z-index:3; padding:6px 10px; background:color-mix(in srgb, var(--theme-primary, #102438) 72.15686%, transparent); color:var(--theme-on-primary, #fff); border-radius:3px; font-size:.64rem; }
.recovered-intro .breadcrumbs,.recovered-intro .breadcrumbs a { color:var(--theme-on-primary-muted, #b8c7d2); }.recovered-intro .section-pretitle { color:var(--theme-accent-on-primary, var(--champagne)); }
.recovered-intro-light { background:var(--stone); }.recovered-intro-light .page-hero-title { color:var(--theme-text, var(--ink)); }
.recovered-intro-light .page-hero-subtitle { color:var(--muted); }.recovered-intro-light .breadcrumbs,.recovered-intro-light .breadcrumbs a { color:var(--muted); }.recovered-intro-light .section-pretitle { color:var(--theme-accent-strong, #94703b); }
.recovered-intro-light .page-hero-grid::after { background:linear-gradient(90deg,var(--theme-surface-alt, #f0f4f7) 0%,color-mix(in srgb, var(--theme-surface-alt, #f0f4f7) 98.03922%, transparent) 34%,color-mix(in srgb, var(--theme-surface-alt, #f0f4f7) 83.92157%, transparent) 48%,color-mix(in srgb, var(--theme-surface-alt, #f0f4f7) 25.09804%, transparent) 70%,transparent 88%); }
.calculator-page .recovered-intro .page-hero-copy { max-width:790px; }.calculator-page .recovered-intro .page-hero-title { max-width:640px; font-size:2.65rem; }
.picker-page .recovered-intro .page-hero-grid { min-height:260px; }.picker-page .recovered-intro .page-hero-copy { max-width:690px; }.picker-page .recovered-intro .page-hero-subtitle { max-width:490px; }
/* Individual page composition remains intact, with restored surfaces and metadata. */
.service-catalog-grid { gap:26px; }.service-catalog-grid article { padding:20px; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-sm); background:var(--theme-surface, #fff); gap:24px; align-items:start; }.service-catalog-grid img { border-radius:7px; height:auto; max-height:none; aspect-ratio:1; }.service-catalog-grid h3 { font-size:1.45rem; }.service-catalog-grid .material-specimen { border-radius:7px; padding:19px; min-height:270px; box-shadow:none; }
.service-lighting-grid figure img,.service-details-band img,.story-image { border-radius:10px; border:1px solid var(--theme-border, #d0dbe2); box-shadow:var(--shadow-md); }
.service-lighting { background:linear-gradient(140deg,var(--theme-surface-alt, #eff4f7),var(--theme-surface-alt, #e9eff3)); }
.works-grid .work-card,.similar-grid .work-card { border:1px solid var(--line); border-radius:10px; background:var(--theme-surface, #fff); box-shadow:var(--shadow-sm); }
.works-grid .work-card-content,.similar-grid .work-card-content { padding:18px 20px 22px; }.works-grid .work-card-title { font-size:1.28rem; }.works-grid .work-card-tag { border-radius:4px; top:14px; left:14px; border:1px solid color-mix(in srgb, var(--theme-accent, #c9ac77) 33.33333%, transparent); }
.btn-pill-gold { border-radius:5px; border-color:var(--theme-border, #d0dce4); background:var(--theme-surface, #fff); }.btn-pill-gold.active { background:linear-gradient(120deg,var(--theme-primary, #102439),var(--theme-primary-soft, #27455a)); color:var(--theme-accent-on-primary, #ead4ad); border-color:var(--theme-primary-soft, #354c61); }
.archive-open { border:1px solid var(--line); border-radius:9px; background:var(--theme-surface, #fff); box-shadow:var(--shadow-sm); }.archive-open>img { background:var(--theme-surface-alt, #e5e9e9); }.archive-open>span { padding:18px; }
.project-heading { background:linear-gradient(130deg,var(--theme-surface, #fff),var(--theme-surface-alt, #edf2f5)); }.project-viewer { padding:12px; background:var(--theme-surface, #fff); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-md); }.project-main-slide { border-radius:8px; }.project-thumb-btn { border-radius:6px; overflow:hidden; background:var(--theme-surface-alt, #f6f8fa); }.project-thumb-btn img { border-radius:0; }.project-thumb-btn.active { border-color:var(--theme-accent-strong, #b38b4e); box-shadow:0 0 0 1px var(--theme-accent, #c9a46d); }
.project-thumb-caption { padding:9px; }.spec-card { border:1px solid var(--line); background:var(--theme-surface-alt, #f8fafb); border-radius:7px; padding:17px; }.spec-icon-box { background:var(--theme-accent-tint, #f2e8d7); color:var(--theme-accent-strong, #9d783f); border-radius:50%; }.spec-value { font-size:.87rem; }.case-consultation { background:var(--stone); padding:24px; border:1px solid var(--line); border-radius:8px; }
.lead-banner { padding:38px; }.lead-banner-bg { background:radial-gradient(ellipse at 100% 15%,color-mix(in srgb, var(--theme-accent-strong, #ab9253) 15.68627%, transparent),transparent 65%); }.lead-banner-title { color:var(--theme-on-primary, #fff); }.lead-banner-desc { color:var(--theme-on-primary-muted, #cbd6de); }
.review-card { border:1px solid var(--line); border-top:2px solid var(--theme-accent, #c6a575); padding:26px; border-radius:10px; background:var(--theme-surface, #fff); box-shadow:var(--shadow-sm); }.reviews-grid { gap:26px; }.review-name { font-size:1.35rem; }.review-preview { -webkit-line-clamp:6; }
.offer-card { border:1px solid var(--line); border-radius:11px; background:var(--theme-surface, #fff); box-shadow:var(--shadow-sm); }.offer-card-body { padding:22px; }.offer-card-title { font-size:1.45rem; }.offer-card-footer { margin-top:17px; }.offer-badge { border-radius:4px; font-size:.64rem; }
/* ==========================================================================
   OFFICIAL PROMOTIONS (BALANCED 3x3 GRID WITH AUTHENTIC PHOTOS)
   ========================================================================== */
.promotion-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 28px !important;
  margin: 0 0 40px !important;
}

.promotion-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  background: var(--theme-surface, #ffffff) !important;
  border: 1px solid var(--theme-border, #e2e8f0) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  padding: 0 !important;
  box-shadow: 0 4px 16px color-mix(in srgb, var(--theme-primary, rgb(15 23 42)) 5%, transparent) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.promotion-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--theme-primary, rgb(15 23 42)) 12%, transparent) !important;
  border-color: var(--theme-accent, #dfc38f) !important;
}

.promotion-card-image {
  position: relative !important;
  width: 100% !important;
  height: 200px !important;
  min-height: 200px !important;
  max-height: 200px !important;
  overflow: hidden !important;
  background: var(--theme-primary-deep, #0d1b2a) !important;
  margin: 0 !important;
  display: block !important;
}

.promotion-card-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}

.promotion-card:hover .promotion-card-image img {
  transform: scale(1.05) !important;
}

.promotion-card-image-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, color-mix(in srgb, var(--theme-primary, rgb(13 27 42)) 65%, transparent) 100%) !important;
  pointer-events: none !important;
}

.promotion-card-badge {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  z-index: 2 !important;
  background: var(--theme-button-fill, var(--theme-accent, #c89d59)) !important;
  color: var(--theme-on-button, var(--theme-on-accent, #0b1520)) !important;
  font-weight: 700 !important;
  font-size: 0.74rem !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

.promotion-card-discount {
  position: absolute !important;
  bottom: 12px !important;
  left: 14px !important;
  z-index: 2 !important;
  color: var(--theme-on-primary, #ffffff) !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7) !important;
}

.promotion-card-body {
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  justify-content: space-between !important;
  padding: 22px !important;
  background: var(--theme-surface, #ffffff) !important;
}

.promotion-card-title {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: var(--theme-text, #0f1d2e) !important;
  line-height: 1.35 !important;
  margin: 0 0 10px !important;
}

.promotion-card-desc {
  font-size: 0.88rem !important;
  color: var(--theme-muted, #64748b) !important;
  line-height: 1.6 !important;
  margin: 0 0 20px !important;
  flex-grow: 1 !important;
}

.promotion-card-actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: auto !important;
}

.promotion-card-btn {
  width: 100% !important;
  background: var(--theme-button-fill, var(--theme-accent, #c89d59)) !important;
  color: var(--theme-on-button, var(--theme-on-accent, #0b1520)) !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  padding: 12px 18px !important;
  border-radius: 6px !important;
  border: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

.promotion-card-btn:hover {
  background: var(--theme-button-fill, var(--theme-accent, #d8af6b)) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--theme-accent, rgb(200 157 89)) 30%, transparent) !important;
}

.promotion-card-meta {
  font-size: 0.76rem !important;
  color: var(--theme-muted-light, #94a3b8) !important;
  text-align: center !important;
}

@media (max-width: 991px) {
  .promotion-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 22px !important;
  }
}

@media (max-width: 640px) {
  .promotion-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .promotion-card-image {
    height: 190px !important;
  }
}
.calc-summary { border-radius:12px; background:radial-gradient(ellipse at top right,color-mix(in srgb, var(--theme-primary-soft, #597067) 25.09804%, transparent),transparent 60%),linear-gradient(130deg,var(--theme-primary, #102439),var(--theme-primary-soft, #1c374b)); box-shadow:0 16px 38px color-mix(in srgb, var(--theme-primary, #143148) 13.33333%, transparent); border:1px solid color-mix(in srgb, var(--theme-accent-strong, #8e875b) 40%, transparent); }.calc-mini-card { border-radius:7px; }.calc-input-stepper { border-radius:5px; }.calc-quick-texture { border-radius:5px; }.calculator-page .process-card { border:1px solid var(--line); padding:23px; border-radius:8px; background:var(--theme-surface, #fff); }.calculator-page .process-card:first-child { padding-left:23px; }
.picker-controls { padding:26px; }.visualizer-display { padding:10px; border:1px solid var(--line); background:var(--theme-surface, #fff); border-radius:12px; box-shadow:var(--shadow-md); }.visualizer-canvas-wrap { border-radius:7px; }.visualizer-thumb { border-radius:5px; }.surface-card { border-radius:6px; background:var(--theme-surface-alt, #f6f8fa); }.surface-card img { border-radius:3px; }.surface-card.active { border-color:var(--theme-accent-strong, #b18c52); box-shadow:0 0 0 1px color-mix(in srgb, var(--theme-accent-strong, #b18c52) 25.09804%, transparent); }.room-pill { border-radius:5px; }.inspire-card { background:var(--theme-surface, #fff); border:1px solid var(--line); border-radius:9px; box-shadow:var(--shadow-sm); }.inspire-card-body { padding:15px 18px; }
.contacts-layout { gap:30px; }.contact-info-card { padding:30px; }.contact-channel-icon { background:var(--theme-accent-tint, #f5ead6); color:var(--theme-accent-strong, #a47d3f); border:0; border-radius:50%; width:44px; height:44px; }.contact-channel-item { gap:17px; }.service-region { margin:0; border:0; background:var(--theme-surface-alt, #f2f6f8); padding:30px; border-radius:10px; }.map-wrapper { margin-top:36px; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow-sm); }.region-map { display:block; position:relative; border-radius:8px; overflow:hidden; border:1px solid var(--theme-border, #d1d9d1); }.region-map svg { display:block; width:100%; height:auto; }.region-map>span { position:absolute; right:16px; bottom:13px; font-size:.74rem; background:color-mix(in srgb, var(--theme-surface, #ffffff) 85.09804%, transparent); color:var(--theme-text, var(--ink)); padding:6px 10px; border-radius:4px; }
.contacts-page .grid-3col .process-card { background:var(--theme-surface, #fff); border:1px solid var(--line); border-radius:9px; padding:24px; box-shadow:var(--shadow-sm); }
.measurement-story>img { border-radius:10px !important; box-shadow:var(--shadow-md) !important; }.measurement-story>div { padding:8px 0; }.measurement-number { background:var(--theme-accent-tint, #f2e8d7); border-radius:5px; width:36px; height:40px; text-align:center; font-size:1.3rem; }
.about-story { gap:50px; }.question-photo { border-radius:6px; }.privacy-content { max-width:960px; }
/* ==========================================================================
   ARCHITECTURAL FOOTER — MULTI-DEPTH AMBIENT GLOW, BLUEPRINT WATERMARK & TRUST BAND
   ========================================================================== */
.site-footer {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 16%, transparent) 0%, transparent 60%),
    radial-gradient(circle at 10% 90%, color-mix(in srgb, var(--theme-primary-soft, rgb(45 110 195)) 14%, transparent) 0%, transparent 55%),
    radial-gradient(circle at 90% 80%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 12%, transparent) 0%, transparent 50%),
    linear-gradient(145deg, var(--theme-primary-deep, #071524) 0%, var(--theme-primary, #0d2338) 45%, var(--theme-primary-deep, #081728) 100%) !important;
  color: var(--theme-on-primary-muted, #eee9df) !important;
  padding-top: 56px;
  padding-bottom: 30px;
  border-top: 2px solid transparent !important;
  border-image: linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 35%, transparent) 15%, color-mix(in srgb, var(--theme-highlight, rgb(255 238 195)) 92%, transparent) 50%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 35%, transparent) 85%, transparent 100%) 1 !important;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.45), 0 -1px 18px color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 18%, transparent) !important;
  overflow: hidden;
}

/* Subtle architectural blueprint grid texture on the footer */
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 4%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 4%, transparent) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(ellipse at 50% 20%, rgba(0,0,0,0.85) 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 20%, rgba(0,0,0,0.85) 0%, transparent 75%);
  pointer-events: none;
  z-index: 0;
}

.site-footer > .container {
  position: relative;
  z-index: 1;
}

/* Footer Trust & Quality Feature Band */
.footer-trust-band {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 46px;
  padding-bottom: 36px;
  border-bottom: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 22%, transparent);
}

.footer-trust-card {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  padding: 18px 20px;
  background: color-mix(in srgb, var(--theme-primary, rgb(18 38 58)) 55%, transparent);
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 20%, transparent);
  border-radius: 10px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25), inset 0 1px 0 color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 6%, transparent);
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.footer-trust-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 45%, transparent);
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.35), 0 0 15px color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 15%, transparent);
}

.footer-trust-card .trust-icon-wrap {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 18%, transparent) 0%, color-mix(in srgb, var(--theme-accent, rgb(200 154 88)) 8%, transparent) 100%);
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 35%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--theme-accent-on-primary, #f7dca3);
}

.footer-trust-card .trust-icon-wrap svg {
  stroke: var(--theme-accent-on-primary, #f7dca3);
  filter: drop-shadow(0 0 4px color-mix(in srgb, var(--theme-accent-on-primary, rgb(247 220 163)) 40%, transparent));
}

.footer-trust-card .trust-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--theme-on-primary, #ffffff);
  margin: 0 0 4px;
  line-height: 1.3;
}

.footer-trust-card .trust-desc {
  font-size: 0.77rem;
  color: var(--theme-on-primary-muted, #b5c5d3);
  margin: 0;
  line-height: 1.45;
}

/* Footer Grid & Navigation Typography */
.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.25fr;
  gap: 40px;
  margin-bottom: 38px;
}

.site-footer .footer-brand {
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  color: var(--theme-on-primary, #ffffff) !important;
  letter-spacing: 0.03em;
  display: inline-block;
  margin-bottom: 10px;
  text-decoration: none;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
}

.site-footer .footer-brand span {
  color: var(--theme-accent-on-primary, #f7dca3) !important;
  font-weight: 700 !important;
}

.site-footer .footer-desc {
  color: var(--theme-on-primary-muted, #b5c5d3) !important;
  font-size: 0.85rem !important;
  line-height: 1.6 !important;
  margin-bottom: 16px;
}

.site-footer .footer-badge-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.78rem;
  color: var(--theme-on-primary-muted, #d1dde8);
  background: color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 18%, transparent);
  padding: 6px 12px;
  border-radius: 6px;
  margin-top: 6px;
}
.site-footer .footer-badge-item svg {
  stroke: var(--theme-accent-on-primary, #f7dca3);
}

.site-footer .footer-heading {
  color: var(--theme-accent-on-primary, #f3d8a2) !important;
  font-size: 0.73rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  margin-bottom: 18px !important;
  text-transform: uppercase;
}

.site-footer .footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.site-footer .footer-links a {
  color: var(--theme-on-primary-muted, #c9d8e5) !important;
  font-size: 0.86rem !important;
  text-decoration: none;
  transition: all 0.2s ease;
}

.site-footer .footer-links a:hover {
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  transform: translateX(3px);
  display: inline-block;
}

.site-footer .footer-phone {
  color: var(--theme-on-primary, #ffffff) !important;
  font-size: 0.98rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  display: block;
  margin-bottom: 8px;
  text-decoration: none;
  transition: color 0.2s ease;
}
.site-footer .footer-phone:hover {
  color: var(--theme-accent-on-primary, #f7dca3) !important;
}

.site-footer .footer-email {
  color: var(--theme-on-primary-muted, #c9d8e5) !important;
  font-size: 0.86rem !important;
  display: block;
  margin-bottom: 14px;
  text-decoration: none;
}
.site-footer .footer-email:hover {
  color: var(--theme-on-primary, #ffffff) !important;
}

.site-footer .section-link {
  color: var(--theme-accent-on-primary, #f7dca3) !important;
  font-size: 0.88rem !important;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 35%, transparent);
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.22s ease;
}
.site-footer .section-link:hover {
  background: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 22%, transparent);
  color: var(--theme-on-primary, #ffffff) !important;
  border-color: color-mix(in srgb, var(--theme-highlight, rgb(255 238 195)) 60%, transparent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 30%, transparent);
}

.site-footer .footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  border-top: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 18%, transparent) !important;
  color: var(--theme-on-primary-muted, #92a4b5) !important;
  font-size: 0.76rem !important;
}

.site-footer .footer-bottom a {
  color: var(--theme-on-primary-muted, #b5c5d3) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.site-footer .footer-bottom a:hover {
  color: var(--theme-accent-on-primary, #f7dca3) !important;
}

/* Footer Responsive adjustments */
@media (max-width: 1024px) {
  .footer-trust-band {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
  }
}

@media (max-width: 640px) {
  .footer-trust-band {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .site-footer .footer-bottom {
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }
}

/* Mobile drawer elements: hidden on desktop by default */
.mobile-nav-footer,
.mobile-nav-backdrop {
  display: none !important;
}

@media(min-width:1600px) { .recovered-hero .hero-grid { min-height:640px; }.recovered-hero .hero-title { font-size:4.3rem; } }
@media(max-width:1199px) {
  .mobile-nav-footer {
    display: flex !important;
  }
  .mobile-nav-backdrop {
    display: block !important;
  }
  .site-header {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .site-header .nav-menu {
    position: fixed !important;
    top: 64px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: calc(100dvh - 64px) !important;
    max-height: calc(100dvh - 64px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    background: linear-gradient(180deg, var(--theme-primary-soft, #16304b) 0%, var(--theme-primary, #102235) 55%, var(--theme-primary-deep, #0b1725) 100%) !important;
    border-top: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 30%, transparent) !important;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.65) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    padding: 20px 20px 48px !important;
    z-index: 999999 !important;
    transform: translateY(-10px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s ease !important;
  }

  .site-header .nav-menu.open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  .site-header .nav-menu .nav-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .site-header .nav-menu .nav-link {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 13px 18px !important;
    font-size: 1.05rem !important;
    font-weight: 500 !important;
    color: var(--theme-on-primary-muted, #edf3f8) !important;
    background: color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 4%, transparent) !important;
    border-radius: 8px !important;
    border: 1px solid color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 6%, transparent) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 9%, transparent) !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
  }
  .site-header .nav-menu .nav-link:hover,
  .site-header .nav-menu .nav-link:active {
    background: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 14%, transparent) !important;
    color: var(--theme-on-primary, #ffffff) !important;
    border-color: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 35%, transparent) !important;
    transform: translateX(4px);
  }
  .site-header .nav-menu .nav-link.active {
    background: linear-gradient(90deg, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 22%, transparent) 0%, color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 8%, transparent) 100%) !important;
    color: var(--theme-accent-on-primary, #fce4b3) !important;
    font-weight: 600 !important;
    border-left: 4px solid var(--theme-accent, #dfc38f) !important;
    border-color: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 40%, transparent) !important;
  }
  .site-header .nav-menu .nav-link.active::after {
    display: none !important;
  }

  /* Drawer Footer */
  .mobile-nav-footer {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 25%, transparent);
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .mobile-nav-phone-wrap {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .mobile-nav-phone {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--theme-on-primary, #ffffff) !important;
    font-size: 1.15rem;
    font-weight: 700;
    text-decoration: none;
  }
  .mobile-nav-phone svg {
    stroke: var(--theme-highlight, #fce4b3);
    flex-shrink: 0;
  }
  .mobile-nav-workhours {
    color: var(--theme-on-primary-muted, #adc0d1);
    font-size: 0.78rem;
    line-height: 1.4;
  }
  .mobile-nav-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .mobile-nav-btn {
    width: 100%;
    justify-content: center;
    padding: 13px 18px !important;
    font-size: 0.94rem !important;
    text-align: center;
    border-radius: 8px !important;
  }
  .site-header .mobile-nav-buttons .btn-outline-gold {
    color: var(--theme-accent-on-primary, #dfc38f);
    border-color: var(--theme-accent-on-primary, #dfc38f);
  }
  .site-header .mobile-nav-buttons .btn-outline-gold:hover,
  .site-header .mobile-nav-buttons .btn-outline-gold:focus-visible {
    background: var(--theme-button-fill, var(--theme-accent, var(--brass)));
    color: var(--theme-on-button, var(--theme-on-accent, #172b32));
    border-color: var(--theme-button-fill, var(--theme-accent, var(--brass)));
  }

  .recovered-hero .hero-grid { min-height:550px; }
  .recovered-hero .hero-content { max-width:510px; }
  .recovered-hero .hero-title { font-size:3.3rem; }
  .recovered-hero .hero-floating-badge { right:16px; max-width:245px; }
  .recovered-intro .page-hero-copy { max-width:620px; }
  .recovered-intro .page-hero-subtitle { max-width:470px; }
  .service-catalog-grid article { grid-template-columns:1fr; }
  .service-catalog-grid img { aspect-ratio:1.65; }
}

/* Mobile backdrop */
.mobile-nav-backdrop {
  position: fixed;
  top: 64px;
  left: 0;
  right: 0;
  bottom: 0;
  background: color-mix(in srgb, var(--theme-primary-deep, rgb(8 16 26)) 65%, transparent);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.mobile-nav-backdrop.visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
body.menu-open {
  overflow: hidden !important;
  touch-action: none !important;
}
@media(max-width:900px) {
 .recovered-hero .hero-content { max-width:420px; }.recovered-hero .hero-title { font-size:3rem; }.recovered-hero .hero-subtitle { max-width:380px; }.recovered-hero .hero-floating-badge { max-width:225px; padding:15px; }
 .quick-cards-grid { gap:16px; }.quick-card { padding:18px; gap:14px; }.quick-card-title { font-size:.91rem; }.quick-card-desc { font-size:.78rem; }
 .studio-projects { grid-template-columns:repeat(3,minmax(0,1fr)); }.studio-project:first-child { grid-column:auto; }.studio-project-meta { padding:18px; }.studio-project-meta h3 { font-size:1.14rem; }.studio-project:first-child .studio-project-photo img { aspect-ratio:4/3; }
 .studio-steps article { padding:18px; }.studio-estimate-grid { gap:35px; }.recovered-intro .page-hero-copy { max-width:580px; }.recovered-intro .page-hero-title { font-size:2.6rem; }.recovered-intro .page-hero-subtitle { max-width:440px; }.contact-info-card { padding:23px; }
}
@media(max-width:767px) {
 :root { --section-space:46px; }.header-actions .phone-link { color:var(--theme-on-primary, #fff); border-color:color-mix(in srgb, var(--theme-muted-light, #8e9aa5) 40%, transparent); background:transparent; }.header-actions .phone-link svg { stroke:var(--theme-on-primary, #fff); }
 .recovered-hero .hero-grid { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding-top:24px; padding-bottom:20px; gap:20px; }
 .recovered-hero .hero-content { max-width:none; padding-bottom:0; }.recovered-hero .hero-title { font-size:clamp(2.1rem,7.5vw,2.8rem); }.recovered-hero .hero-title-main { white-space:normal; }.recovered-hero .badge-tag { font-size:.66rem; margin-bottom:14px; }.recovered-hero .hero-subtitle { font-size:.94rem; line-height:1.6; max-width:460px; margin-bottom:18px; }.recovered-hero .hero-buttons { gap:10px; align-items:stretch; }.recovered-hero .hero-buttons .btn { font-size:.82rem; padding:12px 14px; flex:1 1 140px; min-height:52px; }.recovered-hero .hero-note { font-size:.73rem; max-width:460px; margin-top:14px; }
 .recovered-hero .hero-visual { position:relative; inset:auto; z-index:2; width:100%; margin:0; }
 .recovered-benefits .studio-benefits { padding:8px 0; }.home-tools { padding-top:22px; }.quick-cards-grid { grid-template-columns:1fr; gap:12px; }.quick-card { padding:18px 20px; }.quick-card-title { font-size:1rem; }.quick-card-desc { font-size:.83rem; }
 .studio-materials { padding-top:40px; }.studio-materials .material-layout { gap:25px; }.material-figure .material-image { aspect-ratio:4/3; }.material-figure { padding:9px; }.material-figure figcaption { padding:14px 4px 5px; }
 .studio-projects { grid-template-columns:1fr; gap:22px; }.studio-project-meta { padding:19px 22px 22px; }.studio-project-meta h3 { font-size:1.4rem; }.studio-detail-grid { gap:24px; }.studio-detail-grid>a { padding-bottom:22px; }
 .studio-estimate-grid { gap:28px; }.studio-quote { padding:25px; }.studio-steps article { padding:19px; }.studio-steps { gap:17px; }.studio-steps p { font-size:.83rem; }.studio-appointment-grid { gap:27px; }
 .recovered-intro .page-hero-grid { min-height:0; padding-bottom:0; }.recovered-intro .page-hero-copy { padding:25px 0 30px; max-width:none; }.recovered-intro .page-hero-title { font-size:2.2rem; }.recovered-intro .page-hero-subtitle { max-width:470px; font-size:.89rem; }
 .recovered-intro .page-hero-photo { position:relative; inset:auto; margin-inline:calc(-1 * var(--gutter)); aspect-ratio:2.2; height:auto; z-index:0; }.recovered-intro .page-hero-photo img { object-position:center 15%; }.recovered-intro .page-hero-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,color-mix(in srgb, var(--theme-primary, #102439) 33.33333%, transparent),transparent 35%); pointer-events:none; }.recovered-intro .page-hero-grid::after { display:none; }.recovered-intro .page-hero-photo figcaption { right:15px; bottom:12px; font-size:.6rem; }.recovered-intro-light .page-hero-photo::after { background:linear-gradient(180deg,color-mix(in srgb, var(--theme-surface-alt, #f0f4f7) 60%, transparent),transparent 40%); }
 .picker-page .recovered-intro .page-hero-grid { min-height:0; }.picker-page .recovered-intro .page-hero-photo { display:none; }.calculator-page .recovered-intro .page-hero-photo { display:none; }.calculator-page .recovered-intro .page-hero-title { font-size:2.2rem; }
 .service-catalog-grid article { padding:17px; gap:20px; }.service-catalog-grid img { aspect-ratio:1.55; }.service-catalog-grid .material-specimen { min-height:245px; }
 .works-grid .work-card-content,.similar-grid .work-card-content { padding:18px 20px; }.project-viewer { padding:8px; }.project-main-slide { border-radius:5px; }.project-thumb-caption { padding:7px; font-size:.76rem; }.spec-card { padding:14px; }.lead-banner { padding:25px; }
 .review-card { padding:23px; }.reviews-grid { gap:22px; }.offer-card-body { padding:21px; }.contact-info-card { padding:25px; }.service-region { padding:24px; }.region-map>span { font-size:.67rem; bottom:9px; right:9px; }.contacts-page .grid-3col { gap:18px; }
 .studio-faq .faq-item,.faq-page .faq-item,.calculator-page .faq-item { padding-inline:15px; }.faq-question { font-size:.9rem; }.faq-answer { font-size:.87rem; }
}
@media(max-width:374px) { .recovered-hero .hero-title { font-size:2.3rem; }.studio-steps article { padding:15px; }.studio-steps p { font-size:.79rem; }.contact-info-card { padding:21px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; } }
.recovered-hero .hero-bg-overlay { display:none !important; }
.recovered-hero .hero-visual { z-index:0; }
.recovered-hero .hero-title { font-size:clamp(3rem,4.1vw,4rem); }
.recovered-hero .hero-title-main { font-size:1em; }
@media(max-width:767px) { .recovered-hero .hero-bg-overlay { z-index:-1; }.recovered-hero .hero-title { font-size:clamp(2.3rem,7.4vw,3.1rem); } }

/* One common optical rhythm, with comfortable type and no duplicated accordion gap. */
.studio-home .studio-section-heading { margin-bottom:28px; }
.studio-home .faq-list { gap:10px; }
.studio-home .faq-list .faq-item { margin-bottom:0; }
.studio-home .studio-quote h3 { margin-bottom:16px; }
.studio-home #homeEstimateBreakdown>div { padding-block:11px; }
.studio-home .studio-quote-total { padding-top:22px; }
.studio-home .studio-project-meta p { font-size:.72rem; }
.studio-home .studio-disclosure,.studio-gallery-note,.material-figure small { font-size:.78rem; }
.service-catalog-grid .material-specimen h3 em { color:var(--theme-accent-on-primary, var(--champagne)); }
/* A light travels along the existing frame on hover/focus, without crossing a photograph. */
:is(.quick-card,.studio-project,.studio-detail-grid>a,.work-card,.offer-card,.inspire-card,.appointment-form,.editorial-form,.calc-summary) { position:relative; isolation:isolate; }
:is(.quick-card,.studio-project,.studio-detail-grid>a,.work-card,.offer-card,.inspire-card,.appointment-form,.editorial-form,.calc-summary)::after {
 content:""; position:absolute; inset:-1px; border:1px solid transparent; border-radius:inherit;
 background:linear-gradient(115deg,transparent 30%,color-mix(in srgb, var(--theme-accent, #d9ba7e) 60%, transparent) 44%,color-mix(in srgb, var(--theme-highlight, #fff2cb) 80%, transparent) 50%,color-mix(in srgb, var(--theme-accent, #d9ba7e) 60%, transparent) 56%,transparent 70%) border-box;
 background-size:300% 100%; background-position:100% 50%;
 mask:linear-gradient(var(--theme-surface, #fff) 0 0) padding-box,linear-gradient(var(--theme-surface, #fff) 0 0); mask-composite:exclude;
 pointer-events:none; opacity:0;
}
@keyframes elips-frame-light { 0% {opacity:0;background-position:100% 50%} 20% {opacity:1} 80% {opacity:1} 100% {opacity:0;background-position:0 50%} }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 :is(.quick-card,.studio-project,.studio-detail-grid>a,.work-card,.offer-card,.inspire-card):hover::after,
 :is(.appointment-form,.editorial-form):focus-within::after { animation:elips-frame-light 1.4s ease-out both; }
}
@media(min-width:768px) {
 .recovered-hero .hero-visual { inset:0 calc((min(100vw,var(--content-width)) - 100vw) / 2); }
 .recovered-hero .hero-bg-overlay { display:none !important; }
}
@media(max-width:767px) {
 .studio-home .studio-section-heading { margin-bottom:24px; }
 .studio-home .studio-section-heading>div:last-child { margin-top:15px; }
 .studio-home .studio-section-heading p { margin-bottom:8px; }
 .recovered-hero .hero-note { margin-top:19px; }
 .quick-card { padding:15px 18px; }
 .quick-card-desc { line-height:1.55; }
 .studio-quote-total { gap:12px; }
 .studio-home .studio-quote-total output { font-size:2.8rem; }
 .studio-home .studio-steps { grid-template-columns:1fr; gap:12px; }
 .studio-home .studio-steps article { display:grid; grid-template-columns:34px 1fr; gap:5px 12px; padding:17px 19px; }
 .studio-home .studio-steps article>span { grid-row:1/3; font-size:1.45rem; }
 .studio-home .studio-steps h3 { margin:0; }
 .studio-home .studio-steps p { grid-column:2; font-size:.86rem; }
 .contacts-page .grid-3col .process-card { border:1px solid var(--line); border-top:2px solid var(--theme-accent, #c4a270); padding:20px; background:var(--theme-surface, #fff); border-radius:8px; box-shadow:var(--shadow-sm); }
}

/* Sourced captions are legible on both light paper and dark surfaces. */
.eyebrow { color:var(--theme-accent-strong, #8b6838); }
.studio-trust .eyebrow,.recovered-intro:not(.recovered-intro-light) .section-pretitle,.question-aside .section-pretitle { color:var(--champagne); }
.studio-quote .eyebrow,.material-specimen .eyebrow { color:var(--theme-accent-on-primary, var(--champagne)); }
.section-title em,.service-region h3 em { color:var(--theme-accent-strong, #8e6938); }
.calc-desc a { text-decoration:underline; text-underline-offset:3px; }
.recovered-hero .hero-image-caption { position:absolute; top:22px; right:22px; padding:6px 10px; background:color-mix(in srgb, var(--theme-primary, #102438) 69.01961%, transparent); border-radius:4px; color:var(--theme-on-primary-muted, #edf3f6); font-size:.68rem; z-index:2; }
@media(max-width:767px) { .recovered-hero .hero-image-caption { top:12px; right:14px; font-size:.64rem; } }
@media(max-width:767px) {
 .calculator-page .process-grid { grid-template-columns:1fr; gap:12px; }
 .calculator-page .process-grid .process-card { display:grid; grid-template-columns:36px 1fr; gap:5px 16px; padding:20px; }
 .calculator-page .process-header { grid-row:1/3; margin:0; align-items:start; }
 .calculator-page .process-header .process-icon { display:none; }
 .calculator-page .process-number { font-size:1.5rem; }
 .calculator-page .process-title { margin:0; font-size:1rem; }
 .calculator-page .process-desc { grid-column:2; }
}

/* Extra mobile layout polish & touch optimization */
@media(max-width:767px) {
  html, body {
    max-width: 100vw;
    overflow-x: hidden;
  }
  input[type="text"], input[type="tel"], input[type="email"], select, textarea {
    font-size: 16px !important; /* Prevents auto-zoom in mobile Safari */
  }
  .container {
    padding-inline: 16px;
  }
}

@media(max-width:360px) {
  .container {
    padding-inline: 12px;
  }
  .site-header .header-container {
    padding-inline: 10px !important;
  }
  .site-header .logo-title {
    font-size: 0.88rem !important;
  }
  .site-header .phone-link,
  .site-header .mobile-toggle {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
  }
}

/* Promo Slider styles are maintained in /css/slider.css */

/* Brand Logo Image styles */
.logo-icon .logo-img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: block;
  object-fit: contain;
  box-shadow: 0 0 10px color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 45%, transparent);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.logo:hover .logo-icon .logo-img {
  transform: scale(1.05);
  box-shadow: 0 0 16px color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 70%, transparent);
}
@media (max-width: 768px) {
  .logo-icon .logo-img {
    width: 32px;
    height: 32px;
  }
}

/* ==========================================================================
   PROFILES AND PERIMETER SYSTEMS — SERVICES PAGE
   ========================================================================== */
.profile-systems-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: 28px;
  margin-top: 32px;
}
.profile-card {
  background: var(--theme-surface, #ffffff);
  border-radius: 14px;
  border: 1px solid var(--theme-border, #dfe6ed);
  overflow: hidden;
  box-shadow: 0 4px 18px color-mix(in srgb, var(--theme-primary, rgb(23 44 64)) 6%, transparent);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
  display: flex;
  flex-direction: column;
}
.profile-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 34px color-mix(in srgb, var(--theme-primary, rgb(23 44 64)) 12%, transparent);
  border-color: var(--theme-accent, #dfc38f);
}
.profile-card-image {
  position: relative;
  height: 220px;
  overflow: hidden;
  background: var(--theme-primary-deep, #0e1e2f);
}
.profile-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.profile-card:hover .profile-card-image img {
  transform: scale(1.04);
}
.profile-card-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  background: color-mix(in srgb, var(--theme-primary, rgb(14 30 47)) 88%, transparent);
  backdrop-filter: blur(6px);
  color: var(--theme-accent-on-primary, #faebd0);
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 50%, transparent);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 20px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.profile-card-price {
  position: absolute;
  bottom: 14px;
  right: 14px;
  background: linear-gradient(135deg, var(--theme-button-start, var(--theme-highlight, #faebd0)) 0%, var(--theme-button-end, var(--theme-accent, #dfc38f)) 100%);
  color: var(--theme-on-button, var(--theme-on-accent, #102438));
  font-size: 0.88rem;
  font-weight: 800;
  padding: 5px 12px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}
.profile-card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.profile-card-title {
  font-size: 1.22rem;
  font-weight: 700;
  color: var(--theme-text, #162f49);
  margin: 0 0 10px;
  line-height: 1.3;
}
.profile-card-desc {
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--theme-muted, #57697b);
  margin: 0 0 16px;
  flex-grow: 1;
}
.profile-card-perks {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.profile-card-perks li {
  font-size: 0.84rem;
  color: var(--theme-text, #1a334c);
  display: flex;
  align-items: center;
  gap: 8px;
}
.profile-card-perks li::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--theme-accent-strong, #b88d4c);
  flex-shrink: 0;
}
.profile-card-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: auto;
}
.profile-card-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  background: var(--theme-primary, #162f49);
  color: var(--theme-on-primary, #ffffff) !important;
  border: 1px solid var(--theme-primary, #162f49);
  transition: all 0.2s ease;
}
.profile-card-btn:hover {
  background: var(--theme-button-fill, var(--theme-accent, #b88d4c));
  border-color: var(--theme-accent, #b88d4c);
  color: var(--theme-on-button, var(--theme-on-accent, #ffffff)) !important;
}

/* ==========================================================================
   PERFECT 10/10 COLOR & TEXTURE VISUALIZER (PICKER)
   ========================================================================== */
.picker-page section[data-picker] {
  background: var(--theme-surface-alt, #f8fafc) !important;
  padding: 40px 0 60px !important;
}

.picker-layout {
  display: grid !important;
  grid-template-columns: 1fr 1.25fr !important;
  gap: 32px !important;
  align-items: start !important;
}

.picker-controls {
  background: var(--theme-surface, #ffffff) !important;
  border: 1px solid var(--theme-border, #e2e8f0) !important;
  border-radius: 16px !important;
  padding: 28px !important;
  box-shadow: 0 4px 20px color-mix(in srgb, var(--theme-primary, rgb(15 23 42)) 5%, transparent) !important;
}

.picker-step-number {
  background: var(--theme-primary, #111e2e) !important;
  color: var(--theme-accent-on-primary, #c89d59) !important;
  font-weight: 700 !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.78rem !important;
}

.surface-card {
  border: 1.5px solid var(--theme-border, #e2e8f0) !important;
  border-radius: 10px !important;
  background: var(--theme-surface, #ffffff) !important;
  padding: 10px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.surface-card:hover {
  border-color: var(--theme-border, #cbd5e1) !important;
  transform: translateY(-2px) !important;
}

.surface-card.active {
  border-color: var(--theme-accent, #c89d59) !important;
  background: var(--theme-accent-tint, #fdfbf7) !important;
  box-shadow: 0 0 0 1px var(--theme-accent, #c89d59) !important;
}

.surface-card img {
  border-radius: 6px !important;
  width: 100% !important;
  height: 72px !important;
  object-fit: cover !important;
}

.surface-card-title {
  font-weight: 700 !important;
  font-size: 0.88rem !important;
  color: var(--theme-text, #0f1d2e) !important;
  margin-top: 8px !important;
}

.surface-card-desc {
  font-size: 0.74rem !important;
  color: var(--theme-muted, #64748b) !important;
  margin-top: 2px !important;
}

.room-pills-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

@media (max-width: 600px) {
  .room-pills-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 360px) {
  .room-pills-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

.room-pill {
  border: 1.5px solid var(--theme-border, #e2e8f0) !important;
  border-radius: 8px !important;
  background: var(--theme-surface, #ffffff) !important;
  padding: 10px 8px !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  color: var(--theme-text, #334155) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  text-align: center !important;
}

.room-pill:hover {
  border-color: var(--theme-accent, #c89d59) !important;
  color: var(--theme-text, #0f1d2e) !important;
}

.room-pill.active {
  border-color: var(--theme-primary, #111e2e) !important;
  background: var(--theme-primary, #111e2e) !important;
  color: var(--theme-on-primary, #ffffff) !important;
}

.color-tab-btn {
  border: 1px solid var(--theme-border, #e2e8f0) !important;
  border-radius: 20px !important;
  background: var(--theme-surface, #ffffff) !important;
  color: var(--theme-muted, #64748b) !important;
  padding: 6px 14px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.color-tab-btn:hover {
  border-color: var(--theme-border, #cbd5e1) !important;
  color: var(--theme-text, #0f1d2e) !important;
}

.color-tab-btn.active {
  border-color: var(--theme-primary, #111e2e) !important;
  background: var(--theme-primary, #111e2e) !important;
  color: var(--theme-on-primary, #ffffff) !important;
}

.visualizer-display {
  background: var(--theme-surface, #ffffff) !important;
  border: 1px solid var(--theme-border, #e2e8f0) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  padding: 16px !important;
  box-shadow: 0 4px 20px color-mix(in srgb, var(--theme-primary, rgb(15 23 42)) 5%, transparent) !important;
  position: sticky !important;
  top: 86px !important;
}

.visualizer-canvas-wrap {
  border-radius: 12px !important;
  overflow: hidden !important;
  position: relative !important;
  height: 440px !important;
  background: var(--theme-primary-deep, #0d1b2a) !important;
}

.visualizer-room-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

.visualizer-nav-btn {
  display: none !important;
}

.visualizer-badge {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  background: color-mix(in srgb, var(--theme-primary, rgb(13 24 38)) 90%, transparent) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 15%, transparent) !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  color: var(--theme-on-primary, #ffffff) !important;
  z-index: 5 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25) !important;
}

.visualizer-badge-surface {
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  margin-bottom: 2px !important;
}

.visualizer-badge-color {
  font-size: 0.8rem !important;
  color: var(--theme-on-primary, #ffffff) !important;
}

.visualizer-thumbs-strip {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
  margin-top: 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border-top: none !important;
}

.viz-thumb-btn {
  border: 2px solid transparent !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  padding: 0 !important;
  background: var(--theme-primary-deep, #0d1b2a) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  position: relative !important;
  aspect-ratio: 16/10 !important;
  height: auto !important;
}

.viz-thumb-btn img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.3s ease !important;
}

.viz-thumb-btn:hover img {
  transform: scale(1.05) !important;
}

.viz-thumb-btn.active {
  border-color: var(--theme-accent, #c89d59) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-accent, rgb(200 157 89)) 40%, transparent) !important;
}

.viz-thumb-label {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--theme-primary, rgb(10 20 32)) 88%, transparent) 100%) !important;
  color: var(--theme-on-primary, #ffffff) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  padding: 8px 4px 4px !important;
  text-align: center !important;
}

@media (max-width: 991px) {
  .picker-layout {
    grid-template-columns: 1fr !important;
  }
  .visualizer-display {
    position: relative !important;
    top: 0 !important;
  }
}

/* Saved nested navigation shares the existing desktop and mobile menus. */
.nav-item.has-submenu { padding-right:24px; }
.nav-submenu-toggle { position:absolute; top:0; right:0; min-width:24px; min-height:32px; border:0; background:transparent; color:inherit; cursor:pointer; }
.nav-submenu { position:absolute; top:100%; left:0; min-width:230px; margin:0; padding:10px; list-style:none; background:var(--paper,#fff); border:1px solid var(--line,#ccd4dc); border-radius:8px; box-shadow:0 8px 24px rgb(0 0 0 / 15%); z-index:1050; }
.nav-submenu[hidden] { display:none !important; }
.nav-submenu .nav-link { padding:10px 12px; white-space:normal; }
.nav-submenu .nav-submenu { top:0; left:100%; }
.cms-content-blocks { padding-block:32px; }
.cms-content-blocks > article,.cms-content-blocks > figure { margin:0 0 32px; max-width:960px; }
.cms-content-blocks h2 { margin-bottom:16px; }
.cms-block-text { white-space:pre-wrap; line-height:1.8; }
.cms-content-blocks img { display:block; max-width:100%; max-height:700px; object-fit:contain; border-radius:10px; }
.cms-content-blocks figcaption { margin-top:12px; color:var(--muted,#52616f); }
.cms-gallery { display:flex; flex-wrap:wrap; gap:20px; margin:24px 0; }
.cms-gallery img { width:min(100%,360px); height:240px; object-fit:cover; }
@media(max-width:1279px) {
 .site-header .nav-item.has-submenu { padding-right:38px !important; }
 .nav-submenu-toggle { min-width:38px; min-height:48px; color:var(--theme-on-primary-muted, #edf3f8); }
 .nav-submenu,.nav-submenu .nav-submenu { position:static; min-width:0; padding:8px 0 0 12px; border:0; box-shadow:none; background:transparent; }
 .nav-submenu .nav-item { margin-top:6px !important; }
 .cms-gallery img { width:100%; height:auto; }
}
/* Dialogs stay above the header and cookie consent controls. */
.modal-backdrop { z-index:10001; }
.site-header .nav-submenu { background:var(--theme-primary, #102235); }
@media(max-width:1279px) { .site-header .nav-submenu { background:transparent; } }
/* Wrapping plain heading text for CMS editing must keep its original colour. */
h1 > span[data-cms-key]:not([class]),h2 > span[data-cms-key]:not([class]),h3 > span[data-cms-key]:not([class]),h4 > span[data-cms-key]:not([class]) { color:inherit !important; }
/* Fit the complete header between the mobile and wide desktop breakpoints. */
@media(min-width:1200px) and (max-width:1599px) {
 .site-header .header-container { gap:14px; }
 .site-header .nav-menu { gap:4px; }
 .site-header .nav-link { padding:8px 6px !important; font-size:0.8rem !important; white-space:nowrap; }
 .site-header .header-actions { gap:12px; }
 .site-header .header-actions > .btn { padding:10px 14px !important; }
}
@media(min-width:1200px) {
 .site-header .nav-menu { position:static; flex-direction:row; align-items:center; transform:none; overflow:visible; }
 .site-header .nav-menu > .nav-item { width:auto; }
 .site-header .nav-link { width:auto; border-bottom:0; }
}
@media(min-width:1200px) and (max-width:1239px) {
 .site-header .header-container { gap:10px; }
 .site-header .nav-link { padding-inline:4px !important; }
}

/* ==========================================================================
   Reviews Grid & Equal Height Balanced Cards
   ========================================================================== */
.reviews-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

.review-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  box-sizing: border-box !important;
  background: var(--theme-surface, #ffffff) !important;
  border: 1px solid color-mix(in srgb, var(--theme-border, rgb(216 224 232)) 85%, transparent) !important;
  border-top: 3px solid var(--theme-accent, #dfc38f) !important;
  border-radius: 12px !important;
  padding: 26px 28px !important;
  box-shadow: 0 4px 20px color-mix(in srgb, var(--theme-primary, rgb(15 29 46)) 5%, transparent) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
  position: relative !important;
}

.review-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--theme-primary, rgb(15 29 46)) 10%, transparent) !important;
  border-color: var(--theme-accent, #dfc38f) !important;
}

.review-card-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 12px !important;
}

.review-card .quote-mark {
  font-family: Georgia, serif !important;
  font-size: 2.4rem !important;
  line-height: 1 !important;
  color: var(--theme-accent-strong, #dfc38f) !important;
  opacity: 0.85 !important;
  user-select: none !important;
  height: auto !important;
}

.review-rating {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.review-star {
  display: inline-block !important;
  color: var(--theme-border, #e2e8f0) !important;
  fill: var(--theme-border, #e2e8f0) !important;
}

.review-star.filled {
  color: #eab308 !important;
  fill: #eab308 !important;
}

.review-card-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 14px !important;
}

.review-name {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--theme-text, #0f1d2e) !important;
  margin: 0 !important;
}

.review-badge-verified {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  color: #15803d !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  padding: 3px 9px !important;
  border-radius: 20px !important;
}

.review-text {
  flex: 1 1 auto !important;
  font-size: 0.92rem !important;
  line-height: 1.68 !important;
  color: var(--theme-text, #334155) !important;
  margin: 0 0 16px 0 !important;
}

.review-expand {
  display: inline-block !important;
  background: none !important;
  border: none !important;
  color: var(--theme-accent-strong, #c49d59) !important;
  font-weight: 600 !important;
  font-size: 0.82rem !important;
  cursor: pointer !important;
  padding: 0 !important;
  margin-bottom: 16px !important;
  text-align: left !important;
  transition: color 0.2s ease !important;
}

.review-expand:hover {
  color: var(--theme-accent-strong, #9a7332) !important;
  text-decoration: underline !important;
}

.review-card-footer {
  margin-top: auto !important;
  padding-top: 14px !important;
  border-top: 1px solid var(--theme-surface-alt, #f1f5f9) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 0.76rem !important;
  color: var(--theme-muted, #64748b) !important;
}

@media (max-width: 820px) {
  .reviews-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .review-card {
    padding: 20px 18px !important;
  }
}

/* ==========================================================================
   Push Notification Prompt Card
   ========================================================================== */
.push-notification-prompt {
  position: fixed !important;
  top: 24px !important;
  right: 24px !important;
  z-index: 10002 !important;
  max-width: 380px !important;
  width: calc(100vw - 32px) !important;
  transform: translateY(-30px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease !important;
}

.push-notification-prompt.show {
  transform: translateY(0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.push-prompt-card {
  position: relative !important;
  background: color-mix(in srgb, var(--theme-primary, rgb(15 29 46)) 96%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 35%, transparent) !important;
  border-radius: 14px !important;
  padding: 20px 22px !important;
  box-shadow: 0 16px 40px -10px rgba(0, 0, 0, 0.55), 0 0 0 1px color-mix(in srgb, var(--theme-on-primary, rgb(255 255 255)) 5%, transparent) !important;
  color: var(--theme-on-primary, #ffffff) !important;
}

.push-prompt-close {
  position: absolute !important;
  top: 12px !important;
  right: 14px !important;
  background: none !important;
  border: none !important;
  color: var(--theme-on-primary-muted, #94a3b8) !important;
  font-size: 1.4rem !important;
  line-height: 1 !important;
  cursor: pointer !important;
  padding: 4px !important;
  transition: color 0.2s !important;
}

.push-prompt-close:hover {
  color: var(--theme-on-primary, #ffffff) !important;
}

.push-prompt-header {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
}

.push-prompt-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 15%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--theme-accent, rgb(223 195 143)) 30%, transparent) !important;
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  animation: push-bell-ring 3s ease infinite !important;
}

@keyframes push-bell-ring {
  0%, 80%, 100% { transform: rotate(0); }
  85% { transform: rotate(12deg); }
  90% { transform: rotate(-10deg); }
  95% { transform: rotate(6deg); }
}

.push-prompt-title-wrap {
  flex: 1 !important;
  min-width: 0 !important;
}

.push-prompt-brand {
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  color: var(--theme-accent-on-primary, #dfc38f) !important;
  text-transform: uppercase !important;
  margin-bottom: 2px !important;
}

.push-prompt-title {
  font-size: 0.98rem !important;
  font-weight: 700 !important;
  color: var(--theme-on-primary, #ffffff) !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

.push-prompt-desc {
  font-size: 0.83rem !important;
  line-height: 1.5 !important;
  color: var(--theme-on-primary-muted, #cbd5e1) !important;
  margin: 0 0 16px 0 !important;
}

.push-prompt-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.push-prompt-actions .btn {
  flex: 1 !important;
  text-align: center !important;
  justify-content: center !important;
  padding: 9px 14px !important;
  font-size: 0.84rem !important;
  border-radius: 7px !important;
}

@media (max-width: 600px) {
  .push-notification-prompt {
    top: 14px !important;
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
    max-width: none !important;
  }
}