/* ===================================================================
   SOS TOUTOU ROYAL CANIN — RC Premium Theme Override
   Pantone 485C = #ed1c24 | Blanc dominant 80% | Barlow (DIN Pro)
   =================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,700&family=Barlow+Condensed:wght@400;600;700;800;900&display=swap');

:root {
  --rc-red:       #ed1c24;
  --rc-red-dk:    #c8101a;
  --rc-red-lt:    #fde8e9;
  --rc-white:     #ffffff;
  --rc-bg:        #f5f5f5;
  --rc-bg-warm:   #fafaf8;
  --rc-black:     #222222;
  --rc-grey-dk:   #3d3d3d;
  --rc-grey-md:   #6b6b6b;
  --rc-grey-lt:   #f5f5f5;
  --rc-grey-bd:   #e0e0e0;
  --rc-text:      #222222;

  --font:         'Barlow', 'DIN Pro', Arial, sans-serif;
  --font-cond:    'Barlow Condensed', 'DIN Pro Condensed', Arial, sans-serif;

  --text-xs:  13px;
  --text-sm:  15px;
  --text-md:  17px;
  --text-lg:  20px;
  --text-xl:  24px;
  --text-2xl: 30px;
  --text-3xl: 38px;

  --radius:    10px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  --shadow:    0 2px 10px rgba(0,0,0,.08);
  --shadow-md: 0 4px 20px rgba(0,0,0,.12);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.10);
  --shadow-red: 0 4px 20px rgba(237,28,36,.2);

  --ease: .25s cubic-bezier(.4,0,.2,1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font) !important;
  color: var(--rc-text);
  background: var(--rc-white) !important;
  -webkit-font-smoothing: antialiased;
  line-height: 1.55;
  min-height: 100vh;
}

/* --- NAVIGATION OVERRIDE --- */
.rc-nav,
.nav,
.rc-header,
header.header,
nav {
  background: var(--rc-red) !important;
  border-bottom: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.15) !important;
}
.rc-nav a, .nav a, .rc-header a, header.header a {
  color: rgba(255,255,255,.85) !important;
}
.rc-nav a:hover, .nav a:hover, .rc-header a:hover, header.header a:hover {
  color: white !important;
}
.rc-nav-brand, .nav-brand, .header-logo, .rc-header-logo {
  color: white !important;
}
.rc-nav-brand span, .header-logo span, .rc-header-logo span {
  color: rgba(255,255,255,.8) !important;
}
.header-badge, .rc-header-badge, .rc-nav-badge, .nav-badge {
  background: rgba(255,255,255,.2) !important;
  color: white !important;
}

/* --- BUTTONS --- */
.rc-btn,
.module-cta,
.scard-cta.go,
.disc-accept,
.animal-cta,
.info-continue-btn,
.cam-btn,
button[style*="background:#de2b33"],
button[style*="background:var(--rc-red)"] {
  background: var(--rc-red) !important;
  color: white !important;
  border-radius: var(--radius) !important;
  font-family: var(--font) !important;
  font-weight: 700 !important;
  transition: all var(--ease) !important;
}
.rc-btn:hover,
.module-cta:hover,
.scard-cta.go:hover,
.disc-accept:hover,
.animal-cta:hover,
.info-continue-btn:hover,
.cam-btn:hover {
  background: var(--rc-red-dk) !important;
  transform: translateY(-1px) !important;
}

.rc-btn-outline {
  background: white !important;
  color: var(--rc-red) !important;
  border: 2px solid var(--rc-red) !important;
}
.rc-btn-outline:hover {
  background: var(--rc-red-lt) !important;
}

/* --- CARDS --- */
.rc-card,
.module-card,
.scard {
  background: white !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow) !important;
  border: 1.5px solid var(--rc-grey-bd) !important;
  transition: all var(--ease) !important;
}
.rc-card:hover,
.module-card:hover,
.scard:hover {
  border-color: var(--rc-red) !important;
  box-shadow: var(--shadow-md) !important;
  transform: translateY(-3px) !important;
}

/* --- BADGES --- */
.rc-badge-red, .module-badge.active, .scard-badge.live {
  background: var(--rc-red) !important;
  color: white !important;
}

/* --- TYPOGRAPHY OVERRIDE --- */
h1, h2, h3, h4 {
  font-family: var(--font-cond) !important;
  font-weight: 800 !important;
  color: var(--rc-text) !important;
}
h1 em, h2 em, .hero-title em {
  color: var(--rc-red) !important;
}

/* --- FOOTER OVERRIDE --- */
.rc-footer,
footer,
.footer {
  background: var(--rc-grey-dk) !important;
  color: rgba(255,255,255,.7) !important;
  text-align: center !important;
  padding: 24px 16px !important;
  font-size: var(--text-xs) !important;
  line-height: 2 !important;
}
.rc-footer strong, footer strong, .footer strong {
  color: white !important;
}

/* --- LEGAL BAND --- */
.legal-band,
.rc-disclaimer-band,
.legal {
  background: #fff8e1 !important;
  border-top: 3px solid var(--rc-red) !important;
  font-size: var(--text-xs) !important;
  color: #5c3a00 !important;
}

/* --- FORM INPUTS --- */
.info-input:focus,
.info-select:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--rc-red) !important;
  box-shadow: 0 0 0 3px rgba(237,28,36,.1) !important;
}
.info-radio.selected,
.info-check.checked {
  border-color: var(--rc-red) !important;
  background: var(--rc-red-lt) !important;
  color: var(--rc-red) !important;
}

/* --- STEP INDICATOR --- */
.step-circle.active {
  border-color: var(--rc-red) !important;
  background: var(--rc-red) !important;
}
.step-label.active {
  color: var(--rc-red) !important;
}

/* --- SELECTED STATES --- */
.animal-card.selected,
.breed-item.selected {
  border-color: var(--rc-red) !important;
  box-shadow: 0 0 0 4px rgba(237,28,36,.12), 0 8px 24px rgba(237,28,36,.15) !important;
}
.animal-card.selected::after,
.breed-item.selected::after {
  background: var(--rc-red) !important;
}

/* --- SCORE BAR --- */
.score-bar-fill,
.rc-progress-bar {
  background: var(--rc-red) !important;
}

/* --- URGENCY BAND --- */
.urgence-inner {
  background: var(--rc-red) !important;
}

/* --- RESPONSIVE --- */
@media (max-width: 600px) {
  :root {
    --text-md: 16px;
    --text-lg: 18px;
    --text-xl: 22px;
    --text-2xl: 26px;
    --text-3xl: 30px;
  }
  .rc-btn, .module-cta { font-size: 16px !important; }
}