/* Momo Jord — Kontakt editorial page (template-mj-kontakt.php). Scoped .mj-scope.
   .ed-hero comes from the shared editorial CSS; this adds the contact cards,
   the "skriv" card and the FAQ accordion. */

.mj-scope .kontakt-page .ed-hero{ min-height:440px; }
.mj-scope .kontakt-main{ padding:80px 0; }
.mj-scope .contact-shell{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; }
.mj-scope .contact-info{ display:grid; gap:24px; }
.mj-scope .info-card{ display:grid; grid-template-columns:56px 1fr; gap:18px; padding:24px; background:var(--card); border:1px solid var(--hairline); border-radius:8px; align-items:start; }
.mj-scope .info-card .ic{ width:56px; height:56px; border-radius:50%; background:var(--brand-soft); color:var(--brand); display:flex; align-items:center; justify-content:center; }
.mj-scope .info-card h3{ font-family:var(--ff-display); font-weight:var(--display-weight); font-size:22px; letter-spacing:-.005em; line-height:1.1; margin:0 0 6px; }
.mj-scope .info-card h3 em{ font-style:italic; color:var(--brand); }
.mj-scope .info-card p{ font-size:14px; color:var(--ink-soft); line-height:1.5; margin:0 0 8px; }
.mj-scope .info-card a{ color:var(--brand); border-bottom:1px solid currentColor; padding-bottom:1px; font-weight:500; font-size:14px; }
.mj-scope .info-card .info-sub{ color:var(--ink-mute); font-size:12px; border:0; font-weight:400; }

.mj-scope .contact-write{ position:sticky; top:100px; background:var(--card); border:1px solid var(--hairline); border-radius:10px; padding:32px; }
.mj-scope .contact-write h2{ font-family:var(--ff-display); font-weight:var(--display-weight); font-size:36px; letter-spacing:-.015em; line-height:1.05; margin:0 0 8px; }
.mj-scope .contact-write h2 em{ font-style:italic; color:var(--brand); }
.mj-scope .contact-write .sub{ color:var(--ink-soft); font-size:14px; line-height:1.6; margin:0 0 22px; }
.mj-scope .contact-write .btn-write{ display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--brand); color:#fff; border:0; border-radius:999px; padding:15px 28px; font-family:var(--ff-sans); font-weight:600; font-size:15px; }
.mj-scope .contact-write .btn-write:hover{ background:var(--brand-deep); }
.mj-scope .contact-write .write-trust{ list-style:none; margin:24px 0 0; padding:0; display:grid; gap:10px; }
.mj-scope .contact-write .write-trust li{ font-size:13px; color:var(--ink-soft); }

.mj-scope .kontakt-faq{ padding:0 0 88px; }
.mj-scope .kontakt-faq .kfaq-head{ max-width:640px; margin:0 0 34px; }
.mj-scope .kontakt-faq .eyebrow{ display:block; font-family:var(--ff-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:12px; }
.mj-scope .kontakt-faq h2{ font-family:var(--ff-display); font-weight:var(--display-weight); font-size:clamp(32px,4vw,52px); letter-spacing:-.02em; line-height:1.04; margin:0; }
.mj-scope .kontakt-faq h2 em{ font-style:italic; color:var(--brand); }
.mj-scope .kontakt-faq .kfaq-head p{ margin:14px 0 0; color:var(--ink-soft); font-size:16px; }
.mj-scope .kontakt-faq .kfaq-head a{ color:var(--brand); border-bottom:1px solid color-mix(in oklab,var(--brand) 40%,transparent); }
.mj-scope .kfaq-list{ border-top:1px solid var(--hairline); max-width:860px; }
.mj-scope .kfaq-item{ border-bottom:1px solid var(--hairline); }
.mj-scope .kfaq-item summary{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:22px 2px; font-family:var(--ff-display); font-weight:var(--display-weight); font-size:clamp(18px,2vw,22px); letter-spacing:-.005em; color:var(--ink); }
.mj-scope .kfaq-item summary::-webkit-details-marker{ display:none; }
.mj-scope .kfaq-item summary::after{ content:"+"; font-family:var(--ff-mono); font-size:24px; color:var(--ink-mute); flex:none; line-height:1; }
.mj-scope .kfaq-item[open] summary::after{ content:"−"; }
.mj-scope .kfaq-item[open] summary{ color:var(--brand); }
.mj-scope .kfaq-a{ padding:0 2px 24px; color:var(--ink-soft); font-size:15px; line-height:1.65; max-width:70ch; }

@media (max-width:980px){
  .mj-scope .contact-shell{ grid-template-columns:1fr; gap:32px; }
  .mj-scope .contact-write{ position:static; }
  .mj-scope .kontakt-main{ padding:52px 0; }
}
@media (max-width:600px){ .mj-scope .kontakt-faq{ padding-bottom:56px; } }
