/* pyg-font-base: ensure Inter for body text to match site */
.pyg-hero, .pyg-intro, .pyg-plan-card, .pyg-cta-banner, .pyg-benefits, .pyg-faq, .pyg-tiles, .pyg-btn-primary, .pyg-btn-secondary, .pyg-btn-phone, .pyg-tile, .pyg-faq-card, .pyg-plan-list, .pyg-intro-copy, .pyg-checklist { font-family: "Inter", var(--sans); }
/* Shared UC styles duplicated from usage-credit.css for PAYG layout */
.uc-hero, .uc-intro, .uc-cta, .uc-benefits, .uc-faq, .uc-tiles, .uc-card, .uc-plan-card,
.uc-steps, .uc-plan-list, .uc-checklist { font-family: "Inter", var(--sans); }

/* Desktop: hide horizontal overflow that triggers a scrollbar */
@media (min-width: 901px){
  html, body{
    overflow-x:hidden;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  body::-webkit-scrollbar{
    width:0;
    height:0;
  }
}

.uc-hero{
  background:#f3f4f6;
  padding:32px 16px 0;
}
.uc-hero-wrap{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:32px;
  align-items:center;
}
@media (max-width: 900px){
  .uc-hero-wrap{ grid-template-columns:1fr; text-align:center; }
  .uc-hero-right img{ margin-inline:auto; }
  .uc-hero-actions{
    justify-content:center;
    align-items:center;
  }
}
.uc-label{
  text-transform:uppercase;
  font-size:13px;
  letter-spacing:0.15em;
  color:#1e3a8a;
  margin-bottom:6px;
}
.uc-title{
  font-family:"Outfit","Inter",sans-serif;
  font-size:52px;
  line-height:1.1;
  margin:0;
  color:#0f172a;
}
@media (max-width: 900px){
  .uc-title{ font-size:40px; }
}
.uc-lede{
  margin:12px 0 20px;
  color:#334155;
  max-width:520px;
}
.uc-btn-primary,
.uc-btn-secondary{
  display:inline-block;
  text-decoration:none;
  font-weight:700;
  padding:12px 22px;
  border-radius:999px;
  transition:transform .2s ease, box-shadow .2s ease;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:13px;
}
.uc-btn-primary{
  background:#3B82F6;
  color:#fff;
  box-shadow:0 10px 25px rgba(59,130,246,.3);
}
.uc-btn-secondary{
  background:#fff;
  color:#1e3a8a;
  box-shadow:0 10px 25px rgba(15,23,42,.2);
}
.uc-btn-full{ width:100%; text-align:center; }
.uc-btn-primary:hover,
.uc-btn-secondary:hover{
  transform:translateY(-2px);
}
.uc-hero-right img{
  max-width:460px;
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 15px 35px rgba(15,23,42,.18));
}

.uc-intro{
  background:#f3f4f6;
  padding:56px 16px 48px;
}
.uc-intro-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:28px;
  align-items:start;
}
@media (max-width: 900px){
  .uc-intro-grid{
    grid-template-columns:1fr;
    justify-items: center;
  }
  .uc-highlight-card {
    margin: 0 auto;
    width: 100%;
    max-width: 380px;
  }
}
.uc-intro-text{
  color:#0f172a;
}
.uc-intro-text h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:32px;
  margin:0 0 12px;
}
.uc-intro-text p{
  color:#374151;
  margin:0 0 16px;
  max-width:720px;
}
.uc-intro-subhead{
  text-transform:uppercase;
  font-size:13px;
  letter-spacing:.2em;
  color:#64748b;
  margin:18px 0 12px;
}
.uc-intro-points{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}
.uc-intro-points li{
  margin:0;
  color:#0f172a;
}
.uc-highlight-card{
  background:#fff6e9;
  border:1px solid #f2dfc8;
  box-shadow:0 12px 28px rgba(15, 23, 42, .08);
  border-radius:18px;
  padding:18px 20px 12px;
  display:flex;
  flex-direction:column;
  gap:12px;
  max-width:380px;
  align-self:stretch;
  height:100%;
}
.uc-highlight-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0;
  color:#0f172a;
  font-size:15px;
  line-height:1.55;
}
.uc-highlight-list li{
  position:relative;
  padding:14px 0 12px 28px;
}
.uc-highlight-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:10px;
  width:18px;
  height:18px;
  background:url("https://23263666.fs1.hubspotusercontent-na1.net/hubfs/23263666/karma/Summary%20Bullet%20Icon.png") center/contain no-repeat;
}
.uc-highlight-list li:not(:first-child){
  border-top:1px solid #f2dcb5;
}

.uc-plan-section{
  padding:48px 16px;
  background:linear-gradient(to top, #1e3a8a 0%, #1e3a8a 50%, #f3f4f6 50%, #f3f4f6 100%);
}
.uc-plan-head{
  max-width:820px;
  margin:0 auto 32px;
  text-align:center;
  width:100%;
  padding:0 16px;
  box-sizing:border-box;
}
.uc-plan-kicker{
  text-transform:uppercase;
  letter-spacing:.35em;
  font-size:12px;
  color:#1e3a8a;
  margin:0 0 10px;
  font-weight:700;
}
.uc-plan-head h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:34px;
  margin:0 auto 10px;
  color:#0f172a;
  text-align:center;
}
.uc-plan-lede{
  margin:0 auto 60px;
  color:#475569;
  text-align:center;
}
.uc-plan-grid{
  max-width:1100px;
  margin:16px auto 0;
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  align-items:start;
  justify-items:center;
}
@media (min-width: 900px){
  .uc-plan-grid{
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  }
}
.uc-plan-grid .business-card{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
.uc-plan-grid .business-card.bg-white.shadow-md.border.border-gray-200.rounded-lg{
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
.uc-plan-grid .details-panel{
  position:static !important;
  max-height:none !important;
}
.uc-plan-grid .pyg-plan-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}
.uc-plan-grid .pyg-plan-list li{
  position:relative;
  padding-left:24px;
  color:#0f172a;
}
.uc-plan-grid .pyg-plan-list li:before{
  content:"\2714";
  position:absolute;
  left:0;
  top:0;
  color:#16a34a;
}

.uc-cta{
  background:#1e3a8a;
  color:#fff;
  padding:72px 16px 64px;
  text-align:center;
}
.uc-cta-card{
  max-width:820px;
  margin:0 auto;
}
.uc-cta-card h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:34px;
  line-height:1.3;
  margin:0 0 20px;
}

