/* "See pricing" lead pages (inc/see-price/page.php). Values = live's Elementor post-45406.css (== post-41369)
   plus the Astra / Elementor-kit defaults measured on live 2026-09-28. Content box = the house 1340
   container (1400 max, 30px gutters) - live runs full-bleed to 1440, not chased (CLAUDE.md "Never widen").
   Never write a star-slash inside a comment in this file. */

/* Live: the HubSpot form injects Google Poppins 400/500/700 faces AFTER the theme faces, so on live every
   600 run (lead h6, plan names) resolves to the injected 700 (true Bold) - measured: the lead h6 wraps
   after "Seamless Team" on live. Mirror that for this page only. */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap;
             src: url(../assets/fonts/Poppins/woff2/Poppins-Bold.woff2) format('woff2'), url(../assets/fonts/Poppins/Poppins-Bold.ttf) format('truetype'); unicode-range: U+018F, U+0192, U+01FC-01FD, U+0218-021B, U+0259, U+02C7, U+02C9, U+02D8-02D9, U+02DB, U+02DD, U+03C0, U+0901-0903, U+0905-090D, U+090F-0911, U+0913-0928, U+092A-0933, U+0935-0939, U+093C-0945, U+0947-0949, U+094B-094D, U+0950, U+0958-095E, U+0960-0970, U+0972, U+1E80-1E85, U+1EBC-1EBD, U+1EF2-1EF3, U+1EF8-1EF9, U+20A8, U+20BA, U+20BD, U+2113, U+2126, U+212E, U+2202, U+2206, U+220F, U+2211, U+2219-221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+25CC, U+FB01-FB02; }@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap;
             src: url(../assets/fonts/Poppins/woff2/Poppins-Bold-latin.woff2) format('woff2'); unicode-range: U+0020-007E, U+00A0-0107, U+010A-011B, U+011E-0123, U+0128-0131, U+0136-0137, U+0139-0148, U+014C-015B, U+015E-0165, U+0168-017E, U+02BC, U+02C6, U+02DA, U+02DC, U+200C-200D, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+20B9, U+2122, U+2212, U+2215; }

.spr {
    font-family: "Poppins", sans-serif; font-size: 16px; line-height: 1.65; color: #000;   /* Astra body: unitless 1.65 */
    margin: 80px 0 47px;               /* live: 80px margin, minus #primary's -33px footer overlap */
}
.spr * { box-sizing: border-box; }
.spr-box { position: relative; max-width: 1400px; margin: 0 auto; padding: 0 30px; display: flex; flex-direction: column; gap: 20px; }

