/* ============================================================ Kidora Chrome — Header + Footer (logo palette) Blue #0878f9 · Yellow #ffbd19 · Coral #f43f5e · Teal #18b7a4 Fonts load once from page (no CSS @import — faster FCP) ============================================================ */ /* ---------- Top bar ---------- */ .home-top, .topbar{ height:36px!important; border:0!important; background:linear-gradient(90deg,#0460d4 0%,#0F76F5 50%,#12B39B 100%)!important; color:#fff!important; font-size:10.5px!important; font-weight:700!important; letter-spacing:.04em; box-shadow:none; position:relative; overflow:hidden; } .home-top::after{display:none!important;content:none!important;animation:none!important} .home-top .home-shell{ height:100%; display:flex; align-items:center; gap:28px; position:relative; z-index:1; } .home-top .home-shell > span{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; opacity:.96; text-shadow:none; } .home-top-right{ margin-left:auto; display:flex; align-items:center; gap:12px; } .home-top-right a{ color:#fff!important; text-decoration:none!important; font-weight:800!important; padding:4px 12px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22); transition:background .2s ease, transform .2s ease; } .home-top-right a:hover{ background:rgba(255,255,255,.26); transform:translateY(-1px); } .home-top-right i{ width:1px;height:14px; border:0!important; background:rgba(255,255,255,.3)!important; } /* ---------- Header ---------- */ .site-chrome{ position:fixed!important; top:0!important; left:0!important; right:0!important; width:100%!important; z-index:500!important; background:#fff!important; box-shadow:0 8px 24px rgba(7,24,47,.08); } .home-header, header.home-header{ height:84px!important; position:relative!important; top:auto!important; z-index:1; background:#fff!important; backdrop-filter:none; -webkit-backdrop-filter:none; border-bottom:1px solid rgba(15,118,245,.1)!important; box-shadow:none!important; } .site-chrome .home-header, .site-chrome header.home-header{ position:relative!important; top:auto!important; z-index:1; } body{ padding-top:118px!important; } @media(max-width:1100px){ body{padding-top:106px!important} } @media(max-width:767px){ body{padding-top:96px!important} } .home-header::after{ content:""; position:absolute;left:0;right:0;bottom:0;height:3px; background:linear-gradient(90deg,#0F76F5 0%,#FFB61C 34%,#EF4B5E 66%,#12B39B 100%); background-size:100% 100%; animation:none; } .home-nav{ height:100%; display:flex; align-items:center; gap:8px; } .brand{ display:flex; flex-direction:column; align-items:center; justify-content:center; width:168px!important; flex:none; text-decoration:none!important; transition:opacity .2s ease; background:transparent!important; box-shadow:none!important; filter:none!important; } .brand:hover{opacity:.92} @media(min-width:1101px){ .brand:hover{transform:none} } .brand img, .home-header .brand img, .home-footer .brand img, .home-footer .footer-dynamic-logo, .footer-brand, .footer-brand img{ filter:none!important; box-shadow:none!important; background:transparent!important; } .brand img{ width:100%!important; height:58px!important; object-fit:contain!important; filter:none!important; box-shadow:none!important; } .brand b{ font-family:'Plus Jakarta Sans',sans-serif!important; font-size:34px!important; line-height:1!important; letter-spacing:-.04em!important; font-weight:800!important; filter:none!important; } .brand small{ font-family:'DM Sans',sans-serif!important; font-size:10px!important; font-weight:700!important; color:#0F76F5!important; letter-spacing:.04em; filter:none!important; } /* ---------- Nav links ---------- */ .home-links{ display:flex!important; align-items:stretch!important; height:100%!important; gap:8px!important; margin-left:48px!important; font-family:'Plus Jakarta Sans','DM Sans',sans-serif; } .home-links > a, .home-links .nav-item > a{ position:relative; display:inline-flex!important; align-items:center!important; height:100%!important; padding:0 12px!important; font-size:13px!important; font-weight:900!important; letter-spacing:.05em!important; color:#07182f!important; text-decoration:none!important; transition:color .2s ease; } .home-links > a::after, .home-links .nav-item > a::after{ content:""!important; position:absolute!important; left:12px;right:12px;bottom:14px; height:3px!important; border-radius:999px!important; background:linear-gradient(90deg,#0878f9,#18b7a4,#ffbd19)!important; transform:scaleX(0); transform-origin:left; transition:transform .22s ease; opacity:1!important; } .home-links > a:hover, .home-links .nav-item > a:hover, .home-links > a.active, .home-links .nav-item.active > a{ color:#0878f9!important; } .home-links > a:hover::after, .home-links .nav-item > a:hover::after, .home-links > a.active::after, .home-links .nav-item.active > a::after{ transform:scaleX(1); } .nav-dropdown{ display:none; position:absolute; top:calc(100% - 6px); left:50%; transform:translateX(-50%); min-width:200px; padding:10px!important; border:1.5px solid rgba(8,120,249,.16)!important; border-radius:16px!important; background:#fff!important; box-shadow:0 18px 40px rgba(8,120,249,.18)!important; z-index:130; } .nav-dropdown a{ display:block!important; padding:11px 14px!important; border-radius:10px!important; color:#0b1f3a!important; font-size:12.5px!important; font-weight:900!important; letter-spacing:.04em; } .nav-dropdown a:hover{ background:linear-gradient(135deg,#e8f3ff,#e7faf6)!important; color:#0878f9!important; } .nav-item:hover > .nav-dropdown, .nav-item.open > .nav-dropdown, .nav-item:focus-within > .nav-dropdown{display:block} /* ---------- Header actions ---------- */ .home-actions{ margin-left:auto; display:flex; align-items:center; gap:10px; } .home-actions button, .home-actions > a{ width:42px!important; height:42px!important; display:grid!important; place-items:center!important; border:1.5px solid rgba(8,120,249,.14)!important; border-radius:14px!important; background:#fff!important; color:#0b1f3a!important; box-shadow:0 8px 18px rgba(8,120,249,.1)!important; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease!important; text-decoration:none!important; position:relative; } .home-actions button:hover, .home-actions > a:hover{ transform:translateY(-2px)!important; border-color:rgba(8,120,249,.35)!important; background:linear-gradient(145deg,#eef6ff,#e8fbf7)!important; color:#0878f9!important; box-shadow:0 12px 24px rgba(8,120,249,.18)!important; } .home-actions .header-searchbox, .home-actions button.header-searchbox, .home-actions button.header-searchbox[aria-label="Search"]{ width:42px!important; min-width:42px!important; height:42px!important; padding:0!important; display:grid!important; place-items:center!important; justify-content:center!important; gap:0!important; border-radius:14px!important; border:1.5px solid rgba(8,120,249,.14)!important; background:#fff!important; box-shadow:0 8px 18px rgba(8,120,249,.1)!important; font-family:'DM Sans',sans-serif; color:#0b1f3a!important; font-size:18px!important; line-height:1!important; filter:none!important; } .home-actions .header-searchbox .hs-icon, .home-actions button.header-searchbox[aria-label="Search"] .hs-icon{ width:auto!important;height:auto!important;display:block!important; margin:0!important; padding:0!important; flex:none!important; order:0!important; border-radius:0!important; background:transparent!important; color:inherit!important; font-size:18px!important; line-height:1!important; box-shadow:none!important; transform:rotate(-45deg)!important; } .home-actions .header-searchbox .hs-text{display:none!important} .home-actions .header-searchbox:hover, .home-actions button.header-searchbox[aria-label="Search"]:hover{ border-color:rgba(8,120,249,.35)!important; background:linear-gradient(145deg,#eef6ff,#e8fbf7)!important; color:#0878f9!important; transform:translateY(-2px)!important; filter:none!important; box-shadow:0 12px 24px rgba(8,120,249,.18)!important; } .cart-count{ position:absolute!important; top:-4px!important;right:-4px!important; min-width:18px;height:18px; padding:0 5px; display:grid;place-items:center; border-radius:999px!important; background:linear-gradient(135deg,#f43f5e,#ff6b81)!important; border:2px solid #fff!important; color:#fff!important; font-size:10px!important; font-weight:800!important; box-shadow:0 4px 10px rgba(244,63,94,.4)!important; } .home-menu{ display:none; width:42px;height:42px; border:1.5px solid rgba(8,120,249,.18); border-radius:12px; background:linear-gradient(135deg,#0878f9,#18b7a4); color:#fff; font-size:18px; box-shadow:0 8px 18px rgba(8,120,249,.28); cursor:pointer; } /* ---------- Footer ---------- */ .home-footer{ position:relative; margin-top:36px; padding:56px 0 0!important; color:#e8f1ff!important; border:0!important; background: linear-gradient(180deg,rgba(15,118,245,.1),transparent 30%), linear-gradient(145deg,#071527 0%,#0a2748 52%,#0a4a56 100%)!important; overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.05); } .home-footer::before{ content:""; position:absolute;left:0;right:0;top:0;height:3px; background:linear-gradient(90deg,#0F76F5,#FFB61C,#EF4B5E,#12B39B); background-size:100% 100%; animation:none; } .home-footer .footer-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1.45fr repeat(4,minmax(0,1fr)); gap:32px; padding-bottom:40px; } .home-footer .footer-brand{ width:200px!important; height:auto!important; min-height:0!important; margin-bottom:14px; filter:none!important; box-shadow:none!important; background:transparent!important; position:relative!important; } .home-footer .footer-dynamic-logo{ display:block; width:100%; max-width:200px; height:auto; max-height:72px; object-fit:contain; object-position:left center; filter:none!important; box-shadow:none!important; background:transparent!important; } .home-footer .footer-brand b{ font-family:'Plus Jakarta Sans',sans-serif!important; font-size:36px!important; filter:none!important; } .home-footer .footer-brand small{ color:#9fd8ff!important; } .home-footer .footer-grid > div > p{ margin:0 0 10px; color:#b7c9de!important; font-size:13px; line-height:1.75; font-weight:500; max-width:280px; } .home-footer .footer-grid h4{ margin:0 0 16px!important; padding-bottom:10px!important; font-family:'Plus Jakarta Sans',sans-serif!important; font-size:12px!important; font-weight:800!important; letter-spacing:.12em!important; color:#FFB61C!important; text-transform:uppercase; border-bottom:1px solid rgba(255,182,28,.22); } .home-footer .footer-grid > div > a:not(.brand){ display:block!important; margin:0 0 11px!important; color:#c9d8ea!important; font-size:13px!important; font-weight:600!important; text-decoration:none!important; transition:color .2s ease, transform .2s ease, padding-left .2s ease; } .home-footer .footer-grid > div > a:not(.brand):hover{ color:#fff!important; transform:translateX(4px); padding-left:2px; } .home-footer .footer-social{ display:flex!important; flex-wrap:nowrap!important; gap:7px!important; margin-top:16px!important; max-width:none!important; width:max-content!important; align-items:center!important; justify-content:flex-start!important; } .home-footer .footer-social a{ width:30px!important; height:30px!important; min-width:30px!important; display:grid!important; place-items:center!important; border-radius:9px!important; border:0!important; background:#1877f2!important; color:#fff!important; font-size:0!important; line-height:0!important; text-decoration:none!important; box-shadow:0 5px 12px rgba(0,0,0,.18)!important; transition:transform .2s ease, filter .2s ease, box-shadow .2s ease!important; position:relative!important; overflow:hidden!important; flex:0 0 30px!important; } .home-footer .footer-social a::before{ content:""!important; display:block!important; width:14px!important; height:14px!important; background:#fff!important; position:absolute!important; left:50%!important; top:50%!important; transform:translate(-50%,-50%)!important; margin:0!important; mask-repeat:no-repeat!important; mask-position:center!important; mask-size:contain!important; -webkit-mask-repeat:no-repeat!important; -webkit-mask-position:center!important; -webkit-mask-size:contain!important; } .home-footer .footer-social a[aria-label="Facebook"]{ background:#1877f2!important; } .home-footer .footer-social a[aria-label="Facebook"]::before{ mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 8h3V4h-3c-3.3 0-5 2-5 5v2H6v4h3v9h4v-9h3.2l.8-4h-4V9c0-.7.3-1 1-1Z'/%3E%3C/svg%3E")!important; -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 8h3V4h-3c-3.3 0-5 2-5 5v2H6v4h3v9h4v-9h3.2l.8-4h-4V9c0-.7.3-1 1-1Z'/%3E%3C/svg%3E")!important; } .home-footer .footer-social a[aria-label="Instagram"]{ background:linear-gradient(45deg,#f58529,#dd2a7b 45%,#8134af 75%,#515bd4)!important; } .home-footer .footer-social a[aria-label="Instagram"]::before{ mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5Zm0 3a2 2 0 0 0-2 2v10c0 1.1.9 2 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2H7Zm5 3a4 4 0 1 1 0 8 4 4 0 0 1 0-8Zm0 2.2a1.8 1.8 0 1 0 0 3.6 1.8 1.8 0 0 0 0-3.6ZM17.5 6.5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z'/%3E%3C/svg%3E")!important; -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5Zm0 3a2 2 0 0 0-2 2v10c0 1.1.9 2 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2H7Zm5 3a4 4 0 1 1 0 8 4 4 0 0 1 0-8Zm0 2.2a1.8 1.8 0 1 0 0 3.6 1.8 1.8 0 0 0 0-3.6ZM17.5 6.5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z'/%3E%3C/svg%3E")!important; } .home-footer .footer-social a[aria-label="YouTube"]{ background:#ff0000!important; } .home-footer .footer-social a[aria-label="YouTube"]::before{ width:16px!important;height:16px!important; mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M23 7.2a3 3 0 0 0-2.1-2.1C19 4.5 12 4.5 12 4.5s-7 0-8.9.6A3 3 0 0 0 1 7.2 31 31 0 0 0 .5 12 31 31 0 0 0 1 16.8a3 3 0 0 0 2.1 2.1c1.9.6 8.9.6 8.9.6s7 0 8.9-.6a3 3 0 0 0 2.1-2.1 31 31 0 0 0 .5-4.8 31 31 0 0 0-.5-4.8ZM9.7 15.5v-7l6 3.5-6 3.5Z'/%3E%3C/svg%3E")!important; -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M23 7.2a3 3 0 0 0-2.1-2.1C19 4.5 12 4.5 12 4.5s-7 0-8.9.6A3 3 0 0 0 1 7.2 31 31 0 0 0 .5 12 31 31 0 0 0 1 16.8a3 3 0 0 0 2.1 2.1c1.9.6 8.9.6 8.9.6s7 0 8.9-.6a3 3 0 0 0 2.1-2.1 31 31 0 0 0 .5-4.8 31 31 0 0 0-.5-4.8ZM9.7 15.5v-7l6 3.5-6 3.5Z'/%3E%3C/svg%3E")!important; } .home-footer .footer-social a[aria-label="LinkedIn"]{ background:#0a66c2!important; } .home-footer .footer-social a[aria-label="LinkedIn"]::before{ mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5ZM2 10h4v12H2V10Zm6.5 0h3.8v1.7h.1c.5-1 1.8-2.2 3.8-2.2 4.1 0 4.8 2.7 4.8 6.2V22h-4v-5.6c0-1.3 0-3.1-1.9-3.1s-2.2 1.5-2.2 3V22h-4V10Z'/%3E%3C/svg%3E")!important; -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5ZM2 10h4v12H2V10Zm6.5 0h3.8v1.7h.1c.5-1 1.8-2.2 3.8-2.2 4.1 0 4.8 2.7 4.8 6.2V22h-4v-5.6c0-1.3 0-3.1-1.9-3.1s-2.2 1.5-2.2 3V22h-4V10Z'/%3E%3C/svg%3E")!important; } .home-footer .footer-social a[aria-label="Google+"]{ background:#db4437!important; } .home-footer .footer-social a[aria-label="Google+"]::before{ content:"G+"!important; width:auto!important;height:auto!important; background:transparent!important; color:#fff!important; font:800 10px/1 Arial,sans-serif!important; mask-image:none!important; -webkit-mask-image:none!important; } .home-footer .footer-social a[aria-label="TikTok"]{ background:#111111!important; } .home-footer .footer-social a[aria-label="TikTok"]::before{ mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M15 2h3c.3 2.6 1.8 4.2 4 4.5v3a9 9 0 0 1-4-1.2V16a7 7 0 1 1-7-7h1v3.2a4 4 0 1 0 3 3.8V2Z'/%3E%3C/svg%3E")!important; -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M15 2h3c.3 2.6 1.8 4.2 4 4.5v3a9 9 0 0 1-4-1.2V16a7 7 0 1 1-7-7h1v3.2a4 4 0 1 0 3 3.8V2Z'/%3E%3C/svg%3E")!important; } .home-footer .footer-social a[aria-label="Pinterest"]{ background:#e60023!important; } .home-footer .footer-social a[aria-label="Pinterest"]::before{ mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 0 0-3.6 19.3c-.1-1.7 0-3.7.4-5.5l1.3-5.4s-.3-.8-.3-2c0-1.9 1.1-3.3 2.5-3.3 1.2 0 1.7.9 1.7 1.9 0 1.2-.7 2.9-1.1 4.5-.3 1.3.7 2.4 2 2.4 2.4 0 4.2-2.5 4.2-6.1 0-3.2-2.3-5.4-5.6-5.4-3.8 0-6 2.8-6 5.8 0 1.2.4 2.4 1 3 .1.1.1.2.1.4l-.4 1.5c-.1.5-.5.6-.9.4-2-1-3.2-3.8-3.2-6.1C4.1 4.5 7.7 1 14 1c5.2 0 9.2 3.7 9.2 8.6 0 5.1-3.2 9.3-7.7 9.3-1.5 0-2.9-.8-3.4-1.7l-.9 3.5c-.3 1.3-1.2 2.9-1.8 3.9.8.3 1.7.4 2.6.4a10 10 0 0 0 0-20Z'/%3E%3C/svg%3E")!important; -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 0 0-3.6 19.3c-.1-1.7 0-3.7.4-5.5l1.3-5.4s-.3-.8-.3-2c0-1.9 1.1-3.3 2.5-3.3 1.2 0 1.7.9 1.7 1.9 0 1.2-.7 2.9-1.1 4.5-.3 1.3.7 2.4 2 2.4 2.4 0 4.2-2.5 4.2-6.1 0-3.2-2.3-5.4-5.6-5.4-3.8 0-6 2.8-6 5.8 0 1.2.4 2.4 1 3 .1.1.1.2.1.4l-.4 1.5c-.1.5-.5.6-.9.4-2-1-3.2-3.8-3.2-6.1C4.1 4.5 7.7 1 14 1c5.2 0 9.2 3.7 9.2 8.6 0 5.1-3.2 9.3-7.7 9.3-1.5 0-2.9-.8-3.4-1.7l-.9 3.5c-.3 1.3-1.2 2.9-1.8 3.9.8.3 1.7.4 2.6.4a10 10 0 0 0 0-20Z'/%3E%3C/svg%3E")!important; } .home-footer .footer-social a svg{ width:14px;height:14px;fill:#fff!important;color:#fff!important; } .home-footer .footer-social a:hover{ transform:translateY(-3px) scale(1.06)!important; filter:brightness(1.08)!important; box-shadow:0 12px 26px rgba(0,0,0,.3)!important; color:#fff!important; border-color:transparent!important; } .home-footer .love{color:#f43f5e!important} /* Logo: image only — never keep clipped text mark beside uploaded logo */ .home-header .brand, .home-footer .brand, .home-footer .footer-brand, .brand, .footer-brand{ background:transparent!important; box-shadow:none!important; filter:none!important; } .home-header .brand:has(img), .home-footer .brand:has(img), .brand:has(img){ background:transparent!important; height:auto!important; min-height:0!important; } .home-header .brand:has(img) > b, .home-header .brand:has(img) > small, .home-footer .brand:has(img) > b, .home-footer .brand:has(img) > small, .brand:has(img) > b, .brand:has(img) > small{ display:none!important; position:static!important; width:0!important;height:0!important; clip:auto!important; overflow:hidden!important; } .home-header .brand img, .home-footer .brand img, .home-footer .footer-dynamic-logo, .brand img, .footer-brand img, .footer-dynamic-logo{ background:transparent!important; box-shadow:none!important; filter:none!important; mix-blend-mode:normal!important; } .footer-bottom{ position:relative; z-index:1; margin-top:8px; padding:16px 0 20px; border-top:1px solid rgba(255,255,255,.12); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; color:#a9c2dd; font-size:12px; font-weight:600; } .footer-bottom strong{ color:#fff; font-weight:800; } .footer-bottom-links{ display:flex; flex-wrap:wrap; gap:14px; } .footer-bottom-links a{ color:#cfe0f3!important; text-decoration:none!important; font-weight:700!important; } .footer-bottom-links a:hover{color:#ffd24d!important} /* ---------- Motion ---------- */ @keyframes kChromeShift{ 0%{background-position:0% 50%} 100%{background-position:200% 50%} } @keyframes kChromeShine{ 0%{transform:translateX(-120%)} 55%,100%{transform:translateX(280%)} } @media (prefers-reduced-motion:reduce){ .home-top::after, .home-header::after, .home-footer::before{animation:none} } /* ---------- Responsive (detailed rules in public-responsive.css) ---------- */ @media(max-width:1100px){ body .home-menu, body.journey-bg .home-menu, body.cart-page .home-menu, body.shop-page .home-menu, body.product-page .home-menu, body.checkout-page .home-menu, .home-menu{ display:inline-flex!important; align-items:center!important; justify-content:center!important; position:relative; overflow:hidden; font-size:0!important; color:transparent!important; line-height:0!important; } .home-footer .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .home-actions .header-searchbox{min-width:44px!important;width:44px!important;padding:0!important;justify-content:center} .home-actions .header-searchbox .hs-text{display:none} } @media(max-width:767px){ .home-top{height:34px!important;font-size:10px!important} .home-header{height:66px!important} .home-header .brand, .home-nav > .brand{ width:fit-content!important; max-width:min(120px,40vw)!important; position:absolute!important; left:50%!important; top:50%!important; transform:translate(-50%,-50%)!important; } .home-header .brand img, .home-nav > .brand img{height:46px!important;width:auto!important;max-width:100%!important} .home-footer .footer-grid{grid-template-columns:1fr!important;gap:22px} .footer-bottom{justify-content:center;text-align:center} } @media(max-width:520px){ .home-footer .footer-grid{grid-template-columns:1fr!important} } /* ============================================================ SITE CHROME LOCK — same header/footer on EVERY page (index / shop / product / cart / checkout / info pages) ============================================================ */ .home-top, .home-header, .home-footer, .home-top *, .home-header *, .home-footer *{ font-family:'Plus Jakarta Sans','DM Sans',Inter,system-ui,sans-serif!important; } body .home-header, body header.home-header, body.journey-bg .home-header, body.cart-page .home-header, body.shop-page .home-header, body.product-page .home-header, body.checkout-page .home-header{ height:86px!important; } body .home-links, body.journey-bg .home-links, body.cart-page .home-links, body.shop-page .home-links, body.product-page .home-links, body.checkout-page .home-links, .journey-desktop-chrome .home-links, .cart-desktop-chrome .home-links{ gap:8px!important; margin-left:48px!important; } body .home-links > a, body .home-links .nav-item > a, body.journey-bg .home-links > a, body.journey-bg .home-links .nav-item > a, body.cart-page .home-links > a, body.cart-page .home-links .nav-item > a, body.shop-page .home-links > a, body.shop-page .home-links .nav-item > a, body.product-page .home-links > a, body.product-page .home-links .nav-item > a, body.checkout-page .home-links > a, .journey-desktop-chrome .home-links a, .cart-desktop-chrome .home-links a{ font-size:13px!important; font-weight:900!important; letter-spacing:.05em!important; color:#07182f!important; line-height:1.2!important; } body .home-footer, body.journey-bg .home-footer, body.cart-page .home-footer, body.shop-page .home-footer, body.product-page .home-footer, body.checkout-page .home-footer, .journey-desktop-footer, .cart-desktop-footer{ font-size:13px!important; } body .home-footer .footer-grid h4, body.journey-bg .home-footer .footer-grid h4, .journey-desktop-footer .footer-grid h4, .cart-desktop-footer .footer-grid h4{ font-size:12px!important; font-weight:800!important; letter-spacing:.12em!important; color:#ffd24d!important; } body .home-footer .footer-grid > div > a:not(.brand), body.journey-bg .home-footer .footer-grid > div > a:not(.brand), body.cart-page .home-footer .footer-grid > div > a:not(.brand), .journey-desktop-footer .footer-grid > div > a:not(.brand), .cart-desktop-footer .footer-grid > div > a:not(.brand){ font-size:13px!important; font-weight:600!important; line-height:1.45!important; margin:0 0 10px!important; color:#d4e4f7!important; } body .home-footer .footer-grid > div > p, body.journey-bg .home-footer .footer-grid > div > p, .journey-desktop-footer .footer-grid p, .cart-desktop-footer .footer-grid p{ font-size:13px!important; line-height:1.7!important; color:#c5d8ef!important; } body .home-top, body.journey-bg .home-top{ font-size:11px!important; font-weight:700!important; } /* Phone-screen mini header is unused — base.html header is the only chrome */ .journey-bg > .phone-screen > .journey-head, .product-page > .phone-screen > .journey-head, .cart-page > .phone-screen > .journey-head{ display:none!important; } @media(max-width:1100px){ body .home-menu, body.journey-bg .home-menu, body.cart-page .home-menu, body.shop-page .home-menu, body.product-page .home-menu, body.checkout-page .home-menu{ display:inline-flex!important; align-items:center!important; justify-content:center!important; } body .home-links, body.journey-bg .home-links, body.cart-page .home-links, body.shop-page .home-links, body.product-page .home-links, body.checkout-page .home-links{ display:none!important; margin:0!important; gap:0!important; } body .home-links.open, body.journey-bg .home-links.open, body.cart-page .home-links.open, body.shop-page .home-links.open, body.product-page .home-links.open, body.checkout-page .home-links.open{ display:flex!important; } } @media(max-width:767px){ body .home-header, body.journey-bg .home-header, body.cart-page .home-header{ height:66px!important; } body .home-links > a, body .home-links .nav-item > a, body.journey-bg .home-links > a, body.cart-page .home-links > a, body.shop-page .home-links > a{ font-size:14px!important; font-weight:900!important; padding:14px 12px!important; } } /* ---------- Floating contact actions ---------- */ .kidora-float-stack{ position:fixed; right:22px; bottom:148px; z-index:1400; display:flex; flex-direction:column; align-items:flex-end; gap:16px; width:auto; height:auto; pointer-events:none; } .kidora-float-action{ position:relative; top:auto; right:auto; bottom:auto; left:auto; display:inline-flex; align-items:center; justify-content:flex-start; flex:0 0 auto; gap:0; margin:0; min-width:56px; height:56px; min-height:56px; padding:0 18px 0 14px; border-radius:999px; color:#fff; text-decoration:none; overflow:hidden; pointer-events:auto; box-shadow:0 14px 34px rgba(16,35,63,.22); transition:transform .18s ease,box-shadow .18s ease; } .kidora-float-action:hover, .kidora-float-action:focus-visible{ transform:translateY(-2px); color:#fff; } .kidora-float-action.is-whatsapp{ background:linear-gradient(135deg,#25d366 0%,#128c7e 100%); box-shadow:0 14px 34px rgba(18,140,126,.38); } .kidora-float-action.is-whatsapp:hover, .kidora-float-action.is-whatsapp:focus-visible{ box-shadow:0 18px 40px rgba(18,140,126,.46); } .kidora-float-action.is-call{ background:linear-gradient(135deg,#1677ff 0%,#0f5fd6 100%); box-shadow:0 14px 34px rgba(22,119,255,.28); } .kidora-float-action.is-call:hover, .kidora-float-action.is-call:focus-visible{ box-shadow:0 18px 40px rgba(22,119,255,.36); } .kidora-float-action__ring{ position:absolute; inset:0; border-radius:inherit; box-shadow:0 0 0 0 rgba(37,211,102,.45); animation:kidora-wa-pulse 2.4s ease-out infinite; pointer-events:none; } @keyframes kidora-wa-pulse{ 0%{box-shadow:0 0 0 0 rgba(37,211,102,.42)} 70%{box-shadow:0 0 0 8px rgba(37,211,102,0)} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0)} } .kidora-float-action__icon{ width:28px; height:28px; display:grid; place-items:center; flex:0 0 28px; } .kidora-float-action__icon svg{ width:100%; height:100%; fill:currentColor; } .kidora-float-action__text{ max-width:0; opacity:0; overflow:hidden; white-space:nowrap; font-family:"Plus Jakarta Sans",Arial,sans-serif; font-size:13px; font-weight:800; letter-spacing:.01em; transition:max-width .22s ease,opacity .18s ease,margin .18s ease; } .kidora-float-action:hover .kidora-float-action__text, .kidora-float-action:focus-visible .kidora-float-action__text{ max-width:120px; opacity:1; margin-left:8px; } .kidora-float-action:focus-visible{ outline:3px solid rgba(37,211,102,.35); outline-offset:3px; } @media(max-width:767px){ .kidora-float-stack{ right:14px; bottom:108px; gap:16px; } .kidora-float-action{ width:52px; height:52px; min-width:52px; min-height:52px; padding:0; justify-content:center; } .kidora-float-action__text{ display:none; } .kidora-float-action__icon{ width:22px; height:22px; } body.product-page .kidora-float-stack{ bottom:108px; right:14px; } }