/* =====================================================================
   PAGELOOK · SEO-SJEKK – utseende
   ---------------------------------------------------------------------
   Popupen «Få gratis SEO- og AI-sjekk».
   Markup: inc/seo-sjekk.php · Logikk: assets/js/seo-sjekk.js

   Nesten alt utseende kommer fra prosjektskjema.css (klassene
   pm-…), så de to skjemaene alltid ser like ut. Endrer du designet der,
   endres det her også.

   Denne filen inneholder bare reglene som i prosjektskjema.css er låst
   til #pm (id-en til prosjektskjemaet), kopiert til #ps, pluss noen
   små tillegg nederst.
     1. Ramme og åpne/lukke-animasjon
     2. Overskrifter
     3. Sikring mot tema/Elementor-standarder
     4. Mobil (samme fikser som prosjektskjema.css, 8 og 11)
     5. Tillegg for SEO-sjekken
   ===================================================================== */

/* 1. Ramme */
#ps{position:fixed;inset:0;z-index:300;display:none;align-items:center;justify-content:center;padding:20px}
#ps.open{display:flex}
#ps.open .pm-bg{opacity:1}
#ps.open .pm-box{transform:none;opacity:1}

/* 2. Overskrifter */
#ps h2{margin:0;font-size:clamp(26px,3.4vw,38px);line-height:1.04;letter-spacing:-.04em;color:#0A1433}
#ps h2 em{font-family:'Instrument Serif',Georgia,serif;font-weight:400;color:#1C55A6}
#ps p.pm-sub{margin:-8px 0 0;color:#3A4870;font-size:16px}

/* 3. Sikring */
#ps, #ps *{box-sizing:border-box}
#ps{font-family:var(--font-sans,'Schibsted Grotesk'),system-ui,sans-serif;line-height:1.5}
#ps fieldset{border:0;margin:0;padding:0;min-width:0}
#ps button{font:inherit}
#ps svg{display:block}

/* 4. Mobil */
@media (max-width:767px){
  #ps{padding:0;align-items:flex-end;height:100%;height:100dvh}
}

/* 5. Tillegg
   - Feltet «Hvilken by …» vises bare når «Lokalt» er valgt.
   - Konkurrentfeltene tones ned når «Vet ikke» er krysset av.
   - Rød ramme på felt som mangler når man trykker Neste. */
#ps .pm-f[hidden]{display:none}
#ps .pm-fields + .pm-note{margin-top:-10px}
#ps .pm-fields.is-off{opacity:.45;pointer-events:none;transition:opacity .25s}
#ps .pm-f.err input{border-color:#B42318}
#ps .pm-f.err label{color:#B42318}
