*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

body {
  font-family: system-ui, -apple-system, "Inter", Roboto, Arial, sans-serif;
  color:#111;
  background:#fff;
  line-height:1.6;
}

img, video { max-width:100%; display:block; }

.container {
  max-width:980px;
  margin:0 auto;
  padding:0 16px;
}

/* ========== HERO: BOKA ONLINE ========== */
#boka-taxi-online-top {
  padding:140px 16px 18px;
}

#boka-taxi-online-top p.intro {
  font-size:1.08rem;
  color:#111827;
  margin:0 0 10px;
  text-align:center;
}

/* Logo block (trust indicator) */
.hero-logo-block {
  max-width:260px;
  margin:14px auto 8px;
}
.hero-logo-block img {
  width:100%;
  height:auto;
  display:block;
}

#boka-taxi-online-top h1 {
  font-size:1.95rem;
  color:#0f172a;
  margin:8px 0 14px;
  text-align:center;
  font-weight:800;
  letter-spacing:-.4px;
}

.bto-cta-row {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  margin:4px 0 16px;
}

.bto-cta-row a {
  text-decoration:none;
  border-radius:999px;
  padding:10px 18px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.96rem;
  white-space:nowrap;
}

.bto-cta-main {
  background:#ff6b00;
  color:#fff;
  font-weight:700;
}

.bto-cta-app {
  background:#111827;
  color:#fff;
}

.bto-cta-phone {
  background:#fff;
  border:1px solid #e5e7eb;
  color:#111827;
}

.bto-benefits-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:12px;
  margin:10px 0 4px;
}

.bto-benefit-card {
  background:#f9fafb;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:12px 12px 10px;
  font-size:.95rem;
  color:#111827;
}

.bto-steps-box {
  background:#eef2ff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:12px 14px;
  margin:14px 0 0;
  text-align:center;
  font-size:.95rem;
  color:#111827;
}

.bto-steps-inline {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  justify-content:center;
  margin-top:8px;
  font-size:.98rem;
}

.bto-steps-inline div {
  min-width:210px;
}

/* ========== BOOKING WIDGET WRAPPER ========== */
.embed-surface {
  max-width:980px;
  margin:0 auto 30px;
  padding:0 16px;
  min-height:620px;
}
@media(max-width:768px){
  #boka-taxi-online-top { padding:120px 16px 18px; }
  .embed-surface { min-height:720px; }
}

/* ========== CONTENT BELOW FORM ========== */
#boka-taxi-online-below {
  padding:22px 16px 28px;
}

#boka-taxi-online-below h2 {
  font-size:1.6rem;
  color:#0f172a;
  text-align:center;
  margin:0 0 14px;
  font-weight:700;
}

#boka-taxi-online-below p.lead {
  margin:0 0 12px;
  color:#111827;
  font-size:.98rem;
  text-align:center;
}

.bto-methods-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
  margin:10px 0 20px;
}

.bto-method-card {
  background:#f9fafb;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:12px;
  font-size:.95rem;
  color:#374151;
}

.bto-method-card h3 {
  margin:0 0 6px;
  font-size:1.05rem;
  color:#111827;
}

.bto-mini-faq-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
  margin:0 0 18px;
}

.bto-mini-faq-grid article {
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:12px;
  font-size:.95rem;
  color:#374151;
}

.bto-mini-faq-grid h3 {
  margin:0 0 6px;
  font-size:1.02rem;
  color:#111827;
}

#boka-taxi-online-below a {
  color:#111827;
  text-decoration:underline;
  text-underline-offset:2px;
}

.bto-bottom-link {
  margin:0 0 6px;
  color:#4b5563;
  font-size:.94rem;
  text-align:center;
}

/* ========== RELATERADE BLOCK (INTERNLÄNKNING) ========== */
.related-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
  margin-top:10px;
}

.related-card {
  background:#f9fafb;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:12px;
  font-size:.95rem;
  color:#111827;
}