body{font-family:'DM Sans',sans-serif;background:var(--pearl);color:var(--slate);min-height:100vh;overflow-x:hidden;}
html {
    scroll-behavior: smooth;
}
nav{position:fixed;top:0;width:100%;z-index:100;background:rgba(249,251,250,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:60px;    box-shadow: 0 8px 40px rgba(30, 48, 40, .1);}

nav{
  overflow:visible !important;
}

.logo {
  display: flex;
  align-items: center;
  gap: 10px;
}

.logo::before {
  content: "";
  width: 40px;
  height: 40px;
  flex-shrink: 0;

  background-image: url("/images/img/body-fine.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.logo-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.4rem, 4vw, 2rem);
  font-weight: 500;
  color: var(--slate);
  letter-spacing: 0.5px;
  text-shadow: 0 4px 6px rgba(0,0,0,0.2);
}

.logo-title em {
  font-family: 'Allura', cursive;
  color: var(--linden);
  font-style: normal;
  font-weight: 400;
  font-size: clamp(2.2rem, 5vw, 2.6rem);
  margin-left: 4px;
}

.logo-sub {
  font-size: clamp(0.62rem, 1.8vw, 0.75rem);
  color: #6b7280;
  margin-top: -8px;
  letter-spacing: 0.4px;
  font-weight: 400;
  text-shadow: none;
}

.logo em {
    font-family: 'Allura', cursive;
    color: var(--linden);
    font-style: normal;
    font-weight: 400;
     font-size: clamp(2.6rem, 4.8vw, 2.9rem); 
    margin-left: 4px;
    opacity: 0.95;
    display: inline-block;
    vertical-align: top;
    text-shadow: 0 4px 6px rgba(0,0,0,0.2); 
}

/* =========================================
   BODY-FINE LOGO MOBILE FIX
========================================= */

@media (max-width: 760px) {

  .logo{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    text-align:left;
  }

  .logo::before{
    width:32px;
    height:32px;
    flex-shrink:0;
    margin-top:-2px;
  }

  .logo-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    line-height:1;
  }

  .logo-title{
    font-size:1.25rem;
    line-height:1;
  }

  .logo-title em{
    font-size:2rem;
    line-height:1;
  }

  .logo-sub{
    font-size:.58rem;
    margin-top:-5px;
    line-height:1;
    letter-spacing:.2px;
  }

}

   .nav-inner{
      max-width:var(--max);
      margin:0 auto;
      padding:12px 24px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
    }
.nav-r{display:flex;gap:.5rem;align-items: center;}
.btn{padding:.5rem 1.3rem;border-radius:50px;font-family:'DM Sans',sans-serif;font-size:.88rem;font-weight:600;cursor:pointer;border:none;transition:all .18s;}
.btn-ghost{background:transparent;border:1.5px solid var(--border);color:var(--stone);}
.btn-ghost:hover{border-color:var(--linden);color:var(--linden2);}
.btn-solid{background:var(--linden);color:#fff;}
.btn-solid:hover{background:var(--linden2);box-shadow:0 4px 14px rgba(175,208,77,.3);}
/* HERO */
.hero{padding:100px 2rem 80px;max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}
.hero h1{font-family:'Playfair Display',serif;font-size:3rem;line-height:1.08;font-weight:900;color:var(--slate);margin-bottom:1.2rem;letter-spacing:-.5px;}
.hero h1 em{font-style:italic;color:var(--linden);}
.hero p{font-size:.98rem;line-height:1.8;color:var(--stone);max-width:420px;margin-bottom:1.8rem;}
.hero-btns{display:flex;gap:.8rem;}
.hero-btns .btn{padding:.78rem 1.8rem;font-size:.95rem;}
/* flow card */
.flow-card{background:var(--snow);border-radius:20px;padding:1.8rem;border:1px solid var(--border);box-shadow:0 8px 40px rgba(30,48,40,.06);}
.flow-label{font-size:.72rem;font-weight:700;color:var(--linden2);text-transform:uppercase;letter-spacing:.8px;margin-bottom:1rem;}
.flow-step{display:flex;align-items:flex-start;gap:.85rem;padding:.8rem .9rem;border-radius:10px;background:var(--pearl);border:1px solid var(--border);margin-bottom:.55rem;}
.flow-step.active{border-color:var(--linden);background:rgba(175,208,77,.06);}
.fs-num{width:26px;height:26px;border-radius:50%;background:var(--border);color:var(--fog);font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.1rem;}
.fs-num.done{background:var(--linden);color:#fff;}
.fs-num.act{background:var(--slate);color:#fff;}
.fs-info strong{display:block;font-size:.87rem;color:var(--slate);margin-bottom:.1rem;}
.fs-info span{font-size:.75rem;color:var(--stone);}
/* features */
.features{background:var(--snow);padding:5rem 2rem;border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.feat-inner{max-width:1000px;margin:0 auto;text-align:center;}
.feat-inner h2{font-family:'Playfair Display',serif;font-size:2rem;color:var(--slate);margin-bottom:.5rem;}
.feat-inner>.sub{color:var(--stone);font-size:.9rem;margin-bottom:2.5rem;}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
.fc{background:var(--pearl);border-radius:14px;padding:1.4rem;border:1px solid var(--border);text-align:left;}
.fc .fi{font-size:1.3rem;margin-bottom:.7rem;}
.fc h3{font-size:.92rem;font-weight:600;color:var(--slate);margin-bottom:.35rem;}
.fc p{font-size:.8rem;color:var(--stone);line-height:1.6;}
/* modal */
.overlay{display:none;position:fixed;inset:0;z-index:200;background:rgba(30,48,40,.5);backdrop-filter:blur(6px);align-items:center;justify-content:center;}
.overlay.on{display:flex;}
.modal{background:var(--snow);border-radius:20px;padding:2rem;width:100%;max-width:400px;box-shadow:0 20px 60px rgba(0,0,0,.15);animation:up .22s ease;position:relative;}
@keyframes up{from{transform:translateY(18px);opacity:0;}}
.mx{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--fog);width:28px;height:28px;border-radius:6px;}
.mx:hover{background:var(--mist);}
.modal h2{font-family:'Playfair Display',serif;font-size:1.55rem;color:var(--slate);margin-bottom:.25rem;}
.msub{font-size:.83rem;color:var(--stone);margin-bottom:1.4rem;}
.tabs{display:flex;background:var(--mist);border-radius:9px;padding:3px;margin-bottom:1.4rem;}
.tab{flex:1;text-align:center;padding:.46rem;border-radius:7px;font-size:.86rem;font-weight:600;cursor:pointer;color:var(--stone);background:none;border:none;font-family:'DM Sans',sans-serif;transition:all .15s;}
.tab.on{background:var(--snow);color:var(--linden2);box-shadow:0 2px 6px rgba(0,0,0,.07);}
.tc{display:none;}
.tc.on{display:block;}
.fg{margin-bottom:.9rem;}
.fg label{display:block;font-size:.76rem;font-weight:700;color:var(--stone);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.35rem;}
.fg input{width:100%;padding:.64rem .9rem;border:1.5px solid var(--border);border-radius:9px;font-size:.9rem;font-family:'DM Sans',sans-serif;background:var(--mist);color:var(--slate);transition:border-color .15s;}
.fg input:focus{outline:none;border-color:var(--sage);background:var(--snow);}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;}
.errmsg{font-size:.8rem;padding:.58rem .9rem;border-radius:8px;margin-bottom:.8rem;display:none;background:var(--rose);color:var(--rose2);}
.errmsg.on{display:block;}
.btn-full{width:100%;padding:.78rem;font-size:.95rem;border-radius:10px;margin-top:.3rem;}
footer{background:var(--mist);border-top:1px solid var(--border);text-align:center;padding:1.8rem;font-size:.78rem;color:var(--fog);}

@media (max-width: 992px) {

    nav {
        padding: 0 1.2rem;
    }

    .hero {
        grid-template-columns: 1fr;
        gap: 3rem;
        padding: 90px 1.5rem 60px;
        text-align: center;
    }

    .hero p {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-btns {
        justify-content: center;
        flex-wrap: wrap;
    }

    .flow-card {
        max-width: 500px;
        margin: 0 auto;
    }

    .feat-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* =========================
   SMARTPHONE (≤ 760px)
========================= */
@media (max-width: 760px) {

    nav {
        height: auto;
        padding: .8rem 1rem;
        flex-direction: column;
        gap: .5rem;
        width: 100%;           
        overflow: hidden;     
    }

    .nav-r {
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    .btn {
        flex: 1;
       padding: 0rem 0rem !important;
    }
}

@media (max-width:760px){

    .btn{
         padding: 0 !important;
        height: 40px !important;
        min-height: 30px !important;
        line-height: 30px !important;
        font-size: 0.88rem;
    }

}

@media (max-width: 760px) {
    .btn-lang {
        padding: 0 !important;
        height: 40px !important;
        min-height: 30px !important;
        line-height: 30px !important;
        font-size: 1rem;
       
    }
}

    .hero {
        padding: 80px 1rem 50px;
        gap: 2rem;
    }

    .hero h1 {
        font-size: 1.9rem;
        line-height: 1.2;
    }

    .hero p {
        font-size: .9rem;
    }

    .hero-btns {
        flex-direction: column;
        width: 100%;
    }

    .hero-btns .btn {
        width: 100%;
    }

    .flow-card {
        display: none; /* bleibt gut so */
    }

    .feat-grid {
        grid-template-columns: 1fr;
    }

    .fc {
        text-align: center;
    }

    .modal {
        margin: 1rem;
        padding: 1.5rem;
    }

    .fr {
        grid-template-columns: 1fr;
    }

    

}

/* =========================
   KLEINE SMARTPHONES (≤ 480px)
========================= */
@media (max-width: 480px) {

    .logo {
        text-align: center;
    }

    .hero h1 {
        font-size: 1.6rem;
    }

    .hero p {
        font-size: .85rem;
    }

    .btn {
        font-size: .8rem;
        padding: .6rem 1rem;
    }

    .modal h2 {
        font-size: 1.3rem;
    }
}



.btn-end{
background:var(--linden);
color:#fff;
padding:.7rem 1.5rem;
border:none;
border-radius:50px;
cursor:pointer;
}

.btn-end:hover{
background:var(--linden2);
box-shadow:0 4px 14px rgba(175,208,77,.3);
}

/* HERO */
.hero{
padding:130px 2rem 80px;
max-width:900px;
margin:auto;
text-align:center;
}

.hero h1{
font-family:'Playfair Display',serif;
font-size:3rem;
margin-bottom:1rem;
}

.hero p{
margin-bottom:1.2rem;
color:var(--stone);
}

/* SECTION */
.section{
max-width:900px;
margin:auto;
padding:4rem 2rem;
}

.section h2{
font-family:'Playfair Display',serif;
font-size:2.2rem;
margin-bottom:1.5rem;
}

.section p{
margin-bottom:1.3rem;
color:var(--stone);
}

/* CTA */
.cta{
background:var(--mist);
text-align:center;
padding:5rem 2rem;
}

/* FOOTER */
footer{
background:var(--snow);
padding:3rem 2rem;
text-align:center;
border-top:1px solid var(--border);
}

.socials a{
margin:0 .6rem;
text-decoration:none;
color:var(--slate);
}

.parallax{
  height:120%;
}

.trust-bar{
  display:flex;
  gap:.8rem;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:2rem;
  animation:fadeUp .8s ease both;
}

.trust-item{
  position:relative;
  overflow:hidden;
}

.trust-item::before{
  content:"";
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.4),transparent);
  transition:0.6s;
}

.trust-item:hover::before{
  left:100%;
}

.icon{
  color:#2ecc71;
  font-weight:700;
  font-size:.9rem;
}

/* smooth entrance */
@keyframes fadeUp{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:translateY(0);}
}




.px-card::before{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:100%;
  height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.25),transparent);
  transition:0.6s;
}

