:root {
  --site-bg: #fbfaf7;
  --site-panel: #ffffff;
  --site-panel-soft: #f4f0ea;
  --site-text: #151515;
  --site-muted: #6f6860;
  --site-line: rgba(21, 21, 21, 0.12);
  --site-accent: #b77820;
  --site-shadow: 0 20px 60px rgba(20, 20, 20, 0.08);
}

html.site-dark {
  --site-bg: #0f0f10;
  --site-panel: #181614;
  --site-panel-soft: #211d18;
  --site-text: #f4efe4;
  --site-muted: #c2b6a2;
  --site-line: rgba(240, 199, 106, 0.2);
  --site-accent: #f0c76a;
  --site-shadow: 0 20px 60px rgba(0, 0, 0, 0.32);
  color-scheme: dark;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

body {
  color: var(--site-text);
  background: var(--site-bg) !important;
  transition: color 180ms ease, background-color 180ms ease;
}

img,
video,
iframe,
table {
  max-width: 100%;
}

.site-theme-toggle {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid rgba(21, 21, 21, 0.16);
  border-radius: 999px;
  color: #151515;
  background: transparent;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.7px;
  text-transform: uppercase;
}

.site-theme-toggle:hover,
.site-theme-toggle:focus {
  border-color: #c99722;
  color: #9a6415;
  outline: none;
}

html.site-dark .studio-header,
html.site-dark .studio-brand-row,
html.site-dark .studio-menu,
html.site-dark .studio-menu .navbar,
html.site-dark .studio-menu .navbar-collapse {
  color: var(--site-text);
  background: var(--site-panel) !important;
}

html.site-dark .studio-logo h3,
html.site-dark .studio-menu .menu-title,
html.site-dark .studio-menu .navbar-nav > li > a,
html.site-dark .studio-cart-toggle,
html.site-dark .site-theme-toggle {
  color: var(--site-text) !important;
}

html.site-dark .studio-logo span,
html.site-dark .studio-header .cart-dropdown .cart-price,
html.site-dark .studio-header .cart-dropdown h5 {
  color: var(--site-muted) !important;
}

html.site-dark .studio-menu,
html.site-dark .studio-brand-row,
html.site-dark .studio-header .cart-dropdown .media,
html.site-dark .studio-header .cart-summary {
  border-color: var(--site-line) !important;
}

html.site-dark .studio-header .cart-dropdown,
html.site-dark .studio-header .cart-dropdown .media,
html.site-dark .studio-header .cart-dropdown .media-heading a {
  color: var(--site-text) !important;
  background: var(--site-panel) !important;
}

html.site-dark .site-theme-toggle {
  border-color: rgba(240, 199, 106, 0.42);
}

html.site-dark .design-home,
html.site-dark .shop-page,
html.site-dark .cart-page,
html.site-dark .checkout-page,
html.site-dark .contact-page,
html.site-dark .faq-page,
html.site-dark .feedback-page,
html.site-dark .track-page,
html.site-dark .about,
html.site-dark .page-wrapper,
html.site-dark .shopping {
  color: var(--site-text) !important;
  background: var(--site-bg) !important;
}

html.site-dark .portfolio,
html.site-dark .quote-section {
  color: var(--site-text) !important;
  background: var(--site-panel-soft) !important;
}

html.site-dark .portfolio .section-title,
html.site-dark .portfolio .section-copy {
  color: var(--site-text) !important;
}

html.site-light .custom-product-callout {
  color: #151515 !important;
  background: #efe7dc !important;
}

html.site-light .custom-product-callout h2 { color: #151515 !important; }
html.site-light .custom-product-callout p { color: #645d55 !important; }

html.site-dark .custom-product-callout,
html.site-dark .quote-panel {
  color: var(--site-text) !important;
  background: #151515 !important;
}

html.site-dark .design-home .section-title,
html.site-dark .about-studio .about-panel,
html.site-dark .about-point strong,
html.site-dark .service-card h3,
html.site-dark .product-card h3,
html.site-dark .client-row h4,
html.site-dark .shop-heading h2,
html.site-dark .shop-sidebar h3,
html.site-dark .catalog-body h3,
html.site-dark .empty-products h3,
html.site-dark .cart-product strong,
html.site-dark .empty-cart h2,
html.site-dark .checkout-panel h2,
html.site-dark .checkout-summary h2,
html.site-dark .summary-item h3,
html.site-dark .contact-form-panel h2,
html.site-dark .contact-info-panel h2,
html.site-dark .process-card h3,
html.site-dark .faq-side h2,
html.site-dark .faq-item h3,
html.site-dark .feedback-intro h1,
html.site-dark .feedback-panel label,
html.site-dark .track-search h2,
html.site-dark .track-result h2,
html.site-dark .track-help h3,
html.site-dark .order-field strong,
html.site-dark .product-modal .product-title,
html.site-dark .service-work-copy h4,
html.site-dark .page-wrapper h1,
html.site-dark .page-wrapper h2,
html.site-dark .page-wrapper h3,
html.site-dark .page-wrapper h4,
html.site-dark .page-wrapper h5 {
  color: var(--site-text) !important;
}

html.site-dark .design-home .section-copy,
html.site-dark .about-studio .about-panel p,
html.site-dark .about-point span,
html.site-dark .service-card p,
html.site-dark .product-card p,
html.site-dark .shop-heading p,
html.site-dark .shop-sidebar p,
html.site-dark .catalog-body p,
html.site-dark .empty-products p,
html.site-dark .empty-cart p,
html.site-dark .summary-item p,
html.site-dark .delivery-charge-note,
html.site-dark .checkout-secure-note,
html.site-dark .contact-form-panel p,
html.site-dark .process-card p,
html.site-dark .faq-side p,
html.site-dark .faq-item p,
html.site-dark .feedback-intro p,
html.site-dark .track-search p,
html.site-dark .track-help p,
html.site-dark .order-field span,
html.site-dark .service-work-copy p,
html.site-dark .service-work-empty,
html.site-dark .product-modal .modal-description,
html.site-dark .page-wrapper p,
html.site-dark .about p {
  color: var(--site-muted) !important;
}

html.site-dark .service-card,
html.site-dark .product-card,
html.site-dark .about-studio .about-panel,
html.site-dark .catalog-card,
html.site-dark .shop-sidebar,
html.site-dark .empty-products,
html.site-dark .quote-form,
html.site-dark .cart-panel,
html.site-dark .empty-cart,
html.site-dark .checkout-panel,
html.site-dark .checkout-summary,
html.site-dark .contact-form-panel,
html.site-dark .process-card,
html.site-dark .faq-item,
html.site-dark .feedback-panel,
html.site-dark .track-search,
html.site-dark .track-result,
html.site-dark .track-help,
html.site-dark .service-work-item,
html.site-dark .product-modal .modal-content,
html.site-dark .product-modal .modal-description,
html.site-dark .product-modal .product-short-details,
html.site-dark .home-product-modal .modal-visual,
html.site-dark .shopping .block {
  color: var(--site-text) !important;
  background: var(--site-panel) !important;
  border-color: var(--site-line) !important;
  box-shadow: var(--site-shadow);
}

html.site-dark .quote-copy,
html.site-dark .faq-side,
html.site-dark .contact-info-panel,
html.site-dark .checkout-benefit,
html.site-dark .order-field,
html.site-dark .product-gallery-thumbs,
html.site-dark .home-product-modal .modal-visual {
  color: var(--site-text) !important;
  background: var(--site-panel-soft) !important;
  border-color: var(--site-line) !important;
}

html.site-dark .form-control,
html.site-dark input,
html.site-dark select,
html.site-dark textarea {
  color: var(--site-text) !important;
  background-color: var(--site-panel-soft) !important;
  border-color: rgba(240, 199, 106, 0.32) !important;
}

html.site-dark .form-control::placeholder,
html.site-dark input::placeholder,
html.site-dark textarea::placeholder {
  color: #9f927c !important;
}

html.site-dark .cart-row,
html.site-dark .summary-item,
html.site-dark .items-table th,
html.site-dark .items-table td,
html.site-dark .product-short-description th,
html.site-dark .product-short-description td {
  border-color: var(--site-line) !important;
}

html.site-dark .items-table th,
html.site-dark .items-table td {
  color: var(--site-text) !important;
  background: var(--site-panel) !important;
}

@media (max-width: 991px) {
  .studio-brand-row .container,
  .shop-heading,
  .catalog-footer,
  .checkout-panel-head {
    gap: 14px;
    flex-wrap: wrap;
  }

  .product-modal .modal-dialog,
  .home-product-modal .modal-dialog,
  .service-work-modal .modal-dialog {
    width: calc(100% - 24px) !important;
    margin: 12px auto;
  }
}

@media (max-width: 767px) {
  .container {
    width: 100%;
    padding-right: 18px;
    padding-left: 18px;
  }

  .studio-topbar .container,
  .studio-brand-row .container {
    text-align: center;
  }

  .studio-header-actions {
    width: 100%;
    justify-content: center;
    gap: 8px !important;
    flex-wrap: wrap;
  }

  .studio-header-actions > li,
  .studio-header-actions .studio-cta,
  .studio-header-actions .studio-cart-toggle,
  .site-theme-toggle {
    flex: 1 1 auto;
  }

  .studio-header-actions .studio-cta,
  .studio-header-actions .studio-cart-toggle,
  .site-theme-toggle {
    min-height: 42px;
    justify-content: center;
  }

  .studio-header .cart-dropdown {
    position: fixed !important;
    top: auto !important;
    right: 12px !important;
    left: 12px !important;
    width: auto;
    min-width: 0 !important;
    max-width: none !important;
    transform: none !important;
  }

  .design-home .section,
  .shop-wrap,
  .cart-wrap,
  .checkout-wrap,
  .contact-wrap,
  .faq-shell,
  .track-wrap {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }

  .design-home .section-title,
  .shop-hero h1,
  .cart-hero h1,
  .checkout-hero h1,
  .contact-hero h1,
  .track-hero h1,
  .studio-page-hero h1,
  .feedback-intro h1 {
    overflow-wrap: anywhere;
    font-size: clamp(32px, 10vw, 42px) !important;
  }

  .quote-panel,
  .quote-copy,
  .quote-form,
  .cart-panel,
  .cart-summary-panel,
  .checkout-panel,
  .checkout-summary,
  .contact-form-panel,
  .contact-info-body,
  .feedback-panel,
  .track-search,
  .track-result,
  .empty-cart,
  .empty-products {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .table-responsive,
  .items-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .btn,
  button,
  input[type="submit"] {
    max-width: 100%;
  }
}

@media (max-width: 479px) {
  .studio-logo a {
    flex-direction: column;
  }

  .studio-logo h3 {
    font-size: 18px !important;
  }

  .studio-header-actions > li {
    width: calc(50% - 4px);
  }

  .studio-header-actions > li:last-child {
    width: 100%;
  }

  .cart-actions,
  .modal-actions,
  .cart-buttons {
    flex-direction: column;
  }

  .cart-actions > *,
  .modal-actions > *,
  .cart-buttons > li,
  .cart-buttons .btn {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}