/* =========================================================================
   Skrita · sistema tipográfico (referencia: escala y ritmo de vitra.com)
   Jost (geométrica tipo Futura) · pesos 400/500 · minúscula de frase
   Se carga en todas las páginas después del resto de hojas.
   ========================================================================= */
:root{
  --ty-ink:#101010;      /* titulares */
  --ty-text:#333;        /* texto */
  --ty-mute:#767676;     /* secundario */
  --ty-display:50px;     /* hero */
  --ty-h1:40px;          /* título de página / sección */
  --ty-h3:20px;          /* título de bloque */
  --ty-lead:20px;        /* entradilla */
  --ty-body:17px;        /* texto corrido */
  --ty-small:15px;       /* tarjetas, pie */
  --ty-micro:13px;       /* legales, etiquetas */
}
@media(max-width:760px){:root{--ty-display:32px;--ty-h1:28px;--ty-h3:19px;--ty-lead:18px;--ty-body:16px;--ty-small:15px}}

html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body{font-family:'Jost',Futura,'Century Gothic',Arial,sans-serif!important;color:var(--ty-text);font-weight:400}

/* ---- Display (hero) ---------------------------------------------------- */
.skx-title,.skx-h1,.page-hero-tag h1,.page-hero-tag h2.h1-alt,.editorial-hero__title,.skf-hero h1,.skf-hero__title,.page-hero h1,.page-hero__title,.hero h1{
  font-size:var(--ty-display)!important;font-weight:400!important;line-height:1.05!important;letter-spacing:0!important;text-transform:none!important}
.skx-title strong,.page-hero-tag h1 strong,.editorial-hero__title strong{font-weight:500!important}

/* ---- Títulos de página y de sección ---------------------------------- */
:where(h1),.prod-title,.page-title,.tool-header h1,.tool-hero h1,.tool-header h2.h1-alt,.tool-hero h2.h1-alt,
:where(h2),.prod-name,.t-name,.cta-title,.c-title,.cb-title,.section-title,.about-txt h2{
  font-weight:400!important;letter-spacing:0!important;text-transform:none!important;color:inherit}
:where(h1),.prod-title,.page-title,.tool-header h1,.tool-hero h1{font-size:var(--ty-h1)!important;line-height:1.1!important}
:where(h2),.prod-name,.t-name,.cta-title,.section-title,.about-txt h2{font-size:var(--ty-h1)!important;line-height:1.1!important}
.c-title,.cb-title{font-size:30px!important;line-height:1.15!important}
@media(max-width:760px){.c-title,.cb-title{font-size:24px!important}}

/* ---- Títulos de bloque ------------------------------------------------ */
:where(h3,h4),.spec-title,.faq-q,.editorial-photo-card__title,.card-title,.layer__title,.footer-col__title,.ft-ct{
  font-size:var(--ty-h3)!important;font-weight:500!important;line-height:1.25!important;letter-spacing:0!important;text-transform:none!important}
.footer-col__title,.ft-ct{font-size:15px!important;font-weight:700!important;color:var(--ty-ink)!important}

/* ---- Entradillas ------------------------------------------------------ */
.hero-sub,.page-hero__desc,.skx-sub,.skf-hero__sub,.prod-tagline,.intro-strip__text,.t-sub,.lead,.page-intro,.editorial-hero__sub{
  font-size:var(--ty-lead)!important;font-weight:400!important;line-height:1.45!important;letter-spacing:0!important}

/* ---- Texto corrido ---------------------------------------------------- */
main :where(p),.prod-desc,.faq-a,:where(.content p,.page-section p,.about-txt p,.article p,.editorial p),.test-quote{
  font-size:var(--ty-body)!important;font-weight:400!important;line-height:1.45!important;letter-spacing:0!important}
main :where(li,td,dd),.spec-desc,.cb-text,.cta-sub,.c-data,.cb-detail{font-weight:400!important;line-height:1.45!important;letter-spacing:0!important}
.spec-desc,.cb-text,.cta-sub,.cb-detail,main :where(td){font-size:var(--ty-small)!important}
.c-data{font-size:var(--ty-body)!important}

/* ---- Tarjetas de producto -------------------------------------------- */
.product-card__name,.ov-card__name,.prod-sep__name,.card-name{font-size:16px!important;font-weight:500!important;line-height:1.5!important;letter-spacing:0!important;text-transform:none!important}
.product-card__desc,.ov-card__desc,.prod-sep__desc,.card-desc,.editorial-photo-card__sub{font-size:var(--ty-small)!important;font-weight:400!important;line-height:1.45!important;letter-spacing:0!important}

