/* ZERO ART — propuesta de portada: contenido limpio a un lado, el campo vivo al otro. */
@font-face{font-family:'DM Mono';font-weight:400;font-display:swap;src:url(/assets/font-0.woff2) format('woff2')}
@font-face{font-family:'DM Mono';font-weight:500;font-display:swap;src:url(/assets/font-1.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-weight:100 1000;font-display:swap;src:url(/assets/font-2.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/font-3.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/font-4.woff2) format('woff2')}
:root{--paper:#f1f0e9;--ink:#24211f;--muted:#5f5a55;--line:#24211f1f;--wine:#462235;--violet:#6552df;--citron:#e5ed9f;--mono:'DM Mono',monospace;--sans:'DM Sans',Arial,sans-serif;--serif:'Instrument Serif',Georgia,serif;--pad:clamp(20px,3.6vw,64px);--head:68px;--side:42vw}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head) + 12px)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}button{font:inherit;color:inherit}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px}
.p-skip{position:absolute;left:-9999px;top:8px;background:var(--citron);padding:10px 14px;z-index:99}.p-skip:focus{left:8px}

/* Cabecera */
.p-head{position:fixed;inset:0 0 auto;z-index:40;display:flex;align-items:center;gap:28px;height:var(--head);padding:0 var(--pad);background:#f1f0e9ee;backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.p-mark{font:700 22px var(--sans);letter-spacing:-.05em;text-decoration:none}.p-mark sup{font-weight:400;font-size:.7em;margin-left:2px}
.p-head nav{display:flex;gap:24px;margin-left:auto;font-size:14px}.p-head nav a{text-decoration:none;position:relative}
.p-head nav a::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--wine);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.p-head nav a:hover::after,.p-head nav a.is-on::after{transform:none}
.p-head-cta{display:flex;gap:10px;align-items:center;padding:11px 16px;background:var(--wine);color:var(--paper);text-decoration:none;font-size:14px;font-weight:500;transition:background .2s}
.p-head-cta:hover{background:#5c2d46}
.p-head-client{display:flex;gap:8px;align-items:center;margin-left:-10px;padding:10px 14px;border:1px solid var(--ink);color:var(--ink);text-decoration:none;font-size:14px;font-weight:500;transition:background .2s,color .2s}
.p-head-client:hover,.p-head-client:focus-visible{background:var(--ink);color:var(--paper)}

/* Distribución: contenido + campo vivo a un lado */
.p-layout{display:grid;grid-template-columns:minmax(0,1fr) var(--side);padding-top:var(--head)}
.p-main{min-width:0}
.p-side{position:sticky;top:var(--head);height:calc(100svh - var(--head));display:flex;flex-direction:column;background:#ebe8ee;overflow:hidden;isolation:isolate}
.p-stage{position:relative;flex:1;min-height:0}
.p-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.p-field{touch-action:pan-y;cursor:crosshair}
.p-side.is-hold .p-field{cursor:grabbing}
.p-side[data-style=code] .p-field,.p-side[data-style=print] .p-field{cursor:none}
.p-side-bar{position:absolute;left:0;right:0;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:16px 18px;pointer-events:none}
.p-side-bar>*{pointer-events:auto}
.p-live{display:flex;align-items:center;gap:8px;font:500 11px var(--mono);letter-spacing:.14em}
.p-live i{width:7px;height:7px;border-radius:50%;background:var(--wine);animation:p-blink 1.6s infinite}
@keyframes p-blink{50%{opacity:.25}}
.p-side-foot{position:absolute;left:0;right:0;bottom:0;z-index:5;display:flex;justify-content:space-between;gap:12px;padding:14px 18px;font:500 11px var(--mono);letter-spacing:.08em;pointer-events:none}
.p-caption{max-width:70%;text-transform:uppercase}
.p-side.is-dark .p-side-bar,.p-side.is-dark .p-side-foot{color:#e9e4ea}
.p-side.is-dark .p-live i{background:var(--citron)}

/* Selector de estilo */
.p-style{position:relative}
.p-style-btn{display:flex;align-items:center;gap:10px;padding:5px 10px 5px 6px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;box-shadow:0 12px 26px -14px #24211fcc;transition:transform .2s}
.p-style-btn:hover{transform:translateY(-1px)}
.p-style-btn>span:nth-child(2){display:grid;text-align:left;line-height:1.05}
.p-style-btn small{font:500 9px var(--mono);letter-spacing:.14em;color:#a59ca6}.p-style-btn b{font:600 13px var(--sans)}
.p-style-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .3s}
.p-style.is-open .p-style-btn svg{transform:rotate(180deg)}
.p-sw{width:26px;height:26px;border-radius:3px;flex:none;box-shadow:inset 0 0 0 1px #ffffff26}
.p-style-menu{position:absolute;right:0;top:calc(100% + 8px);width:min(330px,calc(var(--side) - 36px));padding:8px;background:#1e1b1d;color:#e9e4ea;border:1px solid #ffffff1a;box-shadow:0 30px 70px -20px #000c;animation:p-menu .32s cubic-bezier(.16,1,.3,1);z-index:9}
.p-style-menu[hidden]{display:none}
@keyframes p-menu{from{opacity:0;transform:translateY(-6px);clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
.p-style-menu button{display:grid;grid-template-columns:50px 1fr auto;gap:12px;align-items:center;width:100%;padding:8px;border:0;background:none;text-align:left;cursor:pointer;opacity:0;animation:p-item .4s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(var(--i)*35ms)}
@keyframes p-item{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.p-style-menu button:hover,.p-style-menu button:focus-visible{background:#ffffff10;outline:none}
.p-style-menu button[aria-checked=true]{background:#ffffff16;box-shadow:inset 2px 0 var(--citron)}
.p-style-menu b{display:flex;gap:8px;align-items:baseline;font:600 14px var(--sans)}.p-style-menu em{font:normal 9px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--citron)}
.p-style-menu small{display:block;margin-top:2px;font-size:11.5px;line-height:1.4;color:#a59ca6}
.p-style-menu kbd{font:10px var(--mono);color:#8d8590;border:1px solid #ffffff22;padding:2px 6px;border-radius:3px}
.p-prev{display:block;width:50px;height:38px;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff1f}
.s-art{background:radial-gradient(circle at 30% 40%,#6552df 0 22%,transparent 46%),radial-gradient(circle at 70% 65%,#462235 0 20%,transparent 50%),#ece9ef}
.s-code{background:repeating-linear-gradient(90deg,transparent 0 9px,#6552df66 9px 10px),repeating-linear-gradient(0deg,transparent 0 9px,#46223522 9px 10px),#e7e4ea}
.s-print{background:radial-gradient(circle,#462235 0 1.4px,transparent 1.8px) 0 0/5px 5px,#efece4}
.s-term{background:repeating-linear-gradient(0deg,transparent 0 6px,#d4dd9a44 6px 7px),#131113}
.s-plan{background:linear-gradient(#ffffff2a 1px,transparent 1px) 0 0/8px 8px,linear-gradient(90deg,#ffffff2a 1px,transparent 1px) 0 0/8px 8px,#1d3a62}
.s-data{background:linear-gradient(90deg,#120c18,#462235 25%,#6552df 50%,#f2a07b 75%,#e5ed9f)}

/* Panel técnico del estilo */
.p-panel{position:absolute;left:14px;right:14px;bottom:46px;z-index:6;max-height:46%;overflow:auto;background:rgba(30,27,29,.9);color:#e9e4ea;backdrop-filter:blur(8px);border:1px solid #ffffff14;font:11.5px/1.65 var(--mono);animation:p-up .45s cubic-bezier(.16,1,.3,1)}
.p-panel[hidden]{display:none}
@keyframes p-up{from{opacity:0;transform:translateY(10px)}}
.p-panel-bar{display:flex;justify-content:space-between;padding:7px 12px;border-bottom:1px solid #ffffff14;font-size:10px;letter-spacing:.08em;color:#a59ca6;cursor:pointer}
.p-panel-bar .on{color:var(--citron)}
.p-panel.is-folded .p-panel-body{display:none}
.p-panel-body{padding:10px 12px;white-space:pre-wrap}
.p-panel .k{color:#c9b8ff}.p-panel .f{color:#e5ed9f}.p-panel .s{color:#f2b8a0}.p-panel .c{color:#8d8590}
.p-num{font:inherit;border:0;padding:0 3px;background:#6552df40;color:#f1f0e9;border-bottom:1px dashed #c9b8ff;cursor:ew-resize;touch-action:none}
.p-num:hover,.p-num.is-drag{background:#6552df}
.p-panel input{font:inherit;width:100%;border:0;border-top:1px solid #ffffff14;background:none;color:#f1f0e9;padding:8px 12px;outline:none}
.p-panel[data-style=print]{background:rgba(250,248,242,.95);color:#24211f;border-color:#24211f22}.p-panel[data-style=print] .p-panel-bar{color:#594351;border-color:#24211f1a}
.p-panel[data-style=plan]{background:rgba(20,40,70,.9);border-color:#d6e4fa88}
.p-swatch{display:inline-block;width:14px;height:14px;vertical-align:-2px;margin-right:6px;box-shadow:inset 0 0 0 1px #0002}

/* 1 · Portada */
.p-hero{min-height:calc(100svh - var(--head));display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,6vh,80px) var(--pad)}
.p-eyebrow{margin:0 0 18px;font:500 12px var(--mono);letter-spacing:.14em;color:var(--wine)}
.p-hero h1{margin:0;font-size:clamp(42px,4.6vw,86px);line-height:.98;letter-spacing:-.055em;font-weight:600}
.p-hero h1 em{color:var(--wine);letter-spacing:-.03em}
.p-lead{margin:22px 0 0;font-size:clamp(17px,1.3vw,20px);color:var(--muted);max-width:34em}
.p-needs{margin-top:clamp(28px,4vh,48px)}
.p-needs>p{margin:0 0 12px;font:500 12px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.p-need-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.p-need-list button{display:flex;gap:12px;align-items:baseline;padding:14px 16px;border:1px solid #24211f33;background:#fff6;text-align:left;font-weight:500;font-size:15px;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s}
.p-need-list button b{font:500 11px var(--mono);color:var(--wine)}
.p-need-list button:hover{transform:translateY(-2px);border-color:var(--wine)}
.p-need-list button[aria-pressed=true]{background:var(--wine);color:var(--paper);border-color:var(--wine)}.p-need-list button[aria-pressed=true] b{color:var(--citron)}
.p-answer{margin-top:14px;padding:18px 20px;background:var(--a3,#fff);color:var(--a1,#24211f);border-left:4px solid var(--a2,var(--wine));display:grid;grid-template-columns:auto 1fr;gap:6px 18px;align-items:center;animation:p-up .5s cubic-bezier(.16,1,.3,1)}
.p-answer[hidden]{display:none}
.p-answer img{grid-row:span 3;width:120px;aspect-ratio:16/10;object-fit:cover;box-shadow:0 10px 24px -14px #0008}
.p-answer span{font:500 10px var(--mono);letter-spacing:.12em;opacity:.75}
.p-answer p{margin:0;font-size:16px}
.p-answer a{font-weight:600;color:inherit}
@media(max-width:520px){.p-need-list{grid-template-columns:1fr}.p-answer{grid-template-columns:1fr}.p-answer img{grid-row:auto;width:100%}}

/* Secciones */
.p-sec-head{margin-bottom:clamp(30px,5vw,64px)}
.p-sec-head>span{display:block;margin-bottom:14px;font:500 12px var(--mono);letter-spacing:.14em;color:var(--wine)}
.p-sec-head h2{margin:0;font-size:clamp(34px,3.8vw,66px);line-height:1;letter-spacing:-.05em;font-weight:600}
.p-sec-head h2 em{color:var(--wine)}
.p-obra,.p-serv,.p-met{padding:clamp(70px,9vw,140px) var(--pad);border-top:1px solid var(--line)}

/* 2 · Obra */
.p-case{position:relative;margin:0 0 28px;padding:clamp(24px,3vw,44px);background:var(--c3);color:var(--c1);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s}
.p-case.is-on{box-shadow:0 40px 80px -50px #24211f88}
.p-case-head{display:flex;justify-content:space-between;gap:12px;font:500 11px var(--mono);letter-spacing:.12em;opacity:.7}
.p-case h3{margin:14px 0 0;font-size:clamp(44px,5vw,92px);line-height:.92;letter-spacing:-.06em;font-weight:650}
.p-case-claim{margin:10px 0 0;font:italic 400 clamp(22px,2vw,30px)/1.15 var(--serif);color:var(--c2)}
.p-case-text{margin:10px 0 22px;max-width:36em;opacity:.85}
.p-media{position:relative;background:#00000010}
.p-tabs{position:absolute;z-index:3;left:12px;top:12px;display:flex;gap:2px;padding:3px;background:#f1f0e9e6;backdrop-filter:blur(6px)}
.p-tabs button{border:0;background:none;padding:7px 12px;font:500 12px var(--sans);color:#24211f;cursor:pointer}
.p-tabs button[aria-selected=true]{background:#24211f;color:#f1f0e9}
.p-pane[hidden]{display:none}
.p-pane video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#111}
.p-film-bar{height:3px;background:#24211f22}.p-film-bar i{display:block;height:100%;width:0;background:var(--c2)}
.p-open{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;margin-top:16px;padding:18px 22px;border:0;background:var(--c1);color:var(--c3);text-align:left;cursor:pointer;position:relative;overflow:hidden;isolation:isolate}
.p-open::before{content:'';position:absolute;inset:0;background:var(--c2);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.16,1,.3,1);z-index:-1}
.p-open:hover::before,.p-open:focus-visible::before{transform:none}
.p-open b{display:block;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.02em}
.p-open small{display:block;margin-top:4px;font:500 11px var(--mono);letter-spacing:.06em;opacity:.8}
.p-open i{font-style:normal;font-size:28px;transition:transform .4s}
.p-open:hover i{transform:translate(4px,-4px)}
.p-dark .p-open{background:#f6f7f8;color:#272930}.p-dark .p-open::before{background:#a9c3e6}
.p-also{margin:28px 0 0;font-size:15px;color:var(--muted)}.p-also a{color:var(--wine);font-weight:600}

.p-demo{background:#fff;color:#24211f;padding:56px 16px 16px;user-select:none;-webkit-user-select:none;min-height:clamp(300px,28vw,420px)}
.p-demo-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px;font:500 10px var(--mono);letter-spacing:.12em;color:#6b655f}
.p-demo-note{color:var(--c2)}
.p-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.p-col{background:#f5f2ee;padding:10px;min-height:220px;display:flex;flex-direction:column;transition:background .2s,box-shadow .2s}
.p-col.is-over{background:#efe2dc;box-shadow:inset 0 0 0 2px #8c3e2e}
.p-col h4{margin:0 0 8px;font:600 13px var(--sans)}
.p-drop{flex:1;display:grid;align-content:start;gap:8px}
.p-sum{margin:8px 0 0;font:500 11px var(--mono);color:#6b655f}
.p-job{display:grid;gap:3px;padding:10px;background:#fff;border:1px solid #1919181a;border-left:4px solid #191918;box-shadow:0 8px 18px -12px #0006;cursor:grab;touch-action:none}
.p-job.is-drag{cursor:grabbing;box-shadow:0 26px 40px -18px #000a;z-index:5;position:relative}
.p-job[data-col="1"]{border-left-color:#8c3e2e}.p-job[data-col="2"]{border-left-color:#6f8f5f}
.p-job b{font:600 13px var(--sans)}.p-job span{font:500 11px var(--mono);color:#6b655f}
.p-board-total{margin:10px 0 0;font:500 12px var(--mono);color:#8c3e2e}
.p-rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.p-rooms button{position:relative;padding:0;border:0;background:#203d31;aspect-ratio:4/3;overflow:hidden;cursor:pointer;color:#fff}
.p-rooms img{width:100%;height:100%;object-fit:cover;opacity:.75;transition:opacity .3s,transform .5s}
.p-rooms span{position:absolute;left:6px;bottom:6px;padding:3px 8px;background:#203d31d9;font:600 12px var(--sans)}
.p-rooms [aria-checked=true]{box-shadow:0 0 0 3px #4f7a5f}.p-rooms [aria-checked=true] img{opacity:1;transform:scale(1.05)}
.p-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:12px 0}
.p-days button{display:grid;gap:1px;padding:6px 0;border:1px solid #203d311f;background:#f6f7f2;font:500 11px var(--mono);cursor:pointer;color:#203d31}
.p-days button b{font:600 15px var(--sans)}
.p-days button.is-in{background:#dbe3ca}.p-days button.is-edge{background:#203d31;color:#fff}
.p-days button:disabled{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.p-book-row{display:flex;justify-content:space-between;gap:10px;align-items:center}
.p-guests{display:flex;align-items:center;gap:10px;font-size:14px}.p-guests button{width:34px;height:34px;border:1px solid #203d3133;background:none;cursor:pointer;font-size:18px}
.p-book-go{padding:12px 16px;border:0;background:#203d31;color:#fff;font-weight:600;cursor:pointer}.p-book-go:disabled{opacity:.45;cursor:not-allowed}
.p-mail{margin-top:12px;padding:14px;background:#203d31;color:#eef0e6;display:grid;gap:4px;animation:p-up .6s cubic-bezier(.16,1,.3,1)}
.p-mail[hidden]{display:none}
.p-mail span{font:500 10px var(--mono);letter-spacing:.12em;color:#dbe3ca}.p-mail b{font-size:17px}.p-mail p{margin:0;font-size:14px;opacity:.9}.p-mail small{font:500 11px var(--mono);color:#dbe3ca}
.p-dark .p-demo{background:#1d1f25;color:#f6f7f8}.p-dark .p-demo-top{color:#a3a8b3}
.p-lens-field{position:relative;height:clamp(240px,22vw,330px);overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#2c3039,#1d1f25 70%);cursor:none;touch-action:none}
.p-word{position:absolute;font:500 clamp(13px,1.3vw,19px) var(--mono);letter-spacing:.14em;color:#f6f7f855;white-space:nowrap;transition:color .25s;transform:translate(-50%,-50%)}
.p-word.is-read{color:#f6f7f8}.p-word.is-found{color:#a9c3e6}
.p-glass{position:absolute;left:0;top:0;width:140px;height:140px;margin:-70px 0 0 -70px;border-radius:50%;box-shadow:inset 0 0 0 2px #f6f7f8cc,0 20px 40px -18px #000c;background:radial-gradient(circle,#ffffff10 55%,#ffffff22);pointer-events:none;transform:translate(-200px,-200px)}
.p-glass::after{content:'';position:absolute;right:-32px;bottom:-32px;width:52px;height:10px;border-radius:6px;background:#a3a8b3;transform:rotate(45deg);transform-origin:left center}

/* 3 · Servicios */
.p-serv-grid{display:grid;gap:12px}
.p-serv-grid a{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'k k' 'h p' 't p';gap:8px 24px;padding:24px 26px;border:1px solid var(--line);text-decoration:none;background:#fff8;transition:transform .3s,box-shadow .3s,background .3s}
.p-serv-grid a:hover,.p-serv-grid a:focus-visible{transform:translateX(8px);box-shadow:-8px 0 0 var(--wine);background:#fff}
.p-serv-grid span{grid-area:k;font:500 11px var(--mono);letter-spacing:.14em;color:var(--wine)}
.p-serv-grid h3{grid-area:h;margin:0;font-size:clamp(22px,2vw,30px);line-height:1.08;letter-spacing:-.035em;font-weight:600}
.p-serv-grid p{grid-area:t;margin:0;color:var(--muted);font-size:15px}
.p-serv-grid strong{grid-area:p;align-self:end;font:500 13px var(--mono);white-space:nowrap}
.p-serv-hi{background:var(--wine)!important;color:var(--paper)}.p-serv-hi span{color:var(--citron)!important}.p-serv-hi p{color:#f1f0e9cc!important}
@media(max-width:700px){.p-serv-grid a{grid-template-columns:1fr;grid-template-areas:'k' 'h' 't' 'p'}}

/* 4 · Método */
.p-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.p-steps li{padding:22px;border:1px solid var(--line);background:#fff6;cursor:default;transition:background .3s,color .3s,transform .3s}
.p-steps li:hover,.p-steps li:focus-visible{background:var(--ink);color:var(--paper);transform:translateY(-3px)}
.p-steps li:hover p,.p-steps li:focus-visible p{color:#e9e4ea}
.p-steps b{font:500 12px var(--mono);color:var(--wine)}.p-steps li:hover b{color:var(--citron)}
.p-steps h3{margin:8px 0 6px;font-size:24px;letter-spacing:-.03em;font-weight:600}
.p-steps p{margin:0;color:var(--muted);font-size:15px;transition:color .3s}

/* 5 · Hablemos */
.p-talk{padding:clamp(80px,10vw,150px) var(--pad);background:var(--wine);color:var(--paper);display:grid;justify-items:start;gap:18px}
.p-talk-k{font:500 12px var(--mono);letter-spacing:.14em;color:var(--citron)}
.p-talk h2{margin:0 0 18px;font-size:clamp(38px,5vw,86px);line-height:.98;letter-spacing:-.055em;font-weight:600}
.p-talk h2 em{color:var(--citron)}
.p-phone{display:grid;text-decoration:none;font:600 clamp(36px,4.6vw,72px)/1 var(--sans);letter-spacing:-.04em;border-bottom:3px solid var(--citron);padding-bottom:6px}
.p-phone span{font:500 12px var(--mono);letter-spacing:.14em;color:#f1f0e9b3;margin-bottom:10px}
.p-prep{font-weight:600}
.p-talk-note{margin:20px 0 0;font-size:14px;color:#f1f0e9b3}
.p-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:22px var(--pad);font:500 12px var(--mono);color:var(--muted)}
.p-foot nav{display:flex;gap:18px}.p-foot a{text-decoration:none}

/* Móvil: el campo se queda arriba, como una ventana viva */
@media(max-width:900px){
 :root{--head:58px}
 .p-head nav{display:none}.p-head{gap:8px}.p-head-client{margin-left:auto;padding:8px 10px;font-size:13px}.p-head-cta{padding:9px 12px;font-size:13px}
 .p-layout{display:flex;flex-direction:column}
 .p-main{border-right:0}
 .p-hero{min-height:0;padding-top:36px}
 .p-side-bar{padding:10px 12px}.p-side-foot{padding:8px 12px}.p-hint{display:none}
 .p-panel{bottom:34px;max-height:60%}
 .p-style-menu{width:calc(100vw - 24px)}
 .p-cols{grid-template-columns:1fr}.p-col{min-height:0}.p-drop{min-height:44px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* Fusión: el campo ocupa todo el fondo; la tinta vive a la derecha y se desvanece hacia el texto */
:root{--bleed:calc(100vw - var(--side))}
html,body{overflow-x:clip}
.p-main{position:relative;z-index:1}
.p-side{overflow:visible;background:none}
.p-stage{position:absolute;top:0;bottom:0;right:0;left:calc(-1 * var(--bleed));background:linear-gradient(90deg,var(--paper) 10%,#ebe8ee 70%);overflow:hidden}
.p-fog{position:absolute;top:-30px;left:calc(-1 * var(--bleed) - 40px);width:calc(var(--bleed) + 10vw + 40px);height:calc(100% + 60px)!important;z-index:4;pointer-events:none;filter:blur(26px)}
.p-side.is-dark .p-live,.p-side.is-dark .p-caption{background:#1e1b1de6;padding:4px 8px;margin-left:-8px}
/* Móvil: un bloque vivo dentro de la página, tras el titular; se desvanece de verdad por sus cuatro bordes */
@property --fz{syntax:'<percentage>';inherits:false;initial-value:16%}
@property --fx{syntax:'<percentage>';inherits:false;initial-value:7%}
@keyframes p-breathe{0%{--fz:14%;--fx:6%}50%{--fz:24%;--fx:11%}100%{--fz:17%;--fx:8%}}
@media(max-width:900px){
 .p-side{position:relative;top:auto;height:max(280px,42svh);z-index:auto;margin:0 0 12px}
 .p-stage{left:0;background:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 var(--fz),#000 calc(100% - var(--fz)),transparent),linear-gradient(90deg,transparent,#000 var(--fx),#000 calc(100% - var(--fx)),transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent,#000 var(--fz),#000 calc(100% - var(--fz)),transparent),linear-gradient(90deg,transparent,#000 var(--fx),#000 calc(100% - var(--fx)),transparent);mask-composite:intersect;animation:p-breathe 9s ease-in-out infinite}
 .p-fog{display:none}
 .p-side-bar{top:14%;padding:0 14px}.p-side-foot{bottom:11%;padding:0 14px}.p-panel{bottom:18%;left:14px;right:14px}
}

.p-mark{white-space:nowrap}
@media(max-width:420px){.p-head{padding:0 14px}.p-x{display:none}.p-head-client{padding:8px 9px}}

/* «Tinta y cítrico»: la frase que abre Servicios */
/* Cabecera de Servicios: rótulo, la frase como titular y el subtítulo bajo una línea */
.p-serv-head{display:grid;gap:0}
.p-tinta{position:relative;margin:clamp(6px,1.2vw,14px) 0 clamp(18px,2.4vw,30px) calc(var(--tinta-bleed,0px)*-1)}
.p-tinta canvas{display:block;width:100%;height:clamp(150px,26vw,380px);touch-action:pan-y}
.p-serv-head h2{padding-top:clamp(16px,2vw,24px);border-top:1px solid var(--line);font-size:clamp(26px,2.6vw,42px)}
.p-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.p-serv-grid a.is-lit{transform:translateX(8px);box-shadow:-8px 0 0 var(--wine);background:#fff}
.p-serv-grid a.p-serv-hi.is-lit{background:var(--wine)!important}
/* Pisaben · prueba: pide un turno */
.p-cita{display:grid;align-content:start;gap:12px}
.p-cita button{border:1px solid #0f465326;background:#f4f2ec;color:#0f4653;cursor:pointer;font:600 13px var(--sans);transition:background .2s,color .2s,transform .2s}
.p-cita button:active{transform:scale(.95)}
.p-cita button[aria-checked=true]{background:#0f4653;color:#efebe3;border-color:#0f4653}
.p-cita button:disabled{opacity:.38;cursor:not-allowed;border-style:dashed;background:transparent}
.p-cita-towns{display:flex;flex-wrap:wrap;gap:6px}.p-cita-towns button{padding:8px 13px;border-radius:30px}
.p-cita-days{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.p-cita-days button{display:grid;justify-items:center;padding:7px 0;border-radius:12px;font:500 11px var(--mono)}.p-cita-days b{font:600 16px var(--sans)}
.p-cita-turns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.p-cita-turns button{display:grid;justify-items:start;gap:2px;padding:12px 14px;border-radius:14px;text-align:left;font-size:15px}.p-cita-turns small{font:500 11.5px var(--sans);opacity:.7}
.p-cita-done{padding:14px;border-radius:14px;background:#0f4653;color:#efebe3;display:grid;gap:4px;animation:p-up .6s cubic-bezier(.16,1,.3,1)}
.p-cita-done[hidden]{display:none}.p-cita-done span{font:500 10px var(--mono);letter-spacing:.12em;color:#e8c87a}
.p-cita button:focus-visible{outline:2px solid #6552df;outline-offset:2px}

/* Proa · prueba: calcula tu alquiler */
.p-alq{display:grid;align-content:start;gap:12px}
.p-alq button{border:1px solid #0f3a4726;background:#f1f4f5;color:#10232b;cursor:pointer;font:600 13px var(--sans);transition:background .2s,color .2s,transform .2s}
.p-alq button:active{transform:scale(.95)}
.p-alq button:focus-visible{outline:2px solid #6552df;outline-offset:2px}
.p-alq-days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.p-alq-days button{display:grid;justify-items:center;padding:7px 0;border-radius:12px;font:500 10.5px var(--mono)}.p-alq-days b{font:700 17px var(--sans)}
.p-alq-days button[aria-checked=true]{background:#0f3a47;color:#fff;border-color:#0f3a47}
.p-alq-extras{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.p-alq-extras button{display:grid;justify-items:start;gap:1px;padding:9px 12px;border-radius:12px;text-align:left}.p-alq-extras small{font:500 11px var(--sans);opacity:.7}
.p-alq-extras button[aria-pressed=true]{border-color:#f5b700;background:#f5b70033}
.p-alq-total{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px;border-radius:14px;background:#0f3a47;color:#fff}
.p-alq-total div{display:grid;gap:2px}.p-alq-total small{font:500 10.5px var(--mono);letter-spacing:.06em;opacity:.75}.p-alq-total b{font:700 30px/1 var(--sans);letter-spacing:-.03em}
.p-alq-total button{padding:11px 16px;border-radius:30px;border:0;background:#f5b700;color:#10232b;font-weight:700}
.p-alq-done{padding:14px;border-radius:14px;background:#10232b;color:#fff;display:grid;gap:4px;animation:p-up .6s cubic-bezier(.16,1,.3,1)}
.p-alq-done[hidden]{display:none}.p-alq-done span{font:500 10px var(--mono);letter-spacing:.12em;color:#f5b700}.p-alq-done small{opacity:.8}
@media (max-width:520px){.p-alq-days{grid-template-columns:repeat(4,1fr)}.p-alq-extras{grid-template-columns:1fr}}

/* ZERO ART · prueba: el campo forma el símbolo de cada proyecto */
.p-zf{display:grid;grid-template-rows:auto 1fr auto;gap:10px}
.p-zf-field{width:100%;height:clamp(220px,24vw,320px);border-radius:14px;background:radial-gradient(ellipse at 50% 40%,#fbfaf6,#efece4);touch-action:pan-y;cursor:crosshair}
.p-zf-chips{display:flex;flex-wrap:wrap;gap:6px}
.p-zf-chips button{padding:8px 12px;border-radius:30px;border:1px solid #46223526;background:#f4f2ec;color:#462235;font:600 13px var(--sans);cursor:pointer}
.p-zf-chips button[aria-checked=true]{background:#462235;color:#e5ed9f;border-color:#462235}
.p-zf-chips button:focus-visible{outline:2px solid #6552df;outline-offset:2px}

/* ===== Correcciones de accesibilidad y claridad ===== */
/* Botones de necesidad: dicen adónde llevan */
.p-need-list button{flex-wrap:wrap;row-gap:4px}
.p-need-go{flex:1 0 100%;display:flex;align-items:center;gap:6px;margin-left:calc(11px*1.6 + 12px);font:500 12px var(--mono);letter-spacing:.04em;color:var(--wine);opacity:.85}
.p-need-go .ui-icon{transition:transform .25s}
.p-need-list button:hover .p-need-go .ui-icon,.p-need-list button:focus-visible .p-need-go .ui-icon{transform:translateX(3px)}
.p-need-list button[aria-pressed=true] .p-need-go{color:var(--citron);opacity:1}
.p-answer a{display:inline-flex;align-items:center;gap:4px}
/* Película: pausa / reproducir (WCAG 2.2.2) */
.p-pane[data-pane=film]{position:relative}
.p-film-play{position:absolute;right:12px;bottom:15px;z-index:2;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:#24211fd9;color:#f1f0e9;cursor:pointer;font-size:18px;transition:transform .2s,background .2s}
.p-film-play:hover{transform:scale(1.06);background:#24211f}
.p-film-play:focus-visible{outline:2px solid #6552df;outline-offset:3px}
.p-film-play .i-play,.p-film-play.is-paused .i-pause{display:none}
.p-film-play.is-paused .i-play{display:grid}
.p-film-play span{display:grid;place-items:center}
.p-film-play .ui-icon[data-ui-icon=play]{fill:currentColor}
/* Pestañas */
.p-tabs button:focus-visible{outline:2px solid #6552df;outline-offset:2px}
@media(max-width:900px){.p-tabs button{min-height:44px;padding:0 16px}}
/* Servicio 03: la app de gestión y su demo */
.p-serv-app{display:grid;background:var(--wine);color:var(--paper)}
.p-serv-app>a.p-serv-hi{border-bottom:0}
.p-serv-try{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 26px 18px;color:var(--citron);font:600 15px var(--sans);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.p-serv-try:hover{text-decoration-thickness:2px}
.p-serv-try:focus-visible{outline:2px solid var(--citron);outline-offset:-2px}
/* Contraste: la cabecera de cada caso, sin transparencia; el amarillo de Proa queda como acento, no como texto */
.p-case-head{opacity:1}
#p-proa .p-case-claim,#p-proa .p-demo-note{color:#8a6400}
/* Móvil: ningún rótulo por debajo de 12 px */
@media(max-width:900px){
 .p-case-head,.p-live,.p-side-foot,.p-caption,.p-need-list button b,.p-answer span,.p-serv-grid span,.p-serv-grid strong,.p-demo-top,.p-open small,.p-style-btn small,.p-eyebrow,.p-sec-head>span,.p-talk-k,.p-steps b,.p-panel-bar,.p-cita-days button,.p-cita-done span,.p-cita-turns small,.p-alq-days button,.p-alq-extras small,.p-alq-total small,.p-alq-done span,.p-mail span,.p-mail small,.p-sum,.p-board-total,.p-word{font-size:12px!important}
}
.p-serv-grid a.p-serv-try,.p-serv-grid a.p-serv-try:hover,.p-serv-grid a.p-serv-try:focus-visible{display:flex;grid-template:none;border:0;background:none;box-shadow:none;transform:none;padding:0 26px 20px;color:var(--citron)}
.p-serv-grid .p-serv-try span{grid-area:auto;font:inherit;letter-spacing:0;color:inherit!important;display:inline-flex}
.p-serv-app:has(>a.p-serv-hi:hover)>a.p-serv-hi{box-shadow:none}
@media(max-width:900px){.p-case-claim{font-size:24px}}
