/* Mr Lock — V14 design. Brand colors and font come from admin settings
   (--accent, --bg, --ink, --font are printed by the layout). */
@font-face{font-family:NotoKufi;src:url('/assets/fonts/NotoKufi-400.woff') format('woff'),url('/assets/fonts/NotoKufi-400.ttf') format('truetype');font-display:swap;font-weight:400}
@font-face{font-family:NotoKufi;src:url('/assets/fonts/NotoKufi-600.woff') format('woff'),url('/assets/fonts/NotoKufi-600.ttf') format('truetype');font-display:swap;font-weight:600}
@font-face{font-family:NotoKufi;src:url('/assets/fonts/NotoKufi-700.woff') format('woff'),url('/assets/fonts/NotoKufi-700.ttf') format('truetype');font-display:swap;font-weight:700}
@font-face{font-family:NotoKufi;src:url('/assets/fonts/NotoKufi-800.woff') format('woff'),url('/assets/fonts/NotoKufi-800.ttf') format('truetype');font-display:swap;font-weight:800}

/* ---------- Tokens ---------- */
:root{
 --accent:#FFC800;--bg:#FFFFFF;--ink:#454545;--font:NotoKufi,Tahoma,Arial,sans-serif;
 --navy:#172B42;--navy-2:#10213A;--navy-3:#223A57;--on-accent:#172B42;--heading:#172B42;
 --muted:#5E6B7A;--surface:#FFFFFF;--soft:#F5F7FA;--soft-2:#EEF2F6;--tint:#FFF8DC;--tint-line:#F5E3A3;
 --line:#E1E7EE;--line-soft:#EDF1F5;--focus:#2464A0;--link-hover:#8A6400;--whatsapp:#168A4E;--whatsapp-dark:#12703F;
 --r-sm:10px;--r:14px;--r-lg:20px;--r-xl:28px;--pill:999px;
 --sh-sm:0 2px 10px #172B420A;--sh:0 12px 32px #172B4214;--sh-lg:0 24px 60px #172B421F;
 --section-y:84px;--gap:24px;--container:1240px;--gutter:72px;--header-h:84px
}
@media(max-width:1100px){:root{--header-h:74px;--gap:18px;--section-y:68px}}
@media(max-width:820px){:root{--gutter:40px;--section-y:56px}}
@media(max-width:600px){:root{--gutter:32px;--section-y:44px;--gap:14px;--header-h:66px;--r:12px;--r-lg:16px;--r-xl:20px}}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 20px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.95}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button,a,input,textarea,summary,select{-webkit-tap-highlight-color:transparent}
a,button,summary{touch-action:manipulation}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
img{max-width:100%;height:auto}
h1,h2,h3{color:var(--heading);overflow-wrap:anywhere;margin-top:0}
h1{font-size:clamp(30px,3.6vw,50px);line-height:1.5;letter-spacing:-1px;font-weight:800;margin:14px 0}
h2{font-size:clamp(24px,2.5vw,36px);line-height:1.55;letter-spacing:-.6px;font-weight:800;margin:8px 0 12px}
h3{font-size:18px;line-height:1.8;font-weight:700;margin:0 0 8px}
.container{width:min(var(--container),calc(100% - var(--gutter)));margin-inline:auto}
.icon{width:24px;height:24px;flex-shrink:0}
.ui-arrow{width:18px;height:18px;flex:0 0 18px}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip:focus{position:fixed;top:10px;right:10px;padding:12px;background:var(--accent);color:var(--on-accent);z-index:100;border-radius:var(--r-sm)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;border-radius:12px;min-height:48px;padding:11px 22px;background:var(--accent);color:var(--on-accent);font-size:14px;line-height:1.6;font-weight:700;cursor:pointer;text-align:center;white-space:nowrap;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;box-shadow:0 6px 16px #D4A20026}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px #D4A20038}
.btn .icon{width:20px;height:20px}
.btn-sm{min-height:42px;padding:8px 16px;font-size:13px}
.btn-lg{min-height:56px;padding:14px 28px;font-size:15px;border-radius:14px}
.outline{background:#fff;color:var(--heading);border-color:var(--line);box-shadow:none}
.outline:hover{border-color:var(--accent);box-shadow:var(--sh-sm)}
.btn-whatsapp{background:var(--whatsapp);border-color:var(--whatsapp);color:#fff;box-shadow:0 6px 16px #168A4E26}
.btn-whatsapp:hover{background:var(--whatsapp-dark);box-shadow:0 12px 24px #168A4E38}
.btn-ghost{background:#FFFFFF14;color:#fff;border-color:#FFFFFF40;box-shadow:none}
.btn-ghost:hover{background:#FFFFFF26;box-shadow:none}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:26px}
.text-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;line-height:1.8;min-height:44px;color:var(--heading)}
.text-link:hover{color:var(--link-hover)}
.text-link:hover .ui-arrow{transform:translateX(-3px)}
.text-link .ui-arrow{transition:transform .2s}
.eyebrow-pill{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:var(--pill);background:var(--tint);border:1px solid var(--tint-line);color:#7A5A00;font-size:13px;font-weight:700;line-height:1.8}
.eyebrow-pill .icon{width:16px;height:16px}
.notice{padding:14px 16px;background:#FFF5D5;border:1px solid #EED78C;border-radius:var(--r-sm);font-size:14px;margin-bottom:18px}
.notice p{margin:3px 0}
.notice-success{background:#E9F6EE;border-color:#A9D8BA;color:#1D5A36}
.notice-error{background:#FFF0F0;border-color:#EDB9B9;color:#8A2A2A}
.empty-state{padding:30px;background:var(--soft);border:1px dashed #CFD8E3;border-radius:var(--r);color:var(--muted);text-align:center}

/* ---------- Forms ---------- */
label{display:block;font-size:14px;font-weight:600;color:var(--heading);margin-bottom:16px}
input,textarea,select{display:block;width:100%;padding:12px 15px;background:var(--soft);border:1px solid var(--line);border-radius:12px;color:var(--ink);margin-top:7px;font-size:16px;line-height:1.8;transition:border-color .2s,background .2s,box-shadow .2s}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px #FFC80033}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:#D98B8B;background:#FFF8F8}
textarea{resize:vertical;min-height:130px}
.check{display:flex;align-items:flex-start;gap:10px;font-size:13px!important;font-weight:400!important;line-height:1.9;color:var(--muted)!important}
.check input{width:18px;height:18px;flex-shrink:0;accent-color:#C79A00;margin-top:4px}

/* ---------- Topbar & header ---------- */
.topbar{background:var(--navy);color:#C9D3DF;font-size:12.5px;line-height:1.6}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:40px}
.topbar-links{display:flex;align-items:center;gap:22px}
.topbar-links a,.topbar-links span{display:inline-flex;align-items:center;gap:7px}
.topbar-links a:hover{color:var(--accent)}
.topbar .icon{width:15px;height:15px;color:var(--accent)}
.site-header{position:sticky;top:0;z-index:40;background:#FFFFFFF2;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft);transition:box-shadow .2s}
.site-header.is-scrolled{box-shadow:0 6px 24px #172B4212}
.header-inner{height:var(--header-h);display:flex;align-items:center;gap:28px}
.brand{display:inline-flex;align-items:center;gap:12px;flex-shrink:0}
.brand-icon{display:grid;place-items:center;color:var(--navy);background:var(--accent);width:48px;height:48px;border-radius:14px;box-shadow:0 6px 14px #D4A20033}
.brand-icon .icon{width:27px;height:27px;transform:rotate(-10deg)}
.brand-name strong{display:block;font-size:24px;font-weight:800;line-height:1.4;white-space:nowrap;color:var(--heading)}
.brand-name small{display:block;font:700 10px Arial,sans-serif;letter-spacing:4px;color:#7A8797;text-align:center;margin-top:2px}
.brand>img{max-width:170px;max-height:60px;width:auto;height:52px;object-fit:contain}
.desktop-nav{display:flex;align-items:center;gap:6px;margin-inline:auto;font-size:14.5px;font-weight:600}
.desktop-nav a{padding:8px 12px;border-radius:10px;white-space:nowrap;color:#3B4756;transition:background .2s,color .2s}
.desktop-nav a:hover{background:var(--soft);color:var(--heading)}
.desktop-nav a[aria-current]{color:var(--heading);background:var(--tint);box-shadow:inset 0 -2px 0 var(--accent)}
.header-actions{display:flex;align-items:center;gap:14px;margin-inline-start:auto}
.desktop-nav+.header-actions{margin-inline-start:0}
.header-call{display:flex;align-items:center;gap:10px;line-height:1.35}
.header-call-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--soft);color:var(--heading)}
.header-call-icon .icon{width:19px;height:19px}
.header-call small{display:block;font-size:11px;color:var(--muted)}
.header-call b{font:700 15px Arial,sans-serif;color:var(--heading)}
.header-call:hover .header-call-icon{background:var(--accent)}
.mobile-menu{display:none}
.menu-lines{width:20px;display:grid;gap:5px}
.menu-lines>span{height:2px;background:var(--navy);border-radius:4px;width:20px;transition:transform .2s,opacity .2s}
.mobile-menu[open] .menu-lines>span:first-child{transform:translateY(7px) rotate(45deg)}
.mobile-menu[open] .menu-lines>span:nth-child(2){opacity:0}
.mobile-menu[open] .menu-lines>span:last-child{transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1250px){.header-call{display:none}}
@media(max-width:1100px){
 .desktop-nav,.topbar{display:none}
 .header-actions,.desktop-nav+.header-actions{margin-inline-start:auto}
 .brand-name strong{font-size:22px}.brand-icon{width:44px;height:44px;border-radius:12px}
 .mobile-menu{display:block}
 .mobile-menu summary{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:#fff;list-style:none}
 .mobile-menu summary::-webkit-details-marker{display:none}
 .mobile-menu nav{position:absolute;top:calc(100% + 8px);inset-inline:calc(var(--gutter) / -2 + 8px);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-lg);border-radius:18px;padding:10px;max-height:calc(100svh - 100px);overflow-y:auto}
 .mobile-menu nav>a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 14px;min-height:48px;border-radius:10px;font-size:15px;font-weight:600;color:var(--heading)}
 .mobile-menu nav>a:hover,.mobile-menu nav>a[aria-current]{background:var(--tint)}
 .mobile-menu nav .ui-arrow{color:#9A7A20}
 .mobile-menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 4px 4px;margin-top:6px;border-top:1px solid var(--line-soft)}
 .mobile-menu-actions .btn{min-height:46px;padding:8px 10px}
}
@media(max-width:600px){
 .header-inner{gap:10px}
 .brand{gap:9px}.brand-name strong{font-size:19px}.brand-name small{font-size:8.5px;letter-spacing:3px}
 .brand-icon{width:38px;height:38px;border-radius:11px}.brand-icon .icon{width:22px;height:22px}
 .brand>img{max-width:120px;height:42px}
 .header-cta{display:none}
 .mobile-menu summary{width:44px;height:44px}
}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:radial-gradient(1200px 500px at 85% -10%,#2A4568 0%,transparent 60%),radial-gradient(800px 400px at 0% 110%,#1D3450 0%,transparent 60%),var(--navy);color:#D8E0EA}
.hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(#FFFFFF10 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.hero-inner{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding-block:72px 84px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:var(--pill);background:#FFFFFF12;border:1px solid #FFFFFF26;color:var(--accent);font-size:13px;font-weight:700}
.hero-eyebrow .icon{width:17px;height:17px}
.hero h1{color:#fff;font-size:clamp(32px,4vw,56px);line-height:1.45;margin:20px 0 16px}
.hero-lead{font-size:18px;line-height:2;color:#C6D0DC;max-width:560px;margin:0}
.hero-actions{margin-top:30px}
.hero-points{list-style:none;padding:0;margin:34px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:12px 22px;max-width:560px}
.hero-points li{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;color:#E6ECF3}
.hero-points .icon{width:22px;height:22px;padding:4px;border-radius:50%;background:var(--accent);color:var(--navy);stroke-width:2.6}
.hero-media{position:relative}
.hero-frame{position:relative;border-radius:var(--r-xl);overflow:hidden;box-shadow:0 30px 70px #0006;border:6px solid #FFFFFF14;aspect-ratio:4/3.2}
.hero-frame img{display:block;width:100%;height:100%;object-fit:cover}
.hero-media::before{content:'';position:absolute;inset:-18px auto auto -18px;width:120px;height:120px;border-radius:24px;background:var(--accent);z-index:-1;opacity:.95}
.hero-media{isolation:isolate}
.hero-call-card{position:absolute;bottom:-22px;right:-18px;display:flex;align-items:center;gap:12px;background:#fff;color:var(--heading);padding:12px 18px 12px 22px;border-radius:16px;box-shadow:var(--sh-lg);line-height:1.4}
.hero-call-card>span:first-child{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--accent);color:var(--navy)}
.hero-call-card small{display:block;font-size:11.5px;color:var(--muted)}
.hero-call-card b{font:800 17px Arial,sans-serif}
.image-banner{width:100%;margin:0;line-height:0;background:var(--bg)}
.image-banner>img{display:block;width:100%;height:auto}
.banner-actions{background:#fff;border-bottom:1px solid var(--line-soft)}
.banner-actions .container{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-block:16px}
.banner-actions p{margin:0;font-size:15px;font-weight:600;color:var(--muted)}
.banner-actions .actions{margin:0;gap:10px}
.home-intro{padding-block:40px 0}

/* ---------- Sections ---------- */
.home-section{padding-block:var(--section-y)}
.section-why-us,.section-faq,.section-about{background:var(--soft)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:36px}
.section-head h2{margin:12px 0 8px}
.section-head .section-intro{max-width:640px;color:var(--muted);font-size:16px;line-height:2;margin:0}
.section-head.is-center{flex-direction:column;align-items:center;text-align:center}
.section-head.is-center .section-intro{margin-inline:auto}
.section-link{flex-shrink:0;border:1px solid var(--line);padding:6px 16px;border-radius:var(--pill);background:#fff}
.section-link:hover{border-color:var(--accent)}

/* Cards grid */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}

/* Service card */
.service-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;min-width:0;box-shadow:var(--sh-sm);transition:box-shadow .25s,border-color .25s,transform .25s}
.service-card-media{position:relative;display:block;aspect-ratio:16/10;background:var(--soft-2)}
.service-card-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.service-card-media.is-icon{display:grid;place-items:center;color:var(--heading)}
.service-card-media.is-icon>.icon{width:52px;height:52px;opacity:.4}
.service-card-badge{position:absolute;bottom:-22px;inset-inline-start:20px;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--accent);color:var(--navy);box-shadow:0 8px 18px #D4A20040;border:3px solid #fff}
.service-card-badge .icon{width:22px;height:22px}
.service-card-body{display:flex;flex-direction:column;gap:6px;padding:34px 22px 22px;flex:1}
.service-card h3{font-size:18px;margin:0}
.service-card h3 a:hover{color:var(--link-hover)}
.service-card p{margin:0;font-size:14px;line-height:1.95;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.service-card-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line-soft);margin-top:16px}
.service-card-actions .text-link{font-size:13px;color:#51637A}
@media(hover:hover){.service-card:hover{box-shadow:var(--sh);border-color:#E9CF6B;transform:translateY(-4px)}.service-card:hover .service-card-media img{transform:scale(1.04)}}

/* Article card */
.article-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;min-width:0;transition:box-shadow .25s,border-color .25s,transform .25s}
.article-card-media{display:block;aspect-ratio:16/9;background:var(--soft-2)}
.article-card-media img{display:block;width:100%;height:100%;object-fit:cover}
.article-card-media.is-icon{display:grid;place-items:center;aspect-ratio:auto;height:88px;background:linear-gradient(135deg,var(--tint),#FFF 70%);color:#B08600;border-bottom:1px solid var(--line-soft)}
.article-card-media.is-icon .icon{width:34px;height:34px}
.article-card-body{display:flex;flex-direction:column;padding:20px 22px 14px;flex:1}
.article-card-label{font-size:12px;font-weight:700;color:#9A7A20;margin-bottom:6px}
.article-card h3{font-size:17px;margin-bottom:8px}
.article-card h3 a:hover{color:var(--link-hover)}
.article-card p{margin:0 0 10px;font-size:14px;color:var(--muted);line-height:1.95;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.article-card .text-link{margin-top:auto;font-size:13px}
@media(hover:hover){.article-card:hover{box-shadow:var(--sh);border-color:#E9CF6B;transform:translateY(-4px)}}

/* Generic card (pages, reviews) */
.card{padding:26px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);display:flex;flex-direction:column;align-items:start;min-width:0}
.card-icon{display:grid;place-items:center;width:50px;height:50px;background:var(--tint);color:#9A7A20;border-radius:var(--r);margin-bottom:16px}
.quote-icon{font:800 40px/1 Georgia,serif;padding-top:10px}
.card p{font-size:15px;color:var(--muted);margin:0}
.card blockquote{margin:0 0 12px;font-size:16px;line-height:2;color:var(--heading)}
.card-image-link{width:calc(100% + 52px);margin:-26px -26px 20px;overflow:hidden;border-radius:var(--r-lg) var(--r-lg) 0 0}
.card-image{display:block;width:100%;height:210px;object-fit:cover}
.work-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.work-card img{display:block;width:100%;height:230px;object-fit:cover}
.work-card figcaption{padding:18px 20px}.work-card p{font-size:14px;margin:0;color:var(--muted)}

/* Features */
.features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.feature{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 24px;text-align:center;transition:transform .25s,box-shadow .25s}
.feature-icon{display:grid;place-items:center;width:62px;height:62px;margin:0 auto 18px;border-radius:18px;background:var(--navy);color:var(--accent);box-shadow:0 10px 22px #172B4226}
.feature-icon .icon{width:28px;height:28px}
.feature h3{font-size:17px}
.feature p{margin:0;font-size:14px;color:var(--muted);line-height:1.95}
@media(hover:hover){.feature:hover{transform:translateY(-4px);box-shadow:var(--sh)}}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);counter-reset:step;position:relative}
.steps::before{content:'';position:absolute;top:34px;inset-inline:16%;height:2px;background:repeating-linear-gradient(to left,var(--accent) 0 10px,transparent 10px 18px);z-index:0}
.step{position:relative;z-index:1;text-align:center;padding:0 12px}
.step-number{display:grid;place-items:center;width:68px;height:68px;margin:0 auto 18px;border-radius:50%;background:#fff;border:3px solid var(--accent);color:var(--heading);font:800 26px Arial,sans-serif;box-shadow:0 8px 20px #D4A20026}
.step h3{font-size:18px}
.step p{margin:0 auto;max-width:320px;font-size:14.5px;color:var(--muted)}

/* Lost help */
.section-lost-help{padding-block:0;margin-block:calc(var(--section-y) * -.25) 0}
.lost-help-box{display:flex;align-items:center;gap:24px;padding:30px 36px;background:linear-gradient(135deg,var(--accent),#FFD84A);border-radius:var(--r-xl);color:var(--navy);box-shadow:0 20px 44px #D4A20033}
.lost-help-box h2{margin:0 0 4px;font-size:clamp(22px,2.2vw,30px)}
.lost-help-box p{margin:0;color:#3B3000;font-size:15px;max-width:720px}
.lost-help-box>div{flex:1}
.lost-help-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:var(--navy);color:var(--accent);flex-shrink:0}
.lost-help-icon .icon{width:30px;height:30px}
.lost-help-box .btn{background:var(--navy);color:#fff;box-shadow:0 10px 22px #172B4233}
.lost-help-box .btn:hover{background:var(--navy-3)}

/* FAQ / accordion */
.faq-split{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.faq-split .section-head{display:block;margin:0;position:sticky;top:calc(var(--header-h) + 24px)}
.faq-split .section-intro{margin-bottom:10px}
.accordion{display:grid;gap:12px}
.accordion details,.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:0;transition:border-color .2s,box-shadow .2s}
.accordion summary,.faq-item summary{cursor:pointer;list-style:none;font-weight:700;color:var(--heading);line-height:1.8;padding:18px 22px;padding-inline-end:60px;position:relative}
.accordion summary::-webkit-details-marker,.faq-item summary::-webkit-details-marker{display:none}
.accordion summary::after,.faq-item summary::after{content:'+';position:absolute;inset-inline-end:18px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--soft);color:var(--heading);font:400 22px/1 Arial,sans-serif;transition:background .2s}
.accordion details[open] summary::after,.faq-item[open] summary::after{content:'−';background:var(--accent)}
.accordion details[open],.faq-item[open]{border-color:#E9CF6B;box-shadow:var(--sh-sm)}
.accordion p,.faq-item p{margin:0;padding:0 22px 20px;color:var(--muted);font-size:15px;line-height:2;white-space:pre-line}
.accordion-page{max-width:900px}

/* About */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:36px 40px;position:relative}
.about-grid::before{content:'';position:absolute;inset-block:36px;inset-inline-start:0;width:4px;border-radius:4px;background:var(--accent)}
.about-grid:has(img){grid-template-columns:1.1fr .9fr;align-items:center}
.about-grid img{width:100%;border-radius:var(--r-lg)}

/* CTA band */
.cta-band{padding-block:0;background:linear-gradient(var(--bg) 50%,var(--navy-2) 50%)}
.cta-band-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:40px 48px;border-radius:var(--r-xl);background:radial-gradient(600px 240px at 90% 0%,#2A4568 0%,transparent 70%),var(--navy);color:#C6D0DC;box-shadow:var(--sh-lg);position:relative;overflow:hidden}
.cta-band-inner::after{content:'';position:absolute;inset-inline-end:-40px;bottom:-60px;width:200px;height:200px;border-radius:50%;border:30px solid #FFC80018}
.cta-band h2{color:#fff;margin:0 0 6px;font-size:clamp(22px,2.3vw,32px)}
.cta-band p{margin:0;max-width:560px}
.cta-band .actions{margin:0;flex-shrink:0;position:relative;z-index:1}
.page-contact .cta-band{display:none}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-2);color:#AEBBCB;padding-top:64px}
.cta-band+.site-footer{padding-top:64px}
.footer-main{display:grid;grid-template-columns:1.3fr .8fr 1fr 1.1fr;gap:40px;padding-bottom:44px}
.site-footer .brand-name strong{color:#fff}
.site-footer .brand-name small{color:#7F90A6}
.footer-identity>p{font-size:14px;line-height:2;max-width:320px;margin:18px 0 0}
.footer-meta{display:flex;align-items:center;gap:8px;margin:10px 0 0!important}
.footer-meta .icon{width:17px;height:17px;color:var(--accent)}
.footer-column h2{font-size:16px;font-weight:800;color:#fff;margin:0 0 18px;line-height:1.8;letter-spacing:0}
.footer-column h2::after{content:'';display:block;background:var(--accent);height:3px;width:28px;border-radius:3px;margin-top:8px}
.footer-column nav{display:grid;gap:2px}
.footer-column nav a{font-size:14px;line-height:1.8;min-height:36px;display:flex;align-items:center;transition:color .2s,padding .2s}
.footer-column nav a:hover{color:var(--accent);padding-inline-start:4px}
.footer-contact>p{font-size:13.5px;line-height:1.9;margin:0 0 14px}
.footer-call{display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid #FFFFFF1F;border-radius:12px;background:#FFFFFF08;margin-bottom:8px;min-height:50px}
.footer-call .icon{width:18px;height:18px;color:var(--accent)}
.footer-call span{font-size:12px;flex:1}
.footer-call b{font:700 17px Arial,sans-serif;color:#fff;white-space:nowrap}
.footer-call:hover{border-color:var(--accent)}
.footer-wa{display:flex;align-items:center;gap:10px;background:var(--whatsapp);color:#fff;border-radius:12px;padding:12px 14px;font-size:14px;font-weight:700;min-height:48px;margin-top:10px}
.footer-wa .icon{width:20px;height:20px}
.footer-email{display:flex;align-items:center;gap:8px;font-size:13px;margin-top:14px;overflow-wrap:anywhere}
.footer-email .icon{width:17px;height:17px;color:var(--accent)}
.footer-bottom{border-top:1px solid #FFFFFF14}
.footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:18px;font-size:13px}
.footer-bottom p{margin:0}
.footer-bottom a{display:flex;align-items:center;gap:10px;min-height:44px}
.footer-bottom a:hover{color:var(--accent)}
.has-contact-dock .footer-bottom-inner{padding-bottom:90px}

/* ---------- Inner pages ---------- */
.page-hero{background:radial-gradient(700px 260px at 100% 0%,var(--tint) 0%,transparent 70%),var(--soft);border-bottom:1px solid var(--line-soft);padding-block:34px 44px}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:22px}
.breadcrumb a{color:var(--heading);text-decoration:underline;text-decoration-color:#D8C27A;text-underline-offset:5px}
.breadcrumb a:hover{color:var(--link-hover)}
.page-hero h1{max-width:900px;margin:14px 0 10px}
.page-lead{font-size:17px;color:var(--muted);max-width:760px;line-height:2;margin:0}
.page-hero-actions{margin-top:22px}
.article-meta{display:flex;flex-wrap:wrap;gap:10px 22px;color:var(--muted);font-size:13px;margin-top:16px}
.article-meta span{display:inline-flex;align-items:center;gap:7px}
.article-meta .icon{width:16px;height:16px;color:#B08600}
.page-content{padding-block:48px 80px;min-height:30vh}
.page-content>.cards,.page-content>.features,.page-content>.steps{margin-top:10px}
.page-content>.steps{margin-top:30px}
.page-image{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-xl);margin-bottom:28px;box-shadow:var(--sh)}
.page-content>.page-image{max-height:520px}
.prose{max-width:820px;font-size:17px;line-height:2.25;overflow-wrap:anywhere}
.prose p{margin:0 0 20px}.prose p:last-child{margin-bottom:0}
.prose h2{font-size:25px;line-height:1.7;margin:1.6em 0 14px}.prose h2:first-child{margin-top:0}
.prose h3{font-size:20px;margin:1.3em 0 10px}
.content-prose{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:36px 42px;max-width:none}
.page-content>.content-prose{max-width:900px;margin-bottom:28px}
.content-prose h2,.content-prose h3{scroll-margin-top:calc(var(--header-h) + 24px)}
.content-prose h2{padding-inline-start:14px;border-inline-start:4px solid var(--accent)}
.content-prose a{color:var(--heading);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:4px}
.content-prose ul,.content-prose ol{padding-inline-start:24px}
.content-prose li{margin:6px 0}
.content-prose li::marker{color:#C79A00}
.article-toc{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 24px;margin:0 0 22px}
.article-toc strong{display:block;margin-bottom:8px;color:var(--heading)}
.article-toc ol{margin:0;padding-inline-start:22px;display:grid;gap:4px}
.article-toc li{font-size:14px}.article-toc li::marker{color:#C79A00;font-weight:700}
.article-toc a:hover{color:var(--link-hover);text-decoration:underline}
.content-faq{margin:34px 0}
.content-faq h2{font-size:24px;margin-bottom:16px}
.page-cta{margin:28px 0 0;padding:24px 28px;background:var(--tint);border:1px solid var(--tint-line);border-radius:var(--r-lg);display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.page-cta p{margin:0;font-weight:700;font-size:16px;color:var(--heading)}
.page-cta .actions{margin:0}

/* Detail layout */
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start;padding-block:44px 80px}
.detail-aside{position:sticky;top:calc(var(--header-h) + 20px);display:grid;gap:18px}
.aside-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px}
.aside-card h2{font-size:17px;margin:0 0 8px}
.aside-card>p{font-size:13.5px;color:var(--muted);margin:0 0 14px;line-height:1.9}
.aside-request{background:var(--navy);border-color:var(--navy);color:#C6D0DC}
.aside-request h2{color:#fff}
.aside-request>p{color:#AEBBCB}
.aside-request .btn{width:100%;margin-bottom:8px}
.aside-phone{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid #FFFFFF1F;margin-top:8px;color:#fff}
.aside-phone .icon{width:18px;height:18px;color:var(--accent)}
.aside-phone span{flex:1;font-size:12px;color:#AEBBCB}
.aside-phone b{font:700 16px Arial,sans-serif}
.aside-phone:hover{border-color:var(--accent)}
.aside-links{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.aside-links a{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:10px;font-size:14px;font-weight:600;color:var(--heading);line-height:1.7}
.aside-links a:hover{background:var(--tint)}
.aside-links .icon{width:18px;height:18px;color:#B08600;flex-shrink:0}
.aside-card .service-card{box-shadow:none}
.related{background:var(--soft);padding-block:60px}
.related .section-head{margin-bottom:26px}

/* Contact page */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:start}
.contact-info h2,.contact-form h2{font-size:22px;margin:0 0 8px}
.contact-info>p{color:var(--muted);margin:0 0 20px}
.contact-methods{display:grid;gap:12px}
.contact-method{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);transition:border-color .2s,box-shadow .2s}
.contact-method:hover{border-color:var(--accent);box-shadow:var(--sh-sm)}
.contact-method-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--tint);color:#8A6400;flex-shrink:0}
.contact-method.is-wa .contact-method-icon{background:#E3F4EA;color:var(--whatsapp)}
.contact-method small{display:block;font-size:12px;color:var(--muted)}
.contact-method b{font:700 18px Arial,sans-serif;color:var(--heading);overflow-wrap:anywhere}
.contact-facts{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:8px;color:var(--muted);font-size:14px}
.contact-facts li{display:flex;align-items:center;gap:8px}.contact-facts .icon{width:18px;height:18px;color:#B08600}
.privacy-note{display:block;margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:12.5px;line-height:2;color:var(--muted)}
.contact-form{background:#fff;padding:32px;border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh);scroll-margin-top:calc(var(--header-h) + 20px)}
.contact-form>.btn{width:100%;margin-top:6px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}

/* Error pages */
.error-page{padding-block:80px 90px;text-align:center}
.error-code{display:inline-grid;place-items:center;min-width:110px;height:56px;padding-inline:20px;border-radius:var(--pill);background:var(--navy);color:var(--accent);font:800 22px Arial,sans-serif;letter-spacing:3px}
.error-page h1{margin-block:22px 10px}
.error-page>p{color:var(--muted);max-width:560px;margin:0 auto}
.error-page .actions{justify-content:center}
.error-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:860px;margin:44px auto 0;text-align:right}
.error-links a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 18px;background:#fff;border:1px solid var(--line);border-radius:14px;font-weight:700;font-size:14px;color:var(--heading)}
.error-links a:hover{border-color:var(--accent);box-shadow:var(--sh-sm)}

/* ---------- Floating contact ---------- */
.contact-dock{position:fixed;bottom:22px;left:22px;z-index:35;display:flex;gap:10px;align-items:center;direction:rtl}
.contact-dock .icon{width:21px;height:21px}
.dock-whatsapp,.dock-calls summary{min-height:52px;display:flex;align-items:center;justify-content:center;gap:9px;padding:12px 19px;border-radius:var(--pill);box-shadow:0 10px 26px #172B4233;font-weight:700;font-size:14px;line-height:1.5;cursor:pointer}
.dock-whatsapp{background:var(--whatsapp);color:#fff}
.dock-calls{position:relative}
.dock-calls summary{background:var(--accent);color:var(--on-accent);list-style:none}
.dock-calls summary::-webkit-details-marker{display:none}
.dock-call-options{position:absolute;bottom:calc(100% + 12px);left:0;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;width:250px;box-shadow:var(--sh-lg)}
.dock-call-options strong{display:block;font-size:13px;margin-bottom:6px;color:var(--heading)}
.dock-call-options a{display:block;text-align:center;border-radius:10px;font:700 19px/1.5 Arial,sans-serif;padding:12px;background:var(--soft);color:var(--heading);margin-top:7px}
.dock-call-options a:hover{background:var(--tint)}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
 .hero-inner{grid-template-columns:1fr 1fr;gap:36px;padding-block:56px 70px}
 .hero-lead{font-size:16px}
 .features{grid-template-columns:repeat(2,minmax(0,1fr))}
 .footer-main{grid-template-columns:1fr 1fr;gap:34px 40px}
 .detail-grid{grid-template-columns:minmax(0,1fr) 300px;gap:28px}
 .faq-split{gap:36px}
}
@media(max-width:900px){
 .hero-inner{grid-template-columns:1fr;gap:40px}
 .hero-media{max-width:620px}
 .detail-grid{grid-template-columns:1fr}
 .detail-aside{position:static;grid-template-columns:1fr 1fr}
 .detail-aside .aside-request{grid-column:1/-1}
 .faq-split{grid-template-columns:1fr}
 .faq-split .section-head{position:static}
 .cta-band-inner{flex-direction:column;align-items:flex-start}
}
@media(max-width:820px){
 .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .contact-grid{grid-template-columns:1fr}
 .about-grid:has(img){grid-template-columns:1fr}
 .steps{grid-template-columns:1fr;gap:20px}
 .steps::before{top:0;bottom:0;inset-inline:33px auto;width:2px;height:auto;background:repeating-linear-gradient(to bottom,var(--accent) 0 10px,transparent 10px 18px)}
 .step{display:grid;grid-template-columns:68px 1fr;gap:0 16px;text-align:start;padding:0}
 .step-number{grid-row:1/3;margin:0}
 .step p{margin:0;max-width:none}
 .lost-help-box{flex-wrap:wrap;padding:26px}
 .error-links{grid-template-columns:1fr 1fr}
 .banner-actions .container{flex-direction:column;align-items:stretch;text-align:center}
 .banner-actions .actions{justify-content:center}
}
@media(max-width:600px){
 h2{font-size:23px}
 .btn{padding:10px 18px}
 .btn-lg{min-height:52px;padding:12px 20px;font-size:14px}
 .hero-inner{padding-block:36px 56px;gap:34px}
 .hero h1{font-size:29px;margin:14px 0 10px}
 .hero-lead{font-size:15px}
 .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
 .hero-points{grid-template-columns:1fr;gap:10px;margin-top:26px}
 .hero-media::before{width:80px;height:80px;inset:-12px auto auto -10px}
 .hero-frame{border-width:4px}
 .hero-call-card{right:10px;bottom:-20px;padding:9px 14px}
 .hero-call-card b{font-size:15px}
 .section-head{flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:24px}
 .section-head .section-intro{font-size:14.5px}
 .section-link{padding:4px 14px;font-size:13px;min-height:38px}
 .cards{grid-template-columns:1fr;gap:14px}
 .features{grid-template-columns:1fr 1fr;gap:10px}
 .feature{padding:18px 14px}.feature-icon{width:50px;height:50px;border-radius:14px;margin-bottom:12px}.feature-icon .icon{width:24px;height:24px}
 .feature h3{font-size:14.5px;margin-bottom:4px}.feature p{font-size:12.5px;line-height:1.85}
 .service-card{display:grid;grid-template-columns:122px minmax(0,1fr)}
 .service-card-media{aspect-ratio:auto;height:100%;min-height:150px}
 .service-card-badge{display:none}
 .service-card-body{padding:14px 14px 12px;gap:3px}
 .service-card h3{font-size:15.5px}
 .service-card p{font-size:12.5px;line-height:1.8}
 .service-card-actions{padding-top:10px;margin-top:10px;gap:6px}
 .service-card-actions .btn{min-height:40px;padding:6px 12px;font-size:12px}
 .service-card-actions .text-link{font-size:12px;min-height:40px}
 .service-card-actions .text-link .ui-arrow{display:none}
 .article-card-body{padding:16px 18px 10px}
 .lost-help-box{padding:22px 20px;gap:14px}
 .lost-help-icon{width:50px;height:50px}
 .lost-help-box .btn{width:100%}
 .accordion summary,.faq-item summary{font-size:14.5px;padding:15px 16px;padding-inline-end:54px}
 .accordion p,.faq-item p{font-size:14px;padding:0 16px 16px}
 .about-grid{padding:24px 22px}
 .cta-band-inner{padding:28px 22px;gap:18px}
 .cta-band .actions{display:grid;grid-template-columns:1fr;width:100%;gap:10px}
 .site-footer,.cta-band+.site-footer{padding-top:44px}
 .footer-main{grid-template-columns:1fr 1fr;gap:28px 18px;padding-bottom:30px}
 .footer-identity,.footer-contact{grid-column:1/-1}
 .footer-column nav a{font-size:13px;min-height:40px}
 .footer-bottom-inner{flex-wrap:wrap;gap:4px;padding-block:14px;font-size:12px}
 .has-contact-dock .footer-bottom-inner{padding-bottom:18px}
 .page-hero{padding-block:22px 28px}
 .page-hero h1{font-size:26px;line-height:1.6}
 .page-lead{font-size:15px}
 .page-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .page-hero-actions .btn{padding:8px 10px}
 .page-content{padding-block:28px 48px}
 .detail-grid{padding-block:24px 44px;gap:20px}
 .detail-aside{grid-template-columns:1fr}
 .page-image{aspect-ratio:4/3;border-radius:var(--r-lg);margin-bottom:18px}
 .content-prose{padding:22px 18px;border-radius:var(--r-lg)}
 .prose{font-size:16px;line-height:2.15}.prose h2{font-size:21px}
 .page-cta{flex-direction:column;align-items:stretch;padding:18px}
 .page-cta .actions{display:grid;grid-template-columns:1fr;gap:8px}
 .related{padding-block:40px}
 .contact-form{padding:22px 18px;border-radius:var(--r-lg)}
 .form-row{grid-template-columns:1fr}
 .contact-method b{font-size:16px}
 .error-page{padding-block:44px 60px}
 .error-links{grid-template-columns:1fr}
 .banner-actions .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .banner-actions .actions .btn:first-child{grid-column:1/-1}
 .contact-dock{left:10px;right:10px;bottom:0;padding:8px 8px calc(8px + env(safe-area-inset-bottom));background:#FFFFFFF0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0}
 .contact-dock>a,.contact-dock>details{flex:1;min-width:0}
 .dock-whatsapp,.dock-calls summary{border-radius:12px;min-height:46px;padding:9px 12px;font-size:13.5px;box-shadow:none}
 .dock-call-options{width:min(260px,calc(100vw - 40px))}
 .has-contact-dock{padding-bottom:calc(70px + env(safe-area-inset-bottom))}
}
@media(hover:none){.btn:hover,.service-card:hover,.article-card:hover,.feature:hover{transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{.site-header,.topbar,.contact-dock,.site-footer,.cta-band,.detail-aside,.page-cta{display:none!important}}