@charset "utf-8";@media (max-width:760px){} @media (max-width:760px){} @media (max-width:760px){} @media (max-width:760px){} .detail-box{width:100%;display:grid !important;grid-template-columns:42% 58%;grid-auto-flow:row;margin-bottom:24px;border:1px solid #d9e6ec;border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 10px 24px rgba(8,63,82,.055);box-sizing:border-box} .detail-box-logo{grid-column:1 / -1;width:100% !important;height:auto !important;float:none !important;clear:both;background:linear-gradient(180deg,#0d6fd3,#084f9f);border-top:1px solid #c9ddf4;border-bottom:2px solid #f07f22;text-shadow:3px 3px 6px rgba(0,0,0,.6);box-sizing:border-box} .detail-box-logo:first-child{border-top:0} .detail-box-logo-text{display:flex;align-items:center;gap:10px;width:auto !important;float:none !important;margin:0;padding:12px 18px;color:#fff;font-size:15px;font-weight:900;box-sizing:border-box} .detail-box-logo-text::before{content:"";width:20px;height:20px;flex:0 0 20px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm0 2v12h16V6H4Zm3 3h10v2H7V9Zm0 4h7v2H7v-2Z'/%3E%3C/svg%3E") center / contain no-repeat;-webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Zm0 2v12h16V6H4Zm3 3h10v2H7V9Zm0 4h7v2H7v-2Z'/%3E%3C/svg%3E") center / contain no-repeat} .detail-box-balken1,.detail-box-balken2,.detail-box-balken1-details,.detail-box-balken2-details{width:auto !important;height:auto !important;min-height:42px;float:none !important;clear:none !important;box-sizing:border-box;border-bottom:1px solid #dbe7f4} .detail-box-balken1,.detail-box-balken2{grid-column:1;border-right:1px solid #c9ddf4;background:#edf5ff} .detail-box-balken1-details,.detail-box-balken2-details{grid-column:2;background:#fff} .detail-box-balken2{background:#eaf3fd} .detail-box-balken2-details{background:#f8fbff} .detail-box-balken1-text,.detail-box-balken2-text{width:auto !important;height:auto !important;float:none !important;margin:0;padding:11px 16px;color:#243a42;font-size:13px;line-height:1.25;font-weight:700;box-sizing:border-box} .detail-box-details-text{width:auto !important;float:none !important;margin:0;padding:11px 16px;color:#0b3e59;font-size:13px;line-height:1.25;font-weight:700;text-align:center;box-sizing:border-box} .detail-box a{color:#0d6fd3;font-weight:900;line-height:inherit} .detail-box a:hover{color:#f07f22} .detail-box .ja-blau,.detail-box .ja-hellblau{width:22px;height:22px;margin:0 auto;border-radius:50%;background:#3f9f2f !important;position:relative;box-shadow:0 2px 6px rgba(63,159,47,.20)} .detail-box .ja-blau::after,.detail-box .ja-hellblau::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:900} .detail-box-balken3,.detail-box-balken3-details{width:auto !important;height:auto !important;min-height:58px;float:none !important;padding:14px;background:#f5f9fd;border-top:2px solid #dbe7f4;box-sizing:border-box} .detail-box-balken3{grid-column:1;border-right:1px solid #c9ddf4} .detail-box-balken3-details{grid-column:2} .detail-box .button2,.detail-box .button3{width:auto !important;height:auto !important;float:none !important;margin:0;padding:0;border:0;background:none;text-align:center} .detail-box .button2 a,.detail-box .button3 a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 18px;border-radius:7px;font-size:13px;font-weight:900;text-decoration:none !important;transition:all .22s ease;margin:0 !important;width:auto !important} .detail-box .button2 a{border:1px solid #0d6fd3;color:#0d6fd3 !important;background:#fff} .detail-box .button2{text-align:left} .detail-box .button3{text-align:center} .detail-box .button3 a{border:1px solid #2d7d22;color:#fff !important;background:linear-gradient(180deg,#3f9f2f,#3f9f2f)} .detail-box .button2 a:hover,.detail-box .button3 a:hover{transform:translateY(-2px);box-shadow:0 7px 16px rgba(0,0,0,.16)} @media (max-width:760px){.detail-box{width:100%;grid-template-columns:1fr} .detail-box-logo,.detail-box-balken1,.detail-box-balken2,.detail-box-balken1-details,.detail-box-balken2-details,.detail-box-balken3,.detail-box-balken3-details{grid-column:1} .detail-box-balken1,.detail-box-balken2,.detail-box-balken3{border-right:0} .detail-box-details-text{text-align:left}} .detail-box-balken1,.detail-box-balken1-details{background:#ffffff} .detail-box-balken2,.detail-box-balken2-details{background:#edf5ff} .typo3-detail-section{padding-top:35px!important} .typo3-detail-content{overflow:hidden} .typo3-detail-section .content-header{margin-bottom:24px} .typo3-detail-section .content-header h1{margin:0;color:#0b2942} .typo3-detail-section .icono-h1{color:#f07f22} .typo3-detail-intro{display:grid;grid-template-columns:70px 1fr;gap:18px;align-items:center;margin:0 0 24px;padding:22px 26px;border:1px solid #dbe8ec;border-left:4px solid #0d6fd3;border-radius:16px;background:linear-gradient(135deg,#fff,#f5faff);box-shadow:0 9px 24px rgba(8,63,82,.055);position:relative} .typo3-detail-intro::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:linear-gradient(90deg,#0d6fd3 0 45%,#3f9f2f 45% 85%,#f07f22 85% 100%);border-radius:0 0 16px 16px} .typo3-detail-icon{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border:1px solid #c9ddf4;border-radius:14px;background:#edf5ff;color:#0d6fd3} .typo3-detail-icon svg{width:28px;height:28px} .typo3-detail-intro span{display:block;margin-bottom:4px;color:#0d6fd3;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em} .typo3-detail-intro h2{margin:0 0 6px;color:#0b3e59;font-size:20px} .typo3-detail-intro p{margin:0;color:#526b7b;font-size:13.5px;line-height:1.55} .detail-box{border:1px solid #d9e6ec!important;border-radius:16px!important;box-shadow:0 9px 24px rgba(8,63,82,.055)!important} .detail-box-logo{background:linear-gradient(135deg,#3f9f2f,#2d7d22)!important;border-top:1px solid #cde4c5!important;border-bottom:2px solid #f07f22!important} .detail-box-logo:first-child{border-top:0!important} .detail-box-balken1,.detail-box-balken1-details{background:#fff!important} .detail-box-balken2,.detail-box-balken2-details{background:#f8fbfc!important} .detail-box-balken1,.detail-box-balken2{border-right:1px solid #d9e6ec!important} .detail-box-balken1,.detail-box-balken2,.detail-box-balken1-details,.detail-box-balken2-details{border-bottom:1px solid #e3ecf0!important} .detail-box-details-text{color:#2d7d22!important} .detail-box a{color:#2f6f26!important} .detail-box a:hover{color:#f07f22!important} .detail-box .ja-blau,.detail-box .ja-hellblau{background:#3f9f2f!important;box-shadow:0 2px 6px rgba(63,159,47,.20)!important} .detail-box-balken3,.detail-box-balken3-details{background:#fafcfd!important;border-top:2px solid #dfe8eb!important} .detail-box-balken3{border-right:1px solid #d9e6ec!important} .detail-box .button2 a{border-color:#3f9f2f!important;color:#2f6f26!important;background:#fff!important} .detail-box .button2 a:hover,.detail-box .button2 a:focus{background:#eef8ea!important;color:#2d7d22!important} .detail-box .button3 a{border-color:#2d7d22!important;background:linear-gradient(135deg,#3f9f2f,#2d7d22)!important;color:#fff!important;box-shadow:0 7px 15px rgba(63,159,47,.14)!important} .detail-box .button3 a:hover,.detail-box .button3 a:focus{background:linear-gradient(135deg,#4caf3a,#348d27)!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 10px 20px rgba(63,159,47,.18)!important} .detail-box .red{color:#d70000!important} @media (max-width:760px){.typo3-detail-section{padding-top:24px!important} .typo3-detail-intro{grid-template-columns:1fr;padding:20px}} .typo3-hosting-section{padding-top:35px!important} .typo3-hosting-content{overflow:hidden} .typo3-hosting-section .content-header{margin-bottom:24px} .typo3-hosting-section .content-header h1{margin:0;color:#0b2942} .typo3-hosting-section .icono-h1{color:#f07f22} .typo3-page{width:100%;max-width:none;margin:0;padding:0;color:#29465d;font-size:14px;line-height:1.55} .typo3-page *{box-sizing:border-box} .typo3-page a{color:#0d6fd3;text-decoration:none} .typo3-page a:hover{color:#f07f22} .typo3-hero{width:100%;aspect-ratio:1240 / 450;min-height:0;margin:0 0 24px;overflow:hidden;border-radius:18px;background-color:#071b35;background-image:url("../images/webhosting/typo3-hosting.webp");background-repeat:no-repeat;background-position:center center;background-size:100% 100%;box-shadow:0 14px 34px rgba(8,63,82,.14)} .typo3-intro{display:grid;grid-template-columns:70px 1fr;gap:18px;align-items:center;margin:0 0 24px;padding:22px 26px;border:1px solid #dbe8ec;border-left:4px solid #0d6fd3;border-radius:16px;background:linear-gradient(135deg,#fff,#f5faff);box-shadow:0 9px 24px rgba(8,63,82,.055)} .typo3-intro .typo3-icon{width:58px;height:58px} .typo3-intro p{margin:0 0 7px} .typo3-intro p:last-child{margin-bottom:0} .typo3-icon{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border:1px solid #c9ddf4;border-radius:14px;background:#edf5ff;color:#0d6fd3} .typo3-icon svg{width:28px;height:28px} .typo3-benefits-card,.typo3-card,.typo3-seo-card,.typo3-link-box,.typo3-package-section{border:1px solid #d9e6ec;border-radius:16px;background:#fff;box-shadow:0 9px 24px rgba(8,63,82,.055)} .typo3-benefits-card{margin-bottom:24px;padding:24px 26px} .typo3-section-title{margin:0 0 18px;text-align:left} .typo3-section-title span{display:inline-flex;align-items:center;gap:9px;color:#0b3e59;font-size:20px;font-weight:800} .typo3-section-title span:before{content:"⚡";color:#f07f22;font-size:18px} .typo3-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} .typo3-benefit{display:grid;grid-template-columns:52px 1fr;gap:13px;align-items:start;padding:18px;border:1px solid #e1eaf0;border-radius:13px;background:#f8fbfd} .typo3-benefit .typo3-icon{width:46px;height:46px;border-radius:12px} .typo3-benefit h3{margin:0 0 5px;color:#0b3e59;font-size:15px} .typo3-benefit p{margin:0;color:#526b7b;font-size:13px;line-height:1.55} .typo3-package-section{margin-bottom:24px;overflow:hidden} .hosting-compare{overflow:hidden} .compare-head,.compare-row,.compare-price-row,.compare-actions{display:grid;grid-template-columns:310px repeat(3,minmax(0,1fr))} .compare-head>div,.compare-row>div,.compare-price-row>div,.compare-actions>div{border-right:1px solid #e2ebef} .compare-head>div:last-child,.compare-row>div:last-child,.compare-price-row>div:last-child,.compare-actions>div:last-child{border-right:0} .compare-head{background:linear-gradient(135deg,#2f9e44,#237a35);color:#fff;border-bottom:2px solid #f07f22} .compare-feature,.compare-plan{display:flex;align-items:center;min-height:50px;padding:13px 16px;font-weight:800} .compare-feature{justify-content:flex-start;font-size:15px} .compare-plan{justify-content:center;font-size:14px;text-align:center} .compare-row{border-bottom:1px solid #e3ecf0} .compare-row:nth-child(even){background:#f8fbfc} .compare-row>div{display:flex;align-items:center;justify-content:center;min-height:46px;padding:12px 15px;text-align:center;font-size:13px;line-height:1.35} .compare-label{justify-content:flex-start!important;text-align:left!important;color:#29465d;font-size:12.5px!important;font-weight:800} .feature-mini-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;min-width:22px;margin-right:8px;border:1px solid #cfe8d5;border-radius:7px;background:#eef8f0;color:#2f9e44} .feature-mini-icon svg{width:14px;height:14px} .compare-eco{color:#1f8f3a;font-weight:900} .setup-row{border-top:2px solid #dfe8eb} .setup-row>div{background:#fbf8f3} .compare-price-row{border-bottom:1px solid #e2ebef;background:#f7fbfb} .compare-price-row>div{display:flex;align-items:center;justify-content:center;min-height:108px;padding:17px 14px;background:linear-gradient(180deg,#fff,#f5fafb)} .price-label{justify-content:flex-start!important;color:#0b3e59!important;font-weight:900!important} .price-box{width:100%;max-width:170px;margin:0 auto;padding:13px 10px;border:1px solid #d7e7ea;border-radius:14px;background:#fff;box-shadow:0 7px 18px rgba(8,63,82,.075)} .price-main{display:flex;align-items:baseline;justify-content:center;gap:4px;color:#0b3e59;white-space:nowrap} .price-value,.price-currency{font-size:24px;font-weight:800;line-height:1} .price-star{margin-left:1px;font-size:20px!important} .compare-actions>div{display:flex;align-items:center;justify-content:center;gap:8px;min-height:78px;padding:13px 10px;background:#fafcfd} .btn-ghost,.btn-primary{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 13px;border-radius:8px;font-size:12px;font-weight:800;white-space:nowrap;text-decoration:none!important;transition:transform .2s ease,box-shadow .2s ease,background .2s ease} .btn-ghost{border:1px solid #cde4c5;background:#fff;color:#2f6f26!important} .btn-primary{border:1px solid #2d7d22;background:linear-gradient(135deg,#3f9f2f,#2d7d22);color:#fff!important;box-shadow:0 6px 14px rgba(63,159,47,.14)} .btn-ghost:hover{background:#eef8ea;color:#2d7d22!important;transform:translateY(-1px)} .btn-primary:hover{filter:brightness(.96);transform:translateY(-1px);box-shadow:0 8px 18px rgba(63,159,47,.14)} .typo3-note{margin:0;padding:14px 18px;color:#718493;font-size:12px} .red{color:#d70000;font-weight:800} .typo3-info-grid{display:grid;grid-template-columns:1fr;margin:0 0 24px} .typo3-card-simple{padding:22px 26px} .typo3-card-line{display:grid;grid-template-columns:58px 1fr auto;gap:6px 18px;align-items:center} .typo3-card-line .typo3-icon{grid-row:1/span 2} .typo3-card-line h3{margin:0;color:#0b3e59;font-size:18px} .typo3-card-line p{margin:0;color:#526b7b;font-size:13.5px} .contact-btn{grid-column:3;grid-row:1/span 2;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 16px;border-radius:8px;background:linear-gradient(180deg,#f48b2c,#d86a15);color:#fff!important;font-size:13px;font-weight:800;white-space:nowrap;transition:.2s ease} .contact-btn:hover{transform:translateY(-2px);box-shadow:0 7px 16px rgba(216,106,21,.22);color:#fff!important} .typo3-seo-card{margin-bottom:24px;padding:24px 26px} .typo3-seo-card h3{margin:0 0 12px;color:#0b3e59;font-size:18px} .typo3-seo-card p{margin:0 0 10px;color:#526b7b;font-size:13.5px} .typo3-seo-card p:last-child{margin-bottom:0} .typo3-link-box{padding:22px 24px} .typo3-link-box h3{margin:0 0 14px;color:#0b3e59;font-size:18px} .related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .related-grid a{display:flex;align-items:center;min-height:44px;padding:10px 13px;border:1px solid #dfe8ed;border-radius:9px;background:#f8fbfc;color:#29465d;font-size:13px;font-weight:800} .related-grid a:hover{border-color:#c9ddf4;background:#f2f7fd;color:#0d6fd3} .typo3-location-link{display:inline-flex!important;align-items:center;gap:6px;font-weight:800} @media (max-width:1100px){.typo3-benefits{grid-template-columns:1fr} .hosting-compare{overflow-x:auto} .compare-head,.compare-row,.compare-price-row,.compare-actions{min-width:900px;grid-template-columns:310px repeat(3,minmax(0,1fr))} .related-grid{grid-template-columns:1fr 1fr}} @media (max-width:700px){.typo3-hosting-section{padding-top:24px!important} .typo3-hero{min-height:0;aspect-ratio:1240 / 450;background-size:100% 100%;border-radius:13px} .typo3-intro{grid-template-columns:1fr;padding:20px} .typo3-card-line{grid-template-columns:1fr;text-align:center} .typo3-card-line .typo3-icon,.typo3-card-line h3,.typo3-card-line p,.typo3-card-line .contact-btn{grid-column:1;grid-row:auto} .typo3-card-line .typo3-icon{margin:0 auto 4px} .related-grid{grid-template-columns:1fr}} .typo3-package-section{--pkg-main:#3f9f2f;--pkg-dark:#2d7d22;--pkg-soft:#eef8ea;--pkg-soft-2:#f8fcf6;--pkg-line:#cde4c5;--pkg-shadow:rgba(63,159,47,.14)} .typo3-package-section .compare-actions>div:not(.platzhalter){display:flex !important;flex-direction:column !important;align-items:stretch !important;justify-content:center !important;gap:10px !important;min-height:128px !important;padding:15px 18px !important;background:linear-gradient(180deg,#fff 0%,var(--pkg-soft-2) 100%) !important;border-right-color:var(--pkg-line) !important} .typo3-package-section .compare-actions .platzhalter{min-height:128px !important;background:#fff !important} .typo3-package-section .compare-actions>div:not(.platzhalter) .btn-ghost{order:1 !important;width:100% !important;height:44px !important;min-height:44px !important;margin:0 !important;padding:9px 14px !important;display:flex !important;align-items:center !important;justify-content:center !important;border:1px solid var(--pkg-main) !important;border-radius:9px !important;background:#fff !important;color:var(--pkg-main) !important;font-size:13px !important;font-weight:900 !important;box-shadow:0 3px 8px rgba(18,27,35,.04) !important} .typo3-package-section .btn-ghost::before{content:"ⓘ";margin-right:7px;font-size:15px} .typo3-package-section .btn-ghost::after{content:" →" !important;margin-left:3px} .typo3-package-section .btn-ghost:hover,.typo3-package-section .btn-ghost:focus-visible{background:var(--pkg-soft) !important;color:var(--pkg-dark) !important;transform:translateY(-1px);box-shadow:0 6px 13px var(--pkg-shadow) !important;text-decoration:none !important} .typo3-package-section .compare-actions>div:not(.platzhalter) .btn-primary{order:2 !important;width:100% !important;height:46px !important;min-height:46px !important;margin:0 !important;padding:10px 14px !important;display:flex !important;align-items:center !important;justify-content:center !important;border:1px solid var(--pkg-dark) !important;border-radius:9px !important;background:linear-gradient(180deg,var(--pkg-main),var(--pkg-dark)) !important;color:#fff !important;font-size:13px !important;font-weight:900 !important;box-shadow:0 7px 15px var(--pkg-shadow) !important} .typo3-package-section .btn-primary::before{content:"🛒";margin-right:7px;font-size:14px} .typo3-package-section .btn-primary:hover,.typo3-package-section .btn-primary:focus-visible{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 10px 20px var(--pkg-shadow) !important} @media (max-width:520px) and (orientation:portrait){.typo3-package-section .compare-actions>div:not(.platzhalter){gap:6px !important;min-height:104px !important;padding:8px 7px !important} .typo3-package-section .compare-actions .platzhalter{min-height:104px !important} .typo3-package-section .compare-actions>div:not(.platzhalter) .btn-ghost,.typo3-package-section .compare-actions>div:not(.platzhalter) .btn-primary{min-height:36px !important;height:36px !important;padding:7px 5px !important;font-size:11px !important} .typo3-package-section .btn-ghost::before,.typo3-package-section .btn-primary::before,.typo3-package-section .btn-ghost::after{display:none !important;content:none !important}} .compare-feature,.compare-feature *,.compare-plan,.compare-plan *,.compare-plan .typo3-plan-link{text-shadow:0 2px 4px rgba(0,0,0,.32) !important} .compare-plan .typo3-plan-link{display:flex;align-items:center;justify-content:center;width:100%;min-height:100%;color:#fff !important;font:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:none !important;transition:opacity .2s ease,text-shadow .2s ease} .compare-plan .typo3-plan-link:hover,.compare-plan .typo3-plan-link:focus-visible{color:#fff !important;opacity:.9;text-decoration:none !important;text-shadow:0 2px 4px rgba(0,0,0,.38) !important}