/*
 * Piano House — iOS Liquid Glass visual layer
 * Presentation only: no grid, container, section order, or template changes.
 */
:root {
  --ph-ink: #171715;
  --ph-muted: #73716d;
  --ph-gold: #b89556;
  --ph-gold-soft: #d9c59c;
  --ph-glass: rgba(255, 255, 255, .70);
  --ph-glass-strong: rgba(255, 255, 255, .86);
  --ph-glass-border: rgba(255, 255, 255, .72);
  --ph-hairline: rgba(24, 24, 22, .08);
  --ph-shadow-sm: 0 8px 28px rgba(34, 31, 25, .07);
  --ph-shadow-lg: 0 24px 70px rgba(34, 31, 25, .14);
  --ph-spring: cubic-bezier(.22, 1, .36, 1);
}

html {
  scroll-behavior: smooth;
}

body.ios-polish {
  color: var(--ph-ink);
  background:
    radial-gradient(circle at 8% 16%, rgba(213, 192, 151, .13), transparent 24rem),
    radial-gradient(circle at 92% 38%, rgba(198, 213, 218, .14), transparent 28rem),
    #fbfbfa;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.ios-polish ::selection {
  color: #fff;
  background: rgba(164, 126, 63, .86);
}

.ios-polish a,
.ios-polish button,
.ios-polish input,
.ios-polish select,
.ios-polish textarea {
  transition:
    color .35s var(--ph-spring),
    background-color .35s var(--ph-spring),
    border-color .35s var(--ph-spring),
    box-shadow .45s var(--ph-spring),
    opacity .35s var(--ph-spring),
    transform .45s var(--ph-spring);
}

.ios-polish a:focus-visible,
.ios-polish button:focus-visible,
.ios-polish input:focus-visible,
.ios-polish select:focus-visible,
.ios-polish textarea:focus-visible {
  outline: 2px solid rgba(184, 149, 86, .76);
  outline-offset: 3px;
}

/* Header, navigation, search */
.ios-polish .header.sticky-active .d-none.d-md-block,
.ios-polish .mobile-nav.sticky-mobile {
  background: rgba(250, 250, 248, .72) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .82);
  box-shadow: 0 10px 38px rgba(29, 27, 23, .09);
  -webkit-backdrop-filter: saturate(180%) blur(24px);
  backdrop-filter: saturate(180%) blur(24px);
}

.ios-polish .center-header,
.ios-polish .mobile-nav {
  transition:
    background-color .45s var(--ph-spring),
    box-shadow .45s var(--ph-spring),
    backdrop-filter .45s var(--ph-spring);
}

.ios-polish .ph-menu-trigger,
.ios-polish .ph-header-right a,
.ios-polish .mobile-nav a {
  -webkit-tap-highlight-color: transparent;
}

.ios-polish .ph-menu-trigger:hover,
.ios-polish .ph-header-right a:hover {
  transform: translateY(-1px);
  opacity: .68;
}

.ios-polish #menu .dropdown-menu,
.ios-polish .dropdown-menu,
.ios-polish .ph-menu-container {
  border: 1px solid var(--ph-glass-border) !important;
  background: rgba(250, 250, 248, .84) !important;
  box-shadow: var(--ph-shadow-lg) !important;
  -webkit-backdrop-filter: saturate(170%) blur(26px);
  backdrop-filter: saturate(170%) blur(26px);
}

.ios-polish #menu .dropdown-menu {
  border-radius: 0 0 22px 22px;
  overflow: hidden;
}

.ios-polish .ph-search-backdrop {
  background: rgba(20, 19, 17, .24);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.ios-polish .ph-search-overlay {
  background: rgba(249, 249, 247, .82) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .78);
  box-shadow: var(--ph-shadow-lg);
  -webkit-backdrop-filter: saturate(180%) blur(30px);
  backdrop-filter: saturate(180%) blur(30px);
}

