/* "Our Lifetime Warranty works like a plan", owner-approved and locked 2026-10-29 (Daniel's Warranty card publishing approval; Codex
   family-c/warranty-card-v002, final compact copy, APPROVED-LOCK.json). Site placement of the locked style.css: every rule scoped to
   .dio-warranty-card, the review page's @font-face, body and .wc-review page-width rules dropped (Nunito Sans comes from the site's
   fonts.css), the h1 title shown as h3 and the h2 heading as h4. Values are unchanged. The arch tile is the site's own assets/arch-tile.svg
   (byte-identical to the lock's art/arch-tile.svg). Breakpoints follow the component's width (container queries). */
.dio-warranty-card{color:#2f4452;background:#fff;font-family:"Avenir Next",Avenir,"Nunito Sans",system-ui,sans-serif;font-synthesis:none;line-height:normal}   /* the lock page had no body line-height; the site body sets 1.65 */
.dio-warranty-card :is(h3,h4){font-family:inherit;color:inherit}
.dio-warranty-card .wc-figure{margin:0;container-type:inline-size;color:#2f4452;font-family:"Avenir Next",Avenir,"Nunito Sans",system-ui,sans-serif}.dio-warranty-card .wc-figure *{box-sizing:border-box}.dio-warranty-card .wc-stage{background:#f5f7f7;overflow:hidden;clip-path:polygon(20px 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%,0 20px)}
.dio-warranty-card .wc-heading{position:relative;isolation:isolate;overflow:hidden;padding:22px 28px 20px;background:#e8eff3;border-bottom:1px solid #cad5da}
.dio-warranty-card .wc-heading .wc-title{position:relative;margin:0;font-size:30px;line-height:1.25;font-weight:500;letter-spacing:-.025em}
.dio-warranty-card .wc-arch{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
  -webkit-mask-image:url(../../arch-tile.svg),linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.10) 40%,rgba(0,0,0,.45) 72%,#000);
  mask-image:url(../../arch-tile.svg),linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.10) 40%,rgba(0,0,0,.45) 72%,#000);
  -webkit-mask-size:179.4px 179.4px,100% 100%;mask-size:179.4px 179.4px,100% 100%;-webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;
  -webkit-mask-composite:source-in;mask-composite:intersect}
/* resting state is the end frame: steel lines, the orange crest already past */
.dio-warranty-card .wc-arch>i{position:absolute;inset:0;background:linear-gradient(115deg,rgba(76,114,136,.20) 0%,rgba(76,114,136,.20) 30%,rgba(76,114,136,.34) 40%,rgba(237,135,60,.55) 47%,rgba(76,114,136,.30) 54%,rgba(76,114,136,.20) 64%,rgba(76,114,136,.20) 100%);background-size:300% 100%;background-position:0 0}
.dio-warranty-card .wc-figure.wc-in:not(.wc-still) .wc-arch>i{animation:wc-header-wave 4.4s cubic-bezier(.45,.05,.35,1) .2s 1 both;animation-play-state:var(--wc-play-state,paused)}
@keyframes wc-header-wave{from{background-position:100% 0}to{background-position:0 0}}
.dio-warranty-card .wc-content{padding:28px}.dio-warranty-card .wc-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.dio-warranty-card .wc-steps li{background:#fff;padding:22px 12px;margin:0;text-align:center;display:flex;align-items:center;flex-direction:column;gap:16px;min-height:154px;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}.dio-warranty-card .wc-steps svg{width:48px;height:48px;flex:none}.dio-warranty-card .wc-steps span{font-size:20px;line-height:1.35;font-weight:500;max-width:145px}.dio-warranty-card .wc-price{position:relative;isolation:isolate;margin-top:24px;padding:25px 24px;background:#ed873c;clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}.dio-warranty-card .wc-price::before{content:"";position:absolute;inset:2px;background:#fff;z-index:-1;clip-path:polygon(15px 0,100% 0,100% calc(100% - 15px),calc(100% - 15px) 100%,0 100%,0 15px)}.dio-warranty-card .wc-price h4{font-size:24px;line-height:1.3;font-weight:500;margin:0 0 3px}.dio-warranty-card .wc-optional{font-size:15px;color:#506875;margin:0 0 22px}.dio-warranty-card .wc-rates{margin:0;display:grid;gap:18px}.dio-warranty-card .wc-rates dt{font-size:18px;line-height:1.4;font-weight:500;color:#4c7288}.dio-warranty-card .wc-unit{white-space:nowrap}.dio-warranty-card .wc-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.dio-warranty-card .wc-rates dd{margin:4px 0 0;font-size:22px;line-height:1.4;font-weight:500}.dio-warranty-card .wc-included{font-size:17px;line-height:1.5;color:#506875;margin:22px 0 0}.dio-warranty-card .wc-close{font-size:19px;line-height:1.5;margin:23px 0 0;padding-left:17px;border-left:3px solid #ed873c;font-weight:400}.dio-warranty-card .wc-figure figcaption{font-size:15px;line-height:1.5;color:#506875;margin:16px 18px 0;padding:0;text-align:left}.dio-warranty-card .wc-figure figcaption p{margin:0}.dio-warranty-card .wc-figure figcaption p+p{margin-top:6px}
@container(max-width:560px){.dio-warranty-card .wc-stage{clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}.dio-warranty-card .wc-heading .wc-title{font-size:26px;line-height:1.25}.dio-warranty-card .wc-content{padding:22px}.dio-warranty-card .wc-steps{grid-template-columns:1fr;gap:9px}.dio-warranty-card .wc-steps li{flex-direction:row;text-align:left;min-height:82px;padding:16px 18px;gap:17px}.dio-warranty-card .wc-steps svg{width:40px;height:40px}.dio-warranty-card .wc-steps span{font-size:18px;max-width:none}.dio-warranty-card .wc-price{padding:22px 20px;margin-top:20px}.dio-warranty-card .wc-price h4{font-size:23px}.dio-warranty-card .wc-rates dd{font-size:20px}.dio-warranty-card .wc-included{font-size:17px}.dio-warranty-card .wc-close{font-size:18px}.dio-warranty-card .wc-figure figcaption{margin:15px 10px 0}}
@media(prefers-reduced-motion:reduce){.dio-warranty-card .wc-figure *{animation:none!important;transition:none!important}}html.reduce-motion .dio-warranty-card .wc-figure *,html.dio-alive-off .dio-warranty-card .wc-figure *,html[data-motion="reduce"] .dio-warranty-card .wc-figure *{animation:none!important;transition:none!important}.dio-warranty-card .wc-figure.wc-still .wc-arch>i,.reduce-motion .dio-warranty-card .wc-figure .wc-arch>i,.dio-alive-off .dio-warranty-card .wc-figure .wc-arch>i{animation:none!important;background-position:0 0}@media print{.dio-warranty-card .wc-stage{clip-path:none}}
/* Replay / Still view controls restored 2026-11-11 (Daniel: animations get pause or replay; GPT 21:37Z).
   Same look as the where-bar and plan-b controls: one row above the figure, right side, wrapping on narrow widths; real buttons at least 44 px
   tall with a visible focus ring; hidden in print. Every rule is scoped to this widget. */
.dio-warranty-card .controls{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin:0 0 12px;padding:0;max-width:none}
.dio-warranty-card .controls[hidden]{display:none}
/* 2026-11-11 audit: the controls take the finish of the site's animation toggle (2px steel border, 6px corners, ink focus ring) so every animation's controls match */
.dio-warranty-card .controls button{font:500 14px/1.2 'Avenir Next',Avenir,'Nunito Sans',system-ui,sans-serif;min-height:44px;min-width:82px;margin:0;padding:10px 16px;background:#fff;color:#203846;border:2px solid #4c7288;border-radius:6px;cursor:pointer}
.dio-warranty-card .controls button:hover{background:#f1f5f6}.dio-warranty-card .controls button:focus-visible{outline:3px solid #203846;outline-offset:2px}.dio-warranty-card .controls button[aria-pressed=true]{background:#e6edf0}.dio-warranty-card .controls button:disabled{opacity:.55;cursor:default}
.dio-warranty-card .wc-status{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media print{.dio-warranty-card .controls{display:none!important}}