.px-card:hover::before{
  left:120%;
}

.fantastic-grid {
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:1.2rem;
    }


@media (max-width: 760px) {
    .fantastic-grid {
        grid-template-columns: 1fr;
    }
}

.box {
  position: relative;
  border-radius: 10px;
  background: #fff;
  padding: 20px;
  border-top: 2px solid #cfcfcf;
  border-bottom: 2px solid #7d7d7d;
  border-left: 2px solid #e8e8e8;
  border-right: 2px solid #e8e8e8;
  overflow: hidden;
}

/* Shine-Effekt links/rechts */
.box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    to right,
    rgba(255,255,255,0.8),
    transparent 30%,
    transparent 70%,
    rgba(255,255,255,0.8)
  );
  pointer-events: none;
}

.box-chris{
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);

  padding:1.8rem;
  border-radius:14px;
  border: 1px solid rgb(178 234 186);
  box-shadow: var(--shadow);

  display:flex;
  flex-direction:column;
  height:100%; /* wichtig für gleiche Höhe */
}

/* Titel */
.box-chris h3{
  margin:0 0 0.7rem 0;
}

/* Standard Text */
.box-chris p{
  margin:0;
  font-size:1rem;
  line-height:1.6;
  opacity:.9;
}

/* gleicher Abstand zwischen Absätzen */
.box-chris p + p{
  margin-top:0.9rem;
}

/* WICHTIG: Highlight immer unten */
.box-highlight{
  margin-top:auto; 
  padding-top:1rem;
  font-weight:600;
}
 

.hero-clean{
  position:relative;
  min-height:92vh;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:#f9fbfa;
}

.hero-video{
  position:absolute;
  filter: brightness(0.9) contrast(1.05) saturate(0.95);
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}

.hero-clean-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background: linear-gradient(90deg,
    rgba(232, 245, 238, .95) 0%,
    rgba(232, 245, 238, .88) 30%,
    rgba(232, 245, 238, .70) 55%,
    rgba(232, 245, 238, .45) 80%,
    rgba(232, 245, 238, .20) 100%);
}

.hero-clean-content{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding:130px 2rem 120px;
  display:grid;
  grid-template-columns:minmax(0, 720px);
}

.hero-left{
  max-width:760px;
}

.hero-left h1{
  font-family:'Playfair Display', serif;
  font-size:clamp(2.2rem, 5vw, 4.2rem);
  line-height:1.05;
  letter-spacing:-.03em;
  color:#1e3028;
  margin:0 0 1rem 0;
}

.hero-lead{
  font-size:1.15rem;
  line-height:1.65;
  color:#31473d;
  font-weight:600;
  max-width:760px;
  margin:0 0 1rem 0;
}

.hero-copy{
  font-size:1rem;
  line-height:1.85;
  color:#52685c;
  max-width:720px;
  margin:0;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.85rem;
  margin-top:2rem;
}

.hero-btn{
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 1.45rem;
  border-radius:12px;
  text-decoration:none;
  font-size:.96rem;
  font-weight:700;
  cursor:pointer;
  transition:all .18s ease;
}

.hero-btn-primary{
  border:none;
  background:#afd04d;
  color:#1e3028;
  box-shadow:0 10px 24px rgba(175,208,77,.24);
}

.hero-btn-primary:hover{
  background:#91ad38;
  color:#fff;
}

.hero-btn-secondary{
  border:1.5px solid #d8e9e0;
  background:rgba(255,255,255,.88);
  color:#52685c;
}

.hero-btn-secondary:hover{
  border-color:#afd04d;
  color:#91ad38;
}

