/* SIMCard Experience v3: responsive hardening + editorial SEO content.
   Loaded after app.css, brand-refresh.css, site-polish.css and experience-v2.css. */
:root {
  --exp-content-width: 1220px;
  --exp-page-gutter: clamp(16px, 3.2vw, 30px);
}

/* Universal containment: prevent decorative elements and intrinsic grid sizes
   from making the whole page wider than the viewport. */
html,
body.exp-site-body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}
@supports not (overflow: clip) {
  html,
  body.exp-site-body { overflow-x: hidden; }
}
body.exp-site-body,
body.exp-site-body *,
body.exp-site-body *::before,
body.exp-site-body *::after { box-sizing: border-box; }
body.exp-site-body img,
body.exp-site-body svg,
body.exp-site-body video,
body.exp-site-body iframe,
body.exp-site-body canvas { max-width: 100%; }
body.exp-site-body main,
body.exp-site-body header,
body.exp-site-body footer,
body.exp-site-body section,
body.exp-site-body article,
body.exp-site-body aside,
body.exp-site-body nav,
body.exp-site-body form { min-width: 0; }
body.exp-site-body .exp-container {
  width: min(var(--exp-content-width), calc(100% - var(--exp-page-gutter) - var(--exp-page-gutter)));
  max-width: 100%;
  min-width: 0;
}
body.exp-site-body :is(.exp-hero-grid, .exp-finder, .exp-section-heading, .exp-logo-rail,
  .exp-intent-grid, .exp-plan-grid, .exp-value-grid, .exp-steps-layout, .exp-faq-layout,
  .exp-directory-hero-grid, .exp-brand-directory-grid, .exp-profile-hero-grid,
  .exp-profile-identity, .exp-profile-about-grid, .exp-review-layout,
  .exp-review-form-layout, .exp-compare-hero-grid, .exp-compare-layout,
  .exp-plan-detail-hero-grid, .exp-plan-detail-layout, .exp-spec-grid,
  .exp-footer-main, .exp-footer-promo, .product-grid, .shop-detail-grid) > * {
  min-width: 0;
}
body.exp-site-body :is(h1, h2, h3, h4, p, a, span, strong, small, label, button) {
  overflow-wrap: break-word;
  word-break: normal;
}
body.exp-site-body input,
body.exp-site-body select,
body.exp-site-body textarea,
body.exp-site-body button { max-width: 100%; }

/* Hero decor was intentionally allowed to bleed outside its box in v2; on
   small screens the glows/rings became the source of horizontal scrolling. */
