
:root{
  --bg:#020811;
  --panel:#061424;
  --panel2:#071a2f;
  --blue:#0589ff;
  --cyan:#50d7ff;
  --text:#f6fbff;
  --muted:#9bb5d0;
  --line:rgba(88,203,255,.24);
  --shadow:0 28px 80px rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(900px 520px at 77% 8%,rgba(0,126,255,.26),transparent 62%),
    radial-gradient(700px 420px at 14% 10%,rgba(80,215,255,.11),transparent 65%),
    linear-gradient(180deg,#020811 0%,#030b14 55%,#02060c 100%);
  color:var(--text);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  overflow-x:hidden;
}
body:before{
  content:"";position:fixed;inset:0;z-index:-1;opacity:.34;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='900'%3E%3Cg fill='none' stroke='%2315b8ff' stroke-width='2' stroke-opacity='.20'%3E%3Cpath d='M0 145h240l50 50h250l90-90h310l70 70h330'/%3E%3Cpath d='M0 515h180l80-80h260l60-60h250l80 80h320'/%3E%3Cpath d='M90 760h260l85-85h220l60-60h250l100 100h250'/%3E%3Cpath d='M880 210h190l70-70h270'/%3E%3Cpath d='M860 520h170l95 95h270'/%3E%3C/g%3E%3Cg fill='%2315b8ff' fill-opacity='.35'%3E%3Ccircle cx='290' cy='195' r='5'/%3E%3Ccircle cx='630' cy='105' r='5'/%3E%3Ccircle cx='260' cy='435' r='5'/%3E%3Ccircle cx='1140' cy='140' r='5'/%3E%3Ccircle cx='1125' cy='615' r='5'/%3E%3Ccircle cx='1420' cy='715' r='5'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover;
}
a{color:#8bdfff;text-decoration:none}
a:hover{color:#fff}
.ux-container{width:min(1500px,calc(100% - 96px));margin-inline:auto}
.ux-nav{
  height:88px;background:rgba(1,6,13,.92);border-bottom:1px solid rgba(82,200,255,.16);
  position:sticky;top:0;z-index:1000;backdrop-filter:blur(14px)
}
.ux-nav-inner{height:100%;display:flex;align-items:center;gap:1.6rem;width:min(1560px,calc(100% - 80px));margin:auto}
.ux-logo img{height:62px;width:auto;display:block;filter:drop-shadow(0 0 18px rgba(0,145,255,.32))}
.ux-nav-links{display:flex;align-items:center;justify-content:center;gap:1.55rem;flex:1}
.ux-nav-links a{color:rgba(246,251,255,.84);font-weight:900;text-transform:uppercase;font-size:.86rem;letter-spacing:.45px;position:relative;padding:1rem 0}
.ux-nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:.38rem;height:2px;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left;transition:.2s}
.ux-nav-links a:hover:after,.ux-nav-links a:first-child:after{transform:scaleX(1)}
.ux-cta,.btn-primary-ux{
  display:inline-flex;align-items:center;gap:.55rem;border-radius:10px;
  background:linear-gradient(135deg,#0d8fff,#005ee7);color:#fff!important;
  border:1px solid rgba(117,211,255,.45);box-shadow:0 15px 42px rgba(0,117,255,.35),inset 0 0 0 1px rgba(255,255,255,.08);
  padding:.9rem 1.22rem;font-weight:1000;text-transform:uppercase;letter-spacing:.35px
}
.btn-outline-ux,.small-btn{
  display:inline-flex;align-items:center;gap:.55rem;border:1px solid rgba(80,215,255,.36);
  background:rgba(3,12,23,.58);color:#fff!important;border-radius:10px;
  padding:.9rem 1.22rem;font-weight:1000;text-transform:uppercase;letter-spacing:.35px
}
.ux-menu-btn{display:none}
.hero{border-bottom:1px solid rgba(80,215,255,.18);position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.23),rgba(0,92,190,.05));pointer-events:none}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.03fr 1.22fr .74fr;gap:1.8rem;align-items:center;min-height:455px;padding:1.75rem 0}
.badge-line{display:inline-block;color:#79dcff;border:1px solid rgba(80,215,255,.30);background:rgba(3,15,30,.65);border-radius:999px;padding:.45rem .95rem;font-weight:900;text-transform:uppercase;font-size:.82rem;letter-spacing:.6px}
.hero h1{font-weight:1000;text-transform:uppercase;letter-spacing:-1.8px;line-height:.98;font-size:clamp(3.8rem,5.3vw,5.7rem);margin:1rem 0 .9rem}
.hero h1 span{display:inline-block;background:linear-gradient(180deg,#fff 0%,#c9eaff 45%,#008fff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(0,145,255,.35))}
.hero-copy p{font-size:1.05rem;color:rgba(246,251,255,.88);line-height:1.6;max-width:560px}
.hero-actions{display:flex;gap:1.05rem;flex-wrap:wrap;margin:1.3rem 0 1.1rem}
.hero-points{display:flex;gap:1.35rem;flex-wrap:wrap;color:#b8d5ed;font-weight:900;font-size:.9rem}
.hero-points span{display:flex;align-items:center;gap:.45rem}.hero-points i{color:var(--cyan)}
.hero-visual{display:flex;align-items:center;justify-content:center;min-width:0}
.hero-visual img{width:100%;max-width:650px;display:block;filter:drop-shadow(0 28px 42px rgba(0,0,0,.42)) drop-shadow(0 0 24px rgba(0,145,255,.16))}
.contact-card{
  justify-self:end;width:100%;max-width:305px;background:linear-gradient(180deg,rgba(2,13,26,.94),rgba(2,10,19,.88));
  border:1px solid rgba(80,215,255,.24);border-radius:22px;padding:1.15rem 1.2rem;box-shadow:var(--shadow)
}
.contact-card div{display:flex;gap:.9rem;align-items:flex-start;padding:.64rem 0;border-bottom:1px solid rgba(120,220,255,.12)}
.contact-card div:last-child{border-bottom:0}
.contact-card i{width:24px;color:var(--cyan);font-size:1.18rem;margin-top:.15rem;text-align:center}
.contact-card p{margin:0}.contact-card strong{display:block;line-height:1.25;font-weight:1000}.contact-card span{display:block;color:rgba(246,251,255,.58);font-weight:800;font-size:.9rem;margin-top:.12rem}
.services-strip{padding:1rem 0 1.25rem;border-bottom:1px solid rgba(80,215,255,.16)}
.services-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.15rem}
.service-card{
  min-height:202px;background:linear-gradient(180deg,rgba(7,20,36,.92),rgba(3,11,21,.78));border:1px solid rgba(80,215,255,.24);
  border-radius:14px;padding:1.1rem .9rem;text-align:center;position:relative;overflow:hidden;box-shadow:0 18px 38px rgba(0,0,0,.28)
}
.service-card:before{content:"";position:absolute;inset:0;background:radial-gradient(220px 140px at 50% 0,rgba(0,145,255,.18),transparent 60%);pointer-events:none}
.icon-hex{position:relative;width:58px;height:58px;margin:0 auto .9rem;display:grid;place-items:center;clip-path:polygon(25% 6%,75% 6%,100% 50%,75% 94%,25% 94%,0 50%);background:rgba(0,145,255,.14);color:#89e0ff;font-size:1.45rem;box-shadow:0 0 28px rgba(0,145,255,.20)}
.service-card h3{position:relative;font-size:1rem;line-height:1.1;margin:0 0 .65rem;font-weight:1000;text-transform:uppercase}
.service-card p{position:relative;margin:0;color:rgba(246,251,255,.72);font-size:.92rem;line-height:1.45}
.about-band{padding:.7rem 0 1.4rem;border-bottom:1px solid rgba(80,215,255,.16)}
.about-grid{display:grid;grid-template-columns:1.05fr .8fr 1fr;gap:1.1rem;align-items:stretch}
.panel-box,.chip-wrap{
  background:linear-gradient(180deg,rgba(7,20,36,.90),rgba(3,11,21,.76));border:1px solid rgba(80,215,255,.22);
  border-radius:14px;box-shadow:0 18px 38px rgba(0,0,0,.28);position:relative;overflow:hidden
}
.panel-box{padding:1.25rem 1.4rem}
.panel-box h2,.section-title{font-weight:1000;text-transform:uppercase;color:#139cff;letter-spacing:.5px;font-size:1.35rem;margin:0 0 .8rem}
.panel-box p{color:rgba(246,251,255,.78);line-height:1.62}.small-btn{padding:.7rem 1rem;font-size:.85rem}
.chip-wrap{display:grid;place-items:center;min-height:205px;background:radial-gradient(250px 130px at center,rgba(0,145,255,.22),transparent 65%),linear-gradient(180deg,rgba(7,20,36,.88),rgba(3,11,21,.76))}
.chip-wrap img{max-width:290px;width:86%;border-radius:18px;filter:drop-shadow(0 0 30px rgba(0,145,255,.22))}
.check-list{margin:0;padding:0;list-style:none;display:grid;gap:.65rem}.check-list li{display:flex;gap:.65rem;color:rgba(246,251,255,.80);font-weight:800}.check-list i{color:#3dcaff;margin-top:.2rem}
.prices-section{padding:3.5rem 0}.section-title{font-size:2.1rem;color:#fff}.section-title span{color:#139cff;text-shadow:0 0 24px rgba(0,145,255,.28)}.section-lead{color:rgba(246,251,255,.78);max-width:1050px;line-height:1.7}
.price-feature{margin-top:1.5rem;background:linear-gradient(180deg,rgba(7,20,36,.92),rgba(3,11,21,.78));border:1px solid rgba(80,215,255,.22);border-radius:18px;padding:1.2rem 1.35rem;display:flex;justify-content:space-between;gap:1rem;align-items:center;box-shadow:0 18px 40px rgba(0,0,0,.30)}
.price-feature span{display:inline-block;color:#83e0ff;border:1px solid rgba(80,215,255,.24);border-radius:999px;padding:.35rem .7rem;font-weight:900;text-transform:uppercase;font-size:.8rem;margin-bottom:.5rem}.price-feature h3{font-weight:1000;margin:0 0 .25rem}.price-feature p{margin:0;color:rgba(246,251,255,.72)}.price-feature strong{font-size:2.2rem}
.table-shell{margin-top:1.2rem;border:1px solid rgba(80,215,255,.18);border-radius:18px;overflow:hidden;background:#06111f}.ux-price-table{width:100%;color:#eaf7ff;border-collapse:collapse;margin:0}.ux-price-table th,.ux-price-table td{padding:.95rem;border:1px solid rgba(80,215,255,.15);vertical-align:top}.ux-price-table th{color:#83e0ff;text-transform:uppercase;background:rgba(0,145,255,.09)}.ux-price-table td{background:rgba(5,16,30,.62)}
.price-note{color:rgba(246,251,255,.72);margin-top:1rem}
.ux-footer{padding:3rem 0 1.2rem;background:rgba(1,6,13,.92);border-top:1px solid rgba(80,215,255,.18)}
.footer-grid{display:grid;grid-template-columns:1.25fr .8fr .9fr;gap:2rem}.footer-brand img{height:72px;filter:drop-shadow(0 0 16px rgba(0,145,255,.30));margin-bottom:1rem}.ux-footer h3{font-size:1rem;text-transform:uppercase;color:#83e0ff;font-weight:1000}.ux-footer p,.ux-footer li{color:rgba(246,251,255,.72)}.ux-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.55rem}.ux-footer i{color:var(--cyan);width:22px}.footer-bottom{border-top:1px solid rgba(80,215,255,.12);margin-top:2rem;padding-top:1rem;display:flex;justify-content:space-between;gap:1rem;color:rgba(246,251,255,.58);flex-wrap:wrap}
.legal-hero{padding:3rem 0 1.2rem}.legal-card{background:linear-gradient(180deg,rgba(7,20,36,.92),rgba(3,11,21,.78));border:1px solid rgba(80,215,255,.22);border-radius:18px;padding:2rem;box-shadow:var(--shadow)}.legal-card h1{font-weight:1000;text-transform:uppercase}.legal-main{padding:1.5rem 0 3rem}.content-panel{background:linear-gradient(180deg,rgba(7,20,36,.92),rgba(3,11,21,.78));border:1px solid rgba(80,215,255,.20);border-radius:18px;padding:2rem;line-height:1.7;color:rgba(246,251,255,.82)}
.form-control,.form-select{background:rgba(2,10,20,.78)!important;border:1px solid rgba(80,215,255,.25)!important;color:#fff!important;border-radius:12px!important;min-height:48px}.form-control:focus,.form-select:focus{box-shadow:0 0 0 .2rem rgba(0,145,255,.14)!important;border-color:rgba(80,215,255,.65)!important}.form-label{font-weight:900;color:#eaf7ff}.required-star{color:#50d7ff}
@media(max-width:1250px){.hero-grid{grid-template-columns:1fr 1fr}.contact-card{grid-column:1/-1;justify-self:start;max-width:none;display:grid;grid-template-columns:repeat(3,1fr);gap:.2rem}.services-grid{grid-template-columns:repeat(3,1fr)}.about-grid{grid-template-columns:1fr 1fr}.chip-wrap{grid-column:1/-1;order:3}}
@media(max-width:900px){.ux-container,.ux-nav-inner{width:min(100% - 32px,1500px)}.ux-nav-links{display:none}.ux-cta{display:none}.ux-menu-btn{display:grid;gap:5px;margin-left:auto;background:transparent;border:0}.ux-menu-btn span{display:block;width:28px;height:3px;background:#fff;border-radius:3px}.menu-open .ux-nav-links{display:grid;position:absolute;top:88px;left:0;right:0;background:#020811;padding:1rem 2rem;border-bottom:1px solid var(--line)}.hero-grid{grid-template-columns:1fr}.hero h1{font-size:clamp(2.7rem,13vw,4.5rem)}.contact-card{grid-template-columns:1fr}.services-grid{grid-template-columns:repeat(2,1fr)}.about-grid,.footer-grid{grid-template-columns:1fr}.price-feature{display:block}.footer-bottom{display:block}}
@media(max-width:560px){.services-grid{grid-template-columns:1fr}.hero-actions{display:grid}.contact-card{padding:1rem}.ux-logo img{height:54px}}


/* Fix: real contact form + order form visibility */
.contact-form-section{
  padding:3.5rem 0;
  border-top:1px solid rgba(80,215,255,.14);
  border-bottom:1px solid rgba(80,215,255,.14);
}
.contact-form-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:1.5rem;
  align-items:stretch;
}
.contact-form-copy,
.ux-contact-form{
  background:linear-gradient(180deg,rgba(7,20,36,.92),rgba(3,11,21,.78));
  border:1px solid rgba(80,215,255,.22);
  border-radius:18px;
  padding:2rem;
  box-shadow:0 18px 40px rgba(0,0,0,.30);
  position:relative;
  overflow:hidden;
}
.contact-form-copy:before,
.ux-contact-form:before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(380px 180px at 20% 0,rgba(0,145,255,.16),transparent 65%);
  pointer-events:none;
}
.contact-form-copy>*,
.ux-contact-form>*{position:relative}
.quick-contact{
  display:grid;
  gap:.8rem;
  margin-top:1.4rem;
}
.quick-contact a{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.85rem 1rem;
  border:1px solid rgba(80,215,255,.18);
  border-radius:13px;
  background:rgba(2,10,20,.52);
  color:#eaf7ff;
  font-weight:900;
}
.quick-contact i{color:var(--cyan);width:24px;text-align:center}
.auftrag-hinweis{
  display:flex;
  gap:.8rem;
  align-items:flex-start;
  margin-bottom:1.25rem;
  padding:1rem 1.1rem;
  border:1px solid rgba(80,215,255,.24);
  background:rgba(0,145,255,.10);
  border-radius:14px;
  color:#eaf7ff;
  font-weight:700;
}
.auftrag-hinweis i{color:var(--cyan);margin-top:.15rem}
.content-panel form{
  display:block;
}
.content-panel form .divider{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(80,215,255,.35),transparent);
  margin:1rem 0;
}
.content-panel form h5{
  color:#83e0ff;
  text-transform:uppercase;
  letter-spacing:.35px;
}
.content-panel button[type="submit"],
.ux-contact-form button[type="submit"]{
  border:0;
  cursor:pointer;
}
@media(max-width:900px){
  .contact-form-grid{grid-template-columns:1fr}
}


/* =========================================================
   MOBILE OPTIMIERUNG – UnitX Solutions
   ========================================================= */

/* Tablets / kleine Laptops */
@media (max-width: 1100px) {
  .ux-container,
  .ux-nav-inner {
    width: min(100% - 36px, 1500px);
  }

  .ux-nav {
    height: 78px;
  }

  .ux-logo img {
    height: 54px;
  }

  .hero-grid {
    grid-template-columns: 1fr;
    min-height: unset;
    padding: 2.2rem 0 2rem;
    text-align: left;
  }

  .hero-copy {
    order: 1;
  }

  .hero-visual {
    order: 2;
  }

  .contact-card {
    order: 3;
    max-width: none;
    width: 100%;
    justify-self: stretch;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem 1rem;
  }

  .services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-grid {
    grid-template-columns: 1fr;
  }

  .chip-wrap {
    min-height: 180px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }
}

/* Smartphone Navigation */
@media (max-width: 900px) {
  .ux-nav {
    height: 72px;
  }

  .ux-nav-inner {
    width: calc(100% - 24px);
    gap: .8rem;
  }

  .ux-logo img {
    height: 48px;
  }

  .ux-menu-btn {
    display: grid;
    gap: 5px;
    margin-left: auto;
    background: transparent;
    border: 0;
    padding: .55rem;
    border-radius: 10px;
  }

  .ux-menu-btn span {
    display: block;
    width: 28px;
    height: 3px;
    background: #fff;
    border-radius: 999px;
  }

  .ux-nav-links {
    display: none;
  }

  .ux-cta {
    display: none;
  }

  body.menu-open .ux-nav-links {
    display: grid;
    position: fixed;
    top: 72px;
    left: 12px;
    right: 12px;
    background: rgba(2, 8, 17, .98);
    border: 1px solid rgba(80, 215, 255, .24);
    border-radius: 16px;
    padding: .8rem;
    box-shadow: 0 20px 60px rgba(0,0,0,.55);
    backdrop-filter: blur(16px);
    z-index: 2000;
  }

  body.menu-open .ux-nav-links a {
    padding: .85rem 1rem;
    border-bottom: 1px solid rgba(80, 215, 255, .11);
    font-size: .92rem;
  }

  body.menu-open .ux-nav-links a:last-child {
    border-bottom: 0;
  }

  body.menu-open .ux-nav-links a:after {
    display: none;
  }
}

/* Smartphones */
@media (max-width: 700px) {
  body {
    background:
      radial-gradient(520px 420px at 70% 0%, rgba(0,126,255,.22), transparent 70%),
      linear-gradient(180deg,#020811 0%,#030b14 60%,#02060c 100%);
  }

  body:before {
    opacity: .20;
    background-size: 1100px auto;
  }

  .ux-container {
    width: calc(100% - 24px);
  }

  .hero-grid {
    padding: 1.6rem 0 1.6rem;
    gap: 1.1rem;
  }

  .badge-line {
    font-size: .68rem;
    line-height: 1.25;
    padding: .36rem .65rem;
    max-width: 100%;
  }

  .hero h1 {
    font-size: clamp(2.15rem, 13vw, 3.35rem);
    line-height: 1.02;
    letter-spacing: -1px;
    margin: .85rem 0 .7rem;
  }

  .hero-copy p {
    font-size: .98rem;
    line-height: 1.55;
  }

  .hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: .75rem;
    margin: 1rem 0;
  }

  .btn-primary-ux,
  .btn-outline-ux,
  .ux-cta,
  .small-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: .9rem 1rem;
    font-size: .86rem;
    border-radius: 12px;
  }

  .hero-points {
    display: grid;
    grid-template-columns: 1fr;
    gap: .55rem;
    font-size: .88rem;
  }

  .hero-visual img {
    max-width: 100%;
    border-radius: 14px;
  }

  .contact-card {
    grid-template-columns: 1fr;
    padding: .95rem 1rem;
    border-radius: 16px;
  }

  .contact-card div {
    padding: .6rem 0;
  }

  .contact-card strong {
    font-size: .95rem;
  }

  .contact-card span {
    font-size: .82rem;
  }

  .services-strip {
    padding: 1rem 0;
  }

  .services-grid {
    grid-template-columns: 1fr;
    gap: .8rem;
  }

  .service-card {
    min-height: unset;
    display: grid;
    grid-template-columns: 58px 1fr;
    grid-template-areas:
      "icon title"
      "icon text";
    text-align: left;
    align-items: center;
    column-gap: .9rem;
    padding: 1rem;
  }

  .service-card .icon-hex {
    grid-area: icon;
    margin: 0;
    width: 54px;
    height: 54px;
    font-size: 1.28rem;
  }

  .service-card h3 {
    grid-area: title;
    text-align: left;
    font-size: .98rem;
    margin: 0 0 .25rem;
  }

  .service-card p {
    grid-area: text;
    text-align: left;
    font-size: .88rem;
    line-height: 1.45;
  }

  .about-band {
    padding: 1rem 0;
  }

  .panel-box,
  .chip-wrap,
  .content-panel,
  .legal-card,
  .contact-form-copy,
  .ux-contact-form {
    border-radius: 16px;
    padding: 1.15rem;
  }

  .panel-box h2,
  .section-title {
    font-size: 1.35rem;
    line-height: 1.2;
  }

  .panel-box p,
  .section-lead,
  .content-panel {
    font-size: .96rem;
    line-height: 1.62;
  }

  .chip-wrap {
    min-height: 150px;
  }

  .chip-wrap img {
    max-width: 230px;
  }

  .check-list {
    gap: .6rem;
  }

  .check-list li {
    font-size: .93rem;
    line-height: 1.45;
  }

  .prices-section {
    padding: 2rem 0;
  }

  .price-feature {
    display: block;
    padding: 1rem;
    border-radius: 16px;
  }

  .price-feature strong {
    display: block;
    margin-top: .8rem;
    font-size: 2rem;
  }

  .table-shell {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 14px;
  }

  .ux-price-table {
    min-width: 760px;
    font-size: .9rem;
  }

  .ux-price-table th,
  .ux-price-table td {
    padding: .75rem;
  }

  .price-note {
    font-size: .93rem;
    line-height: 1.55;
  }

  .contact-form-section {
    padding: 2rem 0;
  }

  .contact-form-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .quick-contact a {
    font-size: .93rem;
    padding: .75rem .85rem;
    overflow-wrap: anywhere;
  }

  .form-control,
  .form-select {
    min-height: 46px;
    font-size: 1rem;
  }

  textarea.form-control {
    min-height: 120px;
  }

  .legal-hero {
    padding: 1.4rem 0 .8rem;
  }

  .legal-card h1 {
    font-size: 1.7rem;
    line-height: 1.15;
  }

  .legal-card p {
    font-size: .95rem;
  }

  .content-panel form .row {
    --bs-gutter-y: .85rem;
  }

  .auftrag-hinweis {
    font-size: .92rem;
    line-height: 1.45;
    padding: .85rem;
  }

  .footer-grid {
    gap: 1.4rem;
  }

  .footer-brand img {
    height: 58px;
  }

  .ux-footer {
    padding: 2rem 0 1rem;
  }

  .footer-bottom {
    display: grid;
    gap: .65rem;
    font-size: .88rem;
  }
}

/* Sehr kleine Smartphones */
@media (max-width: 390px) {
  .ux-container,
  .ux-nav-inner {
    width: calc(100% - 18px);
  }

  .hero h1 {
    font-size: clamp(1.95rem, 14vw, 2.75rem);
  }

  .hero-copy p {
    font-size: .92rem;
  }

  .btn-primary-ux,
  .btn-outline-ux {
    font-size: .8rem;
    padding: .82rem .7rem;
  }

  .service-card {
    grid-template-columns: 50px 1fr;
    column-gap: .75rem;
  }

  .service-card .icon-hex {
    width: 48px;
    height: 48px;
  }

  .service-card h3 {
    font-size: .9rem;
  }

  .service-card p {
    font-size: .84rem;
  }

  .contact-card strong,
  .quick-contact a {
    font-size: .88rem;
  }
}

/* Bessere Touch-Bedienung */
@media (hover: none) {
  a,
  button,
  .btn-primary-ux,
  .btn-outline-ux,
  .small-btn {
    min-height: 44px;
  }
}