.hero-trust-box{
  position:absolute;
  right:40px;
  left:auto;
  bottom:36px;
  z-index:3;
  display:flex;
  align-items:flex-start;
  gap:16px;
  max-width:510px;
  background:rgba(255,255,255,0.5);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgb(178 234 186);
  border-radius:16px;
  padding:14px 18px;
  box-shadow:
    0 14px 36px rgba(0,0,0,0.10),
    inset 0 1px 0 rgba(255,255,255,0.7);
}

.seal-premium-wrap{
  position:relative;
  width:90px;
  height:90px;
  flex:0 0 90px;
  border-radius:50%;
  overflow:hidden;
}

.seal-premium{
  width:90px;
  height:90px;
  position:relative;
  z-index:1;
}

.seal-premium svg{
  display:block;
  width:100%;
  height:100%;
}

.seal-premium-wrap::after{
  content:"";
  position:absolute;
  top:-20%;
  left:-120%;
  width:60%;
  height:140%;
  transform:rotate(20deg);
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.18) 35%,
    rgba(255,255,255,0.85) 50%,
    rgba(255,255,255,0.18) 65%,
    rgba(255,255,255,0) 100%
  );
  animation:sealShine 5.2s ease-in-out infinite;
  pointer-events:none;
  z-index:2;
}

@keyframes sealShine{
  0%{
    left:-120%;
    opacity:0;
  }
  8%{
    opacity:1;
  }
  30%{
    left:140%;
    opacity:1;
  }
  31%{
    opacity:0;
  }
  100%{
    left:140%;
    opacity:0;
  }
}

.trust-text{
  max-width:500px;
}

.trust-main{
  font-size:.86rem;
  font-weight:700;
  color:#1f2d33;
  line-height:1.42;
}

.trust-sub{
  font-size:.75rem;
  color:#5f7077;
  margin-top:4px;
  line-height:1.5;
}

.trust-sources{
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  align-items:center;
  margin-top:10px;
}

.trust-sources span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0;
  background:none;
  border:none;
  color:#52685c;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:none;
  min-height:auto;
}

.trust-sources span::before{
  content:"✓";
  color:#91ad38;
  font-weight:900;
  font-size:.82rem;
}



.trust-link{
  margin-top:8px;
}

.trust-link a{
  font-size:.76rem;
  font-weight:700;
  color:#466458;
  text-decoration:none;
  border-bottom:1px solid rgba(70,100,88,.25);
  transition:all .18s ease;
}

.trust-link a:hover{
  color:#1e3028;
  border-bottom-color:#1e3028;
}

@media (max-width: 900px){
  .hero-clean{
    min-height:auto;
  }



  .hero-clean-content{
    padding:144px 1.25rem 180px;
    grid-template-columns:1fr;
  }

  .hero-clean-overlay{
    background:
      linear-gradient(180deg,
        rgba(249,251,250,.94) 0%,
        rgba(249,251,250,.88) 40%,
        rgba(249,251,250,.78) 100%);
}

  .hero-trust-box{
    right:20px;
    left:auto;
    bottom:20px;
    max-width:none;
  }
}

@media (max-width: 640px){


  .hero-actions{
    xxxflex-direction:column;
    align-items:stretch;
  }

  .hero-btn{
    width:100%;
  }

  .hero-lead{
    font-size:1.02rem;
  }

  .hero-copy{
    font-size:.96rem;
    line-height:1.72;
  }

  .hero-trust-box{
    flex-direction:column;
    gap:12px;
    padding:12px 14px;
  }

  .seal-premium-wrap,
  .seal-premium{
    width:78px;
    height:78px;
    flex:0 0 78px;
  }

  .trust-main{
    font-size:.8rem;
  }

  .trust-sub,
  .trust-link a{
    font-size:.72rem;
  }
}

.hero-bridge{
  position:relative;
  background:linear-gradient(180deg, #f7fbf9 0%, #ffffff 100%);
  padding:72px 2rem 78px;
  border-top:1px solid rgba(216,233,224,.7);
  border-bottom:1px solid rgba(216,233,224,.8);
}

.hero-bridge-inner{
  max-width:1140px;
  margin:0 auto;
}

.hero-bridge-head{
  text-align:center;
  max-width:860px;
  margin:0 auto 38px;
}

.hero-bridge-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.45rem .9rem;
  border-radius:999px;
  background:#ffffff;
  border:1px solid #d8e9e0;
  color:#52685c;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  margin-bottom:14px;
}

.hero-bridge-head h2{
  font-family:'Playfair Display',serif;
  font-size:clamp(1.9rem, 4vw, 2.8rem);
  line-height:1.15;
  color:#1e3028;
  margin:0 0 12px;
}

.hero-bridge-head p{
  max-width:760px;
  margin:0 auto;
  font-size:1rem;
  line-height:1.8;
  color:#52685c;
}

.hero-bridge-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}

.hero-bridge-card{
  position:relative;
  background:linear-gradient(180deg,#ffffff 0%,#f9fcfa 100%);
  border: 1px solid rgb(178 234 186);
  border-radius:22px;
  padding:22px 22px 20px;
  box-shadow:
    0 12px 30px rgba(30,48,40,.05),
    inset 0 1px 0 rgba(255,255,255,.95);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.hero-bridge-card:hover{
  transform:translateY(-2px);
  box-shadow:
    0 18px 36px rgba(30,48,40,.08),
    inset 0 1px 0 rgba(255,255,255,.98);
  border-color:#cfe3da;
}

.hero-bridge-top{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:14px;
  align-items:center;
  margin-bottom:14px;
}

.hero-bridge-icon{
  width:48px;
  height:48px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(180deg, #bce3d8 0%, #b0ecb5 100%);
  box-shadow:
    0 8px 18px rgba(175,208,77,.22),
    inset 0 1px 0 rgba(255,255,255,.72);
  border:1px solid rgba(145,173,56,.18);
  flex-shrink:0;
}

.hero-bridge-icon svg{
  width:18px;
  height:18px;
  stroke:#1e3028;
  stroke-width:3;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.hero-bridge-meta{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.hero-bridge-card h3{
  margin:0;
  font-size:1rem;
  line-height:1.2;
  font-weight:800;
  color:#1e3028;
}

.hero-bridge-label{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  padding:.22rem .58rem;
  border-radius:999px;
  background:rgba(176,236,181,.18);
  border:1px solid rgba(176,236,181,.42);
  color:#64824f;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.hero-bridge-card p{
  margin:0;
  font-size:.9rem;
  line-height:1.72;
  color:#52685c;
}

.hero-bridge-card p{
  font-size:.9rem;
  line-height:1.7;
  color:#52685c;
  margin:0;
}

@media (max-width: 900px){
  .hero-bridge{
    padding:58px 1.25rem 62px;
  }

  .hero-bridge-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 640px){
  .hero-bridge{
    padding:52px 1rem 56px;
  }

  .hero-bridge-head p{
    font-size:.95rem;
    line-height:1.72;
  }
}

.section-transition{
  height:60px;
  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f8fcfa 40%,
      rgba(188,227,216,.28) 100%
    );
}

.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}


/* ── Trust-Bar ────────────────────────────────── */
.bf-trust-bar{
  background:linear-gradient(180deg,#ffffff 0%, #f8fcfa 100%);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
  position:relative;
}

.bf-trust-bar::before{
  content:"";
  position:absolute;
  top:0;
  left:-60%;
  width:40%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(175,208,77,.06),transparent);
  animation:tbShine 3.5s ease-in-out infinite;
  pointer-events:none;
  z-index:0;
}

@keyframes tbShine{
  0%{left:-60%;}
  100%{left:120%;}
}

.bf-trust-inner{
 
  margin:0 auto;
  padding:1.35rem 2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
}

.bf-trust-item{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.7rem 2rem;
  position:relative;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .5s ease, transform .5s ease;
}

.bf-trust-item.bf-visible{
  opacity:1;
  transform:translateY(0);
}

.bf-trust-item:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:20%;
  height:60%;
  width:1px;
  background:var(--border);
}

.bf-trust-icon{
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--mist);
  border:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 6px 14px rgba(30,48,40,.05);
}

.bf-trust-icon svg{
  width:17px;
  height:17px;
  stroke:var(--slate);
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.bf-trust-num{
  font-size:1.12rem;
  font-weight:800;
  color:var(--slate);
  line-height:1.1;
}

.bf-trust-num .bf-suffix{
  font-size:.92rem;
  font-weight:700;
  color:var(--linden2);
}

.bf-trust-label{
  font-size:.76rem;
  color:var(--stone);
  margin-top:2px;
  line-height:1.3;
}

@media(max-width:700px){
  .bf-trust-inner{
    padding:1rem .8rem;
  }

  .bf-trust-item{
    padding:.7rem 1rem;
    flex:1 1 48%;
    min-width:150px;
    justify-content:flex-start;
  }

  .bf-trust-item:not(:last-child)::after{
    display:none;
  }
}

@media(max-width:480px){
  .bf-trust-item{
    flex:1 1 100%;
    min-width:100%;
  }

  .bf-trust-num{
    font-size:1rem;
  }
}


.bf-future{
  position:relative;
  padding:6rem 2rem;

  overflow:hidden;
}

.bf-future-shell{
  max-width:1220px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:1.5rem;
}

.bf-xpanel{
  position:relative;
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:1.4rem;
  align-items:center;
  padding:1.5rem;
  border-radius:32px;
  border:1px solid rgba(216,233,224,.9);
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow: var(--shadow);
  overflow:hidden;
}

.bf-xpanel::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,.45), rgba(255,255,255,0));
  pointer-events:none;
}

