/* AutoAssures.com, first-design inner pages (redesign 2026-10, inner-page pass; ART-DIRECTION.md section 5).
   Every content page shares one grammar with the home page: mist dot-grid panels, the spec card (white, radius 10,
   mist strip with a DM Mono label + index), the two-part button, DM Mono figures, and panels that straddle a
   section edge. Each page type straddles something different over its head band: content pages their photo,
   articles a wide hero photo, legal pages the document sheet, tools the workbench (tools.css). Loads after style.css.
   Classes shared with the home page (.checklist, .note, .form-card, .consent, .info-card ...) are scoped to the inner
   pages with body:not(.page-index) so the home page keeps its own look. */

:root{
  --ip-gap:clamp(64px,7vw,104px);
  --ph-over:150px;
  --ip-stick:120px;
  --ip-zebra:#F3F8F7;
  --ip-rule:#E3EEED;
}
@media (max-width:1199.98px){:root{--ip-stick:96px;--ph-over:120px}}
@media (max-width:767.98px){:root{--ph-over:64px;--ip-gap:56px}}

/* ---------- base rules the home page is built on (kept exactly as the frame + home build had them; the inner pages
   restyle these classes below with body:not(.page-index) selectors, which win on every inner page) ---------- */
.info-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .18s,box-shadow .18s,border-color .18s;height:100%}
.info-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#d4d8dd;color:var(--ink)}
.card-img img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block}
.card-body{padding:1.2rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.card-label{font:700 .74rem/1.3 var(--display);letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.info-card h3{font-size:1.1rem;margin:0}
.info-card p{margin:0;color:var(--ink-2);font-size:.98rem}
.card-more{margin-top:auto;padding-top:.5rem;display:inline-flex;align-items:center;gap:.35rem;font:700 .92rem var(--display);color:var(--brand)}
.card-more svg{width:16px;height:16px;fill:currentColor}
.note{background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--r-sm);padding:1rem 1.2rem;font-size:.97rem;color:var(--ink-2)}
.checklist{list-style:none;padding:0!important}
.checklist li{position:relative;padding-left:1.9rem}
.checklist li::before{content:"";position:absolute;left:0;top:.35rem;width:18px;height:18px;border-radius:50%;background:var(--brand-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230F4C5C' d='m9.5 16.2-4.2-4.2-1.4 1.4 5.6 5.6L21 7.5l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat}
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;box-shadow:none}
.form-card h2{font-size:1.25rem;margin:0 0 1rem}

/* a two-part Bootstrap button that is stretched (forms, phone layouts) keeps its arrow cell at the right edge */
body:not(.page-index) .btn-brand:has(>svg:last-child){justify-content:space-between}

/* ---------- crumbs (both frames: Bootstrap .breadcrumb here, .aa-crumbs in v2-pages.css) ---------- */
.breadcrumb{--bs-breadcrumb-divider:"/";--bs-breadcrumb-item-padding-x:.55rem;--bs-breadcrumb-divider-color:#7C9196;--bs-breadcrumb-item-active-color:var(--aa-muted);margin:0 0 22px;font:500 13px/1.45 var(--aa-mono);letter-spacing:.01em}
.breadcrumb a{color:var(--aa-petrol);text-decoration:none}
.breadcrumb a:hover{color:var(--aa-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.breadcrumb-item.active a[aria-current]{color:var(--aa-muted);text-decoration:none}

/* =====================================================================================================================
   PAGE HEAD: mist dot-grid band; the photo sits in a white spec frame that straddles the band's foot
   ===================================================================================================================== */
.page-head{position:relative;background:var(--aa-mist) var(--aa-dots);border:0}
.page-head .container{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:end;padding-block:clamp(40px,4.6vw,64px) clamp(48px,5vw,72px)}
.page-head .ph-text{grid-column:1/-1;align-self:start;max-width:62rem}
.page-head h1{font-size:clamp(2.125rem,1.45rem + 2.1vw,3rem);line-height:1.04;letter-spacing:-.018em;margin:0 0 .42em;max-width:19ch}
.page-head .lede{font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);line-height:1.6;color:var(--aa-ink);max-width:56ch;margin:0}
.page-head .meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin:18px 0 0;font:500 13px/1.5 var(--aa-mono);letter-spacing:.02em;color:var(--aa-petrol)}
/* content heads read photo first: the framed photo holds the left columns and drops through the band's foot, the
   crumbs, title and lede stand to its right (never MyHomeZilla's text-left / photo-right split) */
.page-head.has-photo .ph-text{grid-column:8/13;grid-row:1}
.ph-photo{position:relative;z-index:2;grid-column:1/7;grid-row:1;align-self:stretch;display:flex;flex-direction:column;margin:0 0 calc(-1 * (var(--ph-over) + clamp(48px,5vw,72px)));padding:46px 10px 10px;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;box-shadow:var(--aa-drop)}
.page-head.has-photo .ph-photo>img{flex:1 1 0;min-height:260px;aspect-ratio:auto}
.ph-photo::before,.ph-photo::after{position:absolute;top:0;display:flex;align-items:center;height:36px;font:500 12.5px/1 var(--aa-mono);letter-spacing:.08em;text-transform:uppercase}
.ph-photo::before{content:var(--ph-k,"AutoAssures");content:var(--ph-k,"AutoAssures") / "";left:0;right:0;padding:0 14px;background:var(--aa-mist);color:var(--aa-petrol);border-radius:9px 9px 0 0}
.ph-photo::after{content:var(--ph-n,"");content:var(--ph-n,"") / "";right:14px;color:var(--aa-muted);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.ph-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:6px;box-shadow:none}
/* what the photo frame's strip says, per page (the header menu's numbering) */
.page-insurance-types{--ph-k:"Insurance tip";--ph-n:"01 / 09"}
.page-coverage-levels{--ph-k:"Insurance tip";--ph-n:"02 / 09"}
.page-lower-your-premium{--ph-k:"Insurance tip";--ph-n:"03 / 09"}
.page-compare-policies{--ph-k:"Insurance tip";--ph-n:"04 / 09"}
.page-after-an-accident{--ph-k:"Insurance tip";--ph-n:"05 / 09"}
.page-after-a-collision{--ph-k:"Insurance tip";--ph-n:"06 / 09"}
.page-reporting-an-accident{--ph-k:"Insurance tip";--ph-n:"07 / 09"}
.page-filing-a-claim{--ph-k:"Insurance tip";--ph-n:"08 / 09"}
.page-discounts{--ph-k:"Insurance tip";--ph-n:"09 / 09"}
.page-compare-quotes{--ph-k:"Tool";--ph-n:"01 / 06"}
.page-rate-checklist{--ph-k:"Tool";--ph-n:"02 / 06"}
.page-coverage-worksheet{--ph-k:"Tool";--ph-n:"03 / 06"}
.page-budget-calculator{--ph-k:"Tool";--ph-n:"04 / 06"}
.page-deductible-calculator{--ph-k:"Tool";--ph-n:"05 / 06"}
.page-coverage-calculator{--ph-k:"Tool";--ph-n:"06 / 06"}
.page-about{--ph-k:"About us"}
.page-contact{--ph-k:"Contact"}
.page-faq{--ph-k:"FAQs"}
.page-resources{--ph-k:"Resource library"}
.page-start-your-coverage{--ph-k:"Plans"}

/* the section right under a photo head leaves room for the overhang (reading pages: both columns start on one line
   under it) */
.page-head.has-photo + .section{padding-top:calc(var(--ph-over) + clamp(40px,4.5vw,64px))}
/* a section that opens with its own heading block continues the head's right-hand column beside the photo */
@media (min-width:992px){
  .page-head.has-photo + .section:has(> .container > .section-head:first-child){padding-top:clamp(40px,4vw,56px)}
  .page-head.has-photo + .section > .container > .section-head:first-child{margin-left:calc((100% * 7 + 168px) / 12);max-width:none;min-height:calc(var(--ph-over) - clamp(40px,4vw,56px) + 40px);align-content:start}
  /* About: the mission heading and its paragraph stand in the right-hand column beside the photo, which drops further */
  .page-about{--ph-over:clamp(200px,19vw,272px)}
  .page-head.has-photo + .section:has(> .container > .center-head:first-child){padding-top:clamp(40px,4vw,56px)}
  .page-head.has-photo + .section > .container > .center-head:first-child{margin:0 0 clamp(48px,5vw,72px) calc((100% * 7 + 168px) / 12);max-width:none;min-height:calc(var(--ph-over) - clamp(40px,4vw,56px) + 40px)}
  .page-head.has-photo + .section > .container > .center-head:first-child h2{max-width:16ch}
  /* tips and FAQ: the side column starts at the band's foot, beside the photo; the reading column starts under it */
  .page-head.has-photo + .section > .container > .guide-layout > .guide-aside{margin-top:calc(-1 * (var(--ph-over) + clamp(40px,4.5vw,64px)) + 40px)}
  /* Contact, Start Your Coverage: their first row runs the full width, so the photo drops less */
  .page-contact,.page-start-your-coverage{--ph-over:56px}
}

/* article head (old posts: the head carries a meta line): title column, then a wide photo straddling the foot */
.page-head:has(.meta) .container{grid-template-columns:minmax(0,1fr);padding-bottom:0}
.page-head:has(.meta) .ph-text{grid-column:1;grid-row:1;justify-self:center;width:100%;max-width:41rem}
.page-head:has(.meta) h1{max-width:24ch;font-size:clamp(2.125rem,1.6rem + 1.6vw,3rem)}
.page-head:has(.meta) .ph-photo{grid-column:1;grid-row:2;align-self:start;margin:40px 0 -200px;padding:10px}
.page-head:has(.meta) .ph-photo::before,.page-head:has(.meta) .ph-photo::after{display:none}
.page-head:has(.meta) .ph-photo>img{flex:none;min-height:0;aspect-ratio:21/8;object-position:50% 55%}
.page-head:has(.meta) + .section{padding-top:calc(200px + clamp(48px,5vw,72px))}

/* slim head (legal pages, 404): no photo; the document sheet below straddles it instead */
.page-head:not(.has-photo) .container{padding-bottom:clamp(96px,9vw,128px)}
.page-head:not(.has-photo) h1{max-width:22ch}

@media (max-width:991.98px){
  .page-head.has-photo .ph-text{grid-column:1/-1;grid-row:1}
  .page-head.has-photo .ph-photo{grid-column:2/12;grid-row:2;margin-top:32px;align-self:start}
  .page-head.has-photo .ph-photo>img{flex:none;min-height:0;aspect-ratio:3/2}
  .page-head .container{align-items:start}
  .page-head.has-photo + .section:has(> .container > .guide-layout){padding-top:calc(var(--ph-over) + 40px)}
  .page-head.has-photo + .section .guide-layout>:first-child{margin-top:0}
}
@media (max-width:767.98px){
  .page-head .container{column-gap:0;padding-top:28px}
  .breadcrumb{margin-bottom:16px;font-size:12.5px}
  .page-head.has-photo .ph-photo{grid-column:1/-1;margin-top:26px;padding:42px 8px 8px}
  .ph-photo::before{padding:0 12px;font-size:11.5px}
  .ph-photo::after{right:12px;font-size:11.5px}
  .page-head:has(.meta) .ph-photo{margin:26px 0 -96px;padding:8px}
  .page-head:has(.meta) .ph-photo img{aspect-ratio:3/2}
  .page-head:has(.meta) + .section{padding-top:calc(96px + 40px)}
  .page-head:not(.has-photo) .container{padding-bottom:88px}
}

/* =====================================================================================================================
   SECTIONS
   ===================================================================================================================== */
.section{padding-block:var(--ip-gap)}
.section.pt-0{padding-top:0}
.section-alt{background:var(--aa-mist) var(--aa-dots)}
.section-dark{background:var(--aa-petrol);color:var(--aa-mist)}
.section-dark h2,.section-dark h3{color:#fff}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 40px;flex-wrap:wrap;margin-bottom:36px}
.section-head h2{margin:0;max-width:20ch}
.section-head p{margin:12px 0 0;color:var(--aa-ink);max-width:60ch}
.center-head{max-width:44rem;margin:0 0 40px}
.center-head h2{max-width:20ch}
.center-head p{color:var(--aa-ink);max-width:58ch;margin:0}
.section-dark .center-head p{color:var(--aa-mist)}
/* "Part 1 of 2" (coverage calculator) is content: a DM Mono tab beside the heading, never a label line above it */
.section-head>div:has(>.eyebrow){display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:16px;align-items:center}
.section-head>div:has(>.eyebrow)>*{grid-column:1/-1}
.section-head .eyebrow{grid-column:1!important;display:inline-flex;align-items:center;height:30px;padding:0 10px;margin:0;border-radius:4px;background:var(--aa-petrol);color:var(--aa-mist);font:500 12px/1 var(--aa-mono);letter-spacing:.08em}
.section-head .eyebrow + h2{grid-column:2!important}
.section-head .eyebrow + h2 + p{margin-top:16px}

/* ---------- About: the mission as one ruled spec sheet (three columns, DM Mono index, no boxes) ---------- */
.features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--aa-petrol);border-bottom:1px solid var(--aa-line-soft);counter-reset:feat}
.feature{position:relative;display:grid;align-content:start;gap:10px;padding:30px 36px 36px 0;counter-increment:feat}
.feature + .feature{padding-left:36px;border-left:1px solid var(--aa-line-soft)}
.feature::before{content:counter(feat,decimal-leading-zero);content:counter(feat,decimal-leading-zero) / "";position:absolute;top:30px;right:36px;font:500 13px/1 var(--aa-mono);letter-spacing:.04em;color:var(--aa-muted)}
.feature .ic{display:grid;place-items:center;width:48px;height:48px;border-radius:4px;background:var(--aa-mist)}
.feature .ic svg{width:24px;height:24px;fill:var(--aa-petrol)}
.feature h3{margin:10px 0 0;font-size:24px}
.feature p{margin:0;color:var(--aa-ink);max-width:36ch}
@media (max-width:767.98px){
  .features{grid-template-columns:1fr}
  .feature,.feature + .feature{padding:24px 0 26px;border-left:0}
  .feature + .feature{border-top:1px solid var(--aa-line-soft)}
  .feature::before{top:26px;right:0}
}

/* ---------- split text + image / text + panel ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px clamp(40px,6vw,96px);align-items:start}
.split img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.split.reverse>:first-child{order:2}
.split>div>h2{max-width:16ch}
/* a list that stands as the second half of a split (About, "What Guides Our Work") is a ruled white sheet */
body:not(.page-index) .split>ul.checklist{gap:0;margin:0;padding:6px 28px!important;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;box-shadow:var(--aa-drop)}
body:not(.page-index) .split>ul.checklist>li{padding:16px 0 16px 38px;border-bottom:1px solid var(--ip-rule)}
body:not(.page-index) .split>ul.checklist>li:last-child{border-bottom:0}
body:not(.page-index) .split>ul.checklist>li::before{top:18px}
.sign{display:flex;align-items:center;gap:.8rem;margin-top:1.4rem;font:italic 400 19px/1.3 var(--aa-sans)}
.sign span{display:block;font:500 12px var(--aa-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol)}
@media (max-width:991.98px){.split{grid-template-columns:1fr}.split.reverse>:first-child{order:0}}

/* ---------- cards: the spec card (strip with the label + index, inset photo, title, text, link) ---------- */
.card-grid{display:grid;gap:24px;counter-reset:card}
.card-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:991.98px){.card-grid.cols-4,.card-grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:575.98px){.card-grid.cols-4,.card-grid.cols-3,.card-grid.cols-2{grid-template-columns:1fr}}
body:not(.page-index) .info-card{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid #B9CFCC;border-radius:10px;overflow:hidden;color:var(--aa-ink);text-decoration:none;counter-increment:card;transition:border-color .15s,box-shadow .2s,transform .2s}
body:not(.page-index) .info-card>.card-body{display:contents}
body:not(.page-index) .info-card .card-label{order:-1;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px;padding:0 14px;background:var(--aa-line-soft);color:var(--aa-petrol);font:500 12.5px/1.25 var(--aa-mono);letter-spacing:.06em;text-transform:uppercase;transition:background-color .15s,color .15s}
body:not(.page-index) .info-card .card-label::after{content:counter(card,decimal-leading-zero);content:counter(card,decimal-leading-zero) / "";color:var(--aa-muted);letter-spacing:.04em;font-variant-numeric:tabular-nums;transition:color .15s}
body:not(.page-index) .info-card .card-img{width:auto;margin:10px 10px 0;border-radius:6px;overflow:hidden;background:var(--aa-mist)}
body:not(.page-index) .info-card .card-img img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
body:not(.page-index) .info-card h3{margin:16px 18px 8px;font-size:20px;line-height:1.25}
body:not(.page-index) .info-card p{margin:0 18px;font-size:15.5px;line-height:1.55;color:var(--aa-muted)}
body:not(.page-index) .info-card .card-more{display:inline-flex;align-items:center;gap:6px;margin:auto 18px 18px;padding-top:14px;font:600 15.5px var(--aa-sans);color:var(--aa-petrol)}
body:not(.page-index) .info-card .card-more svg{width:16px;height:16px;fill:currentColor;transition:transform .2s}
body:not(.page-index) .info-card:hover{border-color:var(--aa-petrol);box-shadow:var(--aa-drop);transform:translateY(-3px);color:var(--aa-ink)}
body:not(.page-index) .info-card:hover .card-label,body:not(.page-index) .info-card:focus-visible .card-label{background:var(--aa-petrol);color:var(--aa-mist)}
body:not(.page-index) .info-card:hover .card-label::after,body:not(.page-index) .info-card:focus-visible .card-label::after{color:var(--aa-mist)}
body:not(.page-index) .info-card:hover .card-img img{transform:scale(1.04)}
body:not(.page-index) .info-card:hover .card-more svg{transform:translateX(3px)}
/* phones: a card with a photo becomes an index row (square thumbnail beside the title) */
@media (max-width:575.98px){
  body:not(.page-index) .card-grid .info-card:has(.card-img){display:grid;grid-template-columns:104px minmax(0,1fr);grid-template-rows:auto auto auto 1fr;column-gap:0}
  body:not(.page-index) .card-grid .info-card:has(.card-img) .card-label{grid-column:1/-1;grid-row:1}
  body:not(.page-index) .card-grid .info-card:has(.card-img) .card-img{grid-column:1;grid-row:2/5;margin:12px 0 12px 12px;align-self:start}
  body:not(.page-index) .card-grid .info-card:has(.card-img) .card-img img{aspect-ratio:1/1}
  body:not(.page-index) .card-grid .info-card:has(.card-img) h3{grid-column:2;grid-row:2;margin:12px 14px 6px;font-size:17px}
  body:not(.page-index) .card-grid .info-card:has(.card-img) p{grid-column:2;grid-row:3;margin:0 14px;font-size:14.5px}
  body:not(.page-index) .card-grid .info-card:has(.card-img) .card-more{grid-column:2;grid-row:4;margin:0 14px 14px;padding-top:8px;align-self:start;font-size:14.5px}
}
/* Resources, "All Articles": the newest article as the notebook page over a photo, as on the home page and /blog (final
   cross-site fix 2026-10-14; it was a wide card with a title bar, photo left and text right). Phones: the stacked card */
.blog-feature .card-grid>a.info-card:first-child{grid-column:1/-1}
@media (min-width:768px){
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto;column-gap:24px;align-items:end;height:auto;margin-bottom:40px;background:none;border:0;border-radius:0;box-shadow:none}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child:hover{transform:none;box-shadow:none}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child .card-img{grid-column:1/9;grid-row:1;margin:0;height:clamp(320px,30vw,420px);border-radius:10px;box-shadow:var(--aa-drop)}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child .card-img img{height:100%;min-height:0;aspect-ratio:auto}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child>.card-body{grid-column:7/13;grid-row:1;position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;margin:0 0 -40px;padding:38px clamp(26px,3vw,44px) 32px;background:var(--aa-mist) var(--aa-dots);border-radius:10px;box-shadow:var(--aa-drop);transition:box-shadow .2s}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child:hover>.card-body{box-shadow:0 26px 48px -22px rgba(15,76,92,.55)}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child .card-label{left:28px;background:var(--aa-petrol)!important;border-color:var(--aa-petrol)!important;color:var(--aa-mist)!important}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child .card-label::after{border-left-color:rgba(220,235,234,.45)!important;color:var(--aa-mist)}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child h3{margin:0;font-size:clamp(1.625rem,1.3rem + .9vw,2.125rem);line-height:1.12;letter-spacing:-.012em}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child p{margin:0;font-size:17px;max-width:52ch;color:var(--aa-ink)}
  body:not(.page-index) .blog-feature .card-grid>a.info-card:first-child .card-more{margin:6px 0 0;padding-top:0;align-self:start}
}

