/* Optional visual layer. Claude's templates, copy, prices and styles stay intact. */
.modern-home { --nx-paper:#f8fcfd; --nx-soft:#eef5f7; --accent:#08786d; --accent-dark:#075e57; }
.modern-home #home {
  position:relative;
  background:radial-gradient(ellipse at 85% 28%,#c1eadd 0,transparent 48%),radial-gradient(ellipse at 8% 90%,#d9eaf8 0,transparent 46%),#f8fcfd;
}
.modern-home #home::before {
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.3;
  background-image:radial-gradient(#08786d55 .8px,transparent .8px);
  background-size:24px 24px;
  mask-image:linear-gradient(120deg,transparent 25%,#000);
}
.modern-home .modern-hero { position:relative; z-index:1; }
.modern-home .hero-title span { position:relative; display:inline-block; color:#08786d; }
.modern-home .hero-title span::after {
  content:''; position:absolute; left:0; bottom:-9px; width:100%; height:12px;
  border-top:4px solid #40b7ac; border-radius:50%; transform:rotate(-2deg);
}
.modern-home .eyebrow { color:#075e57; }
.modern-home .eyebrow span { box-shadow:0 0 0 5px #08786d12; }
.modern-home .hero-showcase { box-shadow:0 28px 60px #164e3826; border-color:#a9c9be; transform:rotate(1.5deg); transition:transform .45s ease; }
.modern-home .hero-showcase:hover { transform:rotate(0); }
.modern-home .showcase-top { background:#edf5ee; }
.modern-home .showcase-note { background:#c7efe8; color:#17443f; border:1px solid #8ed1c8; box-shadow:4px 5px 0 #183f3412; transform:rotate(-5deg); }
.modern-home .showcase-note span { display:inline-block; color:#08786d; }
.modern-home .promo-banner { background:#163e37; }
.modern-home .promo-text,.modern-home .promo-cta,.modern-home .promo-close { color:#e4f7f3; }
.modern-home .promo-cta { border-color:#91c8c3; }
.modern-home .offer-cta,.modern-home .btn-submit { box-shadow:0 5px 0 #064e48; transition:transform .2s,box-shadow .2s,background .2s; }
.modern-home .offer-cta:hover,.modern-home .btn-submit:hover { transform:translateY(-2px); box-shadow:0 7px 0 #064e48; }
.modern-home .offer-cta:active,.modern-home .btn-submit:active { transform:translateY(3px); box-shadow:0 2px 0 #064e48; }
.modern-home .nx-kicker { display:flex; align-items:center; gap:10px; }
.modern-home .nx-kicker::before { content:''; width:22px; height:2px; background:currentColor; }
.modern-home .nx-pillar { border-color:#d6e3e6; box-shadow:0 5px 0 #e0eaed; }
.modern-home .nx-pillar:nth-child(1) .nx-icon { background:#dbf0e6; }
.modern-home .nx-pillar:nth-child(2) .nx-icon { background:#daedf8; color:#275f85; }
.modern-home .nx-pillar:nth-child(3) .nx-icon { background:#dcefed; color:#28766d; }
.modern-home .nx-pillar:hover { transform:translateY(-6px); box-shadow:0 12px 0 #e0eaed; }
.modern-home .nx-icon svg { transition:transform .3s; }
.modern-home .nx-pillar:hover .nx-icon svg { transform:rotate(-9deg) scale(1.1); }
.modern-home #project.nx-dark { background:radial-gradient(ellipse at 95% 100%,#27685a 0,transparent 65%),#16372f; }
.modern-home .nx-browserbar i:nth-child(1) { background:#80afce; }
.modern-home .nx-browserbar i:nth-child(2) { background:#68c4bc; }
.modern-home .nx-browserbar i:nth-child(3) { background:#9cd6c9; }
.modern-home .single-offer { background:#f8fcfd; border:1px solid #c6dcda; box-shadow:8px 8px 0 #dbeae8; }
.modern-home .offer-badge { background:#c7efe8; color:#17443f; border-color:#8ed1c8; transform:rotate(-3deg); }
.modern-home .offer-plan { transition:transform .25s,box-shadow .25s; }
.modern-home .offer-plan-featured { background:linear-gradient(135deg,#e6f4ec,#f7fcf7); }
.modern-home .offer-plan:hover { transform:translateY(-4px); box-shadow:0 12px 24px #17382d0d; }
.modern-home .style-example .device-stage { background:#deeeea; }
.modern-home .style-example:nth-child(2) .device-stage { background:#deedf8; }
.modern-home .style-example:nth-child(3) .device-stage { background:#dcefee; }
.modern-home .nx-step-num { width:44px; height:44px; border-radius:14px; background:#deeeea; transform:rotate(-7deg); }
.modern-home .nx-step:nth-child(even) .nx-step-num { background:#daedf8; transform:rotate(5deg); }
.modern-home .nx-step::before { width:35%; background:#08786d; }
.modern-home #faq { background:#edf4f8; }
.modern-home .faq-item.open { background:#f8fcfd; border-radius:12px; padding:0 16px; }
.modern-home #contact { background:radial-gradient(ellipse at 0 100%,#cde9dc,transparent 60%),#f8fcfd; }
.modern-home .contact-form-wrap { border-color:#c6d7c8; box-shadow:8px 8px 0 #dcebe8; }
.modern-home :is(a,button,input,select,textarea):focus-visible { outline:3px solid #146d9a; outline-offset:5px; }
/* One short entrance, never continuous motion. Content remains visible without JS. */
@keyframes nateo-arrive { from { opacity:.55; translate:0 18px; } to { opacity:1; translate:0 0; } }
@media (prefers-reduced-motion:no-preference) {
  .modern-home .creative-arrive { animation:nateo-arrive .65s both; }
}
@media (max-width:768px) {
  .modern-home .hero-showcase { transform:none; }
  .modern-home .single-offer,.modern-home .contact-form-wrap { box-shadow:4px 5px 0 #dbeae8; }
  .modern-home .hero-title span::after { bottom:-8px; border-top-width:3px; }
}
@media (prefers-reduced-motion:reduce) {
  .modern-home .hero-showcase,.modern-home .nx-pillar:hover,.modern-home .offer-plan:hover { transform:none; }
}

/* Creative details and interactive idea board, October 8. */
.modern-home .nt-brand-strip { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:22px 40px; padding:26px 24px; background:#d8efe9; border-block:1px solid #b9dbd3; color:#174c45; font-size:16px; font-weight:600; letter-spacing:.2px; }
.nt-brand-strip [aria-hidden] { color:#24998c; font-size:27px; line-height:1; }
.modern-home .nt-studio { background:#123b3c; color:#f4fffc; position:relative; overflow:hidden; }
.nt-studio::before { content:''; position:absolute; width:650px; height:650px; right:-200px; top:-270px; border:1px solid #ffffff18; border-radius:50%; box-shadow:0 0 0 70px #ffffff04,0 0 0 140px #ffffff03; pointer-events:none; }
.modern-home .nt-studio > .section-content { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:80px; position:relative; }
.modern-home .nt-studio .section-title { color:#f3fffb; }
.modern-home .nt-studio .nx-kicker { color:#81d8cd; }
.modern-home .nt-studio .nx-lead { color:#c5dfdd; font-size:18px; }
.nt-choices { display:grid; gap:12px; margin-top:30px; }
.nt-choices button { font:inherit; font-weight:600; display:flex; align-items:center; justify-content:space-between; gap:14px; text-align:left; color:#dcefed; border:1px solid #618985; background:#ffffff05; padding:16px 20px; border-radius:12px; cursor:pointer; transition:background .2s,translate .2s; }
.nt-choices button:hover { background:#ffffff10; translate:4px 0; }
.nt-choices button[aria-pressed=true] { background:#c6f0e5; color:#123b3c; border-color:#c6f0e5; }
.nt-idea-board { background:#fbfffe; color:#172d43; border-radius:22px; padding:24px; transform:rotate(1deg); box-shadow:12px 16px 0 #061f2840; }
.nt-board-top { display:flex; justify-content:space-between; align-items:center; font-size:10px; letter-spacing:1.5px; font-weight:700; margin-bottom:20px; }
.nt-board-top > span:last-child { font-size:30px; color:#218f83; }
.nt-status-dot { display:inline-block; width:7px; height:7px; background:#258779; border-radius:50%; margin-right:6px; }
.nt-wireframe { background:#e2f1ed; padding:18px; border:1px solid #b9d6ce; border-radius:12px; transition:background .3s; }
.nt-wire-nav { display:flex; align-items:center; gap:8px; border-bottom:1px solid #a5c9be; padding-bottom:12px; }
.nt-wire-nav b { font-size:13px; margin-right:auto; }
.nt-wire-nav i { width:16px; height:3px; background:#7faaa4; border-radius:4px; }
.nt-wire-body { display:grid; grid-template-columns:1.4fr 1fr; gap:12px; align-items:center; padding:22px 0; }
.nt-wire-label { display:block; color:#24675e; font-size:7px; font-weight:700; letter-spacing:1px; margin-bottom:8px; }
.nt-wire-body strong { display:block; font-size:clamp(19px,2vw,28px); line-height:1.12; letter-spacing:-1px; }
.nt-wire-button { display:inline-block; padding:7px 9px; background:#1b655d; color:#fff; border-radius:5px; font-size:8px; margin-top:14px; }
.nt-wire-art { position:relative; aspect-ratio:1; border-radius:50% 50% 8% 50%; background:#74c2b4; overflow:hidden; }
.nt-wire-art span { position:absolute; width:75%; height:75%; border:1px solid #e5fff4; border-radius:50%; right:-10%; top:10%; }
.nt-wire-art span:nth-child(2) { right:15%; top:35%; background:#135b5d; border:none; }
.nt-wire-art span:nth-child(3) { right:45%; top:-25%; background:#c2e8db; border:none; }
.nt-wire-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.nt-wire-cards i { height:20px; background:#f8fffc; border:1px solid #bad7ce; border-radius:4px; }
.nt-idea-board[data-idea=werk] .nt-wireframe { background:#dbeaf5; }
.nt-idea-board[data-idea=werk] .nt-wire-art { border-radius:8px; background:#6bacc8; }
.nt-idea-board[data-idea=aanvragen] .nt-wire-art { border-radius:20% 50%; background:#489b98; }
.nt-idea-result { margin-top:22px; min-height:154px; }
.nt-idea-label { display:block; font-size:11px; color:#177769; font-weight:700; letter-spacing:1px; text-transform:uppercase; }
.nt-idea-result h3 { font-size:25px; letter-spacing:-.6px; text-transform:none; font-weight:700; margin:7px 0; }
.nt-idea-result p { font-size:16px; line-height:1.6; color:#526579; margin:0; }
.nt-idea-cta { display:flex; align-items:center; justify-content:space-between; font-weight:700; color:#0b6d61; border-top:1px solid #c8deda; padding-top:16px; text-decoration:none; }
.nt-idea-cta:hover { color:#133951; }
.nt-board-caption { display:block; font-size:11px; line-height:1.5; color:#617770; margin-top:14px; }
.modern-home .nx-step { padding:28px 22px; background:#f0f7f6; border:1px solid #c9dfda; border-radius:18px; }
.modern-home .nx-step::before { top:40px; left:auto; right:-25px; width:24px; height:1px; }
.modern-home .nx-step:last-child::before { display:none; }
.modern-home .nx-step:nth-child(even) { background:#eaf2f9; }
.modern-home #contact .nx-contact-info { position:relative; padding-top:20px; }
.modern-home #contact .nx-contact-info::before { content:'↗'; display:grid; place-items:center; width:66px; height:66px; margin-bottom:24px; font-size:44px; line-height:1; color:#12695f; background:#ccece4; border:1px solid #9dccbf; border-radius:20px; transform:rotate(-9deg); }
.modern-home .nx-contact-list li { position:relative; padding-left:23px; }
.modern-home .nx-contact-list li::before { content:''; position:absolute; width:7px; height:7px; top:23px; left:0; background:#258a7d; border-radius:50%; }
.modern-home .styles-title::before { content:''; display:inline-block; width:22px; height:22px; margin-right:13px; vertical-align:baseline; border:5px solid #54b6aa; border-radius:5px; transform:rotate(12deg); }
@media(max-width:960px) {
 .modern-home .nt-studio > .section-content { grid-template-columns:1fr; gap:40px; }
 .nt-idea-board { max-width:600px; width:100%; margin:auto; transform:none; }
 .modern-home .nx-step::before { display:none; }
}
@media(max-width:560px) {
 .modern-home .nt-brand-strip { display:grid; grid-template-columns:1fr 1fr; gap:12px 18px; text-align:center; font-size:13px; }
 .nt-brand-strip [aria-hidden] { display:none; }
 .nt-idea-board { padding:20px; box-shadow:5px 7px 0 #061f2840; }
 .nt-idea-result { min-height:180px; }
 .nt-wireframe { padding:12px; }
 .nt-wire-body { gap:8px; }
 .nt-wire-body strong { font-size:21px; }
 .nt-board-top { font-size:9px; letter-spacing:1px; }
}
@media(prefers-reduced-motion:reduce) { .nt-choices button:hover { translate:none; } }