/* ============================================================
   ABADAL SHARED PAGE STYLES — Brand System v1.3 (oficial)
   Tipografía: Play Bold 700 (display) + Manrope 400/500/600 (sans)
   Paleta: Black ink / Burgundy red / Light smoky gray / Ivory white
   ============================================================ */

/* === SELF-HOSTED PLAY (fallback Google Fonts) === */
@font-face{
  font-family:'Play';
  src:url('/assets/fonts/Play-Regular.woff2') format('woff2'),url('/assets/fonts/Play-Regular.ttf') format('truetype');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Play';
  src:url('/assets/fonts/Play-Bold.woff2') format('woff2'),url('/assets/fonts/Play-Bold.ttf') format('truetype');
  font-weight:700;font-style:normal;font-display:swap;
}

/* === SELF-HOSTED MANROPE (autoalojada — sin Google Fonts, RGPD) === */
@font-face{
  font-family:'Manrope';
  src:url('/assets/fonts/manrope-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Manrope';
  src:url('/assets/fonts/manrope-500.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Manrope';
  src:url('/assets/fonts/manrope-600.woff2') format('woff2');
  font-weight:600;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Manrope';
  src:url('/assets/fonts/manrope-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap;
}

/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{background:#121212;color:#F4F1EC;font-family:'Manrope',system-ui,sans-serif;font-weight:400;line-height:1.6;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{background:none;border:none;padding:0;cursor:pointer;-webkit-appearance:none;appearance:none;color:inherit;font:inherit;line-height:inherit}
::selection{background:#8C1D18;color:#F4F1EC}

/* === ABADAL BRAND TOKENS (oficial Brand System 1.3) === */
:root{
  /* Paleta oficial */
  --ink:#121212;          /* Black ink — 60% base estructural · Pantone Black 6 C */
  --burgundy:#8C1D18;     /* Burgundy red — 25% acento corporativo · Pantone 7627 C */
  --smoke:#E5E7EB;        /* Light smoky gray — 10% fondos neutros · Pantone Cool Gray 1 C */
  --ivory:#F4F1EC;        /* Ivory white — 5% espacio · Pantone 9183 C */

  /* Derivados burgundy */
  --burgundy-h:#A82B27;   /* Hover */
  --burgundy-d:#6A1411;   /* Activado */
  --gold:#EAC113;         /* Gualda — acento bandera España (uso puntual) */

  /* Derivados ink (superficies oscuras) */
  --ink-2:#1E1E1E;        /* Surface 1 */
  --ink-3:#2A2A2A;        /* Surface 2 (cards) */

  /* Derivados ivory/smoky */
  --ivory-d:#D9D4CA;
  --smoke-d:#B8BCC2;

  /* Textos secundarios — RATIOS WCAG AA mínimo sobre --ink */
  --fog:#A8A8A8;          /* ratio 5.1:1 ✓ AA (antes #6E6E6E fallaba) */
  --ash:#C2C2C2;          /* ratio 7.4:1 ✓ AAA (antes #9A9A9A rozaba) */
  --stone:#3E3E3E;        /* sobre claro · ratio 11.1:1 ✓ AAA */

  /* Colores funcionales (solo UI digital) */
  --success:#1A6B3A;      /* Verde bosque */
  --warning:#B45309;      /* Ámbar oscuro */
  --error:#BA2424;        /* Rojo señal */
  --info:#1D4E8C;         /* Azul corporativo */

  /* Glass overlays */
  --glass:rgba(244,241,236,.04);
  --glass-b:rgba(244,241,236,.12);

  /* Tipografía oficial */
  --display:'Play','Arial Narrow',system-ui,sans-serif;
  --sans:'Manrope',system-ui,sans-serif;

  /* Escala oficial Brand Guidelines 1.3 */
  --fs-h1:48px;   --lh-h1:1.10; --tr-h1:-0.5px;
  --fs-h2:36px;   --lh-h2:1.15; --tr-h2:-0.3px;
  --fs-h3:28px;   --lh-h3:1.20; --tr-h3:0;
  --fs-h4:22px;   --lh-h4:1.30; --tr-h4:0;
  --fs-h5:18px;   --lh-h5:1.35; --tr-h5:0.1px;
  --fs-h6:14px;   --lh-h6:1.40; --tr-h6:0.8px;
  --fs-body:16px; --lh-body:1.60; --tr-body:0;
  --fs-small:13px;--lh-small:1.50;--tr-small:0.1px;
  --fs-caption:11px;--lh-caption:1.40;--tr-caption:0.2px;

  /* Motion */
  --spring:cubic-bezier(.16,1,.3,1);

  /* ELEVATION — grade fotográfico único "nocturno Abadal" (M4) */
  --grade:brightness(.84) contrast(1.1) saturate(.72);
  --grade-hover:brightness(.96) contrast(1.06) saturate(.9);
  --grade-soft:brightness(.9) contrast(1.06) saturate(.85); /* fotos archivo/sepia (heritage) */

  /* ELEVATION — matices de superficie (M5/M6) */
  --elev-border:rgba(244,241,236,.25);  /* borde card hover: un paso sobre glass-b */
  --elev-ghost:rgba(244,241,236,.08);   /* fill barrido btn ghost */
}

/* === JERARQUÍA TIPOGRÁFICA BASE === */
h1,.h1{font-family:var(--display);font-weight:700;font-size:var(--fs-h1);line-height:var(--lh-h1);letter-spacing:var(--tr-h1)}
h2,.h2{font-family:var(--display);font-weight:700;font-size:var(--fs-h2);line-height:var(--lh-h2);letter-spacing:var(--tr-h2)}
h3,.h3{font-family:var(--display);font-weight:700;font-size:var(--fs-h3);line-height:var(--lh-h3);letter-spacing:var(--tr-h3)}
h4,.h4{font-family:var(--sans);font-weight:600;font-size:var(--fs-h4);line-height:var(--lh-h4);letter-spacing:var(--tr-h4)}
h5,.h5{font-family:var(--sans);font-weight:600;font-size:var(--fs-h5);line-height:var(--lh-h5);letter-spacing:var(--tr-h5)}
h6,.h6{font-family:var(--sans);font-weight:500;font-size:var(--fs-h6);line-height:var(--lh-h6);letter-spacing:var(--tr-h6);text-transform:uppercase}
.body-text{font-family:var(--sans);font-weight:400;font-size:var(--fs-body);line-height:var(--lh-body);letter-spacing:var(--tr-body)}
.small{font-family:var(--sans);font-weight:400;font-size:var(--fs-small);line-height:var(--lh-small);letter-spacing:var(--tr-small)}
.caption{font-family:var(--sans);font-weight:400;font-size:var(--fs-caption);line-height:var(--lh-caption);letter-spacing:var(--tr-caption)}

/* HEADER */
.header{position:fixed;top:0;left:0;right:0;z-index:1000;padding:0 clamp(20px,4vw,48px);height:80px;display:flex;align-items:center;justify-content:space-between;transition:transform .5s var(--spring),background .4s,backdrop-filter .4s;background:rgba(18,18,18,.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.header.is-hidden{transform:translateY(-100%)}
.header__logo{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 4px}
.header__logo-shield{height:36px!important;width:auto!important}
.header__nav{display:none;gap:32px}
@media(min-width:1024px){.header__nav{display:flex}.header{height:112px}.header__logo-shield{height:72px!important}}
.header__link{font-family:var(--sans);font-size:11px;font-weight:400;color:var(--fog);letter-spacing:.18em;text-transform:uppercase;transition:color .3s}
.header__link:hover,.header__link.is-active{color:var(--ivory)}
.header__cta-link{color:var(--ivory)}
.header__cta-link:hover{color:var(--ivory-d)}
.header__burger{display:flex;flex-direction:column;gap:5px;width:48px;height:48px;padding:14px 12px;background:none;border:none;cursor:pointer}
.header__burger span{display:block;width:24px;height:1.5px;background:var(--ivory);transition:transform .4s var(--spring),opacity .3s}
.header__burger.is-active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.header__burger.is-active span:nth-child(2){opacity:0}
.header__burger.is-active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
@media(min-width:1024px){.header__burger{display:none}}

/* MOBILE MENU */
.mobile-menu{position:fixed;inset:0;z-index:999;background:rgba(18,18,18,.97);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
.mobile-menu.is-open{opacity:1;visibility:visible}
.mobile-menu__list{display:flex;flex-direction:column;align-items:center;gap:20px}
.mobile-menu__link{font-family:var(--display);font-size:clamp(1.8rem,6vw,3rem);font-weight:400;color:var(--ivory);letter-spacing:.02em;transition:color .2s;display:flex;align-items:center;min-height:44px;padding:4px 0}
.mobile-menu__link:hover{color:var(--ivory)}

/* PAGE HERO — M8: anclado abajo, funde con la página (overlay termina en ink sólido) */
.page-hero{min-height:72svh;display:flex;align-items:flex-end;justify-content:center;position:relative;padding:120px clamp(20px,4vw,48px) clamp(56px,8vw,96px);text-align:center}
.page-hero__bg{position:absolute;inset:0;z-index:0}
.page-hero__bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.4) contrast(1.1) saturate(.72)}
.page-hero__overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(18,18,18,.5) 0%,rgba(18,18,18,.72) 55%,var(--ink) 100%)}
.page-hero__content{position:relative;z-index:2;max-width:900px}
.page-hero__label{font-family:var(--sans);font-size:10px;color:var(--ash);letter-spacing:.3em;text-transform:uppercase;margin-bottom:20px}
.page-hero__title{font-family:var(--display);font-size:clamp(3.2rem,9vw,8rem);font-weight:700;color:var(--ivory);letter-spacing:0;line-height:1.02;text-shadow:none}
.page-hero__sub{font-family:var(--sans);font-size:clamp(.95rem,1.25vw,1.1rem);color:var(--ash);max-width:46ch;margin:24px auto 0;line-height:1.75}

/* CONTAINER */
.container{max-width:1200px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}

/* COMMON TYPE */
/* M1 — eyebrow técnico: tick burgundy 24×2px ("línea de Valls") + texto fog tracking ancho.
   El chip relleno queda reservado a .label--badge (solo estados reales). */
.label{display:inline-flex;align-items:center;background:transparent;padding:0;border-radius:0;font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:var(--ash)}
.label::before{content:'';display:inline-block;width:24px;height:2px;background:var(--burgundy);flex:none;margin-right:14px;vertical-align:middle}
.sec-cream .label,.sec-smoke .label{color:var(--stone)}
.sec-cream .section-sub,.sec-smoke .section-sub{color:var(--stone)}
.label--badge{background:var(--burgundy);color:var(--ivory);padding:4px 10px;letter-spacing:.28em;font-size:10px}
.label--badge::before{display:none}
.section-title{font-family:var(--display);font-size:clamp(2rem,4vw,3rem);color:var(--ivory);font-weight:700;letter-spacing:.02em;line-height:1.15;margin-top:12px}
.section-sub{font-family:var(--sans);font-style:normal;color:var(--fog);max-width:50ch;margin:16px auto 0;font-size:.95rem;letter-spacing:.01em}

/* BUTTONS */
/* M6 — barrido de tinta burgundy izq→dcha bajo el texto (sin lift, sin glow).
   Hover sobre burgundy → texto Ivory (WCAG AAA · brand: "Burgundy fondo + Ivory texto") */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 44px;font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;border:1px solid var(--burgundy);background:transparent;color:var(--ivory);cursor:pointer;transition:color .4s var(--spring),border-color .4s var(--spring);text-align:center;position:relative;overflow:hidden;z-index:0}
.btn::before{content:'';position:absolute;inset:0;background:var(--burgundy);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--spring);z-index:-1}
.btn:hover{background:transparent;color:var(--ivory);transform:none}
.btn:hover::before{transform:scaleX(1)}
.btn--ghost{border-color:rgba(244,241,236,.4);color:var(--ivory)}
.btn--ghost::before{background:var(--elev-ghost)}
.btn--ghost:hover{background:transparent;border-color:var(--ivory);color:var(--ivory)}
.sec-cream .btn::before,.sec-smoke .btn::before{background:var(--ink-2)}

/* Divider line (burgundy accent) */
.divider-line{display:block;width:220px;height:1px;margin:0 auto;background:linear-gradient(90deg,transparent,var(--burgundy),transparent);opacity:.8}

/* SECTIONS */
.sec-cream{background:var(--ivory);color:var(--ink)}
.sec-smoke{background:var(--smoke);color:var(--ink)}

/* FOOTER */
.footer{padding:var(--gap) 0 48px;text-align:center;background:linear-gradient(180deg,var(--ink) 0%,var(--ink-2) 100%)}
.footer__divider-line{width:220px;height:1px;margin:0 auto 48px;background:linear-gradient(90deg,transparent,var(--burgundy),transparent);opacity:.7}
.footer__links{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;margin-bottom:32px}
.footer__link{font-family:var(--sans);font-size:10px;color:var(--fog);letter-spacing:.18em;text-transform:uppercase;transition:color .3s;display:inline-block;padding:12px 4px;line-height:1}
.footer__link:hover{color:var(--ivory)}
.footer__meta{font-family:var(--sans);font-size:9px;color:var(--ash);letter-spacing:.25em;text-transform:uppercase;opacity:.75}
.footer__holdings{font-family:var(--sans);font-size:9px;color:var(--ash);letter-spacing:.2em;text-transform:uppercase;opacity:.65;margin-top:12px}

/* FORMS */
.form-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:600px){.form-grid--2col{grid-template-columns:1fr 1fr}}
.form-field input,.form-field select,.form-field textarea{width:100%;min-height:52px;padding:0 20px;background:transparent;border:1px solid var(--glass-b);color:var(--ivory);font-family:var(--sans);font-size:14px;font-weight:400;outline:2px solid transparent;transition:border-color .3s}
.form-field textarea{padding:16px 20px;min-height:120px;resize:vertical}
.form-field input::placeholder,.form-field textarea::placeholder{color:var(--ash)}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--ivory)}
.form-field select{background:var(--ink-2);cursor:pointer}
.form-field label{display:block;font-family:var(--sans);font-size:10px;color:var(--ivory);letter-spacing:.2em;text-transform:uppercase;margin-bottom:8px}

