/* codexdanishnative20261021a: Danish Plumbing's existing palette, typography and layouts in our own CSS. */
:root { color-scheme: light; --red:#b11b10; --ink:#0c1017; --panel:#1c1e25; --text:#212121; --muted:#a9a9a9; --paper:#f8f8f8; --width:1290px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Rubik,Arial,sans-serif; font-size:16px; line-height:1.65; color:var(--text); background:#fff; }
body.lightbox-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--red); }
button,input,textarea { font:inherit; }
button,a,input,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { cursor:wait; opacity:.65; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible { outline:3px solid #b11b10; outline-offset:4px; }
img { display:block; max-width:100%; height:auto; }
.native-picture { display:contents; }
[hidden] { display:none!important; }
h1,h2,h3,h4 { margin:0 0 22px; line-height:1.2; font-weight:600; }
h1 { font-size:45px; }
h2 { font-size:35px; }
h3 { font-size:25px; }
p { margin:0 0 22px; }
ul,ol { padding-left:1.25em; }
.container { width:min(var(--width),calc(100% - 60px)); margin-inline:auto; }
.skip-link { position:fixed; left:16px; top:-100px; z-index:100; padding:12px 20px; background:white; color:black; }
.skip-link:focus { top:12px; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { position:absolute; inset:0 0 auto; z-index:10; color:#fff; background:linear-gradient(#0c1017b8,transparent); }
.page-plain .site-header { position:relative; background:var(--ink); }
.header-main { min-height:125px; display:flex; align-items:center; justify-content:space-between; gap:36px; }
.site-logo { flex:0 0 auto; }
.site-logo img { width:225px; max-height:90px; object-fit:contain; }
.site-navigation { display:flex; align-items:center; gap:27px; }
.site-navigation a { font-size:14px; font-weight:600; text-transform:uppercase; white-space:nowrap; padding:12px 0; }
.site-navigation a:hover,.site-navigation a[aria-current=page] { color:var(--red); }
.header-phone { font-size:18px; white-space:nowrap; }
.menu-toggle { display:none; color:#fff; background:none; border:1px solid #ffffff80; padding:10px 14px; }
.hero { position:relative; overflow:hidden; color:#fff; background:var(--ink); padding:200px 0 100px; min-height:360px; text-align:center; }
.hero-image,.banner-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero::after,.banner::after { content:""; position:absolute; inset:0; background:#0c1017e6; }
.hero-content,.banner-content { position:relative; z-index:1; }
.hero p { color:var(--muted); font-size:18px; max-width:900px; margin:0 auto; }
.hero-home { text-align:left; padding:300px 0 175px; }
.hero-home h1 { max-width:900px; font-size:64px; text-transform:uppercase; }
.hero-home p { max-width:750px; margin:0 0 30px; line-height:1.4; }
.eyebrow { display:block; color:inherit; font-size:18px; font-weight:400; text-transform:uppercase; margin-bottom:25px; letter-spacing:.015em; }
.button { display:inline-flex; align-items:center; justify-content:center; background:var(--red); color:#fff; padding:13px 26px; font-size:14px; font-weight:500; line-height:1.4; border:1px solid var(--red); border-radius:0; }
.button:hover { color:#fff; background:#212121; border-color:#212121; }
.button-outline { border-color:#fff; color:#fff; background:transparent; }
.button-outline:hover { border-color:var(--red); background:var(--red); }
.section { padding:75px 0; }
.section-dark { background:var(--panel); color:#fff; }
.section-dark p,.section-dark li { color:var(--muted); font-size:18px; line-height:1.4; }
.section-light { background:var(--paper); }
.section-heading { max-width:950px; margin:0 auto 45px; text-align:center; }
.split { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.split .copy { padding:75px 50px; align-self:center; }
.split .feature-image { width:100%; height:100%; object-fit:cover; min-height:440px; }
.split .eyebrow { font-size:18px; }
.split h2 { text-transform:uppercase; }
.split-full .copy { padding:120px 65px; }
.split-full { width:100%; }
.feature-figure { position:relative; }
.image-caption { position:absolute; bottom:20px; left:0; padding:15px 25px; background:var(--red); color:white; font-size:21px; margin:0; }
.intro-text { max-width:1100px; }
.difference-cards h3 { font-size:25px; }
.service-detail { padding:55px 0; }
.service-detail:nth-of-type(even) .feature-figure { order:2; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; }
.service-card { border:1px solid #02010133; padding:45px; background:#fff; }
.service-card img { width:100%; height:250px; object-fit:cover; margin-bottom:30px; }
.service-card h3 { font-size:30px; }
.service-card p:last-child { margin-bottom:0; }
.service-card .button { margin-top:15px; }
.services-feature { background:var(--panel); color:white; }
.service-band { position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.home-services { grid-template-columns:repeat(4,minmax(0,1fr)); }
.home-services h2 { font-size:26px; }
.service-tile { position:relative; min-height:280px; overflow:hidden; color:#fff; background:var(--panel); }
.service-tile img { position:absolute; inset:0; height:100%; width:100%; object-fit:cover; }
.service-tile::after { content:""; position:absolute; inset:0; background:#1c1e25d9; transition:background .2s; }
.service-tile:hover::after { background:#1c1e258a; }
.service-tile .copy { position:relative; z-index:1; padding:45px 35px; }
.service-tile h3 { font-size:26px; }
.banner { position:relative; overflow:hidden; background:var(--panel); color:#fff; padding:110px 0; text-align:center; }
.banner h2 { font-size:35px; }
.banner-content p { color:var(--muted); }
.carousel { padding:50px 0; }
.carousel h2 { text-align:center; text-transform:uppercase; margin-bottom:35px; }
.carousel-stage { position:relative; padding:0 44px; }
.carousel-track { display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
.carousel-track::-webkit-scrollbar { display:none; }
.carousel-track a { flex:0 0 calc((100% - 40px)/3); scroll-snap-align:start; }
.carousel-track img { width:100%; height:270px; object-fit:cover; }
.carousel-button { position:absolute; top:50%; transform:translateY(-50%); font-size:36px; background:transparent; border:0; padding:0 8px; line-height:1; color:#212121; }
.carousel-button.previous { left:0; }
.carousel-button.next { right:0; }
.project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px; }
.project-card { background:#fff; box-shadow:0 4px 20px #0000000d; }
.project-card img { width:100%; height:270px; object-fit:cover; }
.project-card h2 { font-size:25px; margin:0; padding:25px; }
.project-link { display:block; padding:0 25px 25px; color:var(--red); font-size:14px; }
.project-gallery { padding:60px 0 90px; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.gallery-grid a { display:block; overflow:hidden; background:#ececec; }
.gallery-grid img { width:100%; height:290px; object-fit:cover; transition:transform .2s; }
.gallery-grid a:hover img { transform:scale(1.025); }
.gallery-links { display:flex; justify-content:space-between; gap:25px; padding-top:35px; }
.reviews-frame { display:block; width:100%; height:1100px; min-height:700px; border:0; background:white; }
.reviews-section { padding:50px 0; }
.contact-section { position:relative; overflow:hidden; background:var(--panel); color:#fff; }
.contact-photo::after { content:""; position:absolute; inset:0; background:#1c1e25e6; }
.contact-grid { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:start; padding:80px 0; }
.contact-copy { padding:40px 0; }
.contact-copy p { color:var(--muted); font-size:18px; line-height:1.4; }
.contact-links { list-style:none; padding:0; font-size:21px; }
.contact-links li { margin-bottom:15px; overflow-wrap:anywhere; }
.message-form { min-width:0; padding:40px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.field { display:flex; flex-direction:column; gap:7px; font-size:15px; }
.field-wide { grid-column:1/-1; }
.field input,.field textarea { display:block; width:100%; padding:13px 15px; border:1px solid #d5d5d5; background:#fff; color:#212121; border-radius:0; line-height:1.5; }
.field textarea { min-height:150px; resize:vertical; }
.field input:invalid:not(:placeholder-shown) { border-color:var(--red); }
.form-verification { display:block; min-height:80px; width:100%; min-width:0; margin:20px 0 12px; overflow:visible; }
.form-status { min-height:1.5em; margin:10px 0 16px; font-size:15px; overflow-wrap:anywhere; }
.form-status[data-state=error] { color:#a01209; }
.contact-section .form-status[data-state=error] { color:#ffb3ac; }
.form-status[data-state=success] { color:#206637; }
.contact-section .form-status[data-state=success] { color:#a6edb9; }
.form-retry { border:1px solid currentColor; border-radius:0; background:transparent; color:inherit; padding:9px 15px; margin:0 12px 10px 0; }
.form-honeypot { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.message-form .button { min-width:120px; }
.message-form .button:disabled { opacity:.65; }
.site-footer { padding:75px 0 0; background:var(--ink); color:#d5d5d5; }
.footer-grid { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:45px; }
.site-footer h2 { font-size:18px; color:white; text-transform:uppercase; }
.site-footer p { font-size:16px; line-height:1.4; }
.site-footer .site-logo img { width:220px; margin-bottom:25px; }
.site-footer ul { list-style:none; padding:0; margin:0; }
.site-footer li { margin-bottom:9px; }
.site-footer a { overflow-wrap:anywhere; }
.footer-contact { font-size:18px; }
.footer-bottom { border-top:1px solid #ffffff18; margin-top:55px; padding:25px 0; text-align:center; font-size:14px; }
.article-section { padding:75px 0; background:#f8f8f8; }
.article-layout { max-width:1050px; margin:auto; }
.article-body { background:white; padding:55px; }
.article-body a { color:var(--red); text-decoration:underline; }
.post-meta { font-size:14px; color:#666; margin-bottom:25px; }
.post-navigation { display:flex; justify-content:space-between; gap:20px; padding:30px 0; }
.comments { padding:45px 0; }
.comment-list,.comment-list ol { list-style:none; padding:0; }
.comment-list .children { margin-left:35px; }
.comment { padding:0; }
.comment-body { padding:28px 0; border-top:1px solid #dfe3e6; }
.comment-meta { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.comment-author { font-size:18px; margin-bottom:8px; }
.comment-author cite { font-style:normal; }
.comment-metadata { display:flex; align-items:center; gap:20px; font-size:13px; color:#666; }
.comment-content { margin-top:20px; }
.comment-text { white-space:pre-wrap; overflow-wrap:anywhere; }
.comment-reply-link { color:var(--red); }
.comment-controls { display:flex; gap:12px; margin:20px 0; }
.comment-controls button,.cancel-reply { color:var(--red); background:transparent; border:1px solid #ccc; padding:9px 15px; }
.comment-form { padding:30px 0; }
.comment-form h3 { margin-bottom:15px; }
.comment-form .field { margin-bottom:18px; }
.consent { display:flex; align-items:flex-start; gap:10px; font-size:14px; }
.consent input { margin:6px 0 0; }
.archive-post { max-width:1000px; background:#fff; padding:50px; margin:auto; }
.archive-post h2 { font-size:35px; }
.archive-post .read-more { display:inline-block; margin-top:10px; color:var(--red); }
.lightbox { padding:0; border:0; color:#fff; background:#101116; width:100vw; height:100dvh; max-width:none; max-height:none; }
.lightbox::backdrop { background:#000e; }
.lightbox-stage { height:100%; width:100%; display:grid; grid-template-rows:1fr auto auto; padding:70px 75px 20px; }
.lightbox-image { height:100%; max-height:calc(100dvh - 160px); width:100%; object-fit:contain; align-self:center; }
.lightbox-caption { text-align:center; min-height:24px; margin:15px 0 0; }
.lightbox-status { text-align:center; margin:0; font-size:13px; color:#ddd; }
.lightbox-control { position:absolute; border:0; color:white; background:#101116a6; padding:12px 16px; font-size:32px; line-height:1; }
.lightbox-close { right:20px; top:16px; font-size:38px; }
.lightbox-previous { left:10px; top:48%; }
.lightbox-next { right:10px; top:48%; }
@media (max-width:1100px) {
 .site-navigation { gap:18px; } .header-phone { display:none; } .site-logo img { width:200px; }
 .split .copy { padding:55px 35px; } .split-full .copy { padding:80px 45px; }
 .contact-grid { gap:20px; } .message-form { padding:30px 15px; }
 .footer-grid { gap:30px; grid-template-columns:1.2fr 1fr 1fr; } .footer-grid>div:first-child { grid-column:1/-1; max-width:650px; }
}
@media (max-width:767px) {
 .container { width:calc(100% - 40px); } body { font-size:16px; } h1 { font-size:38px; } h2 { font-size:30px; }
 .header-main { min-height:100px; gap:15px; } .site-logo img { width:185px; max-height:72px; }
 .menu-toggle { display:block; } .site-navigation { display:none; position:absolute; inset:100px 0 auto; background:var(--ink); padding:15px 30px 25px; }
 .site-navigation.is-open { display:grid; gap:0; } .site-navigation a { padding:12px 0; }
 .hero { padding:150px 0 60px; min-height:280px; } .hero-home { padding:170px 0 70px; }
 .hero-home h1 { font-size:38px; } .hero-home p { font-size:17px; } .eyebrow { font-size:14px; }
 .section { padding:50px 0; } .section-heading { margin-bottom:30px; }
 .split { grid-template-columns:1fr; } .split .copy { padding:45px 25px; } .split .feature-image { min-height:320px; max-height:500px; }
 .split .eyebrow { font-size:14px; } .split h2 { font-size:30px; }
 .cards,.service-band { grid-template-columns:1fr; gap:20px; } .service-card { padding:30px; } .service-tile { min-height:250px; } .service-detail:nth-of-type(even) .feature-figure { order:0; }
 .project-grid { grid-template-columns:1fr 1fr; gap:20px; } .project-card img { height:210px; } .project-card h2 { padding:20px; font-size:21px; }
 .gallery-grid { grid-template-columns:1fr 1fr; gap:12px; } .gallery-grid img { height:220px; }
 .carousel-track a { flex-basis:100%; } .carousel-track img { height:300px; } .carousel-stage { padding:0 28px; }
 .carousel-button { padding:0; font-size:32px; } .banner { padding:70px 0; } .banner h2 { font-size:30px; }
 .contact-grid { grid-template-columns:1fr; gap:10px; padding:35px 0; } .contact-copy { padding:20px 0; }
 .message-form { padding:20px 0; } .form-grid { gap:16px; } .form-grid .field { grid-column:1/-1; }
 .footer-grid { grid-template-columns:1fr 1fr; gap:35px; } .footer-grid>div:first-child { grid-column:1/-1; } .footer-grid>div:last-child { grid-column:1/-1; }
 .site-footer { padding-top:50px; } .footer-bottom { margin-top:35px; }
 .article-body,.archive-post { padding:30px 20px; } .article-section { padding:40px 0; }
 .comment-meta { display:block; } .comment-metadata { flex-wrap:wrap; gap:12px; } .comment-list .children { margin-left:18px; }
 .lightbox-stage { padding:70px 40px 20px; } .lightbox-control { padding:8px; } .lightbox-close { right:10px; }
}
@media (max-width:400px) { .container { width:calc(100% - 30px); } .project-grid { grid-template-columns:1fr; } .gallery-grid img { height:170px; } .footer-grid { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; animation:none!important; } }
