/* "Fresh" alternative: same brand, softer and more modern. Loaded after site.css. */
.theme-fresh { --paper:#F6F5F1; --card:#fff; --r-lg:28px; --r-md:20px; background:var(--paper); }

/* floating rounded menu bar */
.theme-fresh .util { display:none; }
.theme-fresh .site-head { background:transparent; border-bottom:0; padding:22px 0 0; box-shadow:none; }
.theme-fresh .site-head .head-row { background:#fff; border-radius:999px;
  box-shadow:0 10px 30px rgba(20,33,61,.08); padding:16px 18px 16px 34px; max-width:calc(var(--wrap)); margin:0 auto; }
.theme-fresh .site-head.slim { background:transparent; box-shadow:none; backdrop-filter:none; }
.theme-fresh .site-head.slim .head-row { padding-top:10px; padding-bottom:10px; box-shadow:0 14px 34px rgba(20,33,61,.14); }
.theme-fresh .logo img { height:52px; mix-blend-mode:multiply; }
.theme-fresh .menu a, .theme-fresh .menu button { padding:10px 14px; border-radius:999px; }
.theme-fresh .menu ul { gap:10px; }
.theme-fresh .menu a:hover, .theme-fresh .menu button:hover { background:var(--mist); color:var(--ink); }
.theme-fresh .menu a[aria-current] { background:var(--mist); color:var(--ink); }
.theme-fresh .menu .last a { border-radius:999px; padding:12px 20px; }

/* pill buttons, borderless soft cards */
.theme-fresh .btn { border-radius:999px; }
.theme-fresh .tool, .theme-fresh .contact, .theme-fresh .value, .theme-fresh .pick, .theme-fresh .card, .theme-fresh .cta-card, .theme-fresh .side-toc,
.theme-fresh .author-box, .theme-fresh .rk-card, .theme-fresh .feecalc, .theme-fresh .quick a, .theme-fresh .profile, .theme-fresh .rv-card, .theme-fresh .calc-shell {
  border:0; border-radius:var(--r-md); box-shadow:0 1px 2px rgba(20,33,61,.04), 0 12px 32px rgba(20,33,61,.07); background:var(--card); }
.theme-fresh .tool:hover, .theme-fresh .cta-card:hover, .theme-fresh .value:hover { transform:translateY(-4px); box-shadow:0 2px 4px rgba(20,33,61,.05), 0 20px 44px rgba(20,33,61,.12); }
.theme-fresh .calc-shell { border-radius:var(--r-lg); }
.theme-fresh .chip { border-color:transparent; background:#fff; box-shadow:0 2px 8px rgba(20,33,61,.06); }
.theme-fresh .chip[aria-pressed="true"] { background:var(--ink); color:#fff; }

/* page headings sit on a soft colour panel */
.theme-fresh .page-head { background:var(--mist); border-radius:var(--r-lg); padding:48px 48px 52px; margin-top:18px; border-bottom:0; }
.theme-fresh .page-head.split img { border-radius:var(--r-md); }
.theme-fresh .article-hero { background:var(--mist); border-radius:var(--r-lg); padding:40px 48px 48px; margin-top:18px; }
.theme-fresh .article-hero .hero-fig { margin-bottom:0; }
.theme-fresh .crumbs { padding-top:34px; }
.theme-fresh .section-head, .theme-fresh .band, .theme-fresh .reviews, .theme-fresh .home-faq { border-top-color:transparent; }
.theme-fresh [data-rule]::before { height:4px; border-radius:4px; width:72px; right:auto; }
.theme-fresh .section-head h2, .theme-fresh .reviews h2, .theme-fresh .home-faq h2 { font-size:44px; letter-spacing:-.03em; }
.theme-fresh .news .wrap { border-radius:var(--r-lg); }
.theme-fresh .news { background:transparent; }
.theme-fresh .news .wrap { background:var(--ink); padding:48px 56px; margin-bottom:24px; }
.theme-fresh footer.site { border-radius:var(--r-lg) var(--r-lg) 0 0; }

/* ---------- homepage ---------- */
.f-hero { position:relative; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:48px; align-items:center; background:var(--ink); color:#fff;
  border-radius:36px; padding:64px 56px; margin-top:22px; overflow:hidden; }
.f-hero::after { content:""; position:absolute; right:-120px; top:-140px; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle, rgba(255,227,142,.18), transparent 65%); pointer-events:none; }
.f-hero .label { color:var(--yellow); }
.f-hero h1 { color:#fff; font-size:84px; line-height:.98; letter-spacing:-.04em; margin-top:14px; }
.f-hero h1 span { color:var(--yellow); }
.f-lede { color:var(--soft); font-size:19px; line-height:1.55; margin:20px 0 0; }
.q.q-hero { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); border-radius:22px; padding:22px; margin-top:28px; }
.q.q-hero > p { color:#fff; font-weight:600; margin:0; }
.q.q-hero input { height:54px; border-radius:999px; padding:0 20px; font-size:16px; }
.q.q-hero .btn { height:54px; padding:0 24px; }
.f-pills { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.f-pills a { color:#fff; text-decoration:none; font-weight:600; font-size:14px; padding:9px 16px; border-radius:999px; border:1px solid rgba(255,255,255,.22); transition:background .2s; }
.f-pills a:hover { background:rgba(255,255,255,.1); }
.f-hero-art { background:#fff; border-radius:28px; overflow:hidden; box-shadow:0 24px 50px rgba(0,0,0,.25); }
.f-hero-art > img { width:100%; aspect-ratio:5/4; object-fit:cover; object-position:50% 25%; display:block; }
.f-badge { display:flex; align-items:center; gap:14px; padding:16px 20px; color:var(--ink); }
.f-badge img { width:44px; height:44px; border-radius:50%; object-fit:cover; flex:none; }
.f-badge span { font-size:13px; color:var(--grey); line-height:1.35; }
.f-badge b { display:block; color:var(--ink); font-size:15px; }

.bento { display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:22px; margin:28px 0 0; }
.b-tile { background:#fff; border-radius:var(--r-md); box-shadow:0 1px 2px rgba(20,33,61,.04), 0 12px 32px rgba(20,33,61,.07); padding:28px; text-decoration:none; color:var(--ink); overflow:hidden;
  transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
a.b-tile:hover { transform:translateY(-4px); box-shadow:0 2px 4px rgba(20,33,61,.05), 0 22px 46px rgba(20,33,61,.12); }
.b-lead { grid-column:span 7; grid-row:span 2; padding:0; display:flex; flex-direction:column; }
.b-lead .ph { border-radius:0; }
.b-lead img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.b-lead > div { padding:26px 30px 30px; }
.b-lead h2 { font-size:34px; margin:10px 0 10px; }
.b-lead p { color:var(--grey); margin:0; }
.b-most { grid-column:span 5; grid-row:span 2; display:flex; flex-direction:column; }
.b-most > .label { margin-bottom:6px; }
.b-row { display:grid; grid-template-columns:44px 1fr; gap:12px; align-items:center; padding:16px 0; border-bottom:1px solid var(--rule); text-decoration:none; }
.b-row span { font-family:var(--display); font-weight:700; font-size:30px; color:var(--orange); }
.b-row b { font-family:var(--title); font-weight:600; font-size:17px; line-height:1.3; display:block; }
.b-row small { color:var(--grey); font-size:13px; }
.b-row:hover b { color:var(--orange); }
.b-most .ul { margin-top:auto; padding-top:18px; align-self:flex-start; }
.b-fact { grid-column:span 4; display:flex; flex-direction:column; justify-content:space-between; min-height:200px; box-shadow:none; }
.b-fact b { font-family:var(--display); font-weight:700; font-size:58px; letter-spacing:-.03em; line-height:1; }
.b-fact b span { display:inline; font-size:inherit; color:inherit; margin:0; }
.b-fact > span { font-size:16px; line-height:1.45; margin-top:18px; }
.b-fact.y { background:var(--yellow); } .b-fact.o { background:var(--orange); color:#fff; } .b-fact.p { background:var(--pale); }
.b-tool { grid-column:span 4; padding:0; }
.b-tool img { width:100%; aspect-ratio:16/10; object-fit:cover; }
.b-tool > div { padding:22px 26px 26px; }
.b-tool h3 { font-family:var(--title); font-weight:600; font-size:21px; letter-spacing:0; }
.b-tool p { color:var(--grey); margin:6px 0 0; font-size:15px; }
.b-tool .go { margin-top:14px; display:inline-block; font-weight:600; border-bottom:2px solid var(--yellow); }
.b-rev { grid-column:span 7; background:var(--ink); color:#fff; }
.b-rev .label { color:var(--yellow); }
.b-rev h2 { color:#fff; font-size:36px; margin:10px 0 18px; }
.b-rev ol { list-style:none; margin:0 0 18px; padding:0; }
.b-rev li { display:grid; grid-template-columns:1fr 1fr auto; gap:12px; align-items:center; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:15px; }
.b-rev li b { font-family:var(--display); font-size:17px; }
.b-rev li span { color:var(--soft); }
.b-rev .go { color:#fff; font-weight:600; border-bottom:2px solid var(--yellow); }
.b-aj { grid-column:span 5; padding:0; display:flex; flex-direction:column; }
.b-aj img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.b-aj > div { padding:22px 26px 26px; }
.b-aj h3 { font-size:22px; margin:8px 0 8px; }
.b-aj p { color:var(--grey); margin:8px 0 0; font-size:15px; }
.f-faq { margin-top:84px; }

@media (max-width:1100px) {
  .f-hero { grid-template-columns:1fr; padding:44px 32px; }
  .f-hero h1 { font-size:60px; }
  .b-lead, .b-most, .b-rev, .b-aj { grid-column:span 12; grid-row:auto; }
  .b-fact, .b-tool { grid-column:span 6; }
  .theme-fresh .page-head, .theme-fresh .article-hero { padding:32px 28px 36px; }
}
@media (max-width:820px) {
  .theme-fresh .site-head { padding:10px 0 0; }
  .theme-fresh .site-head .head-row { border-radius:22px; padding:8px 8px 8px 16px; }
  .theme-fresh .logo img { height:44px; }
  .theme-fresh .menu ul { border-radius:0 0 22px 22px; }
  .f-hero { padding:32px 22px; border-radius:26px; }
  .f-hero h1 { font-size:46px; }
  .q.q-hero form { flex-direction:column; }
  .q.q-hero input { flex:none; height:54px; width:100%; }
  .q.q-hero .btn { width:100%; }
  .b-fact, .b-tool { grid-column:span 12; }
  .b-fact { min-height:150px; }
  .b-rev li { grid-template-columns:1fr auto; } .b-rev li span:not(.stars) { display:none; }
  .theme-fresh .section-head h2, .theme-fresh .reviews h2, .theme-fresh .home-faq h2 { font-size:32px; }
  .theme-fresh .news .wrap { padding:32px 22px; }
  .section-head { flex-wrap:wrap; }
  .section-head h2 { flex:1 1 100%; }
}
.b-by { display:grid; grid-template-columns:48px 1fr; gap:14px; align-items:center; margin-top:auto; background:var(--mist); border-radius:16px; padding:16px 18px; }
.b-by img { width:48px; height:48px; border-radius:50%; object-fit:cover; }
.b-by p { margin:0; font-size:14px; line-height:1.5; color:var(--grey); }
.b-by b { color:var(--ink); }
.b-most .ul { margin-top:18px; }

/* questionnaire card: solid orange so it reads clearly next to the white quiz card */
.theme-fresh .cta-card.navy { background:var(--orange); color:#fff; }
.theme-fresh .cta-card.navy .label { color:var(--ink); }
.theme-fresh .cta-card.navy h3 { color:#fff; }
.theme-fresh .cta-card.navy p { color:#fff; font-size:16px; font-weight:500; }
.theme-fresh .cta-card.navy span { color:#fff; border-bottom-color:#fff; }
.theme-fresh .cta-card.navy:hover { box-shadow:0 2px 4px rgba(234,108,52,.2), 0 20px 44px rgba(234,108,52,.3); }

/* every page heading: navy panel, like the homepage hero */
.theme-fresh .page-head, .theme-fresh .article-hero, .theme-fresh .rv-head { position:relative; overflow:hidden; background:var(--ink); color:#fff; border-radius:36px; }
.theme-fresh .page-head { padding:60px 56px 64px; }
.theme-fresh .article-hero { padding:52px 56px 56px; }
.theme-fresh .rv-head { padding:52px 48px 52px 56px; margin-top:18px; }
.theme-fresh .page-head::after, .theme-fresh .article-hero::after, .theme-fresh .rv-head::after { content:""; position:absolute; right:-120px; top:-140px; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle, rgba(255,227,142,.16), transparent 65%); pointer-events:none; }
.theme-fresh .page-head > *, .theme-fresh .article-hero > *, .theme-fresh .rv-head > * { position:relative; z-index:1; }
.theme-fresh .page-head h1, .theme-fresh .article-hero h1, .theme-fresh .rv-head h1 { color:#fff; letter-spacing:-.035em; }
.theme-fresh .page-head .label, .theme-fresh .article-hero .label, .theme-fresh .rv-head .label { color:var(--yellow); }
.theme-fresh .page-head .standfirst, .theme-fresh .article-hero .standfirst, .theme-fresh .rv-head .standfirst,
.theme-fresh .page-head p, .theme-fresh .rv-head > div > p { color:var(--soft); }
.theme-fresh .page-head a:not(.btn), .theme-fresh .article-hero a:not(.btn) { color:#fff; }
.theme-fresh .page-head.split img { border-radius:24px; }
.theme-fresh .page-head .cred-chips li { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.2); color:#fff; }
.theme-fresh .page-head .reply-badge { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.2); color:#fff !important; }
.theme-fresh .article-hero .byline { border-color:rgba(255,255,255,.14); color:var(--soft); }
.theme-fresh .article-hero .byline b, .theme-fresh .article-hero .byline a { color:#fff; }
.theme-fresh .article-hero .byline .dot { color:rgba(255,255,255,.3); }
.theme-fresh .article-hero .share > span { color:var(--soft); }
.theme-fresh .article-hero .share a, .theme-fresh .article-hero .share button { background:transparent; border-color:rgba(255,255,255,.25); color:#fff; }
.theme-fresh .article-hero .share a:hover, .theme-fresh .article-hero .share button:hover { background:rgba(255,255,255,.1); border-color:#fff; }
.theme-fresh .article-hero .hero-fig img { border-radius:22px; }
@media (max-width:1100px) { .theme-fresh .rv-head, .theme-fresh .page-head, .theme-fresh .article-hero { padding:40px 32px 44px; } }
@media (max-width:820px) {
  .theme-fresh .page-head, .theme-fresh .article-hero, .theme-fresh .rv-head { border-radius:26px; padding:32px 22px 36px; }
}
.theme-fresh .rv-card { color:var(--ink); }
.theme-fresh .rv-card p, .theme-fresh .rv-card li { color:var(--ink); }
.theme-fresh .rv-card .note { color:var(--grey); }
.theme-fresh .rv-card .label { color:var(--orange); }
.theme-fresh .rv-head .prose, .theme-fresh .rv-head .prose p { color:var(--soft); }
.theme-fresh .rv-head .byline { border-color:rgba(255,255,255,.14); color:var(--soft); }
.theme-fresh .rv-head .byline b, .theme-fresh .rv-head .byline a { color:#fff; }
.theme-fresh .rv-head .byline .dot { color:rgba(255,255,255,.3); }
.theme-fresh .page-head + .calc-shell, .theme-fresh .calc-shell { margin-top:28px; }
.theme-fresh .rv-head { margin-bottom:32px; }

/* about: meet Jamie */
@font-face { font-family:'Caveat'; font-style:normal; font-weight:600; font-display:swap; src:url(/fonts/Caveat-600-normal-latin.woff2) format('woff2'); }
@font-face { font-family:'Caveat'; font-style:normal; font-weight:700; font-display:swap; src:url(/fonts/Caveat-700-normal-latin.woff2) format('woff2'); }
.hand { font-family:'Caveat', cursive; font-weight:700; }
.meet { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:72px; align-items:center; background:#fff; border-radius:36px; padding:72px 64px; box-shadow:0 1px 2px rgba(20,33,61,.04), 0 12px 32px rgba(20,33,61,.07); }
.meet-photo { position:relative; padding-top:64px; }
.meet-photo .hi { position:absolute; top:0; left:-6px; margin:0; font-size:48px; line-height:1; color:var(--orange); transform:rotate(-5deg); white-space:nowrap; }
.hand-arrow { position:absolute; top:22px; left:250px; width:84px; height:64px; fill:none; stroke:var(--orange); stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; z-index:2; }
.hand-arrow path { stroke-dasharray:160; stroke-dashoffset:160; transition:stroke-dashoffset 1s cubic-bezier(.3,.6,.2,1); }
.hand-arrow path + path { transition-delay:.9s; transition-duration:.35s; }
.hand-arrow.in path { stroke-dashoffset:0; }
.meet-photo figure { margin:0; background:#fff; padding:12px 12px 14px; border-radius:22px; transform:rotate(-2.5deg); box-shadow:0 24px 50px rgba(20,33,61,.16); }
.meet-photo figure img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:14px; display:block; }
.meet-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }
.meet-links a { text-decoration:none; font-weight:600; font-size:14px; padding:9px 16px; border-radius:999px; background:var(--mist); color:var(--ink); transition:background .2s; }
.meet-links a:hover { background:var(--pale); }
.meet-text h2 { font-size:38px; line-height:1.12; letter-spacing:-.03em; margin:12px 0 22px; }
.meet-text .prose p { font-size:17px; }
.sign { display:flex; align-items:center; gap:22px; margin-top:28px; padding-top:24px; border-top:1px solid var(--rule); }
.sign .hand { font-size:64px; line-height:.9; color:var(--ink); transform:rotate(-4deg); }
.sign small { font-size:14px; line-height:1.5; color:var(--grey); max-width:380px; }
.sign b { display:block; color:var(--ink); font-size:15px; }
@media (max-width:1100px) { .meet { grid-template-columns:1fr; gap:44px; padding:48px 36px; } .meet-photo { max-width:440px; } }
@media (max-width:820px) {
  .meet { padding:32px 22px 36px; border-radius:26px; }
  .meet-photo .hi { font-size:40px; }
  .hand-arrow { left:210px; width:70px; }
  .meet-text h2 { font-size:28px; }
  .meet-photo figure img { aspect-ratio:1/1; }
  .sign { flex-direction:column; align-items:flex-start; gap:8px; }
}
@media (max-width:820px) {
  .theme-fresh .site-head .head-row { margin:0 var(--gutter); }
  .theme-fresh .news .wrap { margin:0 var(--gutter) 20px; }
}
@media (max-width:820px) {
  .theme-fresh .menu .menu-toggle { border-radius:999px; padding:10px 16px; }
  .theme-fresh .menu ul { left:var(--gutter); right:var(--gutter); top:calc(100% + 10px); background:#fff; border:0; border-radius:24px; padding:10px 22px 22px; box-shadow:0 24px 50px rgba(20,33,61,.18); }
  .theme-fresh .menu a, .theme-fresh .menu button { border-radius:0; padding:15px 2px; font-size:16px; }
  .theme-fresh .menu > ul > li:first-child > a, .theme-fresh .menu > ul > li:first-child > button { border-top:0; }
  .theme-fresh .menu a:hover, .theme-fresh .menu button:hover { background:none; color:var(--orange); }
  .theme-fresh .menu a[aria-current] { background:none; color:var(--orange); }
  .theme-fresh .menu .drop { padding:0 0 6px 14px; }
  .theme-fresh .menu .drop a { padding:9px 2px; font-size:15px; color:var(--grey); }
  .theme-fresh .menu .last a { border-radius:999px; padding:15px 20px; margin-top:14px; color:#fff; }
  .theme-fresh .menu .last a:hover { color:#fff; }
}

/* small orange text on light backgrounds uses a deeper orange so it meets WCAG AA contrast (4.5:1) */
.theme-fresh { --orange-ink:#BE4814; }
.theme-fresh .label.o, .theme-fresh .lead .label, .theme-fresh .article-head .label, .theme-fresh .post .label, .theme-fresh .pick .label,
.theme-fresh .prose h2 .sec-no, .theme-fresh .mid-cta .label, .theme-fresh .cta-card .label, .theme-fresh .rv-card .label, .theme-fresh .fc-head .label,
.theme-fresh .side-toc a.active span, .theme-fresh .toc-mobile a span, .theme-fresh .author-box .label { color:var(--orange-ink); }
.theme-fresh .page-head .label, .theme-fresh .article-hero .label, .theme-fresh .rv-head .label, .theme-fresh .b-rev .label, .theme-fresh .criteria-band .label, .theme-fresh .mission .label { color:var(--yellow); }
.theme-fresh .cta-card.navy .label { color:var(--ink); }

/* homepage: the best pensions, rated */
.f-best { margin-top:84px; }
.f-best .section-head { align-items:flex-end; margin-bottom:10px; }
.f-best .section-head h2 { margin-top:8px; }
.f-count { color:var(--grey); font-size:15px; margin:0 0 26px; }
.f-best .pick { text-decoration:none; color:var(--ink); transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.f-best .pick:hover { transform:translateY(-4px); }
.f-best .pick .ul { margin-top:auto; align-self:flex-start; }

/* ---------- tablets: keep cards side by side instead of one huge card per row ---------- */
@media (min-width:901px) and (max-width:1100px) {
  .f-hero { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:32px; padding:44px 36px; }
  .f-hero h1 { font-size:54px; }
  .b-tool { grid-column:span 4; }
  .b-lead img { aspect-ratio:2/1; }
}
@media (min-width:601px) and (max-width:900px) {
  .f-hero-art > img { aspect-ratio:16/9; }
  .b-tool { grid-column:span 4; }
  .b-fact { grid-column:span 6; }
}
@media (min-width:601px) and (max-width:820px) {
  .tools, .podium { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
  .contacts { grid-template-columns:1fr; gap:20px; }
  .contact { flex-direction:row; }
  .contact > img { width:38%; aspect-ratio:auto; min-height:100%; flex:none; }
  .grid3, .grid2, .keys, .cb-grid, .quick { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  .tools h3, .contacts h3 { font-size:18px; }
  .tool p, .contacts p { font-size:14px; }
  .pick { padding:20px; } .pick h3 { font-size:21px; }
  .page-head.split img { aspect-ratio:16/9; }
  .b-lead img { aspect-ratio:2/1; }
}
@media (min-width:821px) and (max-width:1180px) {
  .news .wrap { grid-template-columns:1fr; gap:22px; }
  .news .signup { display:grid; grid-template-columns:1fr 1.3fr auto; gap:14px; align-items:end; }
  .news .signup .nl-f input { width:100%; }
}
@media (min-width:901px) and (max-width:1100px) {
  .page-head.split { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:36px; }
  .meet { grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:44px; padding:48px 40px; align-items:start; }
}
