/* Gravferdsguiden — content-page styles for WordPress.
   Scoped under .gg-page (added by the WXR import) so it never collides with the
   active theme. Matches the calculator's calm palette. Self-contained. */

.gg-page{
  --p-ink:#1c2530; --p-muted:#5d6b7a; --p-line:#e4e8ec; --p-card:#fff;
  --p-accent:#0e3d40; --p-accent-soft:#eaf2f1; --p-warn:#8a6d3b; --p-warnbg:#faf6ec;
  color:var(--p-ink); font-size:16px; line-height:1.65; max-width:820px;
}

/* The header/footer template parts sit OUTSIDE .gg-page, so expose the same
   palette tokens on them — otherwise var(--p-accent) etc. are undefined there
   (e.g. the nav CTA would render with no background). */
header.wp-block-template-part, footer.wp-block-template-part{
  --p-ink:#1c2530; --p-muted:#5d6b7a; --p-line:#e4e8ec;
  --p-accent:#0e3d40; --p-accent-soft:#eaf2f1;
}

/* ===== Site header — custom logo + spaced nav + professional hamburger =======
   Markup lives in the theme part parts/header.html (a Custom-HTML block): a real
   <img> logo, a trimmed nav (4 links + one CTA) with generous spacing, and a
   hamburger that toggles a drop panel on narrow screens. Sticky white bar. */
header.wp-block-template-part{background:#fff; border-bottom:1px solid var(--p-line);
  position:sticky; top:0; z-index:200}
.gg-navbar{max-width:1180px; margin:0 auto!important; padding:14px 30px; min-height:78px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; position:relative}
.gg-logo{flex:none; display:inline-flex; align-items:center; line-height:0}
.gg-logo img{height:46px; width:auto; display:block}
.gg-nav{display:flex; align-items:center; gap:38px}
.gg-nav a{color:var(--p-ink); text-decoration:none; font-size:15.5px; font-weight:500;
  white-space:nowrap; letter-spacing:.005em; transition:color .15s}
.gg-nav a:hover{color:var(--p-accent)}
/* The one money button — gold so it clearly reads as the primary action. */
.gg-nav .gg-nav-cta{background:#f4c542; color:#3a2f00; padding:12px 26px; border-radius:999px;
  font-weight:700; box-shadow:0 2px 8px rgba(244,197,66,.35); transition:transform .12s, box-shadow .15s, filter .12s}
.gg-nav .gg-nav-cta:hover{color:#3a2f00; transform:translateY(-1px); filter:brightness(1.04);
  box-shadow:0 6px 18px rgba(244,197,66,.5)}
/* hamburger (hidden on desktop) */
.gg-burger{display:none; flex-direction:column; justify-content:center; gap:5px; width:46px; height:46px;
  padding:0; border:none; background:none; cursor:pointer; -webkit-tap-highlight-color:transparent}
.gg-burger span{display:block; width:25px; height:2px; border-radius:2px; background:var(--p-ink);
  margin:0 auto; transition:transform .28s cubic-bezier(.4,0,.2,1), opacity .2s}
.gg-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.gg-burger.is-open span:nth-child(2){opacity:0}
.gg-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:860px){
  .gg-burger{display:flex}
  .gg-nav{position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0;
    background:#fff; border-bottom:1px solid var(--p-line); box-shadow:0 18px 34px rgba(0,0,0,.09);
    padding:6px 0 12px; max-height:0; overflow:hidden; opacity:0; visibility:hidden;
    transition:max-height .32s ease, opacity .2s, visibility .2s}
  .gg-nav.is-open{max-height:82vh; opacity:1; visibility:visible}
  .gg-nav a{padding:15px 30px; font-size:16px; border-top:1px solid var(--p-line)}
  .gg-nav a:first-child{border-top:none}
  .gg-nav .gg-nav-cta{margin:12px 30px 4px; text-align:center; padding:14px 24px}
  .gg-nav .gg-nav-cta:hover{transform:none}
}

/* ===== Site footer — styles the THEME's block footer template part =====
   Logo, disclaimer, and link row, centred. Class .gg-footer / .gg-footer-inner
   come from the theme part; the logo replaces the footer site-title text. */
