/* retirement-planning + child-education. Owner: GOALS agent */

/* Retirement hero */
.g-ticks{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px;color:#d5deec}
.g-ticks li{display:flex;gap:10px;align-items:flex-start}
.g-ticks .ico{flex:none;width:20px;height:20px;color:var(--accent)}
.g-rhero .form-card{color:var(--body)}

/* Inflation comparison */
.g-infl{display:grid;grid-template-columns:1fr auto 1.25fr;gap:clamp(16px,3vw,40px);align-items:stretch}
.g-infl__card{display:flex;flex-direction:column;gap:6px;padding:clamp(22px,3vw,36px);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--white)}
.g-infl__card b{font:600 clamp(36px,5vw,64px)/1.05 var(--f-disp);color:var(--navy)}
.g-infl__card--hi{background:var(--navy);border-color:var(--navy);color:#d5deec}
.g-infl__card--hi b{color:var(--accent)}
.g-infl__tag{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--green)}
.g-infl__card--hi .g-infl__tag{color:#a9b7cf}
.g-infl__arrow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);text-align:center}
.g-infl__arrow .ico{width:40px;height:40px;color:var(--green)}
.g-infl__arrow small{max-width:11ch;font-size:13px}
@media (max-width:760px){.g-infl{grid-template-columns:1fr}.g-infl__arrow .ico{transform:rotate(90deg)}}

/* Phases */
.g-phases h3{margin:0 0 8px}
.g-phases h3 small{display:block;font:500 14px/1.4 var(--f-body);color:var(--muted);margin-top:4px}
.g-phases p{margin:0 0 8px}
.g-ret-photo{margin-top:24px}
@media (max-width:960px){.g-ret-photo{display:none}}

/* Age checklist */
.g-ages{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--navy)}
.g-age{padding:24px clamp(16px,2vw,32px) 8px 0}
.g-age+.g-age{padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--line)}
.g-age__n{display:block;font:600 clamp(40px,4.5vw,60px)/1 var(--f-disp);color:var(--green);margin-bottom:12px}
@media (max-width:860px){.g-ages{grid-template-columns:1fr}.g-age+.g-age{padding-left:0;border-left:0;border-top:1px solid var(--line)}}

/* Calculator width */
.g-calc{max-width:100%}

/* Child hero */
.g-ehero{align-items:start}
.g-ehero__img{margin-top:24px}
.g-ehero .form-card{position:sticky;top:calc(var(--hdr) + 16px)}
@media (max-width:960px){.g-ehero .form-card{position:static}}

/* Cost table */
.g-cost td.num,.g-cost th:not(:first-child){text-align:right;white-space:nowrap}

/* Two calculators */
.g-calcs{display:grid;grid-template-columns:1fr;gap:clamp(32px,4vw,56px)}
.g-calcs>div{min-width:0}
.g-calcs h3{margin:0 0 12px}

/* Why start early bars */
.g-bars{display:grid;gap:22px}
.g-bar{display:grid;grid-template-columns:150px 1fr 96px;gap:16px;align-items:center}
.g-bar__l{color:#fff;font-weight:600}
.g-bar__l small{display:block;font-weight:400;color:#a9b7cf;font-size:13px}
.g-bar__t{height:18px;border-radius:9px;background:rgba(255,255,255,.1);overflow:hidden}
.g-bar__t i{display:block;height:100%;width:var(--w);background:var(--accent);border-radius:9px}
.g-bar b{color:#fff;font:600 20px/1 var(--f-disp);text-align:right}
@media (max-width:560px){.g-bar{grid-template-columns:1fr auto}.g-bar__t{grid-column:1/-1;grid-row:2}}

/* Step-up kv */
.g-step dd small{display:block;color:var(--muted);font-size:13px}
.g-step dd .num{font:600 24px/1.2 var(--f-disp);color:var(--navy)}

/* FAQ full width */
.g-faq{max-width:none}

/* QA: UA figure margin (40px sides) shrank photos; reset until style.css does it */
figure.photo{margin-left:0;margin-right:0}
