.elementor-6155 .elementor-element.elementor-element-0d16960{--display:flex;--background-transition:0.3s;}/* Start custom CSS *//******** Comforter Hub — FIX + mild overlay gradient + polish ********/

/* 0) Kill any previous overlay/pseudo that may be covering the page */
body.elementor-page-6155::before,
body.elementor-page-6155::after { display: none !important; }
html, body { background: #ffffff !important; }

/* 1) Safe, mild overlay glow (semi‑transparent only — no white base) */
body.elementor-page-6155 { position: relative; z-index: 0; }
body.elementor-page-6155::after{
  content:"";
  position: fixed; inset: 0;
  pointer-events: none;         /* never blocks clicks */
  z-index: 3;                   /* above content; header/popups usually have higher z-index */
  background:
    radial-gradient(820px 380px at 12% -6%, rgba(10,132,255,.05), transparent 62%),
    radial-gradient(820px 380px at 88% 106%, rgba(111,76,255,.045), transparent 62%);
  background-repeat: no-repeat;
}

/* ↓ If you decide you want the glow BEHIND the content instead of on top, 
   comment the ::after block above and use this instead:
body.elementor-page-6155::after { display:none !important; }
body.elementor-page-6155::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(900px 420px at 12% -6%, rgba(10,132,255,.10), transparent 64%),
    radial-gradient(900px 420px at 88% 106%, rgba(111,76,255,.08), transparent 64%);
  background-repeat:no-repeat;
}
body.elementor-page-6155 > .elementor-section-wrap,
body.elementor-page-6155 .elementor-section { position:relative; z-index:1; }
*/

/* 2) Global rhythm for hub sections */
.cftr-methods--pro,
.hub-pricing--pro,
.cftr-compare--pro,
.cftr-checklist--pro,
.hub-areas{
  scroll-margin-top: 92px;
  margin-top: clamp(28px, 5vw, 56px);
}

/* 3) Methods (tabs) */
.cftr-methods--pro .seg label{
  color:#334155;
  transition: background .2s ease, color .2s ease;
}
.cftr-methods--pro .seg label:hover{ background:#ffffff; color:#0b0b10; }
.cftr-methods--pro .seg input:focus-visible + label{
  outline:0; box-shadow:0 0 0 3px #0a84ff33, inset 0 0 0 2px #0a84ff1f;
}
.cftr-methods--pro .pan{ word-break: break-word; }

/* 4) Pricing tiles */
.hub-pricing--pro .tile{
  box-shadow:0 12px 30px rgba(2,12,27,.07);
  transition:transform .15s ease, box-shadow .2s ease;
}
.hub-pricing--pro .tile:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 34px rgba(2,12,27,.09);
}
.hub-pricing--pro .price{ font-size:clamp(18px, 2.1vw, 22px); }

/* 5) Pro‑wash vs Dry‑clean */
.cftr-compare--pro .col{
  transition:transform .15s ease, box-shadow .2s ease;
}
.cftr-compare--pro .col:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 34px rgba(2,12,27,.08);
}
.cftr-compare--pro .ribbon{ letter-spacing:.02em; }

/* 6) Checklist */
.cftr-checklist--pro .list label:hover{ background:#fafbff; }
.cftr-checklist--pro input:focus-visible + label .box{
  box-shadow:0 0 0 3px #10B98133; outline:0;
}

/* 7) Service areas grid */
.hub-areas .grid a{
  transition:transform .15s ease, box-shadow .2s ease;
}
.hub-areas .grid a:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 26px rgba(2,12,27,.08);
}

