/* ============================================================
   AllAroundSTL — Review redesign (June 2026)
   Magazine-overlay hero · Lobster Two / Roboto / Newsreader
   Loaded only on review pages (via head_scripts) so its global
   resets don't leak into other page types.
   ============================================================ */
:root{
  --brick:#941800; --brick-deep:#6f1200; --brick-tint:#fbeeea;
  --teal:#1e526b; --teal-soft:#e7eef1; --gold:#f0b429;
  --cream:#f9f6f0; --paper:#fffdfa; --ink:#241c18; --ink-soft:#5c5048;
  --ink-faint:#8c8178; --line:#e7ded4; --line-strong:#d9cdbf;
  --shadow-sm:0 1px 3px rgba(60,40,30,.08), 0 1px 2px rgba(60,40,30,.06);
  --shadow-md:0 6px 22px rgba(70,45,30,.10), 0 2px 6px rgba(70,45,30,.06);
  --shadow-lg:0 20px 50px rgba(60,35,20,.18);
  --r-sm:10px; --r-md:16px; --r-lg:24px; --measure:42rem;
}

/* This file is linked ONLY on review pages (via the template's head_scripts
   block) and loads after Bootstrap + style.css, so these globals win here and
   never reach other page types. */
body{margin:0;font-family:"Roboto",system-ui,sans-serif;color:var(--ink);
  background:var(--paper);font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body img{display:block;max-width:100%;}
.review2026 a{color:var(--brick);text-decoration:none;}
.review2026 a:hover{text-decoration:underline;}
.review2026 *{box-sizing:border-box;}

.wrap{max-width:1160px;margin:0 auto;padding:0 24px;}
.lobster{font-family:"Lobster Two",cursive;font-weight:700;}

/* ---------- Masthead ---------- */
.masthead{position:sticky;top:0;z-index:60;background:rgba(255,253,250,.92);
  backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line);}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;}
.masthead .brand{font-family:"Lobster Two",cursive;font-weight:700;font-size:30px;color:var(--brick);letter-spacing:.2px;}
.masthead .brand:hover{text-decoration:none;}
.mnav{display:flex;gap:28px;align-items:center;}
.mnav a{color:var(--ink-soft);font-size:15px;font-weight:500;letter-spacing:.2px;}
.mnav a:hover{color:var(--brick);text-decoration:none;}
.mnav .sub{color:var(--ink-faint);}
/* dropdowns (CSS hover/focus — no Bootstrap JS) */
.mdrop{position:relative;}
.mdrop > a{display:inline-flex;align-items:center;gap:5px;padding:20px 0;}
.mcaret{font-style:normal;font-size:10px;color:var(--ink-faint);transition:transform .15s;}
.mmenu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);
  min-width:230px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--shadow-md);padding:8px;opacity:0;visibility:hidden;transition:opacity .15s,transform .15s;z-index:70;}
.mdrop:hover .mmenu,.mdrop:focus-within .mmenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.mdrop:hover .mcaret,.mdrop:focus-within .mcaret{transform:rotate(180deg);}
.mmenu a{display:block;padding:9px 12px;border-radius:9px;font-size:14.5px;color:var(--ink-soft);white-space:nowrap;}
.mmenu a:hover{background:var(--cream);color:var(--brick);text-decoration:none;}
/* hamburger toggle — hidden on desktop, shown on mobile */
.navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;
  width:42px;height:42px;padding:9px;border:0;background:transparent;cursor:pointer;}
.navtoggle span{display:block;height:2px;width:100%;background:var(--ink-soft);border-radius:2px;
  transition:transform .2s,opacity .2s;}
.masthead.nav-open .navtoggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.masthead.nav-open .navtoggle span:nth-child(2){opacity:0;}
.masthead.nav-open .navtoggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
/* mobile + tablet: hamburger opens a full-width drawer with submenus expanded inline */
@media(max-width:1024px){
  .navtoggle{display:flex;}
  .mnav{position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--paper);border-bottom:1px solid var(--line);box-shadow:var(--shadow-md);
    padding:8px 0;max-height:calc(100vh - 64px);overflow-y:auto;display:none;}
  .masthead.nav-open .mnav{display:flex;}
  .mdrop{width:100%;}
  .mdrop > a{padding:12px 22px;font-size:16px;font-weight:600;}
  .mcaret{display:none;}
  .mmenu{position:static;opacity:1;visibility:visible;transform:none;min-width:0;
    background:transparent;border:0;box-shadow:none;padding:0 0 6px;}
  .mmenu a{padding:8px 34px;font-size:14.5px;}
}

/* ---------- Breadcrumb ---------- */
.crumbs{font-size:13px;color:var(--ink-faint);padding:14px 0 0;letter-spacing:.3px;}
.crumbs a{color:var(--ink-faint);}
.crumbs a:hover{color:var(--brick);}
.crumbs span{margin:0 8px;opacity:.5;}

