/* ApiQ – ArtikelProbe: vereinheitlichte Seitengestaltung */

.hero{
  min-height:72svh;
  display:grid;
  align-items:end;
  padding:170px 0 95px;
  border-bottom:1px solid var(--line);
  background:radial-gradient(circle at 73% 35%,rgba(214,179,71,.08),transparent 28%);
}

h1{
  margin:0;
  max-width:11ch;
  font-size:clamp(3.8rem,8.2vw,9rem);
  line-height:.88;
  letter-spacing:-.06em;
  font-weight:650;
}

.hero p{
  max-width:830px;
  margin:30px 0 0;
  color:#d3d3d3;
  font-size:clamp(1.05rem,1.45vw,1.35rem);
  line-height:1.65;
}

.section{padding:clamp(85px,9vw,150px) 0}

h2{
  margin:0;
  font-size:clamp(2.55rem,4.15vw,4.95rem);
  line-height:1.02;
  letter-spacing:-.04em;
  font-weight:650;
}

.intro-grid{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(500px,1.2fr);
  gap:clamp(50px,7vw,120px);
  align-items:start;
}

.copy p{color:var(--muted);line-height:1.8;font-size:1.07rem}

.benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.benefit{
  min-height:210px;
  padding:28px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:radial-gradient(circle at 100% 0%,rgba(214,179,71,.09),transparent 38%),var(--panel);
  box-shadow:0 20px 60px rgba(0,0,0,.20);
}
.benefit strong{display:block;color:var(--gold2);font-size:1.1rem;margin-bottom:10px}
.benefit p{margin:0;color:var(--muted);line-height:1.68}

.test-area{border-top:1px solid var(--line)}

.form-wrap{
  display:grid;
  grid-template-columns:minmax(0,.7fr) minmax(520px,1.3fr);
  gap:clamp(50px,7vw,120px);
  align-items:start;
}

.side{position:sticky;top:120px}
.side p{color:var(--muted);line-height:1.8}
.rule{
  margin-top:28px;
  padding:18px 20px;
  border-left:2px solid var(--gold);
  background:rgba(255,255,255,.025);
  color:#d8d8d8;
  line-height:1.65;
}

form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  padding:32px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.035);
  box-shadow:var(--shadow);
}

.field{display:grid;gap:8px}
.field.full{grid-column:1/-1}
label{color:#ddd;font-size:.9rem;font-weight:650}

input,textarea{
  width:100%;
  color:#f4f4f4;
  background:#0d0d0d;
  border:1px solid rgba(255,255,255,.13);
  border-radius:14px;
  padding:14px 15px;
  font:inherit;
  outline:none;
}
textarea{min-height:330px;resize:vertical;line-height:1.5}
input:focus,textarea:focus{
  border-color:rgba(214,179,71,.62);
  box-shadow:0 0 0 3px rgba(214,179,71,.08);
}

input[type="file"]{
  padding:11px 12px;
  background:#0e0e0e;
}

.hint{font-size:.85rem;color:#9f9f9f;line-height:1.55}

.check{
  grid-column:1/-1;
  display:flex;
  gap:12px;
  align-items:flex-start;
  color:var(--muted);
  font-size:.88rem;
  line-height:1.55;
}
.check input{width:auto;margin-top:3px}
.check a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}

.actions{grid-column:1/-1;display:flex;justify-content:flex-end}
.btn{
  min-height:52px;
  padding:0 24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:0;
  cursor:pointer;
  font:inherit;
  font-weight:750;
  background:linear-gradient(135deg,#c69d35,#f0dc7a);
  color:#111;
  box-shadow:0 12px 36px rgba(214,179,71,.17);
  transition:transform .2s ease;
}
.btn:hover{transform:translateY(-2px)}

.hp{position:absolute !important;left:-10000px !important;width:1px !important;height:1px !important;overflow:hidden !important}

footer{border-top:1px solid var(--line);padding:30px 0 42px;color:#929292;font-size:.88rem}
.footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px 28px}
.footer-left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.footer-left img{height:28px;width:auto;opacity:.88}
.footer-links{display:flex;gap:22px;flex-wrap:wrap}

@media(max-width:1050px){
  .intro-grid,.form-wrap{grid-template-columns:1fr}
  .side{position:static}
}

@media(max-width:760px){
  .hero{min-height:auto;padding:138px 0 70px}
  .benefits{grid-template-columns:1fr}
  form{grid-template-columns:1fr;padding:24px}
}