/* Affiliate CMS Pro V23.9.8 — Fluid Responsive Layout
   Viewport scaling is handled component-by-component instead of shrinking the whole page.
   This prevents text blur, clipped links and overlapping cards on real mobile devices. */

:root{
  --fluid-gutter:clamp(10px,3vw,32px);
  --fluid-gap:clamp(10px,1.8vw,20px);
  --fluid-section-gap:clamp(16px,2.8vw,30px);
  --fluid-card-pad:clamp(12px,2vw,20px);
  --fluid-radius:clamp(14px,1.8vw,22px);
  --fluid-control:clamp(44px,5vw,48px);
  --fluid-body:clamp(14px,1.1vw,16px);
}

html{overflow-x:clip!important;scroll-padding-top:clamp(70px,8vw,96px)}
body.site-body{min-width:0!important;overflow-x:clip!important;font-size:var(--fluid-body)}
body.site-body *,body.site-body *::before,body.site-body *::after{min-width:0}
body.site-body img,body.site-body svg,body.site-body video,body.site-body canvas,body.site-body iframe{display:block;max-width:100%;height:auto}
body.site-body p,body.site-body h1,body.site-body h2,body.site-body h3,body.site-body h4,body.site-body a,body.site-body span,body.site-body strong{overflow-wrap:anywhere}

/* One consistent page width. No negative viewport-width calculations. */
body.site-body .container,
body.site-body.layout-wide .container,
body.site-body .page-shell,
body.site-body .page-shell-v18{
  width:min(var(--content-width,1180px),calc(100% - (var(--fluid-gutter) * 2) - env(safe-area-inset-left) - env(safe-area-inset-right)))!important;
  max-width:100%!important;
  margin-inline:auto!important;
}

/* Fluid public header */
body.site-body .nav{gap:clamp(10px,2vw,22px);min-height:clamp(62px,7vw,76px)}
body.site-body .brand{font-size:clamp(17px,1.7vw,23px);line-height:1.15}
body.site-body .public-nav-v2392{gap:clamp(7px,1.3vw,18px)}
body.site-body .public-nav-v2392 a{font-size:clamp(12px,1vw,14px)}

/* Fluid hero and section rhythm */
body.site-body .hero,
body.site-body .hero-v18,
body.site-body .review-hero-v19,
body.site-body .article-hero-v19{padding-block:clamp(28px,5vw,60px)}
body.site-body .hero h1,
body.site-body .hero-v18 h1{font-size:clamp(28px,6.2vw,62px);line-height:1.04;max-width:18ch}
body.site-body .hero p,
body.site-body .hero-v18 p{font-size:clamp(14px,1.4vw,18px);line-height:1.6;max-width:72ch}
body.site-body .badge{font-size:clamp(11px,.9vw,13px);padding:clamp(6px,.8vw,8px) clamp(9px,1.1vw,12px)}
body.site-body .section-heading-v18{gap:var(--fluid-gap);margin-block:var(--fluid-section-gap) clamp(10px,1.5vw,16px)}
body.site-body .section-heading-v18 h2{font-size:clamp(21px,3vw,32px);line-height:1.15}
body.site-body .section-heading-v18 small{font-size:clamp(11px,.9vw,13px)}

/* Main layout scales side columns instead of forcing fixed 230px widths. */
body.site-body .page-shell-v18{
  display:grid;
  gap:var(--fluid-gap)!important;
  align-items:start;
  margin-top:clamp(16px,2.5vw,30px)!important;
  margin-bottom:clamp(28px,4vw,50px)!important;
}
body.site-body .page-shell-v18.has-both-ads{
  grid-template-columns:minmax(160px,.24fr) minmax(0,1fr) minmax(160px,.24fr)!important;
}
body.site-body .page-shell-v18.has-one-ad{
  grid-template-columns:minmax(170px,.25fr) minmax(0,1fr)!important;
}
body.site-body .page-shell-v18.has-no-ads{grid-template-columns:minmax(0,1fr)!important}
body.site-body .main-content-v18{width:100%;container-type:inline-size;container-name:maincontent}
body.site-body .ad-column{top:clamp(78px,8vw,96px)}
body.site-body .ad-column h3{font-size:clamp(14px,1.25vw,18px)}

/* Banner media always keeps its natural ratio and never spills out of the card. */
body.site-body .ad-card,
body.site-body .top-banner,
body.site-body .mobile-banner-zone-v2397,
body.site-body .site-card-v18{border-radius:var(--fluid-radius)}
body.site-body .ad-card.ad-card-image-only,
body.site-body .top-banner.top-banner-image-only{width:100%!important;height:auto!important;aspect-ratio:auto!important;padding:0!important;overflow:hidden!important}
body.site-body .ad-card.ad-card-image-only img,
body.site-body .top-banner.top-banner-image-only img,
body.site-body .mobile-banner-zone-v2397 .ad-card.ad-card-image-only img{
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  margin:0!important;
}
body.site-body .top-banners{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))!important;
  gap:var(--fluid-gap)!important;
  margin-block:clamp(14px,2.2vw,24px)!important;
}
body.site-body .top-banner:not(.top-banner-image-only){padding:var(--fluid-card-pad);gap:var(--fluid-gap);flex-wrap:wrap}

