/* digitalesbankkonto.de — v273 premium visual system
   Design-only override. No content, URL or application logic changes. */
:root{
  --dbk-navy:#0d2f52;
  --dbk-navy-2:#153f68;
  --dbk-blue:#004be4;
  --dbk-blue-2:#0a5bff;
  --dbk-blue-soft:#eef5ff;
  --dbk-line:#dce6f1;
  --dbk-line-strong:#c7d7e8;
  --dbk-surface:#ffffff;
  --dbk-page:#f6f9fc;
  --dbk-muted:#587089;
  --dbk-radius:18px;
  --dbk-radius-sm:12px;
  --dbk-shadow:0 12px 34px rgba(13,47,82,.08);
  --dbk-shadow-hover:0 18px 42px rgba(13,47,82,.12);
}

html{background:var(--dbk-page);scroll-padding-top:82px}
body{
  background:linear-gradient(180deg,#fff 0,#f8fbff 22rem,#f6f9fc 48rem);
  color:var(--dbk-navy);
  letter-spacing:-.005em;
}
body,button,input,select,textarea{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
::selection{background:#dceaff;color:#092b4c}
:focus-visible{outline:3px solid rgba(0,75,228,.28)!important;outline-offset:3px}
img{max-width:100%;height:auto}

/* Type hierarchy */
h1,h2,h3,h4,h5,h6{color:var(--dbk-navy)!important;text-wrap:balance}
h1{font-weight:760!important;letter-spacing:-.038em!important}
h2{font-weight:720!important;letter-spacing:-.027em!important}
h3{font-weight:680!important;letter-spacing:-.018em!important}
p,li{color:#34536f}
small,.muted,.source-note{color:var(--dbk-muted)}
a{transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}

/* Global width and rhythm */
.wrap,.container{width:min(100% - 40px,1120px)!important;max-width:1120px!important;margin-left:auto!important;margin-right:auto!important}
section,.section{scroll-margin-top:86px}
.sec-white,.sec-alt,.section{padding-top:clamp(46px,6vw,76px)!important;padding-bottom:clamp(46px,6vw,76px)!important}
.sec-white{background:#fff!important}
.sec-alt{background:#f5f8fc!important}

/* Utility strip */
.dbk-pro-utility{
  background:#0d2f52!important;
  border:0!important;
  color:#dbe8f5!important;
}
.dbk-pro-utility__inner{min-height:34px!important}
.dbk-pro-utility a,.dbk-pro-utility__trust{color:#eef6ff!important}

/* Header/navigation */
.nav{
  top:0!important;
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid rgba(199,215,232,.9)!important;
  box-shadow:0 6px 24px rgba(16,48,78,.055)!important;
  backdrop-filter:saturate(150%) blur(16px)!important;
  -webkit-backdrop-filter:saturate(150%) blur(16px)!important;
}
.nav-inner{height:68px!important;max-width:1160px!important;padding:0 20px!important}
.nav-logo img{height:31px!important;width:auto!important}
.nav-links{gap:5px!important}
.nav-links a{
  color:#264967!important;
  font-size:.83rem!important;
  font-weight:560!important;
  padding:9px 10px!important;
  border-radius:10px!important;
}
.nav-links a:hover{background:#eef5ff!important;color:var(--dbk-blue)!important;text-decoration:none!important}
.nav-cta,.drawer-cta{
  background:var(--dbk-blue)!important;
  color:#fff!important;
  border:1px solid var(--dbk-blue)!important;
  box-shadow:none!important;
}
.nav-cta:hover,.drawer-cta:hover{background:#003fbe!important;border-color:#003fbe!important}
.hamburger{
  width:44px!important;height:44px!important;padding:0!important;
  display:none;align-items:center;justify-content:center;
  background:#f7faff!important;border:1px solid var(--dbk-line)!important;
  border-radius:12px!important;color:var(--dbk-navy)!important;
}
.nav-drawer{
  top:68px!important;padding:10px 16px 18px!important;
  border-color:var(--dbk-line)!important;
  box-shadow:0 18px 40px rgba(13,47,82,.12)!important;
}
.nav-drawer a{padding:12px 13px!important;border-color:#e6edf5!important}

/* Hero — calm, premium financial look */
.hero{
  position:relative!important;isolation:isolate;overflow:hidden!important;
  padding:clamp(54px,7vw,88px) 0 clamp(50px,6vw,78px)!important;
  background:
    radial-gradient(circle at 12% 10%,rgba(70,141,255,.16),transparent 32%),
    radial-gradient(circle at 86% 26%,rgba(0,75,228,.10),transparent 34%),
    linear-gradient(145deg,#f9fcff 0%,#eff6ff 47%,#f8fbff 100%)!important;
  border-bottom:1px solid #dbe7f3!important;
}
.hero:before{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(rgba(13,47,82,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(13,47,82,.035) 1px,transparent 1px);
  background-size:42px 42px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 88%);
}
.hero:after{
  content:"";position:absolute;width:520px;height:520px;right:-230px;top:-250px;z-index:-1;
  border:1px solid rgba(0,75,228,.12);border-radius:50%;box-shadow:0 0 0 70px rgba(0,75,228,.025),0 0 0 140px rgba(0,75,228,.018);
}
.hero h1{max-width:800px!important;color:var(--dbk-navy)!important;font-size:clamp(2.05rem,5vw,3.65rem)!important;line-height:1.06!important;margin-bottom:20px!important}
.hero h1 span{color:var(--dbk-blue)!important}
.hero-sub{max-width:700px!important;color:#3d5d78!important;font-size:clamp(1rem,1.4vw,1.12rem)!important;line-height:1.68!important}
.badge,.money-pill,.rec-badge{
  background:#fff!important;color:#0b55cf!important;border:1px solid #c9ddfa!important;
  box-shadow:0 5px 16px rgba(13,47,82,.055)!important;
}

/* Homepage hero search/finder */
.dbk-v198-photo-hero,.dbk-v198-photo-wrap,.dbk-v198-copy{position:relative!important}
.dbk-v198-photo-hero{background:transparent!important}
.dbk-v198-overlay{background:transparent!important}
.dbk-hero-search,.dbk-ai-finder,.finder-result-box{
  border-radius:20px!important;border:1px solid rgba(183,205,229,.95)!important;
  background:rgba(255,255,255,.92)!important;box-shadow:var(--dbk-shadow)!important;
}
.dbk-hero-search input,.dbk-ai-finder input,
input[type="text"],input[type="email"],input[type="search"],input[type="number"],select,textarea{
  border:1px solid #cbd9e7!important;border-radius:12px!important;background:#fff!important;color:var(--dbk-navy)!important;
  box-shadow:inset 0 1px 2px rgba(13,47,82,.025)!important;
}
input:focus,select:focus,textarea:focus{border-color:#6a9ff2!important;box-shadow:0 0 0 4px rgba(0,75,228,.09)!important;outline:0!important}

/* Buttons */
.btn,.rec-primary,.rec-secondary,.provider-card a,.dbk-rank-actions a,.dbk-watch-btn,button[type="submit"],input[type="submit"]{
  border-radius:12px!important;font-weight:670!important;box-shadow:none!important;
}
.btn-blue,.rec-primary,.dbk-rank-actions .primary,button[type="submit"],input[type="submit"]{
  background:var(--dbk-blue)!important;color:#fff!important;border-color:var(--dbk-blue)!important;
}
.btn-blue:hover,.rec-primary:hover,.dbk-rank-actions .primary:hover,button[type="submit"]:hover,input[type="submit"]:hover{
  background:#003fbe!important;color:#fff!important;transform:translateY(-1px)!important;
}
.btn-outline,.rec-secondary,.dbk-rank-actions .secondary{
  background:#fff!important;color:#0b55cf!important;border:1px solid #bad0ea!important;
}
.btn-outline:hover,.rec-secondary:hover,.dbk-rank-actions .secondary:hover{background:#f2f7ff!important;border-color:#8fb4e0!important;color:#003fbe!important}

/* Core cards and panels */
.money-card,.provider-card,.rec-card,.ratgeber-card,.usecase-card,.answer-box,.v141-card,.v169-card,.v169-mini,
.dbk-aff-card,.dbk-rank-card,.dbk-v201-choice,.tarifrechner-box,.nextgen-tip,
[class*="card"]:not(.nav):not(.badge){
  border-color:var(--dbk-line)!important;border-radius:var(--dbk-radius)!important;
}
.money-card,.provider-card,.rec-card,.ratgeber-card,.usecase-card,.v141-card,.v169-card,.v169-mini,.dbk-aff-card,.dbk-rank-card,.dbk-v201-choice{
  background:#fff!important;box-shadow:0 6px 22px rgba(13,47,82,.055)!important;
}
.money-card:hover,.provider-card:hover,.ratgeber-card:hover,.usecase-card:hover,.dbk-v201-choice:hover{
  border-color:#b8cfe8!important;box-shadow:var(--dbk-shadow-hover)!important;transform:translateY(-3px)!important;
}
.answer-box{background:linear-gradient(145deg,#f6faff,#eef5ff)!important;border:1px solid #cfe0f3!important;box-shadow:none!important}

/* Route / choice area */
.dbk-v201-route{background:#fff!important;border-top:1px solid #edf2f7!important;border-bottom:1px solid #e1eaf3!important}
.dbk-v201-route__heading,.dbk-v201-route__title{color:var(--dbk-navy)!important}
.dbk-v201-choice__icon{background:#eef5ff!important;border-color:#cce0fb!important;color:var(--dbk-blue)!important}

/* Ranking */
.dbk-ranking{background:#f6f9fc!important}
.dbk-ranking-head{max-width:760px}
.dbk-rank-card{overflow:hidden!important}
.dbk-place{color:var(--dbk-blue)!important;background:#f5f9ff!important;border-right:1px solid #e1eaf3!important}
.dbk-stars{color:#e89a13!important;letter-spacing:.05em}

/* Tables */
.table-wrap,.data-table{border:1px solid var(--dbk-line)!important;border-radius:16px!important;overflow:auto!important;background:#fff!important}
table{border-collapse:separate!important;border-spacing:0!important;width:100%}
th{background:#f1f6fb!important;color:#173f64!important;font-weight:680!important;border-color:#dce6f0!important}
td{border-color:#e5edf5!important;color:#38566f!important}
tbody tr:nth-child(even) td{background:#fbfdff}
tbody tr:hover td{background:#f5f9ff}

/* Link hub and editorial grids */
.money-link-hub{background:#f5f8fc!important;border:1px solid #e0e9f2!important;border-radius:22px!important;box-shadow:none!important}
.ratgeber-arrow{color:var(--dbk-blue)!important}
.ratgeber-icon{background:#eff5ff!important;color:var(--dbk-blue)!important;border:1px solid #d5e4f7!important}

/* Footer */
.footer{
  background:#0b2947!important;color:#cbd9e7!important;border-top:0!important;
  padding-top:48px!important;padding-bottom:34px!important;
}
.footer p,.footer li,.footer small{color:#b9ccdc!important}
.footer a{color:#e7f2fb!important}
.footer a:hover{color:#fff!important;text-decoration:underline}
.footer h2,.footer h3,.footer h4,.footer strong{color:#fff!important}
.footer-links{gap:10px 22px!important}

/* Prevent legacy decorative artifacts from making layout noisy */
*{text-shadow:none!important}
hr{border:0;border-top:1px solid var(--dbk-line)}

/* Responsive */
@media(max-width:960px){
  .wrap,.container{width:min(100% - 32px,1120px)!important}
  .nav-inner{padding:0 16px!important}
}
@media(max-width:768px){
  html{scroll-padding-top:74px}
  .dbk-pro-utility{display:none!important}
  .nav-inner{height:62px!important}
  .hamburger{display:flex!important}
  .nav-drawer{top:62px!important}
  .wrap,.container{width:min(100% - 28px,1120px)!important}
  .hero{padding:44px 0 46px!important;text-align:left!important}
  .hero:after{width:340px;height:340px;right:-220px;top:-170px}
  .hero h1{font-size:clamp(2rem,10vw,2.72rem)!important;line-height:1.08!important;margin-left:0!important;margin-right:0!important;text-align:left!important}
  .hero-sub{margin-left:0!important;margin-right:0!important;text-align:left!important}
  .hero-btns{justify-content:flex-start!important}
  .badge{margin-left:0!important}
  .btn{min-height:46px!important}
  .money-card,.provider-card,.rec-card,.ratgeber-card,.usecase-card,.v141-card,.v169-card,.dbk-aff-card,.dbk-rank-card,.dbk-v201-choice{border-radius:16px!important}
  .sec-white,.sec-alt,.section{padding-top:42px!important;padding-bottom:42px!important}
}
@media(max-width:520px){
  .wrap,.container{width:min(100% - 24px,1120px)!important}
  .nav-logo img{height:27px!important}
  .hero{padding-top:36px!important}
  .hero h1{font-size:clamp(1.9rem,10.8vw,2.45rem)!important}
  .hero-btns>.btn,.btn-blue,.btn-outline{width:100%;justify-content:center!important}
  .table-wrap,.data-table{border-radius:13px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
