/* BoyInsure — Responsive (mobile, tablet, iPad) */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.article-read__hero img,
.plan-detail__media img,
.highlights__player > img,
.product-item__media img {
  max-width: 100%;
}

/* ── Fluid spacing tokens ── */
@media (max-width: 1024px) {
  :root {
    --site-inner: min(var(--site-max), calc(100% - 40px));
  }
}

@media (max-width: 768px) {
  :root {
    --site-inner: min(var(--site-max), calc(100% - 32px));
    --text-base: 1.0625rem;
  }
}

@media (max-width: 480px) {
  :root {
    --site-inner: min(var(--site-max), calc(100% - 24px));
  }
}

/* ── Navbar: hamburger from tablet / iPad portrait ── */
@media (max-width: 991px) {
  .site-header {
    position: sticky;
    top: 0;
    --site-header-height: 72px;
  }

  .navbar {
    flex-wrap: nowrap;
    position: relative;
    padding: 14px 0;
    gap: 12px;
  }

  .navbar__brand {
    min-width: 0;
    flex: 1 1 auto;
  }

  .navbar__name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .navbar__toggle {
    margin-left: auto;
    flex-shrink: 0;
  }

  .btn-login {
    display: none;
  }

  .navbar__actions {
    display: none;
  }

  .navbar__menu-auth {
    display: list-item;
  }

  .navbar__menu-auth.is-auth-hidden,
  .navbar__menu-auth[hidden] {
    display: none !important;
  }

  .navbar__menu-auth + .navbar__menu-auth {
    margin-top: 4px;
  }

  .navbar__menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 300;
    background: #fff;
    flex-direction: column;
    align-items: stretch;
    padding: 12px 16px 16px;
    gap: 4px;
    border: 1px solid rgba(10, 45, 110, .1);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(10, 45, 110, .14);
    max-height: min(70vh, 420px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .navbar__menu.open {
    display: flex;
  }

  .navbar__menu a {
    display: block;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 1rem;
    min-height: 44px;
    line-height: 1.35;
  }

  .navbar__menu a::after {
    display: none;
  }

  .navbar__menu a:hover,
  .navbar__menu a.active {
    background: rgba(10, 45, 110, .06);
  }

  .navbar__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 10px;
    border-radius: 10px;
    transition: background .2s;
  }

  .navbar__toggle:hover,
  .navbar__toggle:focus-visible {
    background: rgba(10, 45, 110, .06);
  }

  .navbar__toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .navbar__toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }

  .navbar__toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .navbar__toggle span {
    transition: transform .2s, opacity .2s;
  }

  .dev-mode {
    display: none !important;
  }

}

/* ── Floating contact buttons (all viewports) ── */
.contact-fab {
  position: fixed;
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 850;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  pointer-events: none;
}

body.has-plan-sticky .contact-fab {
  bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}

.contact-fab__backdrop {
  position: fixed;
  inset: 0;
  z-index: -1;
  background: rgba(10, 45, 110, .28);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .28s ease, visibility .28s ease;
  backdrop-filter: blur(2px);
}

.contact-fab.is-open .contact-fab__backdrop {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.contact-fab__menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  pointer-events: none;
}

.contact-fab__menu .contact-fab__btn {
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px) scale(0.55);
  transition:
    opacity .26s ease,
    transform .34s cubic-bezier(.34, 1.45, .64, 1),
    visibility 0s linear .34s;
  transition-delay: calc((4 - var(--i, 0)) * 45ms);
}

.contact-fab.is-open .contact-fab__menu {
  pointer-events: auto;
}

.contact-fab.is-open .contact-fab__menu .contact-fab__btn {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  transition-delay: calc(var(--i, 0) * 55ms + 30ms);
}

.contact-fab__toggle {
  pointer-events: auto;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 2px solid rgba(255, 255, 255, .95);
  border-radius: 50%;
  background: linear-gradient(145deg, var(--blue-bright) 0%, var(--blue-mid) 100%);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(26, 79, 160, .35);
  animation: contactFabPulse 2.8s ease-in-out infinite;
  transition: transform .25s cubic-bezier(.34, 1.4, .64, 1), box-shadow .25s ease, background .25s ease;
}

.contact-fab.is-open .contact-fab__toggle {
  animation: none;
  transform: rotate(0deg);
  background: linear-gradient(145deg, #0a2d6e 0%, #1a4fa0 100%);
  box-shadow: 0 4px 16px rgba(10, 45, 110, .28);
}

.contact-fab__toggle:active {
  transform: scale(.94);
}

.contact-fab__toggle-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity .22s ease, transform .28s cubic-bezier(.34, 1.4, .64, 1);
}

