:root{--navy:#082b55;--navy-soft:#0f4179;--blue:#1768b8;--blue-soft:#e8f2ff;--yellow:#ffcc1d;--yellow-soft:#fff4c4;--green:#19c269;--green-dark:#12a857;--green-soft:#e9fff3;--bg:#eef6ff;--bg-soft:#f8fbff;--card:#ffffff;--text:#0f172a;--muted:#536b86;--line:#d9e8f8;--shadow:0 12px 30px rgba(15,48,89,.08);--shadow-lg:0 18px 40px rgba(15,48,89,.12);--wrap:1160px;--focus:#ffcc1d}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;width:100%;max-width:100%;overflow-x:hidden}body{font-family:Arial,"Segoe UI",sans-serif;background:linear-gradient(180deg,var(--bg-soft) 0%,var(--bg) 100%);color:var(--text);line-height:1.55;min-width:320px;min-height:100vh;width:100%;max-width:100%;overflow-x:hidden;padding:max(18px,env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) max(18px,env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}img,svg,video,canvas{max-width:100%;height:auto}img{display:block}a{text-decoration:none;color:inherit}button,input{font:inherit}button{cursor:pointer}.skip-link{position:fixed;top:10px;left:10px;z-index:99999;transform:translateY(-160%);padding:10px 14px;border-radius:12px;background:#fff;color:var(--navy);font-weight:900;box-shadow:var(--shadow)}.skip-link:focus{transform:translateY(0);outline:3px solid var(--focus)}:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.container{width:100%;max-width:var(--wrap);margin:0 auto;overflow-x:hidden}.navbar{position:sticky;top:12px;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;margin-bottom:22px;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.92);border-radius:24px;box-shadow:var(--shadow);backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:12px;min-width:0;flex:0 0 300px}.brand-logo{width:64px;height:64px;border-radius:50%;overflow:hidden;flex:0 0 64px;border:3px solid #fff;box-shadow:0 8px 20px rgba(255,77,0,.15);background:#fff}.brand-logo img{width:100%;height:100%;object-fit:contain;object-position:center;border-radius:50%}.brand-copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start}.brand-title{display:block;font-weight:900;font-size:17px;line-height:1.12;color:var(--navy);text-transform:uppercase;letter-spacing:.2px;white-space:nowrap}.brand-sub{display:block;font-size:11.5px;font-weight:700;color:var(--muted);margin-top:4px;line-height:1.25;white-space:nowrap}.menu{display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:7px;flex:1 1 auto;min-width:0}.menu a{padding:9px 11px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--navy);font-size:12px;font-weight:700;white-space:nowrap;transition:background-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease;box-shadow:0 4px 10px rgba(15,48,89,.04)}.menu a:hover,.menu a:focus-visible{background:var(--blue-soft);color:var(--blue);transform:translateY(-1px);box-shadow:0 10px 18px rgba(23,104,184,.12)}.menu .instagram-link{background:#eef5ff;color:var(--blue);border-color:#cfe5ff}.menu .whatsapp-link{background:var(--green);color:#fff;border-color:rgba(25,194,105,.4);box-shadow:0 0 20px rgba(25,194,105,.28)}.menu .whatsapp-link:hover,.menu .whatsapp-link:focus-visible{background:var(--green-dark);color:#fff;box-shadow:0 0 28px rgba(25,194,105,.40)}.section{margin-bottom:22px}.panel{background:var(--card);border:1px solid rgba(255,255,255,.85);border-radius:30px;box-shadow:var(--shadow);padding:28px}.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#0b3868 0%,#1768b8 58%,#2b8bdb 100%);color:#fff;box-shadow:var(--shadow-lg);text-align:center}.hero::before,.hero::after,.service-hero::before{content:"";position:absolute;border-radius:50%;pointer-events:none}.hero::before{width:300px;height:300px;top:-160px;right:-120px;background:radial-gradient(circle,rgba(255,204,29,.30),transparent 68%)}.hero::after{width:260px;height:260px;left:-100px;bottom:-140px;background:radial-gradient(circle,rgba(25,194,105,.18),transparent 70%)}.hero>*{position:relative;z-index:1}.hero-title{font-size:clamp(36px,6vw,66px);font-weight:900;line-height:1.04;letter-spacing:.3px;margin-bottom:14px;text-transform:uppercase}.hero-lead{max-width:860px;font-size:18px;font-weight:700;line-height:1.7;color:#fff;margin:0 auto}.hero-sub{max-width:840px;font-size:17px;font-weight:600;line-height:1.75;color:rgba(255,255,255,.92);margin:14px auto 0}.search-box{position:relative;z-index:20;display:flex;align-items:center;gap:14px;width:min(100%,860px);min-height:54px;margin:24px auto 0;padding:16px 18px;background:#fff;border:1px solid #dbeafe;border-radius:22px;box-shadow:0 14px 34px rgba(15,48,89,.16)}.search-icon{width:46px;height:46px;display:grid;place-items:center;flex:0 0 46px;border-radius:14px;background:var(--blue-soft);color:var(--blue);font-size:22px;font-weight:900}.search-box input{width:100%;min-width:0;border:none;outline:none;background:transparent;color:var(--navy);font-size:17px;font-weight:700;line-height:1.35;-webkit-appearance:none;appearance:none}.search-box input::placeholder{color:#7d94ae;font-weight:600}.search-suggestions{position:absolute;left:0;right:0;top:calc(100%+6px);z-index:999;display:none;max-height:min(45vh,320px);overflow-y:auto;background:#fff;border:1px solid #dbeafe;border-radius:18px;box-shadow:0 22px 50px rgba(15,48,89,.24);text-align:left;padding:8px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.search-suggestions.is-open{display:block}.suggestion-item{width:100%;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:var(--navy);text-align:left;padding:12px 14px;border-radius:14px;font-size:14.5px;font-weight:700;line-height:1.45}.suggestion-item:hover,.suggestion-item.is-active,.suggestion-item:focus-visible{background:var(--blue-soft)}.suggestion-icon{flex:0 0 22px;width:22px;height:22px;border-radius:999px;display:grid;place-items:center;color:var(--blue);font-size:15px;margin-top:1px}.suggestion-text{min-width:0;overflow-wrap:anywhere;word-break:break-word}.suggestion-text mark{background:transparent;color:var(--blue);font-weight:900}.hero-points{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:18px}.hero-point{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:10px 14px;font-size:14px;font-weight:800;color:#fff;backdrop-filter:blur(2px)}.section-heading{display:flex;align-items:center;gap:10px;color:var(--navy);font-size:28px;font-weight:900;line-height:1.25;margin-bottom:10px;overflow-wrap:anywhere}.section-intro{color:var(--muted);font-size:15px;line-height:1.7;font-weight:600;margin-bottom:16px}.results-panel.is-searching .section-heading{display:none}.results-panel.is-searching .list-info{margin-top:0}.list-info{padding:12px 16px;border-radius:14px;background:var(--bg-soft);border:1px solid var(--line);color:var(--navy);font-size:14px;font-weight:700;margin-bottom:14px}.docs-list{display:flex;flex-direction:column;gap:12px}.doc-link{display:block}.doc-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:15px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 18px rgba(15,48,89,.05);transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;cursor:pointer}.doc-link:hover .doc-item,.doc-link:focus-visible .doc-item{border-color:#c2daf5;box-shadow:0 12px 24px rgba(15,48,89,.09);transform:translateY(-1px)}.doc-left{display:flex;align-items:center;gap:14px;min-width:0}.doc-icon{width:48px;height:48px;flex:0 0 48px;border-radius:16px;display:grid;place-items:center;background:var(--blue-soft);color:var(--blue);font-size:22px;font-weight:900}.doc-title{font-size:16px;font-weight:800;color:var(--navy);line-height:1.5;overflow-wrap:anywhere;word-break:break-word}.doc-btn{display:inline-flex;align-items:center;justify-content:center;min-width:188px;padding:12px 18px;border-radius:16px;background:var(--green);color:#fff;text-transform:uppercase;font-size:13px;font-weight:800;box-shadow:0 0 18px rgba(25,194,105,.25)}.empty-panel{display:none}.empty-wrap{text-align:center;padding:44px 22px}.empty-title{font-size:30px;line-height:1.28;font-weight:900;color:var(--navy);margin-bottom:8px}.empty-text{font-size:16px;line-height:1.7;font-weight:600;color:var(--muted);margin-bottom:22px}.primary-cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;border-radius:999px;background:var(--green);color:#fff;font-size:15px;font-weight:800;text-transform:uppercase;box-shadow:0 0 24px rgba(25,194,105,.45);transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}.primary-cta:hover,.primary-cta:focus-visible{background:var(--green-dark);transform:translateY(-1px);box-shadow:0 0 30px rgba(25,194,105,.58)}.grid-4,.grid-3,.grid-2{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}.mini-card,.feature-card,.service-card,.why-card,.faq-card{min-width:0;background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;box-shadow:0 8px 18px rgba(15,48,89,.05)}.mini-number,.service-icon,.why-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;margin-bottom:12px}.mini-number{background:var(--blue);color:#fff;font-weight:900;box-shadow:0 10px 18px rgba(23,104,184,.18)}.service-icon,.why-icon{background:var(--blue-soft);color:var(--blue);font-size:24px}.mini-card h3,.service-card h3,.why-card h3,.feature-card h3,.faq-card h3{font-size:18px;line-height:1.4;color:var(--navy);font-weight:900;margin-bottom:8px}.mini-card p,.service-card p,.why-card p,.feature-card p,.faq-card p{font-size:14px;line-height:1.7;color:var(--muted);font-weight:600}.service-hero{background:linear-gradient(135deg,#082b55 0%,#1768b8 58%,#2b8bdb 100%);color:#fff;box-shadow:var(--shadow-lg);position:relative;overflow:hidden;text-align:center}.service-hero::before{top:-90px;right:-90px;width:240px;height:240px;background:radial-gradient(circle,rgba(255,204,29,.22),transparent 72%)}.service-hero>*{position:relative;z-index:1}.service-brand{font-size:clamp(42px,6vw,72px);line-height:1.02;font-weight:900;text-transform:uppercase;letter-spacing:.4px;overflow-wrap:anywhere}.service-subtitle{font-size:clamp(24px,3.3vw,34px);line-height:1.2;font-weight:800;color:#fff3b3;margin-top:6px;overflow-wrap:anywhere}.service-tagline{margin-top:12px;font-size:16px;line-height:1.7;font-weight:800;color:#fff}.service-copy{margin:12px auto 0;max-width:820px;font-size:16px;line-height:1.8;font-weight:600;color:rgba(255,255,255,.94)}.service-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;justify-content:center}.wa-button,.ig-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 24px;border-radius:999px;font-size:15px;font-weight:800;text-transform:uppercase;border:1px solid transparent;transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,color .22s ease,border-color .22s ease}.wa-button{background:var(--green);color:#fff;box-shadow:0 0 22px rgba(25,194,105,.34)}.wa-button:hover,.wa-button:focus-visible{background:var(--green-dark);transform:translateY(-1px);box-shadow:0 0 30px rgba(25,194,105,.44)}.ig-button{background:#e8f2ff;color:var(--blue);border-color:#cfe5ff;box-shadow:0 8px 18px rgba(23,104,184,.10)}.ig-button:hover,.ig-button:focus-visible{background:#fff;color:var(--navy);transform:translateY(-1px);box-shadow:0 16px 28px rgba(23,104,184,.18)}.service-card{border-color:#e2edf8}.testimonials-head{margin-bottom:18px}.testimonials-title{font-size:32px;line-height:1.3;color:var(--navy);font-weight:900;margin-bottom:10px}.testimonials-intro{max-width:860px;color:var(--muted);font-size:15px;line-height:1.8;font-weight:600}.testimonials-wrap{position:relative;overflow:hidden;padding:6px 2px 10px;cursor:grab;user-select:none;touch-action:pan-y}.testimonials-wrap:active{cursor:grabbing}.testimonials-wrap::before,.testimonials-wrap::after{content:"";position:absolute;top:0;bottom:0;width:48px;z-index:2;pointer-events:none}.testimonials-wrap::before{left:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,0) 100%)}.testimonials-wrap::after{right:0;background:linear-gradient(270deg,#fff 0%,rgba(255,255,255,0) 100%)}.testimonials-track{display:flex;gap:16px;will-change:transform;transition:transform .58s cubic-bezier(.22,1,.36,1)}.testimonial-card{flex:0 0 350px;min-width:0;background:#fff;border:1px solid #e2edf8;border-radius:24px;padding:24px;box-shadow:0 12px 26px rgba(15,48,89,.08);display:flex;flex-direction:column;justify-content:space-between;min-height:292px}.testimonial-stars{color:#ffb703;font-size:18px;letter-spacing:1px;font-weight:900;margin-bottom:14px}.testimonial-text{color:#334155;font-size:15px;line-height:1.75;font-weight:600;margin-bottom:20px}.profile{display:flex;align-items:center;gap:12px;margin-top:auto}.avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:0 0 46px;background:linear-gradient(135deg,#1768b8,#19c269);color:#fff;font-size:16px;font-weight:900;box-shadow:0 8px 18px rgba(23,104,184,.20)}.profile h4{color:var(--navy);font-size:15px;font-weight:900;margin-bottom:4px}.profile span{display:block;color:#7890aa;font-size:13px;line-height:1.45;font-weight:600}.testimonials-controls{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.scroll-btn{width:44px;height:44px;border:none;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-size:22px;font-weight:900;box-shadow:0 0 20px rgba(25,194,105,.35);transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease}.scroll-btn:hover,.scroll-btn:focus-visible{background:var(--green-dark);transform:translateY(-1px);box-shadow:0 0 26px rgba(25,194,105,.45)}.privacy-note{margin-top:12px;color:#7890aa;font-size:13px;line-height:1.6;font-weight:600}.faq-list{display:grid;gap:12px}details.faq-item{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;box-shadow:0 8px 18px rgba(15,48,89,.04)}details.faq-item summary{list-style:none;cursor:pointer;font-weight:800;color:var(--navy);font-size:16px;line-height:1.45;padding-right:18px;position:relative}details.faq-item summary::-webkit-details-marker{display:none}details.faq-item summary::after{content:'+';position:absolute;right:0;top:0;color:var(--blue);font-size:22px;line-height:1}details[open].faq-item summary::after{content:'−'}details.faq-item p{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.75;font-weight:600}.footer{background:linear-gradient(135deg,#082b55 0%,#0f4179 100%);color:#fff;border-radius:28px;padding:26px;display:grid;grid-template-columns:1.35fr .85fr .9fr;gap:18px;box-shadow:var(--shadow-lg)}.footer h3{font-size:22px;font-weight:900;line-height:1.2;margin-bottom:10px;text-transform:uppercase}.footer p,.footer a{font-size:14px;line-height:1.8;color:rgba(255,255,255,.88);font-weight:600;overflow-wrap:anywhere}.footer-title{font-size:15px;font-weight:900;color:#fff3b3;margin-bottom:8px;text-transform:uppercase}.copyright{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.14);padding-top:14px;margin-top:6px;text-align:center;color:rgba(255,255,255,.76);font-size:13px;font-weight:600}.wa-float{position:fixed;right:calc(env(safe-area-inset-right,0px)+clamp(10px,3vw,18px));bottom:calc(env(safe-area-inset-bottom,0px)+clamp(14px,4vw,22px));z-index:10002;width:clamp(54px,12vw,66px);height:clamp(54px,12vw,66px);border-radius:50%;display:grid;place-items:center;background:#19c269;color:#fff;box-shadow:0 0 22px rgba(25,194,105,.55),0 14px 30px rgba(25,194,105,.28);transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}.wa-float:hover,.wa-float:focus-visible{background:#12a857;transform:translateY(-2px) scale(1.02);box-shadow:0 0 28px rgba(25,194,105,.65),0 18px 34px rgba(25,194,105,.34)}.wa-float svg{width:60%;height:60%}.noscript-note{position:fixed;left:10px;right:10px;bottom:10px;z-index:10003;background:#fff3b3;color:#082b55;border:1px solid #ffcc1d;border-radius:14px;padding:12px 14px;font-weight:800;text-align:center;box-shadow:var(--shadow)}@media (max-width:1180px){.navbar{align-items:flex-start;flex-direction:column}.brand{flex:0 1 auto;width:100%}.menu{width:100%;justify-content:flex-start;flex-wrap:wrap}}@media (max-width:840px){body{padding:10px}.navbar{position:static}.panel{padding:18px;border-radius:22px}.hero-title{font-size:clamp(30px,9vw,42px)}.hero-lead,.hero-sub{font-size:16px}.search-box{padding:12px 13px;gap:10px;border-radius:18px}.search-icon{width:40px;height:40px;flex-basis:40px}.doc-item{grid-template-columns:1fr}.doc-btn{width:100%;min-width:0}.footer{grid-template-columns:1fr}.testimonials-controls{justify-content:center}}@media (max-width:600px){body{padding:6px}.navbar{padding:10px;margin-bottom:14px;border-radius:18px;gap:9px}.brand{gap:9px}.brand-logo{width:44px;height:44px;flex-basis:44px}.brand-title{font-size:14px;line-height:1.1}.brand-sub{font-size:10.5px;line-height:1.25;white-space:normal}.menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.menu a{width:100%;text-align:center;padding:9px 7px;font-size:11.5px;line-height:1.15;white-space:normal}.menu .whatsapp-link{grid-column:1/-1}.section{margin-bottom:10px}.panel{padding:13px;border-radius:18px}.hero{padding:16px 10px}.hero-title{font-size:clamp(25px,8.5vw,34px);line-height:1.08;margin-bottom:8px}.hero-lead,.hero-sub{font-size:14.5px;line-height:1.55}.search-box{margin-top:12px;min-height:56px;padding:9px 10px;border-radius:15px;gap:8px}.search-icon{width:34px;height:34px;flex-basis:34px;border-radius:11px;font-size:18px}.search-box input{font-size:16px}.search-suggestions{max-height:245px;border-radius:16px;padding:6px}.suggestion-item{padding:10px 9px;font-size:13px;gap:9px}.hero-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:10px}.hero-point{padding:7px 6px;font-size:11.5px;line-height:1.15}.hero-point:last-child{grid-column:1/-1}.section-heading{font-size:22px;line-height:1.2;margin-bottom:8px;align-items:flex-start}.section-intro,.list-info{font-size:12.8px;line-height:1.45}.results-panel{scroll-margin-top:8px}.results-panel .section-heading{font-size:20px}.results-panel .list-info{padding:8px 10px;margin-bottom:8px}.docs-list{gap:8px}.doc-item{padding:9px 10px;border-radius:15px;gap:8px}.doc-left{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:center}.doc-icon{width:34px;height:34px;flex-basis:34px;border-radius:11px;font-size:16px}.doc-title{font-size:13.4px;line-height:1.28}.doc-btn{padding:9px 10px;border-radius:12px;font-size:11.5px}.mini-card,.service-card,.why-card{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:8px;row-gap:4px;align-items:center;padding:10px;border-radius:15px}.mini-number,.service-icon,.why-icon{width:34px;height:34px;margin-bottom:0;border-radius:11px;font-size:16px}.mini-card h3,.service-card h3,.why-card h3{font-size:14.6px;line-height:1.22;margin-bottom:0}.mini-card p,.service-card p,.why-card p{grid-column:1/-1;font-size:12.2px;line-height:1.42;margin-top:0}.service-hero{padding:16px 12px}.service-brand{font-size:28px}.service-subtitle{font-size:18px}.service-tagline{font-size:11.8px;line-height:1.45;margin-top:7px}.service-copy{font-size:12.5px;line-height:1.45;margin-top:7px}.service-actions{display:grid;grid-template-columns:1fr;gap:8px;margin-top:12px}.wa-button,.ig-button,.primary-cta{width:100%;padding:10px 8px;font-size:11.8px;border-radius:14px}.testimonials-title{font-size:20px;line-height:1.2}.testimonials-intro{font-size:12.5px;line-height:1.45}.testimonials-wrap::before,.testimonials-wrap::after{width:22px}.testimonial-card{flex:0 0 82vw;min-height:235px;padding:14px;border-radius:16px}.testimonial-text{font-size:12.4px;line-height:1.45}details.faq-item{padding:11px 12px;border-radius:14px}details.faq-item summary{font-size:13.2px}details.faq-item p{font-size:12.2px;line-height:1.45}.footer{padding:14px;border-radius:18px}.footer h3{font-size:17px}.footer p,.footer a{font-size:12.2px;line-height:1.55}.copyright{font-size:11.5px}.wa-float{width:54px;height:54px}.wa-float svg{width:32px;height:32px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.testimonials-track{transition:none!important}}@supports (-webkit-touch-callout:none){input,textarea,select{font-size:16px!important}.search-box{transform:translateZ(0)}}@media (forced-colors:active){.menu a,.panel,.doc-item,.faq-item{border:1px solid CanvasText}.wa-button,.ig-button,.primary-cta,.wa-float{forced-color-adjust:auto}}
/* === HOTFIX 20260508B: hosted mobile/desktop stability === */
.container{overflow:visible!important}.navbar{position:sticky!important;top:max(10px,env(safe-area-inset-top,0px))!important;z-index:30000!important}.wa-float{position:fixed!important;display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;z-index:40000!important;right:calc(env(safe-area-inset-right,0px) + clamp(12px,3vw,20px))!important;bottom:calc(env(safe-area-inset-bottom,0px) + clamp(18px,4vw,26px))!important}.search-box{isolation:isolate}.search-suggestions{z-index:35000!important}.search-suggestions.is-open{display:block!important}
@media (max-width:768px){
  body{padding-top:6px!important}.navbar{top:0!important;margin:-6px -6px 10px!important;border-radius:0 0 18px 18px!important;padding:10px 12px!important;background:rgba(255,255,255,.98)!important;box-shadow:0 10px 28px rgba(15,48,89,.16)!important}.navbar .brand{width:100%!important}.navbar .menu{transition:max-height .18s ease,opacity .18s ease}.is-scrolled .navbar .menu,.search-focused .navbar .menu{display:none!important}.brand-logo{width:48px!important;height:48px!important;flex-basis:48px!important}.brand-title{font-size:15px!important;line-height:1.1!important}.brand-sub{font-size:11px!important;line-height:1.25!important}.hero{transition:padding .2s ease,border-radius .2s ease}.search-focused .hero{padding:12px 10px 14px!important;border-radius:20px!important}.search-focused .hero-title{display:block!important;font-size:clamp(22px,6.6vw,30px)!important;line-height:1.08!important;margin:0 0 8px!important;letter-spacing:.1px!important}.search-focused .hero-lead,.search-focused .hero-sub,.search-focused .hero-points{display:none!important}.search-focused .search-box{margin-top:8px!important;min-height:58px!important;padding:10px 12px!important;border-radius:18px!important;box-shadow:0 12px 26px rgba(15,48,89,.20)!important}.mobile-suggestions-open .search-suggestions{position:fixed!important;left:var(--suggest-left,12px)!important;top:var(--suggest-top,180px)!important;width:var(--suggest-width,calc(100vw - 24px))!important;right:auto!important;max-height:var(--suggest-max-height,38dvh)!important;overflow-y:auto!important;border-radius:18px!important;padding:7px!important;background:#fff!important;box-shadow:0 20px 48px rgba(15,48,89,.28)!important}.mobile-suggestions-open .suggestion-item{min-height:50px!important;padding:12px 14px!important}.mobile-suggestions-open .suggestion-text{font-size:14px!important;line-height:1.35!important}.wa-float{width:60px!important;height:60px!important;right:calc(env(safe-area-inset-right,0px) + 14px)!important;bottom:calc(env(safe-area-inset-bottom,0px) + 16px)!important}.wa-float svg{width:36px!important;height:36px!important}.results-panel{scroll-margin-top:76px!important}.empty-panel{scroll-margin-top:76px!important}}
@media (min-width:769px){.navbar{top:12px!important}.results-panel{scroll-margin-top:112px}.empty-panel{scroll-margin-top:112px}}

/* =========================================================
   FINAL FIX — NAVBAR FIXED, SEARCH FOCUS, EMPTY FOCUS MODE
   ========================================================= */
:root{--nav-offset:96px}.container{overflow:visible!important;padding-top:calc(var(--nav-offset,96px) + 10px)!important}.navbar{position:fixed!important;top:max(12px,env(safe-area-inset-top,0px))!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(calc(100% - 36px),var(--wrap))!important;max-width:var(--wrap)!important;z-index:50000!important;margin:0!important;background:rgba(255,255,255,.97)!important;box-shadow:0 14px 34px rgba(15,48,89,.16)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.wa-float{position:fixed!important;display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;z-index:60000!important;right:calc(env(safe-area-inset-right,0px) + clamp(12px,3vw,22px))!important;bottom:calc(env(safe-area-inset-bottom,0px) + clamp(18px,4vw,28px))!important}.no-results-active #cara-akses,.no-results-active #layanan-utama,.no-results-active #layanan,.no-results-active #kenapa-pilih,.no-results-active #testimoni,.no-results-active #faq,.no-results-active footer.footer{display:none!important}.no-results-active .empty-panel{display:block!important;scroll-margin-top:calc(var(--nav-offset,90px) + 18px)!important}.empty-panel{scroll-margin-top:calc(var(--nav-offset,90px) + 18px)!important}.results-panel{scroll-margin-top:calc(var(--nav-offset,90px) + 18px)!important}.search-box{isolation:isolate}.search-suggestions{z-index:55000!important;top:calc(100% + 8px)!important}.search-suggestions.is-open{display:block!important}
@media (min-width:841px){.navbar{top:14px!important}.container{padding-top:calc(var(--nav-offset,96px) + 18px)!important}.navbar .menu{display:flex!important}}
@media (max-width:840px){body{padding-top:0!important}.container{padding-top:calc(var(--nav-offset,150px) + 8px)!important}.navbar{top:0!important;left:0!important;right:0!important;transform:none!important;width:100%!important;max-width:none!important;border-radius:0 0 20px 20px!important;padding:10px 12px!important;background:rgba(255,255,255,.985)!important}.navbar .brand{width:100%!important;flex:0 0 auto!important}.is-scrolled .navbar .menu,.search-focused .navbar .menu{display:none!important}.is-scrolled .navbar,.search-focused .navbar{padding:8px 12px!important;border-radius:0 0 18px 18px!important}.is-scrolled .brand-logo,.search-focused .brand-logo{width:44px!important;height:44px!important;flex-basis:44px!important}.is-scrolled .brand-title,.search-focused .brand-title{font-size:14px!important;line-height:1.08!important}.is-scrolled .brand-sub,.search-focused .brand-sub{font-size:10.5px!important;line-height:1.2!important;white-space:normal!important}.search-focused .hero{padding:12px 10px 14px!important;border-radius:20px!important}.search-focused .hero-title{display:block!important;font-size:clamp(22px,6.5vw,30px)!important;line-height:1.08!important;margin:0 0 8px!important}.search-focused .hero-lead,.search-focused .hero-sub,.search-focused .hero-points{display:none!important}.search-focused .search-box{margin-top:8px!important;min-height:58px!important;padding:10px 12px!important;border-radius:18px!important;box-shadow:0 12px 26px rgba(15,48,89,.20)!important}.mobile-suggestions-open .search-suggestions{position:fixed!important;left:var(--suggest-left,12px)!important;top:var(--suggest-top,180px)!important;width:var(--suggest-width,calc(100vw - 24px))!important;right:auto!important;max-height:var(--suggest-max-height,38dvh)!important;overflow-y:auto!important;border-radius:18px!important;padding:7px!important;background:#fff!important;box-shadow:0 20px 48px rgba(15,48,89,.28)!important}.mobile-suggestions-open .suggestion-item{min-height:50px!important;padding:12px 14px!important}.mobile-suggestions-open .suggestion-text{font-size:14px!important;line-height:1.35!important}.wa-float{width:60px!important;height:60px!important;right:calc(env(safe-area-inset-right,0px) + 14px)!important;bottom:calc(env(safe-area-inset-bottom,0px) + 16px)!important}.wa-float svg{width:36px!important;height:36px!important}}


/* =========================================================
   FINAL FIX v20260508c
   - Navbar benar-benar fixed/mengambang.
   - Mode pencarian mengecilkan hero di PC dan HP.
   - Suggestion selalu berada DI BAWAH input, tidak menutupi input.
   - HP: menu navbar menghilang lembut saat scroll/search.
   - Tombol WA floating tetap tampil.
   ========================================================= */
:root{--nav-offset:96px;--navbar-top:12px}
body{padding-top:max(10px,env(safe-area-inset-top,0px))!important}
.container{padding-top:calc(var(--nav-offset,96px) + 18px)!important;transition:padding-top .26s ease}
.navbar{position:fixed!important;top:calc(env(safe-area-inset-top,0px) + var(--navbar-top,12px))!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(calc(100vw - 24px),var(--wrap))!important;max-width:var(--wrap)!important;margin:0!important;z-index:50000!important;transition:padding .26s ease,border-radius .26s ease,box-shadow .26s ease,background-color .26s ease,min-height .26s ease!important;will-change:transform;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
body.is-scrolled .navbar,body.search-focused .navbar{background:rgba(255,255,255,.97)!important;box-shadow:0 18px 42px rgba(15,48,89,.16)!important}
.search-area{position:relative;z-index:20;width:min(100%,860px);max-width:100%;margin:24px auto 0;transition:margin .24s ease}
.search-area .search-box{width:100%!important;max-width:100%!important;margin:0!important;position:relative!important;z-index:2!important;transition:min-height .24s ease,padding .24s ease,border-radius .24s ease,box-shadow .24s ease!important}
.search-area .search-suggestions,body.mobile-suggestions-open .search-area .search-suggestions{position:static!important;left:auto!important;right:auto!important;top:auto!important;width:100%!important;max-width:100%!important;margin:10px 0 0!important;display:none;max-height:min(34vh,330px)!important;overflow-y:auto!important;background:#fff!important;border:1px solid #dbeafe!important;border-radius:18px!important;box-shadow:0 18px 44px rgba(15,48,89,.20)!important;padding:8px!important;text-align:left!important;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;z-index:1!important}
.search-area .search-suggestions.is-open{display:block!important}
body.mobile-suggestions-open .search-area .search-suggestions{--suggest-left:initial;--suggest-top:initial;--suggest-width:initial;--suggest-max-height:initial}
.hero{overflow:visible!important;transition:padding .26s ease,border-radius .26s ease,box-shadow .26s ease!important}
.hero-title,.hero-lead,.hero-sub,.hero-points{transition:font-size .26s ease,line-height .26s ease,margin .26s ease,opacity .22s ease,max-height .26s ease,transform .26s ease!important}
body.search-focused .hero{padding:22px 24px!important;border-radius:24px!important}
body.search-focused .hero-title{font-size:clamp(24px,4vw,40px)!important;line-height:1.08!important;margin-bottom:8px!important;letter-spacing:.2px!important}
body.search-focused .hero-lead,body.search-focused .hero-sub,body.search-focused .hero-points{opacity:0!important;max-height:0!important;margin:0!important;overflow:hidden!important;pointer-events:none!important;transform:translateY(-6px)!important}
body.search-focused .search-area{margin-top:10px!important}
body.search-focused .search-box{min-height:58px!important;padding:10px 14px!important;border-radius:18px!important;box-shadow:0 12px 30px rgba(15,48,89,.20)!important}
body.search-focused .search-icon{width:40px!important;height:40px!important;flex-basis:40px!important;font-size:20px!important}
.results-panel,.empty-panel{scroll-margin-top:calc(var(--nav-offset,96px) + 20px)!important}
body.no-results-active #layanan-utama,body.no-results-active #layanan,body.no-results-active #kenapa-pilih,body.no-results-active #testimoni,body.no-results-active #faq,body.no-results-active .footer{display:none!important}
.wa-float{display:grid!important;position:fixed!important;z-index:60000!important;right:calc(env(safe-area-inset-right,0px) + clamp(12px,2.5vw,22px))!important;bottom:calc(env(safe-area-inset-bottom,0px) + clamp(14px,3vw,24px))!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
@media (min-width:769px){.navbar .menu{opacity:1!important;max-height:none!important;transform:none!important;pointer-events:auto!important}.search-area .search-suggestions{max-height:min(30vh,310px)!important}}
@media (max-width:768px){:root{--navbar-top:8px}.container{padding-top:calc(var(--nav-offset,96px) + 12px)!important}.navbar{width:calc(100vw - 12px)!important;padding:10px!important;border-radius:18px!important;gap:8px!important;align-items:flex-start!important}.navbar .brand{width:100%!important;transition:gap .26s ease}.navbar .brand-logo{transition:width .26s ease,height .26s ease,flex-basis .26s ease}.navbar .brand-title,.navbar .brand-sub{transition:font-size .26s ease,line-height .26s ease}.navbar .menu{max-height:240px;opacity:1;overflow:hidden;transform:translateY(0);transition:max-height .34s ease,opacity .24s ease,transform .28s ease,margin .28s ease!important}.navbar .menu a{transition:background-color .2s ease,color .2s ease,opacity .24s ease,transform .24s ease!important}body.is-scrolled .navbar .menu,body.search-focused .navbar .menu{max-height:0!important;opacity:0!important;transform:translateY(-10px)!important;pointer-events:none!important;margin:0!important}body.is-scrolled .navbar,body.search-focused .navbar{padding:9px 10px!important;border-radius:17px!important}body.is-scrolled .brand-logo,body.search-focused .brand-logo{width:42px!important;height:42px!important;flex-basis:42px!important}body.is-scrolled .brand-title,body.search-focused .brand-title{font-size:14px!important;line-height:1.08!important}body.is-scrolled .brand-sub,body.search-focused .brand-sub{font-size:10px!important;line-height:1.18!important}.hero{border-radius:20px!important}.hero-title{font-size:clamp(28px,8vw,36px)!important}.search-area{margin-top:14px}.search-area .search-suggestions{max-height:min(32dvh,270px)!important}.suggestion-item{min-height:48px!important}body.search-focused .hero{padding:14px 10px!important;border-radius:18px!important}body.search-focused .hero-title{font-size:22px!important;line-height:1.08!important;margin-bottom:6px!important}body.search-focused .search-area{margin-top:8px!important}body.search-focused .search-box{min-height:56px!important;padding:9px 10px!important}.wa-float{width:58px!important;height:58px!important}.wa-float svg{width:34px!important;height:34px!important}}
@media (max-width:420px){.navbar{width:calc(100vw - 8px)!important}.container{padding-top:calc(var(--nav-offset,90px) + 10px)!important}.search-area .search-suggestions{max-height:min(30dvh,240px)!important}.suggestion-item{padding:10px 9px!important;font-size:13px!important}.hero-title{font-size:28px!important}body.search-focused .hero-title{font-size:20px!important}}
@media (prefers-reduced-motion:reduce){.navbar,.navbar *,.hero,.hero *,.search-area,.search-box{transition:none!important}}

/* ===== PATCH 20260508d: Focus langsung aktif di Chrome/HP + navbar soft compact ===== */
.navbar{
  position:fixed!important;
  top:calc(env(safe-area-inset-top,0px) + var(--navbar-top,12px))!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(calc(100vw - 24px),var(--wrap))!important;
  max-width:var(--wrap)!important;
  z-index:99999!important;
  margin:0!important;
  transition:padding .32s ease,border-radius .32s ease,box-shadow .32s ease,background-color .32s ease!important;
}
.container{padding-top:calc(var(--nav-offset,96px) + 18px)!important}
.search-area{position:relative!important;width:min(100%,860px)!important;margin:24px auto 0!important;transition:margin .28s ease!important;z-index:30!important}
.search-area .search-box{position:relative!important;width:100%!important;margin:0!important;z-index:2!important;transition:min-height .28s ease,padding .28s ease,border-radius .28s ease,box-shadow .28s ease!important}
.search-area .search-suggestions,
body.mobile-suggestions-open .search-area .search-suggestions{
  position:static!important;
  display:none;
  width:100%!important;
  max-width:100%!important;
  margin:10px 0 0!important;
  max-height:min(30vh,320px)!important;
  overflow-y:auto!important;
  background:#fff!important;
  border:1px solid #dbeafe!important;
  border-radius:18px!important;
  box-shadow:0 18px 44px rgba(15,48,89,.20)!important;
  z-index:1!important;
}
.search-area .search-suggestions.is-open{display:block!important}

body.search-focused .hero,
body:has(#searchInput:focus) .hero{
  padding:22px 24px!important;
  border-radius:24px!important;
  transition:padding .28s ease,border-radius .28s ease!important;
}
body.search-focused .hero-title,
body:has(#searchInput:focus) .hero-title{
  display:block!important;
  font-size:clamp(24px,4vw,40px)!important;
  line-height:1.08!important;
  margin-bottom:8px!important;
  transition:font-size .28s ease,margin .28s ease!important;
}
body.search-focused .hero-lead,
body.search-focused .hero-sub,
body.search-focused .hero-points,
body:has(#searchInput:focus) .hero-lead,
body:has(#searchInput:focus) .hero-sub,
body:has(#searchInput:focus) .hero-points{
  opacity:0!important;
  max-height:0!important;
  margin:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  transform:translateY(-8px)!important;
  transition:opacity .18s ease,max-height .24s ease,margin .24s ease,transform .24s ease!important;
}
body.search-focused .search-area,
body:has(#searchInput:focus) .search-area{margin-top:10px!important}
body.search-focused .search-box,
body:has(#searchInput:focus) .search-box{
  min-height:58px!important;
  padding:10px 14px!important;
  border-radius:18px!important;
  box-shadow:0 12px 30px rgba(15,48,89,.20)!important;
}

/* Hasil tidak ditemukan: bagian bawah disembunyikan agar fokus ke CTA. */
body.empty-focus #layanan-utama,
body.empty-focus #layanan,
body.empty-focus #kenapa-pilih,
body.empty-focus #testimoni,
body.empty-focus #faq,
body.empty-focus .footer{display:none!important}

@media (max-width:768px){
  :root{--navbar-top:8px}
  .container{padding-top:calc(var(--nav-offset,148px) + 12px)!important}
  .navbar{
    width:calc(100vw - 12px)!important;
    border-radius:18px!important;
    padding:10px!important;
    gap:8px!important;
    align-items:flex-start!important;
  }
  .navbar .brand{width:100%!important;transition:gap .32s ease!important}
  .navbar .brand-logo{transition:width .32s ease,height .32s ease,flex-basis .32s ease!important}
  .navbar .brand-title,.navbar .brand-sub{transition:font-size .32s ease,line-height .32s ease!important}
  .navbar .menu{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    max-height:250px!important;
    opacity:1!important;
    transform:translateY(0)!important;
    overflow:hidden!important;
    visibility:visible!important;
    pointer-events:auto!important;
    margin-top:0!important;
    transition:max-height .42s cubic-bezier(.22,1,.36,1),opacity .30s ease,transform .36s ease,margin .36s ease,visibility 0s linear 0s!important;
  }
  body.is-scrolled .navbar .menu,
  body.search-focused .navbar .menu,
  body:has(#searchInput:focus) .navbar .menu{
    display:grid!important;
    max-height:0!important;
    opacity:0!important;
    transform:translateY(-12px)!important;
    visibility:hidden!important;
    pointer-events:none!important;
    margin-top:-8px!important;
    transition:max-height .46s cubic-bezier(.22,1,.36,1),opacity .32s ease,transform .38s ease,margin .38s ease,visibility 0s linear .46s!important;
  }
  body.is-scrolled .navbar,
  body.search-focused .navbar,
  body:has(#searchInput:focus) .navbar{
    padding:8px 10px!important;
    border-radius:16px!important;
  }
  body.is-scrolled .brand-logo,
  body.search-focused .brand-logo,
  body:has(#searchInput:focus) .brand-logo{width:42px!important;height:42px!important;flex-basis:42px!important}
  body.is-scrolled .brand-title,
  body.search-focused .brand-title,
  body:has(#searchInput:focus) .brand-title{font-size:14px!important;line-height:1.08!important}
  body.is-scrolled .brand-sub,
  body.search-focused .brand-sub,
  body:has(#searchInput:focus) .brand-sub{font-size:10px!important;line-height:1.18!important;white-space:normal!important}

  body.search-focused .hero,
  body:has(#searchInput:focus) .hero{
    padding:12px 10px 14px!important;
    border-radius:18px!important;
  }
  body.search-focused .hero-title,
  body:has(#searchInput:focus) .hero-title{
    font-size:22px!important;
    line-height:1.08!important;
    margin:0 0 6px!important;
  }
  body.search-focused .search-area,
  body:has(#searchInput:focus) .search-area{margin-top:8px!important}
  body.search-focused .search-box,
  body:has(#searchInput:focus) .search-box{min-height:56px!important;padding:9px 10px!important}
  .search-area .search-suggestions{max-height:min(28dvh,250px)!important;margin-top:8px!important}
  .results-panel{scroll-margin-top:calc(var(--nav-offset,70px) + 10px)!important}
  .empty-panel{scroll-margin-top:calc(var(--nav-offset,70px) + 10px)!important}
  .wa-float{z-index:100000!important}
}
@media (max-width:420px){
  .container{padding-top:calc(var(--nav-offset,142px) + 10px)!important}
  body.search-focused .hero-title,
  body:has(#searchInput:focus) .hero-title{font-size:20px!important}
  .search-area .search-suggestions{max-height:min(26dvh,225px)!important}
}
html{scroll-padding-top:calc(var(--nav-offset,96px) + 14px)!important}
body.no-results-active #cara-akses,
body.no-results-active #layanan-utama,
body.no-results-active #layanan,
body.no-results-active #kenapa-pilih,
body.no-results-active #testimoni,
body.no-results-active #faq,
body.no-results-active .footer{display:none!important}


/* ===== PATCH 20260508e: keep compact hero visible + 3x2 service/why layout ===== */
.search-area{position:relative!important;width:min(100%,860px)!important;margin:24px auto 0!important}
.search-suggestions{position:absolute!important;left:0!important;right:0!important;top:calc(100% + 8px)!important;width:100%!important;z-index:56000!important}
body.search-focused .hero,
body:has(#searchInput:focus) .hero{padding:18px 24px 20px!important}
body.search-focused .hero-title,
body:has(#searchInput:focus) .hero-title{display:block!important;opacity:1!important;max-height:none!important;transform:none!important;visibility:visible!important}
@media (min-width:769px){
  body.search-focused .hero,
  body:has(#searchInput:focus) .hero{padding:20px 26px 22px!important;min-height:auto!important}
  body.search-focused .hero-title,
  body:has(#searchInput:focus) .hero-title{font-size:clamp(28px,4.2vw,42px)!important;margin:0 0 10px!important}
  body.search-focused .search-area,
  body:has(#searchInput:focus) .search-area{margin-top:10px!important}
  #layanan .grid-3,
  #kenapa-pilih .grid-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
}
@media (min-width:769px) and (max-width:1100px){
  #layanan .grid-3,
  #kenapa-pilih .grid-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media (max-width:768px){
  body.search-focused .hero,
  body:has(#searchInput:focus) .hero{padding:16px 10px 16px!important}
  body.search-focused .hero-title,
  body:has(#searchInput:focus) .hero-title{font-size:22px!important;line-height:1.08!important;margin:0 0 8px!important}
  body.search-focused .search-area,
  body:has(#searchInput:focus) .search-area{margin-top:8px!important}
  #layanan .grid-3,
  #kenapa-pilih .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
}
@media (max-width:560px){
  #layanan .grid-3,
  #kenapa-pilih .grid-3{grid-template-columns:1fr!important}
}


/* ===== PATCH 20260508f: mobile navbar no-overlap + safe search focus + more suggestions ===== */
/* HP: ketika menu navbar penuh, layout diberi ruang cukup agar hero tidak pernah tertutup navbar fixed. */
@media (max-width:768px){
  .container{
    padding-top:calc(var(--nav-expanded-offset, 354px) + env(safe-area-inset-top,0px))!important;
    transition:padding-top .32s ease!important;
  }
  body.is-scrolled .container,
  body.search-focused .container,
  body:has(#searchInput:focus) .container{
    padding-top:calc(var(--nav-compact-offset, 74px) + env(safe-area-inset-top,0px))!important;
  }
  .navbar{
    max-height:none!important;
  }
}

/* Mode fokus pencarian: judul compact tetap terlihat, teks panjang sembunyi, input naik. */
body.search-focused .hero,
body:has(#searchInput:focus) .hero{
  overflow:visible!important;
}
body.search-focused .hero-title,
body:has(#searchInput:focus) .hero-title{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  max-height:none!important;
  transform:none!important;
}
body.search-focused .hero-lead,
body.search-focused .hero-sub,
body.search-focused .hero-points,
body:has(#searchInput:focus) .hero-lead,
body:has(#searchInput:focus) .hero-sub,
body:has(#searchInput:focus) .hero-points{
  opacity:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

/* Suggestion selalu di bawah search box, lebih banyak terlihat dan tetap bisa discroll. */
.search-area{position:relative!important;z-index:20!important}
.search-suggestions{
  top:calc(100% + 8px)!important;
  z-index:65000!important;
  max-height:min(54vh, 430px)!important;
}
@media (max-width:768px){
  .search-suggestions{
    max-height:min(42dvh, 360px)!important;
  }
}

/* Saat input sedang disentuh/fokus, cegah click tidak sengaja ke kartu dokumen di bawahnya. */
body.search-activating .doc-link{
  pointer-events:none!important;
}

/* Desktop: layanan dan kenapa pilih tetap 3 kotak atas + 3 kotak bawah. */
@media (min-width:769px){
  #layanan .grid-3,
  #kenapa-pilih .grid-3{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:14px!important;
  }
}
@media (max-width:768px) and (min-width:561px){
  #layanan .grid-3,
  #kenapa-pilih .grid-3{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


/* ===== PATCH 20260508g: scroll bebas saat search focus, navbar tidak menutup hero, suggestion full, testimoni center ===== */
html{scroll-padding-top:calc(var(--nav-offset,96px) + 18px)!important}
body.search-focused{overflow-y:auto!important;touch-action:pan-y!important}
.search-area{overflow:visible!important}
.search-suggestions{max-height:min(62vh,560px)!important;overflow-y:auto!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important}
.testimonials-controls{justify-content:center!important;align-items:center!important}
@media (min-width:769px){
  .testimonials-controls{justify-content:center!important}
}
@media (max-width:768px){
  /* navbar full di HP cukup tinggi; content selalu dimulai di bawah navbar */
  .container{padding-top:calc(var(--nav-expanded-offset, 360px) + 18px + env(safe-area-inset-top,0px))!important}
  body.is-scrolled .container,
  body.search-focused .container,
  body:has(#searchInput:focus) .container{padding-top:calc(var(--nav-compact-offset, 84px) + 14px + env(safe-area-inset-top,0px))!important}
  .hero{scroll-margin-top:calc(var(--nav-offset,96px) + 22px)!important}
  .search-suggestions{max-height:min(52dvh,460px)!important}
  .testimonials-controls{justify-content:center!important}
}
@media (max-width:420px){
  .container{padding-top:calc(var(--nav-expanded-offset, 360px) + 18px + env(safe-area-inset-top,0px))!important}
  body.is-scrolled .container,
  body.search-focused .container,
  body:has(#searchInput:focus) .container{padding-top:calc(var(--nav-compact-offset, 84px) + 12px + env(safe-area-inset-top,0px))!important}
  .search-suggestions{max-height:min(50dvh,420px)!important}
}


/* === HP PERFORMANCE PATCH 20260508h: stabil tanpa mengubah desain === */
@media (max-width:768px){
  .navbar{will-change:auto!important;contain:layout style!important}
  .hero,.panel,.doc-item,.service-card,.why-card,.mini-card{contain:layout paint!important}
  .search-suggestions{overscroll-behavior:contain!important;scrollbar-gutter:stable!important}
  .search-focused .search-suggestions,.search-suggestions.is-open{max-height:min(52dvh,420px)!important}
  .testimonials-track{will-change:auto!important}
}
@supports (content-visibility:auto){
  @media (max-width:768px){
    #cara-akses,#layanan-utama,#layanan,#kenapa-pilih,#testimoni,#faq,.footer{content-visibility:auto;contain-intrinsic-size:1px 620px}
  }
}


/* === MICRO FIX 20260508i: seluruh area putih search box bisa diklik/tap untuk fokus input === */
.search-box{cursor:text!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent!important}
.search-box .search-icon{pointer-events:none!important;cursor:text!important}
.search-box input{cursor:text!important}
.search-box:focus-within{border-color:#cfe5ff!important}


/* === PATCH 20260519a: perbaikan tap kolom pencarian di HP ===
   Tujuan: seluruh area putih search box menjadi native focus area dan tidak mudah batal saat disentuh. */
.search-area{
  -webkit-tap-highlight-color:transparent!important;
}
.search-box{
  cursor:text!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.search-box .search-icon{
  pointer-events:none!important;
}
.search-box input{
  display:block!important;
  flex:1 1 auto!important;
  width:100%!important;
  min-width:0!important;
  min-height:44px!important;
  height:44px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  -webkit-user-select:text!important;
  user-select:text!important;
}
@media (max-width:768px){
  .search-area .search-box{
    min-height:64px!important;
    padding:10px 12px!important;
    align-items:center!important;
    position:relative!important;
    z-index:10!important;
  }
  .search-box input{
    font-size:16px!important;
    line-height:44px!important;
    padding:0 2px!important;
    -webkit-appearance:none!important;
    appearance:none!important;
  }
  .hero-points{
    position:relative!important;
    z-index:0!important;
  }
}

/* =========================================================
   FINAL FIX 20260521c — Mobile scroll restored + search anti-lag
   Fokus perbaikan: halaman HP tetap bisa discroll, dan klik kolom
   pencarian tidak memicu animasi/layout besar saat keyboard terbuka.
   ========================================================= */
@media (max-width:768px){
  html,
  body{
    height:auto!important;
    min-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    touch-action:auto!important;
    overscroll-behavior-y:auto!important;
  }

  body.search-focused,
  body:has(#searchInput:focus){
    overflow-y:auto!important;
    touch-action:auto!important;
  }

  .container{
    overflow:visible!important;
  }

  .navbar,
  .hero,
  .search-area,
  .search-box,
  .search-suggestions,
  .brand-logo,
  .brand-title,
  .brand-sub,
  .hero-title,
  .hero-lead,
  .hero-sub,
  .hero-points,
  .doc-item,
  .wa-float{
    transition:none!important;
    animation:none!important;
  }

  .navbar{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  /* Saat input aktif, jangan kunci scroll halaman. Tetap gunakan jarak compact
     agar hero tidak tertutup navbar, tetapi tanpa animasi patah-patah. */
  body:has(#searchInput:focus) .container{
    padding-top:calc(var(--nav-compact-offset,84px) + 14px + env(safe-area-inset-top,0px))!important;
  }

  body:has(#searchInput:focus) .navbar .menu{
    max-height:0!important;
    opacity:0!important;
    pointer-events:none!important;
    margin:0!important;
    overflow:hidden!important;
  }

  body:has(#searchInput:focus) .hero{
    padding:16px 10px!important;
    border-radius:18px!important;
    overflow:visible!important;
  }

  body:has(#searchInput:focus) .hero-title{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    max-height:none!important;
    transform:none!important;
    font-size:22px!important;
    line-height:1.08!important;
    margin:0 0 8px!important;
  }

  body:has(#searchInput:focus) .hero-lead,
  body:has(#searchInput:focus) .hero-sub,
  body:has(#searchInput:focus) .hero-points{
    opacity:0!important;
    max-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  body:has(#searchInput:focus) .search-area{
    margin-top:8px!important;
  }

  .search-suggestions,
  .search-suggestions.is-open,
  .mobile-suggestions-open .search-suggestions{
    max-height:min(34dvh,280px)!important;
    overflow-y:auto!important;
    overscroll-behavior:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .search-box{
    box-shadow:0 8px 18px rgba(15,48,89,.12)!important;
  }

  .menu a:hover,
  .menu a:focus-visible,
  .doc-link:hover .doc-item,
  .doc-link:focus-visible .doc-item,
  .primary-cta:hover,
  .wa-button:hover,
  .ig-button:hover,
  .wa-float:hover{
    transform:none!important;
  }
}
@media (max-width:420px){
  body:has(#searchInput:focus) .container{
    padding-top:calc(var(--nav-compact-offset,84px) + 12px + env(safe-area-inset-top,0px))!important;
  }
}


/* =========================================================
   MOBILE FIX v20260522 — Hamburger menu + layout stabil
   Perbaikan: navbar tidak makan tempat, padding-top akurat,
   menu toggle, search focus bersih tanpa layout chaos.
   ========================================================= */

/* — Hamburger button: sembunyikan di desktop — */
.nav-toggle {
  display: none;
}

@media (max-width: 768px) {
  /* 1. Reset --nav-expanded-offset ke nilai realistis agar tidak ada gap raksasa */
  :root {
    --nav-compact-offset: 68px;
    --nav-expanded-offset: 68px;
  }

  /* 2. Hamburger button tampil di HP */
  .nav-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    border: none;
    background: var(--blue-soft);
    color: var(--navy);
    border-radius: 12px;
    cursor: pointer;
    flex-shrink: 0;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    order: 2;
    transition: background-color .18s ease;
  }

  .nav-toggle:hover,
  .nav-toggle:focus-visible {
    background: #cfe5ff;
  }

  .nav-toggle .icon-hamburger {
    width: 22px;
    height: 22px;
    display: block;
    overflow: visible;
  }

  /* Animasi X saat menu terbuka */
  .nav-toggle .hb-l1,
  .nav-toggle .hb-l2,
  .nav-toggle .hb-l3 {
    transform-origin: center;
    transition: transform .22s ease, opacity .18s ease;
  }

  .nav-toggle.is-open .hb-l1 {
    transform: rotate(45deg) translate(4px, 6px);
  }
  .nav-toggle.is-open .hb-l2 {
    opacity: 0;
    transform: scaleX(0);
  }
  .nav-toggle.is-open .hb-l3 {
    transform: rotate(-45deg) translate(4px, -6px);
  }

  /* 3. Brand mengambil sisa ruang, toggle di kanan */
  .navbar .brand {
    flex: 1 1 auto !important;
    order: 1 !important;
    width: auto !important;
  }

  /* 4. Menu DISEMBUNYIKAN default di HP — hanya tampil saat .is-menu-open */
  /* Override SEMUA patch lama yang mengatur menu di mobile */
  .navbar .menu,
  body.is-scrolled .navbar .menu,
  body.search-focused .navbar .menu,
  body:has(#searchInput:focus) .navbar .menu {
    display: none !important;
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: none !important;
    overflow: hidden !important;
    margin: 0 !important;
    transition: none !important;
  }

  /* Menu terbuka via hamburger */
  .navbar .menu.is-menu-open {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    width: 100% !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    overflow: visible !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    order: 3 !important;
  }

  .navbar .menu.is-menu-open .whatsapp-link {
    grid-column: 1 / -1 !important;
  }

  /* 5. Navbar jadi satu baris (brand + toggle), layout bersih */
  .navbar {
    flex-wrap: wrap !important;
    align-items: center !important;
  }

  /* 6. Container padding-top: gunakan compact offset karena menu hidden by default */
  .container,
  body.is-scrolled .container,
  body.search-focused .container,
  body:has(#searchInput:focus) .container {
    padding-top: calc(var(--nav-compact-offset, 68px) + 14px + env(safe-area-inset-top, 0px)) !important;
    transition: padding-top .22s ease !important;
  }

  /* Saat menu terbuka, padding menyesuaikan navbar yang lebih tinggi */
  body.nav-menu-open .container {
    padding-top: calc(var(--nav-expanded-offset, 68px) + 14px + env(safe-area-inset-top, 0px)) !important;
  }

  /* 7. Nonaktifkan search-focus layout shift di HP — terlalu laggy */
  body.search-focused .hero,
  body:has(#searchInput:focus) .hero {
    padding: var(--hero-pad, 16px 10px) !important;
    border-radius: 20px !important;
  }

  body.search-focused .hero-lead,
  body.search-focused .hero-sub,
  body.search-focused .hero-points,
  body:has(#searchInput:focus) .hero-lead,
  body:has(#searchInput:focus) .hero-sub,
  body:has(#searchInput:focus) .hero-points {
    display: block !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    margin: revert !important;
  }

  /* 8. Search suggestion tetap di bawah search box, bersih */
  .search-area {
    position: relative !important;
    z-index: 20 !important;
  }

  .search-suggestions {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    width: 100% !important;
    z-index: 65000 !important;
    max-height: min(40dvh, 320px) !important;
  }
}

/* Reduced motion override */
@media (prefers-reduced-motion: reduce) {
  .nav-toggle .hb-l1,
  .nav-toggle .hb-l2,
  .nav-toggle .hb-l3 {
    transition: none !important;
  }
}


/* =========================================================
   FINAL OVERRIDE 20260522d — Mobile anti-gap & anti-jank
   Catatan: blok ini sengaja diletakkan paling akhir untuk
   menetralkan patch lama yang masih aktif di mobile.
   ========================================================= */
@media (max-width: 768px) {
  :root {
    --nav-compact-offset: 68px !important;
  }

  html,
  body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: auto !important;
    min-height: 100% !important;
    touch-action: pan-y !important;
  }

  body {
    padding: 0 !important;
  }

  .container,
  body.is-scrolled .container,
  body.search-focused .container,
  body:has(#searchInput:focus) .container,
  body.nav-menu-open .container {
    padding-top: calc(76px + env(safe-area-inset-top, 0px)) !important;
    transition: none !important;
  }

  .navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 0 0 18px 18px !important;
    background: #fff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: 0 8px 20px rgba(15, 48, 89, .12) !important;
    z-index: 50000 !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .brand {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    gap: 8px !important;
  }

  .brand-logo,
  body.is-scrolled .brand-logo,
  body.search-focused .brand-logo {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
  }

  .brand-title,
  body.is-scrolled .brand-title,
  body.search-focused .brand-title {
    font-size: 14px !important;
    line-height: 1.08 !important;
  }

  .brand-sub,
  body.is-scrolled .brand-sub,
  body.search-focused .brand-sub {
    font-size: 10px !important;
    line-height: 1.18 !important;
    white-space: normal !important;
  }

  .nav-toggle {
    display: flex !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    order: 2 !important;
  }

  .navbar .menu,
  body.is-scrolled .navbar .menu,
  body.search-focused .navbar .menu,
  body:has(#searchInput:focus) .navbar .menu {
    display: none !important;
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    transition: none !important;
    overflow: hidden !important;
  }

  .navbar .menu.is-menu-open {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 6px !important;
    order: 3 !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    margin: 8px 0 0 !important;
    overflow: visible !important;
  }

  .navbar .menu.is-menu-open .whatsapp-link {
    grid-column: 1 / -1 !important;
  }

  .hero,
  .panel,
  .doc-item,
  .service-card,
  .why-card,
  .mini-card {
    contain: none !important;
  }

  .hero,
  body.search-focused .hero,
  body:has(#searchInput:focus) .hero {
    padding: 14px 10px !important;
    border-radius: 18px !important;
    overflow: visible !important;
    transition: none !important;
  }

  .hero-title,
  body.search-focused .hero-title,
  body:has(#searchInput:focus) .hero-title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    transform: none !important;
    font-size: 23px !important;
    line-height: 1.08 !important;
    margin: 0 0 8px !important;
    transition: none !important;
  }

  .hero-lead,
  .hero-sub,
  .hero-points,
  body.search-focused .hero-lead,
  body.search-focused .hero-sub,
  body.search-focused .hero-points,
  body:has(#searchInput:focus) .hero-lead,
  body:has(#searchInput:focus) .hero-sub,
  body:has(#searchInput:focus) .hero-points {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    padding: 0 !important;
    transition: none !important;
  }

  .hero-lead,
  body:has(#searchInput:focus) .hero-lead {
    margin: 0 auto !important;
    font-size: 13px !important;
    line-height: 1.42 !important;
  }

  .hero-sub,
  body:has(#searchInput:focus) .hero-sub {
    margin: 8px auto 0 !important;
    font-size: 12.5px !important;
    line-height: 1.42 !important;
  }

  .hero-points,
  body:has(#searchInput:focus) .hero-points {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin: 10px 0 0 !important;
  }

  .hero-point:last-child {
    grid-column: 1 / -1 !important;
  }

  .search-area,
  body.search-focused .search-area,
  body:has(#searchInput:focus) .search-area {
    position: relative !important;
    z-index: 20 !important;
    margin-top: 10px !important;
    transition: none !important;
  }

  .search-box,
  body.search-focused .search-box,
  body:has(#searchInput:focus) .search-box {
    min-height: 54px !important;
    margin-top: 0 !important;
    padding: 8px 10px !important;
    border-radius: 15px !important;
    box-shadow: 0 8px 18px rgba(15, 48, 89, .12) !important;
    transition: none !important;
  }

  .search-suggestions,
  .search-suggestions.is-open,
  .mobile-suggestions-open .search-suggestions {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    width: 100% !important;
    max-height: min(40dvh, 300px) !important;
    z-index: 65000 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .testimonials-track {
    will-change: auto !important;
  }
}


/* =========================================================
   FINAL OVERRIDE 20260522menu — Mobile menu rapi + floating
   - logo dan teks brand di kiri
   - tombol hamburger + tulisan MENU di kanan atas
   - menu dropdown tidak menambah tinggi header
   - navbar tidak menutup judul Cari Dokumen Jawaban
   ========================================================= */
.nav-toggle-label{
  display:none;
}

@media (max-width: 768px){
  :root{
    --nav-compact-offset: 74px !important;
    --nav-expanded-offset: 74px !important;
    --nav-offset: 74px !important;
    --navbar-top: 0px !important;
  }

  html{
    scroll-padding-top: 90px !important;
  }

  body{
    padding: 0 !important;
    overflow-x: hidden !important;
  }

  .container,
  body.nav-menu-open .container,
  body.is-scrolled .container,
  body.search-focused .container,
  body:has(#searchInput:focus) .container{
    padding-top: calc(82px + env(safe-area-inset-top,0px)) !important;
    transition: none !important;
  }

  .navbar,
  body.is-scrolled .navbar,
  body.search-focused .navbar,
  body:has(#searchInput:focus) .navbar{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 74px !important;
    height: auto !important;
    transform: none !important;
    margin: 0 !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    row-gap: 0 !important;
    flex-wrap: nowrap !important;

    padding: 9px 12px !important;
    border-radius: 0 0 16px 16px !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 8px 20px rgba(15,48,89,.12) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    contain: none !important;
    overflow: visible !important;
    z-index: 50000 !important;
  }

  .navbar .brand,
  body.is-scrolled .navbar .brand,
  body.search-focused .navbar .brand,
  body:has(#searchInput:focus) .navbar .brand{
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex: none !important;
    order: 1 !important;
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    justify-self: start !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  .brand-logo,
  body.is-scrolled .brand-logo,
  body.search-focused .brand-logo,
  body:has(#searchInput:focus) .brand-logo{
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
  }

  .brand-copy{
    min-width: 0 !important;
    max-width: calc(100vw - 142px) !important;
  }

  .brand-title,
  body.is-scrolled .brand-title,
  body.search-focused .brand-title,
  body:has(#searchInput:focus) .brand-title{
    font-size: 15px !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
  }

  .brand-sub,
  body.is-scrolled .brand-sub,
  body.search-focused .brand-sub,
  body:has(#searchInput:focus) .brand-sub{
    font-size: 10.2px !important;
    line-height: 1.18 !important;
    white-space: normal !important;
  }

  .nav-toggle,
  body.is-scrolled .nav-toggle,
  body.search-focused .nav-toggle,
  body:has(#searchInput:focus) .nav-toggle{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    justify-self: end !important;
    align-self: center !important;
    order: 2 !important;

    width: 58px !important;
    height: 50px !important;
    min-width: 58px !important;
    padding: 5px 4px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 14px !important;
    background: #e8f2ff !important;
    color: var(--navy) !important;
    box-shadow: 0 4px 12px rgba(15,48,89,.08) !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .nav-toggle .icon-hamburger{
    width: 20px !important;
    height: 20px !important;
    display: block !important;
    margin: 0 !important;
  }

  .nav-toggle-label{
    display: block !important;
    margin-top: 2px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase !important;
    color: var(--navy) !important;
  }

  /* Tetap tampil garis tiga seperti contoh foto, tidak berubah jadi X. */
  .nav-toggle.is-open .hb-l1,
  .nav-toggle.is-open .hb-l2,
  .nav-toggle.is-open .hb-l3{
    transform: none !important;
    opacity: 1 !important;
  }

  .navbar .menu,
  body.is-scrolled .navbar .menu,
  body.search-focused .navbar .menu,
  body:has(#searchInput:focus) .navbar .menu{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    max-height: none !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    transition: none !important;
  }

  .navbar .menu.is-menu-open,
  body.is-scrolled .navbar .menu.is-menu-open,
  body.search-focused .navbar .menu.is-menu-open,
  body:has(#searchInput:focus) .navbar .menu.is-menu-open{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-height: calc(100dvh - 100px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    background: #ffffff !important;
    border: 1px solid var(--line) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 34px rgba(15,48,89,.18) !important;
    padding: 12px !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 65000 !important;
  }

  .navbar .menu.is-menu-open .whatsapp-link{
    grid-column: 1 / -1 !important;
  }

  .navbar .menu.is-menu-open a{
    width: 100% !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 10px 8px !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    border-radius: 14px !important;
  }

  .hero,
  body.search-focused .hero,
  body:has(#searchInput:focus) .hero{
    padding-top: 16px !important;
    overflow: visible !important;
    scroll-margin-top: 90px !important;
  }

  .hero-title,
  body.search-focused .hero-title,
  body:has(#searchInput:focus) .hero-title{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 23px !important;
    line-height: 1.08 !important;
    margin: 0 0 8px !important;
  }

  .results-panel,
  .empty-panel{
    scroll-margin-top: 90px !important;
  }
}