/* ---- Etiquetas: sin versalitas espaciadas, en minúscula de frase ----- */
.section-label,.skx-kicker,.editorial-hero__kicker,.editorial-photo-card__kicker,.t-label,.clients-label,.cb-label,.trust-label,.spec-unit,
.prod-family,.prod-subcat,.patterns-title,.colours-label,.test-role,.test-author,.cb-badge,.client-ph,.mnv-label,.mobile-menu__heading,
.breadcrumb,.breadcrumb__item,.skf-hero__bc,.cat-nav-item,.pattern-name,.c-label,.akn-h,label{
  text-transform:none!important;letter-spacing:0!important;font-weight:500!important}
.section-label,.skx-kicker,.editorial-hero__kicker,.t-label,.clients-label,.cb-label,.trust-label,.prod-family,.patterns-title,.colours-label,.cat-nav-item{font-size:15px!important}
.breadcrumb,.breadcrumb__item,.skf-hero__bc,.breadcrumb a,.skf-hero__bc a{font-size:14px!important;font-weight:400!important}
label{font-size:14px!important}
.spec-unit,.pattern-name,.cb-badge,.test-role,.test-author,.client-ph{font-size:var(--ty-micro)!important}

/* ---- Cifras ----------------------------------------------------------- */
.trust-num,.spec-data{font-weight:400!important;letter-spacing:0!important}

/* ---- Botones y enlaces de acción: texto normal, sin mayúsculas ------- */
.skx-cta,.t-link,.prod-btn,.form-submit,.cb-submit,.btn-presupuesto,.section-link,.c-link,.hero-ctas a,.btn,.accordion__btn,.category-pill,.editorial-photo-card__link{
  text-transform:none!important;letter-spacing:0!important;font-size:16px!important;font-weight:500!important}

/* ---- Cabecera y navegación ------------------------------------------- */
.skh-burger{font-size:15px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}
.skh-main a{font-size:17px!important;font-weight:500!important;line-height:1.4!important}
.skh-main small{font-size:13px!important;letter-spacing:0!important;text-transform:none!important;font-weight:400!important}
.skh-sec a{font-size:15px!important;font-weight:400!important}
.skl-btn{font-size:13px!important;letter-spacing:0!important;font-weight:500!important}
.akn-a,.akn-b{font-size:15px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}
.akn-p .akn-a{font-size:15px!important;font-weight:400!important}
.akn-logo{font-size:18px!important}
.nv-link,.nav-primary__link,.topbar__link{text-transform:none!important;letter-spacing:0!important;font-size:15px!important;font-weight:500!important}

/* ---- Pie --------------------------------------------------------------- */
.footer-col__link,.ft-links a,.footer-brand__address,.footer-brand__address a,.ft-about{font-size:15px!important;font-weight:400!important;line-height:1.9!important;letter-spacing:0!important}
.footer-bottom__copy,.footer-bottom__legal,.footer-bottom__legal a,.ft-bottom,.ft-bottom a,.ft-copy{font-size:13px!important;font-weight:400!important;letter-spacing:.06em!important}

/* ---- Formularios ------------------------------------------------------ */
input,select,textarea{font-family:inherit!important;font-size:16px!important;font-weight:400!important}

.skx-tag{max-width:780px!important}

/* ---- Global: sin versales ni tracking (como Vitra), salvo excepciones con clase ---- */
body :where(*){text-transform:none!important;letter-spacing:0!important}
main :where(li){font-size:var(--ty-small)!important}
main :where(td,th){font-size:var(--ty-small)!important}

/* =========================================================================
   Composición (referencia vitra.com): márgenes 5 %, mucho aire, todo centrado,
   heroes a sangre, tarjetas con texto debajo de la foto, botones de línea,
   pie gris claro con listas separadas por filetes.
   ========================================================================= */
