/* HostingPazarı HP BETA 03.26 — isolated homepage components.
   Loaded AFTER the consolidated legacy bundle so these rules actually apply. */

.hpc-app .hpt326-providers,
.hpc-app .hpt324-why,
.hpc-app .hpt324-home-blog{box-sizing:border-box;width:100%;max-width:100%;min-width:0}
.hpc-app .hpt326-providers{margin:27px 0 20px!important;padding:0 6px!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
.hpc-app .hpt326-section-heading,
.hpc-app .hpt324-section-head{display:flex!important;flex-direction:row!important;align-items:flex-end!important;justify-content:space-between!important;gap:18px!important;min-width:0!important;margin:0 0 15px!important;padding:0!important;background:transparent!important;border:0!important}
.hpc-app .hpt326-section-heading h2,
.hpc-app .hpt324-section-head h2{display:block!important;margin:0!important;color:#0d2144!important;font-size:clamp(18px,1.45vw,22px)!important;line-height:1.35!important;letter-spacing:-.32px!important;font-weight:500!important}
.hpc-app .hpt326-section-heading p,
.hpc-app .hpt324-section-head p{margin:4px 0 0!important;color:#64758e!important;font-size:11px!important;line-height:1.45!important;font-weight:400!important}
.hpc-app .hpt326-section-heading>a,
.hpc-app .hpt324-section-head>a{display:inline-flex!important;align-items:center!important;gap:6px!important;color:#0964df!important;font-size:11px!important;font-weight:700!important;white-space:nowrap!important;text-decoration:none!important}
.hpc-app .hpt326-section-heading>a:hover,
.hpc-app .hpt324-section-head>a:hover{color:#0746b3!important}

/* Exactly six visible cards on wide screens, without a second logo border. */
.hpc-app .hpt326-carousel-row{display:grid!important;grid-template-columns:36px minmax(0,1fr) 36px!important;align-items:center!important;gap:12px!important;min-width:0!important}
.hpc-app .hpt326-carousel-viewport{min-width:0!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;scroll-snap-type:x mandatory;border:0!important;background:transparent!important;outline-offset:3px}
.hpc-app .hpt326-carousel-viewport::-webkit-scrollbar{display:none!important}
.hpc-app .hpt326-carousel-track{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:stretch!important;gap:10px!important;width:100%!important;min-width:0!important}
.hpc-app .hpt326-carousel-item{box-sizing:border-box;flex:0 0 calc((100% - 50px) / 6)!important;min-width:0!important;scroll-snap-align:start}
.hpc-app .hpt326-carousel-item>a{box-sizing:border-box;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;width:100%!important;height:66px!important;min-width:0!important;min-height:0!important;padding:10px 14px!important;text-decoration:none!important;border:1px solid #e2ebf8!important;border-radius:13px!important;background:#fff!important;box-shadow:0 5px 17px rgba(19,51,101,.055)!important;transition:box-shadow .2s,border-color .2s,transform .2s;overflow:hidden!important}
.hpc-app .hpt326-carousel-item>a:hover{box-shadow:0 8px 23px rgba(17,60,140,.085)!important;border-color:#a9cbfb!important;transform:translateY(-1px)}
.hpc-app .hpt326-carousel-item .hpt24-provider-symbol{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;min-width:0!important;max-width:100%!important;height:43px!important;min-height:0!important;max-height:43px!important;flex:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;overflow:hidden!important}
.hpc-app .hpt326-carousel-item .hpt24-provider-symbol img.hpc-company-logo,
.hpc-app .hpt326-carousel-item .hpt24-provider-symbol img{display:block!important;width:100%!important;max-width:100%!important;height:100%!important;max-height:42px!important;min-height:0!important;margin:0!important;padding:0!important;object-fit:contain!important;object-position:center!important;box-shadow:none!important;border:0!important;background:transparent!important}
.hpc-app .hpt326-carousel-item .hpc-logo-fallback{display:grid!important;place-items:center!important;width:52px!important;height:42px!important;flex:0 0 52px!important;background:#eaf3ff!important;color:#0b65db!important;border-radius:10px!important;border:0!important;font-size:18px!important;font-weight:750!important}
.hpc-app .hpt326-carousel-arrow{display:flex!important;align-items:center!important;justify-content:center!important;width:36px!important;height:36px!important;min-width:0!important;min-height:0!important;padding:0!important;border:1px solid #e1e9f6!important;border-radius:50%!important;color:#0b69e4!important;background:#fff!important;box-shadow:0 3px 11px rgba(19,61,132,.1)!important;font-size:13px!important;cursor:pointer;transition:color .2s,box-shadow .2s}
.hpc-app .hpt326-carousel-arrow:hover:not(:disabled){box-shadow:0 5px 15px rgba(19,61,132,.17)!important;color:#004db4!important}
.hpc-app .hpt326-carousel-arrow:disabled{opacity:.4;cursor:default}
.hpc-app .hpt326-carousel-dots{display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;margin:13px 0 0!important;padding:0!important;min-height:9px!important}
.hpc-app .hpt326-carousel-dots>button{display:block!important;width:7px!important;height:7px!important;min-width:7px!important;min-height:7px!important;padding:0!important;margin:0!important;border:0!important;border-radius:999px!important;background:#c5d2e4!important;cursor:pointer}
.hpc-app .hpt326-carousel-dots>button.is-active{background:#096bec!important;width:8px!important;height:8px!important;min-width:8px!important;min-height:8px!important}

/* Four symmetrical benefit cards, as in the supplied screenshot. */
.hpc-app .hpt324-why{display:block!important;margin:22px 0 24px!important;background:transparent!important;border:0!important;box-shadow:none!important}
.hpc-app .hpt324-why-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;width:100%!important;min-width:0!important}
.hpc-app .hpt324-why-card{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;min-width:0!important;min-height:83px!important;margin:0!important;padding:14px 16px!important;background:#fff!important;border:1px solid #e7edf6!important;border-radius:15px!important;box-shadow:0 4px 17px rgba(14,46,93,.04)!important}
.hpc-app .hpt324-why-icon{display:flex!important;align-items:center!important;justify-content:center!important;width:49px!important;height:49px!important;flex:0 0 49px!important;margin:0!important;padding:0!important;border-radius:14px!important;background:#eff5ff!important;color:#116be6!important;font-size:21px!important}
.hpc-app .hpt324-why-card>div{min-width:0!important;flex:1 1 auto!important}
.hpc-app .hpt324-why-card h3{display:block!important;margin:0 0 4px!important;font-size:12.3px!important;font-weight:550!important;line-height:1.28!important;color:#10244b!important}
.hpc-app .hpt324-why-card p{display:block!important;margin:0!important;font-size:10.5px!important;line-height:1.45!important;font-weight:400!important;color:#72839c!important}

/* Four image-led editorial cards. Article image remains native/lazy loaded. */
.hpc-app .hpt324-home-blog{display:block!important;margin:20px 0 28px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.hpc-app .hpt324-home-blog .hpt324-blog-head{margin-bottom:12px!important}
.hpc-app .hpt324-blog-grid{box-sizing:border-box;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;align-items:stretch!important;width:100%!important;min-width:0!important;overflow:visible!important}
.hpc-app .hpt324-blog-card{box-sizing:border-box;display:flex!important;flex-direction:column!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;background:#fff!important;border:1px solid #e4ebf6!important;border-radius:17px!important;overflow:hidden!important;box-shadow:0 5px 16px rgba(18,55,105,.055)!important}
.hpc-app .hpt324-blog-media{position:relative;box-sizing:border-box;display:block!important;width:100%!important;height:auto!important;aspect-ratio:16/8.2!important;min-height:0!important;max-height:none!important;margin:0!important;padding:0!important;overflow:hidden!important;background:#f2f6fc!important;border:0!important;border-radius:16px 16px 0 0!important;text-decoration:none!important}
.hpc-app .hpt324-blog-media>img.hpt326-blog-image{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;position:absolute!important;inset:0!important;object-fit:cover!important;object-position:center!important;border:0!important;border-radius:16px 16px 0 0!important;margin:0!important;padding:0!important}
.hpc-app .hpt324-blog-media>img.hpt326-blog-fallback{object-fit:cover!important;object-position:center!important;background:transparent!important;padding:0!important}
.hpc-app .hpt324-blog-body{box-sizing:border-box;display:flex!important;flex-direction:column!important;flex:1 1 auto!important;gap:8px!important;min-height:94px!important;padding:13px 16px 12px!important;background:#fff!important}
.hpc-app .hpt324-blog-body h3{display:block!important;margin:0!important;padding:0!important;font-size:13.5px!important;font-weight:500!important;line-height:1.48!important;letter-spacing:-.1px!important;min-height:38px!important;color:#14264a!important}
.hpc-app .hpt324-blog-body h3 a{color:#14264a!important;text-decoration:none!important}
.hpc-app .hpt324-blog-body h3 a:hover{color:#075ee6!important}
.hpc-app .hpt324-blog-meta{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;flex-wrap:wrap!important;margin-top:auto!important;color:#7d8da6!important;font-size:9.5px!important;line-height:1.4!important}
.hpc-app .hpt324-blog-meta>time,.hpc-app .hpt324-blog-meta>span{display:inline-flex!important;align-items:center!important;gap:4px!important;min-width:0!important}
.hpc-app .hpt324-blog-meta i{margin:0!important;color:#5476a6!important;font-size:10px!important}

/* Tablets and mobile: compact benefits and swipeable editorial strip. */
@media(max-width:1080px){
 .hpc-app .hpt324-why-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 .hpc-app .hpt324-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .hpc-app .hpt326-carousel-item{flex-basis:calc((100% - 20px) / 3)!important}
}
@media(max-width:700px){
 .hpc-app .hpt326-providers{margin:20px 0 18px!important;padding:0 2px!important}
 .hpc-app .hpt326-section-heading,.hpc-app .hpt324-section-head{align-items:flex-start!important;gap:8px!important;margin-bottom:11px!important}
 .hpc-app .hpt326-section-heading h2,.hpc-app .hpt324-section-head h2{font-size:17px!important}
 .hpc-app .hpt326-section-heading p,.hpc-app .hpt324-section-head p{font-size:10px!important}
 .hpc-app .hpt326-section-heading>a,.hpc-app .hpt324-section-head>a{font-size:9px!important;margin-top:5px!important}
 .hpc-app .hpt326-carousel-row{display:block!important}
 .hpc-app .hpt326-carousel-arrow{display:none!important}
 .hpc-app .hpt326-carousel-item{flex-basis:calc((100% - 10px) / 2)!important}
 .hpc-app .hpt326-carousel-item>a{height:60px!important;min-height:60px!important;padding:8px!important}
 .hpc-app .hpt326-carousel-item .hpt24-provider-symbol{height:39px!important;max-height:39px!important}
 .hpc-app .hpt326-carousel-dots{display:none!important}
 .hpc-app .hpt324-why{margin:22px 0!important}
 .hpc-app .hpt324-why-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
 .hpc-app .hpt324-why-card{padding:11px 9px!important;gap:8px!important;min-height:90px!important;align-items:center!important}
 .hpc-app .hpt324-why-icon{width:33px!important;height:33px!important;flex:0 0 33px!important;border-radius:10px!important;font-size:15px!important}
 .hpc-app .hpt324-why-card h3{font-size:10.4px!important;line-height:1.25!important}
 .hpc-app .hpt324-why-card p{font-size:9.1px!important;line-height:1.38!important}
 .hpc-app .hpt324-home-blog{margin:18px 0 23px!important}
 .hpc-app .hpt324-blog-grid{display:flex!important;flex-flow:row nowrap!important;gap:11px!important;overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding:0 1px 7px!important}
 .hpc-app .hpt324-blog-grid::-webkit-scrollbar{display:none!important}
 .hpc-app .hpt324-blog-card{flex:0 0 min(78vw,290px)!important;width:min(78vw,290px)!important;scroll-snap-align:start}
 .hpc-app .hpt324-blog-body{padding:11px 12px 12px!important}
 .hpc-app .hpt324-blog-body h3{font-size:12px!important;min-height:34px!important}
}
@media(max-width:370px){
 .hpc-app .hpt324-why-grid{grid-template-columns:1fr 1fr!important;gap:7px!important}
 .hpc-app .hpt324-why-card{min-height:86px!important;gap:6px!important;padding:9px 7px!important}
 .hpc-app .hpt324-why-icon{width:29px!important;height:29px!important;flex-basis:29px!important;font-size:14px!important}
 .hpc-app .hpt324-why-card h3{font-size:9.5px!important}
 .hpc-app .hpt324-why-card p{font-size:8.5px!important}
}
/* Dark mode: use the existing theme's palette without hiding logos. */
html[data-hpt-theme="dark"] .hpc-app :is(.hpt326-section-heading h2,.hpt324-section-head h2,.hpt324-why-card h3,.hpt324-blog-body h3 a){color:#f3f7ff!important}
html[data-hpt-theme="dark"] .hpc-app :is(.hpt326-section-heading p,.hpt324-section-head p,.hpt324-why-card p,.hpt324-blog-meta){color:#bbcee8!important}
html[data-hpt-theme="dark"] .hpc-app :is(.hpt324-why-card,.hpt324-blog-card,.hpt324-blog-body){background:#14253e!important;border-color:#345173!important}
html[data-hpt-theme="dark"] .hpc-app .hpt326-carousel-item>a{background:#fff!important;border-color:#dce5f3!important}
html[data-hpt-theme="dark"] .hpc-app .hpt326-carousel-arrow{background:#182d49!important;border-color:#365573!important;color:#a5c9ff!important}
@media(prefers-reduced-motion:reduce){.hpc-app .hpt326-carousel-viewport{scroll-behavior:auto}}

/* HP BETA 03.27 — lighter editorial typography and edge-to-edge rounded covers */
.hpc-app .hpt324-blog-body h3>a{font-weight:500!important;letter-spacing:0!important}
.hpc-app .hpt324-blog-card .hpt324-blog-media{overflow:hidden!important;border-radius:16px 16px 0 0!important}
.hpc-app .hpt324-blog-card .hpt324-blog-media>img{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;border:0!important;object-fit:cover!important;object-position:center!important;border-radius:16px 16px 0 0!important}
.hpc-app .hpt324-blog-card .hpt324-blog-media>img.hpt326-blog-image,
.hpc-app .hpt324-blog-card .hpt324-blog-media>img.hpt326-blog-fallback{border-radius:16px 16px 0 0!important}