/*
 * Premier Designs 702 / 12 Oct 2026
 * Two quote pages only (#87 instant and #89 /quote).
 * Modern presentation layer: NO changes to calculator JS, field names, values,
 * prices, hidden logic, nonces, submission endpoints, or lead tracking.
 */
html body:is(.page-id-87,.page-id-89){
  --pdq-night:#111217;--pdq-purple:#7441d6;--pdq-violet:#a55fe5;
  --pdq-cyan:#4ce6f2;--pdq-ink:#172033;--pdq-muted:#50617c;
  --pdq-line:#e6e1f0;--pdq-paper:#f5f6fb;
}
html body:is(.page-id-87,.page-id-89) #main-content{
  background:linear-gradient(180deg,#eef0f9 0%,#fff 35%,#f2f1fa 100%)!important;
  overflow-x:clip!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .page-primary-header{
  margin:0!important;padding:clamp(40px,5vw,78px) 20px!important;
  background:linear-gradient(115deg,#111217 5%,#291c46 60%,#51307d 100%)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .page-primary-header .page-title,
html body:is(.page-id-87,.page-id-89) #main-content .page-primary-header .page-title *{
  color:#fff!important;max-width:940px!important;margin-inline:auto!important;
  font-size:clamp(27px,3.3vw,46px)!important;line-height:1.18!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .entry-content{min-width:0}
html body:is(.page-id-87,.page-id-89) #main-content .entry-content>.wpb-content-wrapper{
  box-sizing:border-box!important;width:100%!important;max-width:100%!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .entry-content .vc_row>.vc_column_container{
  min-width:0!important;
}

/* Instant-quote intro: dark atmospheric banner, readable text, centered measure. */
html body.page-id-87 #main-content #WebsiteCostCalculator{
  padding:clamp(32px,5vw,76px) max(16px,calc((100vw - 1180px)/2))!important;
  background:linear-gradient(125deg,#0d1427,#23153f 65%,#39235c)!important;
  border-bottom:3px solid var(--pdq-cyan)!important;
  isolation:isolate!important;
}
html body.page-id-87 #main-content #WebsiteCostCalculator>.vc_column_container,
html body.page-id-87 #main-content #WebsiteCostCalculator .vc_column-inner{
  box-sizing:border-box!important;width:100%!important;max-width:1180px!important;margin-inline:auto!important;
}
html body.page-id-87 #main-content #WebsiteCostCalculator .wpb_text_column{
  max-width:960px!important;margin:0 auto 18px!important;
}
html body.page-id-87 #main-content #WebsiteCostCalculator :is(h1,h2,h1 *,h2 *){
  color:#fff!important;font-size:clamp(24px,2.6vw,37px)!important;line-height:1.2!important;
  text-align:center!important;
}
html body.page-id-87 #main-content #WebsiteCostCalculator p,
html body.page-id-87 #main-content #WebsiteCostCalculator p *{
  color:#e9efff!important;font-size:clamp(15px,1.3vw,18px)!important;
  line-height:1.7!important;text-align:center!important;
}
html body.page-id-87 #main-content #WebsiteCostCalculator a{
  color:#91f3ff!important;text-decoration:underline!important;
}
/* Retire repeated SEO intro sentences; the calculator and all required fields remain intact. */
html body.page-id-87 #main-content #WebsiteCostCalculator .wpb_text_column:first-of-type>.wpb_wrapper>p:nth-of-type(n+2){
  display:none!important;
}
/* Neutralize outdated saturated background wrapping the actual form. */
html body.page-id-87 #main-content #post-87 .vc_row:has(>.vc_column_container .pd702-iwq){
  background:linear-gradient(180deg,#f0eff9,#f8f9fc)!important;
  padding:clamp(24px,4vw,58px) clamp(14px,3vw,40px)!important;
}
html body.page-id-87 #main-content #post-87 .vc_row:has(>.vc_column_container .pd702-iwq)>.vc_column_container>.vc_column-inner{
  background:transparent!important;
}
html body.page-id-89 #main-content #post-89 .pd702-quote-premium{
  background:linear-gradient(180deg,#eff0f9,#f7f8fd)!important;
  padding:clamp(26px,5vw,62px) 16px!important;
}