:root{--vx-margin:clamp(20px,5vw,72px);--vx-gap:20px;--vx-row:64px;--vx-band:#f7f7f7;--vx-foot:#e6e6e6;--vx-rule:#cccccc}

/* ---- contenedor y ritmo ---- */
.page-wrap{max-width:1440px!important;padding-left:var(--vx-margin)!important;padding-right:var(--vx-margin)!important}
.page-section{padding-top:88px!important;padding-bottom:88px!important}
.page-section--tight{padding-top:64px!important;padding-bottom:64px!important}
@media(max-width:760px){.page-section{padding-top:56px!important;padding-bottom:56px!important}}

/* ---- cabeceras de sección: título grande centrado ---- */
.section-header{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;gap:14px!important;margin-bottom:44px!important;border:0!important}
.section-header .section-label{font-size:var(--ty-h1)!important;line-height:1.1!important;font-weight:400!important;color:#101010!important}
.section-header .section-link{font-size:15px!important}

/* ---- rejillas ---- */
.product-grid,.product-grid-5,.product-grid-editorial,.prod-grid,.ov-grid{column-gap:var(--vx-gap)!important;row-gap:var(--vx-row)!important}

/* ---- tarjetas: foto + texto centrado debajo ---- */
.product-card{overflow:visible!important}
.product-card:hover{opacity:1!important}
.product-card__image{aspect-ratio:4/3!important;background:#f2f2f2}
.product-card__image img{transition:transform .6s ease}
.product-card:hover .product-card__image img{transform:scale(1.02)}
.product-card__body{position:static!important;inset:auto!important;background:none!important;padding:12px 0 0!important;text-align:center!important;justify-content:flex-start!important}
.product-card__name{color:#333!important;margin:0 0 2px!important}
.product-card__desc{color:#767676!important;max-width:42ch;margin:0 auto!important}
.ov-card{text-align:center}
.ov-card__name{color:#333!important;margin-top:12px!important}
.ov-card__desc{color:#767676!important;max-width:42ch;margin-left:auto!important;margin-right:auto!important}
.card-desc,.card-title{text-align:center}

/* ---- heroes a sangre, texto centrado ---- */
.skx,.skf-hero{width:100%!important;margin:0!important}
.skx{height:76vh!important;max-height:760px!important;min-height:460px!important}
.skx-slide{justify-content:center!important}
.skx-slide::before{background:linear-gradient(to top,rgba(0,0,0,.42) 0%,rgba(0,0,0,.12) 45%,rgba(0,0,0,0) 70%)!important}
.skx-tag{text-align:center!important;max-width:900px!important;padding:0 24px 72px!important;margin:0 auto}
.skx-kicker{display:none!important}
.skx-sub{margin-left:auto!important;margin-right:auto!important;color:#fff!important;max-width:640px!important}
.skx-arrow{display:none!important}
.skf-hero,.page-hero{min-height:62vh!important;justify-content:center!important}
.skf-hero::after,.page-hero::after{background:linear-gradient(to top,rgba(0,0,0,.45) 0%,rgba(0,0,0,.12) 50%,rgba(0,0,0,0) 75%)!important}
.skf-hero__tag,.page-hero-tag{text-align:center!important;max-width:900px!important;margin:0 auto!important;padding:0 24px 64px!important}
.skf-hero__sub,.page-hero-tag .hero-sub{margin-left:auto!important;margin-right:auto!important;color:rgba(255,255,255,.92)!important;max-width:640px!important}
.page-hero-tag .breadcrumb,.skf-hero__bc{color:rgba(255,255,255,.8)!important}
.page-hero-tag .breadcrumb a,.skf-hero__bc a{color:rgba(255,255,255,.8)!important}
.hero-ctas{justify-content:center!important;display:flex!important;gap:16px;margin-top:22px}

/* ---- botones de línea (filete arriba y abajo) ---- */
.skx-cta,.hero-ctas a,.t-link,.prod-btn,.btn-presupuesto,.c-link,.cb-submit,.section-link,.editorial-photo-card__link{
  display:inline-flex!important;align-items:center;justify-content:center;gap:8px;padding:8px 40px 10px!important;margin-top:18px;
  background:none!important;border:0!important;border-top:1px solid currentColor!important;border-bottom:1px solid currentColor!important;border-radius:0!important;
  color:inherit;font-size:16px!important;font-weight:500!important;line-height:1.8!important;text-decoration:none!important;transition:opacity .2s}
.skx-cta,.hero-ctas a{color:#fff!important}
.prod-btn,.btn-presupuesto,.c-link,.cb-submit,.section-link{color:#333!important}
.skx-cta:hover,.hero-ctas a:hover,.t-link:hover,.prod-btn:hover,.btn-presupuesto:hover,.c-link:hover,.cb-submit:hover,.section-link:hover{opacity:.65}
.btn-presupuesto svg{display:none}
.form-submit{background:#333!important;color:#fff!important;border:0!important;border-radius:0!important;padding:12px 40px!important;font-size:16px!important;font-weight:500!important}
.form-submit:hover{background:#000!important}

/* ---- franjas grises ---- */
.intro-strip,.cb,.cta-band{background:var(--vx-band)!important}

/* ---- pie Skrita ---- */
.site-footer{background:var(--vx-foot)!important;border:0!important;padding-top:56px!important}
.site-footer .footer-inner{text-align:center}
.site-footer .footer-brand{display:flex;flex-direction:column;align-items:center}
.site-footer .footer-col__title{padding-bottom:10px!important;margin-bottom:0!important;border-bottom:1px solid var(--vx-rule)}
.site-footer .footer-col__links{gap:0!important}
.site-footer .footer-col__links li{border-bottom:1px solid var(--vx-rule)}
.site-footer .footer-col__link{display:block;padding:8px 0!important;line-height:1.6!important;color:#333!important}
.site-footer .footer-col__link::after{display:none!important}
.site-footer .footer-bottom{justify-content:center!important;text-align:center;gap:16px!important;border-top:0!important}
/* ---- pie Acustika ---- */
.ft{background:var(--vx-foot)!important;border-top:0!important;text-align:center}
.ft-grid > div{display:flex;flex-direction:column;align-items:center}
.ft-brand{justify-content:center}
.ft-social{justify-content:center}
.ft-ct{color:#101010!important;padding-bottom:10px;margin-bottom:0!important;border-bottom:1px solid var(--vx-rule);width:100%}
.ft-links{gap:0!important;width:100%}
.ft-links a{display:block;padding:8px 0;border-bottom:1px solid var(--vx-rule);color:#333!important}
.ft-bot{justify-content:center!important;gap:16px;flex-wrap:wrap;border-top:0!important}

/* ---- cabecera de escritorio: logo a la izquierda + menú en línea ---- */
.skh{border-bottom:0!important}
.skh-inline,.skh-util{display:none}
@media(min-width:1100px){
  .skh-in{grid-template-columns:auto 1fr auto!important;gap:40px;height:70px!important;max-width:none!important;padding:0 var(--vx-margin)!important}
  .skh-burger{display:none!important}
  .skh-logo{justify-self:start!important;order:0}
  .skh-logo img{height:30px!important}
  .skh-inline{display:flex;gap:28px;align-items:center;justify-self:start}
  .skh-inline a{font:500 17px/1 'Jost',Arial,sans-serif;color:#333;text-decoration:none;padding:6px 0;border-bottom:1px solid transparent}
  .skh-inline a:hover,.skh-inline a[aria-current="page"]{border-bottom-color:#333}
  .skh-right{display:flex;align-items:center;gap:22px;justify-self:end}
  .skh-util{display:flex;gap:18px}
  .skh-util a{font:500 14px/1 'Jost',Arial,sans-serif;color:#767676;text-decoration:none}
  .skh-util a:hover{color:#333}
  .skh-menu{top:70px!important}
  .akn{top:70px!important}
}

@media(min-width:761px){.content > .page-hero:first-child{margin:-20px -20px 20px!important;width:calc(100% + 40px)!important}}
main td:last-child{color:#333!important;font-weight:500!important}
.content{overflow-x:clip}
html,body{overflow-x:clip}

/* ---- Páginas de familia e interiores: imagen a sangre y título debajo, en negro (como las categorías de Vitra) ---- */
.skf-hero,.page-hero{display:block!important;min-height:0!important;background:none!important;overflow:visible!important}
.skf-hero::after,.page-hero::after{display:none!important}
.skf-hero__bg,.page-hero-bg{position:relative!important;inset:auto!important;height:58vh;min-height:340px;max-height:620px;width:100%}
.skf-hero__tag,.page-hero-tag{position:static!important;padding:44px 24px 8px!important;color:#101010!important}
.skf-hero h1,.page-hero-tag h1,.page-hero-tag h2.h1-alt{color:#101010!important;font-size:var(--ty-h1)!important;line-height:1.1!important;margin:10px 0 14px!important}
.skf-hero__sub,.page-hero-tag .hero-sub{color:#333!important;font-size:var(--ty-lead)!important}
.skf-hero__bc,.page-hero-tag .breadcrumb,.skf-hero__bc a,.page-hero-tag .breadcrumb a{color:#767676!important}
.page-hero-tag .hero-ctas a{color:#333!important}
.page-hero-bg:empty{background-color:#f2f2f2}
/* páginas sin foto (legales, avisos): sin banda vacía */
.page-hero-bg:not([style*="background-image"]){display:none}
@media(max-width:760px){.skf-hero__bg,.page-hero-bg{height:46vh;min-height:260px}.skf-hero__tag,.page-hero-tag{padding-top:28px!important}}

/* ---- filtros centrados ---- */
.category-pills,.cat-filter,.filter-bar,.prod-filters{justify-content:center!important}
.category-pill{font-size:15px!important}

/* ---- sin animaciones de aparición: la página se ve entera desde el primer momento ---- */
.fi,.fi.hidden,.fade-in,.reveal{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}

/* ---- fichas de producto Acustika: sin foto repetida arriba; título de página + galería y datos (como una ficha de Vitra) ---- */
.content:has(.prod-layout) .page-hero-bg{display:none!important}
.content:has(.prod-layout) .page-hero-tag{padding-top:40px!important;padding-bottom:24px!important}
.content:has(.page-hero h1) .prod-layout .prod-name{display:none!important}