/* Allow editable content to wrap without pushing the viewport sideways. */
.container > .row > *, .feature-chips > *, .rating-summary > *, .success-message, .success-product-details { min-width: 0; }
.hero h1, .section-title, .section-copy, .feature-chip, .review-text, .success-message, .success-product-details, .menu-card, .faq-section, footer { overflow-wrap: anywhere; }
.hero h1, .section-title { text-wrap: balance; }
.price-highlight, .rating-summary { flex-wrap: wrap; }
.rating-summary { gap: 16px; }
.mini-proof { max-width: calc(100% - 24px); white-space: normal; }
.btn { white-space: normal; }
.success-close { width: 44px; height: 44px; z-index: 4; }
.success-phone { max-width: 100%; overflow-wrap: anywhere; }
.success-dismiss { max-width: calc(100% - 32px); }
.video-review-track, .review-track { max-width: 100%; }
@media(max-width:767px) {
  body { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  .container { max-width: 100%; padding-inline: 12px; }
  main, main > section, [data-section] { max-width: 100%; }
  .hero .price-highlight { justify-content: center; gap: 10px !important; }
  .hero .feature-chip { white-space: normal; max-width: 100%; }
  .order-form .form-control { font-size: max(16px, 1rem); }
  .mobile-order-bar { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .mobile-order-bar .btn { line-height: 1.4; }
  .floating-actions { right: max(12px, env(safe-area-inset-right)); bottom: calc(94px + env(safe-area-inset-bottom)); }
  .deal-box .d-flex { flex-wrap: wrap; }
  .section-pad { padding-block: 56px; }
  .success-product-details .btn { min-height: 44px; }
  .product-option {
    grid-template-columns: 20px 58px minmax(0, 1fr) auto;
    gap: 10px;
    min-height: 116px;
    padding: 12px;
  }
  .product-option img { width: 58px; height: 58px; }
  .product-name { min-width: 0; font-size: .94rem; line-height: 1.45; overflow-wrap: anywhere; }
  .product-quantity { grid-column: 2 / 4; justify-self: start; }
  .product-price { grid-column: 4; grid-row: 1 / 3; min-width: 0; font-size: .92rem; }
  .product-tag { max-width: 94px; text-align: center; white-space: normal; }
  .selected-product-summary { grid-template-columns: 62px minmax(0, 1fr) auto; gap: 10px; padding: 12px; }
  .selected-product-summary img { width: 62px; height: 62px; }
  .selected-product-summary strong { font-size: .96rem; overflow-wrap: anywhere; }
  .selected-product-summary > b { font-size: 1.05rem; }
  .delivery-options { grid-template-columns: 1fr; }
  .order-info, .order-form { padding: 24px 18px; }
  .order-shell { border-radius: 20px; }
  .package-comparison-grid, .care-usage-grid { min-width: 0; }
}
@media(max-width:359px) {
  .product-option { grid-template-columns: 18px 52px minmax(0, 1fr); }
  .product-option img { width: 52px; height: 52px; }
  .product-price { grid-column: 2 / 4; grid-row: 2; align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
  .product-quantity { grid-column: 2 / 4; grid-row: 3; }
  .selected-product-summary { grid-template-columns: 54px minmax(0, 1fr); }
  .selected-product-summary img { width: 54px; height: 54px; }
  .selected-product-summary > b { grid-column: 2; justify-self: start; }
  .mobile-order-bar { gap: 8px; padding-inline: 8px; }
  .mobile-whatsapp-button { width: 48px; height: 48px; flex-basis: 48px; }
  .mobile-order-cta { min-width: 0; min-height: 48px; padding-inline: 10px; font-size: .94rem; }
}
@media(min-width:768px) { body { padding-bottom: 0; } }
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .hero-burger, .hero-ring { animation: none; }
  .btn { transition: none; }
}

/* Readable Bengali copy and comfortable line spacing on phones. */
@media(max-width:767px) {
  body { font-size:max(16px, 1rem); line-height:1.75; }
  .hero h1, .section-title { line-height:1.45; letter-spacing:0; word-break:normal; }
  .section-copy, .review-text, .menu-card p, .benefit-card p, .accordion-body {
    font-size:max(16px, 1rem); line-height:1.85;
  }
  .hero .section-copy.hero-readable-text {
    max-width:38ch; padding:14px 16px; border-radius:12px;
    background:rgba(255,255,255,.96); color:#29231f!important;
    font-size:max(17px, 1.0625rem); font-weight:500; line-height:1.9;
  }
  .hero .hero-readable-text.small { font-size:max(14px, .9rem); line-height:1.8; }
  .hero .feature-chip { font-size:max(14px, .9rem); line-height:1.7; padding:9px 12px; }
  .hero .offer-badge, .hero .price-highlight .badge { font-size:max(14px, .875rem); line-height:1.6; }
  .order-form label { font-size:max(16px, 1rem); line-height:1.7; }
  .order-form .form-control { line-height:1.7; }
  .btn-order { font-size:max(17px, 1.0625rem); line-height:1.6; }
}

/* Shared hover, keyboard focus and touch feedback for frontend buttons. */
:is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone) {
  transition: background-color .2s ease, color .2s ease, border-color .2s ease,
    box-shadow .2s ease, filter .2s ease, transform .28s cubic-bezier(.2,.8,.2,1), scale .15s ease;
}
@media (hover:hover) and (pointer:fine) {
  :is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone):not(:disabled):not(.disabled):not([aria-disabled="true"]):hover {
    filter: brightness(.92);
    box-shadow: 0 6px 18px rgba(70, 35, 10, .2);
    cursor: pointer;
  }
}
:is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone):not(:disabled):not(.disabled):not([aria-disabled="true"]):focus-visible {
  outline: 3px solid var(--orange-dark, #c84f00);
  outline-offset: 4px;
  box-shadow: 0 0 0 6px #fff;
}
:is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone):not(:disabled):not(.disabled):not([aria-disabled="true"]):active {
  scale: .97;
  filter: brightness(.88);
}
@media (prefers-reduced-motion:reduce) {
  :is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone) {
    transition: none;
  }
  :is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone):active {
    scale: none;
  }
}

/* Animate mouse hover while respecting reduced-motion preferences. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  :is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone):not(:disabled):not(.disabled):not([aria-disabled="true"]):hover {
    transform: translateY(-3px) scale(1.035);
  }
  :is(button, input[type="button"], input[type="submit"], .btn, .btn-light-cta, .float-btn, .success-phone):not(:disabled):not(.disabled):not([aria-disabled="true"]):active {
    transform: translateY(0);
  }
}