/* Same sophisticated form surface on both versions, centered, bounded and mobile-safe. */
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq{
  display:block!important;box-sizing:border-box!important;
  width:min(100%,1180px)!important;max-width:1180px!important;
  margin:0 auto clamp(28px,5vw,60px)!important;
  color:var(--pdq-ink)!important;background:#fff!important;
  border:1px solid #ded9ed!important;border-radius:26px!important;
  box-shadow:0 23px 70px rgba(25,20,65,.13)!important;
  overflow:visible!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq *{box-sizing:border-box!important}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-head{
  border-radius:25px 25px 0 0!important;
  padding:clamp(26px,4vw,47px)!important;
  background:linear-gradient(118deg,#101321,#291f4a 72%,#3a2a6b)!important;
  color:#fff!important;text-align:left!important;
  border-bottom:4px solid var(--pdq-cyan)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-head h1{
  color:#fff!important;font-size:clamp(27px,3.35vw,43px)!important;
  margin:14px 0 12px!important;letter-spacing:-.04em!important;line-height:1.14!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-head>p,
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-head>p *{
  color:#e4eafa!important;line-height:1.65!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-badge{
  display:inline-flex!important;align-items:center!important;
  width:auto!important;padding:9px 15px!important;border-radius:999px!important;
  background:rgba(76,230,242,.12)!important;color:#97f2fc!important;
  font-size:12px!important;font-weight:800!important;letter-spacing:.08em!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-progress-meta{
  display:flex!important;justify-content:space-between!important;
  align-items:center!important;gap:12px!important;
  margin-top:22px!important;color:#fff!important;font-weight:750!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(.iwq-step-count,.iwq-step-title,.iwq-progress-percent){
  color:#fff!important;font-size:14px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-simple-progress{
  background:rgba(255,255,255,.16)!important;border-radius:99px!important;
  overflow:hidden!important;margin-top:10px!important;min-height:10px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-progress{
  background:linear-gradient(90deg,#7441d6,#4ce6f2)!important;border-radius:99px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-progress-hint{
  color:#ccd4ee!important;font-size:12px!important;margin:8px 0 19px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-stage-rail{
  display:flex!important;gap:8px!important;flex-wrap:wrap!important;
  align-items:center!important;justify-content:flex-start!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-stage-rail>span{
  background:rgba(255,255,255,.10)!important;color:#dee6f8!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:999px!important;padding:8px 12px!important;font-size:12px!important;
  white-space:normal!important;
}
/* Layout keeps live estimate visible without squeezing fields. */
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-body-shell{
  padding:clamp(18px,3.2vw,39px)!important;min-width:0!important;
  background:#f7f8fc!important;border-radius:0 0 25px 25px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-form{
  min-width:0!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-step{
  box-sizing:border-box!important;width:100%!important;
  border:1px solid #e2deee!important;background:#fff!important;
  border-radius:21px!important;padding:clamp(23px,3vw,40px)!important;
  box-shadow:0 10px 30px rgba(23,32,51,.045)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-step:not(.active){
  display:none;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-kicker{
  display:inline-block!important;padding:6px 10px!important;
  font-weight:850!important;letter-spacing:.10em!important;
  color:#6035b0!important;background:#f0eaff!important;
  font-size:11px!important;border-radius:8px!important;margin-bottom:12px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-step h2{
  font-size:clamp(22px,2.55vw,34px)!important;line-height:1.22!important;
  color:#171c32!important;margin:0 0 12px!important;letter-spacing:-.03em!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-help,
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-help *{
  font-size:clamp(14px,1.15vw,16px)!important;line-height:1.65!important;
  color:var(--pdq-muted)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-field label{
  color:#262641!important;font-weight:800!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(.iwq-field input:not([type=radio]):not([type=checkbox]),.iwq-field select,.iwq-field textarea,.iwq-number input){
  min-height:52px!important;width:100%!important;max-width:100%!important;
  padding:12px 15px!important;border-radius:12px!important;
  background:#fafbff!important;border:1.5px solid #c9c9dc!important;
  box-shadow:none!important;color:#1b2239!important;font-size:15px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(input,select,textarea,button):focus-visible{
  outline:3px solid rgba(76,230,242,.78)!important;outline-offset:3px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-setter-help{
  display:flex!important;flex-direction:column!important;gap:7px!important;
  padding:15px 18px!important;background:#eef5ff!important;
  border-left:4px solid var(--pdq-purple)!important;border-radius:12px!important;
  color:#253452!important;margin:20px 0!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-choices{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;margin-top:23px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-choices label{
  display:flex!important;align-items:center!important;gap:13px!important;
  min-width:0!important;width:100%!important;padding:16px 18px!important;
  background:#fff!important;color:#1f2941!important;
  border:1.5px solid #d9d7e9!important;border-radius:14px!important;
  cursor:pointer!important;box-shadow:0 3px 12px rgba(20,26,50,.035)!important;
  transition:background .15s,border-color .15s,box-shadow .15s!important;
  font-weight:700!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-choices label span{
  color:#1f2941!important;font-size:15px!important;line-height:1.45!important;
  min-width:0!important;overflow-wrap:break-word!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-choices label:has(input:checked){
  border-color:#7441d6!important;background:#f1ebff!important;
  box-shadow:0 0 0 2px rgba(116,65,214,.1)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq input[type=radio],
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq input[type=checkbox]{
  appearance:auto!important;accent-color:#7441d6!important;
  width:19px!important;height:19px!important;min-width:19px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-number{
  display:flex!important;align-items:center!important;gap:12px!important;max-width:300px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-number input{
  text-align:center!important;max-width:120px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-number button{
  min-width:50px!important;min-height:50px!important;border-radius:12px!important;
  background:#eee9f9!important;border:1px solid #d6cce8!important;color:#4b2391!important;
  font-size:24px!important;cursor:pointer!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(.iwq-next,.iwq-submit,.iwq-prev,.iwq-actions button){
  min-height:50px!important;padding:12px 25px!important;border-radius:999px!important;
  font-weight:800!important;cursor:pointer!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(.iwq-next,.iwq-submit){
  background:#4ce6f2!important;color:#111217!important;border:1px solid #4ce6f2!important;
  box-shadow:0 9px 26px rgba(76,230,242,.18)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-prev{
  background:#ece9f7!important;color:#43227e!important;border:1px solid #d7cceb!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(.iwq-summary,.iwq-live-summary,.iwq-summary-card){
  border-radius:20px!important;background:linear-gradient(135deg,#111726,#2b2050)!important;
  color:#fff!important;border:1px solid rgba(116,65,214,.36)!important;
  box-shadow:0 15px 45px rgba(18,19,35,.12)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq :is(.iwq-summary h3,.iwq-live-summary h3,.iwq-summary-total strong){
  color:#fff!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-summary-total{
  background:rgba(76,230,242,.09)!important;border-radius:14px!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-summary-total strong{
  font-size:clamp(26px,3vw,35px)!important;
}
/* Alternate shortcode calculator if shown on either quote page. */
html body:is(.page-id-87,.page-id-89) #main-content .pd702-quote-shell{
  width:min(100%,940px)!important;max-width:940px!important;
  border-radius:24px!important;border:1px solid #ded7ee!important;
  background:linear-gradient(135deg,#111726,#292044)!important;
  box-shadow:0 25px 65px rgba(15,20,40,.14)!important;
}
html body:is(.page-id-87,.page-id-89) #main-content .pd702-quote-shell .pd702-q-btn{
  min-height:52px!important;
}
/* Keep the long-form advice below /quote/ well-bounded and legible. */
html body.page-id-89 #main-content #post-89 .entry-content .wpb_text_column{
  max-width:1120px!important;margin-inline:auto!important;
}
@media(max-width:767px){
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq{
   width:100%!important;border-radius:19px!important;
 }
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-head{
   border-radius:18px 18px 0 0!important;padding:25px 19px!important;
 }
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-body-shell{
   padding:13px!important;
 }
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-step{
   padding:22px 16px!important;border-radius:15px!important;
 }
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-choices{
   grid-template-columns:1fr!important;
 }
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-stage-rail{
   gap:5px!important;
 }
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq .iwq-stage-rail>span{
   font-size:11px!important;padding:6px 9px!important;
 }
 html body.page-id-87 #main-content #WebsiteCostCalculator{padding:30px 16px!important}
}
@media(prefers-reduced-motion:reduce){
 html body:is(.page-id-87,.page-id-89) #main-content .pd702-iwq *{
   transition:none!important;
 }
}