/* ACCESSIBILITY */
/* Skip to content (visible al focus, accesible para lectores de pantalla) */
.skip-link{position:absolute;top:-100px;left:0;background:var(--ink);color:var(--ivory);padding:12px 24px;z-index:100000;text-decoration:underline;border:2px solid var(--burgundy);font-family:var(--sans);font-size:14px;font-weight:500}
.skip-link:focus{top:8px;left:8px}

/* Visually hidden (sr-only) */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

*:focus-visible{outline:2px solid var(--ivory);outline-offset:3px;box-shadow:0 0 0 2px #121212,0 0 0 4px #F4F1EC}
:focus{scroll-margin-top:128px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Full nav with all links — smaller text to fit */
@media(min-width:1200px){.header__nav{gap:28px}.header__link{font-size:10px;letter-spacing:.16em}}
@media(min-width:1024px) and (max-width:1199px){.header__nav{gap:18px}.header__link{font-size:9.5px;letter-spacing:.14em}}
.lang-toggle{display:inline-flex;gap:0;margin-left:12px;padding-left:12px;border-left:1px solid var(--glass-b)}
.lang-toggle a{font-family:var(--sans);font-size:10px;color:var(--fog);letter-spacing:.15em;padding:0 6px;transition:color .3s}
.lang-toggle a.is-active{color:var(--ivory)}
.lang-toggle a:hover{color:var(--ivory)}

/* ============================================================
   ✦ HIPERPREMIUM SHARED — Sprint 28/05/2026
   Aplica preloader, cursor contextual, page-hero ken-burns,
   tratamiento editorial imágenes, footer ritual a TODAS las
   páginas internas (modelo, historia, fabrica, influencers,
   shop, contacto + sus equivalentes EN).
   ============================================================ */

/* PRELOADER CINEMATOGRÁFICO */
.preloader{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;background:#0a0a0a;overflow:hidden}
.preloader::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%,rgba(140,29,24,.12) 0%,transparent 55%);pointer-events:none}
.preloader__inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:36px;text-align:center;z-index:1}
.preloader__shield{width:80px;height:auto;opacity:0;transform:translateY(10px) scale(.94)}
.preloader__shield path{stroke-dasharray:1000;stroke-dashoffset:1000;fill:none;stroke:var(--burgundy);stroke-width:1.4}
.preloader.is-active .preloader__shield{opacity:1;transform:translateY(0) scale(1);transition:opacity 1.2s var(--spring) .2s,transform 1.4s var(--spring) .2s}
.preloader.is-active .preloader__shield path{animation:shield-draw 2.2s ease-out .5s forwards}
@keyframes shield-draw{60%{stroke-dashoffset:0}100%{stroke-dashoffset:0;fill:rgba(140,29,24,.1)}}
.preloader__word{font-family:var(--display);font-weight:700;font-size:clamp(2.6rem,5.5vw,4.4rem);color:var(--ivory);letter-spacing:.18em;display:flex;gap:0;line-height:1;margin:0}
.preloader__word span{display:inline-block;opacity:0;transform:translateY(28px) rotateX(-30deg);transform-origin:50% 100%}
.preloader.is-active .preloader__word span{animation:char-rise 1s var(--spring) forwards}
@keyframes char-rise{to{opacity:1;transform:translateY(0) rotateX(0)}}
.preloader__script{font-family:var(--display);font-weight:400;font-style:italic;font-size:clamp(1rem,1.7vw,1.3rem);color:var(--ivory-d);letter-spacing:.05em;opacity:0;transform:translateY(10px);transition:opacity 1.2s 2.6s,transform 1.2s 2.6s;margin:0}
.preloader.is-active .preloader__script{opacity:.85;transform:translateY(0)}
.preloader__line{width:0;height:1px;background:linear-gradient(90deg,transparent,var(--burgundy),transparent);transition:width 1.6s 2.9s var(--spring)}
.preloader.is-active .preloader__line{width:320px}
.preloader__bottom{position:absolute;bottom:32px;left:0;right:0;display:flex;justify-content:space-between;padding:0 32px;font-family:var(--sans);font-size:9px;color:var(--ivory-d);letter-spacing:.32em;text-transform:uppercase;opacity:0;transition:opacity 1s 3.2s}
.preloader.is-active .preloader__bottom{opacity:.5}
.preloader.preloader--leaving{opacity:0;transform:translateY(-20px);filter:blur(4px);transition:opacity 1.4s var(--spring),transform 1.4s var(--spring),filter 1s var(--spring)}
@media(prefers-reduced-motion:reduce){.preloader__shield,.preloader__word span,.preloader__script,.preloader__line,.preloader__bottom{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}.preloader__shield path{stroke-dashoffset:0!important;fill:rgba(140,29,24,.1)!important}.preloader__line{width:320px!important}}