.bf-xcopy{
  position:relative;
  z-index:2;
}

.bf-xkicker{
  font-size:.76rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--linden2);
  margin-bottom:.65rem;
}

.bf-xcopy h2{
  font-family:'Playfair Display',serif;
  font-size:2.6rem;
  line-height:1.02;
  letter-spacing:-.03em;
  color:var(--slate);
  margin-bottom:.85rem;
}

.bf-xlead{
  font-size:1rem;
  line-height:1.9;
  color:var(--stone);
  max-width:64ch;
}

.bf-xmetrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.8rem;
  margin-top:1.15rem;
}

.bf-xmetric{
  padding:1rem;
  border-radius:20px;
  border:1px solid var(--border);
  background:linear-gradient(180deg,#fff,#f8fbfa);
  box-shadow:0 8px 20px rgba(30,48,40,.04);
}

.bf-xmetric strong{
  display:block;
  color:var(--slate);
  font-size:1rem;
  margin-bottom:.18rem;
}

.bf-xmetric span{
  display:block;
  color:var(--stone);
  font-size:.8rem;
  line-height:1.55;
}

.bf-xtrust{
  display:grid;
  gap:.8rem;
  margin-top:1.15rem;
}

.bf-xtrust-item{
  padding:1rem 1.05rem;
  border-radius:20px;
  border:1px solid var(--border);
  background:linear-gradient(180deg,#fff,#f7fbf9);
}

.bf-xtrust-item strong{
  display:block;
  font-size:.93rem;
  color:var(--slate);
  margin-bottom:.2rem;
}

.bf-xtrust-item span{
  color:var(--stone);
  font-size:.84rem;
  line-height:1.7;
}

/* Advisor visual */
.bf-xvisual{
  position:relative;
  z-index:2;
}

.bf-neural-stage{
  position:relative;
   min-height:clamp(930px, 65vh, 680px);
  border-radius:30px;
  overflow:hidden;
  border:1px solid var(--border);
  background:
    radial-gradient(circle at center, rgba(142,236,209,.14), transparent 26%),
    linear-gradient(180deg,#ffffff,#f5faf7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 16px 40px rgba(30,48,40,.08);
}

.bf-neural-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(175,208,77,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(175,208,77,.08) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(circle at center, black 40%, transparent 78%);
}

.bf-neural-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  opacity:.45;
}

.bf-neural-glow.g1{
  width:220px;height:220px;
  background:rgba(142,236,209,.5);
  left:14%;top:18%;
  animation:glowFloat1 7s ease-in-out infinite;
}

.bf-neural-glow.g2{
  width:260px;height:260px;
  background:rgba(175,208,77,.35);
  right:10%;bottom:16%;
  animation:glowFloat2 8s ease-in-out infinite;
}

@keyframes glowFloat1{
  0%,100%{transform:translate(0,0)}
  50%{transform:translate(18px,-14px)}
}
@keyframes glowFloat2{
  0%,100%{transform:translate(0,0)}
  50%{transform:translate(-20px,16px)}
}

.bf-avatar-orbit{
  position:absolute;
  width:96px;
  height:96px;
  border-radius:50%;
  padding:5px;
  background:linear-gradient(180deg,#fff,#edf7f2);
  border: 1px solid var(--linden);
  box-shadow:0 14px 28px rgba(30,48,40,.1);
  overflow:hidden;
}

.bf-avatar-orbit img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}

.a1{top:6%;left:36%;animation:orbitFloat 6s ease-in-out infinite;}
.a2{top:14%;right:14%;animation:orbitFloat 7.5s ease-in-out infinite;}
.a3{top:34%;left:5%;animation:orbitFloat 8s ease-in-out infinite;}
.a4{top:67%;left:1%;animation:orbitFloat 6.5s ease-in-out infinite;}
.a5{bottom:8%;left:32%;animation:orbitFloat 7.8s ease-in-out infinite;}
.a6{bottom:10%;right:15%;animation:orbitFloat 6.8s ease-in-out infinite;}
.a7{top:38%;right:4%;animation:orbitFloat 8.3s ease-in-out infinite;}
.a8{top:8%;left:12%;animation:orbitFloat 7.2s ease-in-out infinite;}

@keyframes orbitFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}

.bf-core-ui{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(78%, 420px);
  max-height:620px;
  padding:1.2rem;
  border-radius:28px;
  border:1px solid rgba(175,208,77,.28);
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 18px 45px rgba(30,48,40,.12);
  overflow-y:auto;
  overflow-x:hidden;
}

.bf-core-top{
  display:flex;
  justify-content:space-between;
  gap:.6rem;
  align-items:center;
  margin-bottom:.85rem;
}

.bf-live-status,
.bf-core-chip{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  border-radius:999px;
  padding:.45rem .8rem;
  font-size:.75rem;
  font-weight:700;
  border:1px solid var(--border);
  background:#fff;
  color:var(--stone);
}

.bf-live-status span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--linden2);
  box-shadow:0 0 0 0 rgba(145,173,56,.5);
  animation:livePulse 1.8s infinite;
}

@keyframes livePulse{
  0%{box-shadow:0 0 0 0 rgba(145,173,56,.42)}
  70%{box-shadow:0 0 0 10px rgba(145,173,56,0)}
  100%{box-shadow:0 0 0 0 rgba(145,173,56,0)}
}

.bf-core-ui h3{
  font-family:'Playfair Display',serif;
  font-size:1.65rem;
  color:var(--slate);
  margin-bottom:.35rem;
}

.bf-core-ui p{
  color:var(--stone);
  font-size:.88rem;
  line-height:1.65;
  margin-bottom:1rem;
}

.bf-chat-stack{
  display:flex;
  flex-direction:column;
  gap:.6rem;
}

.bf-chat-line{
  padding:.8rem .9rem;
  border-radius:18px;
  font-size:.82rem;
  line-height:1.6;
  max-width:92%;
  animation:msgRise .55s ease both;
}

.bf-chat-line.bot{
  align-self:flex-start;
  background:var(--mist);
  border:1px solid var(--border);
  color:var(--slate);
  border-top-left-radius:8px;
}

.bf-chat-line.user{
  align-self:flex-end;
  background:var(--linden);
  color:#fff;
  border-top-right-radius:8px;
}

.bf-chat-line:nth-child(2){animation-delay:.12s}
.bf-chat-line:nth-child(3){animation-delay:.24s}

