/* ============================================================
   Elys v3 – Kompletní redesign
   Modrá paleta + Playfair Display / DM Sans + nový styl karet
   Tento soubor se načítá jako POSLEDNÍ → přepíše vše výše
============================================================ */

/* ── CSS proměnné – nová paleta ────────────────────────────── */
:root {
  /* Primární modrá (nahrazuje zelenou) */
  --elys-blue:         #2563eb;
  --elys-blue-dark:    #1d4ed8;
  --elys-blue-soft:    #60a5fa;
  --elys-blue-tint:    rgba(37, 99, 235, 0.10);
  --elys-blue-border:  rgba(37, 99, 235, 0.30);

  /* Zpětná kompatibilita – aliasy na modrou */
  --elys-green:        #2563eb;
  --elys-green-dark:   #1d4ed8;
  --elys-green-soft:   #60a5fa;
  --elys-green-tint:   rgba(37, 99, 235, 0.10);
  --elys-orange:       #2563eb;
  --elys-orange-soft:  #60a5fa;
  --elys-peach:        rgba(37, 99, 235, 0.10);
  --elys-mint:         rgba(37, 99, 235, 0.08);
  --elys-lavender:     rgba(37, 99, 235, 0.12);
  --elys-sky:          rgba(37, 99, 235, 0.08);

  /* Šedá paleta */
  --elys-bg:           #f5f5f5;
  --elys-bg-secondary: #eeeeee;
  --elys-card-bg:      #ffffff;
  --elys-text:         #1a1a1a;
  --elys-muted:        #666666;

  /* Tmavé sekce */
  --elys-dark:         #2d2d2d;
  --elys-darker:       #222222;
  --elys-dark-text:    #f0f0f0;
  --elys-dark-muted:   #999999;

  /* Template aliasy */
  --theme:             #2563eb;
  --action:            #2563eb;
}

/* ── Body pozadí – šedé místo béžového ─────────────────────── */
body {
  background-color: #f5f5f5 !important;
  font-family: 'DM Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  color: #1a1a1a !important;
}

/* ── Navbar – šedé pozadí ───────────────────────────────────── */
header.header-area-2,
header.header-area-2.header-sticky,
.header-sticky.sticky,
.header-sticky.transformed {
  background: #f5f5f5 !important;
}

/* ── Navbar – modrá hover/active barva (přepis zelené) ─────── */
.header-area-2 .main-menu li a:hover,
.header-area-2 .main-menu li a:focus,
.header-area .main-menu li a:hover,
.main-menu > ul > li:hover > a,
.main-menu ul.dp-menu li a:hover {
  color: #2563eb !important;
}

/* ── Font systém – DM Sans všude, Playfair Display pro h1 ──── */

/* DM Sans – celý web */
body, p, li, span, a, button, input, textarea, select,
nav, .main-menu ul li a, .menu ul li a,
h2, h3, h4, h5, h6,
.section-title, .page-title,
.rr-btn, .rr-btn .text-one, .rr-btn .text-two,
.rr-btn-underline, footer, .footer-area-2,
.accordion-button, .accordion-body,
.elys-submit-btn, .elys-chip,
.elys-chat, .elys-modal {
  font-family: 'DM Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* ── Playfair Display – VŠECHNY patkové nadpisy (sjednocení) ──
   Přepíše IBM Plex Serif z elys-custom.css všude */

/* span uvnitř nadpisů dědí Playfair (přepis DM Sans pravidla výše) */
h1 span, h2 span, h3 span,
.font-sequelsans-romanbody span,
.font-heading-sequelsans-romanbody h1 span,
.font-heading-sequelsans-romanbody h2 span,
.font-heading-sequelsans-romanbody h3 span {
  font-family: 'Playfair Display', Georgia, serif !important;
}

/* h1 – hero styl, Playfair Display */
h1,
h1.font-sequelsans-romanbody,
.font-sequelsans-romanbody h1,
.font-heading-sequelsans-romanbody h1,
.hero-area-3 .section-title,
.hero-area-3 h1,
.hero-area-3-inner .section-title,
.hero-area-3-inner h1,
.hero-area-service-details .section-title,
.hero-area-service-details h1,
.page-title-wrapper .page-title,
.page-title-wrapper h1 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
}