/* CURSOR CONTEXTUAL */
.cursor{position:fixed;width:22px;height:22px;border:1px solid var(--ivory);border-radius:50%;pointer-events:none;z-index:99998;transform:translate(-50%,-50%);transition:width .45s var(--spring),height .45s var(--spring),border-color .35s,background .35s,opacity .3s;mix-blend-mode:difference;display:flex;align-items:center;justify-content:center}
.cursor__label{font-family:var(--sans);font-size:9px;font-weight:500;color:var(--ivory);letter-spacing:.22em;text-transform:uppercase;opacity:0;transition:opacity .3s .15s;pointer-events:none;white-space:nowrap}
.cursor.is-hover{width:78px;height:78px;border-color:var(--ivory);background:rgba(140,29,24,.15)}
.cursor.is-hover .cursor__label{opacity:1}
/* nace invisible: solo aparece tras el primer mousemove (JS añade .is-on) — evita el arco recortado en (0,0) */
.cursor{opacity:0;visibility:hidden}
.cursor.is-on{opacity:1;visibility:visible}
@media(pointer:coarse){.cursor{display:none}}

/* PAGE-HERO KEN-BURNS perpetuo */
.page-hero__bg{overflow:hidden}
.page-hero__bg img{animation:page-hero-kb 32s ease-in-out infinite alternate;transform-origin:50% 50%}
@keyframes page-hero-kb{0%{transform:scale(1) translate3d(0,0,0)}100%{transform:scale(1.08) translate3d(1.5%,-1%,0)}}
.page-hero__bg::after{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.08 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");opacity:.4;mix-blend-mode:overlay;pointer-events:none;z-index:1}
@media(prefers-reduced-motion:reduce){.page-hero__bg img{animation:none}}

/* PAGE-HERO TIPOGRAFÍA EDITORIAL — M8 display bravo + M9 sub Manrope (faux-italic fuera) */
.page-hero__title{font-family:var(--display);font-weight:700;font-size:clamp(3.2rem,9vw,8rem);color:var(--ivory);letter-spacing:0;line-height:1.02;text-shadow:none}
.page-hero__sub{font-family:var(--sans);font-style:normal;font-weight:400;color:var(--ash);max-width:46ch;margin:28px auto 0;line-height:1.75;font-size:clamp(.95rem,1.25vw,1.1rem);letter-spacing:.02em;opacity:1}
.page-hero__label{display:inline-flex;align-items:center;font-family:var(--sans);font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--ash);margin-bottom:24px;font-weight:500}
.page-hero__label::before{content:'';display:inline-block;width:24px;height:2px;background:var(--burgundy);flex:none;margin-right:14px}

