/* Start custom CSS *//* ===== Finance page (Figma 349:996) =====
   Sizes are Figma px at 1920 wide, scaled with clamp()/vw. Banner + CTA reuse the kit's cpn-banner / cpn-cta classes. */

/* ---------- Brand rings (Figma "Brand ring": 584px circle, 81.6px #EBF6FC band) ---------- */
body .elementor .cpn-fin-ring{position:absolute;z-index:0;width:30.432vw;min-width:0;aspect-ratio:1;padding:0;border:4.251vw solid #EBF6FC;border-radius:50%;pointer-events:none}
body .elementor .cpn-fin-ring-a{left:26.808vw;top:-21.5vw}
body .elementor .cpn-fin-ring-b{left:85.13vw;top:15.08vw}

/* ---------- Intro: text + tilted photo ---------- */
body .elementor .cpn-fin-intro{position:relative;padding:clamp(56px,6.198vw,119px) 0 clamp(64px,9.74vw,187px)}
body .elementor .cpn-fin-intro-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,748fr) minmax(0,688fr);column-gap:clamp(40px,13.28vw,255px);align-items:end}
body .elementor .cpn-fin-text{display:flex;flex-direction:column;align-items:flex-start;padding:0;min-width:0}
body .elementor .cpn-fin-text .cpn-h2{margin-top:11px;line-height:1.21}
body .elementor .cpn-fin-text .cpn-lead{margin-top:clamp(18px,1.458vw,28px)}
body .elementor .cpn-fin-text .cpn-lead + .cpn-lead{margin-top:1.317em}
body .elementor .cpn-fin-tilt{position:relative;isolation:isolate;padding:0;min-width:0;margin-inline-end:2.135vw}
/* Elementor makes every .e-con::before an absolute overlay layer; here that's what we want */
body .elementor .cpn-fin-tilt::before{content:"";position:absolute;z-index:-1;inset:-1.9% -2.7%;width:auto;height:auto;background:#EBF6FC;border-radius:clamp(20px,1.823vw,35px);transform:rotate(-4.66deg)}
body .elementor .cpn-fin-tilt .cpn-fin-tilt-img{display:block;width:100%;height:auto;aspect-ratio:688.461 / 525.791;object-fit:cover;object-position:60% center;border-radius:clamp(20px,1.823vw,35px)}

/* ---------- A Simpler Way to Plan Your Pool ---------- */
body .elementor .cpn-fin-plan{position:relative;z-index:1;padding:clamp(56px,4.51vw,86.6px) 0 clamp(56px,5.78vw,111px);background:#EBF6FC}
body .elementor .cpn-fin-plan-grid{display:grid;grid-template-columns:minmax(0,595fr) minmax(0,971fr);column-gap:clamp(32px,7.34vw,141px)}
body .elementor .cpn-fin-plan-text{display:flex;flex-direction:column;align-items:flex-start;padding:0;min-width:0}
body .elementor .cpn-fin-plan-text .cpn-h2{margin-top:6px;line-height:1.16}
body .elementor .cpn-fin-plan-text .cpn-lead{max-width:595px;margin-top:clamp(16px,1.2vw,23px)}
body .elementor .cpn-fin-plan-text .cpn-fin-plan-img{display:block;width:100%;max-width:478.906px;height:auto;aspect-ratio:478.906 / 298.125;margin-top:auto;object-fit:cover;border-radius:clamp(24px,2.262vw,43.426px)}
body .elementor .cpn-fin-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,1.59vw,30.5px) clamp(16px,1.87vw,35.9px);padding:0;min-width:0;margin-inline-end:1.6vw}
body .elementor .cpn-fin-card{display:flex;flex-direction:column;align-items:flex-start;min-height:clamp(180px,12.005vw,230.5px);padding:clamp(22px,1.636vw,31.4px) clamp(22px,2.469vw,47.4px) clamp(22px,1.64vw,31.5px);border-radius:clamp(24px,2.187vw,42px);background:#fff}
body .elementor .cpn-fin-card-icon{display:grid;place-items:center;flex:none;width:clamp(38px,2.325vw,44.648px);min-width:0;aspect-ratio:1;padding:0;border-radius:50%;background:linear-gradient(178.3deg,#85DDFF 0%,#30C6FF 50.5%,#00A4E1 100%)}
body .elementor .cpn-fin-card-icon .cpn-fin-glyph{display:block;width:58%;height:58%;object-fit:contain}
body .elementor .cpn-fin-card-icon .cpn-fin-pct{font-family:"Host Grotesk",sans-serif;font-size:clamp(19px,1.237vw,23.75px);font-weight:600;line-height:1;letter-spacing:-0.02em;color:#fff}
body .elementor .cpn-fin-card-title{margin-top:clamp(8px,.54vw,10.4px);font-family:"Host Grotesk",sans-serif;font-size:clamp(20px,1.4625vw,28.078px);font-weight:700;line-height:1.45;letter-spacing:-0.02em;color:#169EEB}
body .elementor .cpn-fin-card-text{max-width:372.617px;margin-top:clamp(4px,.5vw,9.6px);font-family:"Host Grotesk",sans-serif;font-size:clamp(15px,1.121vw,21.526px);line-height:1.45;letter-spacing:-0.02em;color:rgba(22,158,235,.58)}

/* ---------- Fast & Easy Application Process ---------- */
body .elementor .cpn-fin-apply{position:relative;overflow-x:clip;padding:clamp(64px,10.26vw,197px) 0 clamp(72px,9.9vw,190px)}
body .elementor .cpn-fin-apply-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,636fr) minmax(0,560fr) minmax(0,452fr);column-gap:clamp(12px,.807vw,15.5px);align-items:start}
body .elementor .cpn-fin-apply-text{display:flex;flex-direction:column;align-items:flex-start;padding:0;min-width:0;margin-inline-end:clamp(24px,2.55vw,49px)}
body .elementor .cpn-fin-apply-text .cpn-h2{margin-top:11px;line-height:1.17}
body .elementor .cpn-fin-apply-text .cpn-lead{max-width:550px;margin-top:clamp(20px,1.72vw,33px);line-height:1.4}
/* Accordion = native <details>; Figma: open item solid blue, closed items pale with a hairline border */
body .elementor .cpn-fin-acc{display:flex;flex-direction:column;gap:clamp(8px,.443vw,8.5px);padding:0;min-width:0}
body .elementor .cpn-fin-acc-item{overflow:hidden;padding:0;border:1.05px solid rgba(22,158,235,.3);border-radius:clamp(20px,1.719vw,33px);background:rgba(236,248,254,.55);transition:background-color var(--cpn-dur,.32s),border-color var(--cpn-dur,.32s)}
body .elementor .cpn-fin-acc-item[open]{background:#169EEB;border-color:#169EEB}
body .elementor .cpn-fin-acc-head{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:clamp(64px,5.49vw,105.4px);padding:clamp(14px,1.34vw,25.7px) clamp(16px,2.135vw,41px) clamp(14px,1.34vw,25.7px) clamp(18px,2.036vw,39px);list-style:none;cursor:pointer}
body .elementor .cpn-fin-acc-head::-webkit-details-marker{display:none}
body .elementor .cpn-fin-acc-head::after{content:"";position:static;flex:none;width:clamp(32px,2.224vw,42.695px);aspect-ratio:1;border-radius:50%;
  background:#169EEB url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.6881 13.5367' fill='none'%3E%3Cpath d='M1.595 1.595L9.844 11.942L18.093 1.595' stroke='white' stroke-width='3.19' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center 54%/46% auto no-repeat}
body .elementor .cpn-fin-acc-item[open] .cpn-fin-acc-head{align-items:flex-start;padding-top:clamp(18px,1.79vw,34.4px);padding-bottom:clamp(8px,.75vw,14.4px)}
body .elementor .cpn-fin-acc-item[open] .cpn-fin-acc-head::after{margin-top:3px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.6881 13.5367' fill='none'%3E%3Cpath d='M1.595 1.595L9.844 11.942L18.093 1.595' stroke='%23169EEB' stroke-width='3.19' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center 54%/46% auto no-repeat}
body .elementor .cpn-fin-acc-q{font-family:"Host Grotesk",sans-serif;font-size:clamp(17px,1.198vw,23px);font-weight:400;line-height:1.18;letter-spacing:-0.02em;color:#0079C1}
body .elementor .cpn-fin-acc-q strong{font-weight:700}
body .elementor .cpn-fin-acc-item[open] .cpn-fin-acc-q{font-size:clamp(18px,1.302vw,25px);font-weight:500;line-height:1.317;color:#fff}
body .elementor .cpn-fin-acc-item[open] .cpn-fin-acc-q strong{font-weight:800}
body .elementor .cpn-fin-acc-body{padding:0 clamp(16px,1.615vw,31px) clamp(20px,2vw,38.4px) clamp(18px,2.036vw,39px)}
body .elementor .cpn-fin-acc-a{font-family:"Host Grotesk",sans-serif;font-size:clamp(14px,.833vw,16px);line-height:1.52;letter-spacing:-0.02em;color:#fff}
body .elementor .cpn-fin-apply-grid .cpn-fin-apply-img{display:block;box-sizing:border-box;width:100%;height:auto;aspect-ratio:451.84 / 477.07;object-fit:cover;object-position:67% 100%;border:clamp(6px,.533vw,10.235px) solid #fff;border-radius:clamp(20px,1.719vw,33px)}

/* ---------- Responsive ---------- */
@media (max-width:1279px){
  body .elementor .cpn-fin-plan-grid{grid-template-columns:1fr;row-gap:40px}
  body .elementor .cpn-fin-plan-text .cpn-fin-plan-img{margin-top:32px}
  body .elementor .cpn-fin-cards{margin-inline-end:0}
  body .elementor .cpn-fin-apply-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;row-gap:32px}
  body .elementor .cpn-fin-apply-text{grid-column:1;margin-inline-end:0}
  body .elementor .cpn-fin-acc{grid-column:1}
  body .elementor .cpn-fin-apply-grid .cpn-fin-apply-img{grid-column:2;grid-row:1 / span 2;align-self:center}
}
@media (max-width:1024px){
  body .elementor .cpn-fin-intro-grid{grid-template-columns:1fr;row-gap:56px}
  body .elementor .cpn-fin-tilt{max-width:688px;margin:0 24px}
  body .elementor .cpn-fin-apply-grid{grid-template-columns:1fr}
  body .elementor .cpn-fin-apply-grid .cpn-fin-apply-img{grid-column:1;grid-row:auto;max-width:560px}
  body .elementor .cpn-fin-ring-b{display:none}
}
@media (max-width:767px){
  body .elementor .cpn-h2 br{display:none} /* Figma line breaks are for wide screens */
  body .elementor .cpn-fin-ring{display:none}
  body .elementor .cpn-fin-cards{grid-template-columns:1fr}
  body .elementor .cpn-fin-card{min-height:0}
  body .elementor .cpn-fin-tilt{margin:0 12px}
}
/* QA-BLOCK */
/* QA 2026-10-30: more room between the "Fast & Easy" text column and the accordion (Figma 349:996: 52px from the heading, 138px from the body text at 1920) */
@media (min-width:1025px){
  body .elementor .cpn-fin-apply-grid{grid-template-columns:minmax(0,600fr) clamp(36px,3.6vw,70px) minmax(0,560fr) minmax(0,452fr)}
  body .elementor .cpn-fin-apply-grid > .cpn-fin-apply-text{grid-column:1;margin-inline-end:0}
  body .elementor .cpn-fin-apply-grid > .cpn-fin-acc{grid-column:3}
  body .elementor .cpn-fin-apply-grid > :last-child:not(.cpn-fin-acc):not(.cpn-fin-apply-text){grid-column:4}
  body .elementor .cpn-fin-apply-text .cpn-lead{max-width:min(100%,500px)}
}
/* /QA-BLOCK *//* End custom CSS */