.ios-polish .ph-search-box {
  overflow: hidden;
  border: 1px solid rgba(25, 24, 22, .10) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .66);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .9),
    0 12px 34px rgba(36, 33, 27, .08);
}

.ios-polish .ph-search-box:focus-within {
  border-color: rgba(184, 149, 86, .38) !important;
  box-shadow:
    0 0 0 4px rgba(184, 149, 86, .10),
    0 18px 44px rgba(36, 33, 27, .11);
}

/* Hero/media polish without changing dimensions */
.ios-polish .home-slider,
.ios-polish .section_banner .item,
.ios-polish .video-slider {
  overflow: hidden;
  isolation: isolate;
}

.ios-polish .home-slider img,
.ios-polish .home-slider video,
.ios-polish .section_banner img {
  transition: transform 1.4s var(--ph-spring), filter .8s ease;
}

.ios-polish .home-slider:hover img,
.ios-polish .section_banner .item:hover img {
  transform: scale(1.018);
  filter: saturate(1.03) contrast(1.015);
}

/* Typography */
.ios-polish .h2-title,
.ios-polish .section_tab_product h2,
.ios-polish .title-head,
.ios-polish h1 {
  color: var(--ph-ink);
  letter-spacing: -.025em;
  text-wrap: balance;
}

.ios-polish .section-feature-product .h2-title::after,
.ios-polish .section_tab_product > .container > h2::after {
  content: "";
  display: block;
  width: 34px;
  height: 1px;
  margin: 12px auto 0;
  background: linear-gradient(90deg, transparent, var(--ph-gold), transparent);
}

/* Product cards: same footprint, richer material */
.ios-polish .block-product {
  --glow-x: 50%;
  --glow-y: 0%;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(247, 247, 244, .66));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .96),
    0 8px 25px rgba(32, 29, 24, .055);
  transform: translateZ(0);
  transition:
    transform .55s var(--ph-spring),
    box-shadow .55s var(--ph-spring),
    border-color .4s ease,
    background-color .4s ease !important;
}

.ios-polish .block-product::after {
  content: "";
  position: absolute;
  z-index: 3;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(
    280px circle at var(--glow-x) var(--glow-y),
    rgba(255, 255, 255, .62),
    transparent 54%
  );
  transition: opacity .45s ease;
}

.ios-polish .block-product:hover {
  border-color: rgba(255, 255, 255, .96);
  background: rgba(255, 255, 255, .84);
  box-shadow:
    inset 0 1px 0 #fff,
    0 22px 52px rgba(34, 31, 25, .13);
  transform: translate3d(0, -7px, 0);
}

.ios-polish .block-product:hover::after {
  opacity: 1;
}

.ios-polish .block-product .img {
  border-radius: 16px 16px 0 0;
  background: #f2f1ed;
}

.ios-polish .block-product .img .embed-responsive,
.ios-polish .block-product .img img {
  transition: transform .75s var(--ph-spring), filter .55s ease !important;
}

.ios-polish .block-product:hover .img .embed-responsive,
.ios-polish .block-product:hover .img img {
  transform: scale(1.035);
  filter: saturate(1.035) contrast(1.02);
}