/* BTN HERO premium — M6: sin lift, sin glow; el ::before de .btn hace el barrido */
.btn--hero{min-height:64px;padding:0 60px;font-size:11px;letter-spacing:.32em;border-width:1px;font-weight:500;background:transparent;transition:color .4s var(--spring),border-color .4s var(--spring)}
.btn--hero:hover{background:transparent;color:var(--ivory);transform:none;box-shadow:none}

/* FOOTER RITUAL elements */
.footer__emblem{display:block;width:110px;height:auto;margin:0 auto 24px}
.footer__brand{font-family:var(--display);font-size:clamp(1.6rem,4vw,2.6rem);color:var(--ivory);margin-bottom:6px;font-weight:700;letter-spacing:.14em;line-height:1}
.footer__script{font-family:var(--display);font-weight:400;font-style:italic;font-size:clamp(1.4rem,2.5vw,2rem);color:var(--ivory);margin-bottom:18px;letter-spacing:.005em;opacity:.92}
.footer__sub{font-family:var(--sans);font-size:11px;color:var(--ivory-d);letter-spacing:.32em;text-transform:uppercase;margin:0 auto 56px;line-height:1.6;font-weight:500;max-width:50ch;text-align:center}
.footer__sub em{color:var(--burgundy-h);font-style:italic;font-family:var(--display);font-weight:400;letter-spacing:.005em;text-transform:none;font-size:1.15em}
.footer__cta-wrap{margin-bottom:64px;text-align:center}
.footer__meta span{color:var(--ivory-d);font-weight:600}

