/* Auto Insure Portal - front page (2026-10-06 restyle).
   Oxblood + sky on ivory, Bricolage Grotesque over Figtree. The structure is
   the policy year: a split hero with an arched photo (the "portal" of the
   logo), the four moments as a numbered timeline, three mistakes, a documents
   checklist, and a split closing band. Deliberately not CCG's centred photo
   hero / definition list / card row. */
:root{--aip-ox:#6E1E3A;--aip-ox-d:#48112A;--aip-ox-t:#F3E7EB;--aip-sky:#7CC6E8;--aip-sky-h:#9AD4EE;--aip-sky-t:#E4F3FA;
 --aip-bg:#FBF7F2;--aip-ink:#221418;--aip-mut:#6A5A60;--aip-line:#E9DFD8;
 --aip-disp:"Bricolage Grotesque","Figtree",system-ui,sans-serif;--aip-text:"Figtree","Segoe UI",system-ui,Arial,sans-serif}
.hp{background:var(--aip-bg);color:var(--aip-ink);font-family:var(--aip-text);font-size:17px;line-height:1.65}
.hp .aip-wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.hp h1,.hp h2,.hp h3{font-family:var(--aip-disp);font-weight:700;color:var(--aip-ink);letter-spacing:-.02em;margin:0;text-wrap:balance}