/* 8) Crisp text rendering on hub blocks */
.hub-hero, .cftr-methods--pro, .hub-pricing--pro, .cftr-compare--pro, .cftr-checklist--pro, .hub-areas{
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
/******** Premium polish – checklist, service areas, FAQs (Elementor page-only) ********/

/* ----------------- CHECKLIST (card-ify the rows) ----------------- */
.cftr-checklist--pro .list{
  border: 0; background: transparent; padding: 0;
  display: grid; gap: 10px;               /* separate into cards */
}
.cftr-checklist--pro label{
  position: relative;
  display: block;
  border: 1px solid #e8e8ee;
  border-radius: 12px;
  background: #fff;
  padding: 12px 14px 12px 46px;            /* room for the custom box */
  box-shadow: 0 8px 20px rgba(2,12,27,.06);
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.cftr-checklist--pro label:hover{ transform: translateY(-1px); box-shadow:0 12px 28px rgba(2,12,27,.08); background:#fafbff; }
.cftr-checklist--pro input{ position:absolute; left:-9999px } /* keep semantics but hide native control */

.cftr-checklist--pro .box{
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border-radius:6px;
  border:2px solid #cbd5e1; display:grid; place-items:center; background:#fff;
  transition: background .2s ease, border-color .2s ease;
}
.cftr-checklist--pro .tick{ width:12px; height:12px; display:none; color:#fff }
.cftr-checklist--pro input:checked + label .box{ background:#10B981; border-color:#10B981 }
.cftr-checklist--pro input:checked + label .tick{ display:block }
.cftr-checklist--pro input:focus-visible + label .box{
  box-shadow: 0 0 0 3px #10B98133; outline: 0;
}

/* ----------------- SERVICE AREAS (make cards tactile + directional) ----------------- */
.hub-areas .grid{
  display: grid; gap: 12px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 900px){ .hub-areas .grid{ grid-template-columns: 1fr } }

.hub-areas .grid a{
  position: relative; display: block;
  padding: 14px 38px 14px 48px;            /* space for left puck + right chevron */
  border: 1px solid #e8e8ee; border-radius: 12px; background:#fff;
  box-shadow: 0 8px 22px rgba(2,12,27,.06);
  transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease;
  text-decoration: none; color: inherit;
}
.hub-areas .grid a small{ display:block; color:#6b7280; margin-top:2px; font-size:12px }
.hub-areas .grid a:hover{
  transform: translateY(-1px);
  border-color:#e2e7f0;
  box-shadow: 0 12px 28px rgba(2,12,27,.08);
}
.hub-areas .grid a:focus-visible{
  outline: 0; box-shadow: 0 0 0 3px #0a84ff33, 0 12px 28px rgba(2,12,27,.08);
}

/* left “puck” */
.hub-areas .grid a::before{
  content:""; position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:26px; height:26px; border-radius:999px;
  background: linear-gradient(135deg,#5DA8FF,#8FE3FF);
  box-shadow: 0 4px 10px rgba(2,12,27,.10), inset 0 0 0 1px rgba(255,255,255,.55);
}

/* right chevron */
.hub-areas .grid a::after{
  content:"›"; position:absolute; right:12px; top:50%; transform:translateY(-50%);
  font-size:18px; line-height:1; opacity:.35; transition: transform .15s ease, opacity .15s ease;
}
.hub-areas .grid a:hover::after{ transform:translate(2px,-50%); opacity:.6 }

/* ----------------- FAQS (Details/Summary AND Elementor toggle) ----------------- */
.faq-pro details{
  border:1px solid #e8e8ee; border-radius:12px; background:#fff; margin:10px 0;
  box-shadow:0 8px 20px rgba(2,12,27,.06); overflow:hidden;
}
.faq-pro summary{
  cursor:pointer; list-style:none; padding:14px 16px; font-weight:700; color:#0b0b10;
  display:flex; align-items:center; justify-content:space-between;
}
.faq-pro summary::-webkit-details-marker{ display:none }
.faq-pro details[open] summary{ background:#fafbff }
.faq-pro summary .chev{ transition: transform .18s ease; opacity:.55 }
.faq-pro details[open] summary .chev{ transform: rotate(90deg); opacity:.9 }
.faq-pro .answer{ padding:14px 16px; color:#5f6470 }

/* If you’re using Elementor’s Toggle widget instead of <details>, this will align styles */
.elementor-widget-toggle .elementor-toggle .elementor-toggle-item{
  border:1px solid #e8e8ee; border-radius:12px; background:#fff; margin-bottom:10px;
  box-shadow:0 8px 20px rgba(2,12,27,.06); overflow:hidden;
}
.elementor-widget-toggle .elementor-toggle .elementor-tab-title{
  padding:14px 16px; font-weight:700; color:#0b0b10;
}
.elementor-widget-toggle .elementor-toggle .elementor-tab-title:focus-visible{
  outline:0; box-shadow:0 0 0 3px #0a84ff33;
}
.elementor-widget-toggle .elementor-toggle .elementor-tab-content{
  padding:14px 16px; color:#5f6470;
}
/* ====== CHECKLIST FIX + TUNE ====== */
/* Force enough left padding so text never sits under the custom box */
.cftr-checklist--pro .list label{
  padding: 12px 16px 12px 54px !important; /* was 46px; add !important to beat theme styles */
  line-height: 1.45;
}

/* Position the box a touch right so it doesn't crowd the border */
.cftr-checklist--pro .list label .box{
  left: 18px;      /* was 14px */
  width: 22px; height: 22px; border-radius: 6px;
}

/* Slightly deeper hover so rows feel tactile */
.cftr-checklist--pro label:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(2,12,27,.10);
}

/* On very small screens, reduce the left offset + padding to reclaim width */
@media (max-width: 480px){
  .cftr-checklist--pro .list label{ padding-left: 48px !important; }
  .cftr-checklist--pro .list label .box{ left: 14px; }
}

/* If your builder injects overflow rules, make sure labels can breathe */
.cftr-checklist--pro .list label{ overflow: visible; }/* End custom CSS */