.ios-polish .block-product .info {
  position: relative;
  z-index: 4;
  background: linear-gradient(180deg, rgba(255, 255, 255, .74), rgba(250, 250, 248, .88));
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.ios-polish .block-product .product-name a {
  color: #282724 !important;
  letter-spacing: .12em;
}

.ios-polish .block-product .product-price {
  color: var(--ph-muted);
  font-variant-numeric: tabular-nums;
}

.ios-polish .block-product .sale-flash {
  left: 10px;
  top: 10px;
  padding: 5px 9px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px;
  background: rgba(22, 22, 20, .78);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.ios-polish .block-product .sale-flash::before {
  display: none;
}

/* Controls and liquid pills */
.ios-polish .nav-tabs {
  border: 1px solid rgba(255, 255, 255, .76) !important;
  border-radius: 999px;
  background: rgba(243, 243, 240, .70);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .9),
    0 10px 28px rgba(35, 32, 27, .06);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.ios-polish .nav-tabs .nav-link {
  border: 0 !important;
  border-radius: 999px !important;
}

.ios-polish .nav-tabs .active > .nav-link,
.ios-polish .nav-tabs .nav-link.active {
  color: #fff !important;
  background: linear-gradient(145deg, #292825, #11110f) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .20),
    0 8px 20px rgba(24, 23, 20, .20);
}

.ios-polish .btn,
.ios-polish button[type="submit"],
.ios-polish input[type="submit"],
.ios-polish .readmore {
  border-radius: 999px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .22),
    0 8px 20px rgba(28, 26, 22, .10);
}

.ios-polish .btn:hover,
.ios-polish button[type="submit"]:hover,
.ios-polish input[type="submit"]:hover,
.ios-polish .readmore:hover {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    0 14px 30px rgba(28, 26, 22, .16);
}

.ios-polish .form-control,
.ios-polish select {
  border-color: var(--ph-hairline);
  border-radius: 12px;
  background-color: rgba(255, 255, 255, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}

.ios-polish .form-control:focus,
.ios-polish select:focus {
  border-color: rgba(184, 149, 86, .44);
  box-shadow: 0 0 0 4px rgba(184, 149, 86, .10);
}

.ios-polish .modal-content,
.ios-polish .popover,
.ios-polish .tooltip-inner {
  border: 1px solid var(--ph-glass-border);
  border-radius: 22px;
  background: var(--ph-glass-strong);
  box-shadow: var(--ph-shadow-lg);
  -webkit-backdrop-filter: saturate(180%) blur(28px);
  backdrop-filter: saturate(180%) blur(28px);
}

.ios-polish .breadcrumb {
  border: 1px solid rgba(255, 255, 255, .66);
  border-radius: 14px;
  background: rgba(255, 255, 255, .58);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

/* Footer and floating contact */
.ios-polish .site-footer,
.ios-polish footer {
  border-top: 1px solid rgba(255, 255, 255, .64);
  background:
    linear-gradient(145deg, rgba(242, 241, 237, .94), rgba(252, 252, 250, .98)) !important;
}

.ios-polish .arcontactus-widget .arcontactus-message-button {
  filter: drop-shadow(0 12px 22px rgba(31, 28, 23, .20));
}

/* Soft entrance animation, enabled by JS only */
.ios-polish.motion-ready .ph-reveal {
  opacity: 0;
  transform: translate3d(0, 22px, 0);
  transition:
    opacity .75s ease,
    transform .9s var(--ph-spring);
  transition-delay: var(--reveal-delay, 0ms);
}

.ios-polish.motion-ready .ph-reveal.ph-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (max-width: 767.98px) {
  .ios-polish .block-product {
    border-radius: 14px;
  }

  .ios-polish .block-product .img {
    border-radius: 13px 13px 0 0;
  }

  .ios-polish .block-product:hover {
    transform: translate3d(0, -3px, 0);
  }

  .ios-polish .nav-tabs {
    border-radius: 18px;
  }

  .ios-polish .ph-search-overlay {
    border-radius: 0 0 24px 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .ios-polish *,
  .ios-polish *::before,
  .ios-polish *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }

  .ios-polish.motion-ready .ph-reveal {
    opacity: 1;
    transform: none;
  }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .ios-polish .header.sticky-active .d-none.d-md-block,
  .ios-polish .mobile-nav.sticky-mobile,
  .ios-polish #menu .dropdown-menu,
  .ios-polish .dropdown-menu,
  .ios-polish .ph-menu-container,
  .ios-polish .ph-search-overlay {
    background: rgba(250, 250, 248, .96) !important;
  }
}