footer.wp-block-template-part{background:#f7f8f9; border-top:1px solid var(--p-line); margin-top:56px}
.gg-footer{padding:0}
.gg-footer-inner{max-width:1000px; margin:0 auto!important; padding:48px 28px 44px;
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px}
.gg-footer-inner .wp-block-site-title{margin:0}
.gg-footer-inner .wp-block-site-title a{display:block; width:220px; height:54px;
  text-indent:-9999px; overflow:hidden; white-space:nowrap;
  background:url('/wp-content/plugins/gravferdsguiden/assets/logo.png') no-repeat center;
  background-size:contain}
.gg-footer-disc{margin:0; max-width:600px; line-height:1.65; font-size:13.5px; color:var(--p-muted)}
.gg-footer-inner .wp-block-navigation{justify-content:center; gap:6px 26px; flex-wrap:wrap}
.gg-footer-inner .wp-block-navigation-item__content{color:var(--p-accent); text-decoration:none;
  font-size:14px; font-weight:500}
.gg-footer-inner .wp-block-navigation-item__content:hover{text-decoration:underline}
.gg-page h1{font-size:30px; line-height:1.2; letter-spacing:-.3px; margin:0 0 18px}
.gg-page h2{font-size:21px; margin:26px 0 12px}
.gg-page h3{font-size:17px; margin:20px 0 8px}
.gg-page p{margin:0 0 14px}
.gg-page ul{margin:0 0 14px; padding-left:22px}
.gg-page li{margin:6px 0}
.gg-page a{color:var(--p-accent); text-decoration:underline}
.gg-page .gg-lead{font-size:18px; color:var(--p-muted); margin-bottom:20px}

.gg-page .note,.gg-page .gg-note{background:var(--p-warnbg); border:1px solid #eadfc4;
  color:var(--p-warn); border-radius:10px; padding:14px 18px; margin:16px 0; font-size:14.5px}
.gg-page .card,.gg-page .gg-card{background:var(--p-card); border:1px solid var(--p-line);
  border-radius:12px; padding:16px 18px; margin:12px 0}
.gg-page section{padding:6px 0}

/* ===== Homepage — Parting.com information architecture in petroleum/gold =====
   hero + kommune search → three value props → three steps → closing CTA →
   kommune coverage. Sections are contained (no 100vw break-out) for robustness. */
.gg-page.gg-home{max-width:1160px; margin:0 auto; --gold:#f4c542; --gold-ink:#3a2f00}
.gg-page.gg-home > section{padding:0}

/* Homepage rhythm: generous, consistent space BETWEEN sections is what reads
   as "calm and professional" rather than "chaotic" — every direct child
   section gets the same air, regardless of its own internal padding. */
.gg-home > section + section{margin-top:56px}
@media(max-width:600px){.gg-home > section + section{margin-top:40px}}

/* Hero — light band that frames the calculator card (Parting's "white card over
   hero" idea, adapted: the calculator IS the card). Dark text on a soft tint. */
.gg-home .pg-hero-calc{background:linear-gradient(180deg,var(--p-accent-soft) 0%,#f4f8f7 60%,#fff 100%);
  border-radius:26px; padding:56px 24px 44px; text-align:center; color:var(--p-ink)}
.gg-home .pg-hero-inner{max-width:640px; margin:0 auto}
.gg-home .pg-eyebrow{font-size:12.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--p-accent); font-weight:650; margin:0 0 16px}
.gg-home .pg-hero h1{font-family:Georgia,"Times New Roman",serif; font-weight:500; font-size:46px;
  line-height:1.12; letter-spacing:-.01em; color:#123c3f; margin:0 0 14px}
.gg-home .pg-hero-sub{font-size:18px; line-height:1.5; color:var(--p-muted); margin:0; max-width:480px; margin:0 auto}
.gg-home .pg-calc{max-width:1040px; margin:28px auto 0}
.gg-home .pg-trust{list-style:none; display:flex; justify-content:center; flex-wrap:wrap; gap:10px 24px;
  padding:0; margin:26px 0 0; font-size:13.5px; color:var(--p-muted)}
.gg-home .pg-trust li{position:relative; padding-left:20px}
.gg-home .pg-trust li::before{content:""; position:absolute; left:0; top:6px; width:11px; height:6px;
  border-left:2px solid var(--p-accent); border-bottom:2px solid var(--p-accent); transform:rotate(-45deg)}

/* Value props — a quiet, headline-free row directly under the hero. No H2,
   no lead paragraph: three short facts, not another section to read. */
.gg-home .pg-values{padding:0 20px}
.gg-home .pg-val-grid{display:grid; grid-template-columns:1fr; gap:28px; max-width:900px; margin:0 auto;
  text-align:center}
@media(min-width:720px){.gg-home .pg-val-grid{grid-template-columns:repeat(3,1fr); gap:20px}}
.gg-home .pg-val{padding:0 10px}
.gg-home .pg-ico{width:40px; height:40px; color:var(--p-accent); margin:0 auto 14px; display:block}
.gg-home .pg-val h3{font-size:16.5px; font-weight:650; color:var(--p-ink); margin:0 0 4px}
.gg-home .pg-val p{font-size:14px; color:var(--p-muted); margin:0}

/* Search-intent answer block: concise, sourced and easy for people and
   machines to parse without hiding useful information in metadata. */
.gg-home .pg-seo-intro{max-width:900px; margin-left:auto; margin-right:auto; padding:34px 38px!important;
  border:1px solid var(--p-line); border-radius:20px; background:#fff; text-align:left}
.gg-home .pg-seo-intro h2,.gg-home .pg-faq-section h2,.gg-home .pg-topics h2{
  font-family:Georgia,"Times New Roman",serif; font-size:30px; font-weight:500; color:var(--p-ink); margin:0 0 12px}
.gg-home .pg-answer{font-size:17px; line-height:1.65; color:var(--p-muted); margin:0}
.gg-home .pg-answer strong{color:var(--p-ink)}
.gg-home .pg-data-points{display:grid;grid-template-columns:1fr;gap:10px;margin:22px 0 10px}
@media(min-width:680px){.gg-home .pg-data-points{grid-template-columns:repeat(3,1fr)}}
.gg-home .pg-data-points span{display:flex;flex-direction:column;padding:14px 16px;border-radius:12px;background:var(--p-accent-soft);
  color:var(--p-muted);font-size:12.5px;line-height:1.4}
.gg-home .pg-data-points strong{font-size:20px;color:var(--p-accent);font-variant-numeric:tabular-nums}
.gg-home .pg-source-line{font-size:12.5px;color:var(--p-muted);margin:8px 0 0}

.gg-home .pg-topics,.gg-home .pg-faq-section{max-width:1000px;margin-left:auto;margin-right:auto;padding:0 20px!important}
.gg-home .pg-topics .pg-services-head,.gg-home .pg-faq-section{text-align:center}
.gg-home .pg-topic-grid{display:grid;grid-template-columns:1fr;gap:10px;text-align:left}
@media(min-width:680px){.gg-home .pg-topic-grid{grid-template-columns:1fr 1fr}}
.gg-home .pg-topic-grid a{display:flex;flex-direction:column;gap:3px;padding:15px 17px;border:1px solid var(--p-line);
  border-radius:12px;background:#fff;text-decoration:none!important;transition:border-color .15s,transform .15s}
.gg-home .pg-topic-grid a:hover{border-color:var(--p-accent);transform:translateY(-1px)}
.gg-home .pg-topic-grid strong{font-size:15px;color:var(--p-accent)}
.gg-home .pg-topic-grid span{font-size:13px;color:var(--p-muted)}
.gg-home .pg-faq-section .faq{max-width:820px;margin:20px auto 0;text-align:left}

/* Aftermarket services grid — the monetisation surface (gravstein, gravering,
   blomster, minneside, gravstell, dødsbo). Sits beside the transparent data. */
.gg-home .pg-services{padding:0 20px; text-align:center}
.gg-home .pg-services-head{max-width:660px; margin:0 auto 28px}
.gg-home .pg-services-head h2{font-family:Georgia,"Times New Roman",serif; font-weight:500;
  font-size:28px; color:var(--p-ink); margin:0}
.gg-home .pg-services-grid{display:grid; grid-template-columns:1fr; gap:16px; max-width:1000px; margin:0 auto}
@media(min-width:640px){.gg-home .pg-services-grid{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.gg-home .pg-services-grid{grid-template-columns:repeat(3,1fr)}}
.gg-home .pg-serv{display:flex; flex-direction:column; align-items:flex-start; text-align:left;
  background:#fff; border:1px solid var(--p-line); border-radius:16px; padding:22px 22px 20px;
  text-decoration:none!important; transition:border-color .18s, box-shadow .18s, transform .15s}
.gg-home .pg-serv:hover{border-color:var(--p-accent); box-shadow:0 8px 20px rgba(14,61,64,.09); transform:translateY(-2px)}
.gg-home .pg-serv-feat{border-color:var(--p-accent); background:var(--p-accent-soft)}
.gg-home .pg-serv-k{font-weight:650; font-size:17px; color:var(--p-ink); margin-bottom:6px}
.gg-home .pg-serv-d{font-size:14px; line-height:1.5; color:var(--p-muted); margin-bottom:14px; flex:1}
.gg-home .pg-serv-go{font-weight:650; font-size:14.5px; color:var(--p-accent)}

/* Closing CTA */
.gg-home .pg-bottomcta{text-align:center; padding:52px 20px; background:var(--p-accent-soft); border-radius:26px}
.gg-home .pg-bottomcta h2{font-family:Georgia,"Times New Roman",serif; font-weight:500; font-size:28px;
  color:var(--p-ink); margin:0 0 10px}
.gg-home .pg-bottomcta p{font-size:15px; color:var(--p-muted); max-width:440px; margin:0 auto 22px}
.gg-home .pg-cta-btn{display:inline-block; background:var(--gold); color:var(--gold-ink)!important;
  text-decoration:none!important; font-weight:700; font-size:17px; padding:16px 36px; border-radius:999px;
  transition:transform .12s, box-shadow .15s}
.gg-home .pg-cta-btn:hover{transform:translateY(-1px); box-shadow:0 10px 24px rgba(13,74,78,.22)}

/* Kommune coverage strip */
.gg-home .pg-kommuner{text-align:center; padding:0 20px}
.gg-home .pg-kommuner-title{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--p-muted); font-weight:650; margin:0 0 12px}
.gg-home .pg-kommuner-links{font-size:15.5px; margin:0}
.gg-home .pg-kommuner-links a{color:var(--p-accent)!important; font-weight:650; text-decoration:none!important;
  border-bottom:2px solid var(--p-accent-soft)}
.gg-home .pg-kommuner-links a:hover{border-color:var(--p-accent)}
.gg-home .pg-kommuner-more{color:var(--p-muted); font-weight:500}

@media(max-width:600px){
  .gg-home .pg-hero-calc{padding:44px 20px 36px}
  .gg-home .pg-hero h1{font-size:32px}
  .gg-home .pg-services-head h2,.gg-home .pg-bottomcta h2{font-size:24px}
  .gg-home .pg-seo-intro{padding:26px 22px!important;margin-left:12px;margin-right:12px}
  .gg-home .pg-seo-intro h2,.gg-home .pg-faq-section h2,.gg-home .pg-topics h2{font-size:25px}
}

.gg-page table{width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--p-line);
  border-radius:12px; overflow:hidden; margin:12px 0}
.gg-page th,.gg-page td{text-align:left; padding:11px 14px; border-bottom:1px solid var(--p-line); font-size:15px}
.gg-page th{background:#fbfcfc; font-size:13px; color:var(--p-muted); font-weight:600}
.gg-page tr:last-child td{border-bottom:none}
.gg-page .price{white-space:nowrap; font-variant-numeric:tabular-nums}
.gg-page .prov,.gg-page .gg-src{font-size:13px; color:var(--p-muted); margin-top:8px}

.gg-page .badge{display:inline-block; font-size:12px; padding:2px 9px; border-radius:20px; font-weight:600}
.gg-page .b-ok{background:var(--p-accent-soft); color:var(--p-accent)}
.gg-page .b-none{background:#eef1f3; color:var(--p-muted)}

/* FAQ (accordion) + datakvalitet block. Two markup variants exist in generated
   content (.gg-faq/.gg-faq-item and the plainer .faq > details) — style both so
   every page's accordion looks the same regardless of which produced it. */
.gg-page .gg-faq,.gg-page .faq{margin-top:22px}
.gg-page .gg-faq-item,.gg-page .faq details{background:#fff; border:1px solid var(--p-line); border-radius:10px;
  padding:0 16px; margin:8px 0; transition:border-color .15s}
.gg-page .gg-faq-item:hover,.gg-page .faq details:hover{border-color:var(--p-accent)}
.gg-page .gg-faq-item summary,.gg-page .faq summary{font-weight:600; padding:14px 0; cursor:pointer; list-style:none}
.gg-page .gg-faq-item summary::-webkit-details-marker,.gg-page .faq summary::-webkit-details-marker{display:none}
.gg-page .gg-faq-item summary::before,.gg-page .faq summary::before{content:"+ "; color:var(--p-accent); font-weight:700;
  display:inline-block; transition:transform .15s}
.gg-page .gg-faq-item[open] summary::before,.gg-page .faq details[open] summary::before{transform:rotate(45deg)}
.gg-page .gg-faq-a,.gg-page .faq details > *:not(summary){padding:12px 0 14px; color:var(--p-muted);
  animation:gg-page-rise .2s ease-out}
@keyframes gg-page-rise{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.gg-page .dq{background:#fff; border:1px solid var(--p-line); border-radius:12px; padding:14px 18px; margin:18px 0; font-size:14px}
.gg-page .dq .r{display:flex; justify-content:space-between; gap:12px; padding:4px 0; border-bottom:1px dashed var(--p-line)}
.gg-page .dq .r:last-child{border-bottom:none}
.gg-page .dq .r .d{color:var(--p-muted); font-variant-numeric:tabular-nums}