/* Fire Risk Direct. Navy and orange come from the logo (assets/brand). Orange is too light for white text,
   so buttons pair orange with navy text, and small orange text uses the darker --accent. */
:root{
  --ink:#0b1a30;--navy:#092a58;--muted:#4a5568;--faint:#667085;--line:#d9dee7;--surface:#f2f4f7;--paper:#fff;
  --orange:#fd6200;--orange-hover:#ff7414;--accent:#c24a00;--orange-tint:#ffe6d2;
  --band:#092a58;--band-text:#ffffff;--band-muted:#aebdd3;--band-line:#23406b;--band-accent:#ff8a3d;
  --error:#b3261e;--error-tint:#fdf0ef;
  --radius:12px;--radius-small:8px;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --font:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:72px;--space-9:104px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--space-5);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--font);font-variation-settings:'wdth' 100;caret-color:var(--accent);-webkit-font-smoothing:antialiased}
::selection{background:var(--orange-tint);color:var(--ink)}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--accent)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img,svg{display:block}
[hidden]{display:none!important}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
h1,h2,h3{color:var(--navy);font-weight:780;font-variation-settings:'wdth' 100;text-wrap:balance;letter-spacing:-.012em}
h1{font-size:clamp(38px,4.8vw,62px);line-height:1.04;letter-spacing:-.022em}
h2{font-size:clamp(28px,3.1vw,40px);line-height:1.04}
h3{font-size:18px;line-height:1.3;font-variation-settings:'wdth' 90;letter-spacing:0}
p{text-wrap:pretty}
.container{width:min(1200px,calc(100% - 64px));margin-inline:auto}
.lede{color:var(--muted);max-width:44ch;margin-top:var(--space-4)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;top:-100px;left:20px;background:var(--paper);padding:var(--space-3);z-index:5}.skip:focus{top:10px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.icon{width:20px;height:20px;flex:none}

/* Header and footer */
.header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);padding-block:var(--space-5)}
.brand{display:inline-flex;flex:none}
.brand img{width:200px;height:auto}
.header nav{display:flex;align-items:center;gap:var(--space-6);font-size:15px;font-weight:520}
.header nav>a:not(.button){text-decoration:none;color:var(--muted);transition:color 150ms ease}
.header nav>a:not(.button):hover{color:var(--ink)}
.footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-5);padding-block:var(--space-7);border-top:1px solid var(--line);margin-top:var(--space-8)}
.footer p{color:var(--muted);font-size:14px;max-width:38ch}
.footer>div{display:flex;flex-wrap:wrap;gap:var(--space-5);font-size:14px;color:var(--muted)}

/* Buttons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:52px;padding:0 22px;border:0;border-radius:var(--radius-small);background:var(--orange);color:var(--navy);font-weight:700;font-size:16px;text-decoration:none;transition:background-color 150ms ease,transform 160ms var(--ease-out)}
.button:hover{background:var(--orange-hover);color:var(--navy)}
.button:active{transform:scale(.97)}
.button:focus-visible{outline-color:var(--navy)}
.button-wide{width:100%;justify-content:space-between}
.button-small{min-height:40px;padding:0 16px;font-size:14px}
.button-link{border:0;background:none;padding:var(--space-2) 0;color:var(--muted);font-size:14px;text-decoration:underline;text-underline-offset:.2em}
.button-link:hover{color:var(--ink)}
.text-link{display:inline-block;margin-top:var(--space-5);font-weight:650;color:var(--accent)}
button:disabled{opacity:.6;cursor:progress}

/* Hero */
.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);grid-template-areas:'copy card' 'details card';grid-template-rows:auto 1fr;column-gap:var(--space-8);align-items:start;padding-block:var(--space-7) var(--space-9)}
.hero-copy{grid-area:copy}.hero .quote-card{grid-area:card}.hero-details{grid-area:details}
.hero-copy{padding-top:var(--space-5)}
.hero-description{font-size:19px;color:var(--muted);max-width:46ch;margin-top:var(--space-5)}
.terms{margin-top:var(--space-6);max-width:560px;border-top:1px solid var(--line)}
.terms div{display:grid;grid-template-columns:150px 1fr;gap:var(--space-4);padding-block:14px;border-bottom:1px solid var(--line)}
.terms dt{color:var(--faint);font-size:15px}
.terms dd{font-weight:560}
.aside-link{margin-top:var(--space-6);color:var(--muted)}
.aside-link a{color:var(--ink);font-weight:600}
.page-intro{padding-bottom:var(--space-7)}
.page-intro .button{margin-top:var(--space-6)}