@keyframes msgRise{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

/* Scanner visual */
.bf-scanner-side{
  position:relative;
  z-index:2;
  min-height:560px;
}

.bf-phone-frame{
  position:absolute;
  left:6%;
  top:3%;
  width:min(72%, 390px);
  aspect-ratio:.56/1;
  border-radius:36px;
  padding:14px;
  background:linear-gradient(180deg,#161b18,#2b312e);
  box-shadow:0 26px 60px rgba(0,0,0,.22);
  transform:rotate(-5deg);
}

.bf-phone-notch{
  position:absolute;
  top:10px;
  left:50%;
  transform:translateX(-50%);
  width:34%;
  height:18px;
  border-radius:0 0 14px 14px;
  background:#0e1210;
  z-index:2;
}

.bf-phone-screen{
  width:100%;
  height:100%;
  border-radius:28px;
  overflow:hidden;
  background:linear-gradient(180deg,#fbfffd,#eef7f1);
  position:relative;
}

.bf-scan-product{
  height:44%;
  padding:1rem;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#ffffff,#f2faf5);
}

.bf-scan-product img{
  width:78%;
  max-height:100%;
  object-fit:contain;
  filter:drop-shadow(0 14px 28px rgba(30,48,40,.12));
}

.bf-barcode-area{
  margin:0 1rem;
  height:22%;
  border-radius:22px;
  border:1px solid rgba(175,208,77,.3);
  background:#fff;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

.bf-barcode-bars{
  display:flex;
  align-items:flex-end;
  gap:4px;
  height:64%;
}

.bf-barcode-bars span{
  display:block;
  width:4px;
  background:#222;
  border-radius:2px;
}

.bf-barcode-bars span:nth-child(1){height:55%}
.bf-barcode-bars span:nth-child(2){height:90%}
.bf-barcode-bars span:nth-child(3){height:70%}
.bf-barcode-bars span:nth-child(4){height:84%}
.bf-barcode-bars span:nth-child(5){height:62%}
.bf-barcode-bars span:nth-child(6){height:94%}
.bf-barcode-bars span:nth-child(7){height:52%}
.bf-barcode-bars span:nth-child(8){height:88%}
.bf-barcode-bars span:nth-child(9){height:65%}
.bf-barcode-bars span:nth-child(10){height:92%}
.bf-barcode-bars span:nth-child(11){height:58%}
.bf-barcode-bars span:nth-child(12){height:86%}
.bf-barcode-bars span:nth-child(13){height:69%}
.bf-barcode-bars span:nth-child(14){height:95%}
.bf-barcode-bars span:nth-child(15){height:60%}
.bf-barcode-bars span:nth-child(16){height:89%}
.bf-barcode-bars span:nth-child(17){height:56%}
.bf-barcode-bars span:nth-child(18){height:83%}
.bf-barcode-bars span:nth-child(19){height:72%}
.bf-barcode-bars span:nth-child(20){height:91%}

.bf-scan-laser{
  position:absolute;
  left:8%;
  right:8%;
  height:3px;
  top:18%;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(175,208,77,.9),transparent);
  box-shadow:0 0 16px rgba(175,208,77,.55);
  animation:laserMove 2.6s ease-in-out infinite;
}

@keyframes laserMove{
  0%,100%{top:18%}
  50%{top:78%}
}

.bf-product-eval{
  margin:1rem;
  padding:1rem;
  border-radius:20px;
  background:#fff;
  border:1px solid var(--border);
  box-shadow:0 10px 24px rgba(30,48,40,.06);
}

.bf-product-eval.bad{
  border-color:#fecaca;
  background:linear-gradient(180deg,#fff,#fff5f5);
}

.bf-eval-pill{
  display:inline-flex;
  padding:.36rem .72rem;
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#991b1b;
  background:#fff;
  border:1px solid #fecaca;
  margin-bottom:.45rem;
}

.bf-product-eval strong{
  display:block;
  font-size:1rem;
  color:var(--slate);
  margin-bottom:.12rem;
}

.bf-product-eval span{
  display:block;
  font-size:.82rem;
  color:var(--stone);
  line-height:1.55;
}

.bf-floating-card{
  position:absolute;
  width:220px;
  padding:.95rem 1rem;
  border-radius:22px;
  border:1px solid rgba(175,208,77,.24);
  background:rgba(255,255,255,.76);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 16px 34px rgba(30,48,40,.1);
  animation:floatCard 7s ease-in-out infinite;
}

.bf-floating-card small{
  display:block;
  font-size:.7rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--fog);
  margin-bottom:.18rem;
}

.bf-floating-card strong{
  display:block;
  font-size:.96rem;
  color:var(--slate);
  margin-bottom:.16rem;
}

.bf-floating-card span{
  font-size:.78rem;
  color:var(--stone);
  line-height:1.5;
}

.fc1{top:6%;right:8%}
.fc2{top:42%;right:0;animation-delay:.8s}
.fc3{bottom:6%;right:12%;animation-delay:1.4s}

@keyframes floatCard{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-12px)}
}

.bf-xbullets{
  display:flex;
  flex-direction:column;
  gap:.7rem;
  margin-top:1.1rem;
}

.bf-xbullet{
  padding:.85rem 1rem;
  border-radius:999px;
  border:1px solid var(--border);
  background:linear-gradient(180deg,#fff,#f7fbf9);
  font-size:.87rem;
  font-weight:600;
  color:var(--slate);
  box-shadow:0 8px 20px rgba(30,48,40,.04);
}

/* Food section */
.bf-food-stage{
  position:relative;
  z-index:2;
  display:grid;
  gap:1rem;
}

.bf-pref-panel{
  padding:1rem;
  border-radius:24px;
  border:1px solid var(--border);
  box-shadow:0 12px 26px rgba(30,48,40,.06);
}

.bf-pref-panel.like{
  background:linear-gradient(180deg, rgba(175,208,77,.12), #fff);
  border-color:rgba(175,208,77,.35);
}

.bf-pref-panel.dislike{
  background:linear-gradient(180deg, rgba(254,242,242,.9), #fff);
  border-color:#fecaca;
}

.bf-pref-title{
  font-size:.76rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--slate);
  margin-bottom:.7rem;
}

.bf-pref-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}

.bf-pref-tags span{
  padding:.52rem .8rem;
  border-radius:999px;
  border:1px solid var(--border);
  background:#fff;
  font-size:.79rem;
  font-weight:700;
  color:var(--stone);
}

.bf-meal-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.85rem;
}

.bf-meal-card{
  display:flex;
  flex-direction:column;
  gap:.7rem;
  padding:.75rem;
  border-radius:22px;
  border:1px solid var(--border);
  background:linear-gradient(180deg,#fff,#f7fbf9);
  box-shadow:0 10px 24px rgba(30,48,40,.05);
  transition:transform .18s ease, box-shadow .18s ease;
}

.bf-meal-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 34px rgba(30,48,40,.09);
}

.bf-meal-card img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:18px;
  border:1px solid var(--border);
  background:#fff;
}

.bf-meal-card strong{
  display:block;
  font-size:.9rem;
  color:var(--slate);
  margin-bottom:.12rem;
}

.bf-meal-card span{
  display:block;
  font-size:.78rem;
  color:var(--stone);
  line-height:1.55;
}

@media (max-width:1100px){
  .bf-xpanel{
    grid-template-columns:1fr;
  }

  .bf-neural-stage{
    min-height:560px;
  }

  .bf-scanner-side{
    min-height:640px;
  }
}