.hp .aip-btn{display:inline-block;background:var(--aip-ox);color:#fff;font-weight:700;font-size:16px;text-decoration:none;padding:15px 30px;border-radius:999px;transition:background .15s}
.hp .aip-btn:hover,.hp .aip-btn:focus-visible{background:var(--aip-ox-d);color:#fff}
.hp .aip-link{color:var(--aip-ox);font-weight:700;text-decoration:none;border-bottom:2px solid var(--aip-sky);padding-bottom:2px}
.hp .aip-link:hover{color:var(--aip-ox-d);border-bottom-color:var(--aip-ox)}

/* HERO */
.hp .aip-hero{padding:64px 0 72px}
.hp .aip-split{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hp .aip-kick{display:inline-block;background:var(--aip-sky-t);color:var(--aip-ox-d);font-size:13px;font-weight:700;letter-spacing:.04em;border-radius:999px;padding:6px 14px;margin:0 0 20px}
.hp .aip-hero h1{font-size:clamp(34px,4.6vw,58px);line-height:1.04;margin:0 0 20px}
.hp .aip-hero h1 em{font-style:normal;color:var(--aip-ox)}
.hp .aip-lede{color:var(--aip-mut);margin:0 0 30px;font-size:19px;max-width:46ch}
.hp .aip-ctas{display:flex;flex-wrap:wrap;gap:22px;align-items:center}
.hp .aip-note{font-size:13.5px;color:var(--aip-mut);margin:18px 0 0}
.hp .aip-photo{position:relative;margin:0}
.hp .aip-photo:before{content:"";position:absolute;inset:22px -18px -18px 22px;border-radius:220px 220px 18px 18px;background:var(--aip-sky)}
.hp .aip-photo img{position:relative;display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:38% 30%;border-radius:220px 220px 18px 18px}
.hp .aip-photo figcaption{position:absolute;left:-18px;bottom:28px;background:#fff;border-radius:12px;padding:12px 16px;box-shadow:0 10px 30px rgba(34,20,24,.14);font-size:14px;line-height:1.35;max-width:220px}
.hp .aip-photo figcaption b{display:block;color:var(--aip-ox);font-family:var(--aip-disp);font-size:16px}

/* FOUR MOMENTS */
.hp .aip-sec{padding:76px 0}
.hp .aip-sec-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px 40px;margin:0 0 40px}
.hp .aip-sec-h h2{font-size:clamp(28px,3.4vw,42px);max-width:20ch}
.hp .aip-sec-h p{margin:0;color:var(--aip-mut);max-width:44ch}
.hp .aip-moments{background:#fff;border-top:1px solid var(--aip-line);border-bottom:1px solid var(--aip-line)}
.hp .aip-tl{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:m;border-top:3px solid var(--aip-ox)}
.hp .aip-step{position:relative;padding:34px 24px 6px 0}
.hp .aip-step + .aip-step{padding-left:24px;border-left:1px solid var(--aip-line)}
.hp .aip-step:before{counter-increment:m;content:counter(m);position:absolute;top:-19px;left:0;width:34px;height:34px;border-radius:50%;background:var(--aip-ox);color:#fff;font:700 16px/34px var(--aip-disp);text-align:center}
.hp .aip-step + .aip-step:before{left:24px}
.hp .aip-step h3{font-size:21px;margin:6px 0 10px;color:var(--aip-ox)}
.hp .aip-step p{margin:0 0 14px;color:var(--aip-mut);font-size:15.5px}
.hp .aip-step .aip-tip{color:var(--aip-ink);font-size:14.5px;background:var(--aip-sky-t);border-radius:10px;padding:10px 12px}
.hp .aip-step .aip-go{font-size:14.5px}

/* THREE MISTAKES */
.hp .aip-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hp .aip-card{background:var(--aip-ox);color:#F6E9EE;border-radius:120px 120px 14px 14px;padding:56px 26px 28px;text-align:center}
.hp .aip-card .aip-n{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--aip-sky);color:var(--aip-ink);font:800 18px var(--aip-disp);margin:0 0 16px}
.hp .aip-card h3{color:#fff;font-size:21px;line-height:1.25;margin:0 0 10px}
.hp .aip-card p{margin:0;font-size:15.5px;color:#EBD7DE}

/* DOCUMENTS */
.hp .aip-docs{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start;background:var(--aip-sky-t);border-radius:22px;padding:44px}
.hp .aip-docs h2{font-size:clamp(26px,3vw,36px);margin:0 0 14px}
.hp .aip-docs p{color:var(--aip-mut);margin:0 0 14px}
.hp .aip-check{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hp .aip-check li{background:#fff;border-radius:12px;padding:14px 16px 14px 50px;position:relative;font-size:15.5px}
.hp .aip-check li:before{content:"";position:absolute;left:16px;top:16px;width:20px;height:20px;border-radius:6px;background:var(--aip-ox)}
.hp .aip-check li:after{content:"";position:absolute;left:22px;top:19px;width:6px;height:10px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.hp .aip-check b{display:block;font-family:var(--aip-disp);color:var(--aip-ink)}

/* CLOSING BAND */
.hp .aip-end{background:var(--aip-ox-d);padding:60px 0}
.hp .aip-end .aip-wrap{display:grid;grid-template-columns:1.3fr auto;gap:28px 48px;align-items:center}
.hp .aip-end h2{color:#fff;font-size:clamp(26px,3.2vw,38px);margin:0 0 10px}
.hp .aip-end p{color:#EBD7DE;margin:0;max-width:56ch}
.hp .aip-end .aip-btn{background:var(--aip-sky);color:var(--aip-ink)}
.hp .aip-end .aip-btn:hover{background:var(--aip-sky-h);color:var(--aip-ink)}
.hp .aip-end .aip-end-alt{margin:14px 0 0;font-size:14px;text-align:center}
.hp .aip-end .aip-end-alt a{color:var(--aip-sky)}

@media(max-width:960px){
 .hp .aip-tl{grid-template-columns:1fr 1fr;border-top:0}
 .hp .aip-step,.hp .aip-step + .aip-step{padding:30px 18px 10px 18px;border-left:0;border-top:3px solid var(--aip-ox)}
 .hp .aip-step:before,.hp .aip-step + .aip-step:before{left:18px}
}
@media(max-width:860px){
 .hp .aip-split,.hp .aip-docs,.hp .aip-end .aip-wrap{grid-template-columns:1fr}
 .hp .aip-split{gap:44px}
 .hp .aip-photo{max-width:420px;margin:0 18px 0 0}
 .hp .aip-cards{grid-template-columns:1fr}
 .hp .aip-hero{padding:40px 0 56px}
 .hp .aip-sec{padding:56px 0}
 .hp .aip-docs{padding:28px 20px}
 .hp .aip-wrap{padding:0 16px}
 .hp .aip-end .aip-end-alt{text-align:left}
}
@media(max-width:600px){.hp .aip-tl{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.hp .aip-btn{transition:none}}