.uc-benefits{
  position:relative;
  background:linear-gradient(to bottom, #1e3a8a 0%, #1e3a8a 50%, #f3f4f6 50%, #f3f4f6 100%);
  padding:90px 16px 100px;
}
.uc-benefits .uc-card{
  position:relative;
  z-index:1;
  max-width:1100px;
  margin:0 auto;
  padding:32px 32px 36px;
  background:#fff;
  box-shadow:0 20px 50px rgba(15,23,42,.1);
  border-radius:18px;
}
.uc-benefits h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:30px;
  margin:0 0 14px;
  color:#0f172a;
}
.uc-benefits-card{
  margin-left:auto;
  margin-right:auto;
}
.uc-benefits-lede{
  margin:0 0 24px;
  font-size:16px;
  line-height:1.6;
  color:#333333;
}
.uc-benefits-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:16px 32px;
  align-items:start;
}
.uc-checklist{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}
.uc-checklist li{
  position:relative;
  padding-left:32px;
  color:#0f172a;
}
.uc-checklist li:before{
  content:"";
  position:absolute;
  left:0;
  top:4px;
  width:20px;
  height:20px;
  background:url("https://23263666.fs1.hubspotusercontent-na1.net/hubfs/23263666/karma/Body%20Copy%20Bullet%20Check%20Icon.png") center/contain no-repeat;
}

.uc-faq{
  padding:48px 16px;
  background:#f3f4f6;
}
.uc-faq h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:30px;
  margin:0 0 18px;
  color:#0f172a;
}
.uc-faq-card{
  max-width:1100px;
  margin:0 auto;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  box-shadow:0 20px 50px rgba(15,23,42,.08);
  overflow:hidden;
}
.uc-faq-card details{
  border-bottom:1px solid #e5e7eb;
  padding:18px 24px;
}
.uc-faq-card details:last-child{ border-bottom:0; }
.uc-faq-card summary{
  cursor:pointer;
  font-weight:700;
  color:#0f172a;
  position:relative;
  padding-left:28px;
}
.uc-faq-card summary::-webkit-details-marker{ display:none; }
.uc-faq-card summary::marker{ content:""; display:none; }
.uc-faq-card summary::before{
  content:"+";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  color:#1e3a8a;
  font-size:20px;
  font-weight:700;
}
.uc-faq-card details[open] summary::before{ content:"-"; }
.uc-faq-card p{
  color:#475569;
  margin:8px 0 0;
  padding-left:28px;
}

/* =============================
   Pay-as-you-go layout styles
   ============================= */

