/* Customer quote + invoice pages (quote/index.php, invoice/index.php). Site tokens come from assets/styles.css. */
html{scroll-behavior:smooth}
.doc-page{background:radial-gradient(110% 50% at 70% -8%,#1b2a4d 0%,#0c1426 42%,var(--ink) 100%) no-repeat,var(--ink);min-height:100vh}
.doc-page section{padding-block:0}
.doc-wrap{max-width:1120px;margin:0 auto;padding:0 32px}
@media(max-width:640px){.doc-wrap{padding:0 18px}}
.sr-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.muted{color:var(--muted)}

.doc-top{padding:18px 0;border-bottom:1px solid var(--line);background:rgba(10,16,32,.6);backdrop-filter:blur(10px)}
.doc-top .doc-wrap{display:flex;align-items:center;justify-content:space-between;gap:12px}
.doc-logo img{width:64px;height:auto}
.doc-call{padding:11px 18px;font-size:14px}
@media(max-width:480px){.doc-call{font-size:13px;padding:10px 14px}.doc-logo img{width:52px}}

.doc-banner{max-width:1120px;margin:18px auto 0;padding:12px 18px;border-radius:var(--r-sm);font-size:14px}
.banner-preview{background:rgba(188,208,255,.08);border:1px dashed rgba(188,208,255,.45);color:var(--star);width:calc(100% - 36px)}
.banner-preview strong{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-right:8px}
/* Online payments (decided with Brendan 2026-09-26): "Pay $X online" and the notes after Stripe. */
.banner-paid{background:rgba(88,196,140,.1);border:1px solid rgba(88,196,140,.45);color:var(--star);width:calc(100% - 36px)}
.banner-payerr{background:rgba(232,110,98,.1);border:1px solid rgba(232,110,98,.45);color:var(--star);width:calc(100% - 36px)}
.banner-paid strong,.banner-payerr strong{margin-right:6px}
.pay-online{margin:0}
.pay-online button{width:100%}
.pay-online button[disabled]{opacity:.55;cursor:default}
.pay-online-note{margin:8px 0 12px;color:var(--muted,#9fb0c8);font-size:12.5px;line-height:1.4;text-align:center}
.qc-payments .pay-online{margin:0 0 16px}
.pay-online-amount{display:block;margin:0 0 10px;text-align:left}
.pay-online-amount>span:first-child{display:block;margin-bottom:6px;color:var(--muted,#9fb0c8);font:500 11px var(--mono,monospace);letter-spacing:.12em;text-transform:uppercase}
.pay-online-field{display:flex;align-items:center;gap:6px;height:48px;padding:0 14px;border:1px solid rgba(243,210,138,.35);border-radius:12px;background:rgba(10,16,32,.55);color:#f4efe4;font-size:20px;font-weight:600}
.pay-online-field:focus-within{border-color:#f3d28a;box-shadow:0 0 0 3px rgba(243,210,138,.18)}
.pay-online-field input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:inherit;font:inherit;font-size:20px}
.pay-online-field input::-webkit-inner-spin-button,.pay-online-field input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.pay-online-field input[type=number]{-moz-appearance:textfield;appearance:textfield}
.pay-online-amount small{display:block;margin-top:6px;color:var(--muted,#9fb0c8);font-size:12.5px}

.doc-hero{padding:56px 0 28px!important}
.doc-hero h1{font-size:clamp(38px,6vw,68px);margin:12px 0 30px;max-width:18ch;text-wrap:balance}
.doc-hero-plain h1{margin-bottom:10px}
.hero-note{color:var(--muted);max-width:60ch}
.design{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line-2);box-shadow:0 40px 90px -40px rgba(255,207,118,.35),0 30px 60px -30px rgba(0,0,0,.8);background:var(--panel-2)}
.design img{width:100%;height:auto}
.design figcaption{padding:12px 18px;font-size:13px;color:var(--muted);border-top:1px solid var(--line);background:rgba(10,16,32,.7)}

.done{margin:28px 0 0;padding:28px 30px;border-radius:var(--r);border:1px solid var(--line-2);background:linear-gradient(180deg,var(--panel),var(--panel-2))}
.done h2{font-size:clamp(28px,4vw,40px);margin:8px 0 12px}
.done p{margin-top:8px}
.done .btn{margin-top:10px}
.done-ok{border-color:rgba(243,210,138,.5);box-shadow:0 30px 80px -40px rgba(255,207,118,.5)}
.pay-how{padding:14px 16px;border-left:3px solid var(--gold);background:rgba(243,210,138,.06);border-radius:0 10px 10px 0;margin:14px 0!important}

/* Approved quote: confirmation concept 05. */
.quote-confirmation{margin-top:28px}
.qc-visual{display:grid;align-items:center;min-height:365px;padding:36px;border:1px solid rgba(232,197,130,.32);border-radius:30px 30px 0 0;background:#162238}
.qc-inner{display:grid;grid-template-columns:148px minmax(0,1fr);align-items:center;gap:clamp(32px,5vw,82px);min-height:265px;padding:37px clamp(32px,5vw,72px);border:1px solid rgba(232,197,130,.5);border-radius:18px;background:#101a2b}
.qc-seal{display:grid;place-items:center;width:148px;height:148px;border:1px solid #e8c582;border-radius:50%;color:#f9e5ba;font:300 80px/1 var(--sans)}
.qc-eyebrow{margin:0;color:#e8c582;font:700 13px/1.4 var(--sans);letter-spacing:.26em}
.doc-page .qc-message h2{margin:9px 0 14px;font-size:clamp(33px,3.3vw,50px);font-weight:700;letter-spacing:-.05em;line-height:1.06}
.qc-message>p:last-child{max-width:710px;margin:0;color:#b9c4d5;font-size:clamp(16px,1.5vw,19px);line-height:1.5}
.qc-payments{padding:29px clamp(25px,3.5vw,48px) 24px;border:1px solid rgba(232,197,130,.32);border-top:0;border-radius:0 0 25px 25px;background:#111b2c}
.qc-payment-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:7px 20px;margin-bottom:17px}
.doc-page .qc-payment-head h3{margin:0;color:#fff9ed;font-size:19px;font-weight:700;letter-spacing:-.02em}
.qc-payment-head p{margin:0;color:#b9c4d5;font-size:14px}
.qc-payment-head strong{color:#f9e5ba}
.qc-methods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:0;padding:0;list-style:none}
.qc-method{display:flex;align-items:center;gap:12px;min-width:0;min-height:74px;padding:12px;border:1px solid rgba(232,197,130,.24);border-radius:13px;background:rgba(255,255,255,.035)}
.qc-method-icon{display:grid;flex:0 0 40px;place-items:center;width:40px;height:40px;overflow:hidden;border-radius:10px;background:#594c36}
.qc-method-icon img{width:40px;height:40px;object-fit:contain}
.qc-method-check .qc-method-icon img,.qc-method-cash .qc-method-icon img,.qc-method-card .qc-method-icon img{width:24px;height:24px}
.qc-method-paypal .qc-method-icon{background:#fff}
.qc-method-paypal .qc-method-icon img{width:33px;height:33px}
.qc-method-zelle .qc-method-icon,.qc-method-venmo .qc-method-icon{background:transparent}
.qc-method-copy{min-width:0}
.qc-method-copy strong{display:block;color:#fff9ed;font-size:14px;font-weight:700;line-height:1.2}
.qc-method-detail{display:block;margin-top:4px;color:#b9c4d5;font-size:12px;line-height:1.35;overflow-wrap:anywhere}
.qc-method-detail a{color:#f9e5ba;text-decoration:underline;text-underline-offset:2px}
.qc-payment-note{margin:17px 0 0;color:#b9c4d5;font-size:13px;white-space:normal}
.qc-help{margin:17px 0 0;padding-top:14px;border-top:1px solid rgba(232,197,130,.18);color:#b9c4d5;font-size:13px}
.qc-help strong{color:#fff9ed}
.qc-help a{color:#f9e5ba;text-decoration:underline;text-underline-offset:2px}
.qc-invoice-link{margin:16px 0 0}
.qc-install-note{display:flex;align-items:center;gap:14px;margin-top:18px;padding:16px 18px;border:1px solid rgba(232,197,130,.32);border-radius:13px;background:rgba(232,197,130,.06)}
.qc-calendar{display:grid;flex:0 0 42px;place-items:center;width:42px;height:42px;border-radius:10px;background:rgba(232,197,130,.15)}
.qc-calendar img{width:23px;height:23px}
.qc-install-note p{margin:0;color:#fff9ed;font-size:14px;line-height:1.5}
@media(max-width:760px){.qc-visual{padding:18px}.qc-inner{grid-template-columns:1fr;gap:19px;min-height:0;padding:30px}.qc-seal{width:76px;height:76px;font-size:46px}.qc-methods{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:500px){.qc-methods{grid-template-columns:1fr}.qc-payments{padding:25px 20px 22px}.qc-method{min-height:62px}}

.doc-page section.price{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start;padding-block:12px 40px}
@media(max-width:900px){.doc-page section.price{grid-template-columns:1fr}.doc-page .summary{order:-1;position:static}}
.note{display:flex;gap:14px;align-items:flex-start;margin:0 0 22px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r);background:rgba(255,255,255,.02)}
.note img{border-radius:50%;object-fit:cover;flex:none}
.note p{font-size:16px}
.note cite{display:block;margin-top:6px;font-style:normal;color:var(--gold);font-family:var(--sans);font-weight:600;font-size:15px}

.lines{width:100%;border-collapse:collapse;font-size:15.5px}
.lines td{padding:14px 4px;border-bottom:1px solid var(--line);vertical-align:top}
.lines tbody td strong{display:block;font-weight:600}
.lines tbody tr.subject th{padding:18px 4px 8px;border-bottom:1px solid var(--line);color:var(--gold-soft);font:700 15px/1.35 var(--sans);text-align:left}
.lines tbody td small{display:block;color:var(--muted-2);font-size:13px;margin-top:3px;font-family:var(--mono)}
.lines thead th{padding:0 4px 10px;border-bottom:1px solid var(--line-2);color:var(--muted);font:700 10.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;text-align:left}
.lines .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--muted)}
.lines thead .amt,.lines thead .num{text-align:right}
.lines tbody td .desc{display:block;margin-top:3px;color:var(--muted);font-size:14.5px;white-space:pre-line}
.lines tbody td small.each{display:none}
.lines td.qty{width:56px}.lines td.price{width:96px}
.scope{margin:0 0 20px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(255,255,255,.02)}
.scope .eyebrow{margin:0 0 6px;font-size:10.5px}
.scope p:last-child{margin:0;color:var(--paper);font-size:15px;line-height:1.55}
/* Phones: qty and price step out (each line says "× 6 at $20.00" under it) but keep their columns, so the amounts line up with the totals. */
@media(max-width:560px){.lines thead .num,.lines td.num{display:table-cell;width:0;padding:0!important;font-size:0;overflow:hidden;border-left:0;border-right:0}.lines tbody td small.each{display:block}}
.lines .amt{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.lines tfoot td{border-bottom:0;padding:7px 4px;color:var(--muted)}
.lines tfoot tr.sub:first-child td{padding-top:16px}
.lines tfoot .total td{color:var(--paper);font-weight:700;font-size:18px;border-top:1px solid var(--line-2);padding-top:12px}
.lines tfoot .dep td{color:var(--gold-soft);font-weight:600}
.paid-h{font-size:24px;margin:28px 0 4px}

.summary{position:sticky;top:20px}
.summary-card{padding:24px;border-radius:var(--r);border:1px solid rgba(243,210,138,.35);background:linear-gradient(180deg,#132040,var(--panel-2));box-shadow:0 30px 70px -40px rgba(255,207,118,.45)}
.summary-card .eyebrow{font-size:10.5px}
.big{margin:14px 0 16px}
.big small{display:block;color:var(--muted);font-size:13px}
.big strong{font-family:var(--sans);font-weight:700;font-size:44px;line-height:1.05;letter-spacing:-.02em;color:var(--gold-soft);font-variant-numeric:tabular-nums}
.sum-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:14.5px}
.sum-row span{color:var(--muted)}
.sum-row.overdue strong{color:#ff9b9b}
.summary .btn{margin-top:12px}
.btn-quiet{background:none;border:0;color:var(--muted);font-size:14px;padding:10px}
.btn-quiet:hover{color:var(--gold-soft)}

.included{margin-top:34px}
.included h2{font-size:30px;margin-bottom:14px}
.inc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:560px){.inc-grid{grid-template-columns:1fr}}
.inc-grid div{padding:18px;border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(255,255,255,.02)}
.inc-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(243,210,138,.1);color:var(--gold);margin-bottom:10px}
.inc-grid strong{display:block;margin-bottom:4px}
.inc-grid p{color:var(--muted);font-size:14px}

.decide{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:22px;margin:10px 0 26px;scroll-margin-top:20px}
@media(max-width:820px){.decide{grid-template-columns:1fr}}
.decide-card{padding:30px;border-radius:var(--r);border:1px solid rgba(243,210,138,.45);background:linear-gradient(180deg,#152445,var(--panel-2))}
.decide-card h2{font-size:clamp(30px,4vw,40px);margin:8px 0 10px}
.decide-card>p{color:var(--muted);margin-bottom:16px}
.field{display:block;font-size:13px;font-weight:600;margin:14px 0 0}
.field input,.field textarea{display:block;width:100%;margin-top:8px;background:var(--panel-2);border:1px solid var(--line-2);border-radius:var(--r-sm);padding:14px 16px;color:var(--paper);font:16px var(--sans)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(243,210,138,.16)}
.decide-card .field input{font-family:var(--sans);font-size:19px;font-weight:600;padding:13px 16px}
.agree{display:flex;gap:10px;align-items:flex-start;margin:16px 0 18px;font-size:14px;color:var(--muted);cursor:pointer}
.agree input{width:20px;height:20px;margin-top:1px;accent-color:#f3d28a;flex:none}
.agree a{color:var(--gold-soft);text-decoration:underline}
.form-err{color:#ff9b9b;font-size:14px;margin-top:8px}
.decide-more{display:grid;gap:12px;align-content:start}
.decide-more details,.terms details{border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(255,255,255,.02)}
.decide-more summary,.terms summary{cursor:pointer;padding:16px 18px;font-weight:600;list-style:none;display:flex;justify-content:space-between}
.decide-more summary::after,.terms summary::after{content:"+";color:var(--gold)}
details[open]>summary::after{content:"–"}
.decide-more form{padding:0 18px 18px}
.decide-more .btn{margin-top:12px}
.terms{margin-bottom:56px}
.terms-body{padding:0 18px 20px;color:var(--muted);font-size:14.5px;line-height:1.65}

.show{padding:56px 0!important;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.015),transparent)}
.show-head{margin:10px 0 20px;max-width:640px}
.show-head h2{font-size:clamp(32px,4.5vw,48px);margin:8px 0 6px}
.show-head p{color:var(--muted)}
.show-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:48px}
.show-grid-4{grid-template-columns:repeat(4,1fr);margin-bottom:14px}
@media(max-width:820px){.show-grid,.show-grid-4{grid-template-columns:repeat(2,1fr)}}
.show-grid figure{margin:0;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:var(--panel-2)}
.show-grid img{width:100%;aspect-ratio:4/3;object-fit:cover}
.show-grid figcaption{padding:9px 12px;font-size:12.5px;color:var(--muted)}
.reviews{columns:3 280px;column-gap:12px}
.review{break-inside:avoid;margin:0 0 12px;padding:20px;border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(255,255,255,.025)}
.review p{margin:8px 0 12px;font-size:15px}
.review cite{font-style:normal;font-weight:600;font-size:14px}
.review cite span{color:var(--muted-2);font-weight:400}
.stars{color:var(--gold);letter-spacing:2px}
.show-more{margin:4px 0 48px}

.brendan{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:center;margin:56px 0;padding:28px;border:1px solid var(--line-2);border-radius:var(--r);background:linear-gradient(180deg,var(--panel),var(--panel-2))}
.brendan img{width:180px;height:180px;border-radius:50%;object-fit:cover;border:2px solid rgba(243,210,138,.5)}
.brendan h2{font-size:38px;margin:6px 0 8px}
.brendan p{color:var(--muted);max-width:56ch}
.brendan-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
@media(max-width:640px){.brendan{grid-template-columns:1fr;text-align:center}.brendan img{margin:0 auto;width:120px;height:120px}.brendan-actions{justify-content:center}.brendan p{margin:0 auto}}

.pay-card{margin-top:30px;padding:24px;border-radius:var(--r);border:1px solid rgba(243,210,138,.35);background:rgba(243,210,138,.04)}
.pay-card h2{font-size:30px;margin:8px 0 10px}
.pay-card p{margin-top:8px}

.doc-missing{padding:120px 32px!important;text-align:center}
.doc-missing h1{font-size:44px;margin:12px 0}
.doc-missing a{color:var(--gold-soft)}

.doc-foot{padding:34px 0 50px;border-top:1px solid var(--line);color:var(--muted);font-size:13.5px}
.doc-foot .doc-wrap{display:grid;justify-items:center;gap:8px;text-align:center}
.doc-foot a{color:var(--gold-soft)}

@media print{
  .doc-top .doc-call,.summary .btn,.decide,.show,.brendan-actions,.doc-banner{display:none!important}
  .doc-page{background:#fff;color:#111}
}

/* Readability: everything about the quote or invoice (headings, amounts, lines) uses the sans font.
   The fancy serif stays only on the showcase and Brendan's card at the end. */
.doc-page main h1,.doc-page main h2,.doc-page main h3{font-family:var(--sans);font-weight:700;letter-spacing:-.02em;line-height:1.12}
.doc-page .doc-hero h1{font-size:clamp(32px,4.6vw,52px)}
.doc-page .done h2,.doc-page .decide-card h2{font-size:clamp(24px,3vw,32px)}
.doc-page .included h2,.doc-page .pay-card h2{font-size:24px}
.doc-page .show-head h2,.doc-page .brendan h2{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;line-height:1.04}
.doc-page .lines,.doc-page .summary-card,.doc-page .sum-row{font-variant-numeric:tabular-nums}

/* Ways to pay: the accepted methods as chips (after approval and on invoices). Node app, 2026-09-23. */
.pay-chips{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pay-chip{display:flex;flex-direction:column;gap:2px;padding:9px 14px;border-radius:12px;border:1px solid rgba(243,210,138,.35);background:rgba(243,210,138,.06);font-family:var(--sans);font-size:14px;line-height:1.3;min-width:0}
.pay-chip strong{color:var(--gold-soft);font-weight:700}
.pay-chip span,.pay-chip a{color:var(--muted);font-size:13px;overflow-wrap:anywhere}
.pay-chip a{color:var(--gold-soft);text-decoration:underline}
.done .pay-chips{margin-top:16px}
.pay-card .pay-chips + p{margin-top:14px}
@media(max-width:480px){.pay-chip{flex:1 1 calc(50% - 8px)}}

/* Customer invoice: a clear document inside the Midnight Workshop shell. */
.invoice-page{padding-bottom:28px}
.invoice-page .invoice-intro{display:grid;grid-template-columns:minmax(0,1fr) 350px;align-items:center;gap:64px;padding-top:68px;padding-bottom:42px}
.invoice-intro-copy{min-width:0}
.invoice-intro-copy .eyebrow{font-size:11px;letter-spacing:.15em}
.invoice-intro-copy .eyebrow span{color:var(--muted-2);padding:0 7px}
.doc-page .invoice-intro-copy h1{font-family:var(--serif);font-size:clamp(44px,5.2vw,70px);font-weight:500;letter-spacing:-.03em;line-height:.99;max-width:17ch;margin:22px 0 20px;text-wrap:balance}
.invoice-customer{color:var(--muted);font-size:16px}
.invoice-customer strong{color:var(--paper);font-weight:600}
.invoice-intro-copy .hero-note{margin-top:16px;font-size:15px;line-height:1.6;max-width:56ch}
.invoice-page .summary{position:static;order:initial}
.invoice-page .summary-card{padding:26px 26px 24px;border-color:rgba(243,210,138,.4);background:linear-gradient(155deg,#1d2b47,#111b30 75%);box-shadow:0 30px 70px -42px rgba(255,207,118,.6),0 25px 50px -38px #000}
.invoice-summary-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.invoice-summary-top .eyebrow{letter-spacing:.1em;color:var(--gold-soft)}
.invoice-state{display:inline-block;padding:5px 8px;border:1px solid rgba(243,210,138,.25);border-radius:999px;color:var(--gold-soft);font-size:10px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.invoice-state.is-overdue{border-color:rgba(255,155,155,.36);color:#ffb0b0}
.invoice-page .big{margin:28px 0 22px}
.invoice-page .big small{font-size:14px;color:var(--muted)}
.invoice-page .big strong{display:block;margin-top:3px;font-size:clamp(42px,4vw,54px);letter-spacing:-.04em}
.invoice-page .sum-row{font-size:14px}
.invoice-page .sum-row strong{text-align:right;font-weight:600}
.invoice-page .summary .btn{margin-top:11px;min-height:46px}
.invoice-page .summary .invoice-pay-link{margin-top:24px}
.invoice-page .summary .btn-quiet{margin-top:6px;min-height:36px}
.invoice-content{padding-bottom:22px}
.invoice-sheet{padding:36px 42px 42px;border-radius:20px;background:#f8f5ed;color:#1d2736;border:1px solid #f5ead7;box-shadow:0 30px 70px -48px #000}
.invoice-sheet-head{display:flex;justify-content:space-between;align-items:end;gap:20px;padding-bottom:24px;border-bottom:1px solid #d9d6cc}
.invoice-sheet-head .eyebrow{font-size:10.5px;color:#866429}
.doc-page .invoice-sheet-head h2{font-family:var(--serif);font-size:38px;font-weight:600;letter-spacing:-.025em;margin-top:5px}
.invoice-sheet-head>span{font-family:var(--mono);font-size:11px;color:#68717a;letter-spacing:.04em}
.invoice-page .scope{margin:22px 0 8px;border-color:#e4ded1;background:#fffdf8}
.invoice-page .scope .eyebrow{color:#866429}
.invoice-page .scope p:last-child{color:#344154}
.invoice-page .invoice-lines{overflow-x:auto}
.invoice-page .lines{table-layout:fixed;color:#253244;font-size:14.5px}
.invoice-page .lines thead th{padding:20px 8px 13px;border-color:#d9d6cc;color:#6e7882;font-family:var(--sans);font-size:10.5px}
.invoice-page .lines tbody td{padding:16px 8px;border-color:#e5e1d7;line-height:1.45}
.invoice-page .lines td.what{width:auto}
.invoice-page .lines .qty{width:68px}
.invoice-page .lines .price{width:100px}
.invoice-page .lines .amt{width:125px}
.invoice-page .lines td.price{display:table-cell;grid-template-columns:none;padding-block:16px}
/* Phones: the price column is hidden with its heading (the amount says it all). */
@media(max-width:560px){.invoice-page .lines td.price{width:0;padding:0!important;font-size:0;overflow:hidden}}
.invoice-page .lines .num{color:#647181}
.invoice-page .lines tbody td strong{font-weight:700;color:#223044}
.invoice-page .lines tbody td .desc{color:#657282;font-size:13.5px;line-height:1.45}
.invoice-page .lines tbody tr.subject th{color:#755623;border-color:#dfd9cb}
.invoice-page .lines tfoot td{padding:8px;color:#566475}
.invoice-page .lines tfoot tr.sub:first-child td{padding-top:24px}
.invoice-page .lines tfoot td:first-child{text-align:right}
.invoice-page .lines tfoot .total td{border-color:#c9c4b8;color:#253244}
.invoice-page .lines tfoot .dep td{border-top:1px solid #c9c4b8;padding-top:15px;color:#72501e;font-size:18px;font-weight:700}
.invoice-history{margin-top:30px;padding-top:22px;border-top:1px solid #d9d6cc}
.invoice-history h3{font-family:var(--sans);font-size:16px;font-weight:700;margin-bottom:6px}
.invoice-history .lines{max-width:420px}
.invoice-history .lines td:first-child{text-align:left}
.invoice-page .pay-card{margin-top:22px;padding:32px 36px 34px;border:1px solid var(--line-2);border-radius:18px;background:linear-gradient(160deg,#17243b,#10192d)}
.invoice-pay-head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:22px}
.doc-page .invoice-pay-head h2{font-family:var(--serif);font-weight:500;font-size:38px;line-height:1.05;letter-spacing:-.025em;margin-top:8px}
.invoice-pay-head>p{max-width:300px;margin:0!important;color:var(--muted);font-size:13.5px;line-height:1.5}
.invoice-pay-head>p strong{color:var(--gold-soft)}
.invoice-page .pay-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:0}
.invoice-page .pay-chip{min-height:72px;padding:14px 18px;border-radius:10px;background:rgba(255,255,255,.025);border-color:var(--line-2);font-size:14px}
.invoice-page .pay-chip:last-child:nth-child(odd){grid-column:1 / -1}
.invoice-page .pay-chip strong{font-size:15px}
.invoice-page .invoice-pay-note{margin:20px 0 0;padding-top:18px;border-top:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.invoice-page .brendan{grid-template-columns:94px 1fr;gap:24px;margin:18px 0 36px;padding:25px 28px;background:#111b2f}
.invoice-page .brendan img{width:94px;height:94px}
.invoice-page .brendan h2{font-size:33px}
.invoice-page .brendan p:not(.eyebrow){font-size:14.5px}
.invoice-page .brendan-actions{margin-top:14px}
.invoice-page .brendan-actions .btn{padding:10px 16px;font-size:13px}

/* Customer-to-owner conversation prototype, attached to this document only. */
.doc-message-link{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.035);color:var(--paper);font:600 13px var(--sans);text-align:center;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.doc-message-link:before{width:15px;height:15px;flex:none;background:currentColor;content:"";opacity:.82;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.5a7.5 7.5 0 0 1-7.5 7.5H5l1.8-3.1A7.5 7.5 0 1 1 20 11.5Z'/%3E%3C/svg%3E") center/contain no-repeat}
.doc-message-link:hover{color:var(--gold-soft)}
.doc-message-link:hover{border-color:rgba(243,210,138,.36);background:rgba(243,210,138,.07)}
.doc-message-link:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.doc-message-scrim{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:20px;background:rgba(3,7,16,.76);backdrop-filter:blur(5px)}
.doc-message-scrim[hidden]{display:none}
.doc-message-modal{display:grid;grid-template-rows:auto minmax(0,1fr);width:min(600px,100%);height:min(680px,calc(100dvh - 40px));max-height:calc(100dvh - 40px);overflow:hidden;border:1px solid rgba(190,205,235,.22);border-radius:16px;background:linear-gradient(180deg,#111d34,#0d1526);box-shadow:0 28px 78px rgba(0,0,0,.48);color:var(--paper)}
.doc-message-head{display:flex;justify-content:space-between;gap:18px;padding:22px 24px 18px;border-bottom:1px solid var(--line)}
.doc-message-head .eyebrow{margin-bottom:7px;font-size:10px}
.doc-page .doc-message-head h2{margin:0;font-family:var(--sans);font-size:21px;font-weight:700;letter-spacing:-.02em}
.doc-message-head>div>p:last-child{margin-top:5px;color:var(--muted);font-size:13px;line-height:1.45}
.doc-message-close{width:34px;height:34px;flex:none;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.03);color:var(--muted);font:24px/1 var(--sans);cursor:pointer}
.doc-message-close:hover{color:var(--paper);border-color:var(--line-2)}
.doc-page .doc-message-thread{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:0;min-height:0;overflow:hidden;padding:0 22px}
.doc-page .doc-message-context{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.doc-page .doc-message-avatar{display:grid;place-items:center;width:36px;height:36px;flex:none;border-radius:50%;background:rgba(243,210,138,.13);color:var(--gold-soft);font-size:11px;font-weight:800}
.doc-page .doc-message-context strong,.doc-page .doc-message-context small{display:block}
.doc-page .doc-message-context strong{font-size:13px}.doc-page .doc-message-context small{margin-top:2px;color:var(--muted);font-size:11px}
.doc-page .doc-message-history{position:relative;min-height:0;overflow:hidden}
.doc-page .doc-message-list{display:grid;align-content:start;gap:12px;height:100%;max-height:none;overflow-y:auto;overscroll-behavior:contain;padding:16px 2px}
.doc-page .doc-message-item{max-width:90%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.035)}
.doc-page .doc-message-item.is-owner{justify-self:end;border-color:rgba(243,210,138,.24);background:rgba(243,210,138,.07)}
.doc-page .doc-message-meta{display:flex;align-items:center;gap:8px;margin-bottom:5px;color:var(--muted);font-size:10.5px;font-weight:700}
.doc-page .doc-message-meta time{font-weight:500;color:var(--muted-2)}
.doc-page .doc-message-text{margin:0;color:var(--paper);font:13px/1.55 var(--sans);white-space:pre-wrap;overflow-wrap:anywhere}
.doc-page .doc-message-empty{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;gap:8px;padding:24px;border:0;color:var(--muted);font-size:13px;line-height:1.5;text-align:center}
.doc-page .doc-message-empty[hidden]{display:none!important}
.doc-page .doc-message-empty strong{color:var(--paper);font-size:15px}
.doc-page .doc-message-empty>span:last-child{max-width:300px}
.doc-page .doc-message-empty-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:4px;border-radius:50%;background:rgba(255,255,255,.05);color:var(--muted)}
.doc-page .doc-message-empty-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.doc-page .doc-message-composer{display:grid;gap:8px;padding:12px 0 16px;border-top:1px solid var(--line)}
.doc-page .doc-message-composer label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%)}
.doc-page .doc-message-input-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:end;gap:8px;min-width:0}
.doc-page .doc-message-composer textarea{width:100%;min-width:0;min-height:92px;padding:11px 12px;border:1px solid var(--line-2);border-radius:10px;background:#0a1325;color:var(--paper);font:14px/1.5 var(--sans);resize:vertical}
@media(max-width:760px){.doc-page .doc-message-composer textarea{font-size:16px}}
.doc-page .doc-message-composer textarea::placeholder{color:var(--muted-2)}
.doc-page .doc-message-composer textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(243,210,138,.14)}
.doc-page .doc-message-attach{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--line-2);border-radius:12px;background:rgba(255,255,255,.04);color:var(--muted);cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .15s}
.doc-page .doc-message-attach:hover{border-color:rgba(243,210,138,.5);background:rgba(243,210,138,.09);color:var(--gold-soft)}
.doc-page .doc-message-attach:active{transform:scale(.96)}
.doc-page .doc-message-attach:focus-visible,.doc-page .doc-message-remove-file:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.doc-page .doc-message-attach svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.doc-page .doc-message-file-input{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%);border:0}
.doc-page .doc-message-pending{display:flex;flex-wrap:wrap;gap:7px;min-width:0}
.doc-page .doc-message-pending[hidden]{display:none!important}
.doc-page .doc-message-pending-file{display:flex;align-items:center;gap:8px;min-width:0;max-width:230px;padding:5px 8px 5px 5px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.04)}
.doc-page .doc-message-pending-thumb,.doc-page .doc-message-pending-icon{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:7px;background:rgba(255,255,255,.06);object-fit:cover}
.doc-page .doc-message-pending-icon{color:var(--muted);font-size:8px;font-weight:800}
.doc-page .doc-message-pending-copy{display:grid;min-width:0;gap:2px}
.doc-page .doc-message-pending-copy strong{overflow:hidden;font-size:10.5px;text-overflow:ellipsis;white-space:nowrap}
.doc-page .doc-message-pending-copy small{color:var(--muted-2);font-size:9.5px}
.doc-page .doc-message-remove-file{display:grid;place-items:center;width:24px;height:24px;flex:none;border:0;border-radius:50%;background:transparent;color:var(--muted);font:18px/1 var(--sans);cursor:pointer}
.doc-page .doc-message-remove-file:hover{background:rgba(255,255,255,.07);color:var(--paper)}
.doc-page .doc-message-submit{min-height:40px;padding-inline:16px;white-space:nowrap}
.doc-page .doc-message-submit:disabled{opacity:.48;cursor:not-allowed}
.doc-page .doc-message-error{padding:8px 10px;border:1px solid rgba(255,120,120,.3);border-radius:8px;background:rgba(255,80,80,.08);color:#ffc0b8;font-size:12px}
.doc-page .doc-message-error[hidden]{display:none}
.doc-page .doc-message-attachments{display:grid;gap:5px;margin-top:8px}
.doc-page .doc-message-sent-file{max-width:260px;overflow:hidden;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.045);color:var(--muted);font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.doc-page .doc-message-attachment-image{display:block;max-width:min(360px,70vw);max-height:240px;margin:0 0 6px;border-radius:8px;object-fit:cover}
body.doc-message-open{overflow:hidden}
@media(max-width:850px){.invoice-page .invoice-intro{grid-template-columns:1fr;gap:30px;padding-top:44px}.doc-page .invoice-intro-copy h1{max-width:22ch;margin-top:16px}.invoice-page .summary-card{max-width:none}.invoice-pay-head{align-items:start;flex-direction:column;gap:12px}}
@media(max-width:600px){.invoice-page .invoice-intro{padding-top:34px;padding-bottom:25px}.doc-page .invoice-intro-copy h1{font-size:clamp(41px,11vw,55px)}.invoice-page .summary-card{padding:22px}.invoice-page .big strong{font-size:45px}.invoice-sheet{padding:23px 18px 25px;border-radius:14px}.invoice-sheet-head{padding-bottom:12px}.doc-page .invoice-sheet-head h2{font-size:32px}.invoice-sheet-head>span{display:none}.invoice-page .lines{font-size:13.5px}.invoice-page .lines .amt{width:86px}.invoice-page .lines td.what{width:auto}.invoice-page .lines td{overflow-wrap:anywhere}.invoice-page .lines tbody td{padding:15px 4px}.invoice-page .lines thead th{padding:16px 4px 10px}.invoice-page .lines tbody td .desc{font-size:12.5px}.invoice-page .pay-card{padding:24px 18px}.doc-page .invoice-pay-head h2{font-size:33px}.invoice-page .pay-chips{grid-template-columns:1fr}.invoice-page .pay-chip{min-height:0}.invoice-page .brendan{grid-template-columns:1fr;text-align:center;padding:24px 20px}.invoice-page .brendan img{margin:0 auto}.invoice-page .brendan-actions{justify-content:center}}
@media(max-width:600px){.doc-message-scrim{place-items:end center;padding:8px}.doc-message-modal{width:100%;height:min(720px,calc(100dvh - 16px));max-height:calc(100dvh - 16px);border-radius:16px}.doc-message-head{padding:17px 16px 14px}.doc-page .doc-message-thread{padding:0 16px}.doc-page .doc-message-composer{padding:10px 0 calc(10px + env(safe-area-inset-bottom))}.doc-page .doc-message-input-row{grid-template-columns:38px minmax(0,1fr) auto;gap:6px}.doc-page .doc-message-attach{width:38px;height:38px}.doc-page .doc-message-composer textarea{min-height:54px;max-height:120px;resize:vertical}.doc-page .doc-message-submit{min-height:38px;padding-inline:12px}.doc-page .doc-message-item{max-width:94%}}
@media print{.invoice-page .invoice-intro{padding-top:24px}.invoice-page .summary-card,.invoice-page .pay-card,.invoice-page .brendan{background:#fff;color:#111;border:1px solid #ccc;box-shadow:none}.invoice-page .summary-card *,.invoice-page .pay-card *,.invoice-page .brendan *{color:#111!important}.invoice-page .invoice-pay-link,.invoice-page .summary button{display:none!important}.invoice-sheet{box-shadow:none;border-color:#ccc}.invoice-page .pay-chips{grid-template-columns:repeat(2,1fr)}}

/* Add-ons (Light Ops 2026-09-25): the customer ticks extras and sets how many; addons.js keeps the totals in step. */
.doc-page .addons{margin-top:30px;padding:24px;border:1px solid rgba(243,210,138,.28);border-radius:var(--r);background:linear-gradient(180deg,rgba(243,210,138,.06),rgba(243,210,138,.015))}
.addons h2{font-size:24px;margin:6px 0}
.addons-intro{color:var(--muted);font-size:14.5px;margin:0 0 14px}
.addon-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.addon{display:grid;grid-template-columns:minmax(0,1fr) auto 96px;align-items:center;gap:12px 16px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(10,16,32,.35);transition:border-color .15s,background-color .15s}
.addon.is-on{border-color:rgba(243,210,138,.55);background:rgba(243,210,138,.07)}
.addon-pick{display:flex;gap:12px;align-items:flex-start;min-width:0;cursor:pointer}
.addon-pick input{flex:none;width:22px;height:22px;margin-top:2px;accent-color:#f3d28a;cursor:pointer}
.addon-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.addon-copy strong{font-weight:600;font-size:15.5px}
.addon-copy .desc{color:var(--muted);font-size:14px;white-space:pre-line}
.addon-each{color:var(--muted-2);font:13px var(--mono)}
.addon-qty{display:flex;align-items:stretch;justify-self:start;height:44px;overflow:hidden;border:1px solid var(--line-2);border-radius:10px;background:var(--panel-2)}
.addon-qty button{width:44px;border:0;background:transparent;color:var(--gold-soft);font:600 20px/1 var(--sans);cursor:pointer}
.addon-qty button:hover{background:rgba(243,210,138,.1)}
.addon-qty input{width:54px;border:0;border-right:1px solid var(--line);border-left:1px solid var(--line);background:transparent;color:var(--paper);font:600 16px var(--sans);font-variant-numeric:tabular-nums;text-align:center}
.addon-qty input:focus{outline:2px solid var(--gold);outline-offset:-2px}
.addon-qty input[readonly]{border:0}
.addon-amt{color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.addon.is-on .addon-amt{color:var(--paper)}
.addon-tag{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:rgba(243,210,138,.12);color:var(--gold-soft);font:600 11.5px var(--sans);vertical-align:2px}
.addon-summary{margin:-6px 0 12px;color:var(--gold-soft);font-size:14.5px}
@media(max-width:560px){.doc-page .addons{padding:20px 16px}.addon{grid-template-columns:1fr auto;padding:14px}.addon-pick{grid-column:1/-1}}
.field .field-opt{color:var(--muted);font-weight:500}

/* The customer home page, /my/ (Light Ops 2026-09-25): sign in with an emailed code, then their page. */
.doc-page section.home-signin{max-width:560px;padding-block:56px 72px}
.home-signin h1{margin:8px 0 12px;font-size:clamp(28px,4vw,38px);line-height:1.12;text-wrap:balance}
.home-signin .decide-card>p{color:var(--muted)}
.home-signin .btn-block{margin-top:14px}
.home-signin-more{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:10px}
.home-signin-more form{margin:0}
.home-or{margin:18px 0 0;color:var(--muted);font-size:14px}
.home-small{margin-top:14px;font-size:14px}
.home-small a{color:var(--gold-soft);text-decoration:underline}
.home-note{display:inline-block;margin:0 0 6px;padding:8px 14px;border-radius:999px;background:rgba(157,255,176,.1);color:#bff3cb;font-size:14.5px}
.doc-page .home-hero h1{margin-bottom:12px}
.doc-page section.home-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start;padding-block:0 56px}
.home-main{display:grid;gap:18px}
.doc-page .home-card{padding:22px 24px;border:1px solid var(--line);border-radius:var(--r);background:rgba(10,16,32,.45)}
.home-card h2{margin:0 0 12px;font-size:22px}
.home-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.home-job{display:grid;gap:3px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(255,255,255,.02)}
.home-job strong{font-weight:600}
.home-job span{color:var(--muted);font-size:14.5px}
.home-job.is-set{border-color:rgba(243,210,138,.5);background:rgba(243,210,138,.06)}
.home-job .home-date{color:var(--gold-soft);font-size:20px;font-weight:700}
.home-docs{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.home-doc{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px 16px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);color:var(--paper);text-decoration:none;transition:border-color .15s,background-color .15s}
.home-doc:hover{border-color:rgba(243,210,138,.5);background:rgba(243,210,138,.05)}
.home-doc-name{display:grid;gap:2px;min-width:0}
.home-doc-name small{overflow:hidden;color:var(--muted);font-size:13.5px;text-overflow:ellipsis;white-space:nowrap}
.home-pill{padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:600;white-space:nowrap}
.home-pill--ok{background:rgba(157,255,176,.12);color:#bff3cb}
.home-pill--action{background:rgba(243,210,138,.14);color:var(--gold-soft)}
.home-pill--bad{background:rgba(255,122,122,.14);color:#ffb3b3}
.home-pill--done{background:rgba(190,205,235,.1);color:var(--muted)}
.home-amt{display:grid;font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.home-amt small{color:var(--muted);font-size:12px;font-weight:500}
.home-home+.home-home{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.home-address{margin:0 0 4px;font-weight:600}
.home-gate{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px}
.home-gate .field{flex:1 1 220px;margin-top:6px}
.home-side{position:sticky;top:20px}
.home-contact h2{margin:6px 0 8px;font-size:22px}
.home-contact p{color:var(--muted);font-size:14.5px}
.home-contact .btn{margin-top:10px}
.home-out{margin-top:6px}
@media(max-width:900px){.doc-page section.home-grid{grid-template-columns:1fr}.home-side{position:static}}
@media(max-width:560px){.doc-page .home-card{padding:18px 16px}.home-doc{grid-template-columns:minmax(0,1fr) auto}.home-doc .home-pill{grid-row:2;justify-self:start}.home-doc .home-amt{grid-row:1/3;grid-column:2}}
.home-more{margin-top:8px}
.home-more summary{padding:10px 2px;color:var(--gold-soft);font-weight:600;cursor:pointer;list-style:none}
.home-more summary::-webkit-details-marker{display:none}
.home-more[open] summary{margin-bottom:8px}
.home-note--bad{background:rgba(255,122,122,.12);color:#ffc2c2}
.home-service textarea{min-height:90px}
.home-contact-pick{display:flex;flex-wrap:wrap;gap:8px 18px;margin:14px 0 16px;padding:0;border:0}
.home-contact-pick legend{width:100%;margin-bottom:6px;font-size:13px;font-weight:600}
.home-contact-pick label{display:inline-flex;align-items:center;gap:8px;min-height:36px;color:var(--paper);font-size:15px;cursor:pointer}
.home-contact-pick input{width:18px;height:18px;accent-color:#f3d28a}
.home-reqs{display:grid;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.home-req{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm)}
.home-req .home-pill{justify-self:start}
.home-req p{margin:0;color:var(--paper);font-size:14.5px}
.home-req small{color:var(--muted);font-size:12.5px}
.home-req.is-done{opacity:.8}
/* Refer a friend (Light Ops 2026-09-25) */
.home-ref-link{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
.home-ref-link input{flex:1 1 220px;min-width:0;padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--panel-2);color:var(--paper);font:15px var(--mono)}
.home-ref-link .btn{flex:0 0 auto}
.home-ref-credit{margin:14px 0 0;padding:12px 14px;border-radius:var(--r-sm);background:rgba(157,255,176,.08);color:#d6f7de;font-size:15px}
.home-ref-list{display:grid;gap:6px;margin:14px 0 0;padding:0;list-style:none}
.home-ref-list li{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r-sm);font-size:14.5px}
.home-ref-list strong{color:var(--gold-soft)}
/* The gate code card, kept short (Light Ops 2026-09-25). */
.home-gate-note{margin:-6px 0 12px;font-size:14px}
.home-gate{align-items:center}
.home-gate input{flex:1 1 200px;min-width:0;padding:12px 14px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--panel-2);color:var(--paper);font:16px var(--sans)}
.home-gate input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(243,210,138,.16)}
.home-gate+.home-address{margin-top:16px}

/* A first quote: add to the display later from their account (decided with Brendan 2026-09-25). */
.doc-page .addon-later{margin:12px 0 0;font-size:13.5px;color:var(--muted);text-align:center}
.doc-page .addon-later a{color:var(--gold);text-decoration:underline}

/* "Your Light Guys page" card under the quote/invoice summary (decided with Brendan 2026-09-25). */
.home-card{margin-top:16px;padding:20px 22px;border-radius:var(--r);border:1px solid var(--line);background:var(--panel-2)}
.home-card .eyebrow{font-size:10.5px;margin:0 0 8px}
.home-card h3{margin:0 0 12px;font:700 19px/1.25 var(--sans);letter-spacing:-.01em;color:var(--paper)}
.home-card ul{list-style:none;margin:0 0 4px;padding:0}
.home-card li{position:relative;padding:0 0 8px 24px;color:var(--muted);font-size:14.5px;line-height:1.45}
.home-card li::before{content:"✓";position:absolute;left:0;top:0;color:var(--gold);font-weight:700}
.home-card .btn{margin-top:8px}
.home-card span.btn{opacity:.6;cursor:default}
.home-card-note{margin:10px 0 0;color:var(--muted);font-size:13px;text-align:center}
.home-card--end{display:none;max-width:560px;margin:28px auto 0}
@media(max-width:900px){.home-card--side{display:none}.home-card--end{display:block}}
@media print{.home-card{display:none!important}}

/* Inside their Light Guys page (?embed=1): no website header or footer, and nothing sticky (the frame is as tall as
   the page, so the portal scrolls it). */
main.doc-embed{padding-top:8px}
main.doc-embed .summary,.doc-page main.doc-embed .summary{position:static}
.doc-page:has(main.doc-embed){background:#0a1020}

/* Inside the Light Guys page the document is a frame as tall as the page: its message popup opens in the part on screen. */
html.is-embed .doc-message-scrim{position:absolute;inset:auto 0 auto 0;top:var(--ev-top,0px);height:max(380px,var(--ev-h,100vh))}
html.is-embed .doc-message-modal{max-height:calc(max(380px,var(--ev-h,100vh)) - 40px)}
@media(max-width:600px){html.is-embed .doc-message-modal{max-height:calc(max(380px,var(--ev-h,100vh)) - 16px)}}
/* A quote's title above its lines, like the invoice page's (decided with Brendan 2026-09-25). */
.quote-lines-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.quote-lines-head .eyebrow{font-size:10.5px}
.doc-page .quote-lines-head h2{font-family:var(--serif);font-size:34px;font-weight:600;letter-spacing:-.02em;line-height:1.1;margin-top:5px}
.quote-lines-head>span{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.04em;white-space:nowrap}
@media(max-width:600px){.doc-page .quote-lines-head h2{font-size:28px}.quote-lines-head>span{display:none}}

/* =====================================================================================================
   Quote + invoice redesign (Brendan's handoff, 2026-09-25): hero with the title and a summary card,
   a two-column Details list, payment cards with Copy, Brendan + Your Light Guys page side by side.
   Sizes come from the handoff; clamp() tightens them on phones.
   ===================================================================================================== */
.doc-page{background:radial-gradient(1100px 560px at 85% -160px,rgba(255,207,118,.13),transparent 70%),#0a1020;font-variant-numeric:tabular-nums}
.doc-page .doc-wrap{max-width:1120px;padding:0 clamp(16px,4vw,28px)}
.doc-top{padding:12px 0;border-bottom:1px solid rgba(190,205,235,.1);background:rgba(10,16,32,.6);backdrop-filter:blur(10px)}
.doc-top .doc-wrap{gap:12px}
.doc-logo img{width:56px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}
.doc-page .doc-call{display:inline-flex;align-items:center;padding:10px 16px;border-radius:999px;border:1px solid rgba(190,205,235,.22);background:rgba(255,255,255,.04);color:#f4efe4;font-size:13.5px;font-weight:600;white-space:nowrap}
.doc-page .doc-call:hover{border-color:rgba(243,210,138,.5);color:#ffe9bd}
.doc-foot{padding:28px 16px 36px;border-top:1px solid rgba(190,205,235,.1);color:#6f819b;font-size:13px}
.doc-foot .doc-foot-line{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;text-align:center}
.doc-foot a{color:#f3d28a}

/* buttons */
.dp-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 12px;border-radius:999px;border:1px solid rgba(190,205,235,.22);background:transparent;color:#f4efe4!important;font:600 14px var(--sans);text-align:center;cursor:pointer;text-decoration:none}
.dp-btn:hover{border-color:rgba(243,210,138,.5);color:#ffe9bd!important}
.dp-btn--gold{border:0;background:linear-gradient(180deg,#ffe9bd,#f3d28a);color:#2a1d05!important;font-weight:700;box-shadow:0 0 0 1px rgba(255,233,189,.4),0 10px 30px -10px rgba(255,207,118,.7)}
.dp-btn--gold:hover{color:#2a1d05!important;filter:brightness(1.05)}
.dp-btn--block{width:100%;padding:15px 24px;font-size:15px}
.dp-btn--sm{padding:9px 16px;font-size:13.5px}
.dp-btn--gold-line{display:inline-flex;padding:11px 20px;border-color:rgba(243,210,138,.5);color:#ffe9bd!important;font-weight:700}
.dp-btn--gold-line:hover{background:rgba(243,210,138,.1)}
.dp-btn[aria-disabled="true"]{opacity:.6;cursor:default}

/* hero */
.dp-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:clamp(28px,5vw,48px);align-items:end;padding-top:clamp(36px,8vw,64px)!important;padding-bottom:clamp(32px,6vw,56px)!important}
.dp-hero-copy{min-width:0}
.dp-hero .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#f3d28a}
.doc-page .dp-hero h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(44px,6vw,76px);line-height:.98;letter-spacing:-.015em;margin:18px 0 22px;max-width:none;text-wrap:balance}
.dp-hero h1 em{display:block;font-style:italic;color:#ffe9bd}
.dp-for{font-size:17px;color:#9fb0c8}
.dp-for strong{color:#f4efe4;font-weight:600}
.dp-scope{margin-top:22px;max-width:52ch;font-size:15px;line-height:1.6;color:#9fb0c8;text-wrap:pretty}
.dp-scope+.dp-scope{margin-top:12px}

/* summary card */
.dp-card{padding:clamp(20px,5vw,28px);border-radius:20px;border:1px solid rgba(243,210,138,.4);background:linear-gradient(155deg,#1d2b47,#111b30 75%);box-shadow:0 30px 70px -42px rgba(255,207,118,.6),0 25px 50px -30px rgba(0,0,0,.6)}
.dp-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dp-label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#9fb0c8}
.dp-pill{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;border:1px solid rgba(243,210,138,.3);color:#ffe9bd;background:rgba(243,210,138,.08)}
.dp-dot{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}
.dp-pill--ok{color:#4ce07a;border-color:rgba(48,209,88,.4);background:rgba(48,209,88,.12)}
.dp-pill--bad{color:#ff8f86;border-color:rgba(255,120,110,.4);background:rgba(255,90,80,.1)}
.dp-pill--off{color:#9fb0c8;border-color:rgba(190,205,235,.22);background:rgba(190,205,235,.06)}
.dp-amount{font-family:var(--sans);font-weight:700;font-size:clamp(44px,5vw,56px);line-height:1;letter-spacing:-.025em;color:#ffe9bd;margin:18px 0 22px}
.dp-card-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid rgba(190,205,235,.14);font-size:14.5px}
.dp-card-row span{color:#9fb0c8}
.dp-card-row strong{font-weight:600;text-align:right}
.dp-card-row.is-bad strong{color:#ff8f86}
.dp-card-row:last-of-type{padding-bottom:20px}
.dp-card-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.dp-card .dp-btn--gold{margin-top:0}
.dp-card-btns .doc-message-link{display:flex;align-items:center;justify-content:center;padding:11px 12px;border-radius:999px;border:1px solid rgba(190,205,235,.22);background:transparent;color:#f4efe4;font:600 14px var(--sans);cursor:pointer;text-decoration:none}
.dp-card-btns .doc-message-link:hover{border-color:rgba(243,210,138,.5);color:#ffe9bd}
.dp-card-btns>:only-child{grid-column:1/-1}
.dp-quiet{display:block;margin-top:14px;text-align:center;color:#9fb0c8;font-size:13.5px;text-decoration:underline;text-underline-offset:3px}
.dp-quiet:hover{color:#ffe9bd}

/* panels */
.dp-body{display:grid;gap:clamp(16px,4vw,28px);padding-bottom:40px}
.dp-body>*{margin:0!important}
.dp-panel{border:1px solid rgba(190,205,235,.1);border-radius:20px;background:#0f1829}
.dp-panel .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#f3d28a}
.doc-page .dp-panel h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(28px,4vw,34px);line-height:1.05;letter-spacing:0}
.dp-design{margin:0 0 clamp(16px,4vw,28px)}
.dp-note{margin:0}

/* Details: the lines and totals */
.dp-details{overflow:hidden}
.dp-details-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding:clamp(20px,5vw,26px) clamp(18px,5vw,28px) 18px}
.dp-meta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6f819b}
.dp-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:baseline;padding:16px clamp(18px,5vw,28px);border-bottom:1px solid rgba(190,205,235,.07)}
.dp-row--head{padding-top:10px;padding-bottom:10px;border-top:1px solid rgba(190,205,235,.1);border-bottom-color:rgba(190,205,235,.1);background:rgba(255,255,255,.02);font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#6f819b}
.dp-row--head span:last-child{text-align:right}
.dp-what{min-width:0}
.dp-what strong{display:block;font-weight:600;font-size:15.5px;color:#f4efe4}
.dp-desc{display:block;margin-top:3px;font-size:14px;line-height:1.5;color:#9fb0c8;white-space:pre-line;overflow-wrap:anywhere}
.dp-each{display:block;margin-top:6px;font-family:var(--mono);font-size:12px;color:#6f819b}
.dp-amt{text-align:right;font-size:15.5px;font-weight:600;white-space:nowrap}
.dp-subject{padding:14px clamp(18px,5vw,28px) 8px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#f3d28a;border-bottom:1px solid rgba(190,205,235,.07)}
.dp-totals{display:grid;justify-content:end;padding:22px clamp(18px,5vw,28px) clamp(20px,5vw,28px);background:linear-gradient(180deg,rgba(255,255,255,0),rgba(243,210,138,.04))}
.dp-tot{width:min(400px,100%);display:grid;gap:10px;font-size:14.5px}
.dp-tot-row{display:flex;justify-content:space-between;gap:16px;color:#9fb0c8}
.dp-tot-row[hidden]{display:none}
.dp-tot-row span:last-child{color:#f4efe4;white-space:nowrap}
.dp-tot-total{padding-top:12px;border-top:1px solid rgba(190,205,235,.14);font-weight:600}
.dp-tot-total span{color:#f4efe4}
.dp-tot-due{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:4px;padding:14px 16px;border-radius:12px;border:1px solid rgba(243,210,138,.35);background:rgba(243,210,138,.07);color:#ffe9bd;font-weight:600}
.dp-tot-due span:last-child{font-size:22px;font-weight:700;letter-spacing:-.01em;white-space:nowrap}
.addon-tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;border:1px solid rgba(243,210,138,.35);color:#f3d28a;font:600 11px var(--sans);vertical-align:2px}

/* payment options */
.doc-page .dp-payopts{padding:clamp(22px,5vw,30px) clamp(18px,5vw,28px);border-color:rgba(243,210,138,.3);background:#111b2c;scroll-margin-top:16px}
.dp-payopts-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:12px 32px;margin-bottom:22px}
.doc-page .dp-payopts-head h2{margin-top:8px}
.dp-payopts-head>p{max-width:40ch;font-size:14.5px;color:#9fb0c8}
.dp-payopts-head>p strong{color:#ffe9bd}
.dp-pays{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:10px;margin:0;padding:0;list-style:none}
.dp-pay{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:76px;padding:14px 16px;border-radius:14px;border:1px solid rgba(243,210,138,.22);background:rgba(255,255,255,.03)}
.dp-pay-copy{min-width:0}
.dp-pay-copy strong{display:block;font-weight:700;color:#ffe9bd;font-size:15px}
.dp-pay-copy span{display:block;font-size:13px;color:#9fb0c8;overflow-wrap:anywhere;white-space:pre-line}
.dp-copy{flex:none;padding:7px 12px;border-radius:999px;border:1px solid rgba(190,205,235,.22);background:transparent;color:#f4efe4;font:600 12px var(--sans);cursor:pointer}
.dp-copy:hover{border-color:rgba(243,210,138,.5);color:#ffe9bd}
.dp-copy.is-copied{border-color:rgba(48,209,88,.45);color:#4ce07a}
.dp-pay-note{margin-top:16px;font-size:13.5px;color:#9fb0c8}

/* Brendan + their Light Guys page */
.dp-bottom{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:clamp(16px,4vw,28px)}
.dp-brendan{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:clamp(20px,5vw,28px);border-color:rgba(190,205,235,.14)}
.dp-brendan img{width:112px;height:112px;border-radius:50%;object-fit:cover;border:2px solid rgba(243,210,138,.5);flex:none}
.dp-brendan>div{flex:1;min-width:min(100%,220px)}
.doc-page .dp-brendan h2{font-size:32px;margin:6px 0 8px}
.dp-brendan p{font-size:14.5px;color:#9fb0c8;text-wrap:pretty}
.dp-brendan-go{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.dp-brendan-go .dp-btn{display:inline-flex}
.dp-home{display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:clamp(20px,5vw,28px);border-color:rgba(243,210,138,.3);background:linear-gradient(155deg,#1d2b47,#111b30 75%)}
.doc-page .dp-home h2{font-size:32px;margin:6px 0 16px}
.dp-home ul{display:grid;gap:10px;margin:0;padding:0;list-style:none;font-size:14.5px}
.dp-home li{display:flex;gap:12px;align-items:center}
.dp-home li::before{content:"";width:6px;height:6px;border-radius:50%;background:#ffcf76;box-shadow:0 0 10px #ffcf76;flex:none}
.dp-home-go{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px}
.dp-home-go>span{font-size:12.5px;color:#6f819b}

/* the quote's other sections in the same look */
.doc-page .dp-body .addons{padding:clamp(20px,5vw,28px);border-radius:20px;border-color:rgba(243,210,138,.3);background:#111b2c}
.doc-page .dp-body .addons h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(28px,4vw,34px)}
.doc-page .dp-body .included{padding:clamp(20px,5vw,28px);border:1px solid rgba(190,205,235,.1);border-radius:20px;background:#0f1829}
.doc-page .dp-body .included h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(28px,4vw,34px);margin-bottom:16px}
.doc-page .dp-body .inc-grid div{border-radius:14px;border-color:rgba(190,205,235,.1)}
.doc-page .dp-body .decide{scroll-margin-top:16px}
.doc-page .dp-body .decide-card{border-radius:20px;border-color:rgba(243,210,138,.4);background:linear-gradient(155deg,#1d2b47,#111b30 75%);box-shadow:0 30px 70px -42px rgba(255,207,118,.6)}
.doc-page .dp-body .decide-card h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500}
.doc-page .dp-body .decide-card .btn-gold{border-radius:999px;background:linear-gradient(180deg,#ffe9bd,#f3d28a);color:#2a1d05}
.doc-page .dp-body .decide-more details,.doc-page .dp-body .terms details{border-radius:14px;border-color:rgba(190,205,235,.14);background:#0f1829}
.doc-page .dp-body .note{border-radius:20px;border-color:rgba(190,205,235,.14);background:#0f1829}
.doc-page .done{border-radius:20px;background:linear-gradient(155deg,#1d2b47,#111b30 75%)}
.doc-page .show{border-top-color:rgba(190,205,235,.1)}
.doc-page .show-grid figure,.doc-page .review{border-radius:14px}

/* phones */
@media (max-width:640px){
  .dp-card-btns{grid-template-columns:1fr}
  .dp-brendan{flex-direction:column;align-items:flex-start;text-align:left}
  .dp-brendan img{width:88px;height:88px}
  .doc-page .dp-brendan h2,.doc-page .dp-home h2{font-size:28px}
  .dp-tot{width:100%}
  .doc-page .dp-body .decide{grid-template-columns:1fr}
  .doc-page .dp-body .inc-grid{grid-template-columns:1fr}
}
@media (max-width:420px){.doc-page .doc-call{padding:9px 12px;font-size:12.5px}.doc-logo img{width:48px}}
/* Phone field focus (decided with Brendan 2026-09-27): tapping a field turns its own border gold. One border: no
   outline, ring or glow on the field or around it (Safari's own focus ring included), and nothing moves or resizes.
   The online payment amount draws its border on its wrapper, so the wrapper turns gold. The desktop keeps its focus
   styles. */
@media (max-width:760px){
  :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=button]):not([type=submit]),textarea,select):is(:focus,:focus-visible){outline:none!important;box-shadow:none!important;border-color:var(--gold)!important}
  .pay-online-field:focus-within{box-shadow:none!important;border-color:var(--gold)!important}
  .pay-online-field input:is(:focus,:focus-visible){border-color:transparent!important}
}