/* =========================================================
   Voser Transport AG, Unterseiten
   ========================================================= */

/* Seiten-Hero (Breadcrumb + Titel) */
.page-hero{background:var(--soft);border-bottom:1px solid var(--line);padding:56px 0 60px}
.page-hero .container{position:relative}
.breadcrumb{font-size:.9rem;color:var(--muted);margin-bottom:14px;font-family:var(--ff-head);font-weight:500}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb .sep{margin:0 .3em;color:var(--line)}
.breadcrumb .current{color:var(--ink)}
.page-hero h1{margin:0;font-size:clamp(2.1rem,3.6vw,3rem)}
.page-lead{margin:16px 0 0;font-size:1.15rem;color:var(--text);max-width:48em}

.container-narrow{max-width:860px}

/* Detail-Intro (Text + Bild) */
.detail-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.detail-text .lead{font-size:1.2rem;color:var(--ink);font-weight:500;margin-bottom:1rem}
.detail-text p{color:var(--text)}
.detail-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:1.6rem}
.detail-media img{width:100%;height:420px;object-fit:cover;box-shadow:var(--shadow)}

/* Zwei-Spalten-Block (Bullets) */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.col-block h2{font-size:1.5rem;margin-bottom:1.2rem}
.check-list{list-style:none;margin:0;padding:0}
.check-list li{position:relative;padding-left:40px;margin-bottom:16px;font-size:1.05rem;color:var(--text);min-height:26px;display:flex;align-items:center}
.check-list li::before{content:"\2713";position:absolute;left:0;top:0;width:26px;height:26px;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:.85rem;font-weight:700}

/* Fuhrpark: abwechselnde Reihen */
.vehicle-list{display:flex;flex-direction:column;gap:30px}
.vehicle{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);background:#fff}
.vehicle--rev .vehicle-img{order:2}
.vehicle-img{min-height:340px;background-size:cover;background-position:center}
.vehicle-body{padding:48px}
.vehicle-body h3{font-size:1.5rem;margin-bottom:.5em}
.vehicle-body p{color:var(--muted);margin-bottom:1.3rem}

/* Kontakt */
.contact-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:60px;align-items:start}
.contact-info h2{font-size:1.7rem}
.contact-lines{list-style:none;margin:24px 0 0;padding:0}
.contact-lines li{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--line)}
.contact-lines li .ci{width:48px;height:48px;background:var(--blue-soft);display:grid;place-items:center;flex:0 0 auto}
.contact-lines li .ci svg{width:24px;height:24px;color:var(--blue);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.contact-lines strong{font-family:var(--ff-head);color:var(--ink)}

/* Formulare */
.form{position:relative}
.contact-form-wrap h2{font-size:1.7rem;margin-bottom:1.2rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.form label{display:block;font-family:var(--ff-head);font-weight:600;color:var(--ink);margin-bottom:18px;font-size:.95rem}
.form input,.form select,.form textarea{display:block;width:100%;margin-top:8px;padding:.85em 1em;border:1.5px solid var(--line);font-family:var(--ff-body);font-size:1rem;font-weight:400;color:var(--ink);background:#fff}
.form textarea{resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.form .is-error{border-color:#d23b3b;background:#fdf6f6}
.form button[type=submit]{margin-top:6px}
.form-hint{font-size:.85rem;color:var(--muted);margin-top:16px}
.form-hint a{text-decoration:underline}
.form-note{padding:22px 26px;margin-bottom:26px;border-left:4px solid}
.form-note h3{margin:0 0 .3em;font-size:1.2rem}
.form-note p{margin:0}
.form-success{background:#eef7ef;border-color:#3a9d4f}
.form-success h3{color:#1f5b2c}
.form-error{background:#fdecec;border-color:#d23b3b;color:#9a2020}
.form-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);padding:48px}
.anfrage-section{scroll-margin-top:100px}
@media (max-width:560px){.form-card{padding:30px 22px}}

/* Karte (OpenStreetMap-Embed) */
.map-full{padding:0}
.map-embed{position:relative;width:100%;height:100%;min-height:260px;display:flex;flex-direction:column;background:#eef2f7}
.map-embed iframe{width:100%;flex:1 1 auto;min-height:240px;border:0;display:block}
.map-open{display:flex;align-items:center;justify-content:center;gap:.5em;background:#fff;border-top:1px solid var(--line);padding:.95em 1em;font-family:var(--ff-head);font-weight:600;font-size:.9rem;color:var(--blue);text-align:center}
.map-open .arr{transition:transform .18s}
.map-open:hover .arr{transform:translateX(4px)}
.map-full .map-embed{min-height:460px}
.map-full .map-embed iframe{min-height:420px}

/* Prose (Rechtstexte) */
.prose h2{font-size:1.4rem;margin:2em 0 .6em}
.prose h2:first-child{margin-top:0}
.prose p{color:var(--text);margin-bottom:1rem}
.prose a{text-decoration:underline}
.prose-note{margin-top:2em;padding:18px 22px;background:var(--soft);border-left:4px solid var(--blue);font-size:.92rem;color:var(--muted)}

/* Responsive */
@media (max-width:900px){
  .detail-intro,.two-col,.contact-layout{grid-template-columns:1fr;gap:36px}
  .detail-media{order:-1}
  .detail-media img{height:300px}
  .vehicle{grid-template-columns:1fr}
  .vehicle--rev .vehicle-img{order:0}
  .vehicle-img{min-height:240px}
  .vehicle-body{padding:34px 28px}
}
@media (max-width:560px){
  .form-row{grid-template-columns:1fr;gap:0}
  .page-hero{padding:40px 0 44px}
  .vehicle-body{padding:28px 22px}
}
