/* Approved Home warranty panel. The shared pill is its only moving element. */
.home-warranty-section{padding-block:0 64px;scroll-margin-top:12px}
.home-warranty-panel{
  --dio-graffiti-opacity:.09;
  --home-warranty-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:4px;
  padding:40px clamp(20px,4vw,52px) 34px;
  background:#dfe2e2;
  color:#1c3341;
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(20,40,52,.18),0 22px 44px -24px rgba(16,32,42,.45);
  animation:none;
  transition:none;
}
.home-warranty-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.home-warranty-copy,.home-warranty-pricebox{min-width:0}
.home-warranty-panel .home-warranty-eyebrow{color:#203846;font-size:13px;font-weight:500;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;margin:0 0 10px}
.home-warranty-panel h2{color:#1c3341;font-size:clamp(34px,5vw,52px);font-weight:600;line-height:1.05;letter-spacing:-.01em;margin:0 0 16px}
.home-warranty-panel .home-warranty-lead{font-size:18px;line-height:1.6;color:#2f4453;margin:0 0 22px;max-width:560px}
.home-warranty-covers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:14px 18px}
.home-warranty-covers li{display:flex;gap:10px;align-items:flex-start;min-width:0;font-size:15px;line-height:1.3;font-weight:600;color:#1c3341}
.home-warranty-covers i{flex:0 0 20px;height:20px;border-radius:50%;margin-top:-1px;position:relative;background:#BACE61;animation:none;transition:none}
.home-warranty-covers i::after{content:'';position:absolute;left:7px;top:4px;width:5px;height:9px;border:solid #203846;border-width:0 2px 2px 0;transform:rotate(45deg);animation:none;transition:none}
.home-warranty-pricebox{position:relative;isolation:isolate;padding:24px 24px 22px;color:#fff;background:linear-gradient(180deg,#2c4757 0%,#203846 50%,#1b3140 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -2px 0 rgba(0,0,0,.35),0 14px 28px -16px rgba(16,32,42,.6);clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.home-warranty-pricebox::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.16;mix-blend-mode:overlay;background:var(--home-warranty-grain);animation:none;transition:none}
.home-warranty-pricebox .home-warranty-addfor{margin:0 0 12px;font-size:13px;font-weight:600;line-height:1.4;letter-spacing:.14em;text-transform:uppercase;color:#a9c0cc}
.home-warranty-selector{display:inline-flex;max-width:100%;padding:5px;border:0;border-radius:999px;background:var(--dio-alu-silver,linear-gradient(180deg,#e6e8e8,#c9cdcd));box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(20,40,52,.28),0 6px 14px -6px rgba(0,0,0,.35);margin:0 0 18px}
.home-warranty-selector[hidden]{display:none!important}
.home-warranty-selector>button{flex:1 1 auto;min-width:0;min-height:48px;padding:12px 18px;border:0;border-radius:999px;background:transparent;color:#1c3341;font:600 16px/1.25 var(--font,'Avenir Next',Avenir,Nunito Sans,system-ui,sans-serif);white-space:normal;cursor:pointer}
.home-warranty-selector:not(.dio-segmented-control)>button[aria-pressed=true]{background:var(--dio-alu-steel,linear-gradient(180deg,#68869a 0%,#56737f 40%,#4a6573 100%));color:#fff}
.home-warranty-selector.dio-segmented-control>button{min-width:0;flex:1 1 auto;padding-inline:18px}
.home-warranty-pricebox .home-warranty-amount{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0}
.home-warranty-amount b{font-size:clamp(52px,7vw,72px);line-height:1;font-weight:700;letter-spacing:-.02em;color:#ed873c;text-shadow:0 -1px 0 rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.12)}
.home-warranty-amount span{font-size:18px;line-height:1.4;color:#c9d6dd}
.home-warranty-pricebox .home-warranty-alternative{font-size:15px;line-height:1.5;color:#c9d6dd;margin:6px 0 16px}
.home-warranty-pricebox .home-warranty-noscript{font-size:15px;line-height:1.5;color:#c9d6dd;margin:0 0 16px}
.home-warranty-pricebox .home-warranty-included{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:12px 14px;font-size:15px;line-height:1.5;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.home-warranty-included b{color:#fff;font-weight:600}.home-warranty-included span{color:#c9d6dd}
.home-warranty-stat{display:flex;gap:12px;align-items:center;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);font-size:16px;line-height:1.4}
.home-warranty-stat b{font-size:30px;color:#fff;letter-spacing:-.01em}
.home-warranty-pricebox .home-warranty-join{display:inline-block;margin-top:18px;min-height:48px;padding-block:8px;color:#fff;font-size:16px;font-weight:500;line-height:1.5;text-decoration:underline;text-underline-offset:4px;animation:none;transition:none}
.home-warranty-join:focus-visible{outline:2px solid #fff;outline-offset:4px}
.home-warranty-panel .home-warranty-smallprint{position:relative;z-index:1;margin:26px 0 0;font-size:14px;line-height:1.5;font-weight:400;color:#203846;max-width:720px}
@media(max-width:760px){.home-warranty-section{padding-bottom:48px}.home-warranty-grid{grid-template-columns:1fr}.home-warranty-covers{grid-template-columns:1fr;grid-auto-rows:auto}}
@media(max-width:420px){.home-warranty-pricebox{padding-inline:18px}.home-warranty-selector{width:100%}.home-warranty-selector>button,.home-warranty-selector.dio-segmented-control>button{padding-inline:10px;font-size:15px}}
@media(forced-colors:active){.home-warranty-panel,.home-warranty-pricebox{background:Canvas;color:CanvasText;box-shadow:none;border:1px solid CanvasText}.home-warranty-pricebox::after{display:none}.home-warranty-panel :is(h2,p,b,span,a,small){color:CanvasText;text-shadow:none}.home-warranty-covers i{background:Canvas;box-shadow:none;border:1px solid CanvasText}.home-warranty-covers i::after{border-color:CanvasText}.home-warranty-join:focus-visible{outline-color:Highlight}}
/* Daniel 2026-10-12: keep the single-arch height for both choices; the "a month..." line always sits under the price. */
.home-warranty-pricebox .home-warranty-amount{flex-direction:column;align-items:flex-start;gap:4px}
.home-warranty-pricebox .home-warranty-amount span{display:block}

/* Daniel 2026-10-12 (popup A): "You come in once a year either way" - the two warranties side by side in plain words. */
.hw-either{margin:0 0 18px}
.hw-either-h{margin:0 0 10px;font-size:19px;font-weight:600;color:#1c3341}
.hw-either-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.hw-either-grid>div{padding:12px 14px;background:rgba(255,255,255,.72);box-shadow:inset 0 1px 0 #fff,0 1px 0 rgba(32,56,70,.1)}
.hw-either-grid b{display:block;font-size:15px;color:#1c3341;margin:0 0 4px}
.hw-either-grid span{display:block;font-size:14px;line-height:1.5;color:#2f4453}
.hw-either-grid .hw-life{background:#fdf1e7;box-shadow:inset 3px 0 0 #ed873c}
.hw-either-grid .hw-life b{color:#9a4a12}
@media(max-width:560px){.hw-either-grid{grid-template-columns:1fr}}
.hw-either-grid .hw-two{border:1px solid #e3e8eb}.hw-either-grid .hw-life{border:1px solid #f6d6bb}

/* Daniel 2026-10-12: keep the either-way layout, finish its look. One joined plate: silver (two-year, included) beside
   navy (Lifetime), with an orange aluminium "or" between them. */
.hw-either-h{display:flex;align-items:center;gap:10px;font-size:18px!important}
.hw-either-h::before{content:'';width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:radial-gradient(circle at 50% 50%,#203846 0 3px,transparent 3.5px),conic-gradient(#ed873c 0 25%,#203846 0 100%);box-shadow:inset 0 0 0 3px #e6e8e8}
.hw-either-grid{position:relative;gap:0!important;border-radius:12px;box-shadow:0 14px 28px -18px rgba(16,32,42,.55)}
.hw-either-grid>div{padding:16px 22px 16px 18px!important;border:0!important}
.hw-either-grid .hw-two{border-radius:12px 0 0 12px;background:linear-gradient(180deg,#eef0f0 0%,#dfe2e2 55%,#d3d7d7 100%)!important;box-shadow:inset 0 1px 0 #fff!important}
.hw-either-grid .hw-two b{color:#33444f!important}
.hw-either-grid .hw-life{border-radius:0 12px 12px 0;padding-left:26px!important;background:linear-gradient(180deg,#2c4757 0%,#203846 55%,#1b3140 100%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.16)!important}
.hw-either-grid .hw-life b{color:#f4a165!important}
.hw-either-grid .hw-life span{color:#d4dfe5!important}
.hw-either-grid::after{content:'or';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:13px;font-weight:700;color:#203846;background:linear-gradient(180deg,#f4a165 0%,#ed873c 45%,#e9853b 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 3px 8px rgba(16,32,42,.35)}
@media(max-width:560px){.hw-either-grid .hw-two{border-radius:12px 12px 0 0}.hw-either-grid .hw-life{border-radius:0 0 12px 12px;padding-left:18px!important;padding-top:24px!important}}

/* Daniel 2026-10-12: two plates with "or" between them and one shared pill (replaces the either-way chart in this panel).
   Left: the Lifetime Warranty, in navy. Right: included two-year warranty and the yearly cleaning fee, in silver (order flipped, Daniel 2026-11-12). */
.hwp .hwp-head{position:relative;z-index:1;max-width:760px}
.hwp .hwp-head .home-warranty-lead{margin-bottom:20px}
.hwp-bar{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;margin:0 0 18px}
.hwp-bar .hw-either-h{margin:0;font-size:19px!important}
.hwp-bar .home-warranty-selector{margin:0}
.hwp-plates{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 0 minmax(0,1fr);gap:0 28px;align-items:stretch}
.hwp-plates .home-warranty-pricebox{display:flex;flex-direction:column}
.hwp-plates .home-warranty-alternative{margin:8px 0 18px!important}
.hwp-plates .home-warranty-stat{margin-top:auto}
.hwp-plates .home-warranty-stat b{white-space:nowrap}
.hwp-life .hwp-annual{color:#fff}
.hwp-two{color:#1c3341;background:linear-gradient(180deg,#f3f4f4 0%,#e2e5e5 50%,#d3d7d7 100%);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(20,40,52,.2),0 14px 28px -16px rgba(16,32,42,.45)}
.hwp-two::after{opacity:.1}
.hwp-two .home-warranty-addfor{color:#4a6573}
.hwp-two .home-warranty-amount b{color:#203846;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.hwp-two .home-warranty-amount span,.hwp-two .home-warranty-alternative{color:#2f4453}
.hwp-two .home-warranty-stat{border-top-color:rgba(32,56,70,.18)}
.hwp-two .home-warranty-stat b{color:#203846}
.hwp-or{position:relative;display:grid;place-items:center}
.hwp-or span{position:absolute;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;font-size:15px;font-weight:700;color:#203846;background:linear-gradient(180deg,#f4a165 0%,#ed873c 45%,#e9853b 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(0,0,0,.18),0 4px 10px rgba(16,32,42,.35)}
.hwp-covers{position:relative;z-index:1;margin-top:28px}
.hwp-covers-h{margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#203846}
.hwp .home-warranty-covers{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:760px){.hwp-plates{grid-template-columns:1fr;gap:0}.hwp-or{height:30px}.hwp .home-warranty-covers{grid-template-columns:1fr}}
@media(max-width:420px){.hwp-bar .home-warranty-selector{width:100%}}
@media(forced-colors:active){.hwp-two{background:Canvas;color:CanvasText;box-shadow:none;border:1px solid CanvasText}.hwp-or span{background:Canvas;color:CanvasText;border:1px solid CanvasText}}

/* Cohesion pass (Daniel 2026-10-12 "a little bit of cleanup"): both plates share one row grid, so label, price, line,
   stat and link sit level side by side; same corner cut and shadow; the "or" sits on the centre line of the prices. */
@supports (grid-template-rows:subgrid){
  .hwp-plates{grid-template-rows:auto auto 1fr auto auto}
  .hwp-plates .home-warranty-pricebox{display:grid;grid-row:1 / span 5;grid-template-rows:subgrid}
  .hwp-plates .home-warranty-stat{margin-top:0;align-self:end}
  .hwp-or{grid-row:1 / span 5}
}
.hwp-plates .home-warranty-pricebox{padding:26px 26px 20px}
.hwp-plates .home-warranty-amount{margin:0}
.hwp-plates .home-warranty-amount b{font-size:clamp(48px,6vw,66px)}
.hwp-plates .home-warranty-alternative{font-size:15px;line-height:1.5}
.hwp-plates .home-warranty-join{margin-top:10px}
.hwp-two .home-warranty-join{color:#203846}
.hwp-two .home-warranty-join:focus-visible{outline-color:#203846}
@media(max-width:760px){.hwp-plates{grid-template-rows:none}.hwp-plates .home-warranty-pricebox{grid-row:auto;grid-template-rows:none;display:flex}.hwp-or{grid-row:auto}.hwp-plates .home-warranty-stat{margin-top:auto;align-self:stretch;justify-content:center;text-align:center}}/* Daniel 2026-11-12: both stat rows centred on phones, full width (the desktop align-self:end pushed the shorter two-year row right) */

/* Daniel 2026-10-12: "either way" joins the lead paragraph; the pill stands alone, centred over the "or";
   the "or" always sits on top of both plates, overlapping the seam on phones. */
.hwp-bar{justify-content:center}
.hwp-or{z-index:3}
.hwp-or span{z-index:3}
@media(max-width:760px){.hwp-or{height:0;overflow:visible}.hwp-plates{row-gap:14px}}