:root{
  --bg: #ffffff;
  --bg2: #F4F6FA;
  --ink: #0B1220;
  --muted: #5B667A;
  --line: rgba(27,38,59,.14);
  --navy: #1B263B;
  --navy2: #101A2E;
  --cta: #E63946;
  --cta2: #F2C14E;
  --ok: #19c37d;
  --shadow: 0 12px 40px rgba(16,26,46,.10);
  --radius: 18px;
  --radius2: 12px;
  --container: 1120px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.5;
}

a{color:inherit}

.container{max-width:var(--container); padding:0 18px; margin:0 auto}

.skip{
  position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip:focus{
  left:18px; top:12px; width:auto; height:auto; padding:10px 12px;
  background:#fff; border:1px solid var(--line); border-radius:10px; z-index:9999;
}

.sr{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0}

/* Topbar */
.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar__inner{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0}

.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand__mark{
  width:46px;
  height:46px;
  border-radius:6px;
  background: url('Logo.png') center/contain no-repeat;
  background-size: 140% ; /* image enlarged within the mark */
  background-position: center;
  box-shadow: 0 10px 24px rgba(230,57,70,.18);
  flex: 0 0 40px;
}
.brand__text{display:flex; flex-direction:column; line-height:1.2; margin-left:8px}
.brand__name{display:block; font-size:16px; font-weight:700; line-height:1; color:var(--navy)}
.brand__tag{display:block; font-size:12px; color:rgba(0,0,0,0.55); margin-top:2px}

.nav{display:none; align-items:center; gap:14px}
.nav__link{
  text-decoration:none;
  color:var(--navy);
  font-weight:700;
  font-size:14px;
  opacity:.88;
}
.nav__link:hover{opacity:1; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}
.nav__cta{
  text-decoration:none;
  background:linear-gradient(135deg, var(--cta), #ff5a66);
  color:#fff;
  font-weight:800;
  font-size:14px;
  padding:10px 14px;
  border-radius:14px;
  box-shadow: 0 14px 26px rgba(230,57,70,.22), inset 0 1px rgba(255,255,255,.4);
}
.nav__cta--pop{
  background: linear-gradient(135deg, var(--cta2), #ff9f1c);
  color: #101A2E;
  box-shadow: 0 18px 32px rgba(242,193,78,.35), inset 0 1px rgba(255,255,255,.7);
}

.navbtn{
  border:1px solid var(--line);
  background:#fff;
  border-radius:14px;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.navbtn__bar{width:20px; height:2px; background:var(--navy); border-radius:10px}

.mobile{border-top:1px solid var(--line); background:rgba(255,255,255,.92)}
.mobile__inner{display:flex; flex-direction:column; gap:10px; padding:14px 0}
.mobile__link{
  text-decoration:none;
  font-weight:800;
  color:var(--navy);
  padding:10px 12px;
  border-radius:12px;
}
.mobile__link:hover{background:rgba(27,38,59,.06)}

/* Typography */
.h1{font-size: clamp(30px, 4vw, 48px); line-height:1.07; letter-spacing:-.04em; margin:12px 0 10px}
.h2{font-size: clamp(22px, 2.6vw, 34px); line-height:1.15; letter-spacing:-.03em; margin:0}
.h3{font-size: 18px; letter-spacing:-.01em; margin:0 0 8px}
.lead{font-size: 16px; color:rgba(16,26,46,.84); margin:0 0 18px}
.p{margin:0 0 12px; color:rgba(16,26,46,.80)}
.sub{margin:10px 0 0; color:var(--muted); max-width:70ch}
.muted{color:var(--muted)}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:16px;
  padding:12px 16px;
  font-weight:900;
  letter-spacing:-.01em;
  text-decoration:none;
  border:1px solid transparent;
  cursor:pointer;
}
.btn--primary{
  background:linear-gradient(135deg, var(--cta2), #ffb347);
  color:#101A2E;
  box-shadow: 0 12px 28px rgba(242,193,78,.28);
}
.btn--pop{
  background: linear-gradient(135deg, #ffe29f, #ffc857);
  color: #101A2E;
  border-color: rgba(16,26,46,.08);
  box-shadow: 0 16px 40px rgba(255,200,87,.45);
}
.btn--pop:hover{
  filter: saturate(1.05);
}
.btn--ghost{
  background:#fff;
  border-color: var(--line);
  color:var(--navy);
}
.btn--secondary{
  background: transparent;
  border-color: rgba(27,38,59,.22);
  color: rgba(27,38,59,.92);
  box-shadow: none;
 }
.btn--secondary:hover{
  border-color: rgba(27,38,59,.34);
 }
.btn--small{padding:10px 12px; border-radius:14px; font-weight:900}
.btn--block{width:100%}
.btn:focus{outline:3px solid rgba(242,193,78,.45); outline-offset:2px}

.link{color:var(--navy); font-weight:900; text-decoration:none}
.link:hover{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}

/* Hero */
.main{min-height:100%}
.hero{
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero__bg{
  position:absolute; inset:-40px;
  background:
    radial-gradient(900px 400px at 25% 10%, rgba(27,38,59,.12), transparent 60%),
    radial-gradient(700px 420px at 90% 30%, rgba(230,57,70,.10), transparent 60%),
    radial-gradient(700px 520px at 75% 90%, rgba(242,193,78,.12), transparent 60%);
  pointer-events:none;
}
.hero__grid{display:grid; grid-template-columns: 1fr; gap:22px; padding:28px 0 26px; position:relative}

.chip{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.85);
  box-shadow: 0 10px 26px rgba(16,26,46,.06);
}
.chip__dot{width:10px; height:10px; border-radius:99px; background:var(--ok); box-shadow: 0 0 0 4px rgba(25,195,125,.18)}
.chip__text{font-weight:800; font-size:13px; color:var(--navy)}

.inline-field{display:inline-flex; align-items:center}
.city{
  width: 150px;
  margin:0 6px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:8px 10px;
  font-weight:800;
}
.city:focus{outline:3px solid rgba(242,193,78,.45); outline-offset:2px}

.citypill{
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(27,38,59,.18);
  background: rgba(244,246,250,.85);
  font-weight:1000;
  color:var(--navy);
  margin:0 6px;
  cursor:pointer;
 }
.citypill:hover{border-color: rgba(27,38,59,.30)}

.hero__actions{display:flex; gap:12px; flex-wrap:wrap; margin:12px 0 18px}

.trustrow{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
  margin-top:12px;
}
.trustrow__item{padding:12px 14px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.80)}
.trustrow__kpi{font-weight:1000; color:var(--navy); letter-spacing:-.03em; font-size:16px}
.trustrow__txt{color:var(--muted); font-weight:700; font-size:13px}

.panel{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow: var(--shadow);
}
.panel--tight{border-radius:16px}
.panel__head{padding:14px 14px 10px; border-bottom:1px solid var(--line)}
.panel__title{font-weight:1000; color:var(--navy); letter-spacing:-.02em}
.panel__sub{color:var(--muted); font-weight:700; font-size:12px; margin-top:4px}
.panel__body{padding:14px; display:flex; flex-direction:column; gap:12px}

.hero__image{
  margin-top:14px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background: linear-gradient(180deg, rgba(244,246,250,.55), #fff);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.hero__image__img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  filter: saturate(1.05) contrast(1.02);
  transform: translateZ(0);
}
.hero__image--large{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background: linear-gradient(180deg, rgba(244,246,250,.55), #fff);
  box-shadow: var(--shadow);
  overflow:hidden;
}

/* Home hero */
.homehero{
  position:relative;
  padding:48px 0 50px;
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(244,246,250,.45), #fff 60%);
}
.homehero__grid{display:grid; gap:32px; align-items:start}
.homehero__copy{display:flex; flex-direction:column; gap:20px; animation:fade-rise 500ms cubic-bezier(.22,.95,.35,1) both}
.signalrow{display:flex; flex-wrap:wrap; gap:8px}
.signal{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(242,193,78,.25);
  font-weight:900;
  color:var(--navy);
  font-size:12px;
}
.signal--outline{background:rgba(255,255,255,.8); border:1px solid rgba(27,38,59,.12)}
.homehero__actions{display:flex; align-items:center; flex-wrap:wrap; gap:12px}
.btn--outline{border-color:rgba(27,38,59,.16); color:var(--navy); background:rgba(255,255,255,.4); box-shadow:none}
.homehero__link{font-weight:900; color:var(--navy); text-decoration:none; display:inline-flex; align-items:center; gap:6px; padding:10px 0}
.homehero__link span{transition:transform .2s ease}
.homehero__link:hover span{transform:translateX(4px)}
.homehero__stats{display:flex; gap:18px; flex-wrap:wrap; margin-top:10px}
.stat{min-width:120px}
.stat__n{font-size:28px; font-weight:1000; color:var(--navy); letter-spacing:-.03em}
.stat__t{color:var(--muted); font-weight:750; font-size:13px}
.stat--badge{
  flex:1;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(27,38,59,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(244,246,250,.8));
  box-shadow:0 14px 28px rgba(16,26,46,.08);
}
.homehero .h1{line-height:1.08}
.homehero__panel{animation:panel-pop 420ms cubic-bezier(.22,.95,.35,1) 120ms both}
.pulsecard{
  border:1px solid rgba(27,38,59,.08);
  border-radius:28px;
  background:linear-gradient(180deg, #fff, rgba(244,246,250,.9));
  padding:26px;
  box-shadow: 0 14px 30px rgba(16,26,46,.12), 0 40px 80px rgba(6,14,40,.18);
  position:relative;
}
.pulsecard__head{display:flex; justify-content:space-between; align-items:center; margin-bottom:16px}
.pulsecard__badge{padding:6px 12px; border-radius:999px; background:rgba(27,38,59,.08); font-weight:900; font-size:12px}
.pulsecard__hint{font-weight:800; color:var(--muted); font-size:12px}
.pulsecard__list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.pulsecard__list li{
  display:grid;
  grid-template-columns:48px 1fr;
  align-items:center;
  background:rgba(255,255,255,.95);
  border:1px solid rgba(27,38,59,.08);
  border-radius:18px;
  padding:14px;
  gap:14px;
}
.pulsecard__step{
  width:48px;
  height:48px;
  border-radius:14px;
  background:linear-gradient(135deg, rgba(242,193,78,.25), rgba(230,57,70,.15));
  display:grid;
  place-items:center;
  font-weight:1000;
  color:var(--navy);
  letter-spacing:.08em;
}
.pulsecard__cta{margin-top:16px; display:flex; flex-direction:column; gap:4px; font-weight:800}
.homehero__glow{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(600px 220px at 20% 10%, rgba(242,193,78,.28), transparent 70%),
    radial-gradient(680px 320px at 80% 0%, rgba(27,38,59,.18), transparent 70%);
  opacity:.6;
}

.homeflow{background:#fff}
.flowcards{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.flowcard{
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px;
  background:#fff;
  box-shadow:0 16px 32px rgba(16,26,46,.08);
  position:relative;
  overflow:hidden;
}
.flowcard__n{position:absolute; top:12px; right:16px; font-weight:900; color:rgba(27,38,59,.18)}
.flowcard .h3{margin-top:12px}

.homegrid{background:linear-gradient(180deg, #fff, rgba(244,246,250,.75))}
.homegrid__wrapper{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.homegrid__card{
  border:1px solid rgba(27,38,59,.08);
  border-radius:var(--radius);
  background:#fff;
  padding:18px;
  box-shadow:0 16px 32px rgba(16,26,46,.08);
  display:flex;
  flex-direction:column;
  gap:12px;
}
.homegrid__pillrow{display:flex; flex-wrap:wrap; gap:8px}
.p--guarantee,.p--local{font-weight:800; color:var(--navy)}
.p--guarantee{border-top:1px dashed rgba(27,38,59,.16); padding-top:12px; margin-top:auto}
.p--local{margin-top:8px}

.botdemo{background:linear-gradient(180deg, #fff, #f7f8fc); padding:56px 0; border-top:1px solid rgba(27,38,59,.05)}
.botdemo__grid{display:grid; gap:32px; align-items:center}
.botdemo__copy{display:flex; flex-direction:column; gap:18px}
.botdemo__list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px}
.botdemo__list li{padding-left:18px; position:relative; font-weight:800; color:var(--navy)}
.botdemo__list li::before{content:'—'; position:absolute; left:0; top:0; color:var(--gold-dark)}
.botdemo__actions{display:flex; flex-wrap:wrap; gap:12px}
.botdemo__panel{animation:panel-pop 420ms cubic-bezier(.22,.95,.35,1) both}
.livecard{border:1px solid rgba(27,38,59,.08); border-radius:24px; background:#fff; padding:24px; box-shadow:0 32px 60px rgba(16,26,46,.15)}
.livecard__head{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:18px}
.livecard__status{padding:6px 12px; border-radius:999px; background:rgba(49,201,111,.16); color:#0f8a46; font-weight:900}
.livecandidate{display:flex; align-items:center; gap:12px; padding:14px; border:1px solid rgba(27,38,59,.08); border-radius:18px; background:linear-gradient(120deg, rgba(49,201,111,.18), rgba(244,246,250,.9))}
.livecandidate__img{width:56px; height:56px; border-radius:14px; object-fit:cover; border:2px solid rgba(255,255,255,.8); box-shadow:0 8px 16px rgba(16,26,46,.2)}
.livecandidate__badge{display:inline-flex; align-items:center; gap:6px; font-weight:900; color:#0f8a46; background:#fff; border-radius:999px; padding:6px 12px; margin-left:auto; font-size:13px}
.livefacts{list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; padding:18px 0 0; margin:18px 0 0; border-top:1px dashed rgba(27,38,59,.16)}
.livefacts li{display:flex; flex-direction:column; gap:2px; font-weight:800}
.livefacts span{color:var(--muted); font-weight:750; font-size:13px}
.livecard__footer{margin-top:18px; display:flex; flex-direction:column; gap:6px}
.livecard__tag{font-weight:900}
.livecard__note{color:var(--muted); font-size:13px}

.eyebrow{font-size:12px; letter-spacing:.2em; text-transform:uppercase; font-weight:900; color:var(--muted)}
.botdemo .sub{max-width:520px}

.homecta{background:#0B1220; color:#fff; border-top:1px solid rgba(255,255,255,.08)}
.homecta__inner{display:flex; flex-direction:column; gap:18px}
.homecta__actions{display:flex; flex-wrap:wrap; gap:12px}
.homecta__label{text-transform:uppercase; letter-spacing:.2em; font-size:12px; color:rgba(255,255,255,.7)}

@media (min-width: 960px){
  .homehero__grid{grid-template-columns:1.05fr .95fr}
  .botdemo__grid{grid-template-columns:1.05fr .95fr}
  .homecta__inner{flex-direction:row; justify-content:space-between; align-items:center}
}

@media (max-width: 768px){
  .homehero{padding:32px 0 16px}
  .homehero__grid{grid-template-columns:1fr; gap:28px}
  .homehero__panel{max-width:440px; width:100%; margin:0 auto}
  .homehero__actions{flex-direction:column}
  .homehero__stats{flex-direction:column; gap:12px}
  .stat{width:100%}
  .stat__n{font-size:28px}
  .homehero .h1{font-size:32px}
}

@media (max-width: 520px){
  .homehero .h1{font-size:28px}
  .homehero .lead{font-size:16px}
  .homehero__copy{gap:14px}
  .homehero__panel{max-width:100%}
}

@media (max-width: 640px){
  .livecandidate{flex-direction:column; align-items:flex-start}
  .livecandidate__badge{margin-left:0}
  .choices{flex-direction:column}
  .choice{width:100%; text-align:center; border-radius:16px}
}

/* Contact hero */
.contacthero{
  padding:44px 0 32px;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(700px 380px at 20% 10%, rgba(27,38,59,.12), transparent 60%),
    radial-gradient(620px 360px at 85% 20%, rgba(242,193,78,.18), transparent 60%),
    linear-gradient(180deg, #fff, rgba(244,246,250,.55));
}
.contacthero__grid{
  display:grid;
  gap:32px;
  align-items:start;
}
.contacthero__copy{display:flex; flex-direction:column; gap:18px}
.contacthero__copy .chip{align-self:flex-start}
.contacthero__copy > *{opacity:0; transform:translateY(12px); animation:fade-rise 480ms cubic-bezier(.22,.95,.35,1) forwards}
.contacthero__copy > *:nth-child(1){animation-delay:40ms}
.contacthero__copy > *:nth-child(2){animation-delay:120ms}
.contacthero__copy > *:nth-child(3){animation-delay:200ms}
.contacthero__copy > *:nth-child(4){animation-delay:280ms}
.contacthero__copy > *:nth-child(5){animation-delay:360ms}
.contacthero__cta{display:flex; flex-wrap:wrap; gap:12px}
.contacthero__status{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:var(--radius2);
  background:rgba(255,255,255,.85);
  box-shadow:0 10px 24px rgba(16,26,46,.05);
  font-weight:700;
  color:var(--muted);
}
.contacthero__badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(230,57,70,.12);
  color:var(--navy);
  font-size:12px;
  font-weight:900;
}
.contacthero__panel{width:100%}
.contact-panel{animation:panel-pop 320ms cubic-bezier(.22,.95,.35,1) both}

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

@keyframes fade-rise{
  from{opacity:0; transform:translateY(12px)}
  to{opacity:1; transform:translateY(0)}
}

.flow{display:flex; flex-direction:column; gap:12px}
.flow__step{
  display:flex;
  gap:10px;
  padding:12px;
  border:1px solid rgba(27,38,59,.08);
  border-radius:16px;
  background:rgba(244,246,250,.9);
  box-shadow:0 8px 18px rgba(16,26,46,.05);
  animation:flow-reveal 360ms cubic-bezier(.22,.95,.35,1) both;
}
.flow__step:nth-child(2){animation-delay:100ms}
.flow__step:nth-child(3){animation-delay:200ms}
.flow__n{
  width:34px;
  height:34px;
  border-radius:12px;
  background:rgba(230,57,70,.12);
  color:var(--navy);
  display:grid;
  place-items:center;
  font-weight:900;
}
.flow__title{font-weight:900; color:var(--navy); letter-spacing:-.01em}
.flow__text{color:var(--muted); font-weight:700; font-size:13px}

@keyframes flow-reveal{
  from{opacity:0; transform:translateY(8px)}
  to{opacity:1; transform:translateY(0)}
}

/* Contact section */
.contact-section{background:linear-gradient(180deg, #fff, rgba(244,246,250,.65));}
.contactgrid{
  display:grid;
  gap:22px;
  align-items:start;
}
.contactgrid__info{display:flex; flex-direction:column; gap:18px}

.status-card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:18px;
  box-shadow:var(--shadow);
}
.status-card__badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(242,193,78,.2);
  color:var(--navy);
  font-weight:900;
  font-size:12px;
}

.contact-highlights{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.contact-highlights li{
  display:flex;
  gap:12px;
  padding:12px;
  border:1px solid rgba(27,38,59,.08);
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 20px rgba(16,26,46,.04);
  opacity:0;
  transform:translateY(10px);
  animation:fade-rise 420ms cubic-bezier(.22,.95,.35,1) forwards;
}
.contact-highlights li:nth-child(1){animation-delay:80ms}
.contact-highlights li:nth-child(2){animation-delay:140ms}
.contact-highlights li:nth-child(3){animation-delay:200ms}
.contact-highlights span{font-size:18px}
.contact-highlights__title{font-weight:900; color:var(--navy)}
.contact-highlights__text{margin:4px 0 0; color:var(--muted); font-weight:700; font-size:13px}

.contactform{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 18px 36px rgba(16,26,46,.10);
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:16px;
  position:relative;
  overflow:hidden;
  opacity:0;
  transform:translateY(14px);
  animation:fade-rise 520ms cubic-bezier(.22,.95,.35,1) forwards 160ms;
}
.contactform::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(180px 60px at 80% -10%, rgba(242,193,78,.25), transparent);
  pointer-events:none;
}
.contactform__head{position:relative; z-index:1; display:flex; flex-direction:column; gap:6px}
.contactform__badge{
  align-self:flex-start;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(27,38,59,.06);
  font-weight:900;
  font-size:12px;
}
.contactform__row{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; position:relative; z-index:1}

.floating{display:flex; flex-direction:column; gap:6px; font-weight:900; color:var(--navy); position:relative}
.floating span{font-size:13px}
.floating .input,
.floating .select{
  transition:box-shadow .2s ease, transform .2s ease;
}
.floating .input:focus,
.floating .select:focus{
  box-shadow:0 12px 24px rgba(14,111,255,.16);
  transform:translateY(-2px);
}
.contactform__note{position:relative; z-index:1; font-weight:700; color:var(--muted); font-size:13px; text-align:center}
.contact-alert{
  border:1px solid rgba(27,38,59,.12);
  border-radius:16px;
  padding:12px 14px;
  font-weight:800;
  margin-bottom:6px;
}
.contact-alert--success{background:rgba(25,195,125,.12); color:#067447}
.contact-alert--error{background:rgba(230,57,70,.12); color:#a2202c}
.contact-alert--spam{background:rgba(255,183,3,.18); color:#9a6400}
.hp{position:absolute !important; left:-9999px !important; opacity:0 !important}
.consent{display:flex; align-items:flex-start; gap:10px; font-weight:800; color:var(--navy)}
.consent input{margin-top:4px}
.consent a{text-decoration:underline}

.bothero{
  padding:44px 0 30px;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(900px 520px at 10% -10%, rgba(242,193,78,.20), transparent 60%),
    radial-gradient(700px 420px at 90% 0%, rgba(27,38,59,.12), transparent 60%),
    #fff;
}
.bothero__grid{display:grid; gap:24px; align-items:start}
.bothero__copy{display:flex; flex-direction:column; gap:18px}
.bothero__actions{display:flex; flex-wrap:wrap; gap:12px}
.bothero__tags{display:flex; flex-wrap:wrap; gap:10px; font-weight:900; color:var(--muted)}
.bothero__tags span{padding:6px 10px; border:1px solid rgba(27,38,59,.15); border-radius:999px; background:rgba(255,255,255,.85)}
.bothero__card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:18px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:12px;
  animation:panel-pop 320ms cubic-bezier(.22,.95,.35,1) both;
}
.bothero__stat{display:flex; flex-direction:column; gap:4px}
.bothero__stat-n{font-size:40px; font-weight:1000; letter-spacing:-.03em; color:var(--navy)}
.bothero__stat-t{color:var(--muted); font-weight:700}

.botsection{background:linear-gradient(180deg, #fff, rgba(244,246,250,.8));}
.botgrid{display:grid; gap:22px; align-items:start}
.botchat{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(180deg, #fff, rgba(244,246,250,.6));
  padding:20px;
  box-shadow:0 20px 40px rgba(16,26,46,.12);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.botprogress{display:flex; flex-direction:column; gap:8px}
.botprogress__label{font-weight:900; color:var(--navy)}
.botprogress__bar{height:10px; border-radius:999px; background:rgba(27,38,59,.08); overflow:hidden}
.botprogress__bar span{display:block; height:100%; width:0; background:linear-gradient(135deg, #19c37d, #0E6FFF); border-radius:inherit; transition:width .4s ease}
.botchat__messages{flex:1; overflow-y:auto; overflow-x:hidden; padding-right:4px}
.chatmsg{
  display:flex;
  gap:10px;
  margin-bottom:16px;
  opacity:0;
  transform:translateX(20px);
  animation:chat-fly 520ms cubic-bezier(.22,.95,.35,1) forwards;
  animation-delay:var(--delay,0ms);
}
.chatmsg__avatar{width:42px; height:42px; border-radius:14px; background:rgba(27,38,59,.08); display:grid; place-items:center; font-size:20px}
.chatmsg__bubble{
  flex:1;
  border:1px solid rgba(27,38,59,.08);
  border-radius:18px;
  padding:14px;
  background:#fff;
  box-shadow:0 12px 28px rgba(16,26,46,.08);
  font-weight:700;
  color:var(--navy);
}
.chatmsg--bot .chatmsg__bubble{border-top-left-radius:10px}
.chatmsg--cta .chatmsg__bubble{background:linear-gradient(135deg, rgba(242,193,78,.25), rgba(230,57,70,.08));}
.choices{margin-top:12px; display:flex; flex-wrap:wrap; gap:8px}
.choice{
  border:1px solid rgba(27,38,59,.16);
  border-radius:999px;
  padding:10px 18px;
  font-weight:900;
  cursor:pointer;
  background:#fff;
  transition:all .2s ease;
}
.choice:hover{border-color:rgba(230,57,70,.4); box-shadow:0 10px 20px rgba(230,57,70,.10)}
.choice.is-selected{background:linear-gradient(135deg, var(--cta), #ff5a66); color:#fff; border-color:transparent}

.chatinput{display:flex; gap:8px; margin-top:12px}
.chatinput input{
  flex:1;
  border:1px solid rgba(27,38,59,.22);
  border-radius:14px;
  padding:10px 12px;
  font-weight:800;
}
.chatinput button{
  border:none;
  border-radius:14px;
  padding:10px 16px;
  font-weight:900;
  background:linear-gradient(135deg, var(--cta2), #ff9f1c);
  cursor:pointer;
}
.chatinput.is-locked input,
.chatinput.is-locked button{opacity:.45; cursor:not-allowed}

.botsummary{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:20px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.botsummary__badge{
  align-self:flex-start;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(27,38,59,.08);
  font-weight:900;
  font-size:12px;
}
.botsummary__list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px}
.botsummary__list li{display:flex; justify-content:space-between; font-weight:800; color:var(--navy); border-bottom:1px dashed rgba(27,38,59,.14); padding-bottom:6px}
.botsummary__list span{color:var(--muted)}
.botsummary__note{border:1px solid rgba(27,38,59,.12); border-radius:16px; padding:14px; background:rgba(244,246,250,.8); font-weight:700; color:var(--navy)}

@keyframes chat-fly{
  from{opacity:0; transform:translateX(30px)}
  to{opacity:1; transform:translateX(0)}
}
@media (min-width: 960px){
  .contacthero__grid{grid-template-columns:1.05fr .95fr}
  .contactgrid{grid-template-columns:.85fr 1.1fr}
  .bothero__grid{grid-template-columns:1.1fr .9fr}
  .botgrid{grid-template-columns:1.05fr .95fr}
}

@media (max-width: 768px){
  .contacthero__grid{grid-template-columns:1fr;}
  .contactform__row{grid-template-columns:1fr}
  .contactgrid{grid-template-columns:1fr}
  .contacthero{padding:32px 0 24px}
  .bothero__grid{grid-template-columns:1fr}
  .botgrid{grid-template-columns:1fr}
}

/* Fix dropdown alignment and appearance inside panels (Erstgespräch) */
.panel, .panel__body {
  overflow: visible; /* allow dropdown visuals */
}

.panel__body select,
.panel select,
.panel__body .select,
.panel .select {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 0.6rem 1rem;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.06);
  background-color: #fff;
  box-shadow: 0 6px 14px rgba(20,20,30,0.06);
  -webkit-appearance: none;
  appearance: none;
  font-size: 15px;
  line-height: 1;
  color: #111827;
  transition: box-shadow 180ms ease, transform 180ms ease, border-color 180ms ease;
  margin: 0;
  font: inherit;
  color: inherit;
}

/* Hide native IE/Edge expand icon so custom styling is consistent */
.panel__body select::-ms-expand {
  display: none;
}

/* Add a subtle arrow using background so the select still shows a dropdown indicator */
.panel__body select {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10' fill='none'><path d='M1 1l6 6 6-6' stroke='%23222' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: calc(100% - 14px) center;
  background-size: 14px 10px;
}

/* Ensure select options list appears above other elements */
.panel__body select:focus,
.panel__body select:active {
  z-index: 50;
}

/* Make sure select inherits font smoothing on macOS */
.panel__body select {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Keep options readable on desktop (limited cross-browser styling) */
.panel__body option {
  padding: 8px 10px;
  color: #111827;
}

/* Smooth select transitions */
.panel__body select {
  transition: all 220ms cubic-bezier(0.22, 0.95, 0.35, 1) !important;
  border-width: 2px !important;
}

.panel__body select:hover {
  box-shadow: 0 8px 20px rgba(20,20,30,0.1) !important;
  border-color: rgba(10,132,255,0.3) !important;
}

.panel__body select:focus {
  outline: none !important;
  border-color: rgba(10,132,255,0.8) !important;
  box-shadow: 0 0 0 3px rgba(10,132,255,0.1), 0 8px 20px rgba(10,132,255,0.12) !important;
}

.q{display:flex; flex-direction:column; gap:8px}
.q__t{font-weight:900; color:rgba(16,26,46,.88); font-size:13px}

.input,.select{
  width:100%;
  padding:12px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  font-weight:800;
  background:#fff;
}
.input:focus,.select:focus{outline:3px solid rgba(242,193,78,.45); outline-offset:2px}

.panel__result{
  min-height:18px;
  font-weight:900;
  color:var(--navy);
  padding-top:4px;
}

/* Faux-select: custom styled dropdown to replace native blue highlights */
.faux-select {
  position: relative;
  font: inherit;
}

.faux-select__button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.6rem 0.9rem;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.06);
  background-color: #fff;
  box-shadow: 0 8px 20px rgba(20,20,30,0.06);
  cursor: pointer;
  color: #111827;
  transition: box-shadow 180ms ease, transform 180ms ease, border-color 180ms ease;
  text-align: left;
}

.faux-select__button .label {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.faux-select__button .arrow {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-left: 8px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10' fill='none'><path d='M1 1l6 6 6-6' stroke='%23222' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  transition: transform 180ms ease;
}

.faux-select.open .faux-select__button .arrow {
  transform: rotate(180deg);
}

.faux-select__list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 10px);
  z-index: 220;
  background: #fff;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 22px 46px rgba(18,24,33,0.12);
  max-height: 260px;
  overflow: auto;
  padding: 6px;
  -webkit-overflow-scrolling: touch;
}

.faux-select__item {
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  color: #111827;
  transition: background-color 110ms ease, color 110ms ease;
}

.faux-select__item:hover {
  background: rgba(236,72,153,0.06); /* subtle pink hover */
}

.faux-select__item[aria-selected="true"] {
  background: linear-gradient(180deg, #ff6b7a 0%, #ef476f 100%);
  color: #fff;
}

/* when faux-select is near right edge ensure list doesn't overflow visually */
.faux-select__list[dir="rtl"] { left: auto; right: 0; }

/* Accessibility focus styles */
.faux-select__item:focus {
  outline: none;
  box-shadow: 0 0 0 4px rgba(14,111,255,0.08);
}

/* Sections */
.section{padding:40px 0; border-bottom:1px solid var(--line)}
.section--alt{background:var(--bg2)}
.section--cta{background: linear-gradient(180deg, var(--bg2), #fff)}
.section__head{margin-bottom:18px}

.cards{display:grid; grid-template-columns:1fr; gap:14px}
.cards--two{grid-template-columns:1fr}
.card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:16px;
  box-shadow: 0 10px 26px rgba(16,26,46,.06);
}
.card__icon{
  width:36px; height:36px;
  border-radius:14px;
  display:grid; place-items:center;
  background: rgba(27,38,59,.08);
  margin-bottom:10px;
  font-weight:1000;
}

.list{margin:10px 0 0; padding-left:16px; color:rgba(16,26,46,.80); font-weight:650}
.list li{margin:6px 0}

.bar{
  margin-top:16px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background: linear-gradient(135deg, rgba(27,38,59,.06), rgba(230,57,70,.06));
  display:flex;
  flex-direction:column;
  gap:12px;
}
.bar__title{font-weight:1000; color:var(--navy); letter-spacing:-.02em}
.bar__text{color:rgba(16,26,46,.84); font-weight:750}

/* Showcase */
.showcase{display:grid; grid-template-columns:1fr; gap:16px}
.steps{display:flex; flex-direction:column; gap:10px}
.step{
  display:flex; gap:12px;
  padding:12px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.9);
}
.step__n{
  width:32px; height:32px;
  border-radius:12px;
  display:grid; place-items:center;
  background:rgba(27,38,59,.10);
  font-weight:1000;
  color:var(--navy);
}
.step__t{font-weight:1000; color:var(--navy); letter-spacing:-.02em}
.step__p{color:var(--muted); font-weight:700; font-size:13px; margin-top:2px}

.note{margin-top:12px; padding:14px; border-radius:16px; border:1px solid var(--line); background:#fff}
.note__title{font-weight:1000; color:var(--navy); margin-bottom:4px}
.note__text{color:rgba(16,26,46,.82); font-weight:700}

.bot{
  border:1px solid var(--line);
  border-radius:18px;
  background: #fff;
  box-shadow: var(--shadow);
  overflow:hidden;
}
.bot__head{
  padding:12px 12px;
  background: linear-gradient(135deg, var(--navy), var(--navy2));
  color:#fff;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  align-items:center;
}
.bot__badge{
  font-weight:1000;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(242,193,78,.18);
  border:1px solid rgba(242,193,78,.30);
}
.bot__title{font-weight:1000; letter-spacing:-.02em}
.bot__meta{font-weight:800; font-size:12px; opacity:.9}

.bot__log{padding:12px; height:320px; overflow:auto; background:linear-gradient(180deg, #fff, rgba(27,38,59,.02))}

.msg{display:flex; margin:8px 0}
.msg--bot{justify-content:flex-start}
.msg--user{justify-content:flex-end}
.bubble{
  max-width: 86%;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid var(--line);
  background:#fff;
  box-shadow: 0 10px 20px rgba(16,26,46,.06);
  font-weight:700;
}
.msg--bot .bubble{border-top-left-radius:10px}
.msg--user .bubble{
  background: linear-gradient(135deg, rgba(230,57,70,.12), rgba(242,193,78,.16));
  border-color: rgba(230,57,70,.22);
  border-top-right-radius:10px;
}

/* Bot message animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Bot container */
.bot {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 500px;
  max-height: 500px;
}

.bot__head {
  padding: 16px;
  background: linear-gradient(135deg, #f5f5f5 0%, #fafafa 100%);
  border-bottom: 1px solid rgba(0,0,0,0.04);
  text-align: center;
}

.bot__badge {
  display: inline-block;
  padding: 4px 10px;
  background: rgba(10,132,255,0.1);
  color: #0E6FFF;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 8px;
}

.bot__title {
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  margin: 0;
}

.bot__meta {
  font-size: 13px;
  color: rgba(0,0,0,0.5);
  margin-top: 4px;
}

.bot__log {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  -webkit-overflow-scrolling: touch;
}

.msg {
  display: flex;
  animation: fadeInUp 0.4s cubic-bezier(0.22, 0.95, 0.35, 1) forwards;
}

.msg--bot {
  justify-content: flex-start;
}

.msg--user {
  justify-content: flex-end;
}

.bubble {
  max-width: 80%;
  padding: 10px 14px;
  border-radius: 14px;
  line-height: 1.5;
  font-size: 14px;
  word-wrap: break-word;
}

.msg--bot .bubble {
  background: #f3f4f6;
  color: #111827;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.msg--user .bubble {
  background: linear-gradient(135deg, #ff6b7a 0%, #ef476f 100%);
  color: #fff;
  box-shadow: 0 2px 8px rgba(239,71,111,0.2);
}

.bot__footer {
  padding: 12px 16px 16px;
  border-top: 1px solid rgba(0,0,0,0.04);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.bot__foot {
  padding: 12px 16px;
  background: rgba(0,0,0,0.02);
  border-top: 1px solid rgba(0,0,0,0.04);
  font-size: 12px;
  color: rgba(0,0,0,0.6);
  text-align: center;
}

.bot__composer{display:flex; gap:10px; padding:12px; border-top:1px solid var(--line); background:#fff}
.bot__input{
  flex:1;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px 12px;
  font-weight:800;
}
.bot__input:focus{outline:3px solid rgba(242,193,78,.45); outline-offset:2px}

.bot__quick{display:flex; flex-wrap:wrap; gap:10px; padding:12px; border-top:1px solid var(--line); background: rgba(244,246,250,.75)}
.qbtn{
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
}
.qbtn:hover{border-color: rgba(27,38,59,.28)}

.bot__foot{padding:12px; border-top:1px solid var(--line); background:#fff}

.cta-row{
  margin-top:16px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--bg2);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.cta-row--light{
  background:#fff;
  border:1px solid rgba(27,38,59,.08);
}
.cta-row__t{font-weight:1000; color:var(--navy); letter-spacing:-.02em}
.cta-row__p{color:var(--muted); font-weight:700; margin-top:4px}

/* Proof */
.proof__grid{display:grid; grid-template-columns:1fr; gap:14px}
.proofcard{border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:16px; box-shadow: 0 10px 26px rgba(16,26,46,.06)}
.proofcard__head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px}
.proofcard__title{font-weight:1000; color:var(--navy)}
.badge{font-weight:1000; font-size:12px; padding:6px 10px; border-radius:999px; border:1px solid var(--line); color:var(--muted); background:rgba(27,38,59,.04)}
.video{border-radius:16px; border:1px dashed rgba(27,38,59,.28); background:rgba(244,246,250,.9); aspect-ratio:16/9; display:grid; place-items:center}
.video__inner{font-weight:1000; color:var(--muted)}

.chart{margin-top:10px; display:flex; flex-direction:column; gap:10px}
.chart__row{display:grid; grid-template-columns:80px 1fr 88px; gap:10px; align-items:center}
.chart__label{font-weight:900; color:var(--navy)}
.chart__val{font-weight:1000; color:var(--navy); text-align:right}
.chart__bar{height:12px; border-radius:99px; background:rgba(27,38,59,.10); overflow:hidden; border:1px solid rgba(27,38,59,.10)}
.chart__bar span{display:block; height:100%; background: linear-gradient(90deg, var(--cta), var(--cta2))}
.chart__hint{color:var(--muted); font-weight:700; font-size:12px; margin-top:2px}

.kpis{display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:10px}
.kpi{border:1px solid var(--line); border-radius:16px; padding:12px; background:rgba(244,246,250,.8)}
.kpi__n{font-weight:1000; color:var(--navy); font-size:18px; letter-spacing:-.02em}
.kpi__t{color:var(--muted); font-weight:800; font-size:12px; margin-top:2px}

/* CTA Form */
.cta{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow: var(--shadow);
}

.mini{display:grid; grid-template-columns:1fr; gap:10px; margin-top:14px}
.mini__item{border:1px solid var(--line); border-radius:16px; padding:12px; background:rgba(244,246,250,.75)}
.mini__k{color:var(--muted); font-weight:900; font-size:12px}
.mini__v{color:var(--navy); font-weight:1000; margin-top:2px}

.form{display:flex; flex-direction:column; gap:12px}
.field{display:flex; flex-direction:column; gap:8px}
.field__l{font-weight:1000; color:var(--navy)}
.form__note{min-height:18px; font-weight:900; color:var(--navy)}

 .cta{
  padding:18px;
 }

 .cta__copy .sub{max-width: 52ch}

 .mini__item{
  background: linear-gradient(180deg, rgba(244,246,250,.95), rgba(244,246,250,.55));
 }

 .input,
 .select{
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
 }

 textarea.input{
  resize: vertical;
  min-height: 120px;
  line-height: 1.5;
 }

 .form .btn{margin-top: 2px}

.footline{display:flex; flex-direction:column; gap:10px; margin-top:14px}
.footline__left{color:var(--muted); font-weight:900}
.footline__right{text-align:left}

/* Bot page hero */
.pagehero{padding:28px 0; border-bottom:1px solid var(--line); background:
  radial-gradient(900px 400px at 20% 20%, rgba(27,38,59,.12), transparent 60%),
  radial-gradient(800px 420px at 85% 30%, rgba(230,57,70,.10), transparent 60%),
  radial-gradient(700px 520px at 70% 90%, rgba(242,193,78,.12), transparent 60%),
  linear-gradient(180deg, #fff, rgba(244,246,250,.55));
}
.pagehero__grid{display:grid; grid-template-columns:1fr; gap:18px}
.pagehero__actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:12px}

.pillrow{display:flex; flex-wrap:wrap; gap:10px; margin-top:10px}
.pill{font-weight:900; font-size:12px; padding:7px 10px; border-radius:999px; border:2px solid var(--cta); background:#fff; color:var(--navy)}

.timeline{display:flex; flex-direction:column; gap:10px}
.titem{display:flex; gap:12px; padding:12px; border:1px solid var(--line); border-radius:16px; background:#fff}
.titem__n{width:32px; height:32px; border-radius:12px; display:grid; place-items:center; background:rgba(230,57,70,.10); color:var(--navy); font-weight:1000}
.titem__t{font-weight:1000; color:var(--navy)}
.titem__p{color:var(--muted); font-weight:750; margin-top:2px}

/* Booking / Calendar demo */
.booking{display:grid; grid-template-columns:1fr; gap:14px}

.cal{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow: var(--shadow);
  overflow:hidden;
}
.cal__top{padding:14px 14px 10px; border-bottom:1px solid var(--line); display:flex; align-items:baseline; justify-content:space-between; gap:10px}
.cal__title{font-weight:1000; color:var(--navy); letter-spacing:-.02em}
.cal__hint{color:var(--muted); font-weight:800; font-size:12px}

.cal__days{display:grid; grid-template-columns:repeat(5, 1fr); gap:10px; padding:14px; border-bottom:1px solid var(--line); background:rgba(244,246,250,.6)}
.day{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:10px 10px;
  cursor:pointer;
  text-align:left;
}
.day:hover{border-color: rgba(27,38,59,.28)}
.day[aria-selected="true"]{
  border-color: rgba(230,57,70,.35);
  box-shadow: 0 10px 24px rgba(230,57,70,.10);
}
.day__dow{font-weight:1000; color:var(--navy); font-size:12px}
.day__date{font-weight:1000; color:rgba(16,26,46,.88); margin-top:2px}
.day__meta{color:var(--muted); font-weight:800; font-size:12px; margin-top:2px}

.cal__body{display:grid; grid-template-columns:1fr; gap:12px; padding:14px}
.cal__col{border:1px solid var(--line); border-radius:18px; background:#fff; padding:12px}
.cal__col--info{background: rgba(244,246,250,.55)}
.cal__label{font-weight:1000; color:var(--navy); letter-spacing:-.02em; margin-bottom:10px}
.cal__slots{display:grid; grid-template-columns:repeat(2, 1fr); gap:10px}
.slot{
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  padding:10px 10px;
  font-weight:1000;
  color:var(--navy);
  cursor:pointer;
}
.slot:hover{border-color: rgba(27,38,59,.28)}
.slot[aria-selected="true"]{
  border-color: rgba(230,57,70,.42);
  background: linear-gradient(135deg, rgba(230,57,70,.10), rgba(242,193,78,.12));
}
.slot[aria-disabled="true"]{
  opacity:.45;
  cursor:not-allowed;
  background: rgba(244,246,250,.7);
}

.cal__selection{font-weight:950; color:rgba(16,26,46,.88)}
.cal__mini{margin-top:8px; color:var(--muted); font-weight:750; font-size:12px}

.formpanel .panel{height:100%}
.hint{color:var(--muted); font-weight:900; font-size:12px}

.icons{display:grid; grid-template-columns:1fr; gap:12px; margin-top:16px}
.iconline{display:flex; gap:12px; padding:14px; border:1px solid var(--line); border-radius:18px; background:#fff}
.iconline__i{width:38px; height:38px; border-radius:14px; display:grid; place-items:center; background:rgba(27,38,59,.08); font-weight:1000}
.iconline__t{font-weight:1000; color:var(--navy); letter-spacing:-.02em}
.iconline__p{color:var(--muted); font-weight:750; margin-top:2px}

/* Kontakt page polish */
.kontakt-layout{
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
}

.kontakt-formpanel .panel__head,
.kontakt-sidepanel .panel__head{
  padding: 18px 18px 12px;
}

.kontakt-formpanel .panel__body,
.kontakt-sidepanel .panel__body{
  padding: 18px;
  gap: 14px;
}

.kontakt-formpanel{
  background:
    radial-gradient(420px 180px at 90% -20%, rgba(230,57,70,.10), transparent 70%),
    #fff;
}

.kontakt-highlight{
  display:flex;
  flex-direction:column;
  gap:4px;
  border:1px solid rgba(230,57,70,.20);
  border-radius:14px;
  background: linear-gradient(135deg, rgba(230,57,70,.08), rgba(242,193,78,.10));
  padding:11px 12px;
  color: rgba(16,26,46,.92);
  font-weight:700;
  font-size:13px;
}
.kontakt-highlight strong{
  font-weight:1000;
  color:var(--navy);
}

.kontakt-submit{
  margin-top: 4px;
  min-height: 48px;
}

.kontakt-sidepanel{
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,246,250,.72));
}

.kontakt-pillrow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.kontakt-pill{
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(27,38,59,.18);
  border-radius:999px;
  background:#fff;
  padding:6px 10px;
  font-weight:900;
  font-size:12px;
  color:var(--navy);
}

.kontakt-sidepanel .iconline{
  border-radius:14px;
  background: rgba(255,255,255,.82);
}

.kontakt-sidepanel .iconline__i{
  background: rgba(230,57,70,.12);
  color: var(--navy);
}

.kontakt-mailbar{
  margin-top: 2px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(27,38,59,.06), rgba(242,193,78,.12));
}

.kontakt-mailbtn{
  white-space: nowrap;
}

/* Kontakt hero redesign */
.kontakt-hero{
  position: relative;
  overflow: hidden;
  padding: 38px 0 34px;
  background:
    radial-gradient(620px 280px at 8% 8%, rgba(14,111,255,.14), transparent 70%),
    radial-gradient(620px 260px at 92% 18%, rgba(230,57,70,.12), transparent 70%),
    linear-gradient(180deg, #f8fbff 0%, #f2f6fc 45%, #ffffff 100%);
}

.kontakt-hero::after{
  content:"";
  position:absolute;
  inset:auto -80px -130px -80px;
  height:220px;
  background: radial-gradient(70% 100% at 50% 0%, rgba(27,38,59,.08), transparent 70%);
  pointer-events:none;
}

.kontakt-hero__copy{
  position: relative;
  z-index: 2;
}

.kontakt-hero .h1{
  max-width: 18ch;
  margin-top: 14px;
  margin-bottom: 12px;
  letter-spacing: -.045em;
}

.kontakt-hero .lead{
  max-width: 56ch;
  font-size: 17px;
  color: rgba(16,26,46,.83);
}

.kontakt-hero .chip{
  border-color: rgba(14,111,255,.20);
  background: rgba(255,255,255,.82);
  box-shadow: 0 14px 30px rgba(16,26,46,.08);
}

.kontakt-hero__stats{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:10px;
  max-width: 520px;
  margin: 2px 0 14px;
}

.kontakt-stat{
  display:flex;
  flex-direction:column;
  gap:2px;
  border:1px solid rgba(27,38,59,.12);
  border-radius: 14px;
  background: rgba(255,255,255,.85);
  box-shadow: 0 10px 24px rgba(16,26,46,.06);
  padding: 10px 12px;
}

.kontakt-stat__v{
  font-weight:1000;
  font-size:17px;
  letter-spacing:-.02em;
  color: var(--navy);
}

.kontakt-stat__l{
  font-weight:800;
  font-size:12px;
  color: var(--muted);
}

.kontakt-hero__panel{
  position: relative;
  z-index: 2;
}

.kontakt-hero__panel-inner{
  border: 1px solid rgba(27,38,59,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.82));
  box-shadow: 0 20px 44px rgba(16,26,46,.12);
  backdrop-filter: blur(8px);
}

.kontakt-hero__step{
  padding: 12px;
  border-color: rgba(27,38,59,.10);
  background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(244,246,250,.9));
}

.kontakt-hero__step .titem__n{
  background: linear-gradient(135deg, rgba(14,111,255,.20), rgba(230,57,70,.16));
  border: 1px solid rgba(14,111,255,.15);
}

/* Footer */
.footer{padding:22px 0; background:linear-gradient(180deg, #fff, rgba(244,246,250,.8))}
.footer__inner{display:flex; flex-direction:column; gap:10px; border-top:1px solid var(--line); padding-top:16px}
.footer__brand{font-weight:1000; color:var(--navy)}
.footer__muted{color:var(--muted); font-weight:700}
.footer__right{display:flex; gap:14px; flex-wrap:wrap}
.footer__link{text-decoration:none; color:var(--navy); font-weight:900; opacity:.9}
.footer__link:hover{opacity:1; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}

/* Slide-down entrance for hero panel */
.hero__panel .panel {
  opacity: 0;
  transform: translateY(-12px);
  animation: panel-slide-down 420ms cubic-bezier(.22,.95,.35,1) 120ms both;
  will-change: transform, opacity;
}

@keyframes panel-slide-down {
  from { opacity: 0; transform: translateY(-12px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Subtle staggered pop for panel content */
.hero__panel .panel__body > * {
  opacity: 0;
  transform: translateY(6px);
  animation: panel-content-pop 420ms cubic-bezier(.22,.95,.35,1) 220ms both;
}

@keyframes panel-content-pop {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Responsive */
@media (min-width: 760px){
  .nav{display:flex}
  .navbtn{display:none}
  .hero__grid{grid-template-columns: 1.2fr .8fr; align-items:start; padding:44px 0 40px}
  .trustrow{grid-template-columns: repeat(3, 1fr)}
  .cards{grid-template-columns: repeat(3, 1fr)}
  .cards--two{grid-template-columns: repeat(2, 1fr)}
  .showcase{grid-template-columns: 1fr 1.05fr; align-items:start}
  .bar{flex-direction:row; align-items:center; justify-content:space-between}
  .cta-row{flex-direction:row; align-items:center; justify-content:space-between}
  .cta{grid-template-columns: 1.2fr .8fr; align-items:start}
  .mini{grid-template-columns: repeat(3, 1fr)}
  .proof__grid{grid-template-columns: repeat(3, 1fr)}
  .footline{flex-direction:row; align-items:center; justify-content:space-between}
  .footer__inner{flex-direction:row; align-items:flex-start; justify-content:space-between}
  .pagehero__grid{grid-template-columns: 1.1fr .9fr; align-items:start}
  .booking{grid-template-columns: 1.2fr .8fr; align-items:start}
  .cal__body{grid-template-columns: 1fr .9fr}
  .cal__slots{grid-template-columns:repeat(2, 1fr)}
  .icons{grid-template-columns: repeat(3, 1fr)}
}

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

/* Mobile optimization */
@media (max-width: 768px) {
  .hero__grid {
    grid-template-columns: 1fr !important;
  }

  .hero__panel {
    margin-top: 24px;
  }

  .homehero{
    padding: 28px 0 18px;
  }

  .homehero__copy{
    padding: 0;
  }

  .homehero__panel{
    width: 100%;
  }

  .homehero__stats{
    gap: 14px;
  }

  .btn {
    min-height: 48px;
    font-size: 15px;
    padding: 12px 16px;
  }

  .nav {
    display: none;
  }

  .navbtn {
    display: block;
  }

  .h1 {
    font-size: 28px;
    line-height: 1.2;
  }

  .h2 {
    font-size: 22px;
  }

  .h3 {
    font-size: 18px;
  }

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

  .cards--two {
    grid-template-columns: 1fr !important;
  }

  .panel__body select {
    font-size: 16px;
    padding: 0.8rem 1rem;
    height: 52px;
  }

  .bot {
    height: 450px;
  }

  .trustrow {
    flex-direction: column;
    gap: 12px;
  }

  .trustrow__item {
    padding: 16px;
  }

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

  .bothero{
    padding: 32px 0 24px;
  }

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

  .bothero__card{
    width: 100%;
  }

  .botsection{
    padding: 32px 0;
  }

  .botchat{
    min-height: 420px;
    padding: 16px;
  }

  .botsummary{
    padding: 18px;
  }

  .bar {
    flex-direction: column;
    gap: 16px;
  }

  .bar__left {
    text-align: center;
  }

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

  .pagehero__panel {
    margin-top: 24px;
  }

  .kontakt-hero{
    padding: 28px 0 26px;
  }

  .kontakt-hero__stats{
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  .kontakt-layout{
    grid-template-columns: 1fr !important;
  }

  .kontakt-mailbtn{
    width: 100%;
  }

  input[type="text"],
  input[type="email"],
  input[type="tel"],
  textarea,
  select {
    font-size: 16px;
    padding: 12px;
    border-radius: 10px;
  }

  .faux-select__button {
    height: 48px;
    padding: 0.7rem 0.9rem;
  }

  .cta-row {
    flex-direction: column;
    gap: 16px;
  }

  .timeline {
    gap: 16px;
  }

  .titem__n {
    min-width: 36px;
    height: 36px;
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .hero__copy {
    padding: 0 16px;
  }

  .h1 {
    font-size: 24px;
  }

  .h2 {
    font-size: 20px;
  }

  .lead {
    font-size: 16px;
  }

  .container {
    padding: 16px;
  }

  .hero__actions {
    flex-direction: column;
  }

  .btn {
    width: 100%;
  }

  .panel {
    border-radius: 12px;
  }

  .msg .bubble {
    max-width: 90%;
    font-size: 13px;
  }

  .btn--ghost {
    padding: 10px 12px;
  }

  .pillrow {
    flex-wrap: wrap;
    gap: 6px;
  }

  .pill {
    font-size: 12px;
    padding: 6px 10px;
  }
}