@media (max-width:780px){
  .bf-future{
    padding:4rem 1rem;
  }

  .bf-xpanel{
    padding:1rem;
    border-radius:24px;
  }

  .bf-xcopy h2{
    font-size:1.9rem;
  }

  .bf-xmetrics{
    grid-template-columns:1fr;
  }

  .bf-meal-grid{
    grid-template-columns:1fr;
  }

  .bf-phone-frame{
    position:relative;
    left:auto;
    top:auto;
    width:82%;
    margin:0 auto;
    transform:none;
  }

  .bf-floating-card{
    position:relative;
    width:100%;
    right:auto;
    top:auto;
    bottom:auto;
    margin-top:.8rem;
  }

  .bf-scanner-side{
    min-height:auto;
    display:flex;
    flex-direction:column;
    gap:.8rem;
  }

  .bf-avatar-orbit{
    width:76px;
    height:76px;
  }

  .bf-core-ui{
    width:calc(100% - 24px);
    max-height:420px;
    height:auto;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    overflow-y:auto;
    overflow-x:hidden;
  }
}

.bf-core-ui::-webkit-scrollbar{
  width:6px;
}

.bf-core-ui::-webkit-scrollbar-thumb{
  background:rgba(145,173,56,.7);
  border-radius:10px;
}

.bf-core-ui::-webkit-scrollbar-track{
  background:transparent;
}

.bf-chat-input{
  margin-top:.7rem;
  display:flex;
  gap:.5rem;
  align-items:center;
}

.bf-chat-input input{
  flex:1;
  border-radius:14px;
  border:1px solid var(--border);
  padding:.65rem .8rem;
  font-size:.82rem;
  background:#fff;
  color:var(--stone);
  outline:none;
}

.bf-chat-input input::placeholder{
  color:#9ca3af;
}

.bf-chat-input button{
  border:none;
  border-radius:12px;
  padding:.6rem .75rem;
  font-size:.8rem;
  background:var(--linden);
  color:#fff;
  cursor:default;
  box-shadow:0 6px 14px rgba(175,208,77,.3);
}


.bf-chat-input input{
  animation:inputGlow 3s ease-in-out infinite;
}

@keyframes inputGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(175,208,77,.0)}
  50%{box-shadow:0 0 0 4px rgba(175,208,77,.12)}
}

.bf-avatar-orbit{
  z-index:2;
}

.bf-core-ui{
  z-index:3;
}

.bf-avatar-orbit{
  transform:translateZ(0);
  box-shadow:0 18px 35px rgba(30,48,40,.15);
}

@media (max-width: 768px) {
  .hero-clean .hero-trust-box {
    display: none;
  }
}

@media (max-width: 640px){

  .hero-trust-box{
    position:relative;    
    left:0%;
    right:auto;
    bottom:auto;
    transform:translateX(-50%);
    
    margin-top:20px;       
    max-width:90%;
  }

  .hero-clean-content{
    padding: clamp(156px, 25vw, 200px) 2.25rem 20px;
  }

}



.split-section{
  padding:6rem 20px;
}

.split-section.bg-mist{
  background:linear-gradient(180deg,#f7fbf9,#ffffff);
}

.split-inner{
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:center;
}

.kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.45rem .9rem;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--border);
  color:var(--stone);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  margin-bottom:14px;
}

.split-h2{
  font-family:'Playfair Display',serif;
  font-size:clamp(1.8rem,3.5vw,2.8rem);
  line-height:1.08;
  letter-spacing:-.03em;
  color:var(--slate);
  margin-bottom:1.1rem;
}

.split-h2 em{
  font-style:italic;
  color:var(--linden);
}

.split-lead{
  font-size:1rem;
  line-height:1.9;
  color:var(--stone);
  margin-bottom:1.5rem;
  max-width:52ch;
}

.split-facts{
  display:flex;
  flex-direction:column;
  gap:.7rem;
  margin-bottom:1.8rem;
}

.split-fact{
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  padding:.9rem 1rem;
  border-radius:12px;
  background:var(--snow);
  border:1px solid var(--border);
  font-size:.88rem;
  line-height:1.6;
  color:var(--stone);
}

.split-fact-icon{
  width:28px;
  height:28px;
  border-radius:50%;
  background:rgba(175,208,77,.15);
  border:1px solid rgba(175,208,77,.3);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  margin-top:1px;
  color:var(--linden2);
  font-weight:900;
}

.split-fact strong{
  display:block;
  color:var(--slate);
  margin-bottom:.15rem;
  font-size:.92rem;
}

.split-cta{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.82rem 1.6rem;
  border-radius:12px;
  font-size:.95rem;
  font-weight:800;
  cursor:pointer;
  border:none;
  background:var(--linden);
  color:#1e3028;
  box-shadow:0 10px 24px rgba(175,208,77,.24);
  transition:.18s ease;
}

.split-cta:hover{
  background:var(--linden2);
  color:#fff;
}

.split-img-wrap{
  position:relative;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(30,48,40,.12);
  border:1px solid var(--border);
  aspect-ratio:4/4;
}

.split-img-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.split-img-badge{
  position:absolute;
  bottom:20px;
  left:20px;
  background:rgba(255,255,255,.90);
  backdrop-filter:blur(12px);
  border:1px solid rgb(178 234 186);
  border-radius:14px;
  padding:10px 16px;
  box-shadow:0 8px 24px rgba(0,0,0,.1);
}

.split-img-badge strong{
  display:block;
  font-size:.92rem;
  color:var(--slate);
}

.split-img-badge span{
  font-size:.76rem;
  color:var(--stone);
}

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease,transform .7s ease;
}

.reveal.visible{
  opacity:1;
  transform:translateY(0);
}

@media(max-width:1100px){
  .split-inner{
    grid-template-columns:1fr;
    gap:3rem;
  }
}

@media(max-width:780px){
  .split-section{
    padding:4rem 16px;
  }
}

@media(max-width:560px){
  .split-section{
    padding-left:14px;
    padding-right:14px;
  }

  .split-h2{
    font-size:clamp(1.7rem,7vw,2.2rem);
  }

  .split-img-badge{
    left:14px;
    right:14px;
    bottom:14px;
    padding:10px 12px;
  }

  .split-cta{
    width:100%;
    justify-content:center;
  }
}

.how-section{
  background:var(--snow);
  padding:6rem 20px;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.how-inner{
  max-width:1100px;
  margin:0 auto;
}

.how-head{
  text-align:center;
  max-width:1080px;
  margin:0 auto 3.5rem;
}

.kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.45rem .9rem;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--border);
  color:var(--stone);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.how-head h2{
  font-family:'Playfair Display',serif;
  font-size:clamp(1.9rem,3.5vw,2.8rem);
  color:var(--slate);
  margin-bottom:.75rem;
  line-height:1.15;
}

.how-head p{
  font-size:1rem;
  line-height:1.8;
  color:var(--stone);
}

.how-steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
  position:relative;
}

.how-step{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  position:relative;
  z-index:1;
}

.how-step-num{
  width:64px;
  height:64px;
  border-radius:50%;
  background:var(--snow);
  border:1.5px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Playfair Display',serif;
  font-size:1.4rem;
  font-weight:900;
  color:var(--slate);
  margin-bottom:1.2rem;
  box-shadow:0 8px 24px rgba(30,48,40,.06);
}

.how-step h3{
  font-size:.98rem;
  font-weight:800;
  color:var(--slate);
  margin-bottom:.5rem;
}

.how-step p{
  font-size:.84rem;
  line-height:1.7;
  color:var(--stone);
}

.how-tag{
  display:inline-flex;
  margin-top:.7rem;
  padding:.28rem .7rem;
  border-radius:999px;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:rgba(175,208,77,.12);
  border:1px solid rgba(175,208,77,.28);
  color:var(--linden2);
}

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease,transform .7s ease;
}

.reveal.visible{
  opacity:1;
  transform:translateY(0);
}

