/* Shared blue identity, scoped reading and marketing layouts. */
.subpage-body { background:#fff; color:#0f172a; }
.subpage { padding-top:clamp(44px,6vw,88px); padding-bottom:clamp(64px,8vw,120px); }
.subpage h1 { font-family:var(--body); font-size:clamp(36px,4.4vw,66px); font-weight:600; line-height:1.06; letter-spacing:-.035em; max-width:22ch; margin:0 0 28px; text-wrap:balance; }
.subpage h2 { font-family:var(--display); font-size:clamp(32px,3.2vw,48px); line-height:1.08; font-weight:600; letter-spacing:-.02em; margin:0 0 22px; text-wrap:balance; }
.subpage h3 { font-family:var(--body); font-size:24px; line-height:1.25; font-weight:600; letter-spacing:-.015em; margin:28px 0 12px; }
.subpage p,.subpage li,.subpage dd { font-size:18px; line-height:1.65; }
.subpage p { max-width:72ch; margin:0 0 20px; }
.subpage a { text-underline-offset:.2em; }
.subpage a:not(.sub-button):hover { color:#1d4ed8; }
.subpage figure { margin:0; min-width:0; }
.subpage img { display:block; max-width:100%; height:auto; }
.subpage figcaption { font-size:14px; line-height:1.5; color:#475569; margin-top:10px; }
.subpage ul { padding-left:22px; margin:20px 0 28px; }
.subpage li { padding-left:4px; margin:8px 0; }
.subpage .sub-lead { font-size:clamp(20px,2vw,24px); line-height:1.55; color:#334155; max-width:66ch; }
.sub-intro { margin-bottom:32px; }
.sub-intro-image { display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:center; }
.sub-intro-image img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.sub-actions { display:flex; gap:24px; align-items:center; flex-wrap:wrap; margin:32px 0 60px; }
.subpage .sub-button { min-height:48px; display:inline-flex; justify-content:center; align-items:center; padding:13px 24px; border:0; border-radius:3px; background:#2563eb; color:#fff; text-decoration:none; font-family:inherit; font-size:17px; font-weight:600; line-height:1.3; cursor:pointer; text-align:center; }
.subpage .sub-button:hover { background:#1d4ed8; }
.subpage .sub-button:disabled { background:#64748b; cursor:not-allowed; }
.sub-text-link { font-size:17px; color:#1d4ed8; font-weight:600; text-decoration:underline; }
.subpage :focus-visible { outline:3px solid #2563eb; outline-offset:4px; }
.subpage ::selection { color:#fff; background:#1d4ed8; }
.sub-block { margin-top:72px; padding-top:52px; border-top:1px solid #dbe3ee; }
.sub-block > h2 { max-width:28ch; }
.sub-service { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:64px; margin-top:72px; padding-top:48px; border-top:1px solid #dbe3ee; }
.sub-service:nth-of-type(even) figure { order:2; }
.sub-service figure { background:#f5f8fd; padding:20px; }
.sub-service img { width:100%; aspect-ratio:800/520; object-fit:contain; }
.sub-service h3 { font-size:19px; }
.sub-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:56px; }
.sub-two h3 { margin-top:0; }
.sub-portfolio { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:64px 40px; margin:56px 0; }
.sub-portfolio img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.subpage img[src*="project-etten-leur-2026"],.subpage img[src*="project-warmenhuizen-2026"] { width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; }
.sub-portfolio h2 { font-size:36px; }
.subpage .sub-place { color:#475569; font-size:15px; margin:18px 0 10px; }
.sub-process { padding:0!important; margin:36px 0!important; list-style:none; }
.sub-process > li { display:grid; grid-template-columns:72px minmax(0,1fr); gap:28px; padding:30px 0; margin:0; border-bottom:1px solid #dbe3ee; }
.sub-process h3 { margin:0 0 24px; font-size:28px; }
.sub-step-number { font-size:44px; line-height:1; color:#2563eb; font-variant-numeric:tabular-nums; }
.sub-process dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin:0; }
.sub-process dt { font-weight:600; font-size:15px; margin-bottom:9px; color:#0f172a; }
.sub-process dd { margin:0; font-size:17px; color:#334155; }
.sub-contacts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:42px; margin:44px 0; }
.sub-contacts article { display:grid; grid-template-columns:108px minmax(0,1fr); gap:24px; align-items:start; }
.sub-contacts img { width:108px; height:136px; object-fit:cover; object-position:center top; }
.sub-contacts h3 { margin:0 0 8px; }
.sub-contacts p { font-size:16px; line-height:1.45; margin-bottom:12px; }
.sub-contacts a { display:block; width:fit-content; font-size:18px; margin-top:7px; overflow-wrap:anywhere; }
.sub-short-process { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:42px; padding-left:24px; }
.sub-short-process h3 { margin-top:0; }
.sub-contact-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:72px; }
.sub-company { margin:24px 0; }
.sub-company div { display:flex; gap:20px; }
.sub-company dt { min-width:64px; font-weight:600; }
.sub-company dd { margin:0; font-variant-numeric:tabular-nums; }
.sub-form { max-width:820px; }
.sub-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.sub-field { min-width:0; }
.sub-field label { display:block; font-weight:600; font-size:16px; margin-bottom:8px; }
.sub-field input,.sub-field textarea,.sub-field select { display:block; box-sizing:border-box; width:100%; min-width:0; min-height:48px; border:1px solid #94a3b8; border-radius:3px; padding:12px; background:#fff; color:#0f172a; font:18px var(--body); caret-color:#2563eb; }
.sub-field input[type=file] { padding:10px; font-size:15px; }
.sub-field input[type=number] { font-variant-numeric:tabular-nums; }
.sub-field small { display:block; font-size:14px; line-height:1.5; margin-top:8px; color:#475569; }
.sub-field textarea { resize:vertical; }
.sub-full { grid-column:1/-1; }
.sub-consent { display:flex; align-items:flex-start; gap:12px; margin:24px 0; font-size:15px; line-height:1.5; }
.sub-consent input { flex:0 0 18px; width:18px; height:18px; margin:2px 0 0; accent-color:#2563eb; }
.subpage .sub-form-status { margin-top:16px; font-size:15px; color:#475569; }
.sub-guide { display:grid; grid-template-columns:minmax(200px,.65fr) minmax(0,1fr); gap:72px; align-items:center; margin:64px 0; }
.sub-guide img { width:100%; max-width:340px; height:auto; box-shadow:0 18px 40px #0f172a24; }
.subpage .table-scroll { max-width:100%; overflow:auto; margin:24px 0; scrollbar-color:#94a3b8 #f1f5f9; }
.subpage table { width:100%; border-collapse:collapse; text-align:left; font-size:17px; }
.subpage th,.subpage td { padding:15px 18px; border-bottom:1px solid #dbe3ee; vertical-align:top; }
.subpage th { font-weight:600; }
.subpage thead { background:#eff6ff; color:#0f172a; }
.subpage .sub-fine { font-size:15px; color:#475569; line-height:1.55; }
.subpage-article,.subpage-legal { max-width:940px; }
.subpage-article .sub-intro h1 { max-width:26ch; font-size:clamp(36px,4.2vw,60px); }
.subpage .sub-date { color:#475569; font-size:15px; margin-bottom:44px; }
.sub-article h2,.sub-legal h2 { margin-top:52px; font-size:36px; }
.sub-article h3,.sub-legal h3 { margin-top:32px; }
.sub-article article > div > div:first-child { background:#eff6ff; padding:28px 32px; margin:0 0 44px; }
.sub-article article > div > div:first-child h2 { margin-top:0; }
.sub-article blockquote { margin:32px 0; padding:24px 30px; background:#f1f5f9; border:0; }
.sub-article blockquote p:last-child { margin-bottom:0; }
.sub-legal > div { max-width:100%; }
.sub-legal h1 { font-size:clamp(36px,4vw,56px); }
.sub-legal section { margin:40px 0; }
.sub-article-list { margin-top:64px; }
.sub-article-list article { display:grid; grid-template-columns:110px minmax(0,1fr); gap:42px; border-top:1px solid #dbe3ee; padding:34px 0; }
.sub-article-list time { font-size:15px; color:#475569; margin-top:7px; }
.subpage .sub-article-list h2 { max-width:30ch; font:600 clamp(31px,2.7vw,36px)/1.2 var(--display); margin-bottom:14px; }
.subpage .sub-article-list h2 a { display:block; font:inherit; line-height:1.2; text-decoration:none; }
.subpage li.sub-literal-bullet { list-style:none; display:flex; align-items:flex-start; gap:10px; }
.sub-literal-bullet > span:first-child { flex:0 0 auto; }
.subpage .sub-contacts h2.sub-contact-name { font:600 24px/1.25 var(--body); margin:0 0 8px; letter-spacing:-.015em; }
.subpage .sub-legal h3.sub-legacy-small-heading { font:600 18px/1.6 var(--body); margin:24px 0; letter-spacing:normal; }
.subpage .sub-legal h2.sub-legacy-note-heading { font:600 24px/1.25 var(--body); margin:28px 0 12px; letter-spacing:-.015em; }
@media(max-width:960px) {
 .sub-intro-image,.sub-service { gap:32px; }
 .sub-process dl { grid-template-columns:1fr; gap:18px; }
 .sub-contacts { gap:28px; }
 .sub-contacts article { grid-template-columns:80px minmax(0,1fr); gap:16px; }
 .sub-contacts img { width:80px; height:108px; }
 .sub-contact-layout { gap:40px; }
 .sub-guide { gap:40px; }
}
@media(max-width:680px) {
 .subpage { padding-top:36px; }
 .subpage h1 { letter-spacing:-.025em; }
 .subpage p,.subpage li,.subpage dd { font-size:17px; }
 .sub-intro-image,.sub-service,.sub-portfolio,.sub-two,.sub-contacts,.sub-contact-layout,.sub-guide,.sub-short-process { grid-template-columns:1fr; }
 .sub-intro-image { gap:24px; }
 .sub-actions { align-items:stretch; gap:20px; margin-bottom:42px; }
 .sub-actions .sub-button { width:100%; }
 .sub-block { margin-top:48px; padding-top:36px; }
 .sub-service { margin-top:48px; padding-top:32px; gap:24px; }
 .sub-service:nth-of-type(even) figure { order:0; }
 .sub-service figure { padding:12px; }
 .sub-portfolio { gap:40px; }
 .sub-process > li { grid-template-columns:42px minmax(0,1fr); gap:16px; }
 .sub-step-number { font-size:30px; }
 .sub-process h3 { font-size:24px; }
 .sub-contacts article { grid-template-columns:86px minmax(0,1fr); gap:20px; }
 .sub-contacts img { width:86px; height:112px; }
 .sub-contacts h3 { font-size:23px; }
 .sub-contacts a { font-size:17px; }
 .sub-short-process { gap:18px; }
 .sub-contact-layout { gap:0; }
 .sub-form-grid { grid-template-columns:1fr; gap:20px; }
 .sub-guide { gap:36px; }
 .sub-guide img { max-width:280px; margin:auto; }
 .subpage th,.subpage td { padding:12px; }
 .sub-article-list article { grid-template-columns:1fr; gap:12px; }
 .sub-article-list h2 { font-size:31px; }
 .sub-article article > div > div:first-child { padding:22px; }
 .sub-article blockquote { padding:20px; }
}