/* ---------- Feature hero (magazine overlay) ---------- */
.feature{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);
  margin:18px 0 0;height:clamp(380px,56vh,560px);}
.feature > img{width:100%;height:100%;object-fit:cover;display:block;}
.feature .veil{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,12,8,.05) 0%,rgba(20,12,8,.15) 42%,rgba(20,12,8,.82) 100%);}
.feature .fcap{position:absolute;left:0;right:0;bottom:0;padding:30px 34px;color:#fff;}
.feature h1{font-family:"Lobster Two",cursive;font-weight:700;color:#fff;
  font-size:clamp(2.8rem,6vw,4.8rem);line-height:1;margin:0 0 .06em;text-shadow:0 2px 18px rgba(0,0,0,.45);}
.feature .subhead{font-family:"Newsreader",Georgia,serif;font-style:italic;color:rgba(255,255,255,.92);
  font-size:clamp(1.1rem,2.2vw,1.5rem);max-width:44ch;margin:0 0 14px;text-shadow:0 1px 10px rgba(0,0,0,.5);line-height:1.3;}
.feature .byline{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14.5px;color:rgba(255,255,255,.88);}
.feature .byline .avatar{width:36px;height:36px;border-radius:50%;background:#fff;color:var(--brick);
  display:grid;place-items:center;font-weight:700;font-family:"Lobster Two",cursive;font-size:19px;flex:none;}
.feature .byline b{color:#fff;font-weight:600;}
.feature .byline .dot{color:rgba(255,255,255,.55);}
.feature .byline a{color:#ffd9a8;font-weight:600;}
.feature .gcount{position:absolute;top:18px;right:18px;background:rgba(36,28,24,.72);color:#fff;
  font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;backdrop-filter:blur(4px);}
@media(max-width:560px){.feature .fcap{padding:22px 20px;}}

/* floating score chip (top-left over the image) */
.score-chip{position:absolute;top:18px;left:18px;display:flex;align-items:center;gap:12px;
  background:rgba(255,253,250,.94);backdrop-filter:blur(8px);border-radius:999px;
  padding:8px 18px 8px 8px;box-shadow:var(--shadow-md);}
.score-chip .ring{position:relative;width:54px;height:54px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:radial-gradient(circle at 50% 38%, #fff 54%, transparent 55%),
   conic-gradient(var(--brick) calc(var(--pct)*1%), #ecdfd6 0);}
.score-chip .ring .num{font-family:"Lobster Two",cursive;font-size:21px;color:var(--brick);line-height:1;}
.score-chip .meta .lbl{font-size:10.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--brick);}
.score-chip .meta .row{display:flex;align-items:center;gap:6px;margin-top:3px;margin-left:0px;}
.score-chip .meta .stars{--star-size:9px;margin-left:-0.9em;}
.score-chip .meta .stars::before{letter-spacing:1px;}
.score-chip .meta .stars-num{font-size:11px;}

/* ---------- Thumbnail strip ---------- */
.thumbs{display:flex;gap:8px;overflow-x:auto;margin:10px 0 0;scrollbar-width:none;scroll-snap-type:x proximity;}
.thumbs::-webkit-scrollbar{display:none;}
.thumbs img{height:92px;width:128px;object-fit:cover;border-radius:10px;flex:none;cursor:pointer;
  box-shadow:var(--shadow-sm);transition:transform .15s,filter .15s;scroll-snap-align:start;}
.thumbs img:hover{transform:translateY(-2px);filter:brightness(1.05);}
.thumbs .more{height:92px;min-width:128px;flex:none;border-radius:10px;background:var(--cream);border:1px solid var(--line);
  display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--ink-soft);cursor:pointer;text-align:center;padding:0 10px;}
.thumbs .more:hover{background:#f1e8db;text-decoration:none;}

/* ---------- "Everyone else" + map row ---------- */
.below{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0;}
.others-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-sm);padding:16px 20px;}
.others-card .t{font-size:11px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink-faint);margin-bottom:12px;}
.agg-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.agg{min-width:0;background:var(--cream);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:12px 13px;display:flex;flex-direction:column;gap:3px;}
.agg .src{font-size:11.5px;font-weight:700;color:var(--ink-soft);display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.agg .swatch{width:9px;height:9px;border-radius:50%;}
.agg .val{font-size:23px;font-weight:800;color:var(--ink);font-family:"Roboto",sans-serif;line-height:1;}
.agg .val small{font-size:13px;color:var(--ink-faint);font-weight:600;}
.agg .cnt{font-size:11.5px;color:var(--ink-faint);}
.agg{transition:transform .15s,border-color .15s,box-shadow .15s;}
.review2026 a.agg{color:inherit;text-decoration:none;}
.review2026 a.agg:hover{border-color:var(--brick);box-shadow:var(--shadow-sm);transform:translateY(-2px);text-decoration:none;}
.open-status{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:13px;font-weight:700;padding:6px 12px;border-radius:999px;}
.open-status.is-open{color:#1c7a4a;background:#e7f5ec;}
.open-status.is-closed{color:#b13b2e;background:#fbeeea;}
.open-status .pulse{width:8px;height:8px;border-radius:50%;background:#1fae5e;box-shadow:0 0 0 0 rgba(31,174,94,.5);animation:pulse 2s infinite;}
.mapcard{border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line);min-height:200px;display:flex;}
.mapcard iframe{width:100%;height:100%;border:0;min-height:200px;}
@media(max-width:820px){.below{grid-template-columns:1fr;}}

/* stars component */
.stars{--star-size:18px;display:inline-block;font-size:var(--star-size);line-height:1;font-family:Times,serif;position:relative;}
.stars::before{content:'★★★★★';letter-spacing:2px;
  background:linear-gradient(90deg,var(--gold) calc(var(--rating)/5*100%), #e3d8cc calc(var(--rating)/5*100%));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.stars-num{font-size:13px;color:var(--ink-faint);font-weight:600;}

/* ---------- Layout: article + aside ----------
   The aside column stretches to the article's height; the Details card sits at
   the top and scrolls away, while only .secnav is sticky and travels alongside
   the article. */
.body-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;align-items:stretch;margin:34px 0 10px;}
.aside{display:flex;flex-direction:column;gap:18px;}
@media(max-width:980px){
  .body-grid{display:flex;flex-direction:column;gap:26px;}
  .aside{order:-1;gap:0;}          /* contact/hours surface above the article on mobile */
  .secnav{display:none;}            /* jump-nav hidden on mobile — sections are short */
}

/* ---------- Takeaway box ---------- */
.takeaway{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:26px 28px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;margin-top:6px;}
.takeaway::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--brick);}
.takeaway .kicker{font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--brick);margin-bottom:8px;}
.takeaway h2{font-family:"Lobster Two",cursive;font-weight:700;color:var(--ink);font-size:30px;margin:0 0 10px;}
.takeaway p{font-family:"Newsreader",serif;font-size:19px;line-height:1.55;color:var(--ink-soft);margin:0 0 14px;}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.fact{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:7px 14px;font-size:13.5px;font-weight:600;color:var(--ink-soft);}
.fact b{color:var(--ink);}
.fact .ic{color:var(--brick);font-style:normal;}
.review2026 a.fact{transition:background .15s,border-color .15s,transform .15s;}
.review2026 a.fact:hover{background:var(--brick-tint);border-color:var(--brick);text-decoration:none;transform:translateY(-1px);}

/* ---------- Section nav (sticky) ---------- */
.secnav{position:sticky;top:88px;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-sm);padding:8px;}
.secnav .t{font-size:11px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink-faint);padding:8px 12px 6px;}
.secnav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;color:var(--ink-soft);
  font-size:14.5px;font-weight:600;transition:background .15s,color .15s;}