/* SECCIONES más anchas y respiradas */
:root{--gap:clamp(6rem,10vw,10rem)}
section{position:relative;padding:var(--gap) 0}

/* DIVIDER LINE estático (sin pulse perpetuo) */
.divider-line{display:block;width:240px;height:1px;margin:0 auto;background:linear-gradient(90deg,transparent,var(--burgundy),transparent);opacity:.8}

/* FOOTER GROUP STRIP */
.footer__group-strip{margin-top:48px;padding-top:36px;border-top:1px solid var(--glass-b);font-family:var(--sans);font-size:10px;color:var(--ivory-d);letter-spacing:.22em;text-transform:uppercase;line-height:2;text-align:center}
.footer__group-strip strong{color:var(--ivory);font-weight:600;letter-spacing:.25em}
.footer__group-strip a{color:var(--ivory);border-bottom:1px solid var(--burgundy);padding-bottom:2px;transition:border-color .3s,color .3s}
.footer__group-strip a:hover{border-color:var(--ivory);color:var(--ivory)}
.footer__group-marks{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;margin-top:14px;font-size:9px;letter-spacing:.3em;opacity:.9;color:var(--ivory-d)}

/* Estado playing audio (igual que home) */
.audio-toggle{position:fixed;bottom:24px;right:24px;width:46px;height:46px;border-radius:50%;background:rgba(18,18,18,.82);border:1px solid var(--glass-b);color:var(--ivory-d);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:9990;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:background .3s,border-color .3s,transform .35s var(--spring),color .3s,box-shadow .3s;padding:0;font-family:inherit}
.audio-toggle:hover{background:rgba(140,29,24,.78);border-color:var(--burgundy);color:var(--ivory);transform:scale(1.08);box-shadow:0 6px 24px rgba(140,29,24,.3)}
.audio-toggle:focus-visible{outline:2px solid var(--burgundy);outline-offset:3px}
.audio-toggle svg{width:18px;height:18px}
.audio-toggle__on{display:none}
.audio-toggle__off{display:block}

