/* Shared Zee-Way brand shell for the i-max blog. */
:root { --zw-ink: #252525; --zw-muted: #686868; --zw-rule: #e9e9e9; --zw-yellow: #fdd700; --zw-pink: #ee5586; }
.zw-blog { background: #fff; color: var(--zw-ink); font-family: Inter, "Open Sans", Arial, sans-serif; }
.zw-shell { width: min(100% - 48px, 1284px); margin: 0 auto; }
.zw-skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 3000; background: #fff; padding: .75rem 1rem; color: #111; }
.zw-skip-link:focus { top: 1rem; }
.zw-site-header { min-height: 0; background: #fff; box-shadow: none; z-index: 1100; }
.zw-utility-bar { background: #eef1f7; color: #252525; font-size: 12px; line-height: 1; }
.zw-utility-bar__inner { min-height: 39px; display: flex; align-items: center; justify-content: flex-end; gap: 1rem; }
.zw-utility-bar a { color: #252525; text-decoration: none; }
.zw-utility-bar__links { display: flex; align-items: center; gap: 1.15rem; }
.zw-utility-icon { color: #6d747d !important; font-size: 15px; }
.zw-navigation-wrap { border-bottom: 1px solid var(--zw-rule); background: #fff; }
.zw-navigation { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.zw-brand { display: block; width: 216px; flex: 0 0 auto; line-height: 0; }
.zw-brand img { display: block; width: 100%; height: auto; }
.zw-primary-navigation { display: flex; align-items: center; justify-content: flex-end; gap: .25rem; }
.zw-nav-group { position: relative; }
.zw-nav-group summary, .zw-nav-link { display: block; color: var(--zw-ink); cursor: pointer; font-size: 14px; font-weight: 400; line-height: 76px; padding: 0 1rem; text-decoration: none; white-space: nowrap; }
.zw-nav-group summary { list-style: none; }
.zw-nav-group summary::-webkit-details-marker { display: none; }
.zw-nav-group summary::after { display: none; }
.zw-nav-group[open] > summary, .zw-nav-group summary:hover, .zw-nav-link:hover { color: var(--zw-pink); }
.zw-nav-panel { position: absolute; top: 67px; right: 0; z-index: 1200; min-width: 310px; padding: .8rem; background: #fff; border-top: 3px solid var(--zw-pink); box-shadow: 0 15px 35px rgba(0, 0, 0, .12); }
.zw-nav-panel a { display: block; padding: .7rem .8rem; color: var(--zw-ink); text-decoration: none; line-height: 1.3; }
.zw-nav-panel a:hover { background: #f5f5f5; color: var(--zw-pink); }
.zw-nav-panel strong, .zw-nav-panel b { display: block; font-size: 14px; }
.zw-nav-panel span { display: block; margin-top: .2rem; color: var(--zw-muted); font-size: 12px; }
.zw-nav-panel--hosting { display: grid; grid-template-columns: repeat(2, minmax(190px, 1fr)); min-width: 500px; }
.zw-nav-panel--services { display: grid; grid-template-columns: repeat(3, minmax(165px, 1fr)); gap: .8rem; min-width: 610px; padding: 1.25rem; }
.zw-nav-panel--services b { border-bottom: 1px solid var(--zw-rule); color: #6a6a6a; padding: 0 .8rem .5rem; }
.zw-nav-panel--services a { font-size: 13px; }
.zw-client-area { margin-left: .75rem; background: var(--zw-yellow); box-shadow: 0 6px 12px rgba(209, 172, 0, .2); color: #1f1f1f; font-size: 11px; font-weight: 800; padding: .65rem .95rem; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.zw-client-area:hover { background: #f3c900; color: #111; }
.zw-menu-toggle { display: none; background: transparent; border: 0; padding: .5rem; }
.zw-menu-toggle > span:not(.screen-reader-text) { display: block; width: 25px; height: 2px; margin: 5px; background: var(--zw-ink); }
.zw-page-title { background: linear-gradient(135deg, #282828 0%, #404040 100%); color: #fff; padding: 3.4rem 0; }
.zw-page-title p { margin: 0 0 .45rem; color: var(--zw-yellow); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.zw-page-title h1 { margin: 0; color: #fff; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.12; }
.zw-site-footer { margin-top: 5rem; background: #282828; color: #c7c7c7; text-align: left; }
.zw-footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; padding: 3.75rem 0 3.25rem; }
.zw-site-footer .zw-footer-grid h2 { margin: 0 0 1.15rem; color: #fff !important; font-size: 15px; font-weight: 800; }
.zw-footer-grid ul { list-style: none; margin: 0; padding: 0; }
.zw-footer-grid li { margin: 0 0 .72rem; }
.zw-site-footer .zw-footer-grid a { color: #c7c7c7 !important; font-size: 13px; text-decoration: none; }
.zw-site-footer .zw-footer-grid a:hover { color: #fff !important; }
.zw-footer-brand { text-align: right; }
.zw-footer-brand img { display: inline-block; width: min(100%, 220px); height: auto; }
.zw-footer-brand p { margin: 1.2rem 0 .8rem; color: #c7c7c7 !important; font-size: 12px; line-height: 1.6; }
.zw-social-links { display: flex; justify-content: flex-end; gap: .5rem; }
.zw-site-footer .zw-social-links a { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid #777; border-radius: 50%; color: #fff !important; font-weight: 800; }
.zw-site-footer .zw-social-links a:hover { border-color: #fff; color: #fff !important; }
@media (max-width: 1000px) { .zw-navigation { min-height: 74px; } .zw-brand { width: 185px; } .zw-menu-toggle { display: block; } .zw-primary-navigation { display: none; position: absolute; top: 113px; left: 0; right: 0; padding: .75rem 24px 1rem; background: #fff; border-bottom: 1px solid var(--zw-rule); box-shadow: 0 12px 18px rgba(0,0,0,.08); } .zw-primary-navigation.is-open { display: block; } .zw-nav-group summary, .zw-nav-link { line-height: 1.3; padding: .9rem 0; } .zw-nav-panel, .zw-nav-panel--hosting, .zw-nav-panel--services { position: static; display: block; min-width: 0; box-shadow: none; border: 0; padding: .2rem 0 .65rem; } .zw-nav-panel--services > div { margin-bottom: .75rem; } .zw-nav-panel a { padding: .45rem .75rem; } .zw-client-area { display: inline-block; margin: .75rem 0 0; } .zw-footer-grid { grid-template-columns: repeat(2, 1fr); } .zw-footer-brand { text-align: left; } .zw-social-links { justify-content: flex-start; } }
@media (max-width: 600px) { .zw-shell { width: min(100% - 32px, 1284px); } .zw-utility-icon { display: none; } .zw-utility-bar__inner { min-height: 35px; } .zw-navigation { min-height: 66px; } .zw-brand { width: 160px; } .zw-primary-navigation { top: 101px; padding-left: 16px; padding-right: 16px; } .zw-page-title { padding: 2.5rem 0; } .zw-site-footer { margin-top: 3rem; } .zw-footer-grid { grid-template-columns: 1fr; gap: 1.75rem; padding: 2.75rem 0; } }
