/* Step 4.11.3 – Inter lokal vorbereitet */
@font-face{
  font-family:"Inter";
  src:url("../fonts/inter/Inter-Variable.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
:root{--font-main:"Inter",Arial,Helvetica,sans-serif;--blue:#2754a1;--dark:#0d1421;--text:#eef4ff;--muted:#a8b5c9;--gold:#d2b47b}*{box-sizing:border-box}body{margin:0;font-family:var(--font-main);background:radial-gradient(circle at top,#233047 0,#0d1421 48%,#070b12 100%);color:var(--text)}a{color:inherit}.shelf-hero{padding:28px clamp(22px,5vw,70px) 14px}.brand-row{display:flex;align-items:center;justify-content:space-between;gap:18px}.hero-logo{width:210px;max-width:54vw;height:auto;display:block}.admin-link{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);padding:10px 14px;border-radius:12px;text-decoration:none;font-weight:700}.eyebrow{margin:42px 0 10px;color:#cfd8ec;text-transform:uppercase;letter-spacing:.18em;font-size:13px;font-weight:700}.shelf-hero h1{margin:0;font-size:clamp(38px,5vw,70px);letter-spacing:-.04em}.lead{max-width:780px;color:var(--muted);font-size:clamp(17px,2vw,22px);line-height:1.45}.shelf-wrap{padding:18px clamp(18px,5vw,70px) 80px}.catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px;position:relative}.catalog-card{position:relative;display:grid;grid-template-columns:150px 1fr;gap:22px;min-height:260px;padding:22px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.12);border-radius:24px;box-shadow:0 26px 80px rgba(0,0,0,.35);transition:transform .18s ease,border-color .18s ease}.catalog-card:hover{transform:translateY(-7px);border-color:rgba(210,180,123,.48)}.cover-frame{align-self:end;aspect-ratio:3/4;border-radius:16px;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.45),8px 0 0 rgba(0,0,0,.15) inset;background:#fff}.cover-frame img{width:100%;height:100%;object-fit:cover;display:block}.card-body{display:flex;flex-direction:column;justify-content:center}.category{color:#d9c18e;text-transform:uppercase;font-size:12px;letter-spacing:.12em;font-weight:700}.card-body h2{font-size:28px;margin:10px 0 8px}.card-body p{color:var(--muted);line-height:1.45;margin:0 0 22px}.card-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:13px;padding:12px 16px;font-weight:800;border:1px solid rgba(255,255,255,.16)}.btn.primary{background:var(--blue);color:white;border-color:#4a75c7}.btn.ghost{background:rgba(255,255,255,.07)}.empty-state{border:1px solid rgba(255,255,255,.15);border-radius:22px;padding:30px;background:rgba(255,255,255,.06)}.shelf-footer{color:#78869d;border-top:1px solid rgba(255,255,255,.1);padding:18px clamp(18px,5vw,70px)}@media(max-width:700px){.catalog-card{grid-template-columns:112px 1fr;padding:16px}.card-body h2{font-size:22px}.hero-logo{width:170px}.card-actions{flex-direction:column}.btn{width:100%}}


/* Step 3.3 Responsive Pro - öffentliches Katalogregal */
.shelf-page{min-width:320px;overflow-x:hidden}.shelf-hero,.shelf-wrap,.shelf-footer{width:100%}.catalog-card{overflow:hidden}.card-body{min-width:0}.card-body h2,.card-body p{overflow-wrap:anywhere}.cover-frame img{object-fit:contain;background:#fff}.card-actions .btn{min-height:44px}.admin-link{white-space:nowrap}
@media (min-width:1180px){.catalog-grid{grid-template-columns:repeat(2,minmax(480px,1fr));}.catalog-card{grid-template-columns:170px 1fr;min-height:285px}.cover-frame{max-width:170px}.card-body h2{font-size:30px}}
@media (max-width:980px){.shelf-hero{padding-top:22px}.brand-row{align-items:flex-start}.catalog-grid{grid-template-columns:1fr;gap:20px}.catalog-card{grid-template-columns:145px 1fr;min-height:240px}.card-body h2{font-size:25px}.lead{font-size:18px}}
@media (max-width:640px){.brand-row{display:block}.admin-link{display:inline-flex;margin-top:16px}.eyebrow{margin-top:30px}.shelf-hero h1{font-size:38px}.catalog-card{display:flex;flex-direction:column;align-items:stretch;padding:18px;border-radius:20px}.cover-frame{width:min(210px,68vw);align-self:center}.card-body{text-align:center}.card-body h2{font-size:24px}.card-body p{font-size:15px;margin-bottom:18px}.category{font-size:11px}.card-actions{display:grid;grid-template-columns:1fr;gap:10px}.btn{width:100%;padding:13px 15px}.shelf-wrap{padding-bottom:50px}}
@media (max-width:390px){.hero-logo{max-width:70vw}.shelf-hero{padding-left:15px;padding-right:15px}.shelf-wrap{padding-left:12px;padding-right:12px}.catalog-card{padding:14px}.cover-frame{width:min(190px,78vw)}}
@media (hover:none){.catalog-card:hover{transform:none}.catalog-card:active{transform:translateY(-2px)}}


/* Step 4.0 – Kontaktformular Basis */
.contact-hero{padding-bottom:4px}
.contact-wrap{max-width:1040px;margin:0 auto}
.contact-card{
  background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.045));
  border:1px solid rgba(255,255,255,.14);
  border-radius:26px;
  padding:clamp(20px,4vw,34px);
  box-shadow:0 28px 90px rgba(0,0,0,.36);
}
.contact-context{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  padding:14px 16px;
  color:#eef4ff;
  margin-bottom:20px;
  line-height:1.5;
}
.contact-context span{color:var(--muted);font-size:.95rem}
.contact-notice{
  border-radius:16px;
  padding:14px 16px;
  margin:0 0 18px;
  line-height:1.45;
}
.contact-notice.ok{
  background:rgba(43,154,91,.18);
  border:1px solid rgba(80,210,139,.34);
}
.contact-notice.error{
  background:rgba(185,50,50,.18);
  border:1px solid rgba(255,120,120,.34);
}
.contact-notice ul{margin:8px 0 0 20px;padding:0}
.contact-form{display:block}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.form-grid label,
.check-row{
  color:#dfe8f8;
  font-weight:800;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.form-grid label.full{grid-column:1/-1}
.form-grid input,
.form-grid select,
.form-grid textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.92);
  color:#172033;
  border-radius:14px;
  padding:13px 14px;
  font:inherit;
  outline:none;
}
.form-grid textarea{resize:vertical;min-height:150px;line-height:1.45}
.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus{
  border-color:#d2b47b;
  box-shadow:0 0 0 4px rgba(210,180,123,.16);
}
.check-row{
  flex-direction:row;
  align-items:flex-start;
  margin-top:16px;
  font-weight:700;
  color:#dfe8f8;
  line-height:1.4;
}
.check-row input{margin-top:3px;min-width:18px;min-height:18px}
.contact-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:24px;
}
.contact-actions button.btn{
  cursor:pointer;
  font:inherit;
}
.hp-field{
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
}
@media(max-width:720px){
  .form-grid{grid-template-columns:1fr}
  .contact-card{border-radius:20px}
}