.exp-hero { overflow: hidden !important; }
.exp-hero-grid { grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); }
.exp-hero-copy,
.exp-hero-visual { min-width: 0; max-width: 100%; }
.exp-hero-copy h1 { letter-spacing: -.045em; overflow-wrap: normal; }
.exp-hero-glow-a { right: -4%; max-width: 100%; }
.exp-visual-rings {
  width: min(430px, calc(100vw - var(--exp-page-gutter) - var(--exp-page-gutter) - 20px));
  height: auto;
  aspect-ratio: 1 / 1;
  max-width: 100%;
}
.exp-visual-card { width: min(100%, 428px); min-width: 0; }
.exp-float-note-one { right: clamp(0px, 1.2vw, 14px); }
.exp-float-note-two { left: clamp(0px, 1.2vw, 14px); }
.exp-hero-stats { width: 100%; }
.exp-hero-stats > div { flex: 1 1 0; }
.exp-hero-stats strong { overflow-wrap: normal; }
.exp-finder { grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(0, 1fr)) auto; }
.exp-finder-field select,
.exp-finder-field input { min-width: 0; max-width: 100%; }
.exp-logo-rail { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.exp-logo-rail-item { min-width: 0; }
.exp-logo-rail-item .provider-logo-box,
.exp-plan-brand-logo,
.exp-brand-tile-logo .provider-logo-box { min-width: 0; }
.exp-plan-card,
.exp-brand-tile,
.exp-value-card,
.exp-intent-card,
.exp-detail-panel,
.exp-facts-card,
.exp-filter-panel { min-width: 0; }
.exp-filter-form input,
.exp-filter-form select,
.exp-form-card input,
.exp-form-card select,
.exp-form-card textarea { min-width: 0; max-width: 100%; }
.exp-directory-search { min-width: 0; }
.exp-directory-search input { min-width: 0; width: 100%; }
.exp-footer-promo-copy { min-width: 0; }
.exp-footer-promo > .exp-button { flex: 0 0 auto; }

/* Rich, useful SEO guide: actual explanatory content, not keyword stuffing. */
.exp-editorial-guide { padding: clamp(54px, 7vw, 88px) 0; background: #fff; }
.exp-editorial-header { max-width: 820px; margin: 0 auto 32px; text-align: center; }
.exp-editorial-header h2 { margin: 0 0 14px; color: var(--exp-navy, #102A43); font-size: clamp(29px, 3.3vw, 43px); line-height: 1.1; letter-spacing: -.045em; font-weight: 900; }
.exp-editorial-header p { margin: 0; color: #60788A; font-size: 15px; line-height: 1.85; }
.exp-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 0 34px; }
.exp-guide-card { min-width: 0; padding: 24px; border: 1px solid #E0E9EE; border-radius: 19px; background: linear-gradient(145deg, #FFFFFF, #F8FBFC); box-shadow: 0 9px 28px rgba(16,42,67,.045); }
.exp-guide-card-top { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; }
.exp-guide-number { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 auto; border-radius: 12px; color: #006D67; background: #DFF8F3; font-size: 12px; font-weight: 900; }
.exp-guide-card:nth-child(2) .exp-guide-number { color: #173F5A; background: #E7EFF5; }
.exp-guide-card:nth-child(3) .exp-guide-number { color: #80510C; background: #FFF1D6; }
.exp-guide-card h3 { margin: 0; color: var(--exp-navy, #102A43); font-size: 17px; line-height: 1.3; font-weight: 900; letter-spacing: -.025em; }
.exp-guide-card p { margin: 0; color: #647B8B; font-size: 13px; line-height: 1.85; }
.exp-guide-card p + p { margin-top: 10px; }
.exp-guide-detail { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr); align-items: start; gap: clamp(22px, 4vw, 55px); padding: clamp(24px, 4vw, 40px); border: 1px solid #DDEAE8; border-radius: 24px; background: linear-gradient(125deg, #F2FBF9 0%, #FFFFFF 65%, #F4F8FA 100%); }
.exp-guide-article { min-width: 0; }
.exp-guide-article h3 { margin: 0 0 13px; color: var(--exp-navy, #102A43); font-size: clamp(21px, 2.4vw, 29px); line-height: 1.2; letter-spacing: -.035em; font-weight: 900; }
.exp-guide-article p { margin: 0 0 13px; color: #60788A; font-size: 13px; line-height: 1.95; }
.exp-guide-article h4 { margin: 22px 0 7px; color: var(--exp-navy, #102A43); font-size: 15px; font-weight: 900; }
.exp-guide-checklist { display: grid; gap: 12px; margin: 14px 0 0; padding: 0; list-style: none; }
.exp-guide-checklist li { display: flex; align-items: flex-start; gap: 10px; color: #536D7F; font-size: 12px; line-height: 1.7; }
.exp-guide-checklist li::before { content: "✓"; display: grid; place-items: center; width: 20px; height: 20px; flex: 0 0 auto; border-radius: 50%; color: #006D67; background: #DDF7F2; font-size: 11px; font-weight: 900; }
.exp-guide-aside { min-width: 0; padding: 24px; border-radius: 18px; color: #E8F2F5; background: #102A43; }
.exp-guide-aside .exp-eyebrow { color: #66E5D7; }
.exp-guide-aside h3 { margin: 0 0 11px; color: #fff; font-size: 21px; line-height: 1.2; letter-spacing: -.03em; font-weight: 900; }
.exp-guide-aside p { margin: 0 0 14px; color: #C6D6DF; font-size: 12px; line-height: 1.8; }
.exp-guide-aside-links { display: grid; gap: 8px; margin-top: 17px; }
.exp-guide-aside-links a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 13px; border: 1px solid rgba(255,255,255,.12); border-radius: 11px; color: #fff; background: rgba(255,255,255,.055); font-size: 12px; font-weight: 800; }
.exp-guide-aside-links a:hover { color: var(--exp-navy, #102A43); background: #33D6C5; }
.exp-guide-note { margin-top: 18px !important; padding-top: 15px; border-top: 1px solid rgba(255,255,255,.14); font-size: 10px !important; }

/* Tablet: ensure columns can shrink instead of forcing the viewport wider. */
@media (max-width: 1024px) {
  .exp-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 25px; }
  .exp-nav-wrap { gap: 18px; }
  .exp-nav { gap: 12px; }
  .exp-nav > a { font-size: 10px; }
  .exp-brand-lockup { flex-shrink: 1; }
  .exp-brand-lockup img { max-width: 100%; }
  .exp-footer-main { grid-template-columns: minmax(0, 1.3fr) minmax(110px, .7fr) minmax(130px, .8fr); gap: 24px; }
  .exp-guide-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .exp-nav-wrap { gap: 12px; }
  .exp-brand-lockup img { width: 160px; }
  .exp-nav { gap: 9px; }
  .exp-nav > a { font-size: 9px; }
  .exp-nav > .exp-nav-cta { padding-inline: 11px; }
  .exp-footer-main { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
  .exp-footer-links:last-child { grid-column: 2; }
  .exp-guide-detail { grid-template-columns: minmax(0, 1fr) minmax(240px, .8fr); gap: 22px; }
}
@media (max-width: 820px) {
  .exp-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .exp-hero-visual { width: min(100%, 590px); margin-inline: auto; }
  .exp-logo-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .exp-directory-hero-grid,
  .exp-profile-hero-grid,
  .exp-compare-hero-grid,
  .exp-profile-about-grid,
  .exp-review-layout,
  .exp-compare-layout,
  .exp-plan-detail-layout,
  .exp-shop-detail-grid,
  .shop-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .exp-footer-main { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .exp-footer-brand { grid-column: 1 / -1; }
  .exp-guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exp-guide-detail { grid-template-columns: minmax(0, 1fr); }
  .exp-guide-aside { max-width: none; }
}
@media (max-width: 620px) {
  .exp-container { width: calc(100% - 30px); }
  .exp-hero { overflow: hidden !important; }
  .exp-hero-grid { gap: 10px; padding-top: 36px; padding-bottom: 72px; }
  .exp-hero-copy h1 { font-size: clamp(35px, 10vw, 48px); letter-spacing: -.045em; line-height: 1.02; }
  .exp-hero-kicker { max-width: 100%; white-space: normal; line-height: 1.5; }
  .exp-hero-lead { font-size: 13px; }
  .exp-hero-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .exp-hero-stats > div { padding-inline: 10px; min-width: 0; }
  .exp-hero-stats strong { font-size: clamp(17px, 5vw, 22px); }
  .exp-hero-stats span { max-width: none; font-size: 9px; overflow-wrap: normal; }
  .exp-hero-visual { min-height: 310px; width: 100%; max-width: 100%; overflow: visible; }
  .exp-visual-rings { width: min(290px, calc(100vw - 54px)); }
  .exp-visual-card { width: 100%; max-width: 430px; padding: clamp(13px, 4vw, 18px); transform: none; }
  .exp-float-note { display: none; }
  .exp-finder-container { margin-top: -34px; }
  .exp-finder { grid-template-columns: minmax(0, 1fr); width: 100%; padding: 15px; gap: 12px; }
  .exp-finder-intro,
  .exp-finder > .exp-button { grid-column: auto; }
  .exp-finder-field select,
  .exp-finder-field input { width: 100%; min-height: 44px; font-size: 12px; }
  .exp-logo-rail-title { align-items: flex-start; flex-wrap: wrap; }
  .exp-logo-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .exp-logo-rail-item { padding-inline: 5px; }
  .exp-logo-rail-item .provider-logo-box { width: min(100%, 74px); }
  .exp-intent-grid { grid-template-columns: minmax(0, 1fr); }
  .exp-plan-grid,
  .exp-brand-directory-grid,
  .exp-value-grid,
  .product-grid { grid-template-columns: minmax(0, 1fr); }
  .exp-plan-card,
  .exp-brand-tile,
  .exp-value-card,
  .exp-guide-card { padding: 19px; }
  .exp-filter-form { grid-template-columns: minmax(0, 1fr); }
  .exp-filter-form > label,
  .exp-filter-form > label:nth-child(n),
  .exp-filter-form .exp-button,
  .exp-filter-checks { grid-column: auto; }
  .exp-results-header { align-items: flex-start; gap: 10px; }
  .exp-directory-search { display: grid; grid-template-columns: 36px minmax(0, 1fr); }
  .exp-directory-search .exp-button { grid-column: 1 / -1; width: 100%; }
  .exp-pagination { max-width: 100%; }
  .exp-pagination nav { max-width: 100%; overflow-x: auto; }
  .exp-footer-promo { width: 100%; max-width: 100%; padding: 23px 19px; transform: none; margin: 22px 0 0; }
  .exp-footer-promo > .exp-button { width: 100%; }
  .exp-footer-main { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 15px; }
  .exp-footer-brand { grid-column: 1 / -1; }
  .exp-footer-links { min-width: 0; }
  .exp-footer-links a { overflow-wrap: anywhere; }
  .exp-footer-bottom { align-items: flex-start; }
  .exp-guide-grid { grid-template-columns: minmax(0, 1fr); gap: 11px; }
  .exp-guide-detail { padding: 19px; border-radius: 18px; }
  .exp-editorial-header { text-align: left; margin-bottom: 24px; }
  .exp-editorial-header h2 { font-size: clamp(27px, 8vw, 35px); }
  .exp-editorial-header p { font-size: 13px; }
  .exp-guide-article h3 { font-size: 23px; }
  .exp-guide-article p { font-size: 13px; }
  .exp-guide-aside { padding: 19px; }
}
@media (max-width: 380px) {
  .exp-container { width: calc(100% - 24px); }
  .exp-brand-lockup img { width: 142px; }
  .exp-mobile-toggle { flex: 0 0 40px; width: 40px; height: 40px; }
  .exp-nav-wrap { gap: 8px; }
  .exp-hero-copy h1 { font-size: 34px; }
  .exp-hero-stats > div { padding-inline: 6px; }
  .exp-hero-stats span { font-size: 8px; }
  .exp-visual-card-head { gap: 8px; }
  .exp-visual-card-head h2 { font-size: 16px; }
  .exp-visual-principle { gap: 7px; }
  .exp-visual-principle small { white-space: normal; }
  .exp-logo-rail-item > span:last-child { font-size: 8px; }
  .exp-footer-main { grid-template-columns: minmax(0, 1fr); }
  .exp-footer-links:last-child { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .exp-editorial-guide * { scroll-behavior: auto; transition-duration: .01ms !important; }
}