/* h2, h3 a sekční nadpisy – Playfair Display, tučnější */
h2,
h2.font-sequelsans-romanbody,
.font-sequelsans-romanbody h2,
.font-heading-sequelsans-romanbody h2,
.section-title,
.section-title.font-sequelsans-romanbody,
.page-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
}

h3,
h3.font-sequelsans-romanbody,
.font-heading-sequelsans-romanbody h3 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.015em !important;
}

/* startup-agency (homepage) – Playfair pro všechny nadpisy */
.body-startup-agency h1,
.body-startup-agency .hero-area-3 .section-title,
.body-startup-agency .hero-area-3-inner .section-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 300 !important;
}

.body-startup-agency h2,
.body-startup-agency h3,
.body-startup-agency .section-title,
.body-startup-agency .title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
}

/* h4–h6 zůstávají DM Sans */
.body-startup-agency h4,
.body-startup-agency h5,
.body-startup-agency h6 {
  font-family: 'DM Sans', 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

/* ── KARTY – světlé pozadí ─────────────────────────────────── */

/* Obecné karty, service boxy, approach boxy, feature boxy */
.service-box,
.feature-box,
.approach-box,
.work-box,
.blog,
.elys-value-card,
.elys-stat-card,
.elys-testimonial-card,
.elys-team-card,
.portfolio-box,
.team-box,
.pricing-box,
[class*="-card"]:not([class*="__"]):not([class*="-card-"]),
[class*="-box"]:not(.approach-box):not(.feature-box):not(.service-box):not(.elys-chat):not(.elys-chat__bar):not(.mm-icon):not(.elys-icon-dot):not(.elys-orb):not(.breadcrumb-box):not(.elys-cookie-box):not(.elys-cookie-custom-panel):not(.elys-chat__panel):not(.elys-modal):not([class*="cookie"]) {
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 14px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

/* Approach + feature boxy – specifičtěji */
.approach-box,
.feature-box {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}

/* Service boxy */
.service-box {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}

/* Hover – modrý border glow */
.service-box:hover,
.feature-box:hover,
.approach-box:hover,
.work-box:hover,
.elys-value-card:hover,
.elys-stat-card:hover,
.elys-team-card:hover,
[class*="-card"]:hover,
[class*="-box"]:hover:not(.elys-chat):not(.elys-chat__bar):not(.mm-icon):not(.elys-icon-dot) {
  border-color: rgba(37, 99, 235, 0.4) !important;
  box-shadow: 0 4px 20px rgba(37, 99, 235, 0.10) !important;
  transform: translateY(-4px);
}

/* Approach box hover – specifický */
.approach-box:hover {
  background: rgba(37, 99, 235, 0.02) !important;
  border-color: rgba(37, 99, 235, 0.35) !important;
  box-shadow: 0 4px 20px rgba(37, 99, 235, 0.10) !important;
}

/* Stat card */
.elys-stat-card {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}

.elys-stat-card .stat-number {
  color: #2563eb !important;
}

/* Value card */
.elys-value-card {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 14px !important;
}

.elys-value-card:hover {
  border-color: rgba(37, 99, 235, 0.4) !important;
  box-shadow: 0 4px 20px rgba(37, 99, 235, 0.10) !important;
}

/* Testimonial card */
.elys-testimonial-card {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 14px !important;
}

/* ── KARTY na tmavém pozadí ────────────────────────────────── */
.dark .service-box,
.dark .feature-box,
.dark .approach-box,
.dark .work-box,
.dark .elys-value-card,
.dark .elys-stat-card,
.dark [class*="-card"],
.dark [class*="-box"]:not(.elys-chat):not(.mm-icon):not(.elys-icon-dot) {
  background: #333333 !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2) !important;
}

.dark .service-box:hover,
.dark .feature-box:hover,
.dark .approach-box:hover,
.dark .work-box:hover,
.dark .elys-value-card:hover,
.dark [class*="-card"]:hover,
.dark [class*="-box"]:hover:not(.elys-chat):not(.mm-icon):not(.elys-icon-dot) {
  border-color: rgba(37, 99, 235, 0.4) !important;
  box-shadow: 0 4px 20px rgba(37, 99, 235, 0.12) !important;
}

/* ── TLAČÍTKA ──────────────────────────────────────────────── */

/* Primární tlačítko */
.rr-btn {
  background-color: #2563eb !important;
  border-color: #2563eb !important;
  border-radius: 8px !important;
  color: #ffffff !important;
}
.rr-btn:hover {
  background-color: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.28) !important;
}
.rr-btn::before {
  background-color: #1d4ed8 !important;
}
.rr-btn .btn-wrap .text-one,
.rr-btn .btn-wrap .text-two {
  color: #ffffff !important;
}

/* Group button */
.rr-btn.rr-btn-group {
  border: 1.5px solid #2563eb !important;
}
.rr-btn.rr-btn-group .b {
  background: #2563eb !important;
}
.rr-btn.rr-btn-group:hover {
  background: #2563eb !important;
  border-color: #2563eb !important;
}

/* Header outlined tlačítko */
.header__button .rr-btn,
.offset-button .rr-btn {
  background: transparent !important;
  border: 1.5px solid #2563eb !important;
  color: #2563eb !important;
}
.header__button .rr-btn:hover,
.offset-button .rr-btn:hover {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

/* Ghost bílé tlačítko */
.rr-btn[style*="background:#fff"]:hover {
  background-color: rgba(37, 99, 235, 0.06) !important;
  border-color: #2563eb !important;
  color: #2563eb !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.12) !important;
}
.rr-btn[style*="background:#fff"]:hover .btn-wrap .text-one,
.rr-btn[style*="background:#fff"]:hover .btn-wrap .text-two {
  color: #2563eb !important;
}
.rr-btn[style*="background:#fff"]::before {
  background-color: rgba(37, 99, 235, 0.06) !important;
}

/* Submit button */
.elys-submit-btn {
  background: #2563eb !important;
  border-radius: 8px !important;
}
.elys-submit-btn:hover {
  background: #1d4ed8 !important;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.28) !important;
}

/* ── COOKIE BANNER – pojistka (tmavé pozadí zachovat vždy) ──── */
.elys-cookie-box,
.elys-cookie-custom-panel,
#elys-cookie-overlay .elys-cookie-box {
  background: #0d1117 !important;
  border: 1px solid rgba(255,255,255,0.11) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.45) !important;
}
.elys-cookie-title {
  color: #ffffff !important;
}
.elys-cookie-text {
  color: rgba(255,255,255,0.72) !important;
}
.elys-cookie-link {
  color: #60a5fa !important;
}
.elys-cookie-btn {
  color: rgba(255,255,255,0.75) !important;
  border-color: rgba(255,255,255,0.2) !important;
}
.elys-cookie-btn--accept {
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}

