/* valekine.eu — Material Design, Natürliche Palette */
:root{
  --primary:#558B2F;
  --secondary:#AED581;
  --accent:#FF7043;
  --neutral:#F1F8E9;
  --text:#1B5E20;
}

html{scroll-behavior:smooth;}
html,body{overflow-x:hidden;}

body{
  font-family:'Mulish',sans-serif;
  color:var(--text);
  background:#ffffff;
  line-height:1.7;
  margin:0;
}

h1,h2,h3,h4{
  font-family:'Fraunces',serif;
  color:var(--text);
  line-height:1.2;
}

a{color:var(--primary);text-decoration:none;transition:color .2s ease;}
a:hover,a:focus{color:var(--accent);}

/* ---- Material shadows / depth ---- */
.elev-1{box-shadow:0 1px 3px rgba(27,94,32,.16),0 1px 2px rgba(27,94,32,.18);}
.elev-2{box-shadow:0 4px 10px rgba(27,94,32,.12),0 2px 4px rgba(27,94,32,.14);}
.elev-3{box-shadow:0 12px 28px rgba(27,94,32,.16),0 6px 12px rgba(27,94,32,.12);}

/* ---- Card ---- */
.card{
  background:#fff;
  border-radius:18px;
  padding:1.75rem;
  box-shadow:0 4px 14px rgba(27,94,32,.10);
  transition:transform .25s ease,box-shadow .25s ease;
}
.card:hover,.card:focus-within{
  transform:translateY(-6px);
  box-shadow:0 18px 36px rgba(27,94,32,.18);
}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.8rem;border-radius:999px;font-weight:800;
  letter-spacing:.02em;cursor:pointer;border:none;transition:all .22s ease;
  font-family:'Mulish',sans-serif;text-align:center;
}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 6px 16px rgba(85,139,47,.35);}
.btn-primary:hover{background:#46751f;color:#fff;transform:translateY(-2px);}
.btn-accent{background:var(--accent);color:#fff;box-shadow:0 8px 22px rgba(255,112,67,.45);font-size:1.05rem;}
.btn-accent:hover{background:#f0521e;color:#fff;transform:translateY(-3px) scale(1.02);}
.btn-ghost{background:transparent;color:var(--primary);border:2px solid var(--secondary);}
.btn-ghost:hover{background:var(--neutral);color:var(--primary);}

/* ---- Floating action button (Material) ---- */
.fab{
  position:fixed;right:20px;bottom:20px;z-index:60;
  background:var(--accent);color:#fff;border-radius:999px;
  padding:.95rem 1.5rem;font-weight:800;display:inline-flex;align-items:center;gap:.5rem;
  box-shadow:0 10px 26px rgba(255,112,67,.5);animation:floaty 3s ease-in-out infinite;
}
.fab:hover{color:#fff;transform:scale(1.05);}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* ---- Inputs ---- */
.field{
  width:100%;padding:.85rem 1.1rem;border:1.5px solid var(--secondary);
  border-radius:12px;background:#fff;font-family:'Mulish',sans-serif;color:var(--text);
  transition:border-color .2s ease,box-shadow .2s ease;font-size:1rem;
}
.field:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px rgba(174,213,129,.4);}

/* ---- Animations on scroll ---- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:none;}

/* ---- Section helpers ---- */
.section{padding:4.5rem 1.25rem;}
.wrap{max-width:1140px;margin:0 auto;}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-weight:800;color:var(--accent);font-size:.8rem;}

/* ---- Header ---- */
.topbar{background:var(--text);color:#fff;font-size:.85rem;}
.topbar a{color:#fff;}
.topbar a:hover{color:var(--secondary);}
.mainnav{background:#fff;}
.navlink{font-weight:700;color:var(--text);padding:.4rem .2rem;position:relative;}
.navlink::after{content:"";position:absolute;left:0;bottom:-4px;height:3px;width:0;background:var(--accent);transition:width .25s ease;border-radius:2px;}
.navlink:hover::after{width:100%;}

/* ---- Cookie / modal ---- */
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:80;background:#fff;border-top:4px solid var(--primary);}
.modal-overlay{position:fixed;inset:0;background:rgba(27,94,32,.55);z-index:90;display:none;align-items:center;justify-content:center;padding:1rem;}
.modal-overlay.show{display:flex;}
.toggle{appearance:none;width:46px;height:26px;border-radius:999px;background:#cfd8c5;position:relative;cursor:pointer;transition:background .2s;}
.toggle:checked{background:var(--primary);}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .2s;}
.toggle:checked::after{left:23px;}
.toggle:disabled{opacity:.7;cursor:not-allowed;}

/* ---- FAQ accordion ---- */
.acc-q{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;font-weight:800;}
.acc-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.acc-item.open .acc-a{max-height:400px;}
.acc-item.open .acc-ico{transform:rotate(45deg);}
.acc-ico{transition:transform .25s ease;color:var(--accent);font-size:1.5rem;line-height:1;}

/* ---- Tabs ---- */
.tab-btn{padding:.7rem 1.2rem;border-radius:999px;font-weight:800;cursor:pointer;background:var(--neutral);color:var(--text);border:none;}
.tab-btn.active{background:var(--primary);color:#fff;}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* ---- Map ---- */
.map-frame{width:100%;height:380px;border:0;border-radius:18px;}

footer a{color:#dcedc8;}
footer a:hover{color:#fff;}