/* Visual refresh inspired by DigitaleEuroApp.de V7 */
:root{
  --refresh-bg:#eef3fb;
  --refresh-card:#ffffff;
  --refresh-text:#0b1f3a;
  --refresh-muted:#4b5e78;
  --refresh-line:#cfd9e8;
  --refresh-brand:#0057d9;
  --refresh-brand2:#003b91;
  --refresh-accent:#12a36d;
  --refresh-soft:#eaf2ff;
}

body{
  background:
    radial-gradient(circle at top right, rgba(0,87,217,.08), transparent 34%),
    linear-gradient(180deg,#f8fbff 0%,#eef3fb 100%) !important;
  color:var(--refresh-text) !important;
}

header, .site-header{
  background:rgba(255,255,255,.97) !important;
  border-bottom:1px solid rgba(11,31,58,.10) !important;
  box-shadow:0 6px 24px rgba(11,31,58,.05) !important;
}

nav a{
  color:#243954 !important;
  font-weight:650;
}
nav a:hover{
  color:var(--refresh-brand) !important;
  text-decoration:none;
}

.hero, .hero-section, section.hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#071a36 0%,#0a3e85 58%,#0062d7 100%) !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.hero::after, .hero-section::after{
  content:"";
  position:absolute;
  right:-120px;
  top:-120px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  pointer-events:none;
}
.hero .container, .hero-section .container{position:relative;z-index:2}

/* Hero headline intentionally ~50% smaller than DigitaleEuroApp.de V7 */
.hero h1, .hero-section h1, section.hero h1{
  font-size:clamp(1.2rem,3vw,2.2rem) !important;
  line-height:1.12 !important;
  letter-spacing:-.025em !important;
  color:#fff !important;
  max-width:900px;
  text-shadow:0 2px 16px rgba(0,0,0,.15);
}
.hero p, .hero .lead, .hero-section p, .hero-section .lead{
  color:#dce9ff !important;
}
.hero .eyebrow, .hero-section .eyebrow{
  color:#8fd0ff !important;
  font-weight:800;
}

.card, .box, .content-card{
  background:#fff !important;
  border:1px solid rgba(13,59,116,.10) !important;
  box-shadow:0 14px 36px rgba(24,50,84,.08) !important;
  border-radius:18px !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover, .box:hover, .content-card:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 48px rgba(24,50,84,.12) !important;
  border-color:rgba(0,87,217,.22) !important;
}

