/* Retirement landing page — local unpublished build.
   Reuses shared style.css tokens/typography, header and footer. Palette:
   ivory #F6F3ED, navy #141D2E, stone #EAE6DD, sage text #526459, brass #B09568, rule #D9D5CB.
   Desktop content padding 96 @1440 (max 1248), tablet 48, mobile 24.
   Page-scoped (.retirement-landing) so no other route is affected. */

.retirement-landing{background:var(--ivory);--rl-sage:#526459;--rl-rule:#d9d5cb}

/* ---- layout container: 24 mobile / 48 tablet / 96 desktop, content capped at 1248 ---- */
.retirement-landing .rl-section{padding-block:clamp(48px,6.5vw,88px);padding-inline:24px}
.retirement-landing .rl-inner{width:100%;max-width:1248px;margin-inline:auto}
@media(min-width:768px){.retirement-landing .rl-section{padding-inline:48px}}
@media(min-width:1200px){.retirement-landing .rl-section{padding-inline:96px}}

/* shared type within the page — stronger, supported weights only (Franklin 400/500/600) */
.retirement-landing .rl-h2{font-size:clamp(33px,3.6vw,52px);line-height:1.08;margin:14px 0 22px}
.retirement-landing .eyebrow{margin-bottom:16px;font-weight:600}
.retirement-landing .rl-deck{font-size:clamp(17px,1.5vw,19px);line-height:1.6;color:var(--ink);margin-bottom:30px}
.retirement-landing .stone{background:var(--stone)}
.retirement-landing .rl-incomplete{opacity:.72}

/* ---- hero ---- */
.retirement-landing .rl-hero{padding-top:clamp(30px,4vw,52px);padding-bottom:clamp(40px,5vw,64px)}
.retirement-landing .rl-hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(36px,6vw,110px);align-items:end}
.retirement-landing .rl-hero-title .back-link{margin-bottom:26px}
.retirement-landing .rl-hero h1{font-size:clamp(40px,5.4vw,76px);line-height:1.04}
.retirement-landing .rl-hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.retirement-landing .rl-hero-actions .button{max-width:100%;text-align:left}
.retirement-landing .rl-hero-actions .text-link{font-size:13.5px}

/* ---- full-bleed couple ---- */
.retirement-landing .rl-photo{margin:0}
.retirement-landing .rl-photo img{width:100%;height:480px;object-fit:cover;object-position:50% 20%;background:var(--stone)}
.retirement-landing .rl-photo figcaption{padding:22px 24px 0}
.retirement-landing .rl-photo figcaption .eyebrow{margin:0}
@media(min-width:768px){.retirement-landing .rl-photo figcaption{padding-inline:48px}}
@media(min-width:1200px){.retirement-landing .rl-photo figcaption{padding-inline:max(96px,calc((100% - 1248px)/2))}}
@media(max-width:760px){.retirement-landing .rl-photo figcaption{padding:18px 24px 0}}

/* ---- 01 / on-page income calculator ---- */
.retirement-landing .rl-calc-head{max-width:900px}
.retirement-landing .rl-calc-deck{font-size:clamp(16px,1.5vw,18px);line-height:1.65;color:var(--ink);max-width:62ch;margin-bottom:clamp(24px,3vw,36px)}
.retirement-landing .rl-calc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:clamp(22px,3vw,44px);align-items:start}