/* ---------- steps: a real sequence, DM Mono numerals on a ruled track ---------- */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;counter-reset:s;border-top:2px solid var(--aa-petrol)}
.steps li{position:relative;padding:26px 28px 30px 0;counter-increment:s}
.steps li + li{padding-left:28px;border-left:1px solid var(--aa-line-soft)}
.steps:not([style]) li:nth-child(3n+1){padding-left:0;border-left:0}
.steps:not([style]) li:nth-child(n+4){border-top:1px solid var(--aa-line-soft)}
.steps li::before{content:counter(s,decimal-leading-zero);display:block;margin-bottom:14px;font:500 40px/1 var(--aa-mono);letter-spacing:-.03em;color:var(--aa-petrol);font-variant-numeric:tabular-nums}
.steps h3{margin:0 0 .45rem;font-size:21px}
.steps p{margin:0;color:var(--aa-ink)}
/* one-column steps (Start Your Coverage): rows with the numeral in a left column */
.steps[style]{border-top:0;gap:0}
.steps[style] li,.steps[style] li + li{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:8px;padding:18px 0 20px;border-left:0;border-top:1px solid rgba(15,76,92,.22)}
.steps[style] li::before{grid-row:1/3;margin:0;font-size:30px}
.steps[style] li:first-child{border-top:2px solid var(--aa-petrol)}
.prose .steps{margin:28px 0 32px}
.prose .steps li::before{font-size:34px}
@media (max-width:767.98px){
  .steps{grid-template-columns:1fr}
  .steps li,.steps li + li{display:grid;grid-template-columns:56px minmax(0,1fr);padding:20px 0 22px;border-left:0;border-top:1px solid var(--aa-line-soft)}
  .steps li:first-child{border-top:0}
  .steps li::before{grid-row:1/3;margin:0;font-size:30px}
}

