html,body{
    margin:0;
    padding:0;
    background:#f4f4f4;
    font-family:Arial, Helvetica, sans-serif;
}
.uph-page{
    width:100%;
    margin:0;
    padding:0;
}
.uph-reference{
    width:100%;
    background:#fff;
    overflow:hidden;
}
.uph-reference img{
    display:block;
    width:100%;
    height:auto;
}
.uph-note{
    padding:40px;
    text-align:center;
    background:#fff;
}
.uph-note h1{
    margin:0 0 10px;
    color:#7a0000;
}
.uph-note p{
    margin:0 auto;
    max-width:800px;
    font-size:18px;
    line-height:1.5;
}


/* ==========================================================
   V7.1.4 – NUR SCHRIFT ANGEPASST
   Keine Änderung an Farben, Wellen, Boxen, Abständen,
   Header, Icons, Schatten oder Formen.
   ========================================================== */

/* Google Fonts Import: Montserrat + Roboto */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800&family=Roboto:wght@400;500&display=swap');

:root{
  --uph-font-logo: "Montserrat", Arial, Helvetica, sans-serif;
  --uph-font-heading: "Montserrat", Arial, Helvetica, sans-serif;
  --uph-font-body: "Roboto", Arial, Helvetica, sans-serif;
}

/* Grundschrift */
body,
p,
li,
input,
textarea,
select,
button{
  font-family: var(--uph-font-body) !important;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Logo / Firmenname */
.brand-name,
.uph-brand-name,
.logo-area h1,
.uph-logo-area h1,
.uph-logo-zone h1{
  font-family: var(--uph-font-logo) !important;
  font-weight: 800 !important;
  font-size: clamp(38px, 2.2vw, 42px) !important;
  letter-spacing: -0.8px;
  line-height: 1.05;
}

/* Seit 1992 */
.brand-since,
.uph-since,
.since,
.uph-brand-sub{
  font-family: var(--uph-font-heading) !important;
  font-weight: 500 !important;
  letter-spacing: 0.2px;
}

/* Kontakt-Titel: Telefon / Öffnungszeiten / E-Mail */
.contact-text h3,
.contact-card h3,
.uph-contact-label,
.uph-contact-title{
  font-family: var(--uph-font-heading) !important;
  font-weight: 600 !important;
  font-size: clamp(22px, 1.25vw, 24px) !important;
  line-height: 1.15;
}

/* Telefonnummer / wichtige Kontaktdaten */
.contact-text strong,
.contact-card strong,
.uph-contact-main,
.uph-phone-number{
  font-family: var(--uph-font-heading) !important;
  font-weight: 600 !important;
  font-size: clamp(24px, 1.35vw, 26px) !important;
  line-height: 1.18;
}

/* Kontakt-Details */
.contact-text p,
.contact-card p,
.uph-contact-card p{
  font-family: var(--uph-font-body) !important;
  font-size: clamp(18px, 1vw, 22px) !important;
  line-height: 1.35;
}

/* Menü */
.main-menu a,
.uph-mainnav nav a,
.uph-menu a,
.uph-nav a,
.menu a{
  font-family: var(--uph-font-heading) !important;
  font-weight: 700 !important;
  font-size: clamp(18px, 1.05vw, 20px) !important;
  letter-spacing: 0.1px;
}

/* Slider Überschrift */
.slide-text h2,
.uph-slider h2,
.slider-text h2,
.uph-v2-hero-content h1{
  font-family: var(--uph-font-heading) !important;
  font-weight: 800 !important;
  font-size: clamp(56px, 3.1vw, 60px) !important;
  line-height: 1.1;
  letter-spacing: -1.2px;
}

/* Slider Badge / Button */
.slide-badge,
.badge,
.uph-badge,
.slide-btn,
.btn,
.uph-button{
  font-family: var(--uph-font-heading) !important;
  font-weight: 700 !important;
}

/* Fließtext im Slider und normalen Bereichen */
.slide-text p,
.slider-text p,
.uph-slider p,
.service-card p,
.uph-services p,
.uph-note p{
  font-family: var(--uph-font-body) !important;
  font-weight: 400 !important;
  font-size: clamp(18px, 1.15vw, 22px) !important;
  line-height: 1.55;
}

/* Boxen-Überschriften */
.service-card h3,
.uph-service-card h3,
.uph-services h2,
.services h2{
  font-family: var(--uph-font-heading) !important;
  font-weight: 800 !important;
  letter-spacing: -0.4px;
}


/* ==========================================================
   V7.1.5 – NUR GRÖSSE/BREITE/SCHRIFT REDUZIERT
   KEINE Änderung an Farben, Wellen, Boxen, Header-Struktur,
   Icons, Schatten oder Design-Stil.
   ========================================================== */

/* Gesamtdesign etwas schmaler und weniger riesig */
.uph-pixel-stage img,
.uph-reference img{
  width:88% !important;
  max-width:1380px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* CSS-Version: Header/Slider nicht mehr zu breit */
.uph-header,
.uph-css-stage,
.uph-slider,
.uph-services,
.services{
  max-width:1380px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* obere Leiste kompakter, gleiche Form/Farben bleiben */
.uph-topbar,
.uph-top,
.uph-mainnav,
.uph-menu{
  padding-left:42px !important;
  padding-right:42px !important;
}

/* Schriftgrößen zurücknehmen */
.brand-name,
.uph-brand-name,
.logo-area h1,
.uph-logo-area h1,
.uph-logo-zone h1{
  font-size:clamp(30px, 1.75vw, 36px) !important;
  line-height:1.05 !important;
}

.brand-since,
.uph-since,
.since,
.uph-brand-sub{
  font-size:clamp(17px, 1vw, 20px) !important;
}

.contact-text h3,
.contact-card h3,
.uph-contact-label,
.uph-contact-title{
  font-size:clamp(18px, 1vw, 21px) !important;
}

.contact-text strong,
.contact-card strong,
.uph-contact-main,
.uph-phone-number{
  font-size:clamp(20px, 1.15vw, 23px) !important;
}

.contact-text p,
.contact-card p,
.uph-contact-card p{
  font-size:clamp(15px, .9vw, 18px) !important;
}

.main-menu a,
.uph-mainnav nav a,
.uph-menu a,
.uph-nav a,
.menu a{
  font-size:clamp(15px, .95vw, 17px) !important;
}

/* Slider-Schrift kleiner */
.slide-text h2,
.uph-slider h2,
.slider-text h2,
.uph-v2-hero-content h1{
  font-size:clamp(42px, 2.65vw, 52px) !important;
  line-height:1.1 !important;
}

.slide-text p,
.slider-text p,
.uph-slider p{
  font-size:clamp(16px, 1vw, 19px) !important;
}

.slide-badge,
.badge,
.uph-badge{
  font-size:clamp(13px, .85vw, 15px) !important;
}

.slide-btn,
.btn,
.uph-button{
  font-size:clamp(16px, 1vw, 19px) !important;
}

/* Leistungen-Schrift weniger groß */
.uph-services h2,
.services h2{
  font-size:clamp(30px, 2vw, 36px) !important;
}

.service-card h3,
.uph-service-card h3{
  font-size:clamp(20px, 1.3vw, 23px) !important;
}

.service-card p,
.uph-service-card p{
  font-size:clamp(15px, .95vw, 17px) !important;
}

/* Handy/Tablet: Bild und Breite normal */
@media(max-width:900px){
  .uph-pixel-stage img,
  .uph-reference img{
    width:100% !important;
    max-width:none !important;
  }

  .uph-header,
  .uph-css-stage,
  .uph-slider,
  .uph-services,
  .services{
    max-width:100% !important;
  }
}


/* V7.1.6 – nur etwas schmaler + leserlichere Schrift */
.uph-pixel-stage img,
.uph-reference img{
  width:84% !important;
  max-width:1280px !important;
}

.uph-header,
.uph-css-stage,
.uph-slider,
.uph-services,
.services{
  max-width:1280px !important;
}

body{
  letter-spacing:0.1px !important;
}

.brand-name,
.logo-area h1,
.uph-logo-area h1,
.uph-logo-zone h1{
  font-size:clamp(28px,1.6vw,34px)!important;
  font-weight:800!important;
}

.contact-text h3,
.contact-card h3{
  font-size:clamp(17px,.95vw,20px)!important;
  font-weight:700!important;
}

.contact-text strong,
.contact-card strong{
  font-size:clamp(19px,1.05vw,22px)!important;
}

.contact-text p,
.contact-card p{
  font-size:clamp(14px,.85vw,17px)!important;
  line-height:1.45!important;
}

.main-menu a,
.uph-menu a{
  font-size:clamp(14px,.9vw,16px)!important;
  font-weight:700!important;
}

.slide-text h2,
.uph-slider h2{
  font-size:clamp(38px,2.4vw,48px)!important;
}

.slide-text p,
.uph-slider p{
  font-size:clamp(15px,.95vw,18px)!important;
}

.service-card h3{
  font-size:clamp(18px,1.1vw,21px)!important;
}

.service-card p{
  font-size:clamp(14px,.85vw,16px)!important;
}


/* V7.1.7 – Home Vorteil-Boxen wie Referenzbild */
.uph-benefits{
  max-width:1280px !important;
  margin:0 auto !important;
  padding:34px 8px 28px !important;
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:22px !important;
  background:#f4f4f4 !important;
}

.uph-benefit-card{
  min-height:118px !important;
  background:#fff !important;
  border-radius:8px !important;
  display:flex !important;
  align-items:center !important;
  gap:26px !important;
  padding:28px 32px !important;
  box-shadow:0 10px 28px rgba(0,0,0,.08) !important;
  border-bottom:7px solid #b90000 !important;
}

.uph-benefit-icon{
  min-width:48px !important;
  font-size:38px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.uph-benefit-title{
  font-family:"Montserrat", Arial, Helvetica, sans-serif !important;
  font-weight:800 !important;
  font-size:19px !important;
  line-height:1.32 !important;
  color:#000 !important;
  letter-spacing:.1px !important;
  text-transform:uppercase !important;
}

@media(max-width:1100px){
  .uph-benefits{
    grid-template-columns:repeat(2,1fr) !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }
}

@media(max-width:650px){
  .uph-benefits{
    grid-template-columns:1fr !important;
  }
}
