/* World of Padel V3 - shared visual language for public pages */
:root{
  --v3-paper:#f5f2ed;
  --v3-paper-strong:#fff;
  --v3-ink:#171717;
  --v3-muted:#625e5a;
  --v3-line:#d8d1c9;
  --v3-dark:#101010;
  --v3-dark-soft:#181818;
  --v3-orange:#e85d04;
  --v3-orange-dark:#c94e00;
  --v3-shell:1240px;
}

body:not(.page-index){background:var(--v3-dark)}
body:not(.page-index) main{letter-spacing:0}
body:not(.page-index) .breadcrumbs{
  padding:.78rem max(1.25rem,calc((100vw - var(--v3-shell))/2));
  background:var(--v3-paper);
  border-bottom:1px solid var(--v3-line);
  color:#77716c;
  font-size:.58rem;
  letter-spacing:.14em;
}
body:not(.page-index) .breadcrumbs a{color:#77716c}
body:not(.page-index) .breadcrumbs span{color:var(--v3-orange-dark)}
body:not(.page-index) h1,
body:not(.page-index) h2,
body:not(.page-index) h3{letter-spacing:0}
body:not(.page-index) .btn-primary{background:var(--v3-orange-dark);color:#fff}
body:not(.page-index) .btn-primary:hover{background:var(--v3-orange)}

/* Editorial pages: rules and tips */
.page-regels .editorial-page,
.page-tips .editorial-page{background:var(--v3-paper);color:var(--v3-ink)}
.page-regels .editorial-page>.hero,
.page-tips .editorial-page>.hero{
  position:relative;
  isolation:isolate;
  min-height:510px;
  padding:4.5rem max(2rem,calc((100vw - var(--v3-shell))/2)) 3rem;
  border:0;
  background:var(--v3-dark);
  color:#fff;
  overflow:hidden;
}
.page-regels .editorial-page>.hero:after,
.page-tips .editorial-page>.hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  width:min(24vw,340px);
  left:auto;
  border-left:1px solid rgba(255,255,255,.08);
  background:#141414;
}
.page-regels .editorial-page>.hero .hero-left,
.page-tips .editorial-page>.hero .hero-left{max-width:710px;margin:0;padding:0;align-self:center}
.page-regels .editorial-page>.hero h1,
.page-tips .editorial-page>.hero h1{
  max-width:760px;
  margin:.7rem 0 1rem;
  color:#fff;
  font:300 clamp(3.2rem,6vw,5.6rem)/.9 'Cormorant Garamond',serif;
}
.page-regels .editorial-page>.hero p,
.page-tips .editorial-page>.hero p{max-width:650px;color:rgba(255,255,255,.8);font-size:.86rem;line-height:1.8}
.page-regels .editorial-page>.hero .hero-right,
.page-tips .editorial-page>.hero .hero-right{flex:0 0 320px;gap:.55rem}
.page-regels .editorial-page>.hero .hero-stat,
.page-tips .editorial-page>.hero .hero-stat{min-height:70px;background:rgba(8,8,8,.55);border:1px solid rgba(255,255,255,.12);border-left:3px solid var(--v3-orange)}
.page-regels .editorial-page>section:not(.hero),
.page-tips .editorial-page>section:not(.hero){
  padding:4.5rem max(2rem,calc((100vw - var(--v3-shell))/2));
}
.page-regels .editorial-light-section,
.page-tips .editorial-light-section,
.page-regels .court-section,
.page-tips .court-section{background:var(--v3-paper);color:var(--v3-ink)}
.page-regels .rules-bg,
.page-regels .faq-bg,
.page-tips .equip-bg,
.page-tips .faq-bg{background:var(--v3-dark);color:#fff}
.page-regels .section-title,
.page-tips .section-title{max-width:850px;font-size:clamp(2.5rem,4.2vw,4rem);line-height:1;color:inherit}
.page-regels .section-desc,
.page-tips .section-desc{max-width:720px;font-size:.8rem;line-height:1.85;color:var(--v3-muted)}
.page-regels .rules-bg .section-desc,
.page-regels .faq-bg .section-desc,
.page-tips .equip-bg .section-desc,
.page-tips .faq-bg .section-desc{color:rgba(255,255,255,.62)}
.page-regels .info-grid,
.page-tips .info-grid,
.page-tips .tips-grid{gap:0;border-top:1px solid var(--v3-line);border-bottom:1px solid var(--v3-line)}
.page-regels .info-card,
.page-tips .info-card,
.page-tips .tip-card{padding:1.5rem;background:transparent;border:0}
.page-regels .info-card+.info-card,
.page-tips .info-card+.info-card,
.page-tips .tip-card+.tip-card{border-left:1px solid var(--v3-line)}
.page-regels .rules-grid,
.page-tips .equip-grid{gap:0;background:transparent;border-top:1px solid rgba(255,255,255,.14);border-left:1px solid rgba(255,255,255,.14)}
.page-regels .rule-card,
.page-tips .equip-card{background:transparent;border-right:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}
.page-regels .number-step,
.page-regels .highlight-card,
.page-tips .number-step,
.page-tips .highlight-card{border-radius:0}

/* Guides and articles */
.page-gids .guide-page,
.route-artikel .article-page{background:var(--v3-paper);color:var(--v3-ink)}
.page-gids .guide-hero,
.route-artikel .article-hero{
  position:relative;
  isolation:isolate;
  min-height:480px;
  display:flex;
  align-items:flex-end;
  padding:4rem 1.5rem 3.25rem;
  border:0;
  background:var(--v3-dark);
}
.page-gids .guide-hero:after,
.route-artikel .article-hero:after{content:"";position:absolute;inset:0 0 0 auto;width:min(28vw,400px);z-index:-1;border-left:1px solid rgba(255,255,255,.08);background:#141414}
.page-gids .guide-shell{max-width:var(--v3-shell)}
.page-gids .guide-hero h1,
.route-artikel .article-hero h1{font-size:clamp(3rem,5.5vw,5.2rem);line-height:.92;color:#fff}
.page-gids .guide-hero p,
.route-artikel .article-hero p{color:rgba(255,255,255,.76)}
.page-gids .guide-hero-card,
.route-artikel .article-side{background:#181818;border-color:rgba(255,255,255,.14)}
.page-gids .guide-section,
.route-artikel .article-body-section{background:var(--v3-paper);padding-top:4rem}
.page-gids .guide-toolbar h2{color:var(--v3-ink);font-size:clamp(2.5rem,4vw,3.8rem)}
.page-gids .guide-category-row span{border-color:var(--v3-line);color:#6d6761}
.page-gids .guide-grid{gap:0;border-top:1px solid var(--v3-line);border-left:1px solid var(--v3-line)}
.page-gids .guide-article-card{background:var(--v3-paper-strong);border:0;border-right:1px solid var(--v3-line);border-bottom:1px solid var(--v3-line);padding:1.5rem}
.page-gids .guide-article-card h3{color:var(--v3-ink);font-size:1.7rem}
.page-gids .guide-article-card p{color:var(--v3-muted)}
.page-gids .guide-article-card a{background:var(--v3-orange-dark);color:#fff}
.route-artikel .article-shell{max-width:1120px}
.route-artikel .article-body{background:transparent;border:0;padding:0;color:var(--v3-ink)}
.route-artikel .article-body h2,.route-artikel .article-body h3{color:var(--v3-ink)}
.route-artikel .article-body p,.route-artikel .article-body li{color:#514d49}
.route-artikel .article-summary{background:#fff;border:1px solid var(--v3-line);border-top:3px solid var(--v3-orange-dark)}
.route-artikel .article-pick-grid{gap:0;border-top:1px solid var(--v3-line);border-left:1px solid var(--v3-line)}
.route-artikel .article-pick-card{background:#fff;border:0;border-right:1px solid var(--v3-line);border-bottom:1px solid var(--v3-line)}
.route-artikel .article-pick-card h3,.route-artikel .article-pick-card p{color:var(--v3-ink)}
.route-artikel .article-pick-card p{color:var(--v3-muted)}
.route-artikel .article-picks{border-bottom-color:var(--v3-line)}
.route-artikel .article-section-head h2{color:var(--v3-ink)}
.route-artikel .article-text-link{color:var(--v3-orange-dark);border-bottom-color:var(--v3-orange)}
.route-artikel .article-pick-number{color:#766f68}
.route-artikel .article-pick-brand{color:#6c655f}
.route-artikel .article-pick-specs{border-top-color:var(--v3-line)}
.route-artikel .article-pick-specs div{border-bottom-color:var(--v3-line)}
.route-artikel .article-pick-specs dt{color:#6c655f}
.route-artikel .article-pick-specs dd{color:var(--v3-ink)}
.route-artikel .article-pick-fit{color:#625d58}
.route-artikel .article-pick-fit strong{color:var(--v3-ink)}
.route-artikel .article-pick-fit--caution strong{color:var(--v3-orange-dark)}
.route-artikel .article-affiliate-note{color:#6c655f}
.route-artikel .article-shop-link{background:var(--v3-orange-dark);color:#fff}
.route-artikel .article-final-cta{background:var(--v3-dark);border-top:3px solid var(--v3-orange)}

/* Racket and gear tools */
.page-rackets .rg-shell,
.page-gear .gear-shell{background:var(--v3-dark)}
.page-rackets .rg-hero,
.page-gear .gear-hero{min-height:470px;display:flex;align-items:flex-end;padding:4.5rem 2rem 3rem;border:0}
.page-rackets .rg-hero-inner,
.page-rackets .rg-main,
.page-rackets .rg-compare-wrap,
.page-gear .gear-hero-inner,
.page-gear .gear-main{max-width:var(--v3-shell)}
.page-rackets .rg-hero h1,
.page-gear .gear-hero h1{font:300 clamp(3.2rem,5.5vw,5.2rem)/.92 'Cormorant Garamond',serif;letter-spacing:0}
.page-rackets .rg-main,
.page-gear .gear-main{padding-top:3rem}
.page-rackets .rg-card,
.page-rackets .rg-side-card,
.page-rackets .rg-compare-card,
.page-gear .gear-filter-card,
.page-gear .gear-side-card,
.page-gear .gear-section-card{background:#161616;border-color:rgba(255,255,255,.1);box-shadow:none}
.page-rackets .rg-option,
.page-rackets .rg-option-mark,
.page-rackets .rg-question-badge,
.page-rackets .rg-progress,
.page-rackets .rg-score-bar{border-radius:0}
.page-rackets .rg-option{background:#1c1c1c}
.page-rackets .rg-option:hover,.page-rackets .rg-option.is-selected{background:#222}
.page-gear .gear-hero{
  background:#0b0b0b url('../images/hero/gear-hero.jpg') center 52%/cover no-repeat;
}
.page-gear .gear-hero:after{background:rgba(5,5,5,.3)}
.page-gear .gear-guide{border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.page-gear .gear-guide-card{border:0;border-right:1px solid rgba(255,255,255,.12);background:transparent}
.page-gear .gear-card{background:#1b1b1b;border-color:rgba(255,255,255,.1);box-shadow:none}

/* Courts, city browsing and city detail */
.page-banen .court-hero,
.page-city-index .city-hero,
.page-stad .city-page-hero{
  position:relative;
  min-height:500px;
  padding:4.5rem max(2rem,calc((100vw - var(--v3-shell))/2)) 3rem;
  align-items:flex-end;
  border:0;
  background:linear-gradient(90deg,rgba(5,5,5,.9),rgba(5,5,5,.58) 48%,rgba(5,5,5,.18)),linear-gradient(180deg,rgba(5,5,5,.1),rgba(5,5,5,.72)),url('../images/hero/banen-hero.png') center 54%/cover no-repeat;
}
.page-banen .court-hero h1,
.page-city-index .city-hero h1,
.page-stad .city-page-hero h1{font:300 clamp(3.2rem,5.8vw,5.4rem)/.9 'Cormorant Garamond',serif;letter-spacing:0}
.page-banen .court-hero p,
.page-city-index .city-hero p,
.page-stad .city-page-hero p{color:rgba(255,255,255,.8)}
.page-banen .courts-page-main,
.page-city-index .city-index-main,
.page-stad .city-page-main{background:var(--v3-dark)}
.page-banen .court-section,
.page-city-index .court-section,
.page-stad .court-section{padding-top:4rem;padding-bottom:4rem}
.page-banen .section-shell,
.page-city-index .section-shell,
.page-stad .section-shell{max-width:var(--v3-shell)}
.page-banen .featured-section,
.page-city-index .city-spotlight{background:var(--v3-paper);color:var(--v3-ink)}
.page-banen .featured-section .section-title,
.page-city-index .city-spotlight .section-title{color:var(--v3-ink);font-size:clamp(2.4rem,4vw,3.7rem)}
.page-banen .featured-section .section-desc,
.page-city-index .city-spotlight .section-desc{color:var(--v3-muted)}
.page-banen .featured-card{background:#fff;border-color:var(--v3-line);box-shadow:none}
.page-banen .featured-card h3,.page-banen .featured-card p{color:var(--v3-ink)}
.page-banen .featured-card p{color:var(--v3-muted)}
.page-banen .finder-panel,.page-banen .finder-results-wrap,
.page-city-index .city-filter-shell,.page-city-index .city-results-meta,
.page-stad .city-seo-card,.page-stad .city-guide-card,.page-stad .city-faq-card{box-shadow:none}
.page-banen .court-card,
.page-city-index .city-card,
.page-stad .court-card{background:#181818;border-color:rgba(255,255,255,.1);box-shadow:none}

/* Club detail */
.page-club .club-hero{padding:3.5rem 0 5rem;background:linear-gradient(135deg,#101010,#181818 68%,#2a1305)}
.page-club .club-shell{max-width:var(--v3-shell)}
.page-club .club-main{padding:2rem;background:transparent;border:0;border-top:3px solid var(--v3-orange)}
.page-club .club-main h1{font:300 clamp(3rem,5vw,4.8rem)/.92 'Cormorant Garamond',serif}
.page-club .club-meta-grid{gap:0;border-top:1px solid rgba(255,255,255,.12);border-left:1px solid rgba(255,255,255,.12)}
.page-club .club-meta-card{background:transparent;border:0;border-right:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.page-club .claim-card{background:#161616;box-shadow:none}
.page-club .club-map-card{box-shadow:none}

/* Privacy */
.page-privacy .privacy-page-main{background:var(--v3-paper);color:var(--v3-ink)}
.page-privacy .privacy-hero{min-height:430px;padding:4rem max(2rem,calc((100vw - var(--v3-shell))/2));background:linear-gradient(135deg,#101010,#1b1b1b 70%,#2a1305)}
.page-privacy .privacy-hero h1{font:300 clamp(3rem,5vw,4.8rem)/.92 'Cormorant Garamond',serif}
.page-privacy .privacy-section{padding:4rem max(2rem,calc((100vw - var(--v3-shell))/2));background:var(--v3-paper);color:var(--v3-ink)}
.page-privacy .privacy-card,.page-privacy .privacy-note{background:#fff;border-color:var(--v3-line);box-shadow:none}
.page-privacy .privacy-card h2,.page-privacy .privacy-card h3,.page-privacy .privacy-card p,.page-privacy .privacy-card li{color:var(--v3-ink)}

@media (max-width:900px){
  .page-regels .editorial-page>.hero,.page-tips .editorial-page>.hero{min-height:620px;flex-direction:column;align-items:flex-start;justify-content:flex-end}
  .page-regels .editorial-page>.hero .hero-right,.page-tips .editorial-page>.hero .hero-right{width:100%;flex:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .page-rackets .rg-hero,.page-gear .gear-hero{min-height:420px}
  .page-banen .court-hero,.page-city-index .city-hero,.page-stad .city-page-hero{min-height:450px}
}

@media (max-width:640px){
  body:not(.page-index) .breadcrumbs{padding:.7rem 1rem;font-size:.52rem}
  .page-regels .editorial-page>.hero,.page-tips .editorial-page>.hero{min-height:690px;padding:3rem 1rem 1.6rem;background-position:60% center}
  .page-regels .editorial-page>.hero h1,.page-tips .editorial-page>.hero h1{font-size:3.3rem;max-width:9ch}
  .page-regels .editorial-page>.hero .hero-right,.page-tips .editorial-page>.hero .hero-right{grid-template-columns:1fr 1fr}
  .page-regels .editorial-page>.hero .hero-right .hero-stat:last-child,.page-tips .editorial-page>.hero .hero-right .hero-stat:last-child{grid-column:1/-1}
  .page-regels .editorial-page>section:not(.hero),.page-tips .editorial-page>section:not(.hero){padding:3.5rem 1rem}
  .page-regels .section-title,.page-tips .section-title{font-size:2.45rem}
  .page-regels .info-grid,.page-tips .info-grid,.page-tips .tips-grid{grid-template-columns:1fr}
  .page-regels .info-card+.info-card,.page-tips .info-card+.info-card,.page-tips .tip-card+.tip-card{border-left:0;border-top:1px solid var(--v3-line)}
  .page-gids .guide-hero,.route-artikel .article-hero{min-height:520px;padding:3rem 1rem 2rem;background-position:60% center}
  .page-gids .guide-hero h1,.route-artikel .article-hero h1{font-size:3.25rem}
  .page-gids .guide-section,.route-artikel .article-body-section{padding-top:3rem}
  .page-rackets .rg-hero,.page-gear .gear-hero{min-height:500px;padding:3rem 1rem 2rem}
  .page-rackets .rg-hero h1,.page-gear .gear-hero h1{font-size:3.25rem}
  .page-banen .court-hero,.page-city-index .city-hero,.page-stad .city-page-hero{min-height:560px;padding:3rem 1rem 1.8rem;background-position:62% center}
  .page-banen .court-hero h1,.page-city-index .city-hero h1,.page-stad .city-page-hero h1{font-size:3.2rem}
  .page-banen .court-section,.page-city-index .court-section,.page-stad .court-section{padding-top:3rem;padding-bottom:3rem}
  .page-club .club-hero{padding:2rem 0 3rem}
  .page-club .club-main{padding:1.25rem 0}
  .page-club .club-main h1{font-size:3rem}
  .page-privacy .privacy-hero{min-height:480px;padding:3rem 1rem 2rem}
  .page-privacy .privacy-section{padding:3rem 1rem}
}
