/*
Theme Name: Sébastien Truchi
Theme URI: https://www.sebastientruchi.com/
Author: Sébastien Truchi
Description: Thème blocs personnel pour les univers sport, musique et parfumerie.
Version: 0.1.0
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: sebastien-truchi
*/

:root {
  --st-ink: #17201e;
  --st-soft: #56605c;
  --st-paper: #f2f0e9;
  --st-light: #faf9f5;
  --st-acid: #d8ff52;
  --st-dark: #121817;
  --st-green: #315448;
  --st-line: rgba(23, 32, 30, .16);
}

html { scroll-behavior: smooth; }
body { background: var(--st-paper); }

.wp-site-blocks { overflow: hidden; }
.st-shell { padding: clamp(5rem, 9vw, 8rem) 6vw; }
.st-eyebrow {
  margin: 0 0 1.25rem;
  color: var(--st-soft);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.st-light { color: rgba(255,255,255,.7); }
.st-display {
  margin: 0;
  font-family: var(--wp--preset--font-family--display);
  font-size: clamp(4rem, 9vw, 9rem);
  font-weight: 400;
  letter-spacing: -.05em;
  line-height: .84;
}
.st-title {
  margin: 0;
  font-family: var(--wp--preset--font-family--display);
  font-size: clamp(3.7rem, 7vw, 7rem);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: .9;
}
.st-lead { font-size: clamp(1.25rem, 2vw, 1.8rem); line-height: 1.35; letter-spacing: -.025em; }

.st-header {
  position: relative;
  z-index: 20;
  min-height: 70px;
  padding: 0 3vw;
  border-bottom: 1px solid var(--st-line);
}
.st-header .wp-block-navigation { font-size: .82rem; font-weight: 600; }
.st-pill > a {
  padding: .65rem 1.15rem !important;
  border: 1px solid currentColor;
  border-radius: 999px;
}

.st-hero {
  min-height: 88vh;
  display: flex;
  align-items: flex-end;
  padding: 0 6vw 8vh;
}
.st-hero .wp-block-cover__background {
  background: linear-gradient(90deg, rgba(6,12,13,.83), rgba(6,12,13,.1) 72%),
              linear-gradient(0deg, rgba(6,12,13,.75), transparent 58%) !important;
  opacity: 1 !important;
}
.st-hero-copy { width: min(800px, 90vw); margin: 0 !important; }
.st-hero-intro { max-width: 620px; color: rgba(255,255,255,.78); font-size: clamp(1.05rem, 1.5vw, 1.4rem); }

.st-universes { gap: 0; }
.st-universe {
  min-height: 570px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 2.6rem;
}
.st-universe h2 { font-size: clamp(4rem, 6vw, 6.4rem); }
.st-universe-sport {
  color: #fff;
  background: linear-gradient(0deg, rgba(8,15,15,.88), transparent 75%),
              url("assets/images/hero-sebastien-truchi.png") 25% center / auto 105% no-repeat;
}
.st-universe-music { color: #2b211a; background: linear-gradient(135deg, #c78c58, #edd5b8); }
.st-universe-business { color: #fff; background: linear-gradient(145deg, #34271d, #81502d 58%, #1b1b18); }

.st-dark-section { color: #fff; background: var(--st-dark); }
.st-stat-grid { border-top: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.st-stat { padding: 1.5rem; border-right: 1px solid rgba(255,255,255,.18); }
.st-stat:last-child { border-right: 0; }
.st-stat strong { display: block; font-family: var(--wp--preset--font-family--display); font-size: 3rem; font-weight: 400; }
.st-stat span { color: rgba(255,255,255,.55); font-size: .68rem; text-transform: uppercase; }

.st-instagram { background: var(--st-light); }
.st-instagram-grid { gap: 1.2rem; }
.st-instagram-card {
  aspect-ratio: 1;
  display: flex;
  align-items: flex-end;
  padding: 1.5rem;
  background: linear-gradient(145deg, #20332e, #8b5832);
}
.st-instagram-card:nth-child(2) { background: linear-gradient(145deg, #7f9aa5, #e4e8e6); }
.st-instagram-card:nth-child(3) { background: linear-gradient(145deg, #4a2414, #d19a68); }
.st-instagram-card p { margin: 0; color: rgba(255,255,255,.84); font-size: .75rem; font-weight: 600; text-transform: uppercase; }

.st-inner-hero { min-height: 76vh; }
.st-tabs {
  position: sticky;
  z-index: 10;
  top: 0;
  min-height: 64px;
  padding: 0 6vw;
  background: rgba(242,240,233,.96);
  border-bottom: 1px solid var(--st-line);
  backdrop-filter: blur(12px);
}
.st-tabs .wp-block-navigation { font-size: .75rem; font-weight: 600; }

.st-card-grid { gap: 0; }
.st-discipline-card,
.st-business-card {
  min-height: 570px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 2.5rem;
}
.st-discipline-card h3,
.st-business-card h3 {
  margin: 0 0 1rem;
  font-family: var(--wp--preset--font-family--display);
  font-size: clamp(3.8rem, 6vw, 6rem);
  font-weight: 400;
  line-height: .88;
}
.st-triathlon { color:#fff; background: linear-gradient(0deg,rgba(8,14,14,.9),transparent),url("assets/images/hero-sebastien-truchi.png") 25% center/auto 105% no-repeat; }
.st-ski { color:#fff; background: linear-gradient(135deg,#8fa9b5,#e9eeed 55%,#536c70); }
.st-judo { color:#fff; background: linear-gradient(135deg,#191b1b,#515656); }
.st-business-france { color:#fff; background:#314b41; }
.st-business-lpg { color:#2f241c; background:#d4aa7c; transform: translateY(-24px); box-shadow:0 25px 70px rgba(36,28,22,.22); }
.st-business-usa { color:#fff; background:#282a27; }

.st-facts { gap: 1.2rem; }
.st-fact { min-height: 175px; padding: 1.5rem; background: var(--st-light); border-top: 2px solid var(--st-ink); }
.st-fact h3 { margin: 2rem 0 .5rem; font-family: var(--wp--preset--font-family--display); font-size: 1.9rem; font-weight: 400; }
.st-fact p { color: var(--st-soft); font-size: .82rem; }

.st-footer { padding: 1.5rem 3vw; color: rgba(255,255,255,.65); background: var(--st-dark); font-size: .72rem; }

@media (max-width: 782px) {
  .st-shell { padding: 5rem 1.5rem; }
  .st-hero { min-height: 760px; padding: 0 1.5rem 5rem; }
  .st-display { font-size: clamp(4.3rem, 18vw, 6rem); }
  .st-universe, .st-discipline-card, .st-business-card { min-height: 430px; padding: 1.75rem; }
  .st-stat { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.18); }
  .st-business-lpg { transform: none; }
  .st-tabs { padding: 0 1.5rem; overflow-x: auto; }
}