/* Panel J.C. — evolución de la identidad existente, sin dependencias. */
:root { --max:1360px; --pad:clamp(22px,4.5vw,64px); --sec-pad:clamp(52px,6vw,88px); --header-h:82px; --t-label:.8rem; --t-display:clamp(3.6rem,7.6vw,7rem); --t-h2:clamp(2.2rem,4.6vw,4rem); --t-h1:clamp(2.6rem,5.8vw,5.3rem); --tr-label:.09em; }
body { font-size:16px; overflow-x:clip; }
[hidden] { display:none!important; }
figure { margin:0; }
:focus-visible { outline:3px solid var(--gold-text); outline-offset:5px; }
.on-ink-2 :focus-visible,.drawing-desk :focus-visible,.compact-close :focus-visible { outline-color:var(--gold); }
.site-header { background:var(--paper); color:var(--ink); border-bottom-color:var(--line); }
.site-header :focus-visible { outline-color:var(--gold-text); }
.brand img { filter:none; width:178px; height:auto; }
.main-nav a { color:var(--on-paper-soft); font-size:.9rem; letter-spacing:.035em; padding:14px 0; }
.main-nav a:hover,.main-nav a[aria-current=page] { color:var(--ink); }
.main-nav ul { gap:24px; }
.header-actions { gap:20px; }
.header-cta { font-size:.86rem; padding:13px 18px; }
.lang-switch button { color:var(--on-paper-soft); min-width:38px; min-height:44px; padding:8px; font-size:.85rem; }
.lang-switch button:hover { color:var(--ink); }
.lang-switch button.active { color:var(--gold-text); border-color:var(--gold-text); }
.hamburger { min-width:44px; min-height:44px; align-items:center; justify-content:center; }
.hamburger span { background:var(--ink); }
.mobile-nav { display:none; opacity:1; visibility:hidden; }
.mobile-nav.open { display:block; visibility:visible; }
.mobile-nav :focus-visible { outline-color:var(--gold); }
.eyebrow { display:flex; align-items:center; gap:10px; font:500 .82rem/1.4 var(--font-cond); text-transform:uppercase; letter-spacing:.12em; margin:0 0 25px; }
.status-dot { width:7px; height:7px; background:var(--gold-text); border-radius:50%; }
.panel-hero { padding:54px 0 60px; }
.hero-layout { display:grid; grid-template-columns:1.03fr 1fr; gap:6%; align-items:center; }
.hero-copy h1 { font-size:var(--t-display); line-height:1.02; letter-spacing:-.025em; margin:0 0 27px; }
.hero-copy h1 em { font-style:normal; color:var(--gold-text); }
.hero-intro { font-size:1.12rem; max-width:40ch; color:var(--on-paper-soft); line-height:1.7; margin-bottom:28px; }
.hero-copy .hero-actions { align-items:center; gap:24px; }
.btn { min-height:48px; font-size:.9rem; letter-spacing:.04em; gap:22px; padding:15px 24px; }
.btn span[aria-hidden] { font:1.5rem/1 var(--font-body); }
.btn-gold { background:var(--gold); color:var(--ink); }
.text-link { display:inline-flex; padding:10px 0 5px; border-bottom:1px solid; font-weight:600; font-size:.92rem; }
.hero-foot { display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:22px; margin-top:42px; font-size:.78rem; color:var(--on-paper-soft); }
.drawing-desk { background:var(--ink); color:var(--on-ink); padding:24px; transform:rotate(1deg); box-shadow:8px 10px 0 var(--concrete); }
.desk-label { display:flex; justify-content:space-between; gap:10px; font:500 .78rem var(--font-cond); letter-spacing:.08em; color:var(--on-ink-soft); padding-bottom:20px; }
.desk-figure { background:var(--paper); }
.desk-figure img { width:100%; height:235px; object-fit:contain; }
.desk-figure figcaption { color:var(--ink); display:flex; justify-content:space-between; gap:12px; padding:12px 16px; border-top:1px solid var(--line); font:500 .9rem var(--font-cond); }
.drawing-note { font:400 .75rem var(--font-body); color:var(--on-paper-soft); }
.service-tabs { display:grid; grid-template-columns:repeat(3,1fr); margin-top:20px; border-top:1px solid var(--ink-line); border-left:1px solid var(--ink-line); }
.service-tabs button { display:flex; gap:8px; align-items:center; text-align:left; min-height:54px; padding:10px; border-right:1px solid var(--ink-line); border-bottom:1px solid var(--ink-line); font:500 .9rem var(--font-cond); }
.service-tabs button[aria-pressed=true] { background:var(--gold); color:var(--ink); }
.service-tabs button:not([aria-pressed=true]):hover { background:var(--ink-2); }
.tab-num { opacity:.65; font-size:.7rem; }
.desk-link { display:flex; justify-content:space-between; align-items:center; padding-top:20px; font-size:.85rem; }
.desk-link>span:last-child { color:var(--gold); font-size:1.4rem; }
.local-strip { border-block:1px solid var(--line); background:var(--concrete); }
.local-strip .wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding-block:20px; font:500 .83rem var(--font-cond); letter-spacing:.04em; }
.section-heading { display:grid; grid-template-columns:1fr 1fr; gap:0 10%; margin-bottom:35px; align-items:end; }
.section-heading .eyebrow { grid-column:1/-1; }
.section-heading h2,.visit-layout h2,.team-layout h2,.compact-close h2 { white-space:pre-line; letter-spacing:-.015em; line-height:1.05; }
.section-heading h2 { margin:0; }
.section-heading .lead { margin:0; }
.service-catalog { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.catalog-item { position:relative; padding:26px 25px 32px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .18s,color .18s; }
.catalog-num { font:.8rem var(--font-cond); color:var(--gold-text); }
.catalog-item h3 { font:400 1.8rem/1.15 var(--font-display); margin:18px 0 12px; }
.catalog-item p { max-width:30ch; margin:0; color:var(--on-paper-soft); font-size:.95rem; }
.catalog-arrow { position:absolute; top:23px; right:22px; font-size:1.5rem; }
.catalog-item:hover { background:var(--gold-wash); }
.scope-note { display:flex; flex-wrap:wrap; gap:8px 25px; margin-top:22px; font-size:.8rem; color:var(--on-paper-soft); }
.visit-section { background:var(--ink); color:var(--on-ink); padding-block:var(--sec-pad); }
.visit-layout { display:grid; grid-template-columns:1.1fr .85fr; gap:12%; align-items:center; }
.visit-layout .eyebrow { color:var(--gold); }
.visit-layout>div>p:not(.eyebrow) { max-width:44ch; color:var(--on-ink-soft); }
.visit-layout .text-link { color:var(--gold); }
.visit-ticket { position:relative; background:var(--gold); color:var(--ink); padding:32px; transform:rotate(-2deg); }
.ticket-label { font:500 .82rem var(--font-cond); letter-spacing:.14em; }
.ticket-price { display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:end;font:400 clamp(4.5rem,8vw,7rem)/.85 var(--font-display); margin:18px 0 22px; }
.ticket-price small{font:500 .72rem var(--font-cond);letter-spacing:.12em;align-self:start;padding-top:7px}
.ticket-price strong{font:inherit;font-weight:400}
.ticket-price span { font:3.5rem var(--font-body); }
.visit-ticket p { color:var(--ink)!important; }
.visit-calculator{display:grid;grid-template-columns:1fr;gap:7px;margin:0 0 18px;padding:15px 0;border-block:1px solid color-mix(in srgb,var(--ink) 30%,transparent)}
.visit-calculator label{grid-column:1/-1;font:500 .78rem var(--font-cond);letter-spacing:.08em;text-transform:uppercase}
.visit-calculator select{width:100%;min-width:0;padding:11px 48px 11px 12px;border:1px solid var(--ink);border-radius:0;appearance:none;background-color:var(--paper);background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-repeat:no-repeat;background-size:7px 7px,7px 7px;background-position:calc(100% - 21px) 50%,calc(100% - 14px) 50%;color:var(--ink);font:500 .9rem var(--font-body)}
.parking-note{display:block;margin-top:12px;padding-left:12px;text-indent:-12px;font-size:.68rem;line-height:1.45;color:color-mix(in srgb,var(--ink) 75%,transparent)}
.parking-note::before{content:"* "}
.ticket-bottom { display:flex; gap:18px; align-items:center; margin-top:25px; padding-top:20px; border-top:1px dashed var(--gold-text); font-size:.83rem; }
.ticket-seal { border:1px solid var(--ink); border-radius:50%; padding:10px; font:500 1rem var(--font-cond); flex:none; transform:rotate(-12deg); }
.team-section { background:var(--concrete); }
.team-layout { display:grid; grid-template-columns:1fr 1fr; gap:10%; }
.promise-list { align-self:center; border-top:1px solid var(--line); }
.promise-list>div { display:grid; grid-template-columns:30px 1fr; gap:20px; padding:25px 0; border-bottom:1px solid var(--line); }
.promise-list span { font:.8rem var(--font-cond); color:var(--gold-text); }
.promise-list h3 { margin:0; font:500 1.2rem/1.4 var(--font-cond); text-transform:none; }
.compact-close { background:var(--ink); color:var(--on-ink); padding-block:68px; }
.compact-close .eyebrow { color:var(--gold); }
.compact-close .wrap>div { display:flex; justify-content:space-between; align-items:center; gap:30px; }
.compact-close h2 { margin:0 0 25px; font-size:clamp(2.6rem,5.5vw,5rem); }
.compact-close p:last-child { color:var(--on-ink-soft); font-size:.85rem; }
.site-footer { padding-top:45px; }
.footer-brand img { width:180px; height:auto; }
.footer-grid { gap:26px; }
.site-footer h4 { font-size:.85rem; }
.page-head { background:var(--ink); color:var(--on-ink); padding-block:50px; }
.page-head h1 { max-width:24ch; }
.page-head .lead { color:var(--on-ink-soft); max-width:65ch; }
.page-head::before { background-image:var(--grid-ink); }
.page-head .hero-meta { font-size:.8rem; }
.spread { padding-block:48px; }
.spread-media { margin:0; }
.spread-media img { max-height:320px; object-fit:contain; }
.spread-in { grid-template-columns:.85fr 1.15fr; align-items:center; gap:7%; }
.spread-body h2 { font-size:2.4rem; }
.plate-cap { font-size:.78rem; letter-spacing:.04em; flex-wrap:wrap; }
.plate-grid { gap:25px; }
.section:has(.spread) { padding-top:40px; }
.service-jumps { display:flex; flex-wrap:wrap; gap:8px; padding-block:24px; }
.service-jumps a { border:1px solid var(--line); padding:10px 15px; min-height:44px; font:500 .95rem var(--font-cond); }
.service-jumps a:hover { background:var(--gold); }
.contact-layout { grid-template-columns:1.2fr .8fr; gap:8%; }
.contact-form-wrap { order:-1; }
.contact-form { grid-template-columns:1fr 1fr; }
.field { min-width:0; }
.field input,.field select,.field textarea { min-width:0; width:100%; font-size:1rem; }
.field label { font-size:.85rem; letter-spacing:.04em; }
.field:has(textarea),.contact-form .form-note,.contact-form .form-status,.contact-form .form-privacy,.contact-form button { grid-column:1/-1; }
.form-status { padding:16px; background:var(--gold-wash); border-left:3px solid var(--gold-text); }
.form-privacy { font-size:.8rem; color:var(--on-paper-soft); }
.form-privacy a { text-decoration:underline; }
.project-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; margin-block:30px; }
.project-card { border:1px solid var(--line); background:var(--paper-2); }
.project-card img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.project-card .project-copy { padding:22px; }
.project-copy h3 { font:400 1.5rem var(--font-display); margin:10px 0; }
.project-copy p { font-size:.92rem; color:var(--on-paper-soft); }
.project-copy .eyebrow { margin:0; font-size:.78rem; }
.project-filters { display:flex; flex-wrap:wrap; gap:8px; }
.project-filters button { min-height:44px; padding:10px 16px; border:1px solid var(--line); }
.project-filters button[aria-pressed=true] { background:var(--ink); color:var(--on-ink); }
.project-empty { display:grid; grid-template-columns:1fr 1fr; gap:10%; align-items:center; padding:42px; border:1px solid var(--line); }
.project-empty img { width:100%; max-height:250px; object-fit:contain; }
.project-empty h2 { font-size:2.3rem; }
.preview-banner { position:sticky; top:0; z-index:90; padding:10px 20px; background:var(--gold); color:var(--ink); text-align:center; font-weight:600; font-size:.85rem; }
.action-bar { height:calc(var(--bar-h) + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); background:var(--ink); }
@media(min-width:1080px) and (max-width:1239px){ .main-nav ul{gap:16px}.header-actions{gap:8px}.header-cta{display:none}.brand img{width:155px} }
@media(max-width:1079px){ .hero-layout{gap:5%}.drawing-desk{padding:18px}.service-tabs{grid-template-columns:repeat(2,1fr)}.hero-copy h1{font-size:clamp(3.4rem,7.5vw,6rem)}.main-nav,.header-cta{display:none}.header-actions{gap:8px}.footer-grid{grid-template-columns:1fr 1fr}.hero-foot{flex-direction:column} }
@media(max-width:759px){ :root{--header-h:72px}.brand img{width:150px}.header-actions{gap:3px}.lang-switch button{min-width:32px;padding:6px}.hero-layout,.section-heading,.visit-layout,.team-layout,.contact-layout,.spread-in,.project-empty{grid-template-columns:1fr}.panel-hero{padding:35px 0 42px}.hero-layout{gap:35px}.hero-copy h1{font-size:clamp(3.5rem,11.8vw,5.6rem)}.hero-intro{max-width:45ch;font-size:1rem}.hero-foot{margin-top:24px;flex-direction:row;font-size:.74rem}.drawing-desk{transform:none;box-shadow:5px 6px 0 var(--concrete)}.desk-figure img{height:210px}.service-tabs{grid-template-columns:repeat(3,1fr)}.service-tabs button{font-size:.85rem;padding:9px 7px}.drawing-note{font-size:.72rem}.section-heading{gap:16px}.section-heading .eyebrow{margin-bottom:0}.section-heading h2{font-size:2.65rem}.service-catalog{grid-template-columns:1fr 1fr}.catalog-item{padding:20px 16px 25px}.catalog-item h3{font-size:1.5rem}.catalog-item p{font-size:.87rem}.visit-layout{gap:34px}.visit-ticket{transform:none;padding:25px}.ticket-price{font-size:6rem}.team-layout{gap:30px}.compact-close .wrap>div{align-items:start;flex-direction:column;gap:0}.compact-close .btn{margin-bottom:22px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand,.footer-contact{grid-column:1/-1}.page-head{padding-block:32px}.page-head h1{font-size:2.6rem}.spread:nth-of-type(even) .spread-media{order:0}.spread-in{gap:24px}.spread-body h2{font-size:2rem}.spread{padding-block:35px}.spread-media img{height:230px}.project-grid{grid-template-columns:1fr}.project-empty{padding:24px;gap:24px}.contact-form-wrap{order:-1}.contact-form{grid-template-columns:1fr}.contact-layout{gap:45px}.scope-note{flex-direction:column}.facts li{grid-template-columns:1fr;gap:4px}.routes-light .route-txt span{font-size:1.1rem}.action-bar a{font-size:.95rem} }
@media(max-width:359px){.brand img{width:125px}.lang-switch button{min-width:28px}.site-header .wrap{gap:5px}.service-tabs{grid-template-columns:repeat(2,1fr)}.hero-foot{flex-direction:column}.service-catalog{grid-template-columns:1fr}}
@media print{.drawing-desk,.visit-section,.compact-close,.page-head{background:white;color:black}.page-head .lead{color:black}}

.hero-copy h1,.project-copy h3{overflow-wrap:anywhere}.project-empty-text{max-width:760px;padding:30px 0}.project-empty-text h2{font-size:clamp(2rem,4vw,3.5rem)}.project-empty-text p{margin-block:20px}.form-status:empty{display:none}
/* A quiet local signature, separate from the technical service plates. */
.facade-interlude{background:var(--paper);padding:0 var(--pad);overflow:hidden;margin-top:-18px}
.facade-interlude img{display:block;width:min(100%,860px);height:auto;max-height:165px;object-fit:contain;margin:0 auto;opacity:.86}
.comparison-section{border-top:1px solid var(--line)}
#homeComparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,3vw,42px);align-items:start}
.before-after{--split:50%;position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--concrete);isolation:isolate}
.before-after img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--concrete)}
.before-after .before-image{clip-path:inset(0 calc(100% - var(--split)) 0 0);z-index:1}
.compare-divider{position:absolute;z-index:2;left:var(--split);top:0;bottom:0;width:2px;background:var(--paper);pointer-events:none;transform:translateX(-1px)}
.compare-divider::after{content:'↔';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--paper);color:var(--ink);border:1px solid var(--ink);font:500 24px sans-serif}
.compare-tag{position:absolute;z-index:3;top:16px;padding:7px 11px;background:var(--paper);color:var(--ink);font:500 .8rem var(--font-heading);pointer-events:none}
.compare-tag.before-tag{left:16px}.compare-tag.after-tag{right:16px}
.compare-range{position:absolute;inset:0;z-index:4;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}
.before-after:focus-within{outline:3px solid var(--gold-text);outline-offset:5px}
.comparison-caption{display:flex;justify-content:space-between;align-items:start;gap:25px;padding-top:20px}
.comparison-caption h3{font-size:clamp(1.3rem,2vw,1.7rem);margin:6px 0}.comparison-caption p{max-width:62ch}.comparison-caption .eyebrow{font-size:.8rem}
.comparison-descriptions{font-size:.82rem;color:var(--on-paper-soft);margin-top:14px}.comparison-descriptions summary{cursor:pointer;padding:12px 0}.comparison-descriptions p{margin:5px 0}
@media(max-width:759px){.facade-interlude{margin-top:0;padding-inline:0}.facade-interlude img{max-height:115px;width:125%;max-width:none;margin-left:-12.5%}#homeComparison{grid-template-columns:1fr}.comparison-project:nth-child(n+2){display:none}.comparison-caption{flex-direction:column;gap:10px}.compare-tag{top:10px}.compare-tag.before-tag{left:10px}.compare-tag.after-tag{right:10px}.compare-divider::after{width:40px;height:40px}}