/* ── BADGES a PILL TAGY ────────────────────────────────────── */

/* Jen textové labely (bez pozadí) → modrý text */
.elys-section-label,
.section-subtitle {
  color: #2563eb !important;
}

/* mm-badge – bílý text na modrém pozadí */
.mm-badge {
  background: #2563eb !important;
  color: #ffffff !important;
}

/* prc-badge (pricing card "Nejpopulárnější") – bílý text */
.prc-badge {
  color: #ffffff !important;
}

.elys-promo__badge {
  background: rgba(37, 99, 235, 0.10) !important;
  border: 1px solid rgba(37, 99, 235, 0.30) !important;
  color: #2563eb !important;
}

.elys-promo__icon {
  background: linear-gradient(135deg, #2563eb 0%, #60a5fa 100%) !important;
}

.elys-promo__link {
  color: #2563eb !important;
}
.elys-promo__link:hover { color: #1d4ed8 !important; }

/* ── FORMULÁŘE ─────────────────────────────────────────────── */
.elys-input,
.elys-form--light .elys-input,
input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
  border: 1.5px solid #e0e0e0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  padding: 10px 16px !important;
}

.elys-input:focus,
.elys-form--light .elys-input:focus,
input:focus:not([type="checkbox"]):not([type="radio"]),
textarea:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10) !important;
  background: #ffffff !important;
}

.elys-form--light .elys-input:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.08) !important;
}

