:root {
 --nachtblauw:#183c4e; --staalblauw:#587f93; --lichtblauw:#b4c9d9;
 --mistblauw:#eff4f6; --lijngrijs:#dfe7ec; --oranje:#f37700;
 --oranje-knop:#d96500; --oranje-prijs:#c25a00; --oranje-licht:#ff9a3d;
 --groen:#8eb200; --groen-vink:#6f8c00; --tekst:#333333;
 --tekst-zacht:#42606f; --wit:#ffffff;
 --ruimte-1:8px; --ruimte-2:16px; --ruimte-3:24px; --ruimte-4:32px;
 --ruimte-5:48px; --ruimte-6:88px; --inhoudsbreedte:1200px;
 --radius-klein:8px; --radius-midden:12px; --radius-groot:15px;
 --font-sans:Poppins,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
body{font-family:var(--font-sans);font-size:18px;line-height:1.7;color:var(--tekst)}
.wrap{max-width:var(--inhoudsbreedte)}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.brand::before{content:"";display:block;width:160px;height:58px;background:url('/assets/uitvaart-logo-original.jpg') left center/contain no-repeat}
.brand .squares{display:none}
.brand .brand-name{font-size:22px}
.brand-city{color:var(--staalblauw);font-size:24px}
.brand-name small{font-weight:400;color:var(--tekst-zacht)}
.brand .tagline{font-size:16px}
.section.wrap{padding-inline:20px}
.city-info{background:var(--mistblauw);border-bottom:1px solid var(--lijngrijs);padding:8px 0;color:var(--tekst-zacht);font-size:16px}
.steps-band{background:var(--mistblauw);padding:24px 0}
.steps-band ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;counter-reset:steps;margin-block:0}
.steps-band li{counter-increment:steps;display:grid;grid-template-columns:32px 1fr;column-gap:16px;align-content:start;color:var(--nachtblauw);font-size:17px}
.steps-band li:before{content:counter(steps);font-size:32px;font-weight:700;color:var(--oranje-knop);grid-row:1/3}
.steps-band li span{grid-column:2}
@media(max-width:760px){.steps-band ol{grid-template-columns:1fr;gap:24px}}
h1{font-size:56px;line-height:1.15;font-weight:600}
h2{font-size:40px;line-height:1.2;font-weight:600;color:var(--staalblauw)}
h3{font-size:26px;line-height:1.25;font-weight:600;color:var(--nachtblauw)}
.eyebrow{font-size:16px;line-height:1.4;text-transform:uppercase;color:var(--nachtblauw)}
.hero{background:var(--nachtblauw);color:var(--wit)}
.hero .eyebrow{color:var(--lichtblauw)}
.hero .lead{font-size:20px;line-height:1.8}
.article-hero{padding:40px;border-radius:var(--radius-midden);margin-bottom:40px}
.article-hero h1{color:var(--wit);margin-top:0}
.article-hero .lead{color:var(--wit);margin-bottom:0}
@media(max-width:760px){.article-hero{padding:24px;margin-bottom:32px}}
.hero-grid{display:block}.hero-choices{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}
.hero-lineart{display:block;width:min(100%,900px);height:auto;margin:32px auto 0;opacity:.7}
.button{background:var(--oranje-knop);color:var(--wit);font-size:20px;font-weight:700;line-height:1.3;border-radius:var(--radius-klein);box-shadow:none}
.button.secondary{background:var(--wit);color:var(--nachtblauw);border:2px solid var(--nachtblauw)}
.hero-choices .button{border-radius:var(--radius-midden);padding:24px}
.hero-choices .button span{font-size:20px;font-weight:700}.hero-choices .button strong{font-size:20px;font-weight:700}
.head-phone{background:var(--nachtblauw);color:var(--wit);border-radius:var(--radius-midden);padding:12px 20px}
.head-phone span{font-size:16px;color:var(--wit)}.head-phone a{color:var(--oranje-licht);font-size:24px;font-weight:700}
.nav a[aria-current="page"]{border-bottom:3px solid var(--oranje)}
.section{padding-block:var(--ruimte-6)}.soft{background:var(--mistblauw)}
.card,.package,.photo-card{box-shadow:none;border:1px solid var(--lijngrijs)}
.package{border-radius:var(--radius-groot);background:var(--wit)}
.package .price{color:var(--oranje-prijs);font-size:21px;font-weight:600}
.package-overviews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:32px;align-items:start}
.package-overview{padding:32px;border:1px solid var(--lijngrijs);border-radius:var(--radius-groot);background:var(--wit)}
.package-overview h3{margin-top:0}.package-overview>p{font-size:17px}
.package-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;border-top:1px solid var(--lijngrijs);text-decoration:none}
.package-row>span:first-child{min-width:0;flex:1}
.package-row:last-of-type{border-bottom:1px solid var(--lijngrijs)}
.package-row:hover .package-name{text-decoration:underline;text-underline-offset:4px}
.package-name{display:block;font-size:18px;font-weight:600;color:var(--nachtblauw)}
.package-summary{display:block;font-size:16px;color:var(--tekst);line-height:1.5}
.package-from{white-space:nowrap;font-size:16px;color:var(--tekst-zacht)}
.package-from .price{display:block;color:var(--oranje-prijs);font-size:21px;font-weight:600}
.package-overview>.button{display:block;text-align:center;margin-top:24px}
.package{scroll-margin-top:24px}
@media(max-width:900px){.package-overviews{grid-template-columns:1fr}}
@media(max-width:420px){.package-overview{padding:20px}.package-row{gap:12px}.package-summary{font-size:16px}}
.package details{border-top:1px solid var(--lijngrijs)}
.hero-team .photo-card{border-radius:var(--radius-midden)}
.hero-team .photo-card img{display:block;width:50%;height:auto;margin-inline:auto}
.hero-team .photo-card p{font-size:16px}.hero-team h2{font-size:26px}
.mobile-callbar{box-shadow:none;border-top:1px solid var(--lijngrijs)}
.faq details{border-bottom:1px solid var(--lijngrijs);padding:20px 0}
.faq summary{cursor:pointer;font-weight:600;color:var(--nachtblauw)}
.contact-pairs{display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,3fr);gap:8px 24px}
.contact-pairs dt{font-weight:600;color:var(--nachtblauw)}
.contact-pairs dd{margin:0;min-width:0;overflow-wrap:anywhere}
.table-scroll{max-width:100%;overflow-x:auto;margin-block:24px}
.table-scroll table{word-break:normal;overflow-wrap:normal}
.reading a{overflow-wrap:anywhere}
.reading h1,.reading h2,.reading h3{hyphens:none;overflow-wrap:break-word}
.menu-toggle{font:500 16px/1.5 var(--font-sans);min-width:44px;min-height:44px;padding:8px 12px}
[data-cms-home-topics]>.grid{margin-top:24px}
.cms-topic-image{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;margin-bottom:16px}
@media(max-width:600px){.contact-pairs{grid-template-columns:minmax(0,1fr);gap:4px}.contact-pairs dd{margin-bottom:16px}}
@media(max-width:760px){body{font-size:17px}h1{font-size:32px}h2{font-size:28px}h3{font-size:22px}.section{padding-block:48px}.hero-choices{grid-template-columns:1fr}.head-phone{display:block;width:100%;margin:12px 0}.head-phone a{font-size:24px}.hero-team .photo-card p{font-size:16px}.hero-team h2{font-size:24px}.hero-lineart{margin-top:24px}}