@media(max-width:1100px){
  .how-steps{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:780px){
  .how-section{
    padding:4rem 16px;
  }

  .how-steps{
    grid-template-columns:1fr;
  }
}

@media(max-width:560px){
  .how-section{
    padding-left:14px;
    padding-right:14px;
  }

  .how-head h2{
    font-size:clamp(1.7rem,7vw,2.2rem);
  }
}


.split-img-wrap img {
  transition: transform 0.3s ease;
}

.split-img-wrap img:hover {
  transform: scale(1.05); /* leichtes Zoom IN */
}

.split-img-wrap img:active {
  transform: scale(1.05); /* bleibt gleich beim Klick */
}


/* =========================
   IMAGE SHARE
========================= */
.split-img-wrap{
  position:relative;
}

.split-img-wrap > img{
  cursor:pointer;
}

.split-share-btn{
  position:absolute;
  top:16px;
  right:16px;
  z-index:5;
  width:48px;
  height:48px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:14px;
  background:rgba(255,255,255,.14);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
  transition:transform .16s ease, background .16s ease, border-color .16s ease;
}

.split-share-btn:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.20);
  border-color:rgba(255,255,255,.55);
}

.split-share-btn svg{
  width:18px;
  height:18px;
  display:block;
}

/* =========================
   SHARE MODAL
========================= */
.bf-share-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
}

.bf-share-modal.is-open{
  display:block;
}

.bf-share-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.bf-share-dialog{
  position:relative;
  z-index:2;
  width:100vw;
  height:100vh;
  margin:0;
  overflow:hidden;
  background:#000;
}

.bf-share-image-wrap{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  background:#000;
}

.bf-share-image-wrap img{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  display:block;
  border-radius:0;
  box-shadow:none;
}

/* =========================
   CLOSE BUTTON
========================= */
.bf-share-close{
  position:absolute;
  top:16px;
  right:16px;
  z-index:20;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:14px;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  color:#fff;
  font-size:1.25rem;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 8px 22px rgba(0,0,0,.22);
  transition:transform .16s ease, background .16s ease, border-color .16s ease;
}

.bf-share-close:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.55);
}

/* =========================
   SHARE BAR UNTEN AUF DEM BILD
========================= */
.bf-share-actions{
  position:absolute;
  left:50%;
  bottom:16px;
  transform:translateX(-50%);
  z-index:15;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 12px 32px rgba(0,0,0,.20);
}

.bf-social-btn{
  width:36px;
  height:36px;
  min-width:36px;
  min-height:36px;
  padding:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  background:rgba(255,255,255,.08);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .14s ease, background .14s ease, border-color .14s ease;
}

.bf-social-btn svg{
  width:18px;
  height:18px;
  flex-shrink:0;
}

.bf-social-btn:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.38);
}

.bf-social-icon{
  width:16px;
  height:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.78rem;
  font-weight:800;
  line-height:1;
  color:#fff;
}

.bf-social-btn span:last-child{
  display:none;
}

/* =========================
   MOBILE
========================= */
@media (max-width:760px){
  .split-share-btn{
    top:12px;
    right:12px;
    width:42px;
    height:42px;
    border-radius:12px;
  }

  .bf-share-close{
    top:12px;
    right:12px;
    width:38px;
    height:38px;
    border-radius:12px;
    font-size:1.1rem;
  }

  .bf-share-actions{
    left:50%;
    right:auto;
    bottom:10px;
    transform:translateX(-50%);
    gap:6px;
    padding:8px 10px;
    border-radius:16px;
  }

  .bf-social-btn{
    width:32px;
    height:32px;
    min-width:32px;
    min-height:32px;
    border-radius:10px;
  }

  .bf-social-icon{
    width:14px;
    height:14px;
    font-size:.72rem;
  }
}

.footer-links{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
  margin-bottom:18px;
}

.footer-links a{
  text-decoration:none;
  color:var(--stone);
  font-size:.9rem;
  transition:.18s ease;
}

.footer-links a:hover{
  color:var(--linden2);
}

.bf-cookie-overlay{
  position:fixed;
  inset:0;
  z-index:99999;
  background:rgba(30,48,40,.58);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}

.bf-cookie-box{
  width:100%;
  max-width:620px;
  background:#fff;
  border:1px solid #d8e9e0;
  border-radius:24px;
  padding:28px;
  box-shadow:0 25px 70px rgba(0,0,0,.28);
  color:#1e3028;
  font-family:'DM Sans',sans-serif;
}

.bf-cookie-box h3{
  font-family:'Playfair Display',serif;
  font-size:1.8rem;
  margin-bottom:12px;
}

.bf-cookie-box p{
  color:#52685c;
  font-size:.94rem;
  line-height:1.7;
  margin-bottom:12px;
}

.bf-cookie-small{
  font-size:.82rem!important;
  color:#7f9589!important;
}

.bf-cookie-options{
  display:grid;
  gap:12px;
  margin:20px 0;
}

.bf-cookie-option{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px;
  border:1px solid #d8e9e0;
  border-radius:16px;
  background:#f9fbfa;
  cursor:pointer;
}

.bf-cookie-option input{
  margin-top:4px;
  transform:scale(1.15);
}

.bf-cookie-option strong{
  display:block;
  color:#1e3028;
  font-size:.94rem;
}

.bf-cookie-option small{
  display:block;
  color:#52685c;
  font-size:.8rem;
  line-height:1.5;
  margin-top:2px;
}

.bf-cookie-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.bf-cookie-btn{
  flex:1;
  min-width:150px;
  border-radius:999px;
  padding:.85rem 1rem;
  font-weight:700;
  cursor:pointer;
  border:1.5px solid #d8e9e0;
  font-family:'DM Sans',sans-serif;
}

.bf-cookie-btn.primary{
  background:#afd04d;
  color:#fff;
  border-color:#afd04d;
}

.bf-cookie-btn.primary:hover{
  background:#91ad38;
}

.bf-cookie-btn.ghost{
  background:#fff;
  color:#52685c;
}

.bf-cookie-btn.ghost:hover{
  border-color:#afd04d;
  color:#91ad38;
}

.bf-cookie-links{
  margin-top:18px;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
  font-size:.84rem;
}

.bf-cookie-links a{
  color:#91ad38;
  text-decoration:none;
}

.bf-cookie-links a:hover{
  text-decoration:underline;
}

@media(max-width:700px){
  .bf-cookie-box{
    padding:22px;
  }

  .bf-cookie-actions{
    flex-direction:column;
  }

  .bf-cookie-btn{
    width:100%;
  }
}

.lang-switcher{
  position:relative;
    z-index:99999;
}

.lang-switcher {
  display: flex;
  align-items: center;
  gap: .2rem;
  margin-right: .5rem;
  background: var(--linden);
color: #fff;
font-size: .88rem;
      padding: .5rem 1.3rem;
    border-radius: 50px;
    font-family: 'DM Sans', sans-serif;
}

.lang-btn {
  padding: .28rem .55rem;
  border-radius: 50px;
  font-family: 'DM Sans', sans-serif;
  font-size: .75rem;
  font-weight: 700;
  cursor: pointer;
  border: none;
  background: transparent;
  color: var(--stone);
  letter-spacing: .02em;
  transition: all .15s ease;
  line-height: 1;
}



div#langSwitcher:hover {
   background: var(--linden2);
}

.lang-btn:hover {
  color: var(--linden2);
}

.lang-btn.active {
  background: var(--snow);
  color: var(--linden2);
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}

@media (max-width: 760px) {
  .lang-switcher {
    margin-right: 0;
    order: 1;
    width: auto;
    flex: none;
    padding: 14px !important;
  }
}


.lang-current{

  border-radius:50px;
  border:1px solid var(--linden);
  background: var(--linden);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:700;
  backdrop-filter:blur(10px);
}

button#langCurrent:hover{
   background: var(--linden2);
   border:1px solid var(--linden2);
}

.lang-arrow{
  font-size:10px;
  opacity:.8;
}

.lang-dropdown{
  position:absolute;
  top:46px;
  right:0;
  display:none;
  flex-direction:column;
  min-width:65px;
  padding:6px;
  border-radius:14px;
  background: var(--linden);
  box-shadow:0 10px 30px rgba(0,0,0,0.35);
  z-index:999999;
}

