/* Hot Wheelers Germany – V3 page design
   Visual layer only. Existing PHP/SQL/JS logic is intentionally untouched.
*/
.page-main{padding:54px 0 82px;background:transparent}
.page-main>.shell{width:min(1180px,calc(100% - 36px));margin:auto}
.page-hero,.results-hero,.hof-hero{
  position:relative;overflow:hidden;margin-bottom:24px;padding:36px 34px;
  border:1px solid rgba(244,123,32,.38);border-radius:18px;
  background:
    radial-gradient(circle at 90% 20%,rgba(244,123,32,.16),transparent 30%),
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  box-shadow:0 20px 60px rgba(0,0,0,.28);
}
.page-hero:after,.results-hero:after,.hof-hero:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--orange),transparent);opacity:.65
}
.page-hero .kicker,.results-hero .kicker,.hof-hero .kicker{color:var(--orange)}
.page-hero h1,.results-hero h1,.hof-hero h1{
  margin:8px 0 12px;color:#fff;font-size:clamp(2.25rem,5vw,4.3rem);
  line-height:.92;text-transform:uppercase;font-style:italic;
  letter-spacing:-.055em;font-weight:950
}
.page-hero p,.results-hero p,.hof-hero p{max-width:850px;color:#bfc2c1}
.page-actions,.results-actions,.hof-tabs,.ranking-tools{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.button,.primary,.results-actions a,.hof-tabs a,.ranking-tools a{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:0 16px;border:1px solid rgba(255,255,255,.12);border-radius:8px;
  background:#121414;color:#fff;font-weight:900;text-transform:uppercase;
  font-size:.73rem;letter-spacing:.035em;transition:.18s ease
}
.button:hover,.results-actions a:hover,.hof-tabs a:hover,.ranking-tools a:hover{
  transform:translateY(-1px);border-color:rgba(244,123,32,.65)
}
.button.primary,.primary,.results-actions a.primary{
  background:linear-gradient(135deg,var(--orange),var(--orange2));
  color:#111;border-color:transparent;box-shadow:0 10px 30px rgba(244,123,32,.14)
}
.card,.content-card,.hof-card{
  position:relative;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  border:1px solid var(--line);border-radius:18px;padding:26px;
  margin-bottom:18px;box-shadow:0 16px 45px rgba(0,0,0,.18)
}
.card h2,.content-card h2,.hof-card h2{margin-top:0}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}
.section-heading h2{margin:5px 0 0;font-size:clamp(1.7rem,3vw,2.5rem);text-transform:uppercase;font-style:italic;letter-spacing:-.035em}
.section-heading.small h2{font-size:1.8rem}
.table-wrap{border:1px solid rgba(255,255,255,.08);border-radius:13px;overflow:auto;background:rgba(0,0,0,.18)}
table{width:100%}
.league-table,.results-table,.hof-table{border-collapse:collapse;background:transparent}
.league-table th,.results-table th,.hof-table th{
  padding:12px 13px;background:rgba(244,123,32,.09);color:#b9bcbb;
  border-bottom:1px solid rgba(244,123,32,.28);font-size:.68rem;
  text-transform:uppercase;letter-spacing:.06em;text-align:left;white-space:nowrap
}
.league-table td,.results-table td,.hof-table td{
  padding:13px;border-bottom:1px solid rgba(255,255,255,.07);color:#e5e6e6
}
.league-table tr:hover td,.results-table tr:hover td,.hof-table tr:hover td{background:rgba(255,255,255,.025)}
.league-table tr:last-child td,.results-table tr:last-child td,.hof-table tr:last-child td{border-bottom:0}
.driver-link,.driver-name,.hof-table .driver-link{font-weight:900;color:#fff}
.driver-link:hover,.driver-name:hover{color:var(--orange)}
.position,.rank{color:var(--orange);font-weight:950}
.points,.driver-points{color:var(--orange);font-weight:950}
.muted,.muted-small{color:var(--muted)}
.league-page-grid{gap:18px}
.league-podium{gap:12px}
.league-podium article{
  background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:20px 14px
}
.league-podium article:first-child{border-color:rgba(244,123,32,.55);box-shadow:0 10px 35px rgba(244,123,32,.08)}
.league-podium b{color:var(--orange)}
.league-summary div,.point-tile,.raffle-teaser{
  background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08)
}
.league-summary strong{color:#fff}
.raffle-teaser{background:radial-gradient(circle at top right,rgba(247,150,18,.14),transparent 44%),rgba(255,255,255,.025)}
.points-card{border-top-color:rgba(244,123,32,.25)}
.point-tile .pts{color:var(--orange)}
.archive-season{border-top-color:rgba(255,255,255,.08)}
.class-standing-block+.class-standing-block{border-top-color:rgba(255,255,255,.08)}
/* Results */
.results-hero{display:flex;align-items:end;justify-content:space-between;gap:22px}
.results-hero>div:first-child{min-width:0}
.race-card{
  border-left:3px solid var(--orange);
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))
}
.race-card h2{font-size:1.25rem}
.race-meta{color:var(--muted)}
.race-card-actions{display:flex;flex-wrap:wrap;gap:8px}
.qualifying-button,.report-button{border-radius:8px}
.class-heading{color:var(--orange2);text-transform:uppercase;font-style:italic;letter-spacing:.02em}
/* Hall of fame */
.hof-tabs a,.ranking-tools a{color:#d7d9d8}
.hof-tabs a:hover,.ranking-tools a:hover,.ranking-tools a.active{background:var(--orange);color:#111;border-color:var(--orange)}
.record-grid{gap:14px}
.record-card,.driver-card,.duel-item{
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  border-color:rgba(255,255,255,.09);border-radius:16px
}
.record-card{padding:21px;min-height:160px}
.record-card b{color:var(--orange)}
.hof-card{background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.018))}
.hof-card h2{color:#fff;font-size:1.6rem;text-transform:uppercase;font-style:italic}
.compare-grid{gap:14px}
.compare-stat{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:12px}
.compare-stat strong{color:var(--orange)}
.duel-item{padding:16px}
/* Drivers */
.drivers-toolbar{
  background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.08);border-radius:13px
}
.drivers-search input,.drivers-sort{
  background:#0d0f0f;border-color:rgba(255,255,255,.1)
}
.driver-card{
  padding:20px;transition:transform .18s ease,border-color .18s ease,background .18s ease
}
.driver-card:hover{transform:translateY(-3px);border-color:rgba(244,123,32,.5)}
.driver-avatar{background:rgba(244,123,32,.08);border-color:rgba(244,123,32,.45)}
.driver-card h2{font-size:1.05rem}
.driver-card-stats div{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.07)}
.driver-card-stats strong{color:#fff}
.drivers-summary article{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.08)}
.drivers-summary strong{color:var(--orange)}
/* Driver profile/statistics */
.driver-hero{margin-bottom:18px}
.stats-grid{gap:10px}
.stat-box{
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  border:1px solid rgba(255,255,255,.08)!important;border-radius:13px!important;
}
.stat-box b,.stat-box strong{color:var(--orange)}
.stats-filter{
  background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:12px
}
.stats-filter a{border-radius:8px}
.stats-filter a.active{background:var(--orange);color:#111}
.class-stats-grid{gap:12px}
.class-stat-card{
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  border:1px solid rgba(255,255,255,.08)!important;border-radius:14px!important
}
.driver-identity-panel,.public-driver-card,.public-license-card{
  border-radius:18px!important;border-color:rgba(244,123,32,.3)!important
}
.driver-table{
  border-collapse:collapse
}
.driver-table th{
  background:rgba(244,123,32,.09);color:#b9bcbb;border-bottom:1px solid rgba(244,123,32,.28);
  text-transform:uppercase;font-size:.67rem;letter-spacing:.06em
}
.driver-table td{border-bottom:1px solid rgba(255,255,255,.07)}
/* mobile */
@media(max-width:900px){
  .results-hero{display:block}
  .record-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:650px){
  .page-main{padding:34px 0 58px}
  .page-hero,.results-hero,.hof-hero{padding:26px 20px;border-radius:15px}
  .page-hero h1,.results-hero h1,.hof-hero h1{font-size:clamp(2rem,11vw,3rem)}
  .card,.content-card,.hof-card{padding:18px;border-radius:14px}
  .section-heading{align-items:flex-start;flex-direction:column}
  .record-grid{grid-template-columns:1fr!important}
  .results-actions,.page-actions,.hof-tabs,.ranking-tools{width:100%}
  .button,.results-actions a,.hof-tabs a,.ranking-tools a{flex:1 1 auto}
}

/* V3 shared hero image – same neutral motorsport image as the homepage */
.page-hero,.results-hero,.hof-hero{
  isolation:isolate;
  min-height:280px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:
    linear-gradient(90deg,rgba(5,7,7,.96) 0%,rgba(5,7,7,.80) 42%,rgba(5,7,7,.46) 72%,rgba(5,7,7,.72) 100%),
    linear-gradient(0deg,rgba(5,7,7,.88) 0%,rgba(5,7,7,.08) 70%),
    url('../images/hero-car.png') center center / cover no-repeat;
}
.page-hero > *, .results-hero > *, .hof-hero > *{position:relative;z-index:2}
.page-hero:before,.results-hero:before,.hof-hero:before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(circle at 78% 42%,rgba(244,123,32,.20),transparent 34%);
}
@media(max-width:650px){
  .page-hero,.results-hero,.hof-hero{min-height:250px;padding:28px 22px;background-position:center center;}
}

/* V3 navigation: identical structure to index.php, with the current page underlined. */
.site-header .main-nav a.active{color:#fff;position:relative}
.site-header .main-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:var(--orange,#f79612);border-radius:2px}
@media(max-width:900px){
  .site-header .main-nav a.active::after{bottom:auto;left:12px;right:auto;top:50%;width:28px;height:2px;transform:translateY(-50%)}
}