/* Unterseiten-Komponenten */

/* Seiten-Kopf */
.page-header{
  background:var(--ink);color:#f4efe5;padding:64px 0 56px;
}
.page-header .container{position:relative;}
.page-header .eyebrow{color:#ffb27a;}
.page-header .eyebrow::before{background:#ffb27a;}
.page-header h1{
  font-family:'Fraunces',serif;font-weight:600;
  font-size:clamp(30px,4vw,46px);line-height:1.15;margin:14px 0 12px;letter-spacing:-.01em;
}
.page-header p{color:#d9d2c3;font-size:16.5px;max-width:640px;}
.breadcrumb{display:flex;gap:8px;flex-wrap:wrap;font-size:13px;color:#cfc7b6;margin-bottom:20px;}
.breadcrumb a{color:#ffb27a;text-decoration:none;}
.breadcrumb a:hover{text-decoration:underline;}
.breadcrumb span{opacity:.6;}

/* Layout mit Sidebar */
.layout{display:grid;grid-template-columns:300px 1fr;gap:32px;align-items:start;}
.layout.wide{grid-template-columns:1fr 380px;}
.sticky-col{position:sticky;top:90px;}

/* Filter */
.filters{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:24px;display:grid;gap:18px;
}
.filters h3{font-family:'Fraunces',serif;font-weight:600;font-size:18px;display:flex;align-items:center;gap:8px;}
.filter-group{display:grid;gap:6px;}
.filter-group label{font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);}
.field{
  width:100%;padding:11px 14px;border:1.5px solid var(--line);border-radius:var(--radius-sm);
  font-family:inherit;font-size:14.5px;background:var(--white);color:var(--ink);transition:.15s;
}
.field:focus{outline:none;border-color:var(--accent);}
select.field{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235b6670' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;}
.checkbox-row{display:flex;gap:10px;align-items:flex-start;font-size:14px;}
.checkbox-row input{width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--accent);}
.checkbox-row label{font-size:14px;text-transform:none;letter-spacing:0;font-weight:400;color:var(--ink);}
.reset-link{font-size:13px;color:var(--ink-soft);text-decoration:none;}
.reset-link:hover{color:var(--accent);}

/* Ergebnisleiste + Pagination */
.result-bar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-bottom:22px;font-size:14.5px;color:var(--ink-soft);
}
.result-bar b{color:var(--ink);}
.pagination{display:flex;gap:8px;justify-content:center;margin-top:36px;}
.pagination a,.pagination span{
  width:42px;height:42px;display:flex;align-items:center;justify-content:center;
  border-radius:var(--radius-sm);background:var(--white);box-shadow:var(--shadow);
  text-decoration:none;color:var(--ink);font-weight:600;font-size:14.5px;
}
.pagination .cur{background:var(--accent);color:#fff;}
.pagination a:hover{background:var(--cream-2);}

/* Fahrzeug-Card (in Listen) */
.car-badge{
  position:absolute;top:12px;left:12px;background:var(--ink);color:#fff;
  font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 10px;border-radius:999px;
}
.car-badge.hot{background:var(--accent);}
.car .car-actions{display:flex;gap:10px;margin-top:4px;}
.car .car-actions .btn{flex:1;padding:11px 10px;font-size:14px;}

/* Detailseite */
.detail-grid{display:grid;grid-template-columns:1fr 380px;gap:32px;align-items:start;}
.detail-head{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;}
.detail-head .d-top{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:flex-start;}
.detail-head h1{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(24px,2.8vw,34px);line-height:1.2;}
.detail-head .d-price{font-family:'Fraunces',serif;font-size:34px;font-weight:700;color:var(--accent);white-space:nowrap;}
.detail-head .d-sub{color:var(--ink-soft);font-size:14.5px;margin-top:6px;}
.gallery{margin-top:24px;}
.gallery .main{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.gallery .main img{width:100%;height:440px;object-fit:cover;}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px;}
.thumbs img{width:100%;height:90px;object-fit:cover;border-radius:var(--radius-sm);cursor:pointer;border:2px solid transparent;}
.thumbs img:hover{border-color:var(--accent);}
.keyfacts{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0;
}
.keyfact{background:var(--cream-2);border-radius:var(--radius-sm);padding:14px;text-align:center;}
.keyfact b{display:block;font-size:18px;font-family:'Fraunces',serif;}
.keyfact span{font-size:12px;color:var(--ink-soft);}
.spec-table{width:100%;border-collapse:collapse;font-size:15px;}
.spec-table td{padding:10px 14px;border-bottom:1px solid var(--line);}
.spec-table td:first-child{color:var(--ink-soft);width:45%;}
.equip{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.equip span{background:var(--cream-2);border-radius:999px;padding:5px 12px;font-size:13px;font-weight:500;}
.sidebar-box{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:26px;margin-bottom:22px;
}
.sidebar-box h3{font-family:'Fraunces',serif;font-weight:600;font-size:20px;margin-bottom:12px;}
.sidebar-box .phone-big{font-family:'Fraunces',serif;font-size:24px;font-weight:700;color:var(--ink);text-decoration:none;display:block;}
.sidebar-box .phone-big:hover{color:var(--accent);}
.sidebar-box p{font-size:14px;color:var(--ink-soft);margin:6px 0;}
.mini-note{font-size:12.5px;color:var(--ink-soft);margin-top:10px;padding-top:10px;border-top:1px solid var(--line);}

/* Formulare */
.form-card{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:30px;
}
.form-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:22px;margin-bottom:4px;}
.form-card .form-sub{color:var(--ink-soft);font-size:14.5px;margin-bottom:20px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-grid .full{grid-column:1/-1;}
.form-group{display:grid;gap:6px;}
.form-group label{font-size:13px;font-weight:600;color:var(--ink);}
.form-group .hint{font-size:12px;color:var(--ink-soft);}
textarea.field{min-height:120px;resize:vertical;}
.form-note{font-size:12.5px;color:var(--ink-soft);margin-top:14px;display:flex;gap:8px;align-items:flex-start;}
.form-note input{width:16px;height:16px;flex:none;margin-top:2px;accent-color:var(--accent);}

/* Tabs (Ankauf) */
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px;}
.tab-btn{
  padding:12px 20px;border-radius:999px;border:2px solid var(--line);background:var(--white);
  font-family:inherit;font-weight:600;font-size:14.5px;color:var(--ink-soft);cursor:pointer;transition:.15s;
}
.tab-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* Ankauf-Schritte */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px;}
.step{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:28px;position:relative;
}
.step .num{
  width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;
  font-weight:700;font-size:20px;margin-bottom:16px;
}
.step h3{font-family:'Fraunces',serif;font-weight:600;font-size:19px;margin-bottom:8px;}
.step p{font-size:14.5px;color:var(--ink-soft);}

/* Services */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px;}
.service-card{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:26px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:10px;
  border-top:4px solid var(--cream-2);transition:.15s;
}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-top-color:var(--accent);}
.service-card .icon{
  width:46px;height:46px;border-radius:12px;background:var(--cream-2);color:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:21px;
}
.service-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:18px;}
.service-card p{font-size:14px;color:var(--ink-soft);}
.service-card .more{color:var(--accent);font-weight:600;font-size:13.5px;margin-top:auto;}

