/* Judô Regis — site overrides on top of BRQ design system */

:root {
  /* Brand palette */
  --jr-ink:        #0B1A2E;   /* deep navy — formal */
  --jr-ink-2:      #142841;
  --jr-paper:      #F5EFE5;   /* warm cream */
  --jr-paper-2:    #EAE2D2;
  --jr-paper-pure: #FFFFFF;
  --jr-gold:       #C9A876;   /* dan stripe */
  --jr-gold-deep:  #A8884F;
  --jr-black:      #0A0A0A;
  --jr-line:       rgba(11,26,46,0.14);
  --jr-line-ink:   rgba(255,255,255,0.16);
}

html, body {
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  color: var(--jr-ink);
  background: var(--jr-paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

*, *::before, *::after { box-sizing: border-box; }

button { font-family: inherit; cursor: pointer; }

/* Mono utility — small labels */
.jr-mono {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.jr-mono-sm { font-size: 11px; letter-spacing: 0.14em; }
.jr-mono-lg { font-size: 14px; letter-spacing: 0.10em; }

/* Display */
.jr-display {
  font-family: var(--font-display);
  font-weight: 450;
  letter-spacing: -0.025em;
  line-height: 0.96;
  margin: 0;
}

.jr-body {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.6;
  letter-spacing: 0;
}

/* Hairline */
.jr-hr {
  border: 0;
  border-top: 1px solid var(--jr-line);
  margin: 0;
}
.jr-hr-ink { border-top-color: var(--jr-line-ink); }

/* Selection */
::selection { background: var(--jr-gold); color: var(--jr-ink); }

/* Buttons */
.jr-btn {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 18px 28px;
  border-radius: 999px;
  border: none;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: transform 200ms var(--ease-out), background 200ms var(--ease-out), color 200ms;
}
.jr-btn:hover { transform: translateY(-1px); }
.jr-btn--primary { background: var(--jr-ink); color: #fff; }
.jr-btn--primary:hover { background: var(--jr-ink-2); }
.jr-btn--gold { background: var(--jr-gold); color: var(--jr-ink); }
.jr-btn--gold:hover { background: var(--jr-gold-deep); color: #fff; }
.jr-btn--ghost-light { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.5); }
.jr-btn--ghost-dark  { background: transparent; color: var(--jr-ink); border: 1.5px solid var(--jr-ink); }

/* Section eyebrow */
.jr-eyebrow {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--jr-gold-deep);
}
.jr-eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: currentColor;
}
.jr-eyebrow--ink { color: var(--jr-gold); }
.jr-eyebrow--no-line::before { display: none; }

/* Tag chip */
.jr-tag {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid currentColor;
  display: inline-block;
}

/* Subtle dot */
.jr-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--jr-gold);
}

/* Image filters */
.jr-photo-warm { filter: contrast(1.05) saturate(0.85); }

/* ==========================================================================
   RESPONSIVE LAYOUT
   ========================================================================== */

/* Container helper — used to cap content at 1600 on huge displays */
.jr-container {
  max-width: 1600px;
  margin: 0 auto;
  width: 100%;
}

/* Always provide horizontal section padding; bumps wider on big screens */
.jr-section-x {
  padding-left: 40px;
  padding-right: 40px;
}

/* === ULTRA-WIDE / 1920+ === */
@media (min-width: 1600px) {
  .jr-section-x { padding-left: 80px; padding-right: 80px; }
}
@media (min-width: 1920px) {
  :root { --type-display-xl: 168px; }
  .jr-section-x { padding-left: 120px; padding-right: 120px; }
}

/* === TABLET (≤1100px) === */
@media (max-width: 1100px) {
  .jr-grid-2 { grid-template-columns: 1fr !important; gap: 56px !important; }
  .jr-grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
  .jr-grid-4 { grid-template-columns: repeat(2, 1fr) !important; }
  .jr-sobre-judo-grid { grid-template-columns: 1fr !important; gap: 48px !important; }
  .jr-flip { display: flex !important; flex-direction: column !important; }
  .jr-flip > * { order: 0 !important; }
  .jr-sticky-off { position: static !important; top: auto !important; }
  .jr-hide-md { display: none !important; }
  .jr-section-pad-y { padding-top: 96px !important; padding-bottom: 96px !important; }
}

/* === MOBILE (≤720px) === */
@media (max-width: 720px) {
  .jr-section-x { padding-left: 20px !important; padding-right: 20px !important; }
  .jr-section-pad-y { padding-top: 72px !important; padding-bottom: 72px !important; }

  .jr-grid-3, .jr-grid-4, .jr-grid-2 {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .jr-grid-stat-mobile {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 24px !important;
  }

  .jr-display-mobile { font-size: 44px !important; line-height: 0.98 !important; }
  .jr-display-mobile-md { font-size: 36px !important; }
  .jr-display-mobile-sm { font-size: 28px !important; }

  .jr-hide-sm { display: none !important; }
  .jr-stack-sm { flex-direction: column !important; align-items: flex-start !important; }

  .jr-pad-mobile { padding: 28px !important; }
  .jr-gap-mobile-sm { gap: 16px !important; }
}

@media (max-width: 900px) {
  .jr-sobre-judo-pilares { grid-template-columns: 1fr !important; }
  .jr-sobre-judo-pilares article {
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding-bottom: 36px !important;
  }
  .jr-sobre-judo-pilares article:last-child { border-bottom: none; }
}

/* === Schedule grid scrolls horizontally on small screens === */
@media (max-width: 900px) {
  .jr-schedule-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 4px;
  }
  .jr-schedule-scroll > * { min-width: 720px; }
}

/* === Mobile nav: hide nav links, keep logo + CTA === */
@media (max-width: 900px) {
  .jr-nav-links { display: none !important; }
  .jr-header-meta { display: none !important; }
  .jr-header { padding-left: 20px !important; padding-right: 20px !important; }
}

/* Form layout shrink */
@media (max-width: 720px) {
  .jr-form-pad { padding: 28px 24px !important; }
  .jr-meta-row { grid-template-columns: 1fr !important; gap: 6px !important; }
}