.elys-form--light .elys-chip:hover {
  border-color: #2563eb !important;
  color: #2563eb !important;
  background: rgba(37, 99, 235, 0.05) !important;
}

.elys-form--light .elys-chip--active {
  background: rgba(37, 99, 235, 0.08) !important;
  border-color: #2563eb !important;
  color: #2563eb !important;
}

.elys-chip--active {
  background: #2563eb !important;
  border-color: #2563eb !important;
}

.elys-chip:hover {
  border-color: #2563eb !important;
}

/* ── NAVIGACE – aktivní stav ───────────────────────────────── */
.menu ul li a::after,
.main-menu ul li a::after {
  background: #2563eb !important;
}

.menu ul li a.is-active,
.main-menu ul li a.is-active {
  color: #2563eb !important;
}

/* Mega menu footer link */
.mm-footer a {
  color: #2563eb !important;
}

/* ── FOOTER – světlé ───────────────────────────────────────── */
.sc-footer {
  background: #ffffff !important;
  border-top: 1px solid #e0e0e0 !important;
}

.footer-nav-list li a:hover {
  color: #2563eb !important;
}

/* ── APPROACH BOX – číslo hover ────────────────────────────── */
.approach-box:hover .number {
  color: #2563eb !important;
}

.dark .approach-box:hover .number {
  color: #2563eb !important;
}

/* ── FUNFACT – číslo ───────────────────────────────────────── */
.funfact-area-2 .section-content .year {
  color: #2563eb !important;
}

/* ── BLOG – šipka ──────────────────────────────────────────── */
.service-box:hover .rr-btn-underline,
.blog:hover .rr-btn-underline {
  color: #2563eb !important;
}

/* ── CTA STRIP – tmavé ─────────────────────────────────────── */
.elys-cta-strip {
  background: #2d2d2d !important;
  border-radius: 14px !important;
}

/* ── PROGRESS / SCROLL ──────────────────────────────────────── */
.progress-wrap svg.progress-circle path {
  stroke: #2563eb !important;
}

/* ── BREADCRUMB ─────────────────────────────────────────────── */
.breadcrumb-item a:hover {
  color: #2563eb !important;
}

/* ── CHAT – akcentová barva ─────────────────────────────────── */
.elys-chat__bar.expanded {
  border-color: rgba(37, 99, 235, 0.35) !important;
}

.elys-chat__bar-send,
.elys-chat__foot-send {
  background: #2563eb !important;
}

.elys-chat__bar-send:hover,
.elys-chat__foot-send:hover {
  background: #1d4ed8 !important;
}

.elys-msg--user {
  background: #2563eb !important;
}

.elys-chat__foot-input:focus {
  border-color: rgba(37, 99, 235, 0.5) !important;
}

/* ── MODÁL – linky ─────────────────────────────────────────── */
.elys-modal__body a {
  color: #2563eb !important;
}

.elys-modal .accordion-button:not(.collapsed) {
  color: #2563eb !important;
  background: rgba(37, 99, 235, 0.04) !important;
}

.elys-modal__support-item:hover {
  color: #2563eb !important;
}

.elys-modal__support-icon {
  color: #2563eb !important;
}

/* ── KONTAKT – ikonky ──────────────────────────────────────── */
.elys-contact-link:hover {
  color: #2563eb !important;
}

.elys-contact-icon {
  color: #2563eb !important;
}

.elys-contact-link:hover .elys-contact-icon {
  background: rgba(37, 99, 235, 0.12) !important;
  border-color: rgba(37, 99, 235, 0.3) !important;
}

.elys-input:focus {
  border-color: #2563eb !important;
  background: rgba(37, 99, 235, 0.04) !important;
}

/* ── GRADIENT VISUAL – modrá verze ─────────────────────────── */
.elys-gradient-visual {
  background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 25%, #e0f2fe 60%, #bfdbfe 100%) !important;
}

.elys-gradient-visual::before {
  background: radial-gradient(ellipse, rgba(37, 99, 235, 0.30) 0%, transparent 65%) !important;
}

.elys-gradient-visual--orange {
  background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 40%, #e0f2fe 100%) !important;
}

.elys-gradient-visual--mint {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 40%, #bfdbfe 100%) !important;
}

