/* Ania V8.6 - final responsive override loaded after legacy CSS */
:root {
  --v86-page-gap: clamp(14px, 3vw, 42px);
  --v86-header-height: 82px;
}
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}
body { min-width: 0; }
img, svg, video, iframe { max-width: 100%; }
.container {
  width: min(1280px, calc(100% - (var(--v86-page-gap) * 2))) !important;
  max-width: 1280px;
  min-width: 0;
}
main, section, .site-header, .site-footer { min-width: 0; }

/* Header: stable at all desktop widths */
.site-header { width: 100%; }
.header-inner {
  width: 100%;
  min-height: var(--v86-header-height);
  grid-template-columns: minmax(190px, 1fr) auto minmax(150px, 1fr) !important;
  gap: clamp(14px, 2.2vw, 30px) !important;
}
.brand { min-width: 0; max-width: 100%; }
.brand-logo { flex: 0 0 auto; }
.brand-copy { min-width: 0; }
.brand-copy strong {
  display: block;
  max-width: min(280px, 24vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: clamp(17px, 1.7vw, 22px) !important;
}
.main-nav {
  min-width: 0;
  gap: clamp(16px, 2vw, 32px) !important;
  white-space: nowrap;
}
.main-nav a { font-size: clamp(12px, 1.05vw, 15px) !important; }
.header-actions { flex: 0 0 auto; }

/* Hero desktop: image remains fully visible and content scales */
.home-hero-shell { width: 100%; padding: 0 0 clamp(42px, 6vw, 78px) !important; }
.home-hero-frame {
  width: min(100%, 1600px) !important;
  max-width: 1600px !important;
  margin: 0 auto;
  padding-inline: var(--v86-page-gap);
}
.home-hero-slider {
  width: 100%;
  height: clamp(500px, 70vh, 720px) !important;
  min-height: 500px !important;
  max-height: 720px;
  overflow: hidden;
  isolation: isolate;
  background: #17231e;
}
.home-hero-slide { overflow: hidden; }
.home-hero-slide::before {
  inset: -20px !important;
  opacity: .42 !important;
  filter: blur(22px) !important;
}
.home-hero-media {
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  object-fit: var(--hero-image-fit, contain) !important;
  object-position: var(--hero-image-position, center center) !important;
}
.home-hero-slider .home-hero-overlay {
  background: linear-gradient(90deg, rgba(15,25,21,.86) 0%, rgba(15,25,21,.64) 34%, rgba(15,25,21,.20) 62%, rgba(15,25,21,.02) 100%) !important;
}
.home-hero-slider .home-hero-content {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  width: min(54%, 640px) !important;
  max-width: 640px;
  height: 100%;
  max-height: none !important;
  padding: clamp(34px, 6vh, 76px) clamp(24px, 4vw, 62px) !important;
  overflow: visible !important;
}
.home-hero-slider .home-kicker { font-size: clamp(9px, .9vw, 11px) !important; }
.home-hero-slider .home-hero h1 {
  max-width: 10.5ch !important;
  font-size: clamp(38px, 5vw, 76px) !important;
  line-height: .99 !important;
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: balance;
}
.home-hero-slider .home-hero p {
  width: min(100%, 520px);
  max-width: 39ch !important;
  margin: clamp(14px, 2vh, 24px) 0 clamp(16px, 2.5vh, 28px) !important;
  font-size: clamp(12px, 1.05vw, 15px) !important;
  line-height: 1.65 !important;
}
.home-hero-slider .home-button {
  min-height: 40px !important;
  padding: 0 16px !important;
  font-size: 10px !important;
}

/* Cards and grids never overflow */
.home-product-grid, .product-grid, .shop-editorial-grid,
.home-occasion-grid, .home-testimonial-grid, .home-care-grid,
.footer-grid, .checkout-grid, .cart-layout, .product-detail-grid {
  min-width: 0;
}
.home-product-card, .product-card, .home-occasion-card,
.home-testimonial-card, .home-care-item { min-width: 0; }
.home-product-image img, .product-image-wrap img { width: 100%; }
.home-testimonial-card p, .home-care-item p { overflow-wrap: anywhere; }

/* Tablet header/navigation */
@media (max-width: 1040px) {
  .header-inner {
    grid-template-columns: auto 1fr auto !important;
    min-height: 76px;
  }
  .brand-copy strong { max-width: 230px; }
  .nav-toggle { display: block !important; justify-self: end; grid-column: 2; }
  .main-nav {
    position: fixed !important;
    inset: 88px 14px auto !important;
    z-index: 110;
    display: none !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0 !important;
    padding: 14px;
    border: 1px solid rgba(34,52,43,.12);
    border-radius: 16px;
    background: #fffdf9;
    box-shadow: 0 22px 60px rgba(34,52,43,.18);
    white-space: normal;
  }
  .main-nav.open { display: flex !important; }
  .main-nav a { padding: 13px 14px; font-size: 14px !important; }
  .header-actions { grid-column: 3; }
  .home-hero-slider .home-hero-content { width: min(64%, 590px) !important; }
  .home-hero-slider .home-hero h1 { font-size: clamp(36px, 5.8vw, 62px) !important; }
}

/* Mobile/tablet hero: natural-height image + separate text panel, nothing can be cropped */
@media (max-width: 760px) {
  :root { --v86-page-gap: 12px; }
  .announcement-inner { padding-inline: 12px; }
  .announcement-inner a { display: none; }
  .header-inner { min-height: 68px; gap: 10px !important; }
  .brand-copy { display: none !important; }
  .brand-logo { max-width: 105px !important; height: 42px !important; }
  .header-actions { gap: 7px; }
  .header-icon { width: 36px !important; height: 36px !important; }
  .header-actions .header-icon:first-child { display: none; }
  .main-nav { inset: 72px 10px auto !important; }

  .home-hero-frame { padding-inline: 0 !important; }
  .home-hero-slider {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    background: transparent;
  }
  .home-hero-slide {
    position: absolute !important;
    inset: 0;
    display: none;
    height: auto !important;
    min-height: 0 !important;
    background: #17231e;
  }
  .home-hero-slide.is-active {
    position: relative !important;
    inset: auto;
    display: grid !important;
    grid-template-rows: auto auto;
    opacity: 1;
    visibility: visible;
  }
  .home-hero-slide::before { display: none !important; }
  .home-hero-media {
    position: relative !important;
    inset: auto !important;
    grid-row: 1;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #17231e;
  }
  .home-hero-slider .home-hero-overlay { display: none !important; }
  .home-hero-slider .home-hero-content {
    position: relative !important;
    inset: auto !important;
    grid-row: 2;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    padding: 25px 18px 58px !important;
    color: #fff;
    background: #17231e;
  }
  .home-hero-slider .home-hero h1 {
    max-width: 12ch !important;
    font-size: clamp(31px, 10.5vw, 46px) !important;
    line-height: 1.02 !important;
  }
  .home-hero-slider .home-hero p {
    max-width: 44ch !important;
    margin: 14px 0 20px !important;
    font-size: 13px !important;
  }
  .home-hero-controls { right: 12px !important; bottom: 12px !important; }
  .home-hero-arrow { width: 34px !important; height: 34px !important; }

  .home-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 32px 10px !important; }
  .home-occasion-grid, .home-testimonial-grid, .home-care-grid { grid-template-columns: 1fr !important; }
  .home-story-grid, .footer-grid, .checkout-grid, .cart-layout,
  .product-detail-grid, .about-grid, .contact-grid { grid-template-columns: 1fr !important; }
  .home-story-copy { padding: 48px 18px !important; }
  .home-story-image { min-height: 0 !important; }
  .home-story-image img { height: auto !important; }
  .home-section-heading h2 { font-size: clamp(30px, 9vw, 40px) !important; }
}

@media (max-width: 430px) {
  .container { width: calc(100% - 20px) !important; }
  .home-product-grid { grid-template-columns: 1fr !important; }
  .home-hero-slider .home-hero-content { padding-inline: 15px !important; }
  .home-hero-slider .home-hero h1 { font-size: clamp(29px, 10.8vw, 42px) !important; }
  .footer-bottom { align-items: flex-start; }
}