/* checkbox no hereda width:100% del form-field; clip global anti scroll-x */
.form-field input[type=checkbox]{width:16px;height:16px;min-height:0;padding:0;flex-shrink:0}
body{overflow-x:hidden}
html{overflow-x:hidden;overflow-x:clip}

/* ============================================================
   ===== ELEVATION SYSTEM ===== Sprint 10/06/2026
   "Documento técnico de una casa centenaria" — la línea de Valls
   (tick burgundy 24×2px / scaleX desde la izquierda, 400ms --spring)
   repetida en eyebrows (M1), cards (M5), botones (M6) y nav (M10).
   NOTA CASCADA: los <style> de página cargan DESPUÉS de shared.css;
   los overrides llevan prefijo `body ` para ganar especificidad.
   ============================================================ */

/* --- M2 · COORDENADAS DE SECCIÓN (índice 01 — Nombre via CSS counters) ---
   Activación: añadir data-idx="Nombre" SOLO a secciones de contenido
   (nunca a .hero, .page-hero, .showcase, .closing ni footer). */
main{counter-reset:sec}
main>section[data-idx]{counter-increment:sec}
main>section[data-idx]::before{content:counter(sec,decimal-leading-zero) ' — ' attr(data-idx);position:absolute;top:32px;left:clamp(20px,4vw,48px);font-family:var(--sans);font-size:9px;font-weight:500;letter-spacing:.4em;text-transform:uppercase;color:var(--fog);opacity:.55;z-index:3;pointer-events:none}
main>section.sec-cream[data-idx]::before,main>section.sec-smoke[data-idx]::before{color:var(--stone)}