/* ed04f59 - lead h6 (80% of live's box = 1140 at 1440, 1152 at 1920) */
.spr-head { align-self: center; width: min(100%, 1152px, 79.2vw); text-align: center; }
.spr-head h6 { margin: 0; padding: 0; font-family: "Poppins", sans-serif; font-size: 28px; font-weight: 600; line-height: 1.5; letter-spacing: normal; color: #141414; text-transform: none; }

/* 0a8a186 - desktop card grid */
.spr-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.spr-card { display: flex; flex-direction: column; gap: 10px; padding: 20px; border: 1px solid rgba(20, 20, 43, .1); border-right-width: 0; }
.spr-card:first-child { border-radius: 20px 0 0 20px; }
.spr-card:last-child { border-right-width: 1px; border-radius: 0 20px 20px 0; }

/* icon box (33c27fb ...) */
.spr-ib { display: flex; align-items: center; gap: 8px; padding: 0 0 10px; }
.spr-ib-ic { display: inline-flex; flex: 0 0 auto; font-size: 20px; line-height: 1; }
.spr-ib-ic svg { display: block; width: 1em; height: 1em; }
.spr .spr-ib-t { flex-grow: 1; margin: 0; padding: 0; font-family: "Poppins", sans-serif; font-size: 14px; font-weight: 600; line-height: 1.3; letter-spacing: normal; color: #0161ff; }

/* card body (4e9e493 ...) - live .blurOut */
.spr-body { display: flex; flex-direction: column; gap: 10px; flex-grow: 1; flex-shrink: 0; }
.spr .blurOut { filter: blur(10px); }
.spr-price h5 { margin: 0; padding: 0; font-family: "Poppins", sans-serif; font-size: 30px; font-weight: 700; line-height: 1em; letter-spacing: normal; color: #141414; }
.spr-price h5 span { font-size: 16px; font-weight: 400; }
.spr-txt { font-size: 12px; line-height: 2em; color: rgba(20, 20, 43, .4); }
.spr-txt p { margin: 0; font-size: inherit; line-height: inherit; color: inherit; }
.spr-div { height: 1px; border-top: 1px solid rgba(20, 20, 43, .1); }

/* icon lists (e67c11b ... and the accordion's ff16bdf ...) */
.spr-list { list-style: none; margin: 0; padding: 20px 0 0; }
.spr-list li { display: flex; margin: 0; padding: 0; }
.spr-list li:not(:last-child) { padding-bottom: 11.5px; }
.spr-list li:not(:first-child) { margin-top: 11.5px; }
.spr-li-ic { display: flex; flex: 0 0 auto; align-self: flex-start; margin-top: 6px; padding-right: 10px; }
.spr-li-ic svg { display: block; width: 14px; height: 14px; margin-right: 3.5px; fill: rgba(128, 131, 185, .8); }
.spr-li-tx { padding-left: 5px; font-size: 14px; font-weight: 400; line-height: 1.3; color: #14142b; }

/* d7d9aab / f18a2d1 - accordion (<=1024px only), whole container blurred */
.spr-acc { display: none; filter: blur(10px); padding: 20px; }
.spr-acc-item { position: relative; display: flex; flex-direction: column; margin: 0; }
.spr-acc-t { position: static; display: flex; justify-content: space-between; align-items: center; gap: 0 10px; padding: 10px; border: 1px solid #d5d8dc; border-radius: 10px; color: #1f2124; list-style: none; cursor: pointer; }
.spr-acc-t::-webkit-details-marker { display: none; }
.spr-acc-item[open] > .spr-acc-t { border-radius: 10px 10px 0 0; }
.spr-acc-hd { display: flex; }
.spr-acc-ic { position: absolute; top: 10px; right: 10px; display: flex; align-items: center; font-size: 25px; }
.spr-acc-ic svg { display: block; width: 1em; height: 1em; fill: #14142b; }
.spr-acc-o { display: none; }
.spr-acc-item[open] .spr-acc-o { display: flex; }
.spr-acc-item[open] .spr-acc-c { display: none; }
.spr-acc-body { display: flex; flex-direction: column; border: 0 solid rgba(20, 20, 43, .1); }
/* live f18a2d1 custom css (pricing-card) */
.spr .plan-header { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.spr .plan-header .icon { position: relative; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 4px;
    background: url(https://dahqbtk1vlskk.cloudfront.net/wp-content/uploads/2025/09/02060109/solar_leaf-outline.svg); }
.spr .plan-name { font-size: 16px; font-weight: 600; color: #0161ff; }
.spr .price-section { margin-bottom: 16px; }
.spr .price { font-size: 28px; font-weight: 800; color: #1a1a1a; line-height: 1; }
.spr .period { font-size: 16px; font-weight: 400; color: #666; margin-left: 2px; }
.spr .users-info { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 8px; line-height: 1.4; }
.spr .description { font-size: 12px; color: #888; font-style: italic; line-height: 1.4; }

/* a1ad569 / a0c5d62 - form card over the cards, bottom-aligned to the band's padding box */
.spr-formwrap { position: absolute; z-index: 2; bottom: 0; left: 50%; transform: translateX(-50%); width: 700px; max-width: 100%; }
.spr-form { background: #fff; padding: 20px; border: 1px solid rgba(1, 97, 255, .08); border-radius: 20px; box-shadow: 0 5px 20px 0 rgba(0, 0, 0, .16); }

/* live site-level HubSpot rules (Elementor custom code, global on live) - inner parts only */
.spr-form .hsfc-Step__Content { padding: 0 !important; }
.spr-form .hsfc-NavigationRow { width: max-content; float: right; }
.spr-form [data-hsfc-id="Renderer"] .hsfc-DropdownInput__Caret { right: -3px !important; padding: 0 10px !important; }
.spr-form .hsfc-DropdownInput input { padding: 10px 25px 10px 20px !important; }
.spr-form .hsfc-PhoneInput__FlagAndCaret { padding: 0 10px !important; }
.spr-form .hsfc-PhoneInput__FlagAndCaret__Flag { color: #000 !important; }
/* WordPress-core form defaults live's inputs/labels inherit (no HubSpot rule sets these), and undo
   header.css's site-wide placeholder opacity:0 */
.spr-form input[type="text"], .spr-form input[type="email"], .spr-form input[type="tel"], .spr-form input[type="number"] {
    height: 40px; line-height: 24px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
}
.spr-form textarea { line-height: 24px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05); }
.spr-form label { font-weight: 500; line-height: 20px; }
/* site body * sets Poppins on every node; live lets the form theme font cascade (Step = Helvetica) */
.spr-form :where(.hsfc-Step) { font-family: Helvetica; }
.spr-form :where(.hsfc-Step *) { font-family: inherit; }
.spr-form button { line-height: 1em; }   /* Elementor kit button line-height */
.spr-form input::placeholder, .spr-form textarea::placeholder { opacity: 1; }
@media (max-width: 600px) {
    .spr-form [data-hsfc-id="Renderer"] .hsfc-Row { grid-template-columns: auto !important; gap: 15px !important; }
}

@media (max-width: 1200px) {
    .spr-card { padding: 12px; }
    .spr-price h5 { font-size: 24px; }
    .spr-card:last-child .spr-price h5 { font-size: 23px; }
    .spr-card .spr-list li:not(:last-child) { padding-bottom: 9px; }
    .spr-card .spr-list li:not(:first-child) { margin-top: 9px; }
}
@media (max-width: 1024px) {
    .spr-grid { display: none; }
    .spr-acc { display: block; }
}
@media (max-width: 880px) {
    .spr-acc { padding: 0; }
}
@media (max-width: 767px) {
    /* live: band padding 0 0 50px, content edge-to-edge (lead text touches x=0 - a live defect);
       we keep a 15px gutter */
    .spr-box { padding: 0 15px 50px; }
    .spr-head { align-self: stretch; width: 100%; padding: 0 20px 0 0; text-align: start; }   /* live 50px from x=0; 20px keeps live's 325px line width inside our 15px gutter */
    .spr-head h6 { font-size: 20px; text-align: start; }
    .spr-acc-item { margin-bottom: 7px; }
    .spr-acc-item:last-child { margin-bottom: 0; }
    .spr-acc-t { justify-content: space-between; }
    .spr-acc-ic { font-size: 16px; }
    .spr-acc-body[data-b="f349695"] { border-width: 1px; border-radius: 0 0 10px 10px; }
    .spr-acc-body { padding: 0 20px 20px; }
    /* header.css forces label margin-bottom .5rem !important <=767px; restore HubSpot's module spacing */
    .spr-form [data-hsfc-id="Renderer"] .hsfc-FieldLabel:not(:last-child) { margin-bottom: var(--hsf-module__vertical-spacing, var(--hsf-default-module__vertical-spacing)) !important; }
    .spr-formwrap { width: 100%; }   /* live: form card spans the full viewport (its own 20px padding) */
}
/* Astra drops html font-size to 91.2% at <=544px */
@media (max-width: 544px) {
    .spr { font-size: 14.592px; }
}