/* Peter, 26 October 2026: Nijmegen's satellite identity and desktop hero
   follow Den Haag. Keep the approved orange token and city-specific artwork.
   Presentation only; no form, pricing or security selectors. */
.head .brand{flex-direction:row;align-items:center;gap:12px}
.head .brand::before{content:none}
.head .brand .squares{display:grid;grid-template-columns:14px 14px;gap:4px}
.head .brand .squares i{background:var(--oranje)}
.head .brand .squares i:nth-child(2){background:var(--lichtblauw)}
.head .brand .squares i:nth-child(3){background:var(--staalblauw)}
.head .brand .squares i:nth-child(4){background:var(--groen)}
.head .brand .brand-name,.head .brand .brand-city{font-size:28px}
.head .brand .tagline{font-size:13px;color:var(--tekst-zacht);letter-spacing:0}
.hero-grid .hero-choices{grid-template-columns:1fr;max-width:460px}
@media(min-width:900px){
 .hero-grid{display:grid;grid-template-columns:minmax(340px,460px) minmax(0,1fr);column-gap:48px;row-gap:0;align-items:end}
 .hero-grid>div:first-child{display:contents}
 .hero-grid .eyebrow,.hero-grid h1,.hero-grid .lead{grid-column:1 / -1}
 .hero-grid .hero-choices{grid-column:1;grid-row:4}
 .hero-grid>.hero-lineart{grid-column:2;grid-row:4;width:100%;max-width:620px;margin:0;justify-self:end;align-self:end}
}
@media(max-width:899px){
 .hero-grid{display:block}
 .hero-grid>.hero-lineart{width:100%;max-width:620px;margin:28px auto 0}
}
@media(max-width:760px){.head .brand .brand-name,.head .brand .brand-city{font-size:23px}}
@media(max-width:350px){
 .head .brand{gap:8px}
 .head .brand .brand-name,.head .brand .brand-city{font-size:19px}
 .head .brand .tagline{font-size:12px}
}
