/* The live reference homepage overrides the stylesheet accent in a style tag. */
:root{--accent:#0e6b63;--soft:#dcefec}
.logo{color:var(--ink);text-decoration:none}
.main-nav > a{display:inline-flex;align-items:center;padding:20px 10px;color:var(--muted)}
.main-nav > a:hover{color:var(--accent)}
.logo-box.dark,.rank-logo.dark{background:#0e1320;border:1px solid #0e1320}
.rank-logo.dark img{object-fit:contain;padding:5px 7px}
figure.fig{margin:0 0 16px}
figure.fig figcaption{font:600 12.5px/1.45 'Hanken Grotesk',sans-serif;color:var(--faint);margin-top:8px}
.shot.plate{background:#0e1320}
.shot.plate img,.reco-card .shot.fit img{object-fit:contain;object-position:center;background:transparent}
.shot.mid img{object-position:center}
.shot.mark{background:#fff;aspect-ratio:1/1}
.shot.mark img{object-fit:contain;object-position:center;background:#fff;padding:14px;box-sizing:border-box;min-height:0}
figure.fig .shot.mark{height:340px;width:min(100%,560px);aspect-ratio:auto;margin-left:auto;margin-right:auto}
.shot.store{aspect-ratio:16/11}
.shot.store img{min-height:0;height:100%;object-fit:cover;object-position:center 70%}
.shot.photo img{object-fit:cover;object-position:center}
.shot.bank img{object-fit:cover;object-position:center 78%}
a.reco-card{color:inherit;text-decoration:none}
a.reco-card:hover{border-color:var(--accent)}
.reco-card .ttl{font-family:'Archivo',sans-serif;font-weight:800;font-size:16px}
.reco-card p{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
.notebox p{font-size:14px;line-height:1.55;color:var(--muted);margin:0}
.ed .methodo h2{color:#fff}
.ed .methodo .eyebrow{color:#9fe3bd}
.ed .methodo-grid p{margin:0;font-size:13px;line-height:1.55;color:#aeb8d6}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}
.chips .chip{font:700 12px 'Archivo',sans-serif;letter-spacing:.02em;text-transform:none;padding:6px 10px}
.methodo-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.faq-list{margin-top:12px}
.reco-grid{grid-template-columns:repeat(3,1fr)}
.shot.wide{aspect-ratio:960/420;background:#e7f3ee}
.shot.wide img,.shot.fit img{object-fit:contain;object-position:center;background:transparent}
.h1,.eyebrow,.meta-line{overflow-wrap:anywhere}
.tabs{flex-wrap:wrap;width:auto;max-width:100%}
.rank-logo img,.hcard .logo-box img{box-sizing:border-box;object-fit:contain}
.logo-box.dark img,.rank-logo.dark img{object-fit:contain}
@media(max-width:900px){
  .rank-bonus .btn,.hcard .cta .btn{width:100%}
  .methodo-grid.cols-3{grid-template-columns:1fr}
  .reco-grid{grid-template-columns:1fr}
  .h1{font-size:22px;line-height:1.15;max-width:100%}
  .lead,.eyebrow,.meta-line{max-width:100%}
  .eyebrow,.meta-line{letter-spacing:.04em}
  .container,.container-narrow,.site-header .inner{max-width:100vw}
  .nav-toggle{display:grid !important;place-items:center;position:fixed;top:14px;right:10px;z-index:80;background:#fff}
  body.nav-open .main-nav .submenu{display:flex;position:static;box-shadow:none;border:none;padding:0 0 8px 12px}
}
