.planning-booklet-studio { background: #f2f5f6; }
.booklet-heading { margin-bottom: 22px; }
.template-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.template-card { display: grid; grid-template-rows: 180px 1fr; padding: 0; text-align: left; color: var(--ink); background: #fff; border: 1px solid var(--line); cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.template-card:hover,.template-card:focus-visible { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(20,42,58,.13); outline: 2px solid var(--blue); outline-offset: 2px; }
.template-card.is-selected { border: 2px solid var(--blue); box-shadow: 0 0 0 3px rgba(8,120,185,.13); }
.template-card img { width: 100%; height: 180px; object-fit: cover; }
.template-copy { display: grid; align-content: start; gap: 8px; padding: 18px; }
.template-copy .section-label { margin: 0; }
.template-copy strong { font: 400 22px/1.13 var(--serif); }
.template-copy small { color: var(--muted); font-size: 12px; line-height: 1.65; }
.template-intro { display: grid; gap: 5px; padding: 18px 20px; margin: 16px 0; color: #233c4a; background: #e3edf2; border-left: 3px solid var(--blue); }
.template-intro strong { font: 400 21px/1.2 var(--serif); }
.template-intro p { max-width: 850px; margin: 0; font-size: 12px; line-height: 1.7; }
.booklet-form { display: grid; gap: 22px; padding: clamp(20px,4vw,38px); background: #fff; border: 1px solid var(--line); }
.booklet-form-head p { max-width: 680px; margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.booklet-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.booklet-grid label,.ledger-row label { display: grid; gap: 6px; color: var(--ink); font-size: 12px; font-weight: 700; }
.booklet-grid .span-all { grid-column: 1/-1; }
.profile-prompts { padding: 12px 14px; margin: 14px 0 0; border: 1px solid #dbe1e4; }
.profile-prompts legend { padding: 0 6px; color: #2b4656; font: 400 17px/1.2 var(--serif); }
.profile-prompts[hidden] { display: none !important; }
.intake-profile { border-top: 3px solid var(--blue); }
.booklet-form-head .section-label { color: #075e91; }
.booklet-grid input,.booklet-grid select,.ledger-row input,.ledger-row select { width: 100%; min-height: 44px; padding: 9px 11px; color: var(--ink); background: #fff; border: 1px solid rgba(32,42,51,.25); border-radius: 2px; font: 13px/1.4 var(--sans); }
.booklet-grid small { color: #566671; font-size: 10px; font-weight: 400; line-height: 1.55; }
.ledger-block { padding: 18px; background: #f7f9fa; border: 1px solid var(--line); }
.ledger-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 12px; }
.ledger-title h3 { margin: 0; font: 400 23px/1.2 var(--serif); }
.ledger-title p { max-width: 620px; margin: 6px 0 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.ledger-title .button { flex: 0 0 auto; min-height: 40px; padding: 8px 12px; font-size: 10px; }
.ledger-list { display: grid; gap: 9px; }
.ledger-row { display: grid; grid-template-columns: minmax(130px,1.3fr) minmax(120px,1fr) minmax(110px,.8fr) minmax(110px,.8fr) auto; align-items: end; gap: 9px; padding: 11px; background: #fff; border: 1px solid #dbe1e4; }
.ledger-row[data-type="bills"],.ledger-row[data-type="coverage"] { grid-template-columns: minmax(150px,1.3fr) minmax(140px,1fr) minmax(120px,.85fr) auto; }
.ledger-row[data-type="incomes"] { grid-template-columns: minmax(150px,1.25fr) minmax(145px,1fr) minmax(110px,.8fr) minmax(110px,.8fr) auto; }
.ledger-row[data-type="debts"],.ledger-row[data-type="assets"] { grid-template-columns: repeat(3,minmax(105px,1fr)) auto; }
.ledger-row .ledger-source { min-width: 120px; }
.ledger-row label { font-size: 10px; }
.ledger-row input,.ledger-row select { min-height: 39px; font-size: 11px; }
.remove-row { min-height: 38px; padding: 7px 8px; color: #7f2323; background: transparent; border: 1px solid #d8bebe; font: 700 10px var(--sans); cursor: pointer; }
.remove-row:hover { background: #fff0ee; }
.ledger-total { display: flex; justify-content: space-between; gap: 14px; padding: 12px 3px 0; margin-top: 11px; border-top: 1px solid var(--line); color: #42515c; font-size: 11px; }
.ledger-total strong { color: var(--ink); font-size: 13px; }
.text-action { margin-top: 12px; padding: 0; color: #075e91; background: transparent; border: 0; text-decoration: underline; font: 700 11px var(--sans); cursor: pointer; }
.booklet-caution { padding: 14px 16px; color: #493514; background: #fff4e7; border-left: 3px solid #9a5b00; font-size: 11px; line-height: 1.7; }
.planning-booklet { display: none; margin-top: 32px; scroll-margin-top: 24px; }
.planning-booklet.show { display: block; }
.planning-booklet-page { position: relative; display: flex; flex-direction: column; min-height: 920px; max-width: 860px; padding: 65px 70px; margin: 0 auto 24px; overflow: hidden; background: #fff; border: 1px solid #dce2e5; box-shadow: 0 18px 45px rgba(20,42,58,.1); }
.booklet-page-image { width: calc(100% + 140px); height: 265px; margin: -65px -70px 35px; object-fit: cover; }
.booklet-kicker { margin: 0 0 14px; color: #075e91; font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.planning-booklet-page h2 { margin: 0 0 20px; color: #1d2b35; font: 400 clamp(32px,5vw,48px)/1.05 var(--serif); }
.booklet-cover-line { max-width: 650px; margin: 5px 0 24px; color: #475965; font: 400 20px/1.55 var(--serif); }
.booklet-cover-date { color: #52626d; font-size: 11px; }
.booklet-cover-callout { max-width: 560px; padding: 16px 18px; margin-top: 18px; color: #294254; background: #eaf2f6; border-left: 3px solid var(--blue); font-size: 12px; line-height: 1.65; }
.booklet-page-body { display: grid; align-content: start; gap: 16px; flex: 1; }
.booklet-lede { max-width: 660px; margin: 0; color: #394b57; font: 400 17px/1.65 var(--serif); }
.booklet-stat-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-top: 7px; }
.booklet-stat { display: grid; gap: 6px; padding: 15px; background: #eff4f6; border-top: 2px solid #0b6f9e; }
.booklet-stat span { color: #50616b; font-size: 10px; }
.booklet-stat strong { color: #1d2b35; font: 400 24px/1.15 var(--serif); }
.booklet-formula { padding: 14px; color: #344651; background: #f7f8f8; border: 1px solid #e0e5e7; font-size: 11px; line-height: 1.7; }
.booklet-callout { padding: 15px 17px; color: #493514; background: #fff5e7; border-left: 3px solid #9a5b00; font-size: 11px; line-height: 1.7; }
.booklet-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 10px; }
.booklet-table th { padding: 9px 8px; color: #fff; background: #173b50; text-align: left; font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }
.booklet-table td { padding: 9px 8px; border-bottom: 1px solid #e0e5e7; color: #30414c; vertical-align: top; overflow-wrap:anywhere; }
.booklet-table tbody tr:nth-child(even) { background: #f6f8f9; }
.booklet-table .numeric-cell { text-align: right; white-space: nowrap; }
.booklet-table tfoot td { padding-top: 11px; color: #1e3747; border-bottom: 2px solid #98aab4; font-weight: 800; }
.booklet-empty,.booklet-small { color: #586872; font-size: 10px; line-height: 1.65; }
.booklet-subhead { margin: 8px 0 0; color: #203643; font: 400 23px/1.2 var(--serif); }
.booklet-question-box { padding: 16px 19px; background: #eef3f5; }
.booklet-question-box ul,.booklet-page-body ol { display: grid; gap: 8px; padding-left: 19px; margin: 0; color: #344651; font-size: 11px; line-height: 1.65; }
.booklet-sources { padding-top: 10px; border-top: 1px solid #dce2e5; }
.booklet-sources p { margin: 7px 0; font-size: 10px; }
.booklet-sources a { color: #075e91; text-decoration: underline; }
.booklet-cta { padding: 18px 20px; margin-top: auto; background: #eaf2f6; border-left: 3px solid var(--blue); }
.booklet-cta strong { color: #203643; font: 400 21px/1.25 var(--serif); }
.booklet-cta p { margin: 8px 0 14px; color: #455762; font-size: 10px; }
.booklet-actions { display: grid; justify-items: center; gap: 9px; padding: 18px; }
.booklet-actions .button { margin-top: 4px; }
.planning-booklet[data-template="individual"] { --booklet-accent:#0878b9; --booklet-warm:#e6f2f6; --booklet-deep:#11384d; }
.planning-booklet[data-template="family"] { --booklet-accent:#9b2828; --booklet-warm:#f8eee9; --booklet-deep:#342528; }
.planning-booklet[data-template="business"] { --booklet-accent:#087c78; --booklet-warm:#e9f2f0; --booklet-deep:#143733; }
.planning-booklet { --booklet-accent:#0878b9; --booklet-warm:#eaf2f6; --booklet-deep:#18374b; }
.planning-booklet-page { border-top:5px solid var(--booklet-accent); background:linear-gradient(145deg,#fff 0%,#fff 66%,var(--booklet-warm) 100%); }
.planning-booklet-page:nth-of-type(odd):not(.is-cover) { background:linear-gradient(115deg,#fff 0%,#fff 56%,var(--booklet-warm) 56%,var(--booklet-warm) 100%); }
.booklet-kicker,.booklet-sources a { color:var(--booklet-accent); }
.booklet-stat { border-top-color:var(--booklet-accent); background:var(--booklet-warm); }
.booklet-table th { background:var(--booklet-deep); }
.booklet-cover-callout,.booklet-cta { border-left-color:var(--booklet-accent); background:var(--booklet-warm); }
.booklet-ledger-heading { display:flex; align-items:center; gap:11px; margin:10px 0 -6px; }
.booklet-ledger-heading > span { display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px; color:#fff; background:var(--booklet-accent); border-radius:50%; font:700 10px var(--sans); }
.booklet-ledger-heading .booklet-subhead { margin:0; }
.booklet-chart { display:grid; gap:9px; padding:16px 18px; background:var(--booklet-warm); border:1px solid rgba(25,53,68,.08); }
.booklet-chart .booklet-subhead { margin:0 0 3px; font-size:19px; }
.booklet-bar-item { display:grid; gap:5px; }
.booklet-bar-meta { display:flex; justify-content:space-between; gap:16px; color:#3f505b; font-size:10px; }
.booklet-bar-meta strong { color:#203643; white-space:nowrap; }
.booklet-bar-track { height:7px; overflow:hidden; background:rgba(39,58,69,.12); border-radius:8px; }
.booklet-bar-fill { display:block; height:100%; background:var(--booklet-accent); border-radius:8px; }
.booklet-photo-feature { display:grid; grid-template-columns:1fr 1fr; min-height:168px; overflow:hidden; background:var(--booklet-deep); }
.booklet-photo-feature img { width:100%; height:100%; min-height:168px; max-height:210px; object-fit:cover; }
.booklet-photo-caption { display:grid; align-content:center; gap:9px; padding:18px 22px; color:#fff; }
.booklet-photo-caption .booklet-kicker { margin:0; color:#b8d7df; }
.booklet-photo-caption p { margin:0; color:rgba(255,255,255,.92); font:400 16px/1.45 var(--serif); }
.ledger-row { grid-template-rows:auto auto; }
.ledger-row .row-guidance { grid-column:1/-1; margin:0; padding:8px 2px 0; color:#566671; border-top:1px solid #edf0f1; font-size:10px; line-height:1.55; }
.ledger-row input::placeholder { color:#73808a; opacity:1; font-size:10px; }
.rate-note { padding:12px 14px; margin-top:14px; color:#344651; background:#fff; border:1px solid #dce3e6; }
.rate-note summary { color:#075e91; font-size:11px; font-weight:800; cursor:pointer; }
.rate-note p { margin:10px 0 0; color:#4c5c66; font-size:10px; line-height:1.7; }
.rate-note a { color:#075e91; text-decoration:underline; }
.booklet-photo-feature + .booklet-chart { margin-top:4px; }
.planning-booklet-page.is-cover { justify-content:flex-end; color:#fff; border:0; background:#152b39; }
.planning-booklet-page.is-cover::after { position:absolute; inset:0; z-index:1; content:""; background:linear-gradient(90deg,rgba(8,24,35,.88) 0%,rgba(8,24,35,.68) 48%,rgba(8,24,35,.04) 100%),linear-gradient(0deg,rgba(8,24,35,.54),transparent 62%); }
.planning-booklet-page.is-cover .booklet-page-image { position:absolute; inset:0; z-index:0; width:100%; height:100%; margin:0; object-fit:cover; }
.planning-booklet-page.is-cover > :not(.booklet-page-image) { position:relative; z-index:2; max-width:690px; }
.planning-booklet-page.is-cover .booklet-kicker { color:#d9e8ed; }
.planning-booklet-page.is-cover h2 { max-width:690px; color:#fff; font-size:clamp(44px,7vw,68px); line-height:.99; text-wrap:balance; }
.planning-booklet-page.is-cover .booklet-cover-line { max-width:570px; color:rgba(255,255,255,.94); font-size:23px; }
.planning-booklet-page.is-cover .booklet-cover-date { color:rgba(255,255,255,.82); }
.planning-booklet-page.is-cover .booklet-created-for { margin:5px 0 8px; color:#fff; font:400 clamp(24px,4vw,34px)/1.2 var(--serif); }
.planning-booklet-page.is-cover .booklet-cover-contact { margin:4px 0; color:rgba(255,255,255,.92); font-size:11px; line-height:1.6; }
.planning-booklet-page.is-cover .booklet-cover-callout { max-width:490px; color:#243c4a; border-left-color:var(--booklet-accent); background:rgba(250,252,252,.95); }
.planning-booklet[data-template="business"] .booklet-chart { background:#edf4f2; }
.planning-booklet[data-template="family"] .booklet-question-box { background:#f8eee9; border-left:3px solid #9b2828; }
.planning-booklet[data-template="individual"] .booklet-question-box { background:#e9f3f6; border-left:3px solid #0878b9; }
.planning-booklet[data-template="business"] .booklet-question-box { background:#e9f2f0; border-left:3px solid #087c78; }
@media (max-width: 850px) { .template-grid { grid-template-columns: 1fr 1fr; } .template-card:last-child { grid-column: 1/-1; } .planning-booklet-page { min-height: 820px; padding: 45px; } .booklet-page-image { width: calc(100% + 90px); margin: -45px -45px 28px; } .ledger-row,.ledger-row[data-type="incomes"],.ledger-row[data-type="debts"],.ledger-row[data-type="assets"],.ledger-row[data-type="bills"],.ledger-row[data-type="coverage"] { grid-template-columns: 1fr 1fr; } .ledger-row .remove-row { justify-self: end; } }
@media (max-width: 600px) { .template-grid,.booklet-grid { grid-template-columns: 1fr; } .booklet-grid .span-all { grid-column:auto; } .template-card:last-child { grid-column: auto; } .template-card { grid-template-rows: 160px 1fr; } .template-card img { height: 160px; } .ledger-title { display: grid; } .ledger-title .button { justify-self: start; } .ledger-row,.ledger-row[data-type="incomes"],.ledger-row[data-type="debts"],.ledger-row[data-type="assets"],.ledger-row[data-type="bills"],.ledger-row[data-type="coverage"] { grid-template-columns: 1fr; } .ledger-row .remove-row { justify-self: start; } .planning-booklet-page { min-height: 720px; padding: 26px; } .booklet-page-image { width: calc(100% + 52px); height: 185px; margin: -26px -26px 24px; } .booklet-stat-grid { gap: 7px; } .booklet-stat { padding: 11px; } .booklet-stat strong { font-size: 20px; } .booklet-table { font-size: 9px; } .booklet-table th,.booklet-table td { padding: 7px 5px; } }
@page { size: letter; margin: 0; }
@media print {
  body:has(#planningBooklet.show) * { visibility: hidden !important; }
  body:has(#planningBooklet.show) #planningBooklet, body:has(#planningBooklet.show) #planningBooklet * { visibility: visible !important; }
  body:has(#planningBooklet.show) #planningBooklet { display:block !important; position:absolute; inset:0; width:100%; margin:0; }
  .planning-booklet-page { display:flex !important; width:8.5in; min-height:11in; height:auto; max-width:none; padding:.58in .68in; margin:0; border:0; box-shadow:none; overflow:visible; break-after:page; page-break-after:always; }
  .planning-booklet-page:last-of-type { break-after:page; page-break-after:always; }
  .booklet-page-image { width:calc(100% + 1.36in); height:2.5in; margin:-.58in -.68in .35in; }
  .planning-booklet-page h2 { font-size:32pt; }
  .booklet-lede { font-size:13pt; }
  .booklet-table { font-size:8pt; }
  .booklet-table th,.booklet-table td { padding:6pt; }
  .booklet-actions { display:none !important; }
  .booklet-small { font-size:8pt; }
  .planning-booklet-page.is-cover { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .planning-booklet-page.is-cover::after,.planning-booklet-page.is-cover .booklet-cover-callout,.booklet-stat,.booklet-table th,.booklet-chart,.booklet-question-box,.booklet-cta,.booklet-ledger-heading>span { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .booklet-photo-feature { max-height:1.55in; }
  .booklet-photo-feature img { min-height:1.55in; max-height:1.55in; }
}
@media (max-width:600px) { .booklet-photo-feature { grid-template-columns:1fr; } .booklet-photo-feature img { max-height:175px; } .booklet-photo-caption { padding:14px 16px; } }

.planning-booklet-page { isolation:isolate; }
.planning-booklet-page:not(.is-cover)::before { position:absolute; top:0; right:0; width:94px; height:94px; content:""; background:linear-gradient(135deg,transparent 49%,var(--booklet-warm) 50%); opacity:.78; pointer-events:none; }
.planning-booklet-page:not(.is-cover) > :not(.booklet-page-image) { position:relative; z-index:1; }
.booklet-page-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:auto; padding-top:12px; color:#60717b; border-top:1px solid rgba(49,72,85,.19); font-size:8px; font-weight:800; letter-spacing:.13em; }
.booklet-page-footer span:last-child { display:grid; place-items:center; width:27px; height:27px; color:#fff; background:var(--booklet-accent); border-radius:50%; font-size:9px; letter-spacing:0; }
.planning-booklet-page.is-cover .booklet-page-footer { color:rgba(255,255,255,.84); border-color:rgba(255,255,255,.4); }
.planning-booklet-page.is-cover .booklet-page-footer span:last-child { color:var(--booklet-deep); background:#fff; }
.booklet-ledger-heading { padding-bottom:9px; border-bottom:1px solid rgba(35,57,69,.16); }
.booklet-ledger-heading .booklet-subhead { font-size:25px; }
.booklet-page-3 .booklet-chart,.booklet-page-4 .booklet-chart { margin-top:4px; }
.booklet-page-3 .booklet-chart { background:linear-gradient(115deg,var(--booklet-warm),#fff); }
.booklet-page-4 .booklet-chart { background:linear-gradient(115deg,#fff,var(--booklet-warm)); }
.planning-booklet[data-template="business"] .booklet-page-2 .booklet-photo-feature { grid-template-columns:1.15fr .85fr; }
.planning-booklet[data-template="business"] .booklet-page-2 .booklet-photo-caption { padding:22px 25px; }
.planning-booklet[data-template="business"] .booklet-page-2 .booklet-photo-caption p { font-size:18px; }
.planning-booklet[data-template="family"] .booklet-page-2 .booklet-photo-feature { grid-template-columns:.95fr 1.05fr; }
.planning-booklet[data-template="individual"] .booklet-page-2 .booklet-photo-feature { grid-template-columns:1.05fr .95fr; }
.booklet-table tr { break-inside:avoid; page-break-inside:avoid; }
.rate-note { border-left:3px solid var(--booklet-accent); }
.rate-note summary { color:var(--booklet-accent); }
.rate-note p + p { margin-top:8px; }
@media (max-width:600px) {
  .booklet-page-footer { font-size:7px; letter-spacing:.08em; }
  .planning-booklet-page:not(.is-cover)::before { width:60px; height:60px; }
}

/* Client-ready planning report hierarchy */
.planning-booklet-page{border-radius:3px;box-shadow:0 22px 55px rgba(18,36,49,.14);padding:72px 76px;background:linear-gradient(180deg,#fff 0%,#fff 76%,#f7f9fa 100%)}
.planning-booklet-page:not(.is-cover){border-top:7px solid var(--booklet-accent)}
.planning-booklet-page:not(.is-cover) h2{max-width:640px;font-size:clamp(34px,4vw,46px);letter-spacing:-.025em}
.booklet-kicker{display:flex;align-items:center;gap:10px;color:var(--booklet-accent);font-size:10px;letter-spacing:.19em}.booklet-kicker::before{content:"";display:block;width:26px;height:2px;background:currentColor}
.booklet-stat{border-radius:3px;padding:18px 20px}.booklet-stat strong{font-size:28px}.booklet-table{font-size:11px}.booklet-table th{padding:11px 10px;font-size:9px}.booklet-table td{padding:10px}
@media(max-width:600px){.planning-booklet-page{padding:30px 24px;min-height:780px}.planning-booklet-page.is-cover h2{font-size:40px}.planning-booklet-page:not(.is-cover) h2{font-size:32px}}
@media print{.planning-booklet-page{border-radius:0;box-shadow:none;background:#fff}.planning-booklet-page:not(.is-cover){border-top:4px solid var(--booklet-accent)}}