/* =====================================================================================================================
   CLOSING PANEL: the old "cta-band" is a white panel that straddles the edge into the mist footer
   (the footer's own cards then sit below it instead of overlapping the same edge)
   ===================================================================================================================== */
.cta-band{--cb-pad:clamp(48px,6vw,88px);--cb-seam:calc(50% + var(--cb-pad) / 2);position:relative;z-index:2;padding:var(--cb-pad) 0 0;color:var(--aa-ink);background:linear-gradient(180deg,#fff 0,#fff var(--cb-seam),transparent var(--cb-seam)),radial-gradient(circle,rgba(15,76,92,.18) 1.2px,transparent 1.4px) 0 100%/16px 16px,linear-gradient(180deg,transparent 0,transparent var(--cb-seam),var(--aa-mist) var(--cb-seam))}
.cta-band .container{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:20px 64px;align-items:center;padding:44px 56px;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;box-shadow:var(--aa-drop);text-align:left;max-width:min(1320px,calc(100% - 48px))}
.cta-band h2{margin:0;color:var(--aa-ink);font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem);max-width:25ch}
.cta-band p{margin:14px 0 0;color:var(--aa-muted);max-width:52ch}
.cta-band .container>div{display:contents}
.cta-band .container>div>h2{grid-column:1;grid-row:1/3}
.cta-band .container>div>p{grid-column:2;grid-row:1;margin:0;align-self:end}
.cta-band .btn{grid-column:2;grid-row:2;justify-self:start;align-self:start}
main:has(> .cta-band:last-child) + .aa-ft{margin-top:0;border-top:0}
main:has(> .cta-band:last-child) + .aa-ft .ft-top{padding-top:56px}
@media (max-width:991.98px){
  .cta-band .container{grid-template-columns:1fr;padding:36px 32px}
  .cta-band .container>div>h2,.cta-band .container>div>p,.cta-band .btn{grid-column:1;grid-row:auto}
  .cta-band .container>div>p{margin-top:2px}
}
@media (max-width:575.98px){
  .cta-band .container{max-width:calc(100% - 32px);padding:28px 20px 24px}
  .cta-band .btn{justify-self:stretch}
  main:has(> .cta-band:last-child) + .aa-ft .ft-top{padding-top:40px}
}

/* =====================================================================================================================
   READING PAGES: insurance tips (.guide-layout), About "How we make money", tool explainers, old posts
   ===================================================================================================================== */
.article-wrap{max-width:41rem;margin:0 auto}
/* the reading layout sits on the head's 12-column grid: text in columns 1-7 (it starts under the photo's overhang),
   the side column in 9-12 starts at once beside it */
.guide-layout{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
.guide-layout>*,.tool>*{min-width:0}
.guide-layout>:first-child{grid-column:1/8;max-width:66ch}
.guide-layout>.guide-aside{grid-column:9/13}
.guide-aside{position:sticky;top:var(--ip-stick);display:grid;gap:20px}
@media (max-width:1199.98px){.guide-layout>:first-child{grid-column:1/9}}
@media (max-width:991.98px){
  .guide-layout{grid-template-columns:minmax(0,1fr)}
  .guide-layout>:first-child,.guide-layout>.guide-aside{grid-column:1/-1}
  .guide-aside{position:static;margin-top:48px!important;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
}
@media (max-width:575.98px){.guide-aside{grid-template-columns:1fr}}

.prose{font-size:17.5px;line-height:1.7;color:var(--aa-ink)}
.prose p{margin:0 0 1.1em}
.guide-layout>.prose>p:first-child,.article-wrap>article.prose>p:first-child{font-size:clamp(1.125rem,1.05rem + .3vw,1.25rem);line-height:1.6}
.article-wrap>article.prose{font-size:18px}
.prose h2{position:relative;margin:2.3em 0 .65em;padding-top:22px;border-top:1px solid var(--aa-line-soft);font-size:clamp(1.625rem,1.4rem + .7vw,1.9375rem);line-height:1.12;scroll-margin-top:var(--ip-stick)}
.prose h2::before{content:"";position:absolute;left:0;top:-2px;width:48px;height:3px;background:var(--aa-petrol)}
.prose>h2:first-child{margin-top:0}
.prose h3{margin:1.7em 0 .45em;font-size:21px;line-height:1.25}
.prose h2 + h3{margin-top:.6em}
.prose a{font-weight:600}
.prose strong{font-weight:700;color:var(--aa-ink)}
.prose ul,.prose ol{margin:0 0 1.2em;padding-left:0}
.prose ul:not(.checklist):not(.steps){list-style:none}
.prose ul:not(.checklist):not(.steps)>li{position:relative;padding-left:26px}
.prose ul:not(.checklist):not(.steps)>li::before{content:"";position:absolute;left:3px;top:.68em;width:7px;height:7px;border-radius:1.5px;background:var(--aa-petrol)}
.prose ol:not(.steps){list-style:none;counter-reset:pol}
.prose ol:not(.steps)>li{position:relative;padding-left:40px;counter-increment:pol}
.prose ol:not(.steps)>li::before{content:counter(pol,decimal-leading-zero);position:absolute;left:0;top:.2em;font:500 14px/1.5 var(--aa-mono);color:var(--aa-petrol);font-variant-numeric:tabular-nums}
.prose li{margin-bottom:.5em}
.prose img{border-radius:10px;margin:1rem 0 1.4rem}
.prose .faq-q{margin:0}
.prose .steps{padding-left:0}

/* tables: DM Mono header labels, mist zebra, figures tabular */
.table-wrap{position:relative;margin:30px 0 34px;overflow-x:auto;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;-webkit-overflow-scrolling:touch}
.table-wrap table{width:100%;border-collapse:separate;border-spacing:0;font-size:16px;line-height:1.5;min-width:560px;font-variant-numeric:tabular-nums lining-nums}
.table-wrap table.fit{min-width:0}
.table-wrap thead th{padding:12px 16px;background:var(--aa-mist);border-bottom:1px solid var(--aa-line-soft);font:500 12px/1.35 var(--aa-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--aa-petrol);text-align:left;vertical-align:bottom}
.table-wrap td,.table-wrap tbody th{padding:14px 16px;border-bottom:1px solid var(--ip-rule);text-align:left;vertical-align:top}
.table-wrap tbody tr:nth-child(even)>*{background:var(--ip-zebra)}
.table-wrap tbody tr:last-child>*{border-bottom:0}
.table-wrap tbody td:first-child,.table-wrap tbody th{font-weight:600;color:var(--aa-ink)}
.table-wrap caption{caption-side:top;padding:12px 16px;font:500 12.5px var(--aa-mono);color:var(--aa-muted)}
/* a table of figures (Coverage Levels: split limits and dollar amounts) is set in DM Mono, right-aligned */
.page-coverage-levels .table-wrap tbody td{font:500 16px/1.5 var(--aa-mono);letter-spacing:-.01em}
.page-coverage-levels .table-wrap tbody td:not(:first-child),.page-coverage-levels .table-wrap thead th:not(:first-child){text-align:right}
.page-coverage-levels .table-wrap tbody td:first-child{color:var(--aa-petrol)}
/* a table that scrolls sideways keeps its row labels in view, so the scroll reads as a scroll (Compare Quotes, the
   coverage comparison on tablets) */
@media (max-width:991.98px){
  .cmp tbody th,.cmp thead th:first-child{position:sticky;left:0;z-index:1;background:#fff;box-shadow:1px 0 0 #E3EEED}
  .cmp thead th:first-child{background:var(--aa-mist)}
  .cmp tbody tr:nth-child(even)>th{background:#F3F8F7}
}
@media (max-width:767.98px){
  .table-wrap table{min-width:480px}
  .table-wrap table:not(.is-labelled) tbody td:first-child,.table-wrap table:not(.is-labelled) thead th:first-child,.table-wrap table:not(.is-labelled) tbody th{position:sticky;left:0;z-index:1;background:#fff;box-shadow:1px 0 0 var(--ip-rule)}
  .table-wrap table:not(.is-labelled) thead th:first-child{background:var(--aa-mist)}
  .table-wrap table:not(.is-labelled) tbody tr:nth-child(even)>:first-child{background:var(--ip-zebra)}
}
/* phones: a labelled table (main.js gives every cell its column's name) shows each row as a small card: the first cell
   is its title, every other cell carries its column name in DM Mono */
@media (max-width:575.98px){
  .table-wrap:has(>table.is-labelled),.cmp-wrap:has(>table.is-labelled){overflow:visible;background:#fff}
  table.is-labelled{display:block;width:100%;min-width:0!important}
  table.is-labelled thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
  table.is-labelled tbody,table.is-labelled tbody tr{display:block}
  table.is-labelled tbody tr{padding:16px 16px 14px;border-bottom:1px solid var(--ip-rule)}
  table.is-labelled tbody tr:last-child{border-bottom:0}
  table.is-labelled tbody tr:nth-child(even){background:var(--ip-zebra)}
  table.is-labelled tbody tr>*{display:block;padding:0!important;border:0!important;background:none!important;text-align:left!important}
  table.is-labelled tbody tr>:first-child{position:static!important;box-shadow:none!important;margin:0 0 8px;font:700 17px/1.3 var(--aa-sans)!important;letter-spacing:0!important;color:var(--aa-ink)!important}
  table.is-labelled tbody tr>:not(:first-child){padding:8px 0 0!important}
  table.is-labelled tbody tr>:not(:first-child)::before{content:attr(data-label);display:block;margin-bottom:2px;font:500 11.5px/1.45 var(--aa-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--aa-muted)}
  /* short values (the coverage comparison: one mark or word per cell) sit beside their column name */
  table.cmp.is-labelled tbody tr>:not(:first-child){display:grid;grid-template-columns:minmax(0,10.5rem) minmax(0,1fr);column-gap:14px;align-items:center;padding:9px 0 0!important}
  table.cmp.is-labelled tbody tr>:not(:first-child)::before{margin:0}
}

/* the callout is a spec card: mist strip, then the point it makes */
body:not(.page-index) .callout{position:relative;margin:30px 0 32px;padding:52px 24px 6px;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px}
body:not(.page-index) .callout::before{content:"Note";content:"Note" / "";position:absolute;left:0;right:0;top:0;display:flex;align-items:center;height:36px;padding:0 16px;background:var(--aa-mist);border-radius:9px 9px 0 0;font:500 12.5px/1 var(--aa-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol)}
body:not(.page-index) .callout::after{content:"";position:absolute;right:16px;top:13px;width:10px;height:10px;border-radius:2px;background:var(--aa-petrol)}
body:not(.page-index) .callout p{margin:0 0 1em}
body:not(.page-index) .callout strong{color:var(--aa-ink)}

/* notes: a quiet tag with a punched hole (the home worksheet's tag) */
body:not(.page-index) .note{position:relative;padding:14px 18px;background:var(--aa-mist);border:0;border-left:3px solid var(--aa-petrol);border-radius:0 6px 6px 0;font-size:15px;line-height:1.55;color:var(--aa-ink)}
body:not(.page-index) .section-alt .note,body:not(.page-index) .tool-panel .note{background:#fff;box-shadow:0 1px 0 rgba(15,76,92,.18),0 10px 24px -18px rgba(15,76,92,.5)}
.article-note{margin-top:2.6rem;padding-top:1.2rem;border-top:1px solid var(--aa-line-soft);font-size:15px;line-height:1.6;color:var(--aa-muted)}

/* checklists: petrol tick boxes */
body:not(.page-index) .checklist{list-style:none;padding:0!important;margin:0 0 1.3rem;display:grid;gap:12px}
body:not(.page-index) .checklist li{position:relative;padding-left:34px;margin:0;line-height:1.55}
body:not(.page-index) .checklist li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F4C5C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5l10 -10'/%3E%3C/svg%3E") center/20px no-repeat}

/* ---------- aside: "More insurance tips" as a spec card index, the dark promo as a petrol card ---------- */
.aside-card{position:relative;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;padding:0 0 8px;overflow:hidden}
.aside-card>h2{display:flex;align-items:center;justify-content:space-between;min-height:40px;margin:0;padding:0 16px;background:var(--aa-mist);font:500 12.5px/1.3 var(--aa-mono)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol)}
.aside-card>ul{list-style:none;margin:0;padding:6px 0 0;display:block}
.aside-card>ul>li>a{position:relative;display:flex;align-items:baseline;gap:12px;padding:10px 16px 10px;color:var(--aa-ink);font:600 15.5px/1.35 var(--aa-sans);text-decoration:none;transition:background-color .15s,color .15s}
/* the index is the page's number in the header menu (Insurance Tips 01-09, Tools 01-07), so both always agree */
.aside-card>ul>li>a::before{content:var(--n,"—");content:var(--n,"—") / "";min-width:20px;font:500 12px/1 var(--aa-mono);color:var(--aa-muted);font-variant-numeric:tabular-nums}
.aside-card a[href="/insurance-types"]{--n:"01"}.aside-card a[href="/coverage-levels"]{--n:"02"}.aside-card a[href="/lower-your-premium"]{--n:"03"}
.aside-card a[href="/compare-policies"]{--n:"04"}.aside-card a[href="/after-an-accident"]{--n:"05"}.aside-card a[href="/after-a-collision"]{--n:"06"}
.aside-card a[href="/reporting-an-accident"]{--n:"07"}.aside-card a[href="/filing-a-claim"]{--n:"08"}.aside-card a[href="/discounts"]{--n:"09"}
.aside-card a[href="/compare-quotes"]{--n:"01"}.aside-card a[href="/rate-checklist"]{--n:"02"}.aside-card a[href="/coverage-worksheet"]{--n:"03"}
.aside-card a[href="/budget-calculator"]{--n:"04"}.aside-card a[href="/deductible-calculator"]{--n:"05"}.aside-card a[href="/coverage-calculator"]{--n:"06"}
.aside-card a[href="/resources"]{--n:"07"}
.aside-card>ul>li+li>a::after{content:"";position:absolute;left:16px;right:16px;top:0;height:1px;background:var(--ip-rule)}
.aside-card>ul>li>a:hover{background:var(--aa-mist);color:var(--aa-petrol)}
.aside-card>ul>li>a:hover::before{color:var(--aa-petrol)}
.aside-card>ul>li>a:focus-visible{outline-offset:-3px}
.aside-card>p{margin:14px 16px 12px;font-size:15.5px;color:var(--aa-ink)}
.aside-card.dark{background:var(--aa-petrol);border-color:var(--aa-petrol);color:var(--aa-mist);padding:26px 24px 26px!important}
.aside-card.dark>h2{display:block;min-height:0;padding:0;margin:0 0 10px!important;background:none;color:#fff;font:800 24px/1.12 var(--aa-sans)!important;letter-spacing:-.012em;text-transform:none}
.aside-card.dark p,.aside-card.dark li{color:var(--aa-mist)}
.aside-card.dark>p{margin:0 0 18px;font-size:16px}
.aside-card.dark>ul{padding:0 0 4px;display:grid;gap:8px}
.aside-card.dark>ul>li>a::before,.aside-card.dark>ul>li+li>a::after{display:none}
.aside-card.dark>ul>li>a{padding:0;color:#fff;font-weight:600}
.aside-card.dark>ul>li>a:hover{background:none;color:#fff}
.aside-card.dark a:not(.btn){color:#fff;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.aside-card.dark .btn{margin:0}
.aside-card.dark .btn-brand{--bs-btn-bg:#DCEBEA;--bs-btn-color:#0F4C5C;--bs-btn-border-color:#DCEBEA;--bs-btn-hover-bg:#fff;--bs-btn-hover-color:#0B3B47;--bs-btn-hover-border-color:#fff;--bs-btn-active-bg:#fff;--bs-btn-active-color:#0B3B47}
.aside-card.dark .btn-brand:has(>svg:last-child)>svg:last-child{background:#fff;color:var(--aa-petrol);box-shadow:-2px 0 0 rgba(15,76,92,.2)}
.aside-card.dark .btn-brand:has(>svg:last-child):hover>svg:last-child{background:var(--aa-deep);color:var(--aa-mist)}
.aside-card.dark .checklist li::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23DCEBEA' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5l10 -10'/%3E%3C/svg%3E") center/20px no-repeat}
.aside-card:not(.dark) .btn{margin:6px 16px 10px}

/* =====================================================================================================================
   LEGAL (privacy, terms, refund, disclaimer): the admin text as a white document sheet straddling the slim head
   ===================================================================================================================== */
.page-head:not(.has-photo) + .section:has(.legal){padding-top:0}
.legal{--lg-pad:clamp(24px,5vw,64px);position:relative;z-index:2;max-width:880px;margin:calc(-1 * clamp(64px,6vw,88px)) auto 0;padding:0 var(--lg-pad) clamp(32px,4vw,56px);background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;box-shadow:var(--aa-drop);font-size:17px;line-height:1.7}
.legal>.updated:first-child{display:flex;align-items:center;gap:8px;max-width:none;min-height:46px;margin:0 calc(-1 * var(--lg-pad)) 32px;padding:0 var(--lg-pad);background:var(--aa-mist);border-radius:9px 9px 0 0;font:500 12.5px/1.3 var(--aa-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--aa-petrol)}
.legal>.updated:first-child strong{font-weight:500;color:var(--aa-ink)}
.legal .updated{color:var(--aa-muted);font-size:15px}
.legal h2{position:relative;margin:2.2em 0 .6em;padding-top:20px;border-top:1px solid var(--aa-line-soft);font-size:clamp(1.375rem,1.25rem + .45vw,1.625rem);line-height:1.2}
/* the section number a heading starts with is set in DM Mono (DocumentBody wraps it in .sec-n; the text is unchanged) */
.legal h2 .sec-n,.doc-body h2 .sec-n{font:500 .84em/1 var(--aa-mono);letter-spacing:-.03em;color:var(--aa-petrol);font-variant-numeric:tabular-nums}
.legal h2::after{content:"";position:absolute;left:0;top:-2px;width:40px;height:3px;background:var(--aa-petrol)}
.legal>.updated:first-child + h2,.legal>.updated:first-child + p + h2{margin-top:1.4em}
.legal h2[id],.legal h3[id]{scroll-margin-top:var(--ip-stick)}
.legal h3{margin:1.5em 0 .4em;font-size:19px}
.legal p,.legal li{max-width:68ch}
.legal ul,.legal ol{padding-left:1.3rem}
.legal li{margin-bottom:.55em}
.legal li::marker{color:var(--aa-petrol)}
.legal a{font-weight:600}
.legal .toc{background:var(--aa-mist);border:0;border-radius:10px;padding:1.2rem 1.4rem;margin:1.4rem 0 2rem}
.legal .toc ol{margin:0;padding-left:1.2rem;columns:2;column-gap:2rem}
@media (max-width:767.98px){
  .legal{margin-top:-56px;font-size:16.5px}
}
@media (max-width:575.98px){.legal .toc ol{columns:1}}

/* =====================================================================================================================
   PLANS (Start Your Coverage): three spec cards, DM Mono prices; Standard carries a petrol strip
   ===================================================================================================================== */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch;counter-reset:plan}
.plan{position:relative;display:flex;flex-direction:column;gap:14px;padding:58px 28px 28px;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;counter-increment:plan;transition:border-color .15s}
.plan::before{content:"Plan " counter(plan,decimal-leading-zero);content:"Plan " counter(plan,decimal-leading-zero) / "";position:absolute;left:0;right:0;top:0;display:flex;align-items:center;height:38px;padding:0 18px;background:var(--aa-mist);border-radius:9px 9px 0 0;font:500 12.5px/1 var(--aa-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol)}
.plan.popular{border:2px solid var(--aa-petrol);box-shadow:var(--aa-drop);padding-top:57px}
.plan.popular::before{background:var(--aa-petrol);color:var(--aa-mist);border-radius:8px 8px 0 0;top:-1px;left:-1px;right:-1px;height:40px}
.plan:hover{border-color:var(--aa-petrol)}
.plan .badge-pop{display:none}
.plan h2{font-size:26px;margin:0}
.plan .for{margin:0;color:var(--aa-muted);min-height:3.1em}
.plan .price{display:flex;align-items:baseline;gap:6px;padding:16px 0 18px;border-top:1px solid var(--aa-line-soft);border-bottom:1px solid var(--aa-line-soft);font:500 52px/1 var(--aa-mono);letter-spacing:-.04em;color:var(--aa-ink);font-variant-numeric:tabular-nums}
.plan.popular .price{color:var(--aa-petrol)}
.plan .price small{font:500 14px var(--aa-mono);letter-spacing:.02em;color:var(--aa-muted)}
.plan ul{list-style:none;padding:0;margin:4px 0 8px;display:grid;gap:10px}
.plan li{display:flex;gap:12px;align-items:flex-start;line-height:1.45}
.plan li svg{width:20px;height:20px;margin-top:2px;flex:none;fill:var(--aa-petrol)}
.plan .btn{margin-top:auto;align-self:stretch}
@media (max-width:991.98px){.plans{grid-template-columns:1fr;max-width:560px}}

/* =====================================================================================================================
   FAQ: ruled rows in a white sheet; the toggle is the button's square arrow cell
   ===================================================================================================================== */
.faq-list{max-width:none;margin:0;display:block;background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;overflow:hidden}
.faq-item{border:0;border-radius:0;background:transparent}
.faq-item + .faq-item{border-top:1px solid var(--aa-line-soft)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:68px;padding:14px 16px 14px 24px;transition:background-color .15s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";flex:none;width:36px;height:36px;border-radius:4px;background:var(--aa-mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F4C5C' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/18px no-repeat;transition:transform .2s,background-color .15s}
.faq-item summary:hover{background:#F6FAF9}
.faq-item summary:hover::after{background-color:var(--aa-line-soft)}
.faq-item summary:focus-visible{outline:3px solid var(--aa-ink);outline-offset:-3px}
.faq-item[open] summary::after{background-color:var(--aa-deep);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23DCEBEA' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.faq-item[open] summary{background:#F6FAF9}
.faq-q{font-size:18px;line-height:1.35;margin:0}
.faq-a{padding:4px 72px 22px 24px;color:var(--aa-ink);background:#F6FAF9}
.faq-a p{max-width:66ch}
.faq-a p:last-child{margin:0}
.section .center-head + .faq-list,.section-alt .faq-list{max-width:920px}
/* a FAQ section (Contact, Start Your Coverage): one centred column, the heading above the ruled list */
.section>.container:has(> .center-head + .faq-list)>.center-head{max-width:820px;margin:0 auto 28px}
.section>.container:has(> .center-head + .faq-list)>.center-head h2{max-width:none}
.section>.container:has(> .center-head + .faq-list)>.faq-list{max-width:820px;margin:0 auto}
@media (max-width:575.98px){
  .faq-item summary{padding:12px 12px 12px 16px;gap:14px}
  .faq-q{font-size:17px}
  .faq-a{padding:4px 16px 18px}
}
/* /faq: four groups, each a numbered chapter */
.page-faq .guide-layout>:first-child{counter-reset:fg}
.page-faq .guide-layout>:first-child>h2.h4{position:relative;display:flex;align-items:baseline;gap:14px;margin:56px 0 16px!important;font-size:26px!important;letter-spacing:-.01em;counter-increment:fg}
.page-faq .guide-layout>:first-child>h2.h4::before{content:counter(fg,decimal-leading-zero);content:counter(fg,decimal-leading-zero) / "";font:500 15px/1 var(--aa-mono);color:var(--aa-petrol);letter-spacing:.02em}
.page-faq .guide-layout>:first-child>p:first-child{font-size:1.15rem;max-width:56ch}
.page-faq .guide-aside .aside-card:not(.dark){padding-bottom:14px}
.page-faq .guide-aside .aside-card:not(.dark)>p{margin:14px 16px 6px}

/* =====================================================================================================================
   RESOURCES: the library as a three-part index (spec cards with numbered rows)
   ===================================================================================================================== */
.library{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.library>div{background:#fff;border:1px solid var(--aa-line-soft);border-radius:10px;overflow:hidden}
.library h2{display:flex;justify-content:space-between;align-items:center;min-height:44px;margin:0;padding:0 18px;background:var(--aa-mist);border:0;font:500 12.5px/1.2 var(--aa-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol)}
.library ul{list-style:none;padding:4px 0 8px;margin:0;display:block;counter-reset:lib}
.library li{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:8px;padding:12px 18px 13px;counter-increment:lib}
.library li::before{content:counter(lib,decimal-leading-zero);content:counter(lib,decimal-leading-zero) / "";grid-row:1/3;padding-top:4px;font:500 12px/1 var(--aa-mono);color:var(--aa-muted);font-variant-numeric:tabular-nums}
.library li+li::after{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:var(--ip-rule)}
.library li a{font:600 16.5px/1.35 var(--aa-sans);color:var(--aa-ink);text-decoration:none}
.library li a:hover{color:var(--aa-petrol);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.library li span{display:block;margin-top:3px;color:var(--aa-muted);font-size:14.5px;line-height:1.45}
@media (max-width:991.98px){.library{grid-template-columns:1fr;max-width:640px}}

/* =====================================================================================================================
   CONTACT CARDS (About, Contact): spec cards whose heading is the strip
   ===================================================================================================================== */
/* contact facts (/contact: four, /about: three): ruled lines on one notebook sheet, the labels in its margin (final
   cross-site fix 2026-10-14; the four PHONE / EMAIL / ADDRESS / BUSINESS HOURS widgets read like a settings screen) */
.contact-cards{--cs-m:200px;position:relative;display:grid;margin:0;padding:8px 0;background:#fff linear-gradient(90deg,transparent calc(var(--cs-m) + 13px),rgba(15,76,92,.32) calc(var(--cs-m) + 13px),rgba(15,76,92,.32) calc(var(--cs-m) + 15px),transparent calc(var(--cs-m) + 15px));border:1px solid var(--aa-line-soft);border-radius:10px;box-shadow:var(--aa-drop)}
.contact-card{display:grid;grid-template-columns:var(--cs-m) minmax(0,1.15fr) minmax(0,1fr);column-gap:28px;row-gap:4px;align-items:baseline;padding:22px 36px 21px 0;border-top:1px solid rgba(15,76,92,.16)}
.contact-card:first-child{border-top:0}
.contact-card>h2{grid-column:1;margin:0;padding:0 0 0 30px;font:500 12.5px/1.5 var(--aa-mono)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol)}
.contact-card>svg{display:none}
.contact-card>:not(h2):not(svg){grid-column:2}
.contact-card>.cc-note{grid-column:3;font-size:15.5px;color:var(--aa-muted)}
.contact-card.cc-wide>p{grid-column:2/-1}
.contact-card p,.contact-card a{margin:0;color:var(--aa-ink);text-decoration:none;overflow-wrap:anywhere;font-size:17px;line-height:1.5}
.contact-card a{font-weight:600}
.contact-card a[href^="tel:"]{font:500 21px/1.3 var(--aa-mono);letter-spacing:-.01em;color:var(--aa-petrol)}
.contact-card a:hover{color:var(--aa-petrol);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.page-about .contact-cards{max-width:960px;margin-inline:auto}
#partners{scroll-margin-top:calc(var(--ip-stick,120px) + 12px)}
@media (max-width:991.98px){
  .contact-cards{--cs-m:150px}
  .contact-card{padding-right:24px}
  .contact-card{grid-template-columns:var(--cs-m) minmax(0,1fr)}
  .contact-card>.cc-note,.contact-card.cc-wide>p{grid-column:2}
  .contact-card>h2{padding-left:22px}
}
@media (max-width:575.98px){
  .contact-cards{--cs-m:0px;padding:4px 0 4px 34px;background:#fff linear-gradient(90deg,transparent 19px,rgba(15,76,92,.32) 19px,rgba(15,76,92,.32) 21px,transparent 21px)}
  .contact-card{grid-template-columns:minmax(0,1fr);padding:18px 18px 17px 0}
  .contact-card>:not(h2):not(svg),.contact-card>.cc-note,.contact-card.cc-wide>p{grid-column:1}
  .contact-card>h2{padding:0}
}

/* =====================================================================================================================
   FORMS of the first design (contact, sign-up): the worksheet: fill-in lines on the dot grid
   (the home page's #guidance worksheet has its own rules in style.css)
   ===================================================================================================================== */
body:not(.page-index) .form-card{position:relative;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
body:not(.page-index) .form-card form{counter-reset:ws}
body:not(.page-index) .form-card form>h2{display:block;min-height:0;margin:0 0 28px;padding:18px 0 0;background:none;border-top:2px solid var(--aa-petrol);border-radius:0;color:var(--aa-ink);font:800 clamp(1.5rem,1.3rem + .6vw,1.875rem)/1.15 var(--aa-sans);letter-spacing:-.012em}
body:not(.page-index) .form-card .row{--bs-gutter-x:32px;--bs-gutter-y:26px}
body:not(.page-index) .form-card .form-label{counter-increment:ws}
body:not(.page-index) .form-card .form-label::before{content:counter(ws,decimal-leading-zero);content:counter(ws,decimal-leading-zero) / "";display:inline-block;min-width:2.2em;color:var(--aa-muted)}
body:not(.page-index) .form-card .form-control,body:not(.page-index) .form-card .form-select{height:48px;min-height:48px;padding:0 2px;background-color:transparent;border:0;border-bottom:2px solid var(--aa-petrol);border-radius:0;font:400 17.5px var(--aa-sans);color:var(--aa-ink);box-shadow:none}
body:not(.page-index) .form-card .form-select{padding-right:30px;background-position:right 2px center}
body:not(.page-index) .form-card .form-control::placeholder{color:#6A7F84}
body:not(.page-index) .form-card .form-control:focus,body:not(.page-index) .form-card .form-select:focus{background-color:rgba(255,255,255,.65);border-bottom-color:var(--aa-ink);box-shadow:0 1px 0 0 var(--aa-ink);outline:0}
body:not(.page-index) .form-card .form-control:focus-visible,body:not(.page-index) .form-card .form-select:focus-visible{outline:3px solid var(--aa-ink);outline-offset:3px}
body:not(.page-index) .form-card textarea.form-control{height:auto;min-height:128px;padding:6px 14px;border:1px solid var(--aa-petrol);border-radius:4px;line-height:28px;background:#fff repeating-linear-gradient(180deg,transparent 0,transparent 27px,rgba(15,76,92,.16) 27px,rgba(15,76,92,.16) 28px) 0 6px/100% 28px;background-attachment:local;resize:vertical}
body:not(.page-index) .form-card textarea.form-control:focus{border-color:var(--aa-ink);box-shadow:inset 0 0 0 1px var(--aa-ink)}
body:not(.page-index) .form-card .form-text{font-size:14px;color:var(--aa-muted);margin-top:8px}
body:not(.page-index) .form-card .form-label .form-text{font:400 13px var(--aa-sans);letter-spacing:0;text-transform:none;margin:0}
body:not(.page-index) .form-card .consent{padding:4px 0 0 36px;background:none;border:0;font-size:14.5px;line-height:1.55;color:var(--aa-ink)}
body:not(.page-index) .form-card .consent .form-check-input{width:22px;height:22px;margin:0 0 0 -36px;background-color:#fff}
body:not(.page-index) .form-card .consent .form-check-input:checked{background-color:var(--aa-petrol)}
body:not(.page-index) .form-card .consent a{font-weight:600}
body:not(.page-index) .form-card .btn-brand{min-height:56px}
body:not(.page-index) .form-card .was-validated .form-control:invalid,body:not(.page-index) .form-card .was-validated .form-select:invalid{border-color:var(--aa-warn-ink)}
body:not(.page-index) .form-card .form-success{margin-top:30px}
.split>.form-card{align-self:start}

/* =====================================================================================================================
   404 (not-found.tsx): a dot-grid page with the code in DM Mono and three ways back (one filled)
   ===================================================================================================================== */
.page-not-found main{background:var(--aa-mist) var(--aa-dots)}
.page-not-found .page-head{background:transparent}
.page-not-found .page-head .container{grid-template-columns:minmax(0,1fr);padding-top:clamp(56px,7vw,104px);padding-bottom:0}
.page-not-found .page-head .ph-text{max-width:none}
.page-not-found .page-head h1{max-width:none}
.page-not-found .page-head h1::before{content:"404";content:"404" / "";display:block;width:max-content;margin:0 0 26px;padding:0 0 18px;border-bottom:3px solid var(--aa-petrol);font:500 clamp(88px,9vw,120px)/.8 var(--aa-mono);letter-spacing:-.06em;color:var(--aa-petrol)}
.page-not-found .page-head + .section{padding-top:36px;padding-bottom:clamp(72px,8vw,120px);background:transparent}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px 16px;align-items:center;margin:0}
.page-not-found .hero-actions .btn{min-width:232px}
/* the two other ways back: the two-part shape as white tiles on the dot grid (a hairline parts the arrow cell), no outline */
.page-not-found .hero-actions .btn-outline-brand{--bs-btn-bg:#fff;--bs-btn-color:#0F4C5C;--bs-btn-border-width:0;--bs-btn-hover-bg:#fff;--bs-btn-hover-color:#0B3B47;--bs-btn-active-bg:#fff;--bs-btn-active-color:#0B3B47;box-shadow:0 1px 0 rgba(15,76,92,.12),var(--aa-drop)}
.page-not-found .hero-actions .btn:has(>svg:last-child){justify-content:space-between;padding-block:0;padding-right:0;overflow:hidden;align-items:stretch;line-height:52px}
.page-not-found .hero-actions .btn-outline-brand:has(>svg:last-child)>svg:last-child{box-sizing:border-box;width:52px;height:auto;align-self:stretch;padding:0 15px;margin-left:.75rem;background:#fff;color:var(--aa-petrol);box-shadow:-1px 0 0 var(--aa-line-soft);transition:background-color .15s,color .15s}
.page-not-found .hero-actions .btn-outline-brand:has(>svg:last-child):hover>svg:last-child{background:var(--aa-petrol);color:var(--aa-mist)}
.page-not-found .cta-band{background:transparent}
/* a road photo in a spec frame holds the right half of the page (decorative) */
.page-not-found{--ph-k:"Page not found";--ph-n:"404"}
.page-not-found .page-head.has-photo .ph-text{grid-column:1/-1;grid-row:1}
.page-not-found .page-head.has-photo + .section{padding-top:36px}
@media (min-width:992px){
  .page-not-found .page-head.has-photo .container{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
  .page-not-found .page-head.has-photo .ph-text{grid-column:1/8}
  .page-not-found .page-head.has-photo .ph-photo{grid-column:8/13;grid-row:1;align-self:start;margin:0 0 -120px;box-shadow:var(--aa-drop)}
  .page-not-found .page-head.has-photo .ph-photo>img{flex:none;min-height:0;aspect-ratio:4/3;object-position:50% 60%}
  .page-not-found .hero-actions{max-width:calc((100% * 7 + 144px) / 12);gap:12px}
  .page-not-found .hero-actions .btn{min-width:0}
}
@media (max-width:991.98px){.page-not-found .page-head.has-photo .ph-photo{display:none}}
@media (max-width:575.98px){.page-not-found .hero-actions .btn{width:100%}}

/* =====================================================================================================================
   INNER-PAGE REVIEW PASS (2026-10-14): the reviews' must / should / nice items that need rules of their own
   ===================================================================================================================== */
/* /faq: the aside opens with a contents card (dot grid, the four topics numbered like their chapters); "Still have a
   question?" closes the reading column as a white panel with the petrol button */
.page-faq .faq-toc{padding:0 0 8px;background:var(--aa-mist) var(--aa-dots);border-color:rgba(15,76,92,.16)}
.page-faq .faq-toc::before{content:"On this page";content:"On this page" / "";display:flex;align-items:center;min-height:44px;margin:0 16px;font:500 12.5px/1.2 var(--aa-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--aa-petrol);border-bottom:1px solid rgba(15,76,92,.22);background:linear-gradient(var(--aa-petrol),var(--aa-petrol)) 0 100%/48px 3px no-repeat}
.page-faq .faq-toc>ol{list-style:none;margin:0;padding:6px 0 0;counter-reset:ft}
.page-faq .faq-toc>ol>li{counter-increment:ft}
.page-faq .faq-toc>ol>li>a{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:6px;padding:9px 16px;color:var(--aa-ink);font:600 15.5px/1.35 var(--aa-sans);text-decoration:none;transition:background-color .15s,color .15s}
.page-faq .faq-toc>ol>li>a::before{content:counter(ft,decimal-leading-zero);content:counter(ft,decimal-leading-zero) / "";padding-top:2px;font:500 12px/1.4 var(--aa-mono);color:var(--aa-muted);font-variant-numeric:tabular-nums}
.page-faq .faq-toc>ol>li>a:hover{background:rgba(255,255,255,.7);color:var(--aa-petrol)}
.page-faq .faq-toc>ol>li>a:hover::before{color:var(--aa-petrol)}
.page-faq .faq-toc>ol>li>a:focus-visible{outline-offset:-3px}
.page-faq .guide-layout h2[id]{scroll-margin-top:var(--ip-stick)}
.page-faq .faq-ask{margin-top:56px;padding:26px clamp(22px,3vw,34px) 30px;background:#fff;border:1px solid var(--aa-line-soft);border-top:3px solid var(--aa-petrol);border-radius:10px;box-shadow:var(--aa-drop)}
.page-faq .faq-ask>h2{display:block;min-height:0;margin:0 0 10px;padding:0;background:none;font:800 clamp(1.5rem,1.3rem + .6vw,1.875rem)/1.15 var(--aa-sans)!important;letter-spacing:-.012em;text-transform:none;color:var(--aa-ink)}
.page-faq .faq-ask>p{margin:0 0 22px;font-size:17px;color:var(--aa-ink)}
.page-faq .faq-ask>p a{font-weight:600}
.page-faq .faq-ask .btn{margin:0}

/* About, "What Guides Our Work": the second mist band mirrors the first (the ruled sheet left, the words right) */
@media (min-width:992px){.page-about .split:has(>ul.checklist)>ul.checklist{order:-1}}

/* Start Your Coverage: the plan buttons are the two-part button (the arrow cell is drawn here), Standard stands 24 px
   higher and overlaps its neighbours, like the home's middle hero card */
.plan .btn{justify-content:space-between;padding-block:0;padding-right:0;overflow:hidden;align-items:stretch;line-height:52px}
.plan .btn::after{content:"";flex:none;width:52px;margin-left:.75rem;background:var(--aa-deep) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23DCEBEA' d='M13.2 5.3 20 12l-6.8 6.7-1.4-1.4 4.3-4.3H4v-2h12.1l-4.3-4.3z'/%3E%3C/svg%3E") center/20px no-repeat;box-shadow:-2px 0 0 rgba(255,255,255,.22);transition:background-color .15s}
.plan .btn-outline-brand::after{background-color:var(--aa-line-soft);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230F4C5C' d='M13.2 5.3 20 12l-6.8 6.7-1.4-1.4 4.3-4.3H4v-2h12.1l-4.3-4.3z'/%3E%3C/svg%3E");box-shadow:none}
.plan .btn-brand:hover::after{background-color:var(--aa-mist);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230F4C5C' d='M13.2 5.3 20 12l-6.8 6.7-1.4-1.4 4.3-4.3H4v-2h12.1l-4.3-4.3z'/%3E%3C/svg%3E")}
.plan .btn-outline-brand:hover::after{background-color:var(--aa-petrol);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23DCEBEA' d='M13.2 5.3 20 12l-6.8 6.7-1.4-1.4 4.3-4.3H4v-2h12.1l-4.3-4.3z'/%3E%3C/svg%3E")}
@media (min-width:992px){
  .plans{padding-top:24px}
  .plan.popular{z-index:2;margin:-24px -36px 0;padding-left:64px;padding-right:64px}
  .plan.popular::before{padding-left:54px}
}

/* Resources, "Calculators and Worksheets": the six tools as the home bento's petrol tool tile */
body:not(.page-index) #tools .info-card{background:var(--aa-petrol);border-color:var(--aa-petrol);color:#fff}
body:not(.page-index) #tools .info-card .card-label{background:var(--aa-deep);color:var(--aa-mist)}
body:not(.page-index) #tools .info-card .card-label::after{color:rgba(220,235,234,.78)}
body:not(.page-index) #tools .info-card h3{color:#fff}
body:not(.page-index) #tools .info-card p{color:var(--aa-mist)}
body:not(.page-index) #tools .info-card .card-more{align-self:flex-start;gap:0;min-height:44px;padding:0 0 0 14px;background:var(--aa-mist);border-radius:4px;overflow:hidden;color:var(--aa-petrol);line-height:44px}
body:not(.page-index) #tools .info-card .card-more svg{box-sizing:border-box;width:44px;height:auto;align-self:stretch;margin-left:14px;padding:0 13px;background:var(--aa-line-soft);fill:var(--aa-petrol);transform:none!important;transition:background-color .15s}
body:not(.page-index) #tools .info-card:hover{border-color:var(--aa-deep)}
body:not(.page-index) #tools .info-card:hover .card-label,body:not(.page-index) #tools .info-card:focus-visible .card-label{background:var(--aa-mist);color:var(--aa-petrol)}
body:not(.page-index) #tools .info-card:hover .card-label::after{color:var(--aa-petrol)}
body:not(.page-index) #tools .info-card:hover .card-more svg{background:var(--aa-deep);fill:var(--aa-mist)}

/* the footer's "Get Started" card on inner pages: they end with the closing panel's button, so the card says the same
   as a text link (two identical buttons never stand one above the other) */
body:not(.page-index):not(.aa-v2) .fc-go .aa-btn{align-self:flex-start;min-height:0;gap:8px;align-items:center}
body:not(.page-index):not(.aa-v2) .fc-go .aa-btn>span{padding:0!important;background:none;color:var(--aa-petrol);font:600 16px/1.3 var(--aa-sans);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
body:not(.page-index):not(.aa-v2) .fc-go .aa-btn>i{width:auto;background:none;color:var(--aa-petrol)}
body:not(.page-index):not(.aa-v2) .fc-go .aa-btn>i svg,body:not(.page-index):not(.aa-v2) .fc-go .aa-btn>i .ti{width:18px;height:18px}
body:not(.page-index):not(.aa-v2) .fc-go .aa-btn:hover>span{color:var(--aa-deep)}
body:not(.page-index):not(.aa-v2) .fc-go .aa-btn:hover>i{background:none;color:var(--aa-deep)}

/* old posts on phones: the current crumb (it repeats the title) stays on one line */
@media (max-width:575.98px){
  .page-head:has(.meta) .breadcrumb-item.active{min-width:0;max-width:62vw;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
}

/* Contact and sign-up worksheets: like the home's #guidance worksheet, the two-part submit closes the sheet on the
   right (full width on phones) */
@media (min-width:576px){
  body:not(.page-index) .form-card .col-12:has(>button[type=submit]){display:flex;flex-direction:column;align-items:flex-end}
  body:not(.page-index) .form-card button[type=submit].w-100{width:auto!important;min-width:300px}
  body:not(.page-index) .form-card .col-12:has(>button[type=submit])>.form-text{text-align:right!important}
}
/* /faq on phones and tablets: the topics card comes first, the other side cards after the questions */
@media (max-width:991.98px){
  .page-faq .guide-layout>.guide-aside{display:contents}
  .page-faq .faq-toc{order:-1;margin:0 0 36px}
  .page-faq .guide-layout>.guide-aside>.aside-card:not(.faq-toc){margin-top:24px}
  .page-faq .guide-layout>.guide-aside>.aside-card:not(.faq-toc):first-of-type{margin-top:48px}
}
/* old posts: the Learn article's contents card stands beside the reading column (desktop); the title then lines up
   with the column instead of the page's centre. Phones and tablets keep the single column. */
@media (min-width:992px){
  .article-wrap.with-toc{display:grid;grid-template-columns:minmax(0,41rem) 280px;column-gap:clamp(48px,6vw,104px);justify-content:space-between;align-items:start;max-width:none;margin:0}
  .article-wrap.with-toc>.post-side{position:sticky;top:var(--ip-stick)}
  .page-head:has(.meta):has(+ .section .article-wrap.with-toc) .ph-text{justify-self:start}
}
@media (max-width:991.98px){.article-wrap.with-toc>.post-side{display:none}}
/* a table that still scrolls sideways fades out at its right edge, so it reads as "more to the right" (Compare Quotes on
   phones, the coverage comparison on tablets) */
@media (max-width:767.98px){
  .table-wrap:has(> #cq-table){-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),rgba(0,0,0,.3));mask-image:linear-gradient(90deg,#000 calc(100% - 32px),rgba(0,0,0,.3))}
}
@media (min-width:576px) and (max-width:991.98px){
  .cmp-wrap{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),rgba(0,0,0,.3));mask-image:linear-gradient(90deg,#000 calc(100% - 32px),rgba(0,0,0,.3))}
}
@media (min-width:992px){.page-not-found .hero-actions .btn-outline-brand{--bs-btn-padding-x:1.05rem}}