/* Quote card: one elevation (tinted surface, no border, no shadow) */
.quote-card{background:var(--surface);border-radius:var(--radius);padding:var(--space-6);scroll-margin-top:var(--space-5)}
.card-title{font-size:30px}
.form-intro{color:var(--muted);font-size:15px;margin:var(--space-2) 0 var(--space-5)}
.quote-card label{display:block;font-size:14px;font-weight:600;margin-bottom:var(--space-4)}
.quote-card input,.quote-card select,.quote-card textarea{display:block;width:100%;margin-top:6px;min-height:48px;padding:10px 12px;border:1px solid #c4cdc7;border-radius:var(--radius-small);background:var(--paper);font-size:16px;font-weight:400;transition:border-color 150ms ease}
.quote-card input:hover,.quote-card select:hover,.quote-card textarea:hover{border-color:#9aa69e}
.quote-card input:focus-visible,.quote-card select:focus-visible,.quote-card textarea:focus-visible{outline:2px solid var(--navy);outline-offset:0;border-color:var(--navy)}
.quote-card input::placeholder,.quote-card textarea::placeholder{color:#7c877f}
.quote-card textarea{resize:vertical;min-height:88px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}
.form-grid label{min-width:0}
.optional{font-weight:400;color:var(--faint)}
.more-details{margin-bottom:var(--space-4)}
.more-details summary{cursor:pointer;font-size:14px;font-weight:600;margin-bottom:var(--space-3);width:fit-content}
.checkbox-label{display:flex!important;gap:var(--space-3);align-items:flex-start;font-weight:400!important;line-height:1.45;color:var(--muted)}
.checkbox-label input{width:18px!important;height:18px;min-height:0!important;flex:none;margin:1px 0 0!important;accent-color:var(--navy)}
.checkbox-label a{color:var(--ink)}
input[type=date]{accent-color:var(--navy)}
.form-error{font-size:15px;color:var(--error);background:var(--error-tint);padding:var(--space-3);border-radius:var(--radius-small);margin-bottom:var(--space-4)}
.form-foot{font-size:14px;color:var(--muted);margin-top:var(--space-3)}
.preview-notice{font-size:13px;color:var(--muted);margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px dashed #b9c3bc}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;left:-10000px}
.book-title{font-size:20px;margin:var(--space-5) 0 var(--space-4)}
.reference{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;margin-top:var(--space-4)}
#success p{color:var(--muted);margin-top:var(--space-3)}

/* The one authored moment: the price arrives */
#step-book{transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out)}
@starting-style{#step-book{opacity:0;transform:translateY(6px)}}
.price-result{outline:none}
.price-result p{color:var(--muted);font-size:15px}
.price-label{font-weight:600;color:var(--navy)!important}
.price-figure{font-size:76px!important;line-height:1!important;font-weight:800;font-variation-settings:'wdth' 90;letter-spacing:-.03em;color:var(--navy)!important;font-variant-numeric:tabular-nums lining-nums;margin:var(--space-2) 0 var(--space-3);animation:price-in 520ms var(--ease-out) both}
@keyframes price-in{from{clip-path:inset(0 0 100% 0);transform:translateY(18px);filter:blur(3px)}to{clip-path:inset(0 0 -10% 0);transform:none;filter:none}}

/* Sections */
.section{padding-block:var(--space-9) 0}
.section-head{max-width:720px}
.split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-8);align-items:start}
.surface{background:var(--surface);margin-top:var(--space-9)}
.surface .section{padding-block:var(--space-9)}
.band{background:var(--band);color:var(--band-text)}
.band .section{padding-block:var(--space-9)}
.band .lede{color:var(--band-muted)}
.band h2{color:#fff}
.band+.section{margin-top:0}

.timeline{list-style:none;padding:0;margin-top:var(--space-7);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5)}
.timeline li{border-top:2px solid var(--navy);padding-top:var(--space-4)}
.timeline li:first-child{border-color:var(--orange)}
.when{display:block;color:var(--accent);font-weight:650;font-size:15px;margin-bottom:var(--space-5)}
.timeline p{color:var(--muted);font-size:16px;margin-top:var(--space-2)}

.show-table{width:100%;border-collapse:collapse;margin-top:var(--space-7)}
.show-table thead th{text-align:left;font-size:14px;font-weight:600;color:var(--faint);padding:0 0 var(--space-3);border-bottom:2px solid var(--navy)}
.show-table tbody th,.show-table tbody td{text-align:left;vertical-align:top;padding:18px 0;border-bottom:1px solid var(--line)}
.show-table tbody th{width:30%;padding-right:var(--space-5);font-weight:680;color:var(--navy)}
.show-table td{color:var(--muted);max-width:62ch}
.show-table a{color:var(--ink)}

.sheet{background:var(--paper);border-radius:4px;padding:var(--space-6) var(--space-6) var(--space-5);box-shadow:0 1px 2px rgba(9,42,88,.06),0 24px 48px -24px rgba(9,42,88,.24);max-width:560px}
.sheet-head{display:flex;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;padding-bottom:var(--space-4);border-bottom:2px solid var(--navy)}
.sheet-head strong{font-weight:720;font-size:18px;color:var(--navy)}
.sheet-head span{color:var(--faint);font-size:14px}
.sheet-rows div{display:grid;grid-template-columns:140px 1fr;gap:var(--space-4);padding-block:13px;border-bottom:1px solid var(--line);font-size:16px}
.sheet-rows dt{color:var(--faint)}
.sheet figcaption{font-size:13px;color:var(--faint);margin-top:var(--space-4)}

.trust-list div{display:grid;grid-template-columns:150px 1fr;gap:var(--space-4);padding-block:var(--space-4);border-bottom:1px solid var(--band-line)}
.trust-list div:first-child{border-top:1px solid var(--band-line)}
.trust-list dt{color:var(--band-muted);font-size:15px}
.placeholder{display:inline-block;border:1px dashed var(--band-accent);padding:0 8px;border-radius:4px;font-size:14px;color:var(--band-muted)}

.price-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.price-table th,.price-table td{padding:18px 0;border-bottom:1px solid var(--line);text-align:left;font-weight:400}
.price-table tr:first-child th,.price-table tr:first-child td{border-top:2px solid var(--navy)}
.price-table td{text-align:right;color:var(--navy);font-weight:780;font-size:30px;line-height:1;white-space:nowrap}
.price-table td.quote-cell{font-size:17px;font-weight:600;font-variation-settings:'wdth' 100;color:var(--muted)}

.steps-list{padding-left:1.4em;display:grid;gap:var(--space-5);max-width:62ch}
.steps-list li{padding-left:var(--space-2)}
.steps-list li::marker{font-weight:700;color:var(--accent)}
.two-lists{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7)}
.two-lists h3{margin-bottom:var(--space-3)}
.plain-list{list-style:none;padding:0;border-top:1px solid var(--line)}
.plain-list li{padding-block:var(--space-3);border-bottom:1px solid var(--line)}
.plain-list.muted li{color:var(--muted)}

.faq-list{max-width:820px;margin-top:var(--space-6);border-top:2px solid var(--navy)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);cursor:pointer;list-style:none;padding-block:18px;font-weight:600;font-size:18px;color:var(--navy)}
.faq-list summary::-webkit-details-marker{display:none}
.chevron{width:20px;height:20px;flex:none;color:var(--faint);transition:transform 200ms var(--ease-out)}
.faq-list details[open] .chevron{transform:rotate(180deg)}
.faq-list details p{color:var(--muted);max-width:68ch;padding-bottom:var(--space-5)}

.legal{max-width:720px;padding-top:var(--space-7)}
.legal h1{font-size:clamp(34px,4vw,48px)}
.legal h2{font-size:22px;margin-top:var(--space-6)}
.legal p{color:var(--muted);margin-top:var(--space-3);max-width:68ch}
.legal a{color:var(--accent)}
.updated{font-size:14px;color:var(--faint)}
.notice{background:var(--surface);padding:var(--space-3) var(--space-4);border-radius:var(--radius-small)}

@media(max-width:1020px){
  .container{width:calc(100% - 48px)}
  .hero{column-gap:var(--space-7);grid-template-columns:minmax(0,1fr) minmax(330px,1fr)}
  .header nav{gap:var(--space-5)}
  .split{gap:var(--space-7)}
  .timeline{grid-template-columns:1fr 1fr;row-gap:var(--space-6)}
}
@media(max-width:820px){
  .header nav>a:not(.button){display:none}
  .hero{grid-template-columns:1fr;grid-template-areas:'copy' 'card' 'details';grid-template-rows:auto;row-gap:var(--space-6);padding-block:var(--space-4) var(--space-8)}
  .hero-copy{padding-top:0}
  .terms{margin-top:0}
  .split,.two-lists{grid-template-columns:1fr;gap:var(--space-6)}
  .section{padding-top:var(--space-8)}
  .surface,.band .section,.surface .section{margin-top:0}
  .surface{margin-top:var(--space-8)}
  .surface .section,.band .section{padding-block:var(--space-8)}
  .show-table thead{display:none}
  .show-table tbody tr{display:block;padding-block:var(--space-4);border-bottom:1px solid var(--line)}
  .show-table tbody th,.show-table tbody td{display:block;width:auto;padding:0;border:0}
  .show-table tbody td{margin-top:var(--space-1)}
  .show-table tbody tr:first-child{border-top:2px solid var(--navy)}
}
@media(max-width:520px){
  .brand img{width:168px}
  .container{width:calc(100% - 32px)}
  body{font-size:16px}
  .hero-description{font-size:17px}
  .quote-card{padding:var(--space-5) var(--space-4);margin-inline:-4px}
  .form-grid{grid-template-columns:1fr;gap:0}
  .terms div,.trust-list div,.sheet-rows div{grid-template-columns:1fr;gap:2px}
  .timeline{grid-template-columns:1fr}
  .sheet{padding:var(--space-5) var(--space-4)}
  .price-figure{font-size:64px!important}
  .price-table td{font-size:24px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}
