/* Homepage tiles, scoped to .apft. Brand Guidelines 2024: Orange #db5d28, Deep Blue #05223D, Muted Blue #576271. */
.apft{--apft-fg:#05223d;--apft-muted:#576271;--apft-accent:#db5d28;--apft-line:#dde2e8;color:var(--apft-fg);font-family:"Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;text-align:left;box-sizing:border-box;container-type:inline-size}
.apft *,.apft *::before,.apft *::after{box-sizing:border-box}
.apft .apft__heading{font-family:"adelle-sans","Adelle Sans","Roboto",sans-serif;font-size:clamp(24px,3.5vw,34px)!important;font-weight:400!important;line-height:1.2;margin:0 0 8px;color:var(--apft-fg)}
.apft p.apft__intro{margin:0 0 20px;padding:0;font-size:16px;line-height:1.5;color:var(--apft-muted)}
.apft__cols{display:grid;grid-template-columns:repeat(var(--apft-cols,3),minmax(0,1fr));gap:16px}
@container (max-width:600px){.apft__cols{grid-template-columns:1fr}}
@media (max-width:600px){.apft__cols{grid-template-columns:1fr}}
.apft .apft__group{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--apft-muted);margin:0 0 10px;line-height:1.3}
.apft a.apft__tile{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--apft-line);border-radius:8px;padding:12px 14px;margin:0 0 10px;color:var(--apft-fg);text-decoration:none;font-size:15px;line-height:1.35;box-shadow:none;transition:border-color .15s}
.apft a.apft__tile:hover,.apft a.apft__tile:focus-visible{border-color:var(--apft-accent);color:var(--apft-fg)}
.apft a.apft__tile:focus-visible{outline:2px solid var(--apft-accent);outline-offset:2px}
.apft__icon{flex:none;width:36px;height:36px;border-radius:6px;background:#fbefe9;color:var(--apft-accent);display:flex;align-items:center;justify-content:center}
.apft__icon svg{width:20px;height:20px;display:block}
.apft__text{flex:1;min-width:0}
.apft__go{flex:none;color:var(--apft-accent);display:flex;transition:transform .15s}
.apft__go svg{width:18px;height:18px}
.apft a.apft__tile:hover .apft__go{transform:translateX(3px)}
.apft__cta-wrap{margin:10px 0 14px}
.apft--center .apft__cta-wrap{text-align:center}
.apft a.apft__tile--cta{display:inline-flex;max-width:100%;background:var(--apft-fg);border-color:var(--apft-fg);color:#fff;margin:0;padding:12px 20px 12px 12px;font-size:16px;font-weight:500}
.apft a.apft__tile--cta .apft__text{flex:0 1 auto}
.apft a.apft__tile--cta .apft__go{margin-left:4px}
.apft a.apft__tile--cta:hover,.apft a.apft__tile--cta:focus-visible{background:#0b2e4f;border-color:#0b2e4f;color:#fff}
.apft a.apft__tile--cta .apft__icon{background:var(--apft-accent);color:#fff}
.apft a.apft__tile--cta .apft__go{color:#fff}
.apft p.apft__ta{margin:0;padding:0;font-size:15px;color:var(--apft-fg)}
.apft p.apft__ta a{color:var(--apft-accent);text-decoration:underline}
@media (prefers-reduced-motion:reduce){.apft *{transition:none!important}}

.apft--center .apft__heading,.apft--center p.apft__intro,.apft--center p.apft__ta{text-align:center}
/* Dark sections (e.g. #022c3f): white tiles stay as they are; text around them goes light,
   and the Finder button turns orange so it stands out from the background. */
.apft--dark{--apft-on-dark:#ffffff;--apft-on-dark-muted:#c5d0da;--apft-on-dark-label:#a9b8c6;--apft-link-on-dark:#f07a45}
.apft--dark .apft__heading{color:var(--apft-on-dark)}
.apft--dark p.apft__intro{color:var(--apft-on-dark)}
.apft--dark .apft__group{color:var(--apft-on-dark-label)}
.apft--dark a.apft__tile{border-color:transparent}
.apft--dark a.apft__tile:hover,.apft--dark a.apft__tile:focus-visible{border-color:var(--apft-accent)}
.apft--dark a.apft__tile:focus-visible{outline-color:#fff}
.apft--dark a.apft__tile--cta{background:var(--apft-accent);border-color:var(--apft-accent);color:#fff;font-size:18px;font-weight:700}
.apft--dark a.apft__tile--cta:hover,.apft--dark a.apft__tile--cta:focus-visible{background:#c2501f;border-color:#c2501f;color:#fff}
.apft--dark a.apft__tile--cta .apft__icon{background:var(--apft-fg);color:#fff}
.apft--dark p.apft__ta{color:var(--apft-on-dark-muted)}
.apft--dark p.apft__ta a{color:var(--apft-link-on-dark)}
.apft--dark p.apft__ta a:hover{color:#fff}