.secnav a:hover{background:var(--cream);text-decoration:none;color:var(--ink);}
.secnav a.active{background:var(--brick-tint);color:var(--brick);}
.secnav a .n{width:22px;height:22px;border-radius:6px;background:var(--cream);display:grid;place-items:center;
  font-size:12px;font-weight:800;color:var(--ink-faint);flex:none;}
.secnav a.active .n{background:var(--brick);color:#fff;}

/* ---------- Details + Hours card ---------- */
.infocard{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-sm);overflow:hidden;}
.infocard h3{font-family:"Roboto";font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--ink-faint);
  margin:0;padding:16px 20px 0;font-weight:800;}
.infocard .place{font-family:"Lobster Two",cursive;font-size:22px;color:var(--ink);padding:2px 20px 0;}
.infocard address{font-style:normal;color:var(--ink-soft);font-size:14.5px;padding:6px 20px 0;line-height:1.5;}
.links{display:flex;flex-wrap:wrap;gap:8px;padding:14px 20px;}
.links a{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--teal);
  background:var(--teal-soft);padding:7px 12px;border-radius:9px;}
.links a:hover{text-decoration:none;background:#dbe6ea;}
.hours{padding:6px 20px 18px;}
.hrow{display:flex;justify-content:space-between;padding:7px 0;font-size:14.5px;border-bottom:1px dashed var(--line);}
.hrow:last-child{border-bottom:none;}
.hrow .day{color:var(--ink-soft);}
.hrow .hh{color:var(--ink);font-weight:600;}
.open-now{display:inline-flex;align-items:center;gap:7px;margin:0 20px 16px;font-size:13px;font-weight:700;
  color:#1c7a4a;background:#e7f5ec;padding:6px 12px;border-radius:999px;}
.open-now .pulse{width:8px;height:8px;border-radius:50%;background:#1fae5e;box-shadow:0 0 0 0 rgba(31,174,94,.5);animation:pulse 2s infinite;}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(31,174,94,0);}100%{box-shadow:0 0 0 0 rgba(31,174,94,0);}}
.review2026 a.write-cta{display:block;text-align:center;margin:0 20px 18px;background:var(--brick);color:#fff;font-weight:700;
  font-size:14.5px;padding:12px;border-radius:10px;transition:background .15s;}
.review2026 a.write-cta:hover{background:var(--brick-deep);text-decoration:none;color:#fff;}

/* ---------- Article ---------- */
.article{max-width:var(--measure);}
.article section{scroll-margin-top:84px;}
.article h2{font-family:"Lobster Two",cursive;font-weight:700;color:var(--brick);
  font-size:clamp(1.9rem,3.6vw,2.6rem);line-height:1.08;margin:8px 0 4px;}
.sec-kicker{display:flex;align-items:center;gap:12px;margin-top:44px;}
.sec-kicker .n{font-family:"Roboto";font-weight:800;font-size:13px;letter-spacing:1.5px;
  color:var(--brick);background:var(--brick-tint);padding:5px 10px;border-radius:7px;}
.sec-kicker .rule{flex:1;height:1px;background:var(--line);}
.article h3{font-family:"Roboto";font-weight:800;font-size:1.25rem;color:var(--ink);margin:30px 0 2px;letter-spacing:.2px;}
.article p{font-family:"Newsreader",Georgia,serif;font-size:1.28rem;line-height:1.72;color:#352b25;margin:1.05rem 0;}
/* dropcap on the first paragraph of each numbered section */
.article section > p:first-of-type::first-letter{font-family:"Lobster Two",cursive;float:left;font-size:4.6rem;line-height:.78;
  color:var(--brick);padding:6px 12px 0 0;}
.article img{width:100%;border-radius:var(--r-md);box-shadow:var(--shadow-sm);margin:22px 0;cursor:zoom-in;transition:transform .25s,box-shadow .25s;}
.article a img{margin:22px 0;}
.article img:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.article iframe{width:100%;border:0;border-radius:var(--r-md);box-shadow:var(--shadow-sm);margin:22px 0;min-height:320px;}
figure{margin:30px 0;}
figure img{width:100%;border-radius:var(--r-md);box-shadow:var(--shadow-sm);cursor:zoom-in;}
figcaption{font-family:"Roboto";font-size:13px;color:var(--ink-faint);text-align:center;margin-top:10px;letter-spacing:.2px;}

.pullquote{font-family:"Lobster Two",cursive;font-weight:700;color:var(--brick);
  font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.12;text-align:center;
  margin:40px auto;max-width:18ch;position:relative;}
.pullquote::before,.pullquote::after{content:"";display:block;width:48px;height:3px;background:var(--gold);margin:18px auto;}

/* ---------- Comparison table (pizza/sandwich) ---------- */
.cmp{margin-top:30px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm);}
.cmp table{width:100%;border-collapse:collapse;font-size:14px;}
.cmp th{background:var(--cream);text-align:left;padding:12px 14px;font-weight:800;color:var(--ink-soft);font-size:12px;letter-spacing:.5px;text-transform:uppercase;}
.cmp td{padding:12px 14px;border-top:1px solid var(--line);color:var(--ink-soft);}
.cmp tr.me td{background:var(--brick-tint);color:var(--ink);font-weight:600;}
.cmp td:first-child{font-weight:600;color:var(--ink);}

/* ---------- Featured comparison (pizza/sandwich) — promoted under the takeaway ---------- */
.cmp-feature{margin:30px 0 8px;border:2px solid var(--brick);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--shadow-md);background:#fff;scroll-margin-top:84px;}
.cmp-feature .cmp-head{background:var(--brick);color:#fff;padding:18px 24px 20px;}
.cmp-feature .cmp-head .kicker{font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  color:rgba(255,255,255,.82);margin-bottom:7px;}
.cmp-feature .cmp-head h2{font-family:"Lobster Two",cursive;font-weight:700;color:#fff;
  font-size:clamp(1.6rem,3.2vw,2rem);line-height:1.05;margin:0;}
.cmp-feature .cmp-sub{font-family:"Newsreader",serif;font-size:15.5px;line-height:1.45;
  color:rgba(255,255,255,.9);margin:8px 0 0;max-width:60ch;}
.cmp-feature .cmp{margin:0;border:0;border-radius:0;box-shadow:none;overflow-x:auto;}
.cmp-feature .cmp table{min-width:560px;}
/* keep the place name pinned while the rest of the row scrolls horizontally */
.cmp-feature .cmp th:first-child,
.cmp-feature .cmp td:first-child{position:sticky;left:0;z-index:1;border-right:1px solid var(--line);}
.cmp-feature .cmp th:first-child{background:var(--cream);z-index:2;}
.cmp-feature .cmp td:first-child{background:#fff;}
.cmp-feature tr.me td{background:var(--brick-tint);color:var(--ink);font-weight:700;}
.cmp-feature tr.me td:first-child{background:var(--brick-tint);box-shadow:inset 4px 0 0 var(--brick);}
.cmp-feature .here{display:block;font-family:"Roboto";font-size:10px;font-weight:800;letter-spacing:.6px;
  text-transform:uppercase;color:var(--brick);margin-bottom:2px;}
@media (max-width:720px){
  .cmp-feature .cmp-head{padding:16px 18px 18px;}
}

/* ---------- Reviews ---------- */
.reviews{max-width:var(--measure);margin-top:54px;}
.review-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px;margin-bottom:14px;box-shadow:var(--shadow-sm);}
.review-card .rh{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:10px;}
.review-card .who{display:flex;align-items:center;gap:10px;}
.review-card .av{width:34px;height:34px;border-radius:50%;background:var(--teal-soft);color:var(--teal);
  display:grid;place-items:center;font-weight:700;font-family:"Lobster Two",cursive;}
.review-card .nm{font-weight:700;font-size:14.5px;color:var(--ink);}
.review-card .tm{font-size:12px;color:var(--ink-faint);}
.review-card .bd{font-family:"Newsreader",serif;font-size:17px;line-height:1.55;color:#3a302a;}
.review-card .vote-btn{background:none;border:none;cursor:pointer;color:var(--ink-faint);font-size:13px;font-weight:600;padding:4px 8px;border-radius:7px;}
.review-card .vote-btn:hover{background:var(--cream);color:var(--ink);}
.review-card .voted-up{color:var(--good,#1c7a4a);}
.review-card .voted-down{color:var(--bad,#b13b2e);}
.review-form{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-md);padding:22px;margin-top:8px;}
.review-form h3{margin:0 0 14px;font-family:"Lobster Two",cursive;color:var(--ink);font-size:24px;}
.review-form label{display:block;font-size:13px;font-weight:700;color:var(--ink-soft);margin:10px 0 6px;}
.review-form input,.review-form textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px 13px;
  font-family:"Roboto";font-size:15px;background:#fff;color:var(--ink);}
.review-form input:focus,.review-form textarea:focus{outline:none;border-color:var(--brick);box-shadow:0 0 0 3px var(--brick-tint);}
.stars-pick{display:flex;gap:4px;font-size:28px;color:#e3d8cc;cursor:pointer;}
.stars-pick span:hover,.stars-pick span.on{color:var(--gold);}
.review-form button{margin-top:16px;background:var(--brick);color:#fff;border:none;font-weight:700;font-size:15px;
  padding:12px 22px;border-radius:10px;cursor:pointer;transition:background .15s;}
.review-form button:hover{background:var(--brick-deep);}
#comment-message{font-size:14px;margin-top:10px;}
#comment-message.success{color:var(--good,#1c7a4a);}
#comment-message.error{color:var(--bad,#b13b2e);}

/* ---------- Related ---------- */
.related{margin-top:60px;}
.related h2{font-family:"Lobster Two",cursive;color:var(--brick);font-size:2.2rem;text-align:center;margin-bottom:26px;}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.rel{border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm);background:#fff;border:1px solid var(--line);transition:transform .2s,box-shadow .2s;}
.rel:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);text-decoration:none;}
.rel img{width:100%;height:190px;object-fit:cover;}
.rel .rc{padding:14px 16px 18px;}
.rel .rt{font-family:"Lobster Two",cursive;font-size:20px;color:var(--brick);line-height:1.1;}
.rel .rs{font-family:"Newsreader",serif;font-style:italic;color:var(--ink-soft);font-size:15px;margin-top:3px;}
@media(max-width:820px){.rel-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.rel-grid{grid-template-columns:1fr;}}

/* ---------- Newsletter ---------- */
.news{background:var(--teal);color:#fff;margin-top:64px;}
.news .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center;padding:46px 24px;}
.news h2{font-family:"Lobster Two",cursive;font-size:2.1rem;margin:0 0 6px;color:#fff;}
.news h2 .em{color:#ffd9a8;}
.news p{margin:0;color:rgba(255,255,255,.85);font-size:16px;}
.news .nform{display:flex;gap:10px;}
.news input{flex:1;border:none;border-radius:10px;padding:14px 16px;font-size:15px;font-family:"Roboto";}
.news .nform button{background:var(--brick);color:#fff;border:none;border-radius:10px;padding:0 22px;font-weight:700;cursor:pointer;}
.news .nform button:hover{background:var(--brick-deep);}
@media(max-width:720px){.news .wrap{grid-template-columns:1fr;}}

/* ---------- Footer ---------- */
.foot{background:var(--cream);color:var(--ink);padding:46px 0 30px;border-top:1px solid var(--line);}
.foot .wrap{display:grid;grid-template-columns:2fr 1fr;gap:40px;}
.foot h4{font-family:"Lobster Two",cursive;color:var(--brick);font-size:24px;margin:0 0 10px;}
.foot p{color:var(--ink-soft);font-size:15px;line-height:1.6;margin:0 0 10px;max-width:50ch;}
.foot ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.foot ul a{color:var(--ink-soft);font-size:15px;}
.foot .copy{text-align:center;color:var(--ink-faint);font-size:13px;margin-top:30px;padding-top:20px;border-top:1px solid var(--line);}
@media(max-width:680px){.foot .wrap{grid-template-columns:1fr;}}

/* ---------- Lightbox ---------- */
.lb{position:fixed;inset:0;background:rgba(20,12,8,.9);backdrop-filter:blur(6px);z-index:200;
  display:none;align-items:center;justify-content:center;padding:24px;}
.lb.on{display:flex;}
.lb img{max-width:92vw;max-height:82vh;border-radius:12px;box-shadow:var(--shadow-lg);}
.lb .x{position:absolute;top:20px;right:24px;width:46px;height:46px;border-radius:50%;background:#fff;border:none;
  font-size:22px;cursor:pointer;display:grid;place-items:center;color:var(--ink);}
.lb .nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:#fff;
  border:none;cursor:pointer;display:grid;place-items:center;font-size:22px;color:var(--ink);box-shadow:var(--shadow-md);}
.lb .prev{left:24px;}.lb .next{right:24px;}
.lb .cap{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:#fff;font-size:14px;font-family:"Roboto";}

/* ========== Best-of ranking leaderboard (2026) — additive, namespaced ========== */
/* Full-bleed collage hero — breaks out of .wrap to span the viewport. */
.review2026 .rank-hero{position:relative;width:100%;height:clamp(420px,60vh,620px);
  overflow:hidden;margin:16px 0 0;border-radius:0;box-shadow:none;}
.review2026 .rank-hero > img{width:100%;height:100%;object-fit:cover;display:block;}
.review2026 .rank-hero .fcap{position:absolute;left:0;right:0;bottom:0;padding:34px 0;}
.review2026 .rank-hero .fcap .wrap{padding:0 24px;}
.review2026 .rank-hero .gcount{top:auto;bottom:18px;right:24px;}

/* Leaderboard column fills the content area (override the article reading cap). */
.review2026 .rank-main{max-width:none;}
/* Full-width stacked ranking rows: number + name, ratings, image, description. */
.review2026 .ranklist{list-style:none;padding:0;margin:0;}
.review2026 .rankrow{padding:34px 0;border-top:1px solid var(--line);scroll-margin-top:84px;}
.review2026 .rankrow:first-child{border-top:none;padding-top:10px;}
.review2026 .rank-head{display:flex;align-items:baseline;gap:14px;margin:0 0 10px;}
.review2026 .rank-head .pos{font-family:"Lobster Two",cursive;font-size:46px;line-height:.9;color:var(--brick);flex:none;}
.review2026 .rank-head .pos.glyph{font-family:"Roboto",sans-serif;font-size:24px;font-weight:800;color:var(--ink-faint);}
.review2026 .rank-head h3{font-family:"Lobster Two",cursive;font-weight:700;font-size:31px;color:var(--ink);margin:0;line-height:1.04;}
.review2026 .rank-head h3 a{color:inherit;}
.review2026 .rank-head h3 a:hover{color:var(--brick);text-decoration:none;}
.review2026 .rank-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 16px;}
.review2026 .rank-score{display:inline-flex;align-items:center;gap:8px;}
.review2026 .rank-score .sv{font-family:"Roboto",sans-serif;color:var(--brick);}
.review2026 .rank-score .sv b{font-size:19px;font-weight:800;}
.review2026 .rank-score .sv small{color:var(--ink-faint);font-weight:600;}
.review2026 .rank-goog{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink-soft);}
.review2026 .rank-goog .swatch{width:9px;height:9px;border-radius:50%;}
.review2026 .rank-goog small{color:var(--ink-faint);}
.review2026 .rank-photo{display:block;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);margin:0 0 18px;}
.review2026 .rank-photo img{width:100%;height:clamp(280px,40vw,440px);object-fit:cover;display:block;transition:transform .35s;}
.review2026 .rank-photo:hover img{transform:scale(1.025);}
.review2026 .rk-sum{font-family:"Newsreader",Georgia,serif;font-size:1.18rem;line-height:1.68;color:#352b25;}
.review2026 .rk-sum p{margin:0 0 .8rem;}
.review2026 .rank-links{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px;}
@media(max-width:680px){
  .review2026 .rank-head .pos{font-size:36px;}
  .review2026 .rank-head h3{font-size:25px;}
}

/* ============================================================
   Homepage (June 2026)
   Front door to the magazine. Reuses the review tokens and the
   .masthead / .rel / .news / .foot components; only the hero,
   category cards, section headers and bio card are new.
   ============================================================ */

/* ---------- Hero (full-bleed, masthead overlaid) ---------- */
.home-hero{position:relative;display:flex;flex-direction:column;min-height:clamp(460px,78vh,680px);overflow:hidden;}
.home-hero .hbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.home-hero .veil{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(20,12,8,.45) 0%,rgba(20,12,8,.12) 34%,rgba(20,12,8,.74) 100%);}
/* the shared masthead, made transparent so it floats over the hero image */
.home-hero .masthead{position:relative;z-index:3;background:transparent;backdrop-filter:none;
  border-bottom:1px solid rgba(255,255,255,.18);}
.home-hero .masthead .brand{color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.35);}
.home-hero .mnav a{color:rgba(255,255,255,.94);}
.home-hero .mnav a:hover{color:#fff;}
.home-hero .mnav .sub{color:rgba(255,255,255,.78);}
.home-hero .mcaret{color:rgba(255,255,255,.7);}
.home-hero .navtoggle span{background:#fff;}
/* dropdown + mobile drawer keep the paper background (dark text) — readable over the hero */
.home-hero .mmenu a{color:var(--ink-soft);}
@media(max-width:1024px){.home-hero .mnav{box-shadow:var(--shadow-md);}}
.home-hero .hcap{position:relative;z-index:2;margin-top:auto;text-align:center;color:#fff;padding:48px 24px 70px;}
.home-hero h1{font-family:"Lobster Two",cursive;font-weight:700;color:#fff;
  font-size:clamp(3rem,8.5vw,6rem);line-height:1;margin:0 0 .08em;text-shadow:0 2px 26px rgba(0,0,0,.5);}
.home-hero .tag{font-family:"Newsreader",Georgia,serif;font-style:italic;color:rgba(255,255,255,.95);
  font-size:clamp(1.2rem,2.7vw,1.75rem);margin:0 0 18px;text-shadow:0 1px 14px rgba(0,0,0,.5);}
.home-hero .trust{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:10px;align-items:center;
  font-size:14px;font-weight:500;color:rgba(255,255,255,.88);}
.home-hero .trust .dot{opacity:.5;}

/* homepage page background — cream so the white cards pop */
.review2026--home{background:var(--cream);}

/* ---------- Section header (eyebrow + rule line above the h2, like the article sec-kicker) ----------
   NB: .home-section is always combined with .wrap, so only set top/bottom padding
   here — the padding shorthand would wipe out .wrap's left/right gutters. */
.home-section{padding-top:58px;padding-bottom:6px;}
.home-head{margin-bottom:22px;}
.home-head .hh-line{display:flex;align-items:center;gap:14px;margin-bottom:10px;}
.home-head .eyebrow{font-size:12px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:var(--brick);margin:0;white-space:nowrap;}
.home-head .rule{flex:1;height:1px;background:var(--line);}
.home-head h2{font-family:"Lobster Two",cursive;font-weight:700;color:var(--brick);
  font-size:clamp(1.9rem,3.4vw,2.6rem);line-height:1.04;margin:0;}
.review2026 a.seeall{font-size:14px;font-weight:700;color:var(--teal);white-space:nowrap;}
.review2026 a.seeall:hover{color:var(--brick);text-decoration:none;}

/* social row in the footer */
.foot .social{display:flex;flex-wrap:wrap;gap:10px;margin:2px 0 10px;}
.review2026 .foot .social a{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;
  color:var(--teal);background:var(--teal-soft);padding:7px 13px;border-radius:9px;}
.review2026 .foot .social a:hover{background:#dbe6ea;text-decoration:none;}

/* mobile: tighten section + hero spacing */
@media(max-width:560px){
  .home-section{padding-top:40px;padding-bottom:4px;}
  .home-head{margin-bottom:16px;}
  .home-head .hh-line{gap:10px;}
  .home-hero .hcap{padding:36px 20px 54px;}
  .home-hero .trust{font-size:12.5px;gap:8px;}
  .bio{padding:24px;gap:20px;}
}

/* ---------- Category cards (image + veil + overlaid label) ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.review2026 a.cat{position:relative;display:block;border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-md);aspect-ratio:4/3;}
.cat img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease;}
.review2026 a.cat:hover{text-decoration:none;}
.review2026 a.cat:hover img{transform:scale(1.06);}
.cat .cv{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,12,8,.04) 0%,rgba(20,12,8,.62) 100%);}
.cat .cl{position:absolute;left:0;right:0;bottom:0;padding:18px 22px;color:#fff;
  font-family:"Lobster Two",cursive;font-size:clamp(1.6rem,2.4vw,2rem);text-shadow:0 2px 12px rgba(0,0,0,.5);}
@media(max-width:760px){.cat-grid{grid-template-columns:1fr;}.review2026 a.cat{aspect-ratio:16/9;}}

/* ---------- Card grid (rankings + review rows; reuses .rel) ---------- */
.home-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media(max-width:820px){.home-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.home-grid{grid-template-columns:1fr;}}
.rel .rmeta{display:flex;align-items:center;gap:10px;margin-top:10px;}
.rel .rscore{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:800;color:var(--brick);
  background:var(--brick-tint);padding:3px 10px;border-radius:999px;}
.rel .rscore .st{color:var(--gold);font-size:12px;}
.rel .rdate{font-size:12.5px;color:var(--ink-faint);}

/* ---------- Bio card ---------- */
.bio{display:grid;grid-template-columns:230px 1fr;gap:32px;align-items:center;margin-top:8px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow-sm);}
.bio img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-md);box-shadow:var(--shadow-sm);}
.bio h2{font-family:"Lobster Two",cursive;font-weight:700;color:var(--brick);font-size:2.3rem;margin:0 0 8px;}
.bio p{font-family:"Newsreader",Georgia,serif;font-size:1.14rem;line-height:1.6;color:var(--ink-soft);margin:0 0 12px;}
.review2026 a.bio-btn{display:inline-block;background:var(--brick);color:#fff;font-weight:700;font-size:14.5px;
  padding:11px 22px;border-radius:10px;margin-top:4px;transition:background .15s;}
.review2026 a.bio-btn:hover{background:var(--brick-deep);text-decoration:none;color:#fff;}
@media(max-width:680px){.bio{grid-template-columns:1fr;text-align:center;}.bio img{width:100%;max-width:none;aspect-ratio:16/9;}}

/* ========== Category index extras (2026) — rankings, top-rated, A–Z ========== */
.review2026 .catblock{margin:52px 0 0;}
.review2026 .mini-head{font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--ink-faint);margin:30px 0 13px;}
.review2026 .rankchips{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 6px;}
.review2026 a.rankchip{display:inline-flex;align-items:center;gap:7px;background:var(--brick-tint);
  color:var(--brick);border:1px solid #f0d2c8;border-radius:999px;padding:8px 15px;font-size:14px;font-weight:700;
  transition:background .15s,color .15s,border-color .15s;}
.review2026 a.rankchip:hover{background:var(--brick);color:#fff;border-color:var(--brick);text-decoration:none;}
.review2026 a.rankchip .tr{font-size:13px;line-height:1;}
.review2026 .az-bar{position:sticky;top:0;z-index:30;display:flex;flex-wrap:wrap;gap:5px;
  background:rgba(255,253,250,.96);backdrop-filter:blur(6px);padding:11px 0;margin:6px 0 2px;border-bottom:1px solid var(--line);}
.review2026 .az-bar a,.review2026 .az-bar span{display:grid;place-items:center;min-width:27px;height:27px;
  border-radius:7px;font-size:13px;font-weight:700;}
.review2026 .az-bar a{color:var(--brick);background:var(--brick-tint);}
.review2026 .az-bar a:hover{background:var(--brick);color:#fff;text-decoration:none;}
.review2026 .az-bar .off{color:var(--ink-faint);background:transparent;opacity:.4;}
.review2026 .alpha-head{font-family:"Lobster Two",cursive;color:var(--brick);font-size:26px;margin:24px 0 14px;
  padding-bottom:6px;border-bottom:2px solid var(--line);scroll-margin-top:60px;}

/* ========== About / philosophy pages (2026) — additive, namespaced ========== */
/* Full-bleed banner hero with overlaid title. */
.review2026 .about-hero{position:relative;width:100%;height:clamp(300px,46vh,460px);
  overflow:hidden;margin:16px 0 0;}
.review2026 .about-hero > img{width:100%;height:100%;object-fit:cover;display:block;}
.review2026 .about-hero .veil{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(36,28,24,0) 30%,rgba(36,28,24,.78) 100%);}
.review2026 .about-hero .fcap{position:absolute;left:0;right:0;bottom:0;padding:34px 0;color:#fff;}
.review2026 .about-hero .fcap .wrap{padding:0 24px;}
.review2026 .about-hero .kicker{font-size:12px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;
  color:#ffd9a8;margin:0 0 8px;}
.review2026 .about-hero h1{font-family:"Lobster Two",cursive;font-weight:700;color:#fff;line-height:1.02;
  font-size:clamp(34px,6vw,56px);margin:0;text-shadow:0 2px 22px rgba(0,0,0,.32);}
/* No-image fallback: simple left-aligned masthead title. */
.review2026 .about-head{padding:40px 0 4px;text-align:left;}
.review2026 .about-head .kicker{font-size:12px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;
  color:var(--brick);margin:0 0 8px;}
.review2026 .about-head h1{font-family:"Lobster Two",cursive;font-weight:700;color:var(--ink);line-height:1.02;
  font-size:clamp(32px,5.5vw,50px);margin:0;}
/* Left-aligned reading column for prose; drop cap on the first paragraph. */
.review2026 .aboutbody{max-width:var(--measure);margin:36px 0 8px;}
.review2026 .aboutbody > p:first-of-type::first-letter{font-family:"Lobster Two",cursive;float:left;
  font-size:4.6rem;line-height:.78;padding:6px 12px 0 0;color:var(--brick);}