h2{color:#102a4f !important}
h3{color:#153156 !important}

.btn, .button, a.button, button{
  border-radius:10px !important;
}
.btn-primary, .btn, a.btn{
  background:linear-gradient(180deg,#0a67f0 0%,#0057d9 100%) !important;
  border-color:#0057d9 !important;
  color:#fff !important;
  box-shadow:0 8px 20px rgba(0,87,217,.22) !important;
}
.btn-primary:hover, .btn:hover, a.btn:hover{
  background:linear-gradient(180deg,#075bcf 0%,#0049b7 100%) !important;
  text-decoration:none !important;
}

table{
  background:#fff;
}
th{
  background:#e8f1fc !important;
  color:#17345b !important;
}

footer, .footer, .site-footer{
  background:#071a36 !important;
  color:#c7d5e8 !important;
  border-top:0 !important;
}
footer a, .footer a, .site-footer a{
  color:#9bc7ff !important;
}
footer strong, .footer strong, .site-footer strong{
  color:#fff !important;
}

.sale-banner{
  background:linear-gradient(90deg,#fff6dc 0%,#fffaf0 100%) !important;
  border-bottom:1px solid #ead6a2 !important;
}
.sale-banner strong{
  color:#7a4b00 !important;
}
.sale-banner span{
  color:#6f5b35 !important;
}

@media (max-width:850px){
  .hero h1, .hero-section h1, section.hero h1{
    font-size:clamp(1.35rem,7vw,1.9rem) !important;
  }
}


/* =========================================================
   Contrast & readability guard — desktop + mobile
   Keeps the refreshed look without overriding the page's
   own semantic theme variables used by dark/light sections.
   ========================================================= */

/* Dark sections: always maintain sufficient text contrast. */
section.dark,
.dark {
  color:#ffffff !important;
}
section.dark h2,
section.dark h3,
.dark h2,
.dark h3,
.buyer-box h2,
.buyer-box h3,
.panel h2,
.panel h3 {
  color:#ffffff !important;
}
section.dark p,
section.dark .lead,
.dark p,
.dark .lead,
.panel p,
.panel li,
.quote-box,
.buyer-box p,
.badge {
  color:#d8e4f3 !important;
}

/* Light cards inside dark/hero areas must use dark text. */
.status-card,
.status-card h2,
.status-card h3,
.status-card strong,
.status-card .timeline-year {
  color:#0b1f3a !important;
}
.hero .status-card p,
.hero .status-card .timeline-text,
.status-card p,
.status-card .timeline-text {
  color:#4b5e78 !important;
}

/* Hero copy stays bright on the dark gradient. */
.hero h1,
.hero h2,
.hero h3 {
  color:#ffffff !important;
}
.hero > .container > p,
.hero .hero-text,
.hero .lead {
  color:#dce9ff !important;
}

/* Sale banner: dark copy on a light surface, including CTA. */
.domain-sale-banner {
  background:linear-gradient(90deg,#e8f5ff 0%,#eef7ff 100%) !important;
  border-bottom:1px solid #c8dceb !important;
}
.domain-sale-banner strong {
  color:#0b1f3a !important;
}
.domain-sale-banner span {
  color:#35506f !important;
}
.domain-sale-banner .domain-sale-link {
  background:#ffffff !important;
  color:#0b1f3a !important;
  border:1px solid #c8dceb !important;
}

/* Cards and light sections: force readable body copy. */
section.light,
.info-card,
.card,
.status-card,
.diagram,
.faq details,
.update-box {
  color:#0b1f3a;
}
section.light p,
section.light .lead,
.info-card p,
.diagram p,
.diagram li,
.faq p,
.update-box p {
  color:#4b5e78 !important;
}

/* Navigation: desktop header is light, mobile dropdown is dark. */
.topbar .brand { color:#0b1f3a !important; }
.topbar .menu > a { color:#243954 !important; }
.topbar .menu > a:hover { color:#0057d9 !important; }

@media (max-width:920px){
  .topbar .menu {
    background:#0b182a !important;
    border-color:rgba(255,255,255,.16) !important;
  }
  .topbar .menu > a {
    color:#f4f8ff !important;
  }
  .topbar .menu > a:hover {
    color:#8fd0ff !important;
    background:rgba(255,255,255,.06);
  }
  .topbar .menu > .nav-cta {
    background:#ffffff !important;
    color:#0b1f3a !important;
  }
  .menu-toggle {
    color:#0b1f3a !important;
    border-color:#cfd9e8 !important;
    background:#f6f9fd !important;
  }
}

@media (max-width:560px){
  .domain-sale-inner {
    gap:10px;
  }
  .domain-sale-inner strong,
  .domain-sale-inner span {
    width:100%;
  }
  .domain-sale-link {
    width:100%;
    max-width:320px;
  }
}


/* =========================================================
   Second-pass global contrast hardening
   Fixes remaining low-contrast text in white cards, trust rows,
   info boxes, links and mixed light/dark sections.
   ========================================================= */

/* White cards inside dark sections must never inherit pale text. */
.dark .info-card,
.dark .info-card h3,
.dark .info-card h3 a,
.dark .info-card p,
.dark .info-card li,
.dark .info-card strong,
.dark .info-card small,
.dark .info-card span,
.dark .info-card a:not(.button):not(.btn),
.hero .info-card,
.hero .info-card h3,
.hero .info-card h3 a,
.hero .info-card p,
.hero .info-card li,
.hero .info-card strong,
.hero .info-card span,
.hero .info-card a:not(.button):not(.btn) {
  color:#102a4f !important;
}
.dark .info-card p,
.dark .info-card li,
.hero .info-card p,
.hero .info-card li {
  color:#4b5e78 !important;
}

/* General readable text on all light surfaces. */
.info-card,
.status-card,
.timeline-item,
.update-box,
.diagram,
.source-link,
.mini-link,
details,
.form-card,
.confirmation-popup,
.popup-close,
input,
textarea,
select,
label {
  color:#0b1f3a !important;
}
.info-card h3,
.info-card h3 a,
.status-card strong,
.timeline-year,
.update-box strong,
.source-link,
.mini-link,
details summary,
.form-card h2,
.form-card h3,
.confirmation-popup h3 {
  color:#153156 !important;
}
.info-card p,
.status-card p,
.timeline-text,
.update-box p,
.diagram p,
.diagram li,
details p,
.form-note,
.confirmation-popup p,
.source-list p,
.mini-link-grid p {
  color:#4b5e78 !important;
}

/* Trust strip was too pale after the refresh. */
.trust-row {
  background:#eaf1fb !important;
  border-top:1px solid #d6e0ee !important;
  border-bottom:1px solid #d6e0ee !important;
}
.trust-item {
  color:#4b5e78 !important;
}
.trust-item b {
  color:#102a4f !important;
}

/* Light banner copy and CTA contrast. */
.domain-sale-inner strong,
.domain-sale-inner span,
.domain-sale-banner p {
  color:#0b1f3a !important;
}
.domain-sale-inner span {
  color:#35506f !important;
}
.domain-sale-link,
.domain-sale-link:link,
.domain-sale-link:visited {
  color:#0b1f3a !important;
}

/* Default paragraph contrast inside light sections/cards. */
.light p,
.light li,
.light ul,
.light ol,
.light .lead,
.light .small,
.light .muted,
section.light p,
section.light li {
  color:#4b5e78 !important;
}
.light h1,
.light h2,
.light h3,
.light strong,
section.light h1,
section.light h2,
section.light h3 {
  color:#102a4f !important;
}

/* Keep true dark sections bright, but exclude light nested cards. */
.dark > .container > p,
.dark > .container li,
.dark .section-head .lead,
.dark .quote-box,
.dark .buyer-box p,
.dark .badge,
.dark .panel p,
.dark .panel li {
  color:#d8e4f3 !important;
}
.dark .panel h3,
.dark .buyer-box h2,
.dark .quote-box strong,
.dark > .container > .section-head h2,
.dark > .container > .section-head h3 {
  color:#ffffff !important;
}

/* Footer stays dark and readable. */
footer,
.footer,
.site-footer {
  color:#c7d5e8 !important;
}
footer .small,
.footer .small,
.site-footer .small {
  color:#aebed3 !important;
}

/* Mobile nav dropdown contrast. */
@media (max-width:920px){
  .topbar .menu,
  .menu {
    background:#0b182a !important;
    border-color:rgba(255,255,255,.16) !important;
  }
  .topbar .menu > a,
  .menu a {
    color:#f4f8ff !important;
  }
  .topbar .menu > a:hover,
  .menu a:hover {
    color:#8fd0ff !important;
    background:rgba(255,255,255,.06) !important;
  }
  .topbar .menu > .nav-cta,
  .menu .nav-cta {
    background:#ffffff !important;
    color:#0b1f3a !important;
  }
}