/* MCARVA V112 | project navigation: single source for Campo, Ninguna, Lobby, Barichara, Tierra Habitada.
   Approved Materia y Luz / Residencia 22 remain on their original, unchanged shell. */
:root{--project-header-h:84px;--project-header-pad:clamp(24px,4vw,72px);--project-overlay-z:1300}
body[data-project="campo"]{--project-nav-bg:rgba(245,242,236,.84);--project-nav-color:#181410;--project-nav-line:rgba(24,23,20,.12)}
body[data-project="lobby-megaciudades"],body[data-project="tierra-habitada"]{--project-nav-bg:rgba(20,18,16,.54);--project-nav-color:#fffdf8;--project-nav-line:rgba(255,255,255,.16)}
body[data-project="ninguna"]{--project-nav-bg:#111314;--project-nav-color:var(--paper);--project-nav-line:rgba(242,238,230,.10)}
body[data-project="barichara"]{--project-nav-bg:rgba(42,44,47,.94);--project-nav-color:#fff;--project-nav-line:rgba(255,255,255,.10)}
body[data-project="tierra-habitada"].theme-light:not(.lightbox-open){--project-nav-bg:rgba(245,242,236,.78);--project-nav-color:#181410;--project-nav-line:rgba(24,23,20,.16)}
body[data-project="tierra-habitada"].theme-light:not(.lightbox-open) .brand-logo{filter:brightness(0) saturate(100%);opacity:.88}
.project-shell-skip{position:fixed;z-index:10050;left:16px;top:16px;transform:translateY(-180%);padding:10px 14px;border-radius:2px;background:#fff;color:#171713;font:600 11px/1.2 "Manrope","Segoe UI",sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;transition:transform .2s ease}
.project-shell-skip:focus{transform:none;outline:2px solid currentColor;outline-offset:3px}
.topbar{position:fixed;z-index:1200;inset:0 0 auto;width:100%;height:var(--project-header-h);padding:0;margin:0;transform:none;pointer-events:none;color:var(--project-nav-color);background:var(--project-nav-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .3s ease,color .3s ease}
.topbar::after{content:"";position:absolute;left:var(--project-header-pad);right:var(--project-header-pad);bottom:0;height:1px;background:var(--project-nav-line)}
.topbar-inner{position:relative;width:100%;max-width:none;margin:0;height:100%;padding:0 var(--project-header-pad);display:flex;align-items:center;justify-content:space-between;gap:24px;color:inherit}
.topbar .brand{position:relative;z-index:3;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:flex-start;width:clamp(92px,7vw,116px);min-height:40px;pointer-events:auto;text-decoration:none}
.topbar .brand-logo{position:static;display:block;width:100%;height:auto;max-width:100%;opacity:1;transform:none;filter:none;transition:filter .28s ease}
body[data-project="campo"] .topbar .brand-logo{filter:brightness(0) saturate(100%);opacity:.88}
.project-shell-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:32vw;min-height:44px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;font:600 9px/1.2 "Manrope","Avenir Next","Segoe UI",sans-serif;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;opacity:.8;pointer-events:auto}
.project-shell-center:hover{opacity:1}
.project-shell-center:focus-visible{opacity:1;outline:1px solid currentColor;outline-offset:3px}
.project-shell-tools{position:relative;z-index:3;flex:0 0 auto;min-width:0;margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,1.5vw,23px);pointer-events:auto}
.project-shell-lang{display:flex;align-items:center;gap:9px}
.project-shell-lang button{position:relative;min-width:40px;min-height:40px;padding:12px 6px;border:0;display:inline-flex;align-items:center;justify-content:center;background:transparent;color:inherit;font:600 9px/1 "Manrope","Avenir Next","Segoe UI",sans-serif;letter-spacing:.17em;text-transform:uppercase;white-space:nowrap;opacity:.38;cursor:pointer;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.project-shell-lang button[aria-pressed="true"]{opacity:.92}
.project-shell-lang button:focus-visible{outline:1px solid currentColor;outline-offset:2px}
.project-shell-lang button:hover,.project-shell-lang button:focus-visible{opacity:1}
.project-shell-lang button[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:currentColor;opacity:.55}
.project-shell-lang button+button::before{content:"/";position:absolute;left:-7px;opacity:.28}
.project-shell-contact{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.project-shell-talk{color:inherit;text-decoration:none;font:600 9px/1 "Manrope","Avenir Next","Segoe UI",sans-serif;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap;opacity:.78;transition:opacity .2s ease}
.project-shell-talk:hover,.project-shell-talk:focus-visible{opacity:1;outline:1px solid currentColor;outline-offset:3px}
.project-shell-talk [data-palette-lang="en"]{display:none}
html[lang="en"] .project-shell-talk [data-palette-lang="es"]{display:none}
html[lang="en"] .project-shell-talk [data-palette-lang="en"]{display:inline}
.project-shell-whatsapp{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:#fff;background:#25d366;box-shadow:0 4px 14px rgba(0,0,0,.16);transition:transform .24s ease,filter .24s ease}
.project-shell-whatsapp svg{display:block;width:16px;height:16px}
.project-shell-whatsapp:hover,.project-shell-whatsapp:focus-visible{outline:2px solid currentColor;outline-offset:2px;transform:translateY(-2px);filter:brightness(1.05)}







body[data-project="ninguna"] .topbar{z-index:3000}
body[data-project="barichara"] .topbar{z-index:5000}


/* Width and small-screen behavior follow the approved 2026 project navigation. */
@media(max-width:760px){
 :root{--project-header-h:70px;--project-header-pad:clamp(20px,6vw,32px)}
 .topbar .brand{width:96px;min-height:36px}
 .project-shell-center{font-size:8px;letter-spacing:.13em}
 .project-shell-tools{gap:10px}
 .project-shell-lang button{min-width:32px;padding-left:3px;padding-right:3px;font-size:8px;letter-spacing:.12em}
 
 .project-shell-talk{font-size:8px;letter-spacing:.07em}
 
 
}
@media(max-width:600px){
 .topbar-inner{gap:4px}
 .topbar .brand{width:clamp(73px,18vw,88px)}
 .project-shell-center{font-size:7.5px;letter-spacing:.10em}
 .project-shell-tools{gap:6px}
 .project-shell-lang{gap:6px}
 .project-shell-lang button{min-width:23px;min-height:40px;padding:10px 0;font-size:7px;letter-spacing:0}
 .project-shell-lang button+button::before{left:-5px}
 .project-shell-contact{gap:7px}
 .project-shell-talk{font-size:8px;letter-spacing:0}
 .project-shell-whatsapp{width:25px;height:25px}
 .project-shell-whatsapp svg{width:14px;height:14px}
 
 
 
 
 
}
@media(max-width:420px){:root{--project-header-pad:18px}}
@media(max-width:359px){
 .project-shell-tools,.project-shell-lang{gap:2px}
 .project-shell-lang button{min-width:20px}
 .project-shell-lang button+button::before{left:-4px}
 .project-shell-contact{gap:5px}
 .project-shell-talk{font-size:7px}
 .project-shell-center{font-size:7px;letter-spacing:0}
 .project-shell-whatsapp{width:23px;height:23px}
 .project-shell-whatsapp svg{width:13px;height:13px}
}
@media(prefers-reduced-motion:reduce){.topbar,.topbar .brand-logo,.project-shell-center,.project-shell-talk,.project-shell-whatsapp{transition:none}}