/* Shared Hakmar Express design. Keep identical across all three sites. */
:root{--bg:#f3f5f8;--surface:#fff;--text:#172b20;--muted:#64748b;--border:#dfe7e1;--brand:#157c36;--brand-hover:#115d29;--orange:#ea580c;--yellow:#facc15;--radius:16px}
html,body{background:#f3f5f8;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:15px;line-height:1.5}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0%,#157c360c,transparent 55%)}
[hidden]{display:none!important}
.page{width:100%;max-width:1040px;margin:0 auto;padding:24px 20px 36px}
.page>.topbar{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--border);border-top:3px solid var(--brand);border-radius:16px;padding:14px 16px;margin:0 0 20px;box-shadow:0 2px 8px #173b2307;backdrop-filter:none}
.topbar .brand{display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none;color:var(--text)}
.topbar .brand img{width:48px;height:48px;object-fit:contain;flex-shrink:0;border:1px solid #e7eee8;border-radius:14px;background:#fff;box-shadow:none}
.topbar .brand small{display:block;font-size:10px;font-weight:750;line-height:1.3;letter-spacing:1.2px;color:var(--brand);margin:0}
.topbar .brand small b{color:#cf5910;font-size:inherit;display:inline;letter-spacing:inherit;font-style:normal}
.topbar .brand strong{display:block;font-family:inherit;font-size:20px;font-weight:700;line-height:1.3;letter-spacing:-.4px;margin:3px 0 0;color:var(--text);white-space:nowrap}
.topbar-actions{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;flex-shrink:0;width:auto}
.topbar .install-button,.topbar .btn-install{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:11px;min-width:44px;min-height:44px;padding:10px 14px;font:600 13px/1.2 inherit;box-shadow:none;margin:0;cursor:pointer}
.topbar .install-button:hover,.topbar .btn-install:hover{background:var(--brand-hover)}
.install-button svg,.btn-install svg,.portal-link svg{width:21px;height:21px;flex-shrink:0}
.search-area,.page .hero,.page .card,.links .link,.product{border-radius:16px;border:1px solid var(--border);background:#fff;box-shadow:0 2px 8px #173b2307}
.tabs{padding:7px;background:#f0f5f1;gap:6px}.tabs button{border-radius:10px;font-size:14px;border:1px solid transparent;background:transparent;color:#7a8f82;font-weight:600}.tabs button[aria-selected=false]{background:#fff;border-color:#d8e4dc;color:#8a9a8f;box-shadow:none}.tabs button[aria-selected=true]{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:650;box-shadow:0 1px 3px #173b2314}.tabs button[data-mode=competitor][aria-selected=true]{background:#b6490d;border-color:#b6490d}
#search-panel{padding:22px}.search-box input{border-radius:10px;background:#fff}.search-box button[type=submit]{border-radius:10px}
.page>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--border);margin:24px 0 0;padding:18px 0 0;font-size:12px;color:var(--muted)}
.page>footer p{margin:0}
.portal-link{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 12px;background:#edf7f0;border:1px solid #d2e6d8;border-radius:11px;color:#176134;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.portal-link:hover{background:#dfeee4}
.links{margin-top:0;gap:16px}.links .link{padding:24px;gap:20px;border-top:3px solid var(--brand)}.links .label{border-top-color:var(--orange)}.links .whatsapp{border-top-color:#28a05b}
.links .icon{width:46px;height:46px;border-radius:12px;background:#edf7f0;color:var(--brand)}.links .label .icon{background:#fff4e9;color:#c6530f}.links .whatsapp .icon{background:#edf7f0;color:#21804a}
.links h2{font-size:20px;letter-spacing:-.4px;color:var(--text)}.links .category{font-size:10px;letter-spacing:1px;color:var(--muted)}
.links .action{color:var(--brand)}.links .label .action{color:#b6490d}.links .whatsapp .action{color:#21804a}
.connection-notice,.install-help{padding:14px 16px;margin:0 0 18px;border:1px solid #f3d994;border-radius:12px;background:#fff9e8;color:#754b12;font-size:14px}
@media(max-width:700px){.page{padding:12px 12px 28px}.page>.topbar{padding:11px 12px;gap:8px;margin-bottom:16px}.topbar .brand{gap:9px}.topbar .brand img{width:42px;height:42px;border-radius:12px}.topbar .brand strong{font-size:17px}.topbar .brand small{font-size:9px;letter-spacing:1px}.topbar .install-label{display:none}.topbar .install-button,.topbar .btn-install{width:44px;height:44px;padding:10px}.topbar-actions{width:auto}.topbar-actions>*{flex:none}#search-panel{padding:18px 14px}.links{grid-template-columns:1fr;gap:12px}.links .link{flex-direction:row;padding:20px;gap:16px}.links .icon{flex-shrink:0}.page>footer{font-size:11px}.portal-link{font-size:12px}.results{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.link{transition:none}}
.page>footer{flex-direction:column;justify-content:center;text-align:center;gap:14px}
.page>footer .site-notice{max-width:480px;margin:0;color:#64748b;font-size:12px;line-height:1.6;font-weight:400}
.search-query-row{display:flex;align-items:center;gap:8px;margin:0 0 8px}
.search-query-row .input-wrap{flex:1;min-width:0}
.search-box{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:stretch}
.passive-switch{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:7px 10px 7px 11px;border:1px solid #d4ddd6;border-radius:12px;background:linear-gradient(180deg,#fbfdfb,#f2f6f3);color:#4a5d4f;cursor:pointer;white-space:nowrap}
.search-passive-switch{flex-direction:column;justify-content:center;align-items:center;width:52px;min-width:52px;flex-shrink:0;min-height:0;height:auto;align-self:stretch;gap:2px;padding:4px;border-radius:10px;background:#f2f6f3}
.search-passive-switch .passive-switch-label{font-size:11px;font-weight:750;line-height:1;color:#4a5d4f}
.search-passive-switch.is-on .passive-switch-label{color:#7a5410}
.search-passive-switch .passive-switch-track{width:28px;height:16px}
.search-passive-switch .passive-switch-knob{width:12px;height:12px;top:2px;left:2px}
.search-passive-switch.is-on{background:#ffefc4}
.search-passive-switch.is-on .passive-switch-knob{transform:translateX(12px)}
.passive-switch-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.15}
.passive-switch-copy strong{font-size:10px;font-weight:750;letter-spacing:.45px;text-transform:uppercase}
.passive-switch-copy small{font-size:12px;font-weight:750;color:#64756a}
.passive-switch-track{position:relative;width:38px;height:22px;flex-shrink:0;border-radius:999px;background:#c5cfc7;box-shadow:inset 0 1px 3px #173b2314}
.passive-switch-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #173b2333;transition:transform .18s ease}
.passive-switch.is-on{border-color:#e0b64a;background:linear-gradient(180deg,#fff8e6,#ffefc4);color:#7a5410;box-shadow:inset 0 0 0 1px #f3d27a55}
.passive-switch.is-on .passive-switch-copy small{color:#8a5c10}
.passive-switch.is-on .passive-switch-track{background:#e2a427}
.passive-switch.is-on .passive-switch-knob{transform:translateX(16px)}
.passive-switch:focus-visible{outline:3px solid #e2a427;outline-offset:2px}
.input-wrap{position:relative;min-width:0;display:flex;align-items:stretch}
.search-box input{width:100%;padding-right:58px}
#query-clear{position:absolute;right:5px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:36px;padding:6px 12px;border:1px solid #cbd2dc;border-radius:8px;background:#f4f6f9;color:#475569;font-size:13px;font-weight:650;line-height:1;cursor:pointer}
#query-clear:hover{background:#e8ecf1}
#query-clear[hidden]{display:none!important}
.search-box button[type=submit],.search-box #scan-open{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:10px 16px;white-space:nowrap}
.search-box button[type=submit] svg,.search-box #scan-open svg{width:20px;height:20px;flex-shrink:0}
.search-box #scan-open{border:1px solid #e7cf77;border-radius:10px;background:#fff9df;color:#806013;font-size:14px;font-weight:650}
.scanner-actions{margin-top:4px}
#gallery-open{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px;border:1px solid #cce1d2;border-radius:10px;background:#edf7f0;color:#176134;font-size:14px;font-weight:600}
#scanner{max-height:90dvh;overflow-y:auto}
#scan-video{margin-top:16px;object-fit:contain;max-height:40dvh}
@media(max-width:400px){.search-box{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.search-box button[type=submit],.search-box #scan-open{width:100%;padding:10px 12px;font-size:13px}.search-query-row{gap:6px;margin-bottom:6px}.search-box input{padding:12px 58px 12px 10px}}

.support-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;border:1px solid #bedcc9;border-radius:12px;background:#eaf7ee;color:#157c36;text-decoration:none}.support-icon svg{width:23px;height:23px}.support-icon:hover{background:#d5efde}.support-icon:focus-visible{outline:3px solid #e99429;outline-offset:2px}.block-support{display:block;margin-top:10px;color:#157c36;font-weight:700;text-decoration:underline}

.portal-icon{background:#eaf7ee}