body{margin:0}

body {
  display: grid !important;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: auto;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: auto !important;
  box-sizing: border-box;
}
/* Drop any inline grid-row placements that leave empty rows behind —
   sections always auto-flow vertically, only their column placement
   is user-controlled. */
body > * {
  min-width: 0; min-height: 0;
  grid-column: 1 / -1;
  grid-row: auto !important;
  max-width: 100%;
}
/* Media never overflows its container on a narrow viewport. */
body img, body video, body iframe, body svg {
  max-width: 100%;
  height: auto;
}
/* Mirrors the editor preview's mobile chrome (page_editor_controller.js
   GRID_CSS @media block) so what the owner sees in the iframe is what
   phone visitors see. The corpus's per-section CSS rarely ships its own
   mobile rules; these blanket overrides — !important so they win over
   the section-scoped class declarations — keep typography readable,
   padding sane, and inner grids / flex rows collapsed to a single
   column under 768px. */
@media (max-width: 768px) {
  body {
    grid-template-columns: 1fr !important;
  }
  body > * {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
  body > section {
    padding-left:  clamp(14px, 4vw, 28px) !important;
    padding-right: clamp(14px, 4vw, 28px) !important;
    padding-top:    clamp(28px, 7vw, 56px) !important;
    padding-bottom: clamp(28px, 7vw, 56px) !important;
  }
  body > section h1 {
    font-size: clamp(26px, 8vw, 40px) !important;
    line-height: 1.15 !important;
    word-wrap: break-word;
  }
  body > section h2 {
    font-size: clamp(22px, 6.5vw, 32px) !important;
    line-height: 1.2 !important;
  }
  body > section h3 {
    font-size: clamp(18px, 5vw, 24px) !important;
    line-height: 1.25 !important;
  }
  body > section[style*="grid"],
  body > section {
    grid-template-columns: 1fr !important;
  }
  body > section [style*="display: flex"],
  body > section [style*="display:flex"] {
    flex-wrap: wrap !important;
  }
}

.hero-saas-product-1 {
    padding:80px 32px 0;
    background:linear-gradient(180deg,#F4F2FF,#fff);
    font-family:system-ui,sans-serif;
    color:#0F0A2E;
    text-align:center;
    overflow:hidden;
  }
  .hero-saas-product-2 {
    max-width:780px;
    margin:0 auto;
  }
  .hero-saas-product-3 {
    display:inline-block;
    padding:4px 12px;
    background:#E9E4FF;
    color:#6E56CF;
    border-radius:20px;
    font-size:12px;
    font-weight:500;
    margin:0 0 18px;
  }
  .hero-saas-product-4 {
    font-size:54px;
    line-height:1.05;
    margin:0 0 16px;
    letter-spacing:-.02em;
  }
  .hero-saas-product-5 {
    color:#5A5670;
    line-height:1.6;
    margin:0 0 26px;
    font-size:17px;
  }
  .hero-saas-product-6 {
    display:flex;
    gap:10px;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:48px;
  }
  .hero-saas-product-7 {
    padding:14px 26px;
    background:#6E56CF;
    color:#fff;
    text-decoration:none;
    border-radius:8px;
    font-weight:600;
  }
  .hero-saas-product-8 {
    padding:14px 26px;
    color:#0F0A2E;
    text-decoration:none;
    border-radius:8px;
  }
  .hero-saas-product-9 {
    max-width:920px;
    margin:0 auto;
    aspect-ratio:16/9;
    background:linear-gradient(160deg,#EAE6FF,#C6BBF5);
    border-radius:14px 14px 0 0;
    border:1px solid #D8D2F2;
    border-bottom:0;
  }

.features-three-up-1 {
    padding:64px 24px;
    background:#fff;
    font-family:system-ui,sans-serif;
    color:#1B1B1B;
  }
  .features-three-up-2 {
    max-width:960px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:32px;
  }
  .features-three-up-3 {
    width:36px;
    height:36px;
    border-radius:8px;
    background:#FFE7D6;
    color:#A55B2D;
    display:grid;
    place-items:center;
    font-weight:600;
    margin-bottom:14px;
  }
  .features-three-up-4 {
    margin:0 0 6px;
    font-size:17px;
  }
  .features-three-up-5 {
    margin:0;
    color:#666;
    font-size:14px;
    line-height:1.6;
  }
  .features-three-up-6 {
    width:36px;
    height:36px;
    border-radius:8px;
    background:#E5EDF6;
    color:#2D5BA5;
    display:grid;
    place-items:center;
    font-weight:600;
    margin-bottom:14px;
  }
  .features-three-up-7 {
    width:36px;
    height:36px;
    border-radius:8px;
    background:#E8F0E5;
    color:#3F7A36;
    display:grid;
    place-items:center;
    font-weight:600;
    margin-bottom:14px;
  }

.testimonials-three-cards-1 {
    padding:64px 24px;
    background:#F8F6F2;
    font-family:system-ui,sans-serif;
    color:#1B1B1B;
  }
  .testimonials-three-cards-2 {
    max-width:1080px;
    margin:0 auto;
  }
  .testimonials-three-cards-3 {
    font-size:28px;
    margin:0 0 28px;
    text-align:center;
    letter-spacing:-.01em;
  }
  .testimonials-three-cards-4 {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:18px;
  }
  .testimonials-three-cards-5 {
    margin:0;
    padding:24px;
    background:#fff;
    border-radius:10px;
    border:1px solid #eee;
  }
  .testimonials-three-cards-6 {
    font-size:15px;
    line-height:1.6;
    color:#444;
    margin:0 0 16px;
  }
  .testimonials-three-cards-7 {
    display:flex;
    align-items:center;
    gap:10px;
  }
  .testimonials-three-cards-8 {
    width:32px;
    height:32px;
    border-radius:50%;
    background:linear-gradient(135deg,#FFB088,#FF7A45);
  }
  .testimonials-three-cards-9 {
    font-size:13.5px;
    font-weight:500;
  }
  .testimonials-three-cards-10 {
    font-size:11.5px;
    color:#888;
  }
  .testimonials-three-cards-11 {
    width:32px;
    height:32px;
    border-radius:50%;
    background:linear-gradient(135deg,#A8C3CB,#5C8A95);
  }
  .testimonials-three-cards-12 {
    width:32px;
    height:32px;
    border-radius:50%;
    background:linear-gradient(135deg,#C7B5E0,#7B61B5);
  }

.footer-credits-1 {
    padding:36px 24px;
    background:#FAFAF7;
    color:#888;
    font-family:system-ui,sans-serif;
    font-size:13px;
    text-align:center;
    border-top:1px solid #eee;
  }
  .footer-credits-2 {
    max-width:680px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
  }
  .footer-credits-3 {
    color:#888;
    text-decoration:none;
    margin:0 10px;
  }