.lang-dropdown.open{
  display:flex;
}

.lang-dropdown button{
  border:0;
  background:transparent;
  color:#fff;
  height:38px;
  border-radius:10px;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
}

.lang-dropdown button:hover{
   background: var(--linden2);
}



/* Cookie Modal responsive fix */
.bf-cookie-overlay{
  padding:16px !important;
  overflow-y:auto !important;
  align-items:center !important;
}

.bf-cookie-box{
  width:min(720px, 100%) !important;
  max-height:calc(100vh - 32px) !important;
  overflow-y:auto !important;
}

/* Tablet */
@media (max-width: 1024px){
  .bf-cookie-box{
    width:min(680px, 96vw) !important;
    padding:22px !important;
  }

  .bf-cookie-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr 1fr !important;
    gap:10px !important;
  }
}

/* Handy */
@media (max-width: 760px){
  .bf-cookie-overlay{
    align-items:flex-start !important;
    padding:10px !important;
  }

  .bf-cookie-box{
    width:100% !important;
    max-height:calc(100vh - 20px) !important;
    padding:16px !important;
    border-radius:16px !important;
  }

  .bf-cookie-actions{
    position:sticky !important;
    bottom:0 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
    background:#fff !important;
    padding-top:12px !important;
    margin-top:12px !important;
    z-index:10 !important;
  }

  .bf-cookie-btn{
    width:100% !important;
    min-height:44px !important;
  }

  .bf-cookie-option{
    align-items:flex-start !important;
  }
}

/* =========================================================
   BODY-FINE FINAL NAV + LANGUAGE SWITCHER FIX
   - Nur ein grünes Element: .lang-current
   - .lang-switcher ist nur Wrapper
   - Buttons bleiben responsive
   - Keine doppelte Hover-Fläche
   - Lange Sprachtexte in Login/Register bleiben lesbar
========================================================= */

/* Navigation rechts */
nav{
  overflow:visible !important;
}

.nav-r{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:.55rem !important;
  flex-wrap:nowrap !important;
  min-width:0 !important;
}

/* Login/Register Buttons */
.nav-r > .btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  height:auto !important;
  padding:.58rem 1.15rem !important;
  border-radius:50px !important;
  line-height:1.18 !important;
  font-size:clamp(.78rem, .9vw, .9rem) !important;
  font-weight:700 !important;
  text-align:center !important;
  white-space:nowrap !important;
  flex:0 1 auto !important;
  width:auto !important;
  max-width:none !important;
}

/* Der Sprachumschalter ist nur der äußere Container */
.lang-switcher,
.btn-lang.lang-switcher,
div#langSwitcher{
  position:relative !important;
  z-index:99999 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 0 0 .05rem !important;
  background:transparent !important;
  border:none !important;
  border-radius:0 !important;
  color:inherit !important;
  line-height:normal !important;
  box-shadow:none !important;
  overflow:visible !important;
}

/* Nur dieser Button ist grün */
.lang-current,
button#langCurrent{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:.42rem !important;
  min-width:68px !important;
  width:auto !important;
  max-width:90px !important;
  height:42px !important;
  min-height:42px !important;
  padding:0 .95rem !important;
  border-radius:50px !important;
  border:1px solid var(--linden) !important;
  background:var(--linden) !important;
  color:#fff !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:.86rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  cursor:pointer !important;
  transition:background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
  box-shadow:none !important;
}

.lang-current:hover,
button#langCurrent:hover,
.lang-switcher:hover .lang-current{
  background:var(--linden2) !important;
  border-color:var(--linden2) !important;
  box-shadow:0 4px 14px rgba(175,208,77,.28) !important;
}

/* Pfeil */
.lang-arrow{
  font-size:.7rem !important;
  opacity:.9 !important;
  line-height:1 !important;
}

/* Dropdown exakt unter dem grünen Button */
.lang-dropdown,
div#langDropdown{
  position:absolute !important;
  top:calc(100% + 8px) !important;
  right:0 !important;
  display:none !important;
  flex-direction:column !important;
  width:68px !important;
  min-width:68px !important;
  max-width:68px !important;
  padding:6px !important;
  border-radius:14px !important;
  background:var(--linden) !important;
  border:none !important;
  box-shadow:0 12px 28px rgba(0,0,0,.24) !important;
  z-index:999999 !important;
  overflow:hidden !important;
}

.lang-dropdown.open,
div#langDropdown.open{
  display:flex !important;
}

.lang-dropdown button,
div#langDropdown button{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:36px !important;
  min-height:36px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
  color:#fff !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:.8rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  cursor:pointer !important;
  transition:background .16s ease !important;
}

.lang-dropdown button:hover,
div#langDropdown button:hover{
  background:var(--linden2) !important;
}

/* Tablet */
@media (max-width: 992px){

  nav{
    padding:0 1rem !important;
  }

  .nav-r{
    gap:.42rem !important;
  }

  .nav-r > .btn{
    padding:.55rem .9rem !important;
    font-size:.82rem !important;
  }

  .lang-current,
  button#langCurrent{
    height:40px !important;
    min-height:40px !important;
    min-width:64px !important;
    padding:0 .8rem !important;
    font-size:.82rem !important;
  }

  .lang-dropdown,
  div#langDropdown{
    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;
  }
}

/* Smartphone */
@media (max-width: 760px){

  nav{
    height:auto !important;
    min-height:0 !important;
    padding:.75rem .85rem !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:.65rem !important;
    overflow:visible !important;
  }

  .logo{
    width:100% !important;
    text-align:center !important;
  }

  .nav-r{
    width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:.45rem !important;
  }

  .nav-r > .btn{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:40px !important;
    height:auto !important;
    padding:.55rem .5rem !important;
    font-size:clamp(.68rem, 3vw, .8rem) !important;
    line-height:1.15 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  .lang-switcher,
  .btn-lang.lang-switcher,
  div#langSwitcher{
    width:auto !important;
    justify-self:end !important;
    align-self:stretch !important;
  }

  .lang-current,
  button#langCurrent{
    width:64px !important;
    max-width:64px !important;
    min-width:64px !important;
    height:40px !important;
    min-height:40px !important;
    padding:0 .65rem !important;
    font-size:.78rem !important;
  }

  .lang-dropdown,
  div#langDropdown{
    top:calc(100% + 6px) !important;
    right:0 !important;
    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;
  }

  .lang-dropdown button,
  div#langDropdown button{
    height:34px !important;
    min-height:34px !important;
    font-size:.76rem !important;
  }

  .hero-clean-content{
    padding-top:clamp(150px, 28vw, 205px) !important;
  }
}

/* Sehr kleine Smartphones */
@media (max-width: 430px){

  .nav-r{
    grid-template-columns:1fr 1fr 58px !important;
    gap:.35rem !important;
  }

  .nav-r > .btn{
    min-height:38px !important;
    padding:.48rem .35rem !important;
    font-size:clamp(.62rem, 3.15vw, .64rem) !important;
  }

  .lang-current,
  button#langCurrent{
    width:58px !important;
    min-width:58px !important;
    max-width:58px !important;
    height:38px !important;
    min-height:38px !important;
    padding:0 .45rem !important;
    font-size:.72rem !important;
    gap:.28rem !important;
  }

  .lang-dropdown,
  div#langDropdown{
    width:58px !important;
    min-width:58px !important;
    max-width:58px !important;
  }
}

/* Extrem kleine Geräte: Buttons untereinander, Sprache vollbreit */
@media (max-width: 340px){

  .nav-r{
    grid-template-columns:1fr !important;
  }

  .lang-switcher,
  .btn-lang.lang-switcher,
  div#langSwitcher{
    width:100% !important;
  }

  .lang-current,
  button#langCurrent{
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
  }

  .lang-dropdown,
  div#langDropdown{
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
  }
}