/* ── ORB ────────────────────────────────────────────────────── */
.elys-orb--orange {
  background: radial-gradient(circle, #2563eb 0%, transparent 70%) !important;
}

/* ── ICON DOT – orange varianta → modrá ────────────────────── */
.elys-icon-dot--orange {
  background: linear-gradient(135deg, #2563eb, #60a5fa) !important;
}

/* ── SERVICE BOX – rr-btn-underline barva ───────────────────── */
.service-box:hover .rr-btn-underline,
.service-area .service-box:hover .rr-btn-underline {
  color: #2563eb !important;
}

/* ── SEKCE POZADÍ ───────────────────────────────────────────── */

/* Světlé sekce – šedé místo béžových/krémových */
.section-bg,
[class*="section-bg"],
.cta-area:not(.dark),
.pricing-area:not(.dark),
.faq-area:not(.dark),
.subscribe-area:not(.dark) {
  background-color: #eeeeee !important;
}

/* Tmavé sekce – tmavě šedé */
.dark,
[class*="dark-bg"],
.footer-area-2,
.footer-area-inner-page {
  background-color: #2d2d2d !important;
}

/* ── GDPR checkbox ──────────────────────────────────────────── */
.elys-gdpr input[type="checkbox"] {
  accent-color: #2563eb !important;
}

.elys-gdpr-link:hover {
  color: #2563eb !important;
}

/* ── FAQ ACCORDION ──────────────────────────────────────────── */
.accordion-button:not(.collapsed) {
  color: #2563eb !important;
}

/* ── DARK SEKCE – service boxy ──────────────────────────────── */
.dark .service-area-5 .service-box:hover {
  border-color: rgba(37, 99, 235, 0.3) !important;
}

/* ── WORK BOX DARK ──────────────────────────────────────────── */
.dark .work-box:hover .title a {
  color: #2563eb !important;
}

/* ── CTA DARK ──────────────────────────────────────────────── */
.dark .cta-area-4 .section-title a:hover {
  color: #60a5fa !important;
}

/* ── PAGE TITLE AREA ────────────────────────────────────────── */
.page-title-area-inner {
  border-bottom-color: #e0e0e0 !important;
}

/* ── DIVIDER ────────────────────────────────────────────────── */
.elys-divider {
  border-top-color: #e0e0e0 !important;
}

/* ── SUBSCRIBE FORM DARK ────────────────────────────────────── */
.dark .subscribe-form .input-field input:focus {
  border-color: rgba(37, 99, 235, 0.5) !important;
}

/* ── FOOTER NAV DARK ────────────────────────────────────────── */
.dark .footer-nav-list li a:hover {
  color: #60a5fa !important;
}

/* ══════════════════════════════════════════════════════════════
   MOBILNÍ MENU – přepis hardcoded #059669 hodnot
══════════════════════════════════════════════════════════════ */

/* Ikony v submenu (briefcase, blog…) */
.sc-mob-acc__body a i {
  color: #2563eb !important;
}

/* "Zobrazit všechny služby" link */
.sc-mob-acc__body-all {
  color: #2563eb !important;
}

/* Hover na CTA tlačítku */
.sc-mob-cta:hover {
  background: #2563eb !important;
}

/* Ghost CTA (Ceny) – modrý border a hover text */
.sc-mob-cta--ghost {
  border-color: #2563eb !important;
  color: #2563eb !important;
}
.sc-mob-cta--ghost:hover {
  background: rgba(37, 99, 235, 0.06) !important;
  color: #2563eb !important;
}

/* Aktivní/otevřený accordion – modrý indikátor */
.sc-mob-acc.open .sc-mob-link {
  color: #2563eb !important;
}

/* ══════════════════════════════════════════════════════════════
   rr-btn (template primární tlačítka) → modrá
══════════════════════════════════════════════════════════════ */
.rr-btn {
  background-color: #2563eb !important;
  border-color: #2563eb !important;
  color: #fff !important;
}
.rr-btn:hover {
  background-color: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.25) !important;
}
.rr-btn::before {
  background-color: #1d4ed8 !important;
}
.rr-btn.rr-btn-group {
  border-color: #2563eb !important;
}
.rr-btn.rr-btn-group .b {
  background: #2563eb !important;
}
