/* =========================================================
   Schutzhinweis — identisch auf allen Entwurfsseiten.
   Erbt die Schrift der jeweiligen Seite, bringt aber die
   Studio-Farben mit, damit klar ist: das sagt das Studio,
   nicht der Entwurf.
   ========================================================= */
.ipnote{
  --n-bg:#0e0e0f;
  --n-ink:#f4f2ee;
  --n-dim:#a09a8d;
  --n-gold:#d1b45a;
  --n-line:#2a2823;

  width:min(38rem,calc(100vw - 2rem));
  max-height:calc(100dvh - 2rem);
  padding:0;border:0;border-radius:3px;
  background:var(--n-bg);color:var(--n-ink);
  font-family:inherit;
  box-shadow:0 50px 90px -30px rgb(0 0 0 / .7);
  overflow:auto;
}
.ipnote::backdrop{background:rgb(8 8 9 / .74);backdrop-filter:blur(7px)}
.ipnote[open]{animation:ipIn .5s cubic-bezier(.16,1,.3,1)}
@keyframes ipIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}

.ipnote__bar{height:3px;background:linear-gradient(90deg,var(--n-gold),#8d7530)}
.ipnote__in{padding:clamp(1.4rem,3.5vw,2.3rem)}

.ipnote__brand{display:flex;align-items:center;gap:.85rem;margin:0 0 1.1rem}
.ipnote__logo{width:2.1rem;height:auto;flex:none}
.ipnote__eyebrow{
  display:flex;align-items:center;gap:.6rem;margin:0;
  font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--n-gold)}
.ipnote__eyebrow::before{content:"";width:1.4rem;height:1px;background:currentColor}

.ipnote h2{
  margin:0 0 .8rem;font-size:clamp(1.15rem,2.4vw,1.5rem);line-height:1.2;
  font-weight:600;letter-spacing:-.01em;color:var(--n-ink);text-wrap:balance}

.ipnote p{margin:0 0 .8rem;font-size:.9rem;line-height:1.65;color:var(--n-dim)}
.ipnote strong{color:var(--n-ink);font-weight:600}
.ipnote__para{font-size:.82rem;color:#7d7869}

.ipnote ul{margin:0 0 1.1rem;padding:0;list-style:none;display:grid;gap:.4rem;
  font-size:.86rem;line-height:1.5;color:var(--n-dim)}
.ipnote li{padding-left:1.1rem;position:relative}
.ipnote li::before{content:"";position:absolute;left:0;top:.6em;width:.45rem;height:1px;background:var(--n-gold)}

.ipnote__ok{
  width:100%;margin-top:.3rem;padding:.9rem 1.2rem;cursor:pointer;
  border:1px solid var(--n-gold);border-radius:2px;
  background:var(--n-gold);color:#141310;
  font:600 .84rem/1 inherit;letter-spacing:.08em;text-transform:uppercase;
  transition:background .3s,color .3s}
.ipnote__ok:hover{background:transparent;color:var(--n-gold)}
.ipnote__ok:focus-visible{outline:2px solid var(--n-ink);outline-offset:3px}

.ipnote__foot{margin:1.1rem 0 0;padding-top:.9rem;border-top:1px solid var(--n-line);
  font-size:.72rem;line-height:1.6;color:#6d6961}
.ipnote__foot a{color:var(--n-gold);text-decoration:none}
.ipnote__foot a:hover{text-decoration:underline}

@media (prefers-reduced-motion:reduce){
  .ipnote[open]{animation:none}
}