/* --- M3 · REVEAL STAGGER (gate html.js: sin JS todo visible) ---
   Activación: data-reveal en el elemento (+ style="--d:n" para stagger)
   y el observer de 6 líneas documentado en README de ejecutores.
   NO aplicar a elementos above-the-fold del hero. */
html.js [data-reveal]{opacity:0;transform:translateY(16px)}
html.js [data-reveal].is-in{opacity:1;transform:none;transition:opacity .45s var(--spring),transform .45s var(--spring);transition-delay:calc(var(--d,0)*70ms)}
/* hairline que entra scaleX 0→1 (pillar, overview__item, info-item, network-stat) */
.hairline-x{position:relative}
html.js .hairline-x{border-top-color:transparent}
.hairline-x::before{content:'';position:absolute;top:-1px;left:0;right:0;height:1px;background:var(--glass-b);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--spring) .1s}
.hairline-x.is-in::before,html:not(.js) .hairline-x::before{transform:scaleX(1)}
/* variante burgundy para hairlines que ya eran burgundy (info-item, network-stat) */
.info-item.hairline-x::before,.network-stat.hairline-x::before{background:var(--burgundy)}
@media(prefers-reduced-motion:reduce){
  html.js [data-reveal]{opacity:1;transform:none}
  .hairline-x::before{transform:scaleX(1)!important}
}

/* --- M4 · GRADE FOTOGRÁFICO ÚNICO "nocturno Abadal" ---
   (heritage/historia EXCLUIDO: página bloqueada por otro proceso —
   cuando se libere, aplicar var(--grade-soft) a .heritage__img) */
body .gallery__item img,body .post-card__media img,body .xavi-edition__visual img,body .product__img img{filter:var(--grade);transition:filter .45s var(--spring),transform .45s var(--spring)}
body .gallery__item:hover img,body .post-card:hover .post-card__media img,body .product:hover .product__img img{filter:var(--grade-hover)}

/* --- M5 · FIRMA DE CARDS: línea burgundy scaleX + borde un paso (sin lift) --- */
.product,.press-card,.dealer-card,.amb-card,.renting__card,.rv-card,.tech-item,.post-card{position:relative}
:is(.product,.press-card,.dealer-card,.amb-card,.renting__card,.rv-card,.tech-item,.post-card)::after{content:'';position:absolute;top:0;left:0;width:100%;height:2px;background:var(--burgundy);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--spring);pointer-events:none;z-index:2}
:is(.product,.press-card,.dealer-card,.amb-card,.renting__card,.rv-card,.tech-item,.post-card):is(:hover,:focus-visible,:focus-within)::after{transform:scaleX(1)}
/* override de los lifts/borde-ivory definidos en los <style> de página */
body :is(.product,.press-card,.dealer-card,.amb-card,.renting__card,.rv-card,.tech-item,.post-card):hover{transform:none;border-color:var(--elev-border)}

/* --- M6 · BOTONES CON FONDO BURGUNDY YA RELLENO (closing__cta): sin lift --- */
body .closing__cta:hover{transform:none;box-shadow:none}

/* --- M7 · CHROME DE MARCA: scrollbar, caret, focus sobre burgundy --- */
html{scrollbar-width:thin;scrollbar-color:var(--ink-3) var(--ink)}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--ink)}
::-webkit-scrollbar-thumb{background:var(--ink-3);border:2px solid var(--ink);border-radius:0}
::-webkit-scrollbar-thumb:hover{background:var(--burgundy)}
input,textarea,select{caret-color:var(--burgundy)}
/* sobre fondo burgundy el ring burgundy desaparece → ivory */
.chip.is-active:focus-visible,.closing__cta:focus-visible,.footer__submit:focus-visible,.label--badge:focus-visible{outline-color:var(--ivory)}

/* --- MENÚ MÓVIL · papel casi opaco + blur: el hero no sangra tras los items --- */
.mobile-menu{background:rgba(18,18,18,.97);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
/* el panel respeta la cabecera (80px) y scrollea sin recortar "Inicio";
   margin:auto re-centra la lista cuando sobra espacio */
.mobile-menu{align-items:flex-start;overflow-y:auto;padding:96px 24px 48px}
.mobile-menu__list{margin:auto}
/* el CTA del menú recupera jerarquía de conversión: outline burgundy como en desktop */
.mobile-menu__link--cta{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory);border:1px solid var(--burgundy);padding:16px 28px;margin-top:12px;text-align:center}
.mobile-menu__link--cta::after{content:none}
.mobile-menu__link--cta:hover,.mobile-menu__link--cta:focus-visible{background:var(--burgundy);color:var(--ivory)}