/* Team */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:36px;}
.team-card{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:22px;text-align:center;
}
.avatar{
  width:96px;height:96px;border-radius:50%;background:var(--cream-2);color:var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-weight:700;font-size:30px;margin:0 auto 14px;
}
.team-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:18px;}
.team-card p{font-size:13px;color:var(--ink-soft);}

/* Karriere */
.job-list{display:grid;gap:16px;margin-top:36px;}
.job-card{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:24px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  text-decoration:none;color:var(--ink);transition:.15s;
}
.job-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px);}
.job-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:19px;}
.job-card .meta{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap;}
.job-card .meta span{background:var(--cream-2);font-size:12.5px;font-weight:600;padding:4px 12px;border-radius:999px;}

/* Kontakt */
.contact-grid{display:grid;grid-template-columns:1fr 380px;gap:32px;align-items:start;}
.map-box{
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  height:260px;background:var(--cream-2);
  display:flex;align-items:center;justify-content:center;color:var(--ink-soft);
  background-image:linear-gradient(45deg,var(--cream-2) 25%,transparent 25%),linear-gradient(-45deg,var(--cream-2) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--cream-2) 75%),linear-gradient(-45deg,transparent 75%,var(--cream-2) 75%);
  background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;
}
.map-box a{position:relative;background:var(--white);padding:14px 22px;border-radius:999px;box-shadow:var(--shadow);font-weight:600;color:var(--accent);text-decoration:none;}
.map-box a:hover{color:var(--accent-dark);}

/* Rechtsseiten */
.legal{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:40px;}
.legal h2{font-family:'Fraunces',serif;font-weight:600;font-size:22px;margin:28px 0 10px;}
.legal h2:first-child{margin-top:0;}
.legal h3{font-size:16px;margin:20px 0 8px;}
.legal p,.legal li{font-size:15px;color:var(--ink-soft);margin-bottom:10px;}
.legal ul,.legal ol{padding-left:22px;margin-bottom:14px;}
.legal a{color:var(--accent);}

/* Nutzungshinweis */
.alert{
  background:#fff7ec;border:1px solid #f2d9b8;border-left:4px solid var(--accent);
  border-radius:var(--radius-sm);padding:14px 18px;font-size:14px;color:#6b4a22;margin-bottom:28px;
}

@media(max-width:1020px){
  .layout,.layout.wide,.detail-grid,.contact-grid{grid-template-columns:1fr;}
  .sticky-col{position:static;}
  .service-grid,.team-grid{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:1fr;}
  .keyfacts{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:820px){
  .form-grid{grid-template-columns:1fr;}
  .gallery .main img{height:280px;}
  .thumbs img{height:64px;}
}