/* Mobile/tablet side banner copies use a wrapping grid, never a viewport-wide slider. */
@media (max-width:1180px){
  body.site-body .page-shell-v18,
  body.site-body .page-shell-v18.has-no-ads,
  body.site-body .page-shell-v18.has-one-ad,
  body.site-body .page-shell-v18.has-both-ads{grid-template-columns:minmax(0,1fr)!important}
  body.site-body .desktop-banner-column-v2397{display:none!important}
  body.site-body .mobile-banner-zone-v2397{
    display:block!important;
    width:100%!important;
    margin-block:clamp(13px,2.3vw,22px)!important;
    padding:clamp(10px,1.8vw,16px)!important;
  }
  body.site-body .mobile-banner-track-v2397{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))!important;
    gap:var(--fluid-gap)!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }
  body.site-body .mobile-banner-zone-v2397 .ad-card{
    display:flex;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    margin:0!important;
    flex:initial!important;
  }
  body.site-body .mobile-banner-zone-v2397 .ad-card:not(.ad-card-image-only){padding:var(--fluid-card-pad);min-height:clamp(150px,22vw,190px)!important}
  body.site-body .banner-zone-heading-v2397 small{display:none!important}
}

/* Category chips wrap to the next line, so none are cut off or laid over content. */
body.site-body .site-filter-tabs-v239{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:clamp(6px,1vw,9px)!important;
  width:100%!important;
  margin:0 0 clamp(8px,1.3vw,14px)!important;
  padding:0!important;
  overflow:visible!important;
  scroll-snap-type:none!important;
}
body.site-body .site-filter-tab-v239{
  flex:0 1 auto!important;
  min-height:var(--fluid-control);
  padding:clamp(8px,1vw,10px) clamp(10px,1.3vw,14px);
  font-size:clamp(11px,.95vw,13px);
  white-space:normal;
  text-align:center;
}

/* Search adapts cleanly without negative margins. */
body.site-body .compact-search,
body.site-body .compact-search-v18{width:100%!important;margin-bottom:clamp(10px,1.6vw,16px)}
body.site-body .compact-search-box{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto auto!important;
  gap:clamp(4px,.7vw,8px)!important;
  width:100%!important;
  min-height:var(--fluid-control);
  padding:5px 6px 5px clamp(10px,1.2vw,14px)!important;
}
body.site-body .compact-search-input{width:100%!important;min-width:0!important;font-size:16px!important}
body.site-body .compact-search-btn,
body.site-body .compact-search-clear{min-height:clamp(38px,4vw,44px);padding-inline:clamp(10px,1.4vw,18px)!important;white-space:nowrap}

/* Cards respond to the width of the center column, not only the device viewport. */
body.site-body .site-grid-v18.view-cards{
  display:grid!important;
  grid-template-columns:repeat(var(--cms-cols,3),minmax(0,1fr))!important;
  gap:var(--fluid-gap)!important;
}
body.site-body .site-card-v18{width:100%!important;max-width:100%!important;padding:var(--fluid-card-pad)}
body.site-body .site-card-head-v18{gap:clamp(9px,1.2vw,14px)}
body.site-body .logo-wrap-v18{width:clamp(50px,5vw,64px);height:clamp(50px,5vw,64px);flex-basis:clamp(50px,5vw,64px)}
body.site-body .site-card-title-v18 h3{font-size:clamp(17px,1.7vw,21px);line-height:1.2}
body.site-body .site-summary-v18{font-size:clamp(13px,1vw,15px);line-height:1.55}
body.site-body .bonus-box-v18{gap:8px;flex-wrap:wrap;padding:clamp(9px,1.2vw,13px)}
body.site-body .bonus-box-v18 strong{max-width:100%!important;font-size:clamp(15px,1.45vw,19px);white-space:normal!important;text-align:left!important}
body.site-body .site-meta-v18,
body.site-body .site-actions-v18{grid-template-columns:repeat(auto-fit,minmax(min(100%,120px),1fr))!important;gap:clamp(7px,1vw,10px)}
body.site-body .site-actions-v18 .btn{width:100%;min-height:var(--fluid-control);padding:clamp(9px,1vw,12px)}
body.site-body .site-grid-v18.view-list .site-card-v18{grid-template-columns:minmax(210px,.9fr) minmax(0,1.1fr)!important}
body.site-body .site-grid-v18.view-list .site-list-banner-v21 img{width:100%;height:100%;min-height:0;aspect-ratio:3/1;object-fit:cover}

