/* Dazzle Mark Experience 1.2.2 — layout-only responsive refinement.
   No checkout, authentication, promotions, or inventory logic is modified.
   Fluid sizing is intentional: never set document zoom or transform:scale(). */
@supports (width: min(100%, 20px)) {
  :root { --container: 1740px; }
  .container { width: min(calc(100% - clamp(28px, 5.3vw, 112px)), var(--container)); }
}
html, body { max-width: 100%; }
body { overflow-wrap: break-word; }
.site-header-v6, .site-header-v6 .header-main, main, .site-footer,
.hero, .hero-content, .hero-copy, .trust-strip, .trust-grid,
.section, .section .container, .story-section, .story-copy,
.updates-section, .updates-inner, .footer-grid,
.product-grid, .product-card, .shop-section, .shop-heading,
.occasion-grid, .service-grid, .editorial-grid, .faq-layout { min-width: 0; }
.section img, .story-section img, .site-footer img, .product-card img { max-width: 100%; }
/* Reduce oversized blank areas without compressing active content. */
.section { padding-block: clamp(40px, 4.7vw, 78px); }
.new-section { padding-top: clamp(32px, 3.7vw, 62px); }
.featured-section, .occasion-section, .services-section { padding-block: clamp(38px, 4.5vw, 74px); }
.shop-section { padding-top: clamp(35px, 4.6vw, 76px); }
.section:empty, .category-chips:empty, .dmxe-location-strip:empty { display: none; }
/* Real responsive type instead of apparent 60%-zoom on large displays. */
body { font-size: clamp(14px, .83vw + 5px, 16px); }
.eyebrow { font-size: clamp(10px, .64vw + 3px, 12px); }
.section-heading h2, .shop-heading h2 { font-size: clamp(32px, 3.6vw, 60px); line-height: 1.1; }
.section-heading > p:not(.eyebrow), .section-heading > div > p:not(.eyebrow) { font-size: clamp(14px, .8vw + 4px, 17px); line-height: 1.6; }
.product-name { font-size: clamp(17px, 1.04vw + 6px, 23px); line-height: 1.3; }
.product-price { font-size: clamp(14px, .75vw + 6px, 18px); }
/* Full-width navigation remains a single line until the existing mobile menu takes over. */
.site-header-v6 .header-main { width: min(calc(100% - clamp(28px, 4.6vw, 105px)), 1740px); gap: clamp(10px, 1.6vw, 30px); }
.site-header-v6 .brand-header { min-width: 0; }
.site-header-v6 .collection-navigation.video-navigation { min-width: 0; }
.site-header-v6 .video-navigation .nav-link { padding-inline: clamp(7px, .75vw, 15px); font-size: clamp(11px, .53vw + 3px, 13px); letter-spacing: .06em; }
.site-header-v6 .experience-links button, .site-header-v6 .experience-links a { font-size: clamp(10px, .44vw + 4px, 12px); letter-spacing: .045em; }
.site-header-v6 .header-actions { flex-shrink: 0; }
/* Keep the hero within the visible screen height on desktop; preserve slide order and controls. */
.site-header-v6 + main .hero, main .hero { height: clamp(470px, calc(100vh - 175px), 710px); min-height: 0; }
@supports (height: 100svh) {
  .site-header-v6 + main .hero, main .hero { height: clamp(470px, calc(100svh - 175px), 710px); }
}
.hero-copy { max-width: min(625px, 100%); }
.hero-content { align-items: center; padding-block: 45px 94px; }
.hero h1, .hero h2 { font-size: clamp(45px, 4.7vw, 76px); line-height: 1.01; }
.hero-copy > p:not(.hero-kicker) { font-size: clamp(14px, .8vw + 5px, 19px); line-height: 1.55; max-width: 55ch; }
.hero-actions { align-items: center; gap: 10px; }
.hero-actions .button { max-width: 100%; padding-inline: clamp(13px, 1.25vw, 24px); white-space: normal; text-align: center; }
.hero-controls { max-width: none; height: 68px; }
/* Cards and panels shrink instead of overflowing or leaving misaligned columns. */
.trust-grid > *, .footer-grid > *, .product-grid > *, .service-grid > * { min-width: 0; }
.trust-item { min-height: 75px; padding: 15px clamp(10px, 1.5vw, 28px); }
.trust-item strong { font-size: clamp(12px, .53vw + 4px, 14px); }
.trust-item small { font-size: clamp(11px, .5vw + 3px, 13px); }
.category-chips:not(:empty) { margin-top: clamp(12px, 1.7vw, 24px); }
.product-grid { gap: clamp(18px, 3vw, 45px) clamp(10px, 1.3vw, 24px); }
.story-section { min-height: 0; grid-template-columns: minmax(0, 1.03fr) minmax(0, .97fr); }
.story-image { min-width: 0; min-height: 430px; }
.story-image img { height: 100%; width: 100%; object-fit: cover; }
.story-copy { min-width: 0; padding: clamp(30px, 4.3vw, 78px); }
.story-copy h2 { font-size: clamp(32px, 3.2vw, 54px); line-height: 1.09; }
.story-copy > p:not(.eyebrow):not(.story-quote) { font-size: clamp(14px, .8vw + 5px, 17px); line-height: 1.6; }
.story-copy li { padding-block: 6px; font-size: clamp(13px, .7vw + 4px, 16px); }
.updates-section { padding-block: clamp(38px, 4vw, 62px); }
.updates-inner { flex-wrap: wrap; }
.updates-inner > div { min-width: 0; }
.updates-inner h2 { font-size: clamp(32px, 3.2vw, 50px); }
.site-footer { padding-top: clamp(35px, 3.5vw, 64px); }
.footer-grid { grid-template-columns: minmax(0, 1.25fr) repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 58px); }
.footer-grid h3 { font-size: clamp(10px, .55vw + 3px, 12px); }
.footer-grid > div:not(:first-child) a, .footer-grid > div:not(:first-child) button { font-size: clamp(12px, .6vw + 4px, 15px); line-height: 1.5; }
.footer-bottom { margin-top: 32px; }
/* Forms remain the native size; no forced scaling on Android or iOS. */
input, select, textarea { max-width: 100%; }
button { max-width: 100%; }
.side-panel, .chat-widget, .dmxe-wa-dialog { max-width: calc(100vw - 18px); }
@media (min-width: 1700px) {
  .site-header-v6 .header-main { min-height: 83px; }
  .hero-actions .button { min-height: 50px; }
  .footer-grid > div:not(:first-child) a { padding-block: 9px; }
}
@media (max-width: 1300px) and (min-width: 1181px) {
  .site-header-v6 .header-main { gap: 9px; }
  .site-header-v6 .video-navigation .nav-link { padding-inline: 7px; font-size: 11px; letter-spacing: .025em; }
  .site-header-v6 .brand-header.dmxe-native-logo .brand-copy strong { font-size: 19px!important; }
  .site-header-v6 .header-actions > .icon-button { width: 38px; }
}
@media (max-width: 1180px) {
  .site-header-v6 .header-main { width: min(calc(100% - 28px), 1740px); gap: 8px; }
  .site-header-v6 + main .hero, main .hero { height: clamp(460px, calc(100vh - 95px), 680px); }
  .hero-content { padding-block: 35px 98px; }
  .hero h1, .hero h2 { font-size: clamp(41px, 6vw, 66px); }
  .story-section { grid-template-columns: 1fr; }
  .story-image { min-height: 0; height: clamp(310px, 45vw, 510px); }
  .story-copy { padding: clamp(26px, 4vw, 55px); }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .updates-inner > div:last-child { min-width: min(100%, 360px); }
}
@media (max-width: 760px) {
  .container { width: calc(100% - 28px); }
  .section { padding-block: 42px; }
  .site-header-v6 .header-main { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 5px; }
  .site-header-v6 .header-actions { gap: 0; }
  .site-header-v6 .header-actions > .icon-button { width: 34px; min-width: 34px; }
  .site-header-v6 + main .hero, main .hero { height: clamp(490px, calc(100vh - 85px), 600px); }
  .hero-content { align-items: flex-end; padding-block: 24px 85px; }
  .hero h1, .hero h2 { font-size: clamp(37px, 9.5vw, 53px); }
  .hero-copy > p:not(.hero-kicker) { font-size: 14px; line-height: 1.48; }
  .hero-actions { display:flex; flex-direction: row; flex-wrap: wrap; align-items:stretch; gap:8px; }
  .hero-actions .button { flex: 1 1 145px; min-height: 41px; padding: 9px 12px; font-size: 12px; }
  .hero-actions .dmxe-store-button { font-size: 12px!important; }
  .hero-controls { height: 58px; }
  .hero-arrows button { width: 37px; height: 37px; }
  .trust-item { min-height: 66px; padding: 10px; }
  .trust-grid, .dmxe-four-trust { grid-template-columns: repeat(2,minmax(0,1fr))!important; }
  .story-image { height: clamp(250px, 70vw, 420px); }
  .story-copy { padding: 28px 19px; }
  .story-copy h2 { font-size: 34px; }
  .story-copy ul { margin-block: 14px 20px; }
  .updates-section { padding-block: 32px; }
  .updates-inner > div:last-child { min-width: 0; width: 100%; }
  .footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 14px; }
  .footer-grid > * { overflow-wrap:anywhere; }
  .site-footer { padding-top: 32px; }
}
@media (max-width: 480px) {
  .site-header-v6 .brand-header.dmxe-native-logo .brand-mark,
  .site-header-v6 .brand-header.dmxe-wordmark .brand-mark { flex-shrink: 0; }
  .site-header-v6 .header-actions > .icon-button { width: 33px; min-width: 33px; }
  .site-header-v6 .currency-control select { width: 59px; }
  .hero-content { padding-bottom: 78px; }
  .hero h1, .hero h2 { font-size: clamp(35px, 10vw, 45px); }
  .hero-actions .button { flex-basis: calc(50% - 4px); }
  .hero-actions .button:last-child:nth-child(odd) { flex-basis: 100%; }
  .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 8px; }
  .product-name { font-size: 16px; }
  .product-price { font-size: 14px; }
  .trust-grid, .dmxe-four-trust { grid-template-columns: 1fr!important; }
  .story-image { height: 280px; }
  .footer-grid { grid-template-columns: 1fr; gap: 23px; }
  .footer-bottom { gap: 8px; }
  .floating-whatsapp { right: 14px; }
  [dir="rtl"] .floating-whatsapp { left: 14px; right:auto; }
  .chat-launcher { right: 14px; }
  [dir="rtl"] .chat-launcher { left:14px; right:auto; }
  .dmxe-wa-dialog { width: 100%; }
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: max(16px, 1em); }
}
@media (max-width: 360px) {
  .site-header-v6 .brand-header.dmxe-native-logo .brand-copy strong { font-size: 14px!important; }
  .site-header-v6 .header-actions > .icon-button { width: 30px; min-width:30px; }
  .hero h1, .hero h2 { font-size: 34px; }
  .hero-actions .button { flex-basis: 100%; }
  .product-grid { grid-template-columns: 1fr; }
}
@media (max-height: 680px) and (min-width: 761px) {
  .site-header-v6 + main .hero, main .hero { height: clamp(400px, calc(100vh - 130px), 550px); }
  .hero-content { padding-block: 20px 72px; }
  .hero h1, .hero h2 { font-size: clamp(41px, 4.4vw, 61px); }
}
@media (prefers-reduced-motion:reduce) { .hero-slide.active > img { animation: none; } }
/* Narrow-phone header/select edge cases. */
.shop-heading,.shop-tools,.sort-control { min-width:0; }
.shop-tools { display:flex; flex-wrap:wrap; gap:8px; }
.shop-tools > * { flex:1 1 118px; min-width:0; }
.sort-control select { max-width:100%; width:100%; min-width:0; }
@supports (overflow:clip) { html, body { overflow-x:clip; } }