.retirement-landing .rl-form{background:var(--ivory);border:1px solid var(--rl-rule);padding:clamp(22px,2.4vw,32px)}
.retirement-landing .rl-form-hint{font-size:13px;line-height:1.6;color:#526459;margin-bottom:22px;max-width:46ch}
.retirement-landing .rl-field{margin-bottom:20px}
.retirement-landing .rl-field label{font-size:15px;font-weight:600;display:block;line-height:1.4}
.retirement-landing .rl-field label span{display:block;font-weight:400;font-size:12.5px;color:#566158;margin-top:3px}
.retirement-landing .rl-number{display:flex;align-items:center;gap:8px;border-bottom:1px solid #7c8278;margin-top:10px}
.retirement-landing .rl-number>span{color:var(--rl-sage);font-size:17px}
.retirement-landing .rl-number input{width:100%;min-width:0;border:0;background:transparent;font:inherit;font-size:19px;font-weight:600;color:var(--navy);padding:8px 0}
.retirement-landing .rl-field input[type=range]{width:100%;margin-top:12px;accent-color:var(--navy)}
.retirement-landing .rl-ages{border:1px solid var(--rl-rule);margin:26px 0 0;padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.retirement-landing .rl-ages legend{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--rl-sage);padding:0 6px}
.retirement-landing .rl-ages label{font-size:12.5px;font-weight:600;color:var(--navy);display:flex;flex-direction:column;gap:6px}
.retirement-landing .rl-ages input{border:1px solid #b9b4a8;background:#fff;padding:9px 10px;font:inherit;font-size:15px;color:var(--navy);border-radius:0;width:100%}
.retirement-landing .rl-inflation-field{grid-column:1/-1}
.retirement-landing .rl-inflation-note{display:block;font-size:11.5px;font-weight:400;color:#526459;line-height:1.6;margin-top:4px}
.retirement-landing .rl-inflation-note a{text-decoration:underline;text-underline-offset:3px}
.retirement-landing .rl-fine{font-size:12.5px;line-height:1.7;color:#526459;margin-top:16px}
.retirement-landing .rl-form-actions{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:18px}
.retirement-landing .rl-form-actions .text-link{font-size:12.5px;min-height:44px;display:inline-flex;align-items:center;font-weight:600}
.retirement-landing .rl-error{font-size:13px;line-height:1.6;color:#8a2b21;margin-top:12px}
.retirement-landing [aria-invalid="true"]{border-color:#8a2b21!important}

.retirement-landing .rl-results{background:var(--navy);color:var(--ivory);padding:clamp(24px,2.6vw,36px);display:flex;flex-direction:column;gap:18px}
.retirement-landing .rl-results .eyebrow{color:var(--brass)}
.retirement-landing .rl-hero-metric{margin:0}
.retirement-landing .rl-hero-label{font-size:11px;letter-spacing:.14em;font-weight:600;color:#c9c4b8;margin:0 0 10px}
.retirement-landing .rl-result-hero{margin:0;font-family:'Libre Franklin',Arial,sans-serif;font-weight:600;font-size:clamp(46px,5.4vw,74px);line-height:1;color:var(--ivory);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.retirement-landing .rl-hero-gap{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:16px 0 0;padding-top:16px;border-top:2px solid var(--brass)}
.retirement-landing .rl-hero-gap strong{font-family:'Libre Franklin',Arial,sans-serif;font-weight:600;font-size:clamp(22px,2.2vw,30px);color:var(--ivory);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.retirement-landing .rl-hero-gap-label{font-size:10px;letter-spacing:.12em;font-weight:600;color:#c9c4b8}
.retirement-landing .rl-ledger{margin:0;border-top:1px solid #334053}
.retirement-landing .rl-ledger>div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #334053}
.retirement-landing .rl-ledger dt{font-size:13px;color:#d9d5cb;margin:0}
.retirement-landing .rl-ledger dd{margin:0;font-size:15px;font-weight:600;color:var(--ivory);font-variant-numeric:tabular-nums}
.retirement-landing .rl-interpretation{font-size:14.5px;line-height:1.65;color:#e8e5dd;margin:0}
.retirement-landing .rl-chart-figure{margin:0}
.retirement-landing .rl-chart-legend{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;font-size:11.5px;color:#d9d5cb;margin-bottom:8px}
.retirement-landing .rl-key-need,.retirement-landing .rl-key-income{display:inline-block;width:18px;height:3px}
.retirement-landing .rl-key-need{background:var(--brass)}
.retirement-landing .rl-key-income{background:#8b96a8}
.retirement-landing .rl-chart-svg{width:100%;height:auto;display:block}
.retirement-landing .rl-axis{stroke:#4c5a70;stroke-width:1}
.retirement-landing .rl-line-need{fill:none;stroke:var(--brass);stroke-width:2.5}
.retirement-landing .rl-line-inc{fill:none;stroke:#8b96a8;stroke-width:2;stroke-dasharray:6 5}
.retirement-landing .rl-dot{fill:var(--brass)}
.retirement-landing .rl-axis-label{fill:#c9c4b8;font-size:11px;font-family:'Libre Franklin',Arial,sans-serif}
.retirement-landing .rl-projection{border-top:1px solid #334053;padding-top:12px}
.retirement-landing .rl-projection summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--ivory);list-style:none;display:flex;justify-content:space-between;gap:10px;min-height:44px;align-items:center}
.retirement-landing .rl-projection summary::-webkit-details-marker{display:none}
.retirement-landing .rl-projection summary span{color:var(--brass);font-size:19px}
.retirement-landing .rl-projection[open] summary span{transform:rotate(45deg)}
.retirement-landing .rl-table-wrap{overflow-x:auto;margin-top:12px;max-width:100%}
.retirement-landing .rl-table{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
.retirement-landing .rl-table caption{text-align:left;font-size:11.5px;color:#c9c4b8;padding-bottom:8px}
.retirement-landing .rl-table th,.retirement-landing .rl-table td{text-align:left;padding:8px 10px;border-bottom:1px solid #334053;color:#e8e5dd;font-variant-numeric:tabular-nums;white-space:nowrap}
.retirement-landing .rl-table thead th{font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:#c9c4b8}
.retirement-landing .rl-row-retirement th,.retirement-landing .rl-row-retirement td{color:var(--brass);font-weight:600}
.retirement-landing .rl-row-horizon th,.retirement-landing .rl-row-horizon td{border-bottom-color:var(--brass)}
.retirement-landing .rl-caption{font-size:11.5px;line-height:1.7;color:#c9c4b8;font-style:italic;margin:0}
.retirement-landing .rl-results-cta{align-self:flex-start;max-width:100%;text-align:left}

.retirement-landing .rl-method{margin-top:clamp(22px,3vw,34px);border-top:1px solid var(--rl-rule);padding-top:16px}
.retirement-landing .rl-method summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--navy);min-height:44px;display:flex;align-items:center}
.retirement-landing .rl-method p{font-size:13.5px;line-height:1.7;color:#4c554e;max-width:82ch;margin:0 0 12px}

/* ---- shared split layout (used by the 02 / How we help section) ---- */
.retirement-landing .rl-two{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(36px,5.5vw,90px);align-items:start}

/* ---- 02 / how we help: split image + 3-step narrative ---- */
.retirement-landing .rl-value-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(36px,5.5vw,80px)}
.retirement-landing .rl-veranda{margin:0}
.retirement-landing .rl-veranda img{width:100%;height:540px;object-fit:cover;background:var(--stone)}
.retirement-landing .rl-value-copy>p:not(.eyebrow):not(.rl-value-note){font-size:17px;line-height:1.65}
.retirement-landing .rl-principles{margin-top:8px}
.retirement-landing .rl-principles>div{border-top:1px solid var(--rl-rule);padding:18px 0 4px}
.retirement-landing .rl-principles h3{font-size:clamp(22px,1.9vw,27px);line-height:1.15;margin-bottom:10px}
.retirement-landing .rl-principles p{font-size:16px;line-height:1.6;margin-bottom:14px}
.retirement-landing .rl-value-note{font-size:14px;line-height:1.7;color:var(--rl-sage);margin-top:14px}
.retirement-landing .rl-value-note a{text-decoration:underline;text-underline-offset:4px;font-weight:600}
@media(max-width:760px){.retirement-landing .rl-veranda img{height:260px}}

/* ---- 05 / FAQ ---- */
.retirement-landing .rl-faq-inner{max-width:850px;margin-inline:auto}
.retirement-landing .rl-faq-list{margin-top:8px}
.retirement-landing .rl-faq-list details{border-top:1px solid #c9c4b8}
.retirement-landing .rl-faq-list details:last-child{border-bottom:1px solid #c9c4b8}
.retirement-landing .rl-faq-list summary{cursor:pointer;list-style:none;display:block;padding:20px 24px 20px 0;font-family:'Libre Caslon Display',Georgia,serif;font-size:clamp(20px,1.9vw,25px);line-height:1.3;position:relative}
.retirement-landing .rl-faq-list summary::-webkit-details-marker{display:none}
.retirement-landing .rl-plus{display:inline-block;margin-left:12px;font-family:'Libre Franklin',Arial,sans-serif;font-size:20px;line-height:1;color:var(--rl-sage);transition:transform 200ms}
.retirement-landing .rl-faq-list details[open] .rl-plus{transform:rotate(45deg)}
.retirement-landing .rl-faq-list p{font-size:16px;line-height:1.7;max-width:760px;margin:0 0 22px;padding-right:24px}

/* ---- 02b / advanced retirement strategies (navy feature inside the 02 help section) ---- */
.retirement-landing .rl-advanced{margin-top:clamp(40px,5vw,72px);padding:clamp(28px,4vw,56px);scroll-margin-top:calc(var(--header-space) + 26px)}
.retirement-landing .rl-advanced-h2{font-size:clamp(32px,3.4vw,50px);line-height:1.08;color:var(--ivory);margin:0 0 18px;max-width:22ch}
.retirement-landing .rl-advanced-lead{font-size:clamp(16px,1.5vw,18px);line-height:1.6;color:#e8e5dd;max-width:66ch;margin:0 0 clamp(26px,3vw,38px)}
.retirement-landing .rl-advanced-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3.5vw,56px);border-top:1px solid #334053;padding-top:clamp(22px,2.6vw,32px)}
.retirement-landing .rl-advanced-card h3{font-size:clamp(22px,1.9vw,28px);line-height:1.15;color:var(--ivory);margin:0 0 10px}
.retirement-landing .rl-advanced-card p{font-size:16px;line-height:1.65;color:#d9d5cb;margin:0}
.retirement-landing .rl-advanced-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:clamp(26px,3vw,38px)}
.retirement-landing .rl-advanced-actions .button{max-width:100%;text-align:left}
.rl-advanced-actions .text-link{color:var(--ivory);font-size:13.5px;font-weight:600}
.retirement-landing .rl-advanced-note{font-size:12.5px;line-height:1.7;color:#c9c4b8;margin:16px 0 0}

/* ---- navy closer / Blueprint conversion ---- */
.retirement-landing .rl-close{padding-block:clamp(56px,7vw,92px)}
.retirement-landing .rl-close-h2{font-size:clamp(34px,4.4vw,64px);line-height:1.06;color:var(--ivory)}
.retirement-landing .rl-close-lead{font-size:17px;line-height:1.6;max-width:640px;margin-bottom:30px}
.retirement-landing .rl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px}
.retirement-landing .rl-actions .button{max-width:100%;text-align:left}
.retirement-landing .rl-actions .text-link{font-size:13.5px}
.retirement-landing .rl-close .rl-fine{font-size:12px;line-height:1.8;margin-top:26px;color:#d9d5cb}

/* ---- footer: existing WHITE reversed CLG mark (same asset as the homepage footer) ---- */
.retirement-landing footer .footer-brand{display:block;width:52px;margin-bottom:22px}
.retirement-landing footer .footer-brand img{width:100%;height:auto;object-fit:contain}

/* ---- responsive ---- */
@media(max-width:900px){
  .retirement-landing .rl-hero-grid{grid-template-columns:1fr;gap:26px;align-items:start}
  .retirement-landing .rl-two{grid-template-columns:1fr;gap:34px}
  .retirement-landing .rl-value-grid{grid-template-columns:1fr;gap:30px}
  .retirement-landing .rl-calc-grid{grid-template-columns:1fr;gap:26px}
  .retirement-landing .rl-photo img{height:340px}
}
@media(max-width:760px){
  .retirement-landing .rl-photo img{height:248px;object-position:50% 25%}
  .retirement-landing .rl-actions{align-items:stretch;flex-direction:column}
  .retirement-landing .rl-actions .button{justify-content:space-between}
  .retirement-landing .rl-ages{grid-template-columns:1fr}
  .retirement-landing .rl-advanced-cols{grid-template-columns:1fr;gap:26px}
  .retirement-landing .rl-advanced-actions .button{width:100%;justify-content:space-between}
  .retirement-landing .rl-results-cta{width:100%;justify-content:space-between}
}
@media(max-width:380px){
  .retirement-landing .rl-hero-gap{flex-direction:column;gap:6px}
}

/* ---- shared header mobile menu (homepage pattern, scoped to this page) ----
   Desktop keeps the inline horizontal nav; at <=760px the nav folds into a native
   details/summary Menu control (keyboard-operable; aria-expanded/Escape handled in
   retirement-landing.js). Mirrors the approved homepage header menu. */
.retirement-landing .cta-mini{display:none}
.retirement-landing .menu-drawer{display:none}
@media(max-width:760px){
  .retirement-landing .menu-drawer{display:block;position:relative;margin-left:auto}
  .retirement-landing .menu-summary{display:flex;align-items:center;min-height:44px;padding:0 13px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#141d2e;background:rgba(246,243,237,.6);border:1px solid rgba(20,29,46,.35);border-radius:3px;cursor:pointer;list-style:none}
  .retirement-landing .menu-summary::-webkit-details-marker{display:none}
  .retirement-landing .menu-summary::after{content:"\25be";margin-left:8px;font-size:9px}
  .retirement-landing .menu-drawer[open] .menu-summary::after{content:"\25b4"}
  .retirement-landing .menu-drawer[open] .menu-summary{background:#f6f3ed}
  .retirement-landing .menu-panel{position:absolute;right:0;top:calc(100% + 8px);min-width:230px;z-index:60;background:#f6f3ed;border:1px solid #d9d5cb;box-shadow:0 18px 40px rgba(20,29,46,.18)}
  .retirement-landing .menu-panel nav{display:flex!important;flex-direction:column;gap:0}
  .retirement-landing .menu-panel a{display:flex;align-items:center;min-height:48px;padding:0 20px;font-size:12px;color:#141d2e;text-decoration:none;border-bottom:1px solid #e5e0d6}
  .retirement-landing .menu-panel a:last-child{border-bottom:0;font-weight:600}
  .retirement-landing .menu-panel a:hover,.retirement-landing .menu-panel a:focus-visible{background:#eae6dd}
}
/* Narrow phones: shorten the Blueprint CTA so brand, CTA and Menu never collide. */
@media(max-width:420px){
  .retirement-landing .cta-full{display:none}
  .retirement-landing .cta-mini{display:inline}
}
@media(max-width:355px){
  .retirement-landing .menu-summary{padding-inline:11px}
}