/* --- LEAFLET · controles +/- al papel de la casa: ink, hairline, sharp (≤4px) ---
   (aplica a los mapas de fábrica, red y contacto + equivalentes EN) */
.leaflet-bar,.leaflet-control-zoom{border:1px solid var(--glass-b)!important;border-radius:0!important;box-shadow:none!important}
.leaflet-control-zoom a{background:var(--ink)!important;color:var(--ivory)!important;border-radius:0!important;border-bottom:1px solid var(--glass-b)!important}
.leaflet-control-zoom a:last-child{border-bottom:none!important}
.leaflet-control-zoom a:hover{background:var(--ink-2)!important;color:var(--ivory)!important}
.leaflet-control-zoom a:focus-visible{outline:2px solid var(--burgundy);outline-offset:-2px}
.leaflet-control-zoom a.leaflet-disabled{background:var(--ink)!important;color:var(--fog)!important;opacity:.5}
.leaflet-control-attribution{background:rgba(18,18,18,.82)!important;color:var(--fog)!important;font-family:var(--sans)!important}
.leaflet-control-attribution a{color:var(--ash)!important}

/* --- M10 · NAV VIVA: subrayado hairline burgundy scaleX (misma firma) --- */
.header__link{position:relative;padding:6px 0}
.header__link::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--spring)}
.header__link:hover::after,.header__link.is-active::after,.header__link:focus-visible::after{transform:scaleX(1)}
.header__cta-link::after{background:var(--ivory)}
.mobile-menu__link{position:relative;padding-bottom:4px}
.mobile-menu__link::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--burgundy);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--spring)}
.mobile-menu__link:hover::after,.mobile-menu__link:focus-visible::after{transform:scaleX(1)}

/* --- IDENTIDAD · COORDENADAS 1912—2026 (banda de datos de la casa) ---
   Markup ejecutores (footer, junto a .footer__meta):
   <p class="footer__coords">41°17′N 1°15′E — VALLS · TARRAGONA · 1912—2026</p>
   Reutilizable como caption del mapa (contacto) y banda de fabrica/. */
.footer__coords{font-family:var(--sans);font-size:9px;color:#969696;letter-spacing:.3em;text-transform:uppercase;margin-top:10px}
.coords-band{display:flex;align-items:center;gap:18px;font-family:var(--sans);font-size:10px;color:var(--fog);letter-spacing:.32em;text-transform:uppercase}
.coords-band::before{content:'';width:24px;height:2px;background:var(--burgundy);flex:none}

/* --- REDUCED MOTION del sistema (cinturón además del kill global) --- */
@media(prefers-reduced-motion:reduce){
  .btn::before,:is(.product,.press-card,.dealer-card,.amb-card,.renting__card,.rv-card,.tech-item,.post-card)::after,.header__link::after,.mobile-menu__link::after{transition:none}
  body .gallery__item img,body .post-card__media img,body .xavi-edition__visual img,body .product__img img{transition:none}
}

/* ============================================================
   === HOVER SWAP (delante → detrás) — Sprint 23/06/2026
   Uso: envolver el contenedor de imagen con .product__img--swap
   y añadir .ps-front (imagen delantera) + .ps-back (imagen trasera).
   Funciona también en tarjetas de home con .objeto-card__img--swap
   (o combinando ambas clases: .objeto-card__img.product__img--swap).
   ============================================================ */
.product__img--swap,.objeto-card__img--swap{position:relative}
.product__img--swap .ps-img,.objeto-card__img--swap .ps-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.product__img--swap .ps-back,.objeto-card__img--swap .ps-back{opacity:0;transition:opacity .5s var(--spring)}
.product__img--swap:hover .ps-back,.product__img--swap:focus-within .ps-back,
.objeto-card__img--swap:hover .ps-back,.objeto-card__img--swap:focus-within .ps-back{opacity:1}
.product__img--swap .ps-front,.objeto-card__img--swap .ps-front{transition:opacity .5s var(--spring)}
.product__img--swap:hover .ps-front,.objeto-card__img--swap:hover .ps-front{opacity:0}
@media(prefers-reduced-motion:reduce){
  .product__img--swap .ps-back,.product__img--swap .ps-front,
  .objeto-card__img--swap .ps-back,.objeto-card__img--swap .ps-front{transition:none}
}