@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700;800;900&display=swap');
/* ShopForge — monochrome digital architecture, September 2026. */
:root{--sf-paper:#090909;--sf-ink:#fff;--sf-orange:#ff9d24;--sf-line:#30343b}
.sf-modern{color:#f3f5f7!important;background:#090909!important}
.sf-modern .forge{background:radial-gradient(ellipse at 80% 35%,#151515 0,transparent 52%),#090909}
.sf-modern .topbar{border-color:#ffffff25}
.sf-modern .nav a{color:#b9bec7;font-family:'IBM Plex Mono',monospace;text-transform:uppercase;font-size:10px;letter-spacing:.06em}
.sf-modern .nav a:hover,.sf-modern footer a:hover{color:#fff}
.sf-modern .nav a[href="#contact"]{border-radius:0;border-color:#666e79}
.sf-modern h1{font-family:'Big Shoulders Display','IBM Plex Sans',sans-serif!important;font-size:clamp(58px,6.7vw,94px);text-transform:uppercase;letter-spacing:-.025em;font-weight:700;line-height:.98}
.sf-modern h1 .hot{color:#ff9d24}
.sf-modern .hero .eyebrow{color:#c0c6cf}
.sf-dot{border-radius:0;transform:rotate(45deg);background:white;box-shadow:0 0 12px #ffffff80}
.sf-modern .lede{color:#adb4bf}
.sf-modern .btn{border-radius:0;font-family:'IBM Plex Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.035em;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.sf-modern .btn-hot{background:#f6f8fa;border-color:#f6f8fa;color:#090909}
.sf-modern .btn-hot:hover{background:#cdd5e1;border-color:#cdd5e1;color:#090909}
.sf-modern .btn-ghost{border-color:#59616d;color:#e7ecf3}
.sf-modern .btn-ghost:hover{background:#20252d}
.sf-visual{border-radius:0;border:1px solid #6a727b;clip-path:polygon(26px 0,100% 0,100% calc(100% - 26px),calc(100% - 26px) 100%,0 100%,0 26px)}
.sf-visual:after{inset:40% 0 0;background:linear-gradient(transparent,#030507ed)}
.sf-visual strong{color:#fff;letter-spacing:-.02em}
.sf-visual small{color:#b2bac4}
.sf-edition{border-radius:0;background:#080b0dcc;letter-spacing:.12em}
.sf-modern .strip{background:#0d0d0d;border-top:1px solid #343a43;border-bottom:1px solid #343a43;color:white}
.sf-strip-label,.sf-modern .stat .l{color:#98a2b1}
.sf-strip-label b,.sf-modern .stat .n{color:#f2f5fa}
.sf-modern .stat{border-color:#3b424c}
.sf-modern .stat .n{font-family:'IBM Plex Mono',monospace;font-size:20px;letter-spacing:-.04em}
.sf-modern section{background:#090909}
.sf-modern .sec-head h2,.sf-modern .close h2{font-family:'Big Shoulders Display','IBM Plex Sans',sans-serif!important;font-weight:600;letter-spacing:-.01em;text-transform:uppercase}
.sf-modern .sec-head>.eyebrow,.sf-modern #groei .eyebrow,.sf-modern .close .eyebrow{color:#c9d0da}
.sf-modern .sec-head>.eyebrow:before,.sf-modern .close .eyebrow:before{content:'//';color:#788594}
.sf-modern .sec-head>p:not(.eyebrow){color:#aab2bf}
.sf-modern .stage,.sf-modern .card{background:linear-gradient(135deg,#151515,#0d0d0d);border:1px solid #454545;border-radius:0;--heat:#fff!important}
.sf-modern .stage:before,.sf-modern .card:before{background:#c8d1df!important;box-shadow:none}
.sf-modern .temp,.sf-modern .card .k{color:#d2dbe7}
.sf-modern .stage h3>span{color:#939fac}
.sf-modern .stage p,.sf-modern .card p{color:#aab4c1}
.sf-modern .stage ul{border-color:#343c46}
.sf-modern .stage li{color:#d1d7df}
.sf-modern .stage li:before{color:#fff}
.sf-modern #groei{background:#111111;border-top:1px solid #303030;border-bottom:1px solid #303030}
.sf-modern .growth{border-radius:0;border-color:#353535}
.sf-modern .cell+.cell{border-color:#353535}
.sf-modern .cell li{color:#c0c8d3}
.sf-modern .cell svg path{stroke:#fff}
.sf-modern .card:nth-child(2){background:linear-gradient(135deg,#181818,#111111);border-color:#ff9d24}
.sf-modern .price{color:#e0e7ef}
.sf-card-link{color:#f7f9fc;border-color:#3d4653;font-family:'IBM Plex Mono',monospace;font-size:11px}
.sf-card-link:hover{color:#c4d0df}
.sf-modern details,.sf-modern details:last-child{border-color:#353535}
.sf-modern summary{color:#f1f4f9}
.sf-modern summary:after{color:#c8d1dc}
.sf-modern details p{color:#acb6c4}
.sf-modern .close{background:radial-gradient(ellipse at 80% 80%,#191919,transparent 60%),#101010;margin-top:70px;border-top:1px solid #3b3b3b;border-bottom:1px solid #3b3b3b}
.sf-modern .close h2{color:#fff;letter-spacing:-.01em}
.sf-modern .close h2 span{color:#ffad32}
.sf-modern .close p:not(.eyebrow),.sf-email{color:#b7c1cf}
.sf-modern footer{background:#080808;color:#99a5b4}
.sf-modern footer a{color:#e2e8f0}
@media(max-width:1050px){.sf-modern h1{font-size:65px}.sf-modern .nav{gap:12px}.sf-modern .nav a{font-size:9px}}
@media(max-width:760px){.sf-modern h1{font-size:clamp(54px,13vw,76px)}.sf-modern .nav{column-gap:10px}.sf-modern .nav a{font-size:9px}.sf-modern .hero-grid{gap:36px}.sf-modern .sf-visual{aspect-ratio:1.05}.sf-modern .stat .n{font-size:19px}.sf-modern .close{margin-top:50px}.sf-modern .close h2{font-size:47px}.sf-modern .btn{font-size:10px}}

/* Approved fire + amber direction. */

.sf-modern .forge{background:#090909;isolation:isolate}
.sf-modern .forge>.wrap{position:relative}
.sf-modern .topbar{position:relative;z-index:3;border-color:#ffffff15;min-height:100px}
.sf-modern .sf-logo{width:260px;height:78px;mix-blend-mode:screen}
.sf-modern .nav a{color:#ccc;font-family:'IBM Plex Sans',sans-serif;font-size:12px;text-transform:none}
.sf-modern .nav a:hover,.sf-modern .nav a[hreflang]:hover{color:#ffb52e}
.sf-modern .nav a[href="#contact"]{border-color:#ff9d2480}
.sf-modern .hero{padding:105px 0 115px;position:relative}
.sf-modern .hero-grid{display:block;min-height:430px}
.sf-modern .hero-grid>div:first-child{position:relative;z-index:2;max-width:680px;width:60%}
.sf-modern h1{font-family:'Orbitron','IBM Plex Sans',sans-serif!important;font-size:clamp(48px,5.2vw,74px);font-weight:900;line-height:1.13;letter-spacing:-.045em;text-transform:uppercase;margin-bottom:24px;overflow-wrap:normal}
.sf-modern h1 .hot{background:linear-gradient(180deg,#ffc53e,#ff6316);background-clip:text;-webkit-background-clip:text;color:transparent;display:inline-block;font-size:1.2em}
.sf-modern .hero .eyebrow{color:#dedede;letter-spacing:.23em;font-size:10px}
.sf-dot{width:35px;height:2px;transform:none;box-shadow:0 0 12px #ff990080;background:#ffb52e}
.sf-modern .lede{color:#bcbcbc;font-size:18px;line-height:1.7;max-width:560px;text-shadow:0 2px 12px #000}
.sf-modern .cta-row{gap:15px}
.sf-modern .btn{min-height:57px;padding:15px 22px;letter-spacing:.06em;font-size:11px;font-weight:600}
.sf-modern .btn-hot{background:linear-gradient(135deg,#ffad23,#ff641b);border-color:#ffb52e;color:#080808;filter:drop-shadow(0 0 10px #ff7b1825)}
.sf-modern .btn-hot:hover{background:#ffc044;border-color:#ffc044;color:#080808}
.sf-modern .btn-ghost{border-color:#ffae33;color:white;background:#09090990}
.sf-modern .btn-ghost:hover{background:#252525}
.sf-modern .sf-visual{position:absolute;inset:-100px -54px -25px;z-index:0;aspect-ratio:auto;clip-path:none;border:0;background:#090909;pointer-events:none}
.sf-visual>img{object-fit:cover;object-position:right center;opacity:.95}
.sf-visual:after{inset:0;background:linear-gradient(90deg,#090909 0%,#090909c9 25%,transparent 63%),linear-gradient(0deg,#090909,transparent 12%)}
.sf-visual figcaption,.sf-edition{display:none}
.sf-modern .strip{background:#090909;border-top:1px solid #ffab3270;border-bottom:1px solid #ffffff15;position:relative}
.sf-modern .stat{border-color:#ffab3240}
.sf-modern .stat .n{font-family:'Orbitron',sans-serif;font-size:18px;color:#f4f4f4;text-transform:uppercase;letter-spacing:.025em}
.sf-modern .stat .l,.sf-strip-label{color:#aaa}.sf-strip-label b{color:#eee}
.sf-modern section{background:#090909}
.sf-modern .sec-head h2,.sf-modern .close h2{font-family:'Orbitron','IBM Plex Sans',sans-serif!important;font-weight:800;font-size:clamp(28px,3vw,40px);line-height:1.3;letter-spacing:-.035em}
.sf-modern #diensten .sec-head{display:block}.sf-modern #diensten .sec-head h2{max-width:none}.sf-modern #diensten .sec-head h2 br{display:none}
.sf-modern #diensten .eyebrow{margin-bottom:18px}
.sf-modern .sec-head>.eyebrow,.sf-modern #groei .eyebrow,.sf-modern .close .eyebrow,.sf-modern .temp,.sf-modern .card .k{color:#ffb52e}
.sf-modern .sec-head>.eyebrow:before,.sf-modern .close .eyebrow:before{color:#ff921c}
.sf-modern .stage,.sf-modern .card{--heat:#ffb52e!important;background:linear-gradient(145deg,#141414,#0b0b0b)}
.sf-modern .stage:before{background:#ffad32!important}
.sf-modern .stage h3>span{color:#b5b5b5}.sf-modern .stage p,.sf-modern .card p,.sf-modern .sec-head>p:not(.eyebrow){color:#b8b8b8}
.sf-modern .stage li:before{color:#ffad32}.sf-modern .stage li,.sf-modern .cell li{color:#ccc}
.sf-modern .cards{gap:24px}
.sf-modern .card{position:relative;padding:22px 25px 26px;border-color:#555;clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.sf-modern .card:before{content:'';display:block;position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1.35;flex-shrink:0;background-image:url('shopforge-fire-services.png')!important;background-size:300% 100%!important;background-position:left center!important;background-color:#090909!important;margin:0 0 22px;box-shadow:none;transform:none;opacity:1}
.sf-modern .card:nth-child(2):before{background-position:center center!important}.sf-modern .card:nth-child(3):before{background-position:right center!important}
.sf-modern .card:nth-child(2){background:linear-gradient(145deg,#171717,#0c0c0c);border-color:#ffae3380}
.sf-modern .card .k{font-family:'Orbitron',sans-serif;font-size:23px;font-weight:800;letter-spacing:0;margin-bottom:8px;color:#fff}
.sf-modern .card h3{font-size:19px;font-weight:500;letter-spacing:-.02em;color:#bbb;margin-bottom:18px}
.sf-modern .price{color:#d7d7d7}.sf-card-link{color:#ffb52e;border-color:#383838}.sf-card-link:hover{color:#fff}.sf-card-link span{font-size:22px}
.sf-modern .cell svg path{stroke:#ffb52e}
.sf-modern summary:after{color:#ffb52e}.sf-modern details p{color:#bbb}
.sf-modern .close{background:#101010;border-color:#ffab3250}
.sf-modern .close h2 span{color:#ffa42b}.sf-modern .close p:not(.eyebrow),.sf-email{color:#bbb}
.sf-modern footer{color:#999}.sf-modern footer a{color:#ddd}
@media(min-width:1500px){.sf-modern .hero{padding:110px 0 120px}}
@media(max-width:1050px){.sf-modern .sf-logo{width:200px;height:65px}.sf-modern .nav{gap:13px}.sf-modern .nav a{font-size:10px}.sf-modern .hero{padding:85px 0}.sf-modern h1{font-size:48px}.sf-modern .hero-grid>div:first-child{width:63%}.sf-modern .sf-visual{left:-32px;right:-32px}.sf-modern .lede{font-size:16px}.sf-modern .btn{font-size:10px;padding:14px 17px}.sf-modern .cards{gap:16px}.sf-modern .card{padding:18px}}
@media(max-width:760px){.sf-modern .topbar{padding-bottom:20px;gap:8px}.sf-modern .sf-logo{width:220px;height:65px}.sf-modern .nav{column-gap:12px}.sf-modern .nav a{font-size:10px}.sf-modern .hero{padding:55px 0 0}.sf-modern .hero-grid{min-height:0;display:flex;flex-direction:column;gap:0}.sf-modern .hero-grid>div:first-child{width:100%;max-width:none}.sf-modern h1{font-size:clamp(29px,7.6vw,53px);line-height:1.18;letter-spacing:-.04em}.sf-modern h1 .hot{font-size:1.2em}.sf-modern .hero .eyebrow{font-size:8px;letter-spacing:.14em}.sf-modern .lede{font-size:16px;line-height:1.65}.sf-modern .cta-row{gap:12px}.sf-modern .btn{font-size:9px;min-height:51px;padding:13px 15px;gap:12px}.sf-modern .sf-visual{position:relative;inset:auto;margin:0 -23px;width:calc(100% + 46px);height:350px;flex-shrink:0}.sf-visual>img{object-position:right center}.sf-visual:after{background:linear-gradient(180deg,#090909,transparent 22%,transparent 86%,#090909)}.sf-modern .stat .n{font-size:15px}.sf-modern .sec-head h2,.sf-modern .close h2{font-size:29px}.sf-modern .card{padding:22px}.sf-modern .card:before{aspect-ratio:1.5}.sf-modern .card .k{font-size:25px}.sf-modern .close h2{font-size:29px}.sf-modern .strip>.wrap{gap:22px 12px}}

/* Neutral legacy surfaces and clear heading line breaks. */
.sf-modern .strip>.wrap,.sf-modern .stat{background:transparent}
.sf-modern #diensten .sec-head h2 br{display:block}
.sf-modern .sf-logo{filter:contrast(1.4)}
.sf-modern .sec-head h2,.sf-modern .close h2{overflow-wrap:anywhere}

/* SEO and Ads shared panel: override inherited brown split surface. */
.sf-modern #groei .split{background:#181818}

/* Neutral background between process cards. */
.sf-modern .stages{background:transparent}

/* Full-width section introductions aligned to the two-column panels. */
.sf-modern #werkwijze .sec-head,.sf-modern #groei .sec-head{width:100%;max-width:none;grid-template-columns:minmax(0,1fr);gap:20px}
.sf-modern #werkwijze .sec-head h2,.sf-modern #groei .sec-head h2,.sf-modern #werkwijze .sec-head>p:not(.eyebrow),.sf-modern #groei .sec-head>p:not(.eyebrow){width:100%;max-width:none}
