/* Customer account (/account, /account/login) and the printable line-item template. Self-contained so it doesn't depend on the marketing site styles. */
.acc { --ink: #14201c; --muted: #5d6964; --paper: #f4f1ea; --paper-2: #ebe6db; --line: #e3ddd0; --line-2: #d2ccbf; --fir: #1f4d3f; --fir-ink: #163a2f; --mint: #dfece5; --mint-2: #a9d1bf;
  --slate: #3f566b; --slate-bg: #e6ecf1; --ochre: #6a5a1c; --ochre-bg: #f1ecd7; --err: #a0302a; --err-bg: #f8e9e7;
  margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: var(--paper); color: var(--ink); font: 16px/1.55 "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
.acc *, .acc *::before, .acc *::after { box-sizing: border-box; }
.acc a { color: var(--fir); }
.acc h1 { font: 450 32px/1.15 "Newsreader", Georgia, serif; letter-spacing: -.01em; margin: 0 0 10px; }
.acc h3 { font-size: 15px; margin: 22px 0 10px; }
.acc h1:focus { outline: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.acc-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 62px; padding: 0 16px; background: var(--fir-ink); color: #fff; }
.acc-brand { display: inline-flex; align-items: center; gap: 10px; color: #fff !important; text-decoration: none; font: 500 20px/1 "Newsreader", Georgia, serif; }
.acc-brand img { border-radius: 8px; }
.acc-out { min-height: 40px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px; background: none; color: #fff; font: 600 14px/1 inherit; font-family: inherit; cursor: pointer; }
.acc-out:hover { background: rgba(255, 255, 255, .1); }
.acc-main { flex: 1; width: 100%; max-width: 860px; margin: 0 auto; padding: 26px 16px 40px; }
.acc-foot { padding: 20px 16px 28px; text-align: center; color: var(--muted); font-size: 14px; }

.acc-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 24px; margin-bottom: 14px; box-shadow: 0 1px 2px rgba(22, 58, 47, .05), 0 6px 18px -12px rgba(22, 58, 47, .18); }
.acc-narrow { max-width: 480px; margin: 6vh auto 0; }
.acc-head { margin: 0 0 18px; } .acc-head p { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.acc-skel { height: 220px; border-radius: 18px; background: linear-gradient(90deg, #ece8df, #f6f3ed, #ece8df); background-size: 200% 100%; animation: sk 1.2s linear infinite; }
@keyframes sk { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .acc-skel { animation: none; } }

.acc label { display: block; font-weight: 600; margin: 14px 0 6px; }
.acc input[type="email"], .acc textarea { width: 100%; font: inherit; color: inherit; padding: 11px 13px; min-height: 48px; border: 1px solid var(--line-2); border-radius: 12px; background: #fff; }
.acc input:focus, .acc textarea:focus { outline: none; border-color: #2b6553; box-shadow: 0 0 0 3px var(--mint); }
.acc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; margin-top: 14px; border: 0; border-radius: 999px; background: var(--fir); color: #fff !important; font: 600 16px/1 inherit; font-family: inherit; text-decoration: none; cursor: pointer; }
.acc-btn:hover { background: var(--fir-ink); } .acc-btn:disabled { opacity: .6; cursor: default; }
.acc-btn-block { width: 100%; }
.acc-btn-ghost { background: #fff; color: var(--fir-ink) !important; border: 1px solid var(--line-2); } .acc-btn-ghost:hover { background: var(--paper); }
.acc-err { background: var(--err-bg); color: var(--err); padding: 10px 12px; border-radius: 10px; margin: 12px 0 0; }
.acc-ok { background: var(--mint); color: var(--fir-ink); padding: 10px 14px; border-radius: 10px; font-weight: 600; margin: 14px 0 0; }
.acc-small { font-size: 14px; color: var(--muted); margin: 12px 0 0; }
.acc-new { text-align: center; }

/* one quote */
.acc-q { padding: 0; overflow: hidden; }
.acc-q > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; cursor: pointer; list-style: none; }
.acc-q > summary::-webkit-details-marker { display: none; }
.acc-q > summary::after { content: "+"; font-size: 24px; line-height: 1; color: var(--muted); margin-left: 4px; } .acc-q[open] > summary::after { content: "\2212"; }
.acc-q-t { display: grid; min-width: 0; margin-right: auto; } .acc-q-t b { font-size: 17px; } .acc-q-t span { color: var(--muted); font-size: 14px; overflow-wrap: anywhere; }
.acc-q-b { padding: 0 20px 22px; border-top: 1px solid var(--line); }
.acc-pill { display: inline-flex; align-items: center; height: 28px; padding: 0 11px; border-radius: 999px; font-size: 13px; font-weight: 600; white-space: nowrap; background: var(--slate-bg); color: var(--slate); }
.acc-pill.st-waiting { background: var(--ochre-bg); color: var(--ochre); } .acc-pill.st-reviewing { background: var(--paper-2); color: var(--ink); }
.acc-pill.st-offer { background: var(--mint); color: var(--fir); } .acc-pill.st-nosaving { background: var(--paper-2); color: var(--muted); }

.acc-steps { list-style: none; margin: 18px 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.acc-steps li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--paper); min-width: 0; }
.acc-steps .dot { flex: none; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--line); color: #fff; }
.acc-steps .dot svg { width: 14px; height: 14px; }
.acc-steps li span:last-child { display: grid; min-width: 0; } .acc-steps b { font-size: 14px; line-height: 1.25; } .acc-steps small { color: var(--muted); font-size: 12.5px; }
.acc-steps .done { background: var(--mint); } .acc-steps .done .dot { background: var(--fir); }
.acc-steps .now { background: var(--fir); color: #fff; } .acc-steps .now .dot { background: #fff; } .acc-steps .now small { color: var(--mint-2); }
@media (max-width: 520px) { .acc-steps li { flex-direction: column; align-items: flex-start; gap: 6px; padding: 9px; } .acc-steps b { font-size: 13px; } }

.acc-note { margin: 0; padding: 14px 16px; background: var(--paper); border-radius: 12px; white-space: pre-line; }
.acc-ask { padding: 16px 18px; border-radius: 14px; background: var(--ochre-bg); }
.acc-ask ul { margin: 6px 0 10px; padding-left: 20px; } .acc-ask li { margin-bottom: 4px; } .acc-ask p { margin: 6px 0 0; }
.acc-eyebrow { margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.acc-offer { padding: 18px; border-radius: 14px; background: var(--mint); margin-bottom: 14px; }
.acc-nums { display: flex; gap: 22px; flex-wrap: wrap; align-items: flex-end; }
.acc-nums div { display: grid; } .acc-nums span { font-size: 13px; color: var(--muted); }
.acc-nums b { font: 450 38px/1.05 "Newsreader", Georgia, serif; color: var(--fir-ink); } .acc-nums s { font-size: 20px; color: var(--muted); }
.acc-save { display: inline-block; margin-top: 10px; padding: 4px 12px; border-radius: 999px; background: var(--fir); color: #fff; font-weight: 600; font-size: 14px; }
.acc-offer .acc-note { margin-top: 12px; background: rgba(255, 255, 255, .6); }
.acc .qd-wrap { margin: 0 -8px 8px; } .acc .qd { font-size: 14.5px; }

.acc-msgs { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.acc-msg { padding: 12px 14px; border-radius: 14px; background: var(--paper); max-width: 92%; }
.acc-msg.from-me { background: var(--mint); margin-left: auto; }
.acc-msg-h { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; } .acc-msg-h time { color: var(--muted); }
.acc-msg ul { margin: 6px 0; padding-left: 20px; } .acc-msg p { margin: 6px 0 0; white-space: pre-line; overflow-wrap: anywhere; }
.acc-files-inline { display: flex; flex-wrap: wrap; gap: 6px; } .acc-files-inline a { font-size: 13.5px; padding: 3px 10px; border-radius: 999px; background: #fff; text-decoration: none; overflow-wrap: anywhere; }

.acc-reply { margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: #fcfbf8; }
.acc-reply h3 { margin-top: 0; }
.acc-file { position: relative; display: inline-flex !important; align-items: center; min-height: 44px; margin: 10px 0 0 !important; padding: 0 16px; border: 1.5px dashed var(--line-2); border-radius: 999px; background: #fff; color: var(--fir-ink); cursor: pointer; }
.acc-file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.acc-file:focus-within { box-shadow: 0 0 0 3px var(--mint); }
.acc-picked { list-style: none; margin: 8px 0 0; padding: 0; font-size: 14px; } .acc-picked small { color: var(--muted); }
.acc-files { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.acc-files a { display: flex; justify-content: space-between; gap: 10px; padding: 10px 14px; border-radius: 12px; background: var(--paper); text-decoration: none; color: var(--ink); }
.acc-files b { font-weight: 600; overflow-wrap: anywhere; } .acc-files small { color: var(--muted); white-space: nowrap; }
.acc-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 0 0; }
.acc-facts div { display: grid; } .acc-facts dt { font-size: 12.5px; color: var(--muted); } .acc-facts dd { margin: 0; font-weight: 600; }
@media (max-width: 420px) { .acc-facts { grid-template-columns: 1fr 1fr; } .acc h1 { font-size: 28px; } .acc-card { padding: 20px 18px; } }

/* printable line-item template: blank cells to write in */
.tp-blank { min-width: 70px; border-bottom: 1px solid #c9c3b6 !important; }
.qd-page .qd-table td.tp-blank { height: 38px; }

/* ---------- v2: green welcome band, savings overview, motion ---------- */
.acc-main { max-width: 920px; }
.acc-hero { position: relative; overflow: hidden; margin: 0 0 26px; padding: 28px 26px 24px; border-radius: 22px; color: #fff; isolation: isolate;
  background: radial-gradient(120% 140% at 100% 0, #2f6b57 0, rgba(47, 107, 87, 0) 55%), linear-gradient(160deg, var(--fir) 0, var(--fir-ink) 100%); box-shadow: 0 18px 40px -24px rgba(22, 58, 47, .7); animation: acc-rise .7s cubic-bezier(.2, .8, .2, 1) both; }
.acc-hero::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; border: 36px solid rgba(169, 209, 191, .12); z-index: -1; animation: acc-float 9s ease-in-out infinite; }
.acc-hero .acc-eyebrow { color: var(--mint-2); }
.acc-hero h1 { color: #fff; margin-bottom: 4px; }
.acc-hero-t p:last-child { margin: 0; color: rgba(255, 255, 255, .7); overflow-wrap: anywhere; }
.acc-stats { display: grid; grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }
.acc-stat { display: grid; align-content: end; gap: 2px; padding: 14px 16px; border-radius: 16px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .12); animation: acc-rise .6s cubic-bezier(.2, .8, .2, 1) both; }
.acc-stat:nth-child(2) { animation-delay: .08s; } .acc-stat:nth-child(3) { animation-delay: .16s; } .acc-stat:nth-child(4) { animation-delay: .24s; }
.acc-stat b { font: 450 30px/1.05 "Newsreader", Georgia, serif; color: #fff; font-variant-numeric: tabular-nums; }
.acc-stat span { font-size: 13px; color: rgba(255, 255, 255, .72); }
.acc-stat-big { background: #fff; border-color: #fff; }
.acc-stat-big b { font-size: 40px; color: var(--fir-ink); } .acc-stat-big span { color: var(--fir); font-weight: 700; }
.acc-hero-note { margin: 14px 0 0; font-size: 14px; color: rgba(255, 255, 255, .75); }
@media (max-width: 640px) { .acc-hero { padding: 22px 18px 18px; border-radius: 18px; } .acc-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } .acc-stat-big { grid-column: 1 / -1; } .acc-stat { padding: 12px; } .acc-stat b { font-size: 24px; } .acc-stat-big b { font-size: 36px; } }
.acc-h2 { font: 450 22px/1.2 "Newsreader", Georgia, serif; margin: 0 0 12px; }

/* quote cards rise in one after another; the open one has a green edge */
.acc-q { animation: acc-rise .6s cubic-bezier(.2, .8, .2, 1) both; transition: box-shadow .25s, transform .25s, border-color .25s; border-left: 5px solid var(--line); }
.acc-q.d1 { animation-delay: .06s; } .acc-q.d2 { animation-delay: .12s; } .acc-q.d3 { animation-delay: .18s; } .acc-q.d4 { animation-delay: .24s; } .acc-q.d5 { animation-delay: .3s; }
.acc-q:hover { box-shadow: 0 2px 4px rgba(22, 58, 47, .06), 0 16px 32px -18px rgba(22, 58, 47, .35); }
.acc-q[open] { border-left-color: var(--fir); }
.acc-q:has(.st-offer) { border-left-color: #2f8a63; }
.acc-q-b { animation: acc-fade .45s ease both; }
.acc-pill.st-received { background: var(--mint); color: var(--fir); }
.acc-pill.st-received::before, .acc-pill.st-reviewing::before, .acc-pill.st-waiting::before { content: ""; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: currentColor; animation: acc-blink 1.6s ease-in-out infinite; }
.acc-pill.st-offer { background: var(--fir); color: #fff; }

/* the step we're on glows */
.acc-steps li { position: relative; animation: acc-rise .5s cubic-bezier(.2, .8, .2, 1) both; }
.acc-steps li.st1 { animation-delay: .08s; } .acc-steps li.st2 { animation-delay: .16s; }
.acc-steps .now { background: var(--fir); box-shadow: 0 0 0 0 rgba(47, 138, 99, .55); animation: acc-rise .5s cubic-bezier(.2, .8, .2, 1) both, acc-glow 2.2s ease-out .6s infinite; }
.acc-steps .now .dot { position: relative; background: var(--mint-2); }
.acc-steps .now .dot::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: var(--fir); }
.acc-steps .now .dot::before { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--mint-2); animation: acc-ring 1.8s ease-out infinite; }
.acc-steps .done .dot svg { animation: acc-pop .5s cubic-bezier(.3, 1.6, .5, 1) both; }

/* offer: the saving gets the spotlight */
.acc-offer { background: linear-gradient(150deg, var(--mint) 0, #cfe6da 100%); border: 1px solid var(--mint-2); }
.acc-save { animation: acc-pop .6s cubic-bezier(.3, 1.6, .5, 1) .3s both; box-shadow: 0 6px 16px -8px rgba(31, 77, 63, .7); }

@keyframes acc-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes acc-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes acc-pop { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
@keyframes acc-glow { 0% { box-shadow: 0 0 0 0 rgba(47, 138, 99, .5); } 70% { box-shadow: 0 0 0 12px rgba(47, 138, 99, 0); } 100% { box-shadow: 0 0 0 0 rgba(47, 138, 99, 0); } }
@keyframes acc-ring { from { opacity: .9; transform: scale(.8); } to { opacity: 0; transform: scale(1.6); } }
@keyframes acc-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes acc-float { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-14px, 12px); } }
@media (prefers-reduced-motion: reduce) { .acc *, .acc *::before, .acc *::after { animation: none !important; transition: none !important; } }