.contact-fab__toggle-icon svg {
  width: 22px;
  height: 22px;
  display: block;
}

.contact-fab__toggle-icon--open {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

.contact-fab__toggle-icon--close {
  opacity: 0;
  transform: rotate(-90deg) scale(0.5);
}

.contact-fab.is-open .contact-fab__toggle-icon--open {
  opacity: 0;
  transform: rotate(90deg) scale(0.5);
}

.contact-fab.is-open .contact-fab__toggle-icon--close {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

@keyframes contactFabPulse {
  0%, 100% {
    box-shadow: 0 6px 20px rgba(26, 79, 160, .35);
  }
  50% {
    box-shadow:
      0 8px 26px rgba(26, 79, 160, .45),
      0 0 0 10px rgba(26, 79, 160, .1);
  }
}

.contact-fab__btn {
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  border: 2px solid rgba(255, 255, 255, .92);
  box-shadow: 0 4px 14px rgba(10, 45, 110, .18);
  transition: transform .2s ease, box-shadow .2s ease;
}

.contact-fab__btn svg {
  width: 20px;
  height: 20px;
  display: block;
  flex-shrink: 0;
}

.contact-fab__btn:active {
  transform: scale(.92);
}

.contact-fab__btn--phone {
  background: #16a34a;
}

.contact-fab__btn--facebook {
  background: #1877f2;
}

.contact-fab__btn--tiktok {
  background: #111;
}

.contact-fab__btn--line {
  background: #06c755;
}

.contact-fab__btn--line svg {
  width: 24px;
  height: 24px;
}

.contact-fab__btn--contact {
  background: var(--blue-bright);
}

@media (min-width: 992px) {
  .contact-fab {
    right: max(24px, env(safe-area-inset-right, 0px));
    bottom: calc(28px + env(safe-area-inset-bottom, 0px));
  }

  .contact-fab__toggle:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(26, 79, 160, .4);
  }

  .contact-fab.is-open .contact-fab__toggle:hover {
    transform: translateY(-2px);
  }

  .contact-fab__btn:hover {
    transform: translateY(-2px) scale(1.04);
    box-shadow: 0 6px 18px rgba(10, 45, 110, .22);
  }
}

@media (prefers-reduced-motion: reduce) {
  .contact-fab__toggle {
    animation: none;
  }

  .contact-fab__menu .contact-fab__btn,
  .contact-fab.is-open .contact-fab__menu .contact-fab__btn {
    transition-duration: .01ms;
    transition-delay: 0ms;
    transform: none;
  }
}

body.nav-open {
  overflow: hidden;
}

/* ── iPad & tablet (769px – 1024px) ── */
@media (min-width: 769px) and (max-width: 1024px) {
  .home-hero__slides {
    aspect-ratio: 16 / 9;
    min-height: 300px;
    max-height: 440px;
  }

  .home-hero__content {
    max-width: min(520px, 58vw);
  }

  .highlights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
  }

  .highlights__content {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .highlights__clips {
    display: contents;
  }

  .highlights__media {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    max-width: none;
    margin: 0;
    align-self: start;
    height: auto;
  }

  .highlights__side {
    grid-column: 2;
    grid-row: auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
  }

  .highlights__video {
    grid-column: auto;
    grid-row: auto;
    width: 100%;
    max-width: none;
    margin: 0;
    align-self: start;
    height: auto;
  }

  .highlights__aside {
    grid-column: auto;
    grid-row: auto;
    width: 100%;
  }

  .highlights__caption {
    max-width: none;
    margin: 0 0 14px;
  }

  .highlights__more {
    width: auto;
  }

  .insurance-plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .article-catalog-card__media img,
  .insurance-plan-card__media img {
    height: auto;
  }

  .plan-detail__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-footer__inner {
    grid-template-columns: 1fr 1fr;
    gap: 32px 24px;
  }

  .site-footer__brand {
    grid-column: 1 / -1;
  }

  .site-footer__col--contact {
    grid-column: 1 / -1;
    width: 100%;
  }

  .activity-promo {
    padding: 32px;
    gap: 28px;
  }

  .contact-grid {
    gap: 28px;
  }
}

/* ── Tablet portrait & large phones (≤768px) ── */
@media (max-width: 768px) {
  .page-main {
    min-height: calc(100vh - 64px);
  }

  .site-section {
    padding: 48px 0;
  }

  .section-head {
    margin-bottom: 32px;
  }

  .section-head p {
    font-size: 1rem;
  }

  /* Home hero */
  .home-hero__slides {
    aspect-ratio: 4 / 3;
    min-height: 240px;
    max-height: 380px;
  }

  .home-hero__inner {
    align-self: end;
    padding: 20px 0 52px;
  }

  .home-hero__content {
    max-width: 100%;
    padding-right: 0;
  }

  .home-hero__shade {
    background: linear-gradient(
      180deg,
      rgba(245, 249, 255, .15) 0%,
      rgba(245, 249, 255, .88) 42%,
      rgba(245, 249, 255, .97) 72%,
      rgba(245, 249, 255, .98) 100%
    );
  }

  .home-hero__dots {
    flex-direction: row;
    align-self: end;
    justify-self: center;
    margin-right: 0;
    margin-bottom: 14px;
    gap: 8px;
  }

  .home-hero__dot {
    width: 9px;
    height: 9px;
  }

  .home-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .home-hero__actions .btn {
    width: 100%;
    justify-content: center;
    min-height: 48px;
  }

  /* Page heroes */
  .page-hero {
    padding: 44px 0 36px;
  }

  .page-hero--photo {
    min-height: 260px;
    background-position: 70% center;
  }

  .page-hero--photo::after {
    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, .82) 0%,
      rgba(0, 0, 0, .72) 50%,
      rgba(0, 0, 0, .55) 100%
    );
  }

  /* Grids — 2 columns on mobile */
  .product-grid,
  .feature-grid,
  .plan-grid,
  .insurance-plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .article-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
  }

  /* Articles catalog page — mobile */
  .articles-catalog {
    padding-top: 32px;
    padding-bottom: 44px;
  }

  .articles-catalog .insurance-catalog__layout {
    gap: 20px;
  }

  .articles-catalog .insurance-catalog__head {
    margin-bottom: 18px;
  }

  .articles-catalog .insurance-catalog__head h2 {
    font-size: clamp(1.2rem, 5vw, 1.45rem);
  }

  .articles-catalog .insurance-catalog__head p {
    font-size: .9rem;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .articles-catalog .insurance-catalog__badge {
    font-size: .75rem;
    margin-bottom: 10px;
  }

  .articles-catalog .article-catalog-card__category {
    display: none;
  }

  .article-catalog-card__media {
    border-radius: 12px;
    margin-bottom: 8px;
    aspect-ratio: 4 / 3;
  }

  .article-catalog-card__badge {
    top: 8px;
    left: 8px;
    padding: 4px 8px;
    font-size: .65rem;
  }

  .article-catalog-card__category {
    font-size: .75rem;
    margin-bottom: 4px;
  }

  .article-catalog-card__title,
  .article-catalog-card__body h3 {
    font-size: .88rem;
    line-height: 1.35;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .article-catalog-card__meta {
    font-size: .68rem;
    margin-bottom: 0;
    line-height: 1.35;
  }

  .articles-catalog .article-catalog-card__excerpt {
    display: none;
  }

  .article-catalog-card__excerpt {
    font-size: .75rem;
    line-height: 1.45;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Home news promo cards — keep overlay layout, not catalog grid rules */
  #homeNewsEvents .article-catalog-card__media {
    aspect-ratio: auto;
    margin-bottom: 0;
    border-radius: 0;
  }
  #homeNewsEvents .article-catalog-card__title,
  #homeNewsEvents .article-catalog-card__body h3 {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }
  #homeNewsEvents .home-news-layout__top .article-catalog-card__media {
    min-height: 400px;
  }
  #homeNewsEvents #homeNewsWheelCard .article-catalog-card__body {
    padding: 18px 16px 20px;
  }
  #homeNewsEvents #homeNewsWheelCard .article-catalog-card__badge {
    top: 16px;
    left: 16px;
    padding: 6px 10px;
    font-size: .72rem;
  }
  #homeNewsEvents #homeNewsWheelCard .article-catalog-card__title {
    font-size: 1.05rem;
    margin-bottom: 6px;
  }
  #homeNewsEvents #homeNewsWheelCard .home-news-countdown__reason {
    font-size: .76rem;
  }
  #homeNewsEvents #homeNewsWheelCard .home-news-countdown__hint {
    font-size: .72rem;
  }
  #homeNewsEvents #homeNewsWheelCard .home-news-countdown__item {
    min-width: 0;
    flex: 1 1 calc(25% - 5px);
    padding: 6px 4px;
  }
  #homeNewsEvents #homeNewsWheelCard .home-news-countdown__item strong {
    font-size: .92rem;
  }
  #homeNewsEvents #homeNewsWheelCard .article-catalog-card__excerpt {
    font-size: .8rem;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  #homeNewsEvents .home-news-car-card .article-catalog-card__media {
    min-height: 300px;
    border-radius: 16px;
  }
  #homeNewsEvents .home-news-car-card .article-catalog-card__media::after {
    background: linear-gradient(
      to top,
      rgba(255, 255, 255, .98) 0%,
      rgba(255, 255, 255, .9) 42%,
      rgba(255, 255, 255, .35) 68%,
      transparent 100%
    );
  }
  #homeNewsEvents .home-news-car-card .article-catalog-card__body {
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    justify-content: flex-end;
    padding: 16px 16px 18px;
  }
  #homeNewsEvents .home-news-car-card .article-catalog-card__badge {
    top: 16px;
    left: 16px;
    padding: 6px 10px;
    font-size: .72rem;
  }
  #homeNewsEvents .home-news-car-card .article-catalog-card__title {
    font-size: 1rem;
    margin-bottom: 6px;
  }
  #homeNewsEvents .home-news-car-card .article-catalog-card__excerpt {
    font-size: .8rem;
    line-height: 1.45;
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }
  #homeNewsEvents .home-news-card__actions--compact {
    width: 100%;
    max-width: none;
    gap: 8px;
  }
  #homeNewsEvents .home-news-card__actions--compact .home-news-card__btn {
    min-height: 44px;
    padding: 9px 8px;
    font-size: .8rem;
    gap: 5px;
    white-space: normal;
    text-align: center;
    line-height: 1.2;
    overflow: hidden;
    margin-top: 0;
  }
  #homeNewsEvents .home-news-card__actions--compact .home-news-card__btn svg {
    width: 15px;
    height: 15px;
  }

  .plan-detail__related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* Compact cards for 2-column mobile (insurance only) */
  .insurance-plan-card__body {
    padding: 12px 10px 14px;
  }

  .insurance-plan-card__body h3 {
    font-size: .88rem;
    line-height: 1.35;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .insurance-plan-card__body > p {
    font-size: .78rem;
    line-height: 1.45;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .insurance-plan-card__features {
    display: none;
  }

  .insurance-plan-card__badge {
    top: 8px;
    left: 8px;
    padding: 3px 8px;
    font-size: .65rem;
  }

  .insurance-plan-card__cta {
    padding: 8px 10px;
    font-size: .75rem;
    width: 100%;
  }

  .insurance-plan-card__cta svg {
    width: 14px;
    height: 14px;
  }

  .feature-card {
    padding: 16px 12px;
  }

  .feature-card__icon {
    width: 36px;
    height: 36px;
    margin-bottom: 10px;
  }

  .feature-card__icon svg {
    width: 18px;
    height: 18px;
  }

  .feature-card h3 {
    font-size: .88rem;
    margin-bottom: 6px;
    line-height: 1.35;
  }

  .feature-card p {
    font-size: .78rem;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .plan-card {
    padding: 18px 14px;
  }

  .plan-card h3 {
    font-size: .95rem;
  }

  .product-item h3 {
    font-size: .9rem;
  }

  .product-item p {
    font-size: .78rem;
  }

  .product-item__body {
    padding: 12px 10px 14px;
  }

  .about-highlight {
    padding: 28px 24px;
  }

  .activity-promo {
    padding: 28px 24px;
    gap: 24px;
  }

  .activity-promo__visual {
    max-height: 220px;
    font-size: 3.5rem;
  }

  /* CTA & buttons */
  .cta-banner {
    padding: 44px 0;
  }

  .cta-banner__actions {
    flex-direction: column;
    align-items: stretch;
    padding: 0 8px;
  }

  .cta-banner__actions .btn {
    width: 100%;
    min-height: 48px;
  }

  .plan-detail__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .plan-detail__actions .btn {
    width: 100%;
    min-height: 48px;
    justify-content: center;
  }

  /* Forms — prevent iOS zoom on focus */
  .contact-form input,
  .contact-form textarea,
  .contact-form select {
    font-size: 16px;
    min-height: 48px;
  }

  .contact-form textarea {
    min-height: 140px;
  }

  .contact-card {
    padding: 22px 20px;
  }

  /* Insurance catalog */
  .insurance-catalog__head h2 {
    font-size: clamp(1.35rem, 5vw, 1.75rem);
  }

  .insurance-sidebar__item {
    min-height: 44px;
    padding: 12px 16px;
  }

  /* Articles */
  .article-read__hero img {
    border-radius: 14px;
  }

  .article-read__takeaways li {
    font-size: .92rem;
  }

  .highlights {
    gap: 12px;
  }

  .highlights__clips {
    gap: 12px 14px;
  }

  .highlights__caption {
    margin: 0 0 12px;
    font-size: .88rem;
  }

  .highlights__more {
    width: 100%;
    min-height: 48px;
  }

  .highlights__play-overlay svg {
    width: 40px;
    height: 40px;
  }

  .highlights__play-overlay--thumb svg {
    width: 32px;
    height: 32px;
  }

  /* Footer */
  .site-footer {
    padding-top: 44px;
  }

  .site-footer__cta {
    width: 100%;
    justify-content: center;
    min-height: 48px;
  }

  .site-footer__legal {
    flex-wrap: wrap;
    gap: 12px 16px;
  }

  /* Plan detail sticky bar */
  body.has-plan-sticky {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }

  .plan-detail-sticky {
    display: flex;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    gap: 10px;
  }

  .plan-detail__panel {
    padding: 22px 18px;
  }

  .plan-detail__facts {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .plan-detail__fact {
    padding: 14px 12px;
  }

  .plan-detail__related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .plan-detail__related-card {
    flex-direction: column;
  }
}

/* ── Small phones (≤480px) ── */
@media (max-width: 480px) {
  .site-section {
    padding: 40px 0;
  }

  .home-hero__slides {
    aspect-ratio: 1 / 1;
    min-height: 220px;
    max-height: 320px;
  }

  .home-hero h1 {
    font-size: clamp(1.45rem, 7vw, 1.85rem);
  }

  .home-hero__checks li {
    font-size: .88rem;
    padding-left: 24px;
  }

  .page-hero h1 {
    font-size: clamp(1.65rem, 7vw, 2rem);
  }

  .page-hero__lead {
    font-size: 1rem;
  }

  .feature-grid,
  .insurance-plan-grid {
    gap: 10px;
  }

  .article-card-grid {
    gap: 10px;
  }

  .article-catalog-card__title,
  .article-catalog-card__body h3 {
    font-size: .82rem;
  }

  .article-catalog-card__excerpt {
    -webkit-line-clamp: 2;
  }

  .insurance-plan-card__body {
    padding: 10px 8px 12px;
  }

  .insurance-plan-card__body h3 {
    font-size: .82rem;
  }

  .insurance-plan-card__media {
    aspect-ratio: 4 / 3;
  }

  .feature-card {
    padding: 14px 10px;
  }

  .feature-card h3 {
    font-size: .82rem;
  }

  .feature-card p {
    -webkit-line-clamp: 2;
  }

  .plan-detail__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .plan-detail__related-card {
    flex-direction: column;
  }

  .plan-detail__related-card img {
    width: 100%;
    max-height: 100px;
  }

  .plan-detail__related-card h3 {
    font-size: .85rem;
  }

  .plan-detail__related-card p {
    font-size: .75rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .review-slider {
    padding: 0 36px;
  }

  .review-slider__nav {
    width: 34px;
    height: 34px;
  }

  .stories-item {
    flex-direction: column;
    align-items: flex-start;
  }

  .stories-item__thumb {
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;
  }

  .plan-detail__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .plan-detail__intro h1 {
    font-size: 1.55rem;
  }

  .article-read__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .highlights__heading {
    font-size: 1.5rem;
    margin-bottom: 20px;
  }

  .about-grid__text p {
    font-size: 1rem;
  }
}

/* ── Promotions page (wheel) ── */
@media (max-width: 991px) {
  .promo-hero__grid {
    gap: 28px;
  }

  .promo-hero__wheel .wheel-showcase {
    --wheel-size: min(360px, calc(100vw - 40px));
    width: min(360px, calc(100vw - 40px));
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  .promo-hero__wheel .wheel-showcase {
    --wheel-size: min(340px, calc(100vw - 32px));
    width: min(340px, calc(100vw - 32px));
    max-width: 100%;
  }

  .promo-steps__item {
    flex: 1 1 calc(50% - 8px);
    max-width: none;
  }

  .promo-trust {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .promo-dashboard__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .winners-list__row {
    flex-wrap: wrap;
    gap: 6px;
  }

  .wheel-panel__actions {
    gap: 10px;
  }

  .wheel-panel__actions .btn {
    min-height: 48px;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .promo-hero__wheel .wheel-showcase {
    --wheel-size: min(400px, calc(100vw - 48px));
  }

  .promo-dashboard__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ── Landscape phones ── */
@media (max-height: 500px) and (orientation: landscape) {
  .page-hero--photo {
    min-height: 200px;
    padding: 32px 0 28px;
  }

  .home-hero__slides {
    max-height: 280px;
    aspect-ratio: 21 / 9;
  }

  .navbar__menu.open {
    max-height: calc(100vh - 80px);
  }
}

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