/* Step 4.0.1 – Kontaktformular Firma-Feld Formatfix */
.contact-form label > span:first-child{
  display:inline-block;
}


/* Step 4.7.2 – Admin-Rücksprung im öffentlichen Bereich */
.public-admin-return{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9999;
}
.public-admin-return a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 16px;
  border-radius:999px;
  background:#2754a1;
  color:#fff !important;
  text-decoration:none;
  font-weight:800;
  font-size:.92rem;
  box-shadow:0 14px 30px rgba(15,23,42,.22);
  border:1px solid rgba(255,255,255,.20);
}
.public-admin-return a:hover{
  filter:brightness(1.06);
  transform:translateY(-1px);
}
@media (max-width: 640px){
  .public-admin-return{
    right:12px;
    bottom:12px;
  }
  .public-admin-return a{
    min-height:38px;
    padding:9px 13px;
    font-size:.86rem;
  }
}

/* Step 4.11 – Gewerbekundenformular */
.btn.business{background:#fff3cd;color:#6f4d00;border-color:#f4d782}.contact-page{overflow:auto}.contact-wrap{max-width:980px}.contact-card{background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:22px;padding:24px;box-shadow:0 16px 42px rgba(15,23,42,.10)}.contact-form{display:grid;gap:16px}.contact-form label{display:grid;gap:7px;font-weight:800;color:#172033}.contact-form input,.contact-form textarea{width:100%;border:1px solid #d9e0ec;border-radius:14px;padding:13px 14px;font:inherit}.contact-form textarea{min-height:130px}.form-hint{margin:-8px 0 4px;color:#64748b;font-size:.92rem}.check-line{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start;gap:10px!important;line-height:1.45}.check-line input{width:auto!important;margin-top:3px}.catalog-reference{background:#f8fbff;border:1px solid #d9e0ec;border-radius:14px;padding:12px 14px;color:#334155}.notice.success{background:#dcfce7;border:1px solid #bbf7d0;color:#166534}.contact-card .notice.error{background:#fee2e2;border:1px solid #fecaca;color:#991b1b}@media(max-width:760px){.contact-card{padding:18px}}


/* Step 4.11.1 – Checkbox Alignment Fix im Anfrageformular */
.contact-form label.check,
.contact-form label.checkbox,
.contact-form label.check-line,
.contact-form .check-line,
.contact-form .checkbox-line,
.contact-form .copy-check,
.contact-form .privacy-check{
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr)!important;
  align-items:start!important;
  justify-content:start!important;
  column-gap:10px!important;
  row-gap:0!important;
  text-align:left!important;
}
.contact-form label.check input[type="checkbox"],
.contact-form label.checkbox input[type="checkbox"],
.contact-form label.check-line input[type="checkbox"],
.contact-form .check-line input[type="checkbox"],
.contact-form .checkbox-line input[type="checkbox"],
.contact-form .copy-check input[type="checkbox"],
.contact-form .privacy-check input[type="checkbox"]{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  margin:2px 0 0 0!important;
  justify-self:start!important;
}
.contact-form label.check span,
.contact-form label.checkbox span,
.contact-form label.check-line span,
.contact-form .check-line span,
.contact-form .checkbox-line span,
.contact-form .copy-check span,
.contact-form .privacy-check span{
  display:block!important;
  line-height:1.45!important;
  margin:0!important;
}
.contact-form label:has(input[type="checkbox"]){
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr)!important;
  align-items:start!important;
  justify-content:start!important;
  column-gap:10px!important;
}
.contact-form label:has(input[type="checkbox"]) input[type="checkbox"]{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  margin:2px 0 0 0!important;
  justify-self:start!important;
}

/* Step 4.11.2 – Inter Font Stack: Inter wenn vorhanden, sonst Arial/Helvetica Fallback */


/* Step 4.11.4 – Baupark-Logo Home-Link */
.baupark-logo-home-link{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  color:inherit;
}
.baupark-logo-home-link img{
  display:block;
}


/* Step 4.11.12 – Erfolgsmeldung privates Kontaktformular */
.contact-notice.ok,
.notice.success,
.notice.ok {
  color: #111 !important;
}
.contact-notice.ok strong,
.notice.success strong,
.notice.ok strong {
  color: #111 !important;
}


/* Step 4.11.14 – Anfrage und Gewerbe gleichwertig im Katalogregal */
.card-actions a[href^="contact.php"],
.card-actions a[href^="business-contact.php"]{
  min-width:112px;
}


/* Step 4.11.15 – Gewerbe normal wie Anfrage, Hover gelb */
.card-actions .btn.business{
  background:rgba(255,255,255,.07);
  color:inherit;
  border-color:rgba(255,255,255,.16);
}
.card-actions .btn.business:hover,
.card-actions .btn.business:focus-visible{
  background:#fff3cd;
  color:#6f4d00;
  border-color:#f4d782;
}