/*
 * AldeTalks – Kompass Start-Fit Lesbar V1.1
 *
 * Grundsatz:
 * Nicht die Medaillons kleinziehen, sondern Raum gewinnen.
 */

body .aldetalks-root .at-compass-page{
  padding-bottom:28px!important;
}

/* Vertikale Luft auf der Kompass-Seite reduzieren */
body .aldetalks-root .at-compass-page .at-back{
  margin-top:0!important;
  margin-bottom:clamp(8px,1.2vh,16px)!important;
}

body .aldetalks-root .at-compass-page .at-kicker{
  margin-bottom:clamp(8px,1.1vh,14px)!important;
}

/* Layout etwas höher und kompakter setzen */
body .aldetalks-root .at-compass-page .at-compass-layout{
  align-items:start!important;
  gap:clamp(20px,4vw,58px)!important;
}

/* Textspalte bleibt stark, aber frisst weniger Höhe */
body .aldetalks-root .at-compass-page .at-compass-copy{
  max-width:570px!important;
  padding-top:0!important;
}

body .aldetalks-root .at-compass-page .at-compass-copy h1{
  font-size:clamp(3.25rem,5.25vw,6.25rem)!important;
  line-height:.88!important;
  letter-spacing:-.065em!important;
}

body .aldetalks-root .at-compass-page .at-compass-copy p{
  font-size:clamp(1.02rem,1.02vw,1.13rem)!important;
  line-height:1.46!important;
}

body .aldetalks-root .at-compass-page .at-compass-lead{
  margin-top:clamp(14px,1.8vh,21px)!important;
  margin-bottom:5px!important;
}

body .aldetalks-root .at-compass-page .at-compass-next{
  margin-top:clamp(16px,2vh,22px)!important;
}

body .aldetalks-root .at-compass-page .at-compass-hint{
  margin-top:9px!important;
}

/*
 * Kompass:
 * Bühnenmaß moderat begrenzen, aber Medaillons groß halten.
 * Der frühere Fehler war, Medaillons proportional zu stark zu verkleinern.
 */
body .aldetalks-root .at-compass-page .at-compass-visual-hybrid{
  width:min(58vw, 760px)!important;
  --at-hybrid-core:min(31vw, 410px)!important;
  --at-hybrid-need:clamp(132px, 9.8vw, 148px)!important;
  margin-top:clamp(-14px,-1.3vw,-4px)!important;
  justify-self:center!important;
  align-self:start!important;
}

/* Medaillon-Lesbarkeit erzwingen */
body .aldetalks-root .at-compass-page .at-need-medallion{
  width:var(--at-hybrid-need)!important;
  min-width:132px!important;
}

body .aldetalks-root .at-compass-page .at-need-medallion-art{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}

body .aldetalks-root .at-compass-page .at-hybrid-core{
  width:var(--at-hybrid-core)!important;
}

/*
 * Orbit minimal kompakter, damit Bühne nicht unnötig hoch wirkt,
 * aber ohne Überdeckung des Zentrums.
 */
body .aldetalks-root .at-compass-page .at-need-medallion-1{top:8.2%!important;}
body .aldetalks-root .at-compass-page .at-need-medallion-2{top:22.0%!important;}
body .aldetalks-root .at-compass-page .at-need-medallion-3{top:22.0%!important;}
body .aldetalks-root .at-compass-page .at-need-medallion-4{top:51.5%!important;}
body .aldetalks-root .at-compass-page .at-need-medallion-5{top:51.5%!important;}
body .aldetalks-root .at-compass-page .at-need-medallion-6{top:77.8%!important;}
body .aldetalks-root .at-compass-page .at-need-medallion-7{top:77.8%!important;}

/* Große Laptops und Full-HD: alles sofort sichtbar, ohne Minikreise */
@media (min-width:1200px) and (max-height:860px){
  body .aldetalks-root .at-compass-page .at-compass-layout{
    grid-template-columns:minmax(330px,.76fr) minmax(600px,1.24fr)!important;
  }

  body .aldetalks-root .at-compass-page .at-compass-copy h1{
    font-size:clamp(3.05rem,5vw,5.8rem)!important;
  }

  body .aldetalks-root .at-compass-page .at-compass-visual-hybrid{
    width:min(57vw, 735px)!important;
    --at-hybrid-core:min(30vw, 398px)!important;
    --at-hybrid-need:clamp(132px, 9.5vw, 144px)!important;
    margin-top:-22px!important;
  }
}

/* Kleinere Höhen: lieber Text etwas kompakter als Medaillons unlesbar machen */
@media (min-width:1100px) and (max-height:760px){
  body .aldetalks-root .at-compass-page .at-compass-copy h1{
    font-size:clamp(2.85rem,4.65vw,5.25rem)!important;
  }

  body .aldetalks-root .at-compass-page .at-compass-copy p{
    font-size:1rem!important;
    line-height:1.38!important;
  }

  body .aldetalks-root .at-compass-page .at-compass-visual-hybrid{
    width:min(55vw, 705px)!important;
    --at-hybrid-core:min(29vw, 382px)!important;
    --at-hybrid-need:132px!important;
    margin-top:-28px!important;
  }
}

/* Tablet: nicht erzwingen, sondern sauber stapeln */
@media (max-width:980px){
  body .aldetalks-root .at-compass-page .at-compass-layout{
    grid-template-columns:1fr!important;
    gap:22px!important;
  }

  body .aldetalks-root .at-compass-page .at-compass-visual-hybrid{
    width:min(94vw, 720px)!important;
    --at-hybrid-need:clamp(112px,18vw,136px)!important;
    --at-hybrid-core:min(56vw, 390px)!important;
    margin-top:0!important;
  }

  body .aldetalks-root .at-compass-page .at-need-medallion{
    min-width:112px!important;
  }
}