@container maincontent (max-width:920px){
  body.site-body .site-grid-v18.view-cards{--cms-cols:2!important}
  body.site-body .site-grid-v18.view-list .site-card-v18{grid-template-columns:1fr!important}
  body.site-body .site-grid-v18.view-list .site-list-banner-v21 img{height:auto!important}
}
@container maincontent (max-width:540px){
  body.site-body .site-grid-v18.view-cards{--cms-cols:1!important}
  body.site-body .site-card-title-v18{display:flex!important}
  body.site-body .site-meta-v18,
  body.site-body .site-actions-v18{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Review, article and generic public grids use fluid columns. */
body.site-body .cards,
body.site-body .article-grid,
body.site-body .blog-grid-v19,
body.site-body .related-grid-v19,
body.site-body .quick-lists-v18{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))!important;
  gap:var(--fluid-gap)!important;
}
body.site-body .review-layout-v19{grid-template-columns:minmax(0,1fr) minmax(250px,30%)!important;gap:var(--fluid-gap)}
body.site-body .article-layout-v19{grid-template-columns:minmax(180px,240px) minmax(0,820px)!important;gap:var(--fluid-section-gap)}
body.site-body .article-content,
body.site-body .premium-content-v19,
body.site-body .sticky-card-v19{padding:clamp(15px,2.4vw,28px)}
body.site-body .article-content table,
body.site-body .premium-content-v19 table,
body.site-body .table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

@media (max-width:980px){
  body.site-body .review-layout-v19,
  body.site-body .article-layout-v19{grid-template-columns:minmax(0,1fr)!important}
}

@media (max-width:760px){
  :root{--fluid-gutter:clamp(10px,3.6vw,16px);--fluid-gap:clamp(9px,2.8vw,14px)}
  body.site-body .topbar .nav{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;padding-block:8px!important}
  body.site-body .public-nav-v2392{width:100%;grid-column:1/-1;margin:0!important;padding:6px 0 2px!important}
  body.site-body .public-nav-v2392 a{width:100%;min-height:var(--fluid-control);padding:10px 12px!important}
  body.site-body .hero,body.site-body .hero-v18{border-radius:0 0 var(--fluid-radius) var(--fluid-radius)}
  body.site-body .hero h1,body.site-body .hero-v18 h1{font-size:clamp(27px,9vw,39px)}

  body.site-body .mobile-banner-track-v2397{grid-template-columns:1fr!important}
  body.site-body .mobile-banner-zone-v2397 .ad-card{width:100%!important}
  body.site-body .banner-zone-heading-v2397{align-items:flex-start;flex-wrap:wrap}

  body.site-body .site-filter-tab-v239{flex:1 1 max-content!important;justify-content:center}
  body.site-body .site-card-v18{box-shadow:0 8px 24px rgba(15,23,42,.07)}
  body.site-body .site-grid-v18.view-list .site-card-v18{display:grid!important;padding:0!important}
  body.site-body .site-grid-v18.view-list .site-content-v21{padding:var(--fluid-card-pad)!important}

  body.site-body .review-hero-inner-v19{grid-template-columns:clamp(58px,18vw,76px) minmax(0,1fr)!important}
  body.site-body .review-hero-cta-v19{grid-column:1/-1;width:100%}
  body.site-body .pros-cons-v19{grid-template-columns:1fr!important}
  body.site-body .footer{padding-block:clamp(24px,6vw,34px)}
}

@media (max-width:430px){
  body.site-body .section-heading-v18{display:flex!important;align-items:flex-start!important;flex-wrap:wrap}
  body.site-body .section-heading-v18>div{flex:1 1 220px}
  body.site-body .compact-search-box{grid-template-columns:auto minmax(0,1fr)!important;padding:7px 8px!important}
  body.site-body .compact-search-btn{grid-column:1/-1!important;width:100%!important}
  body.site-body .compact-search-clear{grid-column:1/-1!important;justify-self:center!important}
  body.site-body .site-filter-tab-v239{flex:1 1 calc(50% - 6px)!important;min-width:0!important}
  body.site-body .site-meta-v18,
  body.site-body .site-actions-v18{grid-template-columns:1fr!important}
  body.site-body .site-card-title-v18{display:block!important}
  body.site-body .score-v18{text-align:left!important;margin-top:6px!important}
  body.site-body .top-banner:not(.top-banner-image-only){display:grid!important;grid-template-columns:1fr!important}
  body.site-body .top-banner .btn{width:100%}
}

/* Fallback for browsers without container queries. */
@supports not (container-type:inline-size){
  @media (max-width:980px){body.site-body .site-grid-v18.view-cards{--cms-cols:2!important}}
  @media (max-width:650px){body.site-body .site-grid-v18.view-cards{--cms-cols:1!important}}
}

@media (hover:none) and (pointer:coarse){
  body.site-body .site-card-v18:hover,
  body.site-body .site-filter-tab-v239:hover{transform:none!important}
}
