.hosting-hero{padding:26px 0 50px;background:linear-gradient(120deg,#f0f9fe 0%,#f8fcfd 58%,#eff8f1 100%);overflow:hidden}.hosting-hero .breadcrumb{margin-bottom:46px}.hosting-hero-grid{display:grid;grid-template-columns:1.17fr 1fr;gap:48px;align-items:center}.hosting-hero h1{font-size:57px;line-height:1.12;letter-spacing:-2px}.hosting-intro{max-width:560px;font-size:18px;line-height:1.75;color:var(--text)}.hosting-actions{display:flex;gap:25px;align-items:center;margin-top:27px;flex-wrap:wrap}.hosting-advice{font-size:14px;font-weight:600;display:flex;gap:12px;align-items:center}.hosting-advice:hover{color:var(--blue)}.hosting-hero-points{padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:10px 20px;font-size:12px;color:#4a6471;margin:28px 0 0}.hosting-hero-points li:before{content:'✓';color:#72a427;margin-right:7px;font-weight:700}.hosting-illustration{position:relative;height:366px;isolation:isolate}.hosting-orbit{position:absolute;inset:10px -20px 0 30px;border:1px solid #c7eaf5;border-radius:50%;transform:rotate(-25deg);background:radial-gradient(ellipse,#e1f2ef55,transparent 70%);z-index:-1}.hosting-orbit:before{content:'';position:absolute;inset:25px;border:1px dashed #b7e4f2;border-radius:50%}.hosting-browser{position:absolute;left:30px;right:20px;top:45px;border:1px solid #d4e7ef;border-radius:14px;background:white;box-shadow:0 25px 55px #274d6512;transform:rotate(-4deg);overflow:hidden}.hosting-browser-bar{background:#f6fafc;border-bottom:1px solid #e6eff3;padding:13px 15px;display:flex;align-items:center;gap:5px}.hosting-browser-bar i{width:6px;height:6px;border-radius:50%;background:#b9d8e4}.hosting-browser-bar i:first-child{background:#a3d755}.hosting-browser-bar span{font-size:10px;color:#67818e;margin-left:16px}.hosting-browser-content{padding:23px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.hosting-site-mark{width:36px;height:7px;background:linear-gradient(90deg,var(--blue),var(--green));border-radius:3px;grid-column:1/-1}.hosting-site-lines{padding-top:18px}.hosting-site-lines b{display:block;background:#dcecf2;height:10px;border-radius:3px;margin-bottom:10px}.hosting-site-lines b:last-child{width:68%;background:#d9eeb9}.hosting-site-image{height:100px;background:linear-gradient(135deg,#e5f4fb,#e3f3e9);border-radius:10px;display:grid;place-items:center}.hosting-site-image svg{width:95px;height:95px;fill:none;stroke:#39b6dc;stroke-width:1.2}.hosting-site-blocks{grid-column:1/-1;display:flex;gap:10px}.hosting-site-blocks i{height:32px;flex:1;border-radius:5px;background:#f0f6f8}.hosting-label{position:absolute;border:1px solid #cfedf7;background:white;padding:14px 17px;border-radius:12px;box-shadow:0 8px 24px #274d650d;display:flex;align-items:center;gap:12px}.hosting-label svg{width:28px;height:28px;fill:none;stroke:#229abf;stroke-width:1.5}.hosting-label strong{display:block;font-size:13px;font-weight:650}.hosting-label small{display:block;font-size:10px;color:#6d8190;margin-top:2px}.domain-label{top:15px;right:0}.support-label{bottom:32px;left:0}.hosting-art-caption{position:absolute;bottom:0;right:0;font-size:12px;color:#648b80}.hosting-section-nav{border-bottom:1px solid #e5edf2;background:#fff}.hosting-section-nav>.container{display:flex;gap:35px;overflow-x:auto}.hosting-section-nav a{font-size:13px;font-weight:600;padding:19px 0;white-space:nowrap;color:#5f7280}.hosting-section-nav a:hover{color:var(--blue)}.hosting-section-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:end;margin-bottom:35px}.hosting-section-heading h2{font-size:37px;line-height:1.2;margin:0;letter-spacing:-1px}.hosting-section-heading>p{margin:0;max-width:440px;font-size:16px}.hosting-option-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.hosting-option{border:1px solid #dfe9ed;padding:27px;border-radius:16px;display:flex;flex-direction:column;background:white}.hosting-option-featured{border-color:#75bad5;background:linear-gradient(155deg,#f0faff,white 60%);box-shadow:0 8px 28px #2c849c0a}.hosting-option-number{text-transform:uppercase;letter-spacing:1.2px;font-size:10px;font-weight:700;color:#5e7e8a}.hosting-option-icon{width:34px;height:34px;stroke:var(--blue);stroke-width:1.4;fill:none;margin:26px 0 18px}.hosting-option h3{font-size:24px;margin:0 0 12px;letter-spacing:-.5px}.hosting-option>p{margin:0;font-size:15px}.hosting-option ul{list-style:none;padding:23px 0 20px;margin:0;display:grid;gap:13px;font-size:14px;color:#506a78}.hosting-option li{padding-left:22px;position:relative}.hosting-option li:before{content:'✓';position:absolute;left:0;color:#7ab029}.hosting-option-bottom{margin-top:auto;padding-top:18px;border-top:1px solid #e6eef1}.hosting-option-bottom>span{display:block;font-size:12px;color:#6b7d87;margin-bottom:14px}.hosting-option-bottom .button{width:100%;padding:12px 10px;font-size:13px;gap:10px}.hosting-options-note{font-size:13px;text-align:center;margin:24px auto 0;max-width:740px}.hosting-foundation{background:#f5f9fb}.hosting-foundation-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:38px}.hosting-foundation-grid svg{width:32px;height:32px;fill:none;stroke:#229dc2;stroke-width:1.5}.hosting-foundation-grid h3{font-size:20px;margin:16px 0 10px}.hosting-foundation-grid p{font-size:15px;margin:0}.hosting-agreement{display:grid;grid-template-columns:1fr 1.6fr;gap:35px;border-top:1px solid #dae8ed;padding-top:25px;margin-top:35px;font-size:14px}.hosting-agreement strong{font-weight:600;max-width:300px}.hosting-agreement p{margin:0}.hosting-migration{display:grid;grid-template-columns:1fr 1.15fr;gap:90px;align-items:center}.hosting-migration h2{font-size:36px;line-height:1.2;letter-spacing:-1px}.hosting-migration h2 span{color:#2198bd}.hosting-migration>div>p:not(.eyebrow){max-width:420px}.hosting-migration .text-link{margin-top:10px;display:inline-block}.hosting-migration-steps{list-style:none;padding:0;margin:0;display:grid;gap:23px}.hosting-migration-steps li{display:flex;gap:23px;align-items:start}.hosting-migration-steps li>span{font-size:15px;color:#1f90b2;background:#edf7f3;display:grid;place-items:center;flex:none;width:43px;height:43px;border-radius:50%;margin-top:2px}.hosting-migration-steps h3{font-size:19px;margin:0 0 6px}.hosting-migration-steps p{font-size:15px;margin:0}.hosting-faq{display:grid;grid-template-columns:.8fr 1.4fr;gap:80px}.hosting-faq h2{font-size:36px;line-height:1.2;letter-spacing:-1px}.hosting-faq>div>p{max-width:300px}.hosting-faq .faq-list{margin-top:0}.hosting-faq summary{font-size:16px}.hosting-faq .faq-list p{font-size:15px}.hosting-final{margin-top:50px;margin-bottom:60px}.hosting-page :is(summary,a):focus-visible{outline:3px solid var(--blue);outline-offset:5px}.hosting-page section[id]{scroll-margin-top:25px}
@media(max-width:1050px){.hosting-hero-grid{gap:25px;grid-template-columns:1.15fr 1fr}.hosting-hero h1{font-size:48px}.hosting-illustration{height:340px}.hosting-browser{left:15px;right:10px}.hosting-label{padding:12px}.hosting-label strong{font-size:11px}.hosting-label small{font-size:9px}.hosting-option{padding:22px}.hosting-option h3{font-size:22px}.hosting-section-heading{gap:40px}.hosting-migration{gap:45px}.hosting-faq{gap:40px}}
@media(max-width:760px){.hosting-hero{padding:22px 0 32px}.hosting-hero .breadcrumb{margin-bottom:32px}.hosting-hero-grid{grid-template-columns:1fr;gap:30px}.hosting-hero h1{font-size:clamp(35px,8.1vw,55px);letter-spacing:-1.5px}.hosting-intro{font-size:16px}.hosting-actions{gap:20px;margin-top:22px}.hosting-actions .button{font-size:13px;padding:13px 18px}.hosting-hero-points{font-size:11px;gap:9px 16px}.hosting-illustration{width:min(440px,100%);height:315px;margin:auto}.hosting-browser{left:25px;right:20px;top:35px}.hosting-browser-content{padding:18px;gap:12px}.hosting-site-image{height:85px}.hosting-label strong{font-size:11px}.hosting-label small{font-size:9px}.support-label{bottom:32px}.domain-label{top:6px}.hosting-section-nav>.container{gap:24px}.hosting-section-nav a{font-size:12px;padding:16px 0}.hosting-section-heading,.hosting-option-grid,.hosting-foundation-grid,.hosting-agreement,.hosting-migration,.hosting-faq{grid-template-columns:1fr}.hosting-section-heading{gap:18px;margin-bottom:27px}.hosting-section-heading h2,.hosting-migration h2,.hosting-faq h2{font-size:31px}.hosting-option-grid{gap:18px}.hosting-option{padding:26px}.hosting-option-icon{margin:20px 0 15px}.hosting-option h3{font-size:25px}.hosting-option-bottom .button{font-size:14px}.hosting-options-note{text-align:left;font-size:12px}.hosting-foundation-grid{gap:28px}.hosting-agreement{gap:12px;margin-top:28px}.hosting-agreement strong{max-width:none}.hosting-migration{gap:30px}.hosting-migration-steps li{gap:17px}.hosting-faq{gap:28px}.hosting-final{margin-top:30px;margin-bottom:35px}}

.hosting-option .hosting-price{display:flex;align-items:baseline;gap:9px;margin:4px 0 0;color:var(--ink)}.hosting-price strong{font-size:43px;font-weight:650;line-height:1.2;letter-spacing:-1.5px}.hosting-price span{font-size:14px;color:var(--text)}.hosting-option-featured .hosting-option-number{color:#19728d}.hosting-option .hosting-option-bottom>.button{margin-bottom:0}

/* Hostingpakketten: prijzen en knoppen op gelijke hoogte, label Aanbevolen, gedeelde opslag */
.hosting-option{position:relative}
.hosting-option-head .hosting-option-icon{margin:0 0 18px}
.hosting-option-for{margin:0;font-size:15px;color:var(--text)}
.hosting-option .hosting-price{margin:18px 0 0}
.hosting-option .hosting-badge{position:absolute;top:24px;right:24px;margin:0;padding:4px 11px;border-radius:999px;background:#e4f3fa;border:1px solid #aedff2;color:#005a7d;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.hosting-features .hosting-storage{display:grid;gap:3px;padding:12px 14px 12px 38px;margin:0 0 4px;border-radius:12px;background:#f2f8fb;color:var(--ink)}
.hosting-features .hosting-storage:before{left:15px;top:12px}
.hosting-features .hosting-storage small{font-size:12px;color:#556b78}
.hosting-option-featured .button{background:#0c81af;box-shadow:0 5px 12px #1f739c2b}
.hosting-option-featured .button:hover{background:#09719a}
@supports (grid-template-rows:subgrid){
 .hosting-option-grid{grid-template-rows:repeat(4,auto)}
 .hosting-option{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0}
 .hosting-option-bottom{align-self:end}
}