/* Hero */
.pyg-hero{ background:#fff; color:#0f172a; padding:0px 16px 24px; position:relative; }
.pyg-hero-wrap{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:24px; align-items:center; }
@media (max-width: 900px){ .pyg-hero-wrap{ grid-template-columns:1fr; text-align:center; } }
.pyg-kicker{ text-transform:uppercase; letter-spacing:.2em; font-size:12px; margin-bottom:12px; color:#94a3b8; font-weight:700; }
.pyg-title{ font-family:Outfit,Inter,sans-serif; font-size:56px; line-height:1.1; font-weight:700; margin:0 0 20px; }
@media (max-width: 900px){ .pyg-title{ font-size:40px; } }
.pyg-hero-text{ color:#334155; font-size:18px; margin:0 0 18px; max-width:420px; }
.pyg-btn-primary{ display:inline-block; background:#3B82F6; color:#fff; padding:12px 20px; border-radius:999px; font-weight:700; text-transform:uppercase; font-size:12px; letter-spacing:.4px; text-decoration:none; box-shadow:0 6px 14px rgba(59,130,246,.25); }
.pyg-hero-right img{ max-width:560px; width:100%; height:auto; display:block; margin-inline:auto; filter:drop-shadow(0 10px 30px rgba(0,0,0,.15)); position:relative; top:10px; margin-bottom:-24px; }

/* Intro */
.pyg-intro{ background:#f3f4f6; padding:60px 16px 48px; position:relative; z-index:2; margin-top:-15vh; }
@media (max-width: 900px){ .pyg-intro{ margin-top:-15vh; } }

/* Mobile adjustments to match reference */
@media (max-width: 900px){
  .pyg-hero{ padding:15px 16px 8px; }
  .pyg-hero-right img{ max-width:460px; top:0; margin-bottom:-48px; }
  .pyg-intro{ padding-top:64px; }
}
.pyg-intro-grid{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:start; }
@media (max-width: 900px){
  .pyg-intro-grid{
    grid-template-columns:1fr;
    justify-items: center;
  }
  .pyg-highlight-card {
    margin: 0 auto;
    width: 100%;
    max-width: 380px;
  }
}
.pyg-intro-copy h2{ font:700 34px/1.2 Outfit,Inter,sans-serif; color:#0f172a; margin:0 0 12px; }
.pyg-intro-copy h3{ font:700 14px/1 Outfit,Inter,sans-serif; letter-spacing:.4px; text-transform:uppercase; margin:16px 0 8px; color:#0f172a; }
.pyg-intro-copy p{ color:#334155; margin:0 0 8px; }
.pyg-intro-copy ol{ color:#334155; padding-left:18px; }
.pyg-intro-copy li{ margin:6px 0; }

/* Plan card */
.pyg-plan-card{ background:#fff; border:1px solid #e5e7eb; border-radius:10px; box-shadow:0 10px 24px rgba(0,0,0,.06); overflow:hidden; }
.pyg-pill{ background:#26457a; color:#fff; font:700 12px/1 Inter,sans-serif; letter-spacing:.4px; text-transform:uppercase; padding:12px 16px; text-align:center; }
.pyg-plan-header{ font:700 22px/1.15 Outfit,Inter,sans-serif; color:#0f172a; padding:16px; border-bottom:1px solid #e5e7eb; text-align:center; }
.pyg-plan-list{ list-style:none; margin:0; padding:14px 18px; display:grid; gap:10px; }
.pyg-plan-list li{ position:relative; padding-left:26px; color:#0f172a; }
.pyg-plan-list li:before{ content:"\2714"; position:absolute; left:0; top:0; color:#16a34a; }
.pyg-btn-secondary{ display:block; margin:12px auto 16px; width:max-content; background:#3B82F6; color:#fff; padding:10px 16px; border-radius:8px; font-weight:700; text-decoration:none; }
.pyg-btn-outline{ display:inline-flex; justify-content:center; align-items:center; width:100%; padding:10px 16px; border-radius:8px; border:1px solid #1e3a8a; color:#1e3a8a; font-weight:700; text-decoration:none; }

/* Banner */
.pyg-cta-banner{ background:#1e3a8a; color:#fff; padding:48px 16px; text-align:center; }
.pyg-cta-wrap{ max-width:900px; margin:0 auto; }
.pyg-cta-wrap h2{ font:800 32px/1.25 Outfit,Inter,sans-serif; margin:0 0 20px; }
.pyg-cta-banner{ padding:72px 16px 64px; box-shadow:0 -20px 60px rgba(15,23,42,.12) inset; }
.pyg-btn-phone{ display:inline-block; background:#3B82F6; color:#fff; padding:10px 16px; border-radius:8px; font-weight:700; text-decoration:none; }

/* Benefits */
.pyg-benefits{ background:#f8fafc; padding:48px 16px; }
.pyg-benefits{ background:#f3f6fb; padding:60px 16px; }
.pyg-benefits-card{ max-width:980px; margin:0 auto; background:#fff; border:1px solid #e5e7eb; border-radius:18px; box-shadow:0 20px 50px rgba(15,23,42,.1); padding:22px; }
.pyg-benefits-card h2{ font:700 28px/1.2 Outfit,Inter,sans-serif; color:#0f172a; margin:0 0 10px; }
.pyg-checklist{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.pyg-checklist li{ position:relative; padding-left:32px; color:#0f172a; }
.pyg-checklist li:before{
  content:"";
  position:absolute;
  left:0;
  top:2px;
  width:20px;
  height:20px;
  background:url("https://23263666.fs1.hubspotusercontent-na1.net/hubfs/23263666/karma/Body%20Copy%20Bullet%20Check%20Icon.png") no-repeat center/contain;
}

.pyg-compare{ padding:32px 16px 16px; background:#fdfdfd; text-align:center; }
.pyg-compare-title{ max-width:1100px; margin:0 auto 8px; font:700 26px/1.2 Outfit,Inter,sans-serif; color:#0f172a; text-align:center; }
.pyg-compare-subtitle{ margin:4px auto 20px; color:#111827; font-size:15px; line-height:1.5; }
.pyg-compare-subtitle-bottom{ margin:20px auto 0; color:#111827; font-size:15px; line-height:1.5; }
.pyg-compare-grid{ max-width:1100px; margin:16px auto 0; display:grid; grid-template-columns:1fr; gap:24px; align-items:start; }
.pyg-compare-grid .business-card{ width:100%; max-width:100%; }
@media (min-width: 900px){
  .pyg-compare-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
.pyg-compare-grid .business-card{
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
.pyg-compare-grid .business-card.bg-white.shadow-md.border.border-gray-200.rounded-lg{
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
.pyg-compare-grid .details-panel{
  position:static !important;
  max-height:none !important;
}
.pyg-compare-grid .details-panel{
  position:static !important;
}
.pyg-compare-card{ background:#fff; border:1px solid #e2e8f0; border-radius:16px; padding:20px; box-shadow:0 12px 30px rgba(15,23,42,.08); display:flex; flex-direction:column; gap:12px; }
.pyg-compare-pill{ align-self:flex-start; padding:6px 12px; border-radius:999px; background:#fef3c7; color:#92400e; font-size:11px; text-transform:uppercase; font-weight:700; letter-spacing:.1em; }
.pyg-compare-pill.green{ background:#d1fae5; color:#047857; }
.pyg-compare-logo{ width:140px; height:auto; }
.pyg-compare-rate{ font-size:28px; font-weight:700; color:#0f172a; }
.pyg-compare-rate span{ font-size:36px; }
.pyg-compare-term{ color:#475569; margin:0; font-weight:600; }
.pyg-compare-list{ list-style:none; padding:0; margin:0; display:grid; gap:6px; color:#334155; font-size:14px; }
.pyg-compare-card .pyg-btn-secondary{ width:100%; margin-top:8px; }
.pyg-compare-desc{
  color:#334155;
  margin:0 0 12px;
  font-size:14px;
  line-height:1.45;
}
.pyg-compare-placeholder{
  min-height:220px;
  justify-content:center;
  align-items:center;
  text-align:center;
}
.pyg-compare-placeholder-copy p{
  margin:4px 0;
  color:#475569;
}
.pyg-compare-placeholder-copy a{
  color:#1d4ed8;
  text-decoration:none;
  font-weight:600;
}
.pyg-compare-placeholder-copy a:hover{
  text-decoration:underline;
}

.pyg-plan-card-new{
  width:100%;
  max-width:336.6px;
  min-height:280px;
  background:#fff;
  box-shadow:0 2px 4px -2px rgba(0,0,0,0.10);
  overflow:hidden;
  border-radius:8px;
  outline:0.5px solid #d9d9d9;
  outline-offset:-0.5px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.pyg-plan-card-top{
  width:100%;
  min-height:35px;
  display:flex;
  align-items:stretch;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  overflow:hidden;
}
.pyg-plan-card-title{
  flex:0 0 187px;
  padding:0 16px;
  background:#bfdbfe;
  display:flex;
  align-items:center;
  color:#1f2937;
  font-size:14px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:20px;
}
.pyg-plan-card-term{
  flex:1 1 auto;
  padding:0 16px;
  background:#3b82f6;
  display:flex;
  align-items:center;
  color:#fff;
  font-size:14px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:20px;
}
.uc-plan-grid.two-plans .pyg-plan-card-title{
  flex:0 0 50%;
}
.uc-plan-grid.two-plans .pyg-plan-card-term{
  flex:1 1 50%;
}
.pyg-plan-card-body{
  width:100%;
  min-height:140px;
  background:#fff;
  display:flex;
}
.pyg-plan-card-inner{
  display:flex;
  align-items:center;
  width:100%;
}
.pyg-plan-card-left{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  width:186px;
  padding:8px;
  background:#fff;
  flex-shrink:0;
}
.pyg-plan-card-logo{
  max-height:48px;
  width:100%;
  padding:0 4px 8px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.pyg-plan-card-logo img{
  width:auto;
  height:auto;
  max-width:160px;
  max-height:40px;
  display:block;
}
.pyg-plan-card-desc{
  padding-top:8px;
  font-size:10px;
  line-height:14px;
  color:#111827;
  font-family:"Inter", var(--sans);
  text-align:left;
  width:100%;
}
.pyg-plan-card-desc span{
  display:block;
}
.pyg-plan-card-desc span:first-child{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.pyg-plan-card-readmore{
  color:#3b82f6;
  font-weight:700;
  margin-top:2px;
}
.pyg-plan-card-divider{
  width:1px;
  height:75px;
  background:#d9d9d9;
  flex-shrink:0;
}
.pyg-plan-card-right{
  flex:1 1 auto;
  padding:13px 0 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  background:#d4e3ff;
}
.uc-plan-grid.two-plans .pyg-plan-card-left{
  width:50%;
}
.uc-plan-grid.two-plans .pyg-plan-card-right{
  flex:1 1 50%;
}
.pyg-plan-card-rate-label{
  color:#263d88;
  font-size:10.26px;
  font-family:"Inter", var(--sans);
  font-weight:700;
  line-height:13.69px;
}
.pyg-plan-card-rate-sub{
  color:#263d88;
  font-size:10.26px;
  font-family:"Inter", var(--sans);
  font-weight:400;
  line-height:13.69px;
}
.pyg-plan-card-rate{
  color:#263d88;
  font-size:30.79px;
  font-family:"Inter", var(--sans);
  font-weight:700;
  line-height:34.21px;
  display:flex;
  align-items:flex-start;
  gap:2px;
}
.pyg-plan-card-cent{
  font-size:23.09px;
  line-height:28.23px;
}
.pyg-plan-card-tags{
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:center;
}
.pyg-plan-card-tag{
  padding:4px 6px;
  border-radius:3.42px;
  font-size:9px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:10px;
  border:1px solid transparent;
}
.pyg-plan-card-tag-blue{
  color:#3b82f6;
  border-color:#3b82f6;
  background:rgba(59,130,246,0.05);
}
.pyg-plan-card-tag-green{
  color:#44b75e;
  border-color:#44b75e;
  background:rgba(68,183,94,0.05);
}

.pyg-plan-card-cta{
  width:100%;
  padding:19px 20px 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.pyg-plan-card-btn{
  width:100%;
  padding:7px 16px;
  background:#3b82f6;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#f3f4f6;
  font-size:16px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:24px;
  text-decoration:none;
}
.pyg-plan-card-phone{
  text-align:center;
  color:#263d88;
  font-size:16px;
  font-family:"Inter", var(--sans);
  font-weight:400;
  line-height:15.37px;
}
.pyg-plan-card-footer{
  width:100%;
  padding:10px 0;
  display:flex;
  justify-content:center;
}
.pyg-plan-card-details{
  background:none;
  border:0;
  color:#3b82f6;
  font-size:10px;
  font-family:"Inter", var(--sans);
  font-weight:400;
  line-height:14px;
  letter-spacing:0.5px;
  cursor:pointer;
}

/* Details toggle + panel (copied from css/plan-page/cards.css) */
.business-card .details-toggle{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:32px !important;
  min-height:32px !important;
  width:100% !important;
  background:#ffffff !important;
  border:none !important;
  border-top:1px solid #ffffff !important;
  border-bottom-left-radius:7.5px !important;
  border-bottom-right-radius:7.5px !important;
  font-size:10px !important;
  font-weight:600 !important;
  color:##3b82f6 !important;
  cursor:pointer !important;
  margin-top:0 !important;
  flex-shrink:0 !important;
}

.business-card .details-toggle .chev{
  width:16px !important;
  height:16px !important;
  transition:transform 0.2s ease !important;
  margin-left:4px !important;
}

.business-card .details-panel{
  overflow:hidden !important;
  background:#f9fafb !important;
  border-top:1px solid #e5e7eb !important;
  position:relative !important;
  z-index:1 !important;
}

@media (max-width: 700px){
  .pyg-plan-card-inner{
    flex-direction:column;
    padding:12px;
    gap:12px;
  }
  .pyg-plan-card-left{
    width:100%;
  }
  .pyg-plan-card-divider{
    width:100%;
    height:1px;
  }
}

@media (max-width: 470px){
  .business-card .details-toggle{
    font-size:12px !important;
  }

  .business-card .details-toggle .chev{
    width:14px !important;
    height:14px !important;
  }
}

/* Keep plan cards in desktop layout on small screens, scaled down for 375px */
@media (max-width: 700px){
  .pyg-plan-card-new{
    max-width:100%;
  }
  .pyg-plan-card-inner{
    flex-direction:row;
    padding:10px;
    gap:10px;
  }
  .pyg-plan-card-left{
    width:auto;
    flex:0 0 48%;
    padding:6px;
  }
  .pyg-plan-card-logo{
    padding:0 2px 6px;
  }
  .pyg-plan-card-logo img{
    max-width:120px;
    max-height:34px;
  }
  .pyg-plan-card-desc{
    font-size:9px;
    line-height:12px;
  }
  .pyg-plan-card-divider{
    width:1px;
    height:100%;
  }
  .pyg-plan-card-right{
    padding:8px 0 10px;
    gap:8px;
  }
  .pyg-plan-card-rate-label,
  .pyg-plan-card-rate-sub{
    font-size:9px;
    line-height:12px;
  }
  .pyg-plan-card-rate{
    font-size:24px;
    line-height:28px;
  }
  .pyg-plan-card-cent{
    font-size:18px;
    line-height:22px;
  }
  .pyg-plan-card-tags{
    gap:3px;
  }
  .pyg-plan-card-tag{
    font-size:8px;
    line-height:9px;
  }
  .pyg-plan-card-cta{
    padding:14px 16px 0;
    gap:10px;
  }
  .pyg-plan-card-btn{
    font-size:14px;
    line-height:20px;
  }
  .pyg-plan-card-phone{
    font-size:13px;
    line-height:14px;
  }
}

/* Mobile containment fixes */
@media (max-width: 700px){
  .uc-benefits .uc-card{
    padding:24px 20px;
  }
  .uc-benefits-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .uc-checklist li{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
}

/* FAQ */
.pyg-faq{ padding:48px 16px; }
.pyg-faq h2{ font:700 28px/1.2 Outfit,Inter,sans-serif; color:#0f172a; margin:0 0 16px; }
.pyg-faq-card{ max-width:1100px; margin:0 auto; background:#fff; border:1px solid #e5e7eb; border-radius:10px; box-shadow:0 10px 24px rgba(0,0,0,.06); overflow:hidden; }
.pyg-faq-card details{ border-bottom:1px solid #e5e7eb; padding:14px 18px; }
.pyg-faq-card details:last-child{ border-bottom:0; }
.pyg-faq-card summary{
  cursor:pointer;
  font-weight:700;
  color:#0f172a;
  position:relative;
  padding-left:32px;
}
.pyg-faq-card summary::-webkit-details-marker{ display:none; }
.pyg-faq-card summary::marker{ content:""; }
.pyg-faq-card summary::before{
  content:"+";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  font-size:20px;
  font-weight:700;
  color:#1e3a8a;
}
.pyg-faq-card details[open] summary::before{ content:"-"; }
.pyg-faq-card p{
  color:#334155;
  margin-top:8px;
  padding-left:32px;
}

/* Bottom tiles */
.pyg-tiles{ padding:50px 16px 120px; background:#f3f4f6; margin:0; }
.pyg-tiles-inner{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width: 900px){ .pyg-tiles-inner{ grid-template-columns:1fr; } }
.pyg-tile{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; box-shadow:0 10px 24px rgba(0,0,0,.06); padding:22px; text-align:center; font-weight:600; color:#0f172a; }
.pyg-tile-link{ display:block; text-decoration:none; color:inherit; }
.pyg-tile-link:hover{ box-shadow:0 12px 28px rgba(0,0,0,.12); }
.pyg-ico{ display:block; font-size:28px; margin:0 auto 8px; }
/* Ensure any icon <img> looks consistent */
.pyg-ico img{ width:40px; height:40px; display:block; margin:0 auto; }

/* Floating Phone Button */
.floating-phone-button{ position:fixed; bottom:10px; left:10px; width:60px; height:60px; border-radius:9999px; background:#3B82F6; color:#fff; display:inline-grid; place-items:center; box-shadow:0 10px 24px rgba(16,24,39,.18); z-index:1000; }
.floating-phone-button svg{ width:30px; height:30px; display:block; }

/* Modern card layout (matches product results visual) */
.pyg-modern-card{
  border-radius:14px !important;
  overflow:hidden !important;
  padding:0 !important;
  border:1px solid #d6dce7 !important;
  box-shadow:0 16px 36px rgba(10,37,64,0.15) !important;
  background:#fff !important;
}
.pyg-modern-top{
  display:flex;
  min-height:46px;
  background:#cfe2ff;
  color:#0f172a;
  font:700 14px/1.2 "Inter", var(--sans);
  border-radius:14px 14px 0 0;
  overflow:hidden;
}
.pyg-modern-title,
.pyg-modern-term{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 10px;
}
.pyg-modern-title{ flex:1 1 60%; }
.pyg-modern-term{
  flex:0 0 40%;
  background:#3b82f6;
  color:#fff;
}
.pyg-modern-body{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:20px;
  padding:24px 22px 18px;
  background:#f7f9fd;
  align-items:center;
}
.pyg-modern-col{
  display:flex;
  flex-direction:column;
  gap:12px;
  justify-content:center;
}
.pyg-modern-col-left{
  text-align:left;
}
.pyg-modern-logo{
  max-width:170px;
  width:100%;
  height:auto;
}
.pyg-modern-copy{
  margin:0;
  color:#0f172a;
  font:400 14px/1.5 "Inter", var(--sans);
}
.pyg-modern-divider{
  width:1px;
  height:100%;
  background:#d7dce5;
}
.pyg-modern-col-right{
  align-items:center;
  text-align:center;
}
.pyg-modern-rate{
  font:700 32px/1 "Outfit","Inter",sans-serif;
  color:#0ea44b;
}
.pyg-modern-cent{
  font-size:22px;
  vertical-align:text-top;
}
.pyg-modern-rate-sub{
  font-size:12px;
  color:#6b7280;
  margin-bottom:10px;
}
.pyg-modern-badge{
  display:inline-block;
  background:#e3f6eb;
  color:#047857;
  padding:8px 14px;
  border-radius:8px;
  font-weight:600;
  margin-bottom:12px;
}
.pyg-modern-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 24px;
  background:#0b0b0b;
  color:#fff;
  border-radius:6px;
  font-weight:700;
  text-decoration:none;
  margin-bottom:10px;
}
.pyg-modern-cta:hover{
  background:#111827;
}
.pyg-modern-phone{
  color:#6b7280;
  font-size:12px;
}
.pyg-modern-bottom{
  background:#e6edff;
  padding:10px 14px;
  border-radius:0 0 14px 14px;
}
.pyg-modern-details{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:100%;
  background:transparent;
  border:0;
  font-weight:700;
  color:#1d4ed8;
  cursor:pointer;
}
.pyg-modern-details .chev{
  transition:transform .2s ease;
}
.pyg-modern-details[aria-expanded="true"] .chev{
  transform:rotate(180deg);
}

@media (max-width: 900px){
  .pyg-modern-body{
    grid-template-columns:1fr;
    text-align:center;
  }
  .pyg-modern-divider{ display:none; }
  .pyg-modern-col-left,
  .pyg-modern-col-right{ align-items:center; }
  .pyg-modern-top{
    flex-direction:column;
    text-align:center;
  }
  .pyg-modern-title,
  .pyg-modern-term{
    width:100%;
    flex:1 1 auto;
  }
}

/* Duplicated from usage-credit.css */
/* Usage Credit page specific styles */
.uc-hero, .uc-intro, .uc-cta, .uc-benefits, .uc-faq, .uc-tiles, .uc-card, .uc-plan-card,
.uc-steps, .uc-plan-list, .uc-checklist { font-family: "Inter", var(--sans); }

.uc-hero{
  background:#f3f4f6;
  padding:32px 16px 0;
}
.uc-hero-wrap{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:32px;
  align-items:center;
}
@media (max-width: 900px){
  .uc-hero-wrap{ grid-template-columns:1fr; text-align:center; }
  .uc-hero-right img{ margin-inline:auto; }
}
.uc-label{
  text-transform:uppercase;
  font-size:13px;
  letter-spacing:0.15em;
  color:#1e3a8a;
  margin-bottom:6px;
}
.uc-title{
  font-family:"Outfit","Inter",sans-serif;
  font-size:52px;
  line-height:1.1;
  margin:100px 0px 0px;
  color:#0f172a;
}
@media (max-width: 900px){
  .uc-title{ font-size:40px; }
}
.uc-lede{
  margin:12px 0 20px;
  color:#334155;
  max-width:520px;
}
.uc-btn-primary,
.uc-btn-secondary{
  display:inline-block;
  text-decoration:none;
  font-weight:700;
  padding:12px 22px;
  border-radius:999px;
  transition:transform .2s ease, box-shadow .2s ease;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:13px;
}
.uc-btn-primary{
  background:#3B82F6;
  color:#fff;
  box-shadow:0 10px 25px rgba(59,130,246,.3);
}
.uc-btn-secondary{
  background:#fff;
  color:#1e3a8a;
  box-shadow:0 10px 25px rgba(15,23,42,.2);
}
.uc-btn-full{ width:100%; text-align:center; }
.uc-btn-primary:hover,
.uc-btn-secondary:hover{
  transform:translateY(-2px);
}
.uc-hero-right img{
  max-width:460px;
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 15px 35px rgba(15,23,42,.18));
}

.uc-intro{
  background:#f3f4f6;
  padding:56px 16px 48px;
}
.uc-intro-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:28px;
  align-items:start;
}
@media (max-width: 900px){
  .uc-intro-grid{
    grid-template-columns:1fr;
    justify-items: center;
  }
  .uc-highlight-card {
    margin: 0 auto;
    width: 100%;
    max-width: 380px;
  }
}
.uc-intro-text{
  color:#0f172a;
}
.uc-intro-text h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:32px;
  margin:0 0 12px;
}
.uc-intro-text p{
  color:#374151;
  margin:0 0 16px;
  max-width:720px;
}
.uc-intro-subhead{
  text-transform:uppercase;
  font-size:13px;
  letter-spacing:.2em;
  color:#64748b;
  margin:18px 0 12px;
}
.uc-intro-points{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}
.uc-intro-points li{
  margin:0;
  color:#0f172a;
}
.uc-highlight-card{
   background: #fff6e9;
    border: 1px solid #f2dfc8;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
    border-radius: 18px;
    padding: 18px 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 380px;
    align-self: stretch;
    height: 100%;
}
.uc-highlight-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0;
  color:#0f172a;
  font-size:15px;
  line-height:1.55;
}
.uc-highlight-list li{
  position:relative;
  padding:25px 0 25px 28px;
}
.uc-highlight-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:30px;
  width:18px;
  height:18px;
  background:url("https://23263666.fs1.hubspotusercontent-na1.net/hubfs/23263666/karma/Summary%20Bullet%20Icon.png") center/contain no-repeat;
}
.uc-highlight-list li:not(:first-child){
  border-top:1px solid #f2dcb5;
}
.uc-plan-card{
  text-align:left;
}
.uc-pill{
  background:#1e3a8a;
  color:#fff;
  padding:10px 16px;
  border-radius:999px;
  font-weight:700;
  font-size:13px;
  letter-spacing:.05em;
  text-align:center;
  margin-bottom:16px;
}
.uc-plan-header{
  font-family:"Outfit","Inter",sans-serif;
  font-size:24px;
  color:#0f172a;
  margin-bottom:14px;
  text-align:center;
}
.uc-plan-list{
  list-style:none;
  padding:0;
  margin:0 0 18px;
  display:grid;
  gap:10px;
}
.uc-plan-list li{
  position:relative;
  padding-left:28px;
  color:#0f172a;
}
.uc-plan-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:2px;
  width:18px;
  height:18px;
  background:url("https://23263666.fs1.hubspotusercontent-na1.net/hubfs/23263666/karma/Body%20Copy%20Bullet%20Check%20Icon.png") center/contain no-repeat;
}

.uc-plan-section{
  padding:48px 16px;
  background:linear-gradient(to top, #1e3a8a 0%, #1e3a8a 50%, #f3f4f6 50%, #f3f4f6 100%);
}
.uc-plan-head{
  max-width:820px;
  margin:0 auto 32px;
  text-align:center;
  width:100%;
  padding:0 16px;
  box-sizing:border-box;
}
.uc-plan-kicker{
  text-transform:uppercase;
  letter-spacing:.35em;
  font-size:12px;
  color:#1e3a8a;
  margin:0 0 10px;
  font-weight:700;
}
.uc-plan-head h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:34px;
  margin:0 auto 10px;
  color:#0f172a;
  text-align:center;
}
.uc-plan-lede{
  margin:0 auto 60px;
  color:#475569;
  text-align:center;
}
.uc-plan-grid{
  max-width:1100px;
  margin:16px auto 0;
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  align-items:start;
  justify-items:center;
}
@media (min-width: 900px){
  .uc-plan-grid{
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  }
}
.uc-plan-card-new{
  width:100%;
  max-width:336.6px;
  min-height:280px;
  background:#fff;
  box-shadow:0 2px 4px -2px rgba(0,0,0,0.10);
  overflow:hidden;
  border-radius:8px;
  outline:0.5px solid #d9d9d9;
  outline-offset:-0.5px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.uc-plan-card-top{
  width:100%;
  min-height:35px;
  display:flex;
  align-items:stretch;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  overflow:hidden;
}
.uc-plan-card-title{
  flex:0 0 187px;
  padding:0 16px;
  background:#bfdbfe;
  display:flex;
  align-items:center;
  color:#1f2937;
  font-size:14px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:20px;
}
.uc-plan-card-term{
  flex:1 1 auto;
  padding:0 16px;
  background:#3b82f6;
  display:flex;
  align-items:center;
  color:#fff;
  font-size:14px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:20px;
}
.uc-plan-card-body{
  width:100%;
  min-height:140px;
  background:#fff;
  display:flex;
}
.uc-plan-card-inner{
  display:flex;
  align-items:center;
  width:100%;
}
.uc-plan-card-left{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  width:186px;
  padding:8px;
  background:#fff;
  flex-shrink:0;
}
.uc-plan-card-logo{
  max-height:48px;
  width:100%;
  padding:0 4px 8px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.uc-plan-card-logo img{
  width:auto;
  height:auto;
  max-width:160px;
  max-height:40px;
  display:block;
}
.uc-plan-card-desc{
  padding-top:8px;
  font-size:10px;
  line-height:14px;
  color:#111827;
  font-family:"Inter", var(--sans);
  text-align:left;
  width:100%;
}
.uc-plan-card-desc span{
  display:block;
}
.uc-plan-card-desc span:first-child{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.uc-plan-card-readmore{
  color:#3b82f6;
  font-weight:700;
  margin-top:2px;
}
.uc-plan-card-divider{
  width:1px;
  height:75px;
  background:#d9d9d9;
  flex-shrink:0;
}
.uc-plan-card-right{
  flex:1 1 auto;
  padding:13px 0 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  background:#f7f9fd;
}
.uc-plan-grid.two-plans .uc-plan-card-left{
  width:50%;
}
.uc-plan-grid.two-plans .uc-plan-card-right{
  flex:1 1 50%;
}
.uc-plan-card-rate-label{
  color:#263d88;
  font-size:10.26px;
  font-family:"Inter", var(--sans);
  font-weight:700;
  line-height:13.69px;
}
.uc-plan-card-rate-sub{
  color:#263d88;
  font-size:10.26px;
  font-family:"Inter", var(--sans);
  font-weight:400;
  line-height:13.69px;
}
.uc-plan-card-rate{
  color:#263d88;
  font-size:30.79px;
  font-family:"Inter", var(--sans);
  font-weight:700;
  line-height:34.21px;
  display:flex;
  align-items:flex-start;
  gap:2px;
}
.uc-plan-card-cent{
  font-size:23.09px;
  line-height:28.23px;
}
.uc-plan-card-tags{
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:center;
}
.uc-plan-card-tag{
  padding:4px 6px;
  border-radius:3.42px;
  font-size:9px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:10px;
  border:1px solid transparent;
}
.uc-plan-card-tag-blue{
  color:#3b82f6;
  border-color:#3b82f6;
  background:rgba(59,130,246,0.05);
}
.uc-plan-card-tag-green{
  color:#44b75e;
  border-color:#44b75e;
  background:rgba(68,183,94,0.05);
}
.uc-plan-card-tag-indigo{
  color:#263d88;
  border-color:#263d88;
  background:rgba(38,61,136,0.05);
}
.uc-plan-card-cta{
  width:100%;
  padding:19px 20px 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.uc-plan-card-btn{
  width:100%;
  padding:7px 16px;
  background:#3b82f6;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#f3f4f6;
  font-size:16px;
  font-family:"Inter", var(--sans);
  font-weight:600;
  line-height:24px;
  text-decoration:none;
}
.uc-plan-card-phone{
  text-align:center;
  color:#263d88;
  font-size:16px;
  font-family:"Inter", var(--sans);
  font-weight:400;
  line-height:15.37px;
}
.uc-plan-card-footer{
  width:100%;
  padding:10px 0;
  display:flex;
  justify-content:center;
}
.uc-plan-card-details{
  background:none;
  border:0;
  color:#3b82f6;
  font-size:10px;
  font-family:"Inter", var(--sans);
  font-weight:400;
  line-height:14px;
  letter-spacing:0.5px;
  cursor:pointer;
}

@media (max-width: 700px){
  .uc-plan-card-inner{
    flex-direction:column;
    padding:12px;
    gap:12px;
  }
  .uc-plan-card-left{
    width:100%;
  }
  .uc-plan-card-divider{
    width:100%;
    height:1px;
  }
}
.uc-plan-card-item{
  border:1px solid #bfdbfe;
  border-radius:24px;
  padding:24px;
  background:#fff;
  box-shadow:0 25px 60px rgba(15,23,42,.08);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.uc-plan-badge{
  align-self:flex-start;
  padding:6px 12px;
  border-radius:999px;
  background:#bfdbfe;
  color:#1d4ed8;
  font-weight:700;
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.uc-plan-brand{
  display:flex;
  align-items:center;
  gap:14px;
}
.uc-plan-logo{
  width:90px;
  height:auto;
  flex-shrink:0;
}
.uc-plan-supplier{
  margin:0;
  font-weight:700;
  color:#0f172a;
}
.uc-plan-name{
  margin:4px 0 0;
  color:#475569;
  font-size:14px;
}
.uc-plan-rate{
  font-size:28px;
  font-weight:700;
  color:#0f172a;
}
.uc-plan-rate span{
  font-size:36px;
}
.uc-plan-term{
  margin:0;
  color:#475569;
  font-weight:600;
}
.uc-plan-points{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:8px;
  color:#374151;
  font-size:14px;
}
.uc-plan-grid .business-card{
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
.uc-plan-grid .business-card.bg-white.shadow-md.border.border-gray-200.rounded-lg{
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
.uc-plan-grid .details-panel{
  position:static !important;
  max-height:none !important;
}
.uc-plan-grid .pyg-plan-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}
.uc-plan-grid .pyg-plan-list li{
  position:relative;
  padding-left:24px;
  color:#0f172a;
}
.uc-plan-grid .pyg-plan-list li:before{
  content:"\\2714";
  position:absolute;
  left:0;
  top:0;
  color:#16a34a;
}

.uc-cta{
  background:#1e3a8a;
  color:#fff;
  padding:72px 16px 64px;
  text-align:center;
  
}
.uc-cta-card{
  max-width:820px;
  margin:50px auto;
}
.uc-cta-card h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:34px;
  line-height:1.3;
  margin:0 0 20px;
}

.uc-benefits{
  position:relative;
  background:linear-gradient(to bottom, #1e3a8a 0%, #1e3a8a 50%, #f3f4f6 50%, #f3f4f6 100%);
  padding:90px 16px 100px;
}
.uc-benefits .uc-card{
  position:relative;
  z-index:1;
  max-width:1100px;
  margin:0 auto;
  padding:32px 16px 36px;
  background:#fff;
  box-shadow:0 20px 50px rgba(15,23,42,.1);
  border-radius:18px;
}
.uc-benefits h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:30px;
  margin:0 0 14px;
  color:#0f172a;
}
.uc-benefits-card{
  margin-left:auto;
  margin-right:auto;
}
.uc-benefits-lede{
  margin:0 0 24px;
  font-size:16px;
  line-height:1.6;
  color:#333333;
}
.uc-benefits-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:16px 32px;
  align-items:start;
}
.uc-checklist{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}
.uc-checklist li{
  position:relative;
  padding-left:32px;
  color:#0f172a;
}
.uc-checklist li:before{
  content:"";
  position:absolute;
  left:0;
  top:4px;
  width:20px;
  height:20px;
  background:url("https://23263666.fs1.hubspotusercontent-na1.net/hubfs/23263666/karma/Body%20Copy%20Bullet%20Check%20Icon.png") center/contain no-repeat;
}

.uc-faq{
  padding:48px 16px;
  background:#f3f4f6;
}
.uc-faq h2{
  font-family:"Outfit","Inter",sans-serif;
  font-size:30px;
  margin:0 0 60px;
  color:#0f172a;
}
.uc-faq-card{
  max-width:1100px;
  margin:0 auto;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  box-shadow:0 20px 50px rgba(15,23,42,.08);
  overflow:hidden;
}
.uc-faq-card details{
  border-bottom:1px solid #e5e7eb;
  padding:18px 24px;
}
.uc-faq-card details:last-child{ border-bottom:0; }
.uc-faq-card summary{
  cursor:pointer;
  font-weight:700;
  color:#0f172a;
  position:relative;
  padding-left:28px;
}
.uc-faq-card summary::-webkit-details-marker{ display:none; }
.uc-faq-card summary::marker{ content:""; display:none; }
.uc-faq-card summary::before{
  content:"+";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  color:#1e3a8a;
  font-size:20px;
  font-weight:700;
}
.uc-faq-card details[open] summary::before{ content:"-"; }
.uc-faq-card p{
  color:#475569;
  margin:8px 0 0;
  padding-left:28px;
}

.uc-tiles{
  padding:32px 16px 60px;
  background:#f3f4f6;
}
.uc-tiles-inner{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
@media (max-width: 900px){
  .uc-tiles-inner{ grid-template-columns:1fr; }
}
.uc-tile{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(15,23,42,.08);
  padding:26px;
  text-align:center;
  font-weight:600;
  color:#0f172a;
}
.uc-tile-link{
  text-decoration:none;
  color:inherit;
  transition:box-shadow .2s ease, transform .2s ease;
}
.uc-tile-link:hover{
  transform:translateY(-3px);
  box-shadow:0 15px 35px rgba(15,23,42,.12);
}
.uc-ico{
  display:block;
  margin:0 auto 10px;
}
.uc-ico img{
  width:40px;
  height:40px;
  display:block;
  margin:0 auto;
}

/* Modern card layout (matches pay-as-you-go updates) */
.uc-modern-card{
  border-radius:14px !important;
  overflow:hidden !important;
  padding:0 !important;
  border:1px solid #d6dce7 !important;
  box-shadow:0 16px 36px rgba(10,37,64,0.15) !important;
  background:#fff !important;
}
.uc-modern-top{
  display:flex;
  min-height:46px;
  background:#cfe2ff;
  color:#0f172a;
  font:700 14px/1.2 "Inter", var(--sans);
  border-radius:14px 14px 0 0;
  overflow:hidden;
}
.uc-modern-title,
.uc-modern-term{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 10px;
}
.uc-modern-title{ flex:1 1 60%; }
.uc-modern-term{
  flex:0 0 40%;
  background:#3b82f6;
  color:#fff;
}
.uc-modern-body{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:20px;
  padding:24px 22px 18px;
  background:#f7f9fd;
  align-items:center;
}
.uc-modern-col{
  display:flex;
  flex-direction:column;
  gap:12px;
  justify-content:center;
}
.uc-modern-col-left{
  text-align:left;
}
.uc-modern-logo{
  max-width:170px;
  width:100%;
  height:auto;
}
.uc-modern-copy{
  margin:0;
  color:#0f172a;
  font:400 14px/1.5 "Inter", var(--sans);
}
.uc-modern-divider{
  width:1px;
  height:100%;
  background:#d7dce5;
}
.uc-modern-col-right{
  align-items:center;
  text-align:center;
}
.uc-modern-rate{
  font:700 32px/1 "Outfit","Inter",sans-serif;
  color:#0ea44b;
}
.uc-modern-cent{
  font-size:22px;
  vertical-align:text-top;
}
.uc-modern-rate-sub{
  font-size:12px;
  color:#6b7280;
  margin-bottom:10px;
}
.uc-modern-badge{
  display:inline-block;
  background:#e3f6eb;
  color:#047857;
  padding:8px 14px;
  border-radius:8px;
  font-weight:600;
  margin-bottom:12px;
}
.uc-modern-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 24px;
  background:#0b0b0b;
  color:#fff;
  border-radius:6px;
  font-weight:700;
  text-decoration:none;
  margin-bottom:10px;
}
.uc-modern-cta:hover{
  background:#111827;
}
.uc-modern-phone{
  color:#6b7280;
  font-size:12px;
}
.uc-modern-bottom{
  background:#e6edff;
  padding:10px 14px;
  border-radius:0 0 14px 14px;
}
.uc-modern-details{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:100%;
  background:transparent;
  border:0;
  font-weight:700;
  color:#1d4ed8;
  cursor:pointer;
}
.uc-modern-details .chev{
  transition:transform .2s ease;
}
.uc-modern-details[aria-expanded="true"] .chev{
  transform:rotate(180deg);
}

@media (max-width: 900px){
  .uc-modern-body{
    grid-template-columns:1fr;
    text-align:center;
  }
  .uc-modern-divider{ display:none; }
  .uc-modern-col-left,
  .uc-modern-col-right{ align-items:center; }
  .uc-modern-top{
    flex-direction:column;
    text-align:center;
  }
  .uc-modern-title,
  .uc-modern-term{
    width:100%;
    flex:1 1 auto;
  }
}

/* Pay-as-you-go section spacing */
.uc-hero{
  padding-bottom:36px;
}
.uc-intro{
  padding-bottom:88px;
}
.uc-plan-section{
  padding-bottom:92px;
}
.uc-cta{
  padding-bottom:104px;
}
.uc-benefits{
  padding-bottom:144px;
}
.uc-faq{
  padding-bottom:88px;
}
.pyg-tiles{
  padding-bottom:96px;
}

/* Pay-as-you-go headline/subhead/button spacing */
.uc-label{
  margin-bottom:12px;
}
.uc-title{
  margin-bottom:14px;
}
.uc-lede{
  margin-bottom:28px;
}
.uc-hero-actions{
  margin-top:6px;
}
.pyg-title{
  margin-bottom:28px;
}
.pyg-hero-text{
  margin-bottom:26px;
}
.pyg-intro-copy h2{
  margin-bottom:16px;
}
.pyg-intro-copy h3{
  margin:22px 0 10px;
}
.pyg-cta-wrap h2{
  margin-bottom:28px;
}
.uc-cta-card h2{
  margin-bottom:28px;
}

/* ==========================================================================
   PYG FEATURED CARDS - Responsive layout
   ========================================================================== */

/* Base styles - centered container */
.pyg-plan-grid .featured-carousel-section {
  width: 100% !important;
  overflow: visible !important;
  display: flex !important;
  justify-content: center !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

.pyg-plan-grid .featured-swiper {
  width: 100% !important;
  max-width: 1100px !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
}

.pyg-plan-grid .featured-swiper .swiper-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 24px !important;
  width: 100% !important;
  overflow: visible !important;
  transform: none !important;
}

.pyg-plan-grid .featured-swiper .swiper-slide {
  width: 100% !important;
  max-width: 340px !important;
  height: auto !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  transform: none !important;
  display: flex !important;
  justify-content: center !important;
}

.pyg-plan-grid .business-card {
  width: 100% !important;
  max-width: 520px !important;
  margin: 0 !important;
}

/* Large screens - 3 cards in a row */
@media (min-width: 1100px) {
  .pyg-plan-grid .featured-swiper .swiper-slide {
    width: calc(33.333% - 16px) !important;
    max-width: 340px !important;
  }
}

/* Medium screens - 2 cards in a row */
@media (min-width: 720px) and (max-width: 1099px) {
  .pyg-plan-grid .featured-swiper .swiper-slide {
    width: calc(50% - 12px) !important;
    max-width: 340px !important;
  }
}

/* Small screens - single column */
@media (max-width: 719px) {
  .pyg-plan-grid .featured-swiper .swiper-slide {
    width: 100% !important;
    max-width: 360px !important;
  }

  .pyg-plan-grid .business-card {
    max-width: 360px !important;
  }
}

/* ==========================================================================
   MOBILE STYLES FOR PYG PAGE (max-width: 470px)
   ========================================================================== */

@media (max-width: 470px) {
  /* Ensure page doesn't scroll horizontally */
  .uc-plan-section,
  .pyg-plan-section,
  .uc-plan-grid,
  .pyg-plan-grid,
  .uc-plan-grid .featured-swiper,
  .pyg-plan-grid .featured-swiper,
  .uc-plan-grid .swiper-wrapper,
  .pyg-plan-grid .swiper-wrapper {
    overflow-x: hidden !important;
    overflow: visible !important;
    touch-action: pan-y !important;
  }

  /* Center the plan section */
  .uc-plan-section,
  .pyg-plan-section {
    padding: 32px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .uc-plan-head,
  .pyg-plan-head {
    padding: 0 !important;
    text-align: center !important;
    width: 100% !important;
  }

  .uc-plan-grid,
  .pyg-plan-grid {
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }

  .uc-plan-grid .featured-carousel-section,
  .pyg-plan-grid .featured-carousel-section {
    padding: 0 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Stack cards vertically on mobile */
  .uc-plan-grid .featured-swiper,
  .pyg-plan-grid .featured-swiper {
    width: 100% !important;
    margin: 0 auto !important;
  }

  .uc-plan-grid .featured-swiper .swiper-wrapper,
  .pyg-plan-grid .featured-swiper .swiper-wrapper {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    transform: none !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 auto !important;
    left: 0 !important;
  }

  .uc-plan-grid .swiper-slide,
  .pyg-plan-grid .swiper-slide {
    max-width: 340px !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    margin: 0 auto !important;
    left: 0 !important;
  }

  .uc-plan-grid .business-card,
  .pyg-plan-grid .business-card {
    margin: 0 auto !important;
    width: 100% !important;
    max-width: 340px !important;
    overflow: visible !important;
  }

  /* Hide swiper pagination on mobile when stacked */
  .uc-plan-grid .featured-pagination,
  .pyg-plan-grid .featured-pagination {
    display: none !important;
  }

  /* Center other page sections */
  .pyg-hero,
  .uc-hero {
    padding: 24px 16px 0 !important;
  }

  .pyg-intro,
  .uc-intro {
    padding: 24px 16px !important;
  }

  .pyg-cta-banner,
  .uc-cta {
    padding: 24px 16px !important;
  }

  .pyg-benefits,
  .uc-benefits {
    padding: 24px 16px !important;
  }

  .pyg-faq,
  .uc-faq {
    padding: 24px 16px !important;
  }
}