/* Caliente Reviews — caliente theme (warm, data-driven, visual). PLACEHOLDER brand. */
:root{
  --cream:#fbf7f2; --ink:#221a17; --stone:#6f635b; --line:#e7ddd2;
  --terra:#bf3d2e; --terra-dk:#9c2e22; --gold:#c2912f; --moss:#5f7a4a;
  --card:#ffffff; --acc:#bf3d2e; --acc-soft:#f6ddd6;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:17px; line-height:1.6; overflow-x:hidden;
}
h1,h2,h3{font-family:Fraunces,Georgia,serif; font-weight:600; line-height:1.15; margin:0 0 .5em}
h1{font-size:2.5rem; letter-spacing:-.01em}
h2{font-size:1.6rem; margin-top:1.8em}
h3{font-size:1.2rem}
a{color:var(--terra-dk); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1040px; margin:0 auto; padding:0 20px}

/* country accent themes (set --acc per page/section) */
.t-colombian{--acc:#1f4ea8; --acc-soft:#e4ebf7}
.t-brazilian{--acc:#1a8f4a; --acc-soft:#e0f1e6}
.t-venezuelan{--acc:#9c2e22; --acc-soft:#f6ddd6}
.t-mexican{--acc:#1a7a4a; --acc-soft:#e0f0e8}

/* flag chips (CSS stripes, OS-independent — no emoji tells) */
.flag{width:30px; height:20px; border-radius:3px; display:inline-block; vertical-align:middle;
  border:1px solid rgba(0,0,0,.14); box-shadow:0 1px 2px rgba(0,0,0,.08); flex:0 0 auto}
.flag.lg{width:46px; height:31px; border-radius:4px}
.flag.colombian{background:linear-gradient(#fcd116 0 50%,#003893 50% 75%,#ce1126 75% 100%)}
.flag.venezuelan{background:linear-gradient(#fcd116 0 33.3%,#00247d 33.3% 66.6%,#cf142b 66.6% 100%)}
.flag.mexican{background:linear-gradient(90deg,#006847 0 33.3%,#fff 33.3% 66.6%,#ce1126 66.6% 100%)}
.flag.brazilian{background:#009c3b; position:relative; overflow:hidden}
.flag.brazilian::before{content:""; position:absolute; inset:18% 12%; background:#ffdf00;
  transform:rotate(45deg) scale(.8); border-radius:2px}
.flag.brazilian::after{content:""; position:absolute; left:50%; top:50%; width:42%; height:62%;
  transform:translate(-50%,-50%); background:#002776; border-radius:50%}

/* header / footer */
header.site{position:sticky; top:0; z-index:20; background:rgba(251,247,242,.92);
  backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; height:62px}
.brand{font-family:Fraunces,serif; font-size:1.3rem; font-weight:600; color:var(--ink)}
.brand b{color:var(--terra)}
nav.main{display:flex; align-items:center}
nav.main a{color:var(--stone); margin-left:20px; font-size:.95rem; display:inline-flex; align-items:center; gap:7px}
nav.main a:hover{color:var(--ink); text-decoration:none}
nav.main .flag{width:20px; height:13px}
footer.site{border-top:1px solid var(--line); margin-top:64px; padding:32px 0; color:var(--stone); font-size:.9rem}
footer.site a{color:var(--stone)}

/* full-bleed hero collage */
.hero-collage{position:relative; min-height:520px; display:flex; align-items:center;
  width:100vw; margin:0 calc(50% - 50vw) 8px; overflow:hidden}
.hero-collage .inner > *{max-width:880px; margin-left:auto; margin-right:auto}
.hero-collage .collage{position:absolute; inset:0; display:flex; flex-wrap:wrap}
.hero-collage .collage img{width:12.5%; height:174px; object-fit:cover; display:block; filter:saturate(1.05)}
.hero-collage .ov{position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(28,12,10,.62) 0%, rgba(28,12,10,.50) 40%, rgba(28,12,10,.82) 100%)}
.hero-collage .inner{position:relative; z-index:2; color:#fff; text-align:center; width:100%; padding:64px 20px}
.hero-collage .kick{color:#ffd9b0; text-transform:uppercase; letter-spacing:.1em; font-size:.82rem; font-weight:600}
.hero-collage h1{color:#fff; font-size:3.1rem; margin:.12em 0 .18em; text-shadow:0 2px 18px rgba(0,0,0,.4)}
.hero-collage p.lead{color:#f3e7df; font-size:1.2rem; max-width:60ch; margin:0 auto 22px}
.herobtns{display:flex; gap:10px; justify-content:center; flex-wrap:wrap}
.herobtns a{display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.35); color:#fff; padding:9px 16px; border-radius:24px; backdrop-filter:blur(4px); font-weight:500}
.herobtns a:hover{background:#fff; color:var(--ink); text-decoration:none}
.herobtns a.solid{background:var(--terra); border-color:var(--terra)}
.herobtns a.solid:hover{background:#fff; color:var(--terra-dk)}

/* section heading */
.shead{display:flex; align-items:baseline; justify-content:space-between; margin:2em 0 .2em}
.shead h2{margin:0} .shead a{font-size:.9rem}

/* top sites ranking */
.siterank{display:flex; flex-direction:column; gap:12px; margin:18px 0}
.srow{display:grid; grid-template-columns:40px 64px 1fr auto; gap:16px; align-items:center;
  background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 18px;
  border-left:4px solid var(--acc); transition:box-shadow .12s, transform .12s}
.srow:hover{box-shadow:0 8px 24px rgba(40,20,10,.08); transform:translateY(-2px); text-decoration:none}
.srow .rk{font-family:Fraunces,serif; font-size:1.5rem; color:var(--stone); text-align:center}
.srow .logo{width:64px; height:48px; border-radius:9px; background:var(--acc-soft); color:var(--acc);
  display:flex; align-items:center; justify-content:center; font-family:Fraunces,serif; font-weight:600; font-size:.78rem; text-align:center; padding:4px; line-height:1.05}
.srow .nm{font-family:Fraunces,serif; font-size:1.25rem; color:var(--ink)}
.srow .nm .sub{display:block; font-family:Inter,sans-serif; font-size:.82rem; color:var(--stone); font-weight:400; margin-top:2px}
.srow .cta{display:flex; align-items:center; gap:14px}
.srow .cta .visit{background:var(--terra); color:#fff; padding:9px 18px; border-radius:22px; font-weight:600; font-size:.9rem}
.srow .cta .visit:hover{background:var(--terra-dk); text-decoration:none}

/* visual country cards */
.ccards{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin:18px 0}
.vcard{position:relative; border-radius:16px; overflow:hidden; min-height:180px; display:flex; align-items:flex-end;
  border:1px solid var(--line); color:#fff}
.vcard img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.vcard .vov{position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(20,10,8,.82))}
.vcard .vin{position:relative; z-index:2; padding:16px; width:100%}
.vcard .vin .big{font-family:Fraunces,serif; font-size:1.5rem; display:flex; align-items:center; gap:9px}
.vcard .vin .muted{color:#f0e2da}
.vcard .vstats{margin-top:8px; display:flex; flex-direction:column; gap:2px}
.vcard .vstats .vrow{color:#f0e2da; font-size:.92rem; line-height:1.35}
.vcard .vstats .vrow b{color:#fff; font-weight:700; margin-right:3px}
.vcard:hover img{transform:scale(1.05)} .vcard img{transition:transform .3s}
.vcard.soon{cursor:default} .vcard.soon:hover img{transform:none}
.vcard.soon .vov{background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(20,10,8,.9))}
.soontag{margin-top:8px; display:inline-block; font-size:.74rem; letter-spacing:.04em; text-transform:uppercase;
  color:#f0e2da; background:rgba(255,255,255,.14); padding:3px 9px; border-radius:99px}

/* country sub-heading (performer shelves) */
.csub{margin:20px 0 2px; border-bottom:2px solid var(--acc); padding-bottom:6px}
.csub a{display:flex; align-items:center; gap:9px; font-family:Fraunces,serif; font-size:1.2rem; color:var(--ink)}
.csub a:hover{text-decoration:none}
.csub .more{margin-left:auto; font-family:Inter,sans-serif; font-size:.82rem; color:var(--acc); font-weight:500}

/* performer photo cards */
.pcards{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin:18px 0}
.pcard{display:block; border-radius:14px; overflow:hidden; background:var(--card); border:1px solid var(--line)}
.pcard:hover{box-shadow:0 8px 22px rgba(40,20,10,.1); text-decoration:none}
.pcard .pi{position:relative; aspect-ratio:3/4; background:var(--acc-soft); overflow:hidden}
.pcard .pi img{width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform .3s}
.pcard:hover .pi img{transform:scale(1.05)}
.pcard .pi .fl{position:absolute; top:8px; left:8px}
.pcard .pb{padding:10px 12px}
.pcard .pb .nm{font-weight:600; color:var(--ink); font-size:.98rem}
.pcard .pb .mt{font-size:.8rem; color:var(--stone)}

/* top-site cards (logo + latest scene image) */
.sitecards{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; margin:18px 0}
.sitecard{display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line);
  border-radius:16px; overflow:hidden; transition:transform .12s, box-shadow .12s}
.sitecard:hover{transform:translateY(-3px); box-shadow:0 10px 28px rgba(40,20,10,.1); text-decoration:none}
.sitecard .ph{position:relative; aspect-ratio:16/9; background:var(--acc-soft); overflow:hidden}
.sitecard .ph img{width:100%; height:100%; object-fit:cover; transition:transform .3s}
.sitecard:hover .ph img{transform:scale(1.05)}
.sitecard .rkb{position:absolute; top:10px; left:10px; width:30px; height:30px; border-radius:50%;
  background:var(--terra); color:#fff; font-family:Fraunces,serif; font-weight:600; display:flex; align-items:center; justify-content:center; font-size:.95rem; box-shadow:0 2px 8px rgba(0,0,0,.3)}
.sitecard .cat{position:absolute; bottom:10px; left:10px; display:flex; align-items:center; gap:6px;
  background:#fff; color:var(--acc); border-radius:9px; padding:5px 11px; font-family:Inter,sans-serif;
  font-weight:600; font-size:.78rem; box-shadow:0 2px 10px rgba(0,0,0,.25)}
.sitecard .cat .flag{width:20px; height:13px}
.sitecard .body{padding:14px 16px; display:flex; flex-direction:column; gap:10px; flex:1}
.sitecard .body .nm{font-family:Fraunces,serif; font-size:1.25rem; color:var(--ink)}
.sitecard .body .sub{font-size:.86rem; color:var(--stone); margin-top:2px}
.sitecard .body .desc{margin:6px 0 0; font-size:.9rem; color:var(--stone); line-height:1.45}
.sitecard .body .tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px}
.sitecard .body .tag{background:var(--acc-soft); color:var(--acc); font-size:.72rem; font-weight:600;
  padding:3px 9px; border-radius:20px; letter-spacing:.01em}
/* ===== country hub: ranked offer mini-reviews (top picks) ===== */
.ranknote{color:var(--stone); font-size:.92rem; margin:6px 0 16px; max-width:70ch}
.opicks{display:flex; flex-direction:column; gap:16px; margin:8px 0 26px}
.opick{display:grid; grid-template-columns:280px minmax(0,1fr); background:var(--card);
  border:1px solid var(--line); border-radius:16px; overflow:hidden; border-left:4px solid var(--acc)}
.opick .shot{position:relative; display:block; min-height:200px; background:var(--acc-soft)}
.opick .shot img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.opick .shot .rk{position:absolute; top:12px; left:12px; width:34px; height:34px; border-radius:50%;
  background:var(--acc); color:#fff; font-family:Fraunces,serif; font-weight:600; font-size:1.05rem;
  display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.35)}
.opick .shot .lg{position:absolute; top:12px; right:12px; height:28px; background:rgba(20,16,18,.85);
  border-radius:7px; padding:4px 9px; display:flex; align-items:center; box-shadow:0 2px 8px rgba(0,0,0,.35)}
.opick .shot .lg img{max-height:19px; max-width:78px; object-fit:contain; display:block}
.opick .meat{padding:16px 20px; display:flex; flex-direction:column; gap:9px; min-width:0}
.opick .top{display:flex; align-items:center; gap:12px}
.opick .top .nm{font-family:Fraunces,serif; font-size:1.45rem; color:var(--ink); line-height:1.1}
.opick .top .nm:hover{color:var(--acc); text-decoration:none}
.opick .top .score{margin-left:auto; font-size:1rem; min-width:46px; padding:5px 11px}
.opick .blurb{margin:0; color:#5a4d45; font-size:.98rem; line-height:1.5}
.opick .dstrip{display:flex; flex-wrap:wrap; gap:7px 9px; list-style:none; margin:2px 0 0; padding:0}
.opick .dstrip li{font-size:.82rem; color:var(--stone); background:var(--cream);
  border:1px solid var(--line); border-radius:7px; padding:4px 10px; white-space:nowrap}
.opick .dstrip li b{color:var(--ink); font-variant-numeric:tabular-nums; font-weight:700}
.opick .foot{display:flex; align-items:center; gap:16px; margin-top:auto; padding-top:4px}
.opick .from{font-size:.92rem; color:var(--stone)}
.opick .from b{color:var(--ink); font-variant-numeric:tabular-nums}
.opick .visit{background:var(--terra); color:#fff; padding:9px 20px; border-radius:22px; font-weight:600; font-size:.9rem}
.opick .visit:hover{background:var(--terra-dk); text-decoration:none}
.opick .rev{font-size:.86rem; color:var(--stone); font-weight:500; margin-left:auto}
.opick .rev:hover{color:var(--acc)}

/* country hub: the rest, compact ranked rows */
.resth{font-size:1.1rem; margin:8px 0 .4em; color:var(--ink)}
.orest{border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--card); margin-bottom:8px}
.orow{display:grid; grid-template-columns:34px minmax(0,1.6fr) minmax(0,1fr) auto; gap:14px; align-items:center;
  padding:12px 16px; border-bottom:1px solid var(--line)}
.orow:last-child{border-bottom:0}
.orow:hover{background:#fcf3ec; text-decoration:none}
.orow .rk{font-family:Fraunces,serif; color:var(--stone); text-align:center; font-variant-numeric:tabular-nums}
.orow .onm{font-weight:600; color:var(--ink); min-width:0}
.orow .onm .sub{display:block; font-size:.82rem; color:var(--stone); font-weight:400; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis}
.orow .ostat{font-size:.85rem; color:var(--stone); font-variant-numeric:tabular-nums}
.orow .ostat b{color:var(--ink)}
.evidence{color:var(--stone); font-size:.92rem; margin:2px 0 0; max-width:70ch}
.sitecard .body .visit{background:var(--terra); color:#fff; padding:8px 18px; border-radius:22px; font-weight:600; font-size:.88rem}
.sitecard:hover .visit{background:var(--terra-dk)}

/* scene cards (top / latest shelves) */
.scards{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:13px; margin:18px 0}
.scard{display:block; border-radius:12px; overflow:hidden; background:var(--card); border:1px solid var(--line)}
.scard:hover{box-shadow:0 8px 20px rgba(40,20,10,.1); text-decoration:none}
.scard .ph{position:relative; aspect-ratio:16/10; background:var(--acc-soft); overflow:hidden}
.scard .ph img{width:100%; height:100%; object-fit:cover; transition:transform .3s}
.scard:hover .ph img{transform:scale(1.06)}
.scard .ph .fl{position:absolute; top:8px; left:8px; box-shadow:0 1px 4px rgba(0,0,0,.4)}
.scard .rate{position:absolute; top:8px; right:8px; background:rgba(20,10,8,.82); color:#ffd9b0;
  font-size:.78rem; font-weight:600; padding:3px 8px; border-radius:14px}
.scard .cap{padding:9px 11px}
.scard .cap .t{font-size:.9rem; color:var(--ink); font-weight:500; line-height:1.3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.scard .cap .m{font-size:.78rem; color:var(--stone); margin-top:4px}

/* legacy hero (inner pages) */
.hero{padding:54px 0 34px; border-bottom:1px solid var(--line);
  background:radial-gradient(120% 90% at 0% 0%, #fff4ea 0%, var(--cream) 55%)}
.hero .kick{color:var(--terra); text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; font-weight:600}
.hero h1{margin-top:.2em}
.hero p.lead{font-size:1.18rem; color:#4a3f39; max-width:62ch}
.hero.country{display:flex; align-items:center; gap:18px}

/* stat strip */
.stats{display:flex; flex-wrap:wrap; gap:10px; margin:22px 0 4px}
.stat{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 16px; min-width:120px}
.stat .n{font-family:Fraunces,serif; font-size:1.5rem; color:var(--acc); line-height:1; font-variant-numeric:tabular-nums}
.stat .l{font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--stone); margin-top:5px}

/* country cards (home) */
.grid{display:grid; gap:18px}
.grid.c4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px;
  transition:transform .12s, box-shadow .12s; display:block}
.card:hover{transform:translateY(-3px); box-shadow:0 8px 26px rgba(40,20,10,.09); text-decoration:none}
.ccard{border-top:3px solid var(--acc)}
.ccard .chead{display:flex; align-items:center; gap:10px; margin-bottom:14px}
.ccard .big{font-family:Fraunces,serif; font-size:1.5rem; color:var(--ink)}
.card .muted{color:var(--stone); font-size:.9rem}

/* horizontal data bar (content depth, scores) */
.bar{height:8px; border-radius:6px; background:var(--acc-soft); overflow:hidden; margin:4px 0}
.bar > i{display:block; height:100%; border-radius:6px; background:var(--acc)}
.barlabel{display:flex; justify-content:space-between; font-size:.8rem; color:var(--stone); margin-top:7px}
.barlabel b{color:var(--ink); font-variant-numeric:tabular-nums}

/* pills (filters / tags / cross-links) */
.pillrow{display:flex; flex-wrap:wrap; gap:8px; margin:14px 0}
.pill{display:inline-flex; align-items:center; gap:6px; font-size:.85rem; padding:6px 13px; border-radius:20px;
  background:var(--card); border:1px solid var(--line); color:var(--stone); cursor:pointer}
.pill:hover{border-color:var(--acc); color:var(--ink); text-decoration:none}
.pill.on{background:var(--acc); border-color:var(--acc); color:#fff}
.pill .flag{width:18px; height:12px}

/* ranked listing rows (pornstars) — scannable, not a spreadsheet */
.ranklist{margin:20px 0; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--card)}
.rankrow{display:grid; grid-template-columns:42px 1.4fr 1fr auto; gap:16px; align-items:center;
  padding:13px 16px; border-bottom:1px solid var(--line)}
.rankrow:last-child{border-bottom:0}
.rankrow:hover{background:#fcf3ec}
.rankrow .rk{font-family:Fraunces,serif; font-size:1.15rem; color:var(--stone); text-align:center; font-variant-numeric:tabular-nums}
.rankrow .rk.medal{color:#fff; background:var(--acc); border-radius:50%; width:32px; height:32px;
  display:flex; align-items:center; justify-content:center; margin:0 auto; font-size:.95rem}
.rankrow .nm{font-weight:600}
.rankrow .nm a{color:var(--ink)}
.rankrow .nm .sub{display:block; font-size:.8rem; color:var(--stone); font-weight:400}
.rankrow .depth .bar{margin:0}
.rankrow .depth .cap{font-size:.78rem; color:var(--stone); margin-top:5px; font-variant-numeric:tabular-nums}
.rankrow .meta{text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:6px}

/* photos: avatars in rows, scene mosaics, profile hero */
.rankrow.withpho{grid-template-columns:34px 50px 1.3fr 1fr auto}
.pho{width:50px; height:50px; border-radius:10px; object-fit:cover; object-position:top center;
  background:var(--acc-soft); display:block}
.pho.sq{border-radius:10px}
.pho.ph{display:flex; align-items:center; justify-content:center; color:var(--acc); font-family:Fraunces,serif; font-weight:600; font-size:1.2rem}

.mosaic{display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:7px; margin:22px 0}
.mosaic a{display:block; border-radius:9px; overflow:hidden; line-height:0; background:var(--acc-soft)}
.mosaic img{width:100%; aspect-ratio:3/2; object-fit:cover; display:block; transition:transform .25s}
.mosaic a:hover img{transform:scale(1.06)}

.phero{display:flex; gap:22px; align-items:flex-end; margin:8px 0 6px}
.phero .pho{width:150px; height:190px; border-radius:16px}
.thumbgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:9px; margin:16px 0}
.thumbgrid figure{margin:0; border-radius:10px; overflow:hidden; background:var(--acc-soft)}
.thumbgrid img{width:100%; aspect-ratio:3/2; object-fit:cover; display:block}
.thumbgrid figcaption{font-size:.75rem; color:var(--stone); padding:6px 8px; line-height:1.3}

/* score badge + tags */
.score{display:inline-block; min-width:38px; text-align:center; padding:3px 9px; border-radius:20px;
  font-weight:600; font-size:.85rem; background:#f0e6d6; color:var(--gold)}
.score.hot{background:var(--acc-soft); color:var(--acc)}
.tag{display:inline-block; font-size:.72rem; padding:2px 9px; border-radius:6px; background:var(--acc-soft); color:var(--acc);
  text-transform:capitalize; letter-spacing:.01em}
.badge{display:inline-block; font-size:.7rem; padding:2px 7px; border-radius:6px; background:#eef2e6; color:var(--moss);
  text-transform:uppercase; letter-spacing:.04em}

/* profile attribute grid */
.facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:20px 0}
.facts div{background:var(--card); padding:12px 14px}
.facts .k{font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--stone)}
.facts .v{font-size:1.05rem; font-variant-numeric:tabular-nums}

/* legacy data table (kept for any remaining tabular use) */
.dt{width:100%; border-collapse:collapse; margin:18px 0; font-size:.95rem}
.dt th,.dt td{text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:top}
.dt th{font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--stone); font-weight:600}
.dt tr:hover td{background:#fcf3ec}
.dt td.num,.dt th.num{text-align:right; font-variant-numeric:tabular-nums}
.rank{color:var(--stone); font-variant-numeric:tabular-nums}

.crumbs{font-size:.85rem; color:var(--stone); margin:22px 0 6px}
.crumbs a{color:var(--stone)}
.prose{max-width:760px}
.prose p{margin:0 0 1em}
.faq dt{font-weight:600; margin-top:1em}
.faq dd{margin:0 0 .4em; color:var(--stone)}
.note{background:#f7efe6; border:1px solid var(--line); border-radius:10px; padding:14px 16px; color:var(--stone); font-size:.92rem}
.disc{font-size:.82rem; color:var(--stone)}
.muted{color:var(--stone)}

/* ===== offer review page ===== */
.rhero{display:grid; grid-template-columns:300px minmax(0,1fr); gap:24px; align-items:start; margin:8px 0 6px}
.rhero .poster{position:relative; min-width:0; border-radius:16px; overflow:hidden;
  background:var(--acc-soft); border:1px solid var(--line)}
.rhero .poster img{width:100%; height:200px; object-fit:cover; display:block}
.rhero .poster .ph{display:flex; align-items:center; justify-content:center; height:200px;
  color:var(--acc); font-family:Fraunces,serif; font-weight:600; font-size:1.1rem; text-align:center; padding:12px}
.rhero .meta{min-width:0}
.rhero .logo{position:absolute; bottom:10px; left:10px; background:#fff; border-radius:9px; padding:6px 10px;
  box-shadow:0 2px 10px rgba(0,0,0,.22); max-width:62%}
.rhero .logo img{width:auto; max-height:34px; object-fit:contain}
.rhero .logo.txt{color:var(--acc); font-family:Fraunces,serif; font-weight:600; font-size:.9rem}
.rhero .meta{display:flex; flex-direction:column; gap:10px}
.rhero .kick{color:var(--acc); text-transform:uppercase; letter-spacing:.08em; font-size:.78rem; font-weight:600}
.rhero h1{margin:.05em 0 0}
.rhero .scoreline{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.bigscore{display:inline-flex; align-items:baseline; gap:3px; background:var(--acc); color:#fff;
  font-family:Fraunces,serif; font-weight:600; padding:7px 14px; border-radius:12px; line-height:1}
.bigscore b{font-size:1.5rem} .bigscore span{font-size:.85rem; opacity:.85}
.rhero .quick{color:var(--stone); font-size:.95rem}
.rhero .cta{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:auto}
.btn-visit{display:inline-block; background:var(--terra); color:#fff; font-weight:600; padding:12px 26px;
  border-radius:26px; font-size:1rem}
.btn-visit:hover{background:var(--terra-dk); text-decoration:none}
.disclose{font-size:.8rem; color:var(--stone)}

/* latin-depth bars (the USP block) */
.depth{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px 20px; margin:20px 0}
.depth h2{margin:0 0 4px} .depth .sub{color:var(--stone); font-size:.9rem; margin-bottom:14px}
.depthrow{display:grid; grid-template-columns:130px 1fr 56px; gap:14px; align-items:center; margin:9px 0}
.depthrow .lab{display:flex; align-items:center; gap:8px; font-weight:500}
.depthrow .cnt{text-align:right; font-variant-numeric:tabular-nums; font-weight:600; color:var(--ink)}

/* pros / cons */
.proscons{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:20px 0}
.proscons ul{list-style:none; margin:0; padding:0}
.proscons li{position:relative; padding:5px 0 5px 26px; color:var(--ink); font-size:.96rem; line-height:1.5}
.proscons .pros li::before{content:"+"; position:absolute; left:6px; color:var(--moss); font-weight:700}
.proscons .cons li::before{content:"\2013"; position:absolute; left:6px; color:var(--terra); font-weight:700}
.proscons h3{margin:0 0 8px; font-size:1.05rem}
.pcbox{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px 18px}

/* pricing plans */
.plans{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin:16px 0}
.plan{background:var(--card); border:1px solid var(--line); border-radius:13px; padding:14px 16px; text-align:center}
.plan .lab{font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--stone)}
.plan .pr{font-family:Fraunces,serif; font-size:1.6rem; color:var(--acc); margin:5px 0; font-variant-numeric:tabular-nums}
.plan .pd{font-size:.8rem; color:var(--stone)}
.plan .bd{display:inline-block; font-size:.66rem; text-transform:uppercase; letter-spacing:.04em;
  background:var(--acc-soft); color:var(--acc); border-radius:6px; padding:2px 7px; margin-top:6px}

/* performer evidence chips */
.perfchips{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 4px}
.perfchips a, .perfchips span{display:inline-flex; align-items:center; gap:6px; font-size:.86rem; padding:6px 12px;
  border-radius:20px; background:var(--card); border:1px solid var(--line); color:var(--ink)}
.perfchips a:hover{border-color:var(--acc); text-decoration:none}
.perfchips b{color:var(--stone); font-weight:500; font-variant-numeric:tabular-nums}

@media(max-width:640px){
  .rhero{grid-template-columns:1fr} .proscons{grid-template-columns:1fr}
  .depthrow{grid-template-columns:104px 1fr 44px}
  h1{font-size:1.95rem} body{font-size:16px} nav.main a{margin-left:13px}
  nav.main a span.lbl{display:none}
  .rankrow{grid-template-columns:30px 1fr auto; gap:10px}
  .rankrow.withpho{grid-template-columns:30px 44px 1fr auto}
  .rankrow .depth{display:none}
  .phero .pho{width:110px; height:140px}
  .hero.country{gap:12px}
  .opick{grid-template-columns:1fr}
  .opick .shot{min-height:190px}
  .orow{grid-template-columns:28px 1fr auto; gap:10px}
  .orow .ostat{display:none}
}