
.topbar .punto{background:#b0875a;box-shadow:0 0 0 2px rgba(176,135,90,.28)}
.topbar .punto.cerrado{background:transparent;box-shadow:inset 0 0 0 1.25px #b0875a}
.topbar .acc .wa svg{stroke:none;fill:#f4eee2}

@media (min-width:901px){
  .brand .bn,.brand .bs,header nav .cta-mini{white-space:nowrap}
}
@media (min-width:901px) and (max-width:1140px){
  header nav{gap:19px}
  header nav a{font-size:.78rem;letter-spacing:.04em}
}
@media (min-width:901px) and (max-width:1023px){
  header .wrap{gap:14px}
  header nav{gap:13px}
  header nav a{font-size:.74rem;letter-spacing:.015em}
  header nav .cta-mini{padding:11px 13px;letter-spacing:.03em}
  .brand .bs{letter-spacing:.3em}
}

header nav a[aria-current]:not([aria-current="false"]){color:#6b1f2e}
header nav > a[aria-current]:not([aria-current="false"]):not(.cta-mini)::after,
header nav .nav-emp > a[aria-current]:not([aria-current="false"])::after,
header nav .nav-emp:has(.sub a[aria-current]:not([aria-current="false"])) > a::after{transform:scaleX(1)}
header nav .nav-emp:has(.sub a[aria-current]:not([aria-current="false"])) > a{color:#6b1f2e}
header nav .sub > a[aria-current]:not([aria-current="false"]){background:#f4eee2}
header nav .sub > a[aria-current]:not([aria-current="false"]) .st b{color:#6b1f2e}
header nav .sub > a[aria-current]:not([aria-current="false"]) .sr{transform:scaleX(1)}
header nav a.cta-mini[aria-current]:not([aria-current="false"]){color:#f4eee2}
header nav .nav-emp[data-abierto] .sub{opacity:1;pointer-events:auto;transform:none}
header nav .nav-emp.cerrado .sub{opacity:0;pointer-events:none;transform:translateY(-9px) scale(.985)}
@media (prefers-reduced-motion:reduce){header nav .nav-emp.cerrado .sub{transform:none}}

footer .firma .p{max-width:34ch}
footer .firma .l{text-wrap:balance}

[data-foco-salto]:focus{outline:none}

@media (min-width:901px){
  .topbar{font-size:.8rem}
  .topbar .wrap{padding-top:7px;padding-bottom:7px}
  .topbar .ti svg,.topbar .acc svg{width:15px;height:15px;flex:0 0 15px}
  .topbar .punto{width:7px;height:7px;flex:0 0 7px}
  .topbar .acc{gap:26px}
  .topbar .acc a{min-height:28px}
}
@media (min-width:1024px){
  body header .wrap{padding-top:14px;padding-bottom:14px}
  .brand img{width:48px}
  .brand .bn{font-size:1.5rem}
  .brand .bs{font-size:.6rem}
  header nav > a:not(.cta-mini),header nav > .nav-emp > a{font-size:.9rem;letter-spacing:.08em}
  header nav .cta-mini{font-size:.84rem;padding:12px 22px}
}
@media (min-width:1024px) and (max-width:1349px){
  header nav{gap:20px}
  header nav > a:not(.cta-mini),header nav > .nav-emp > a{font-size:.88rem;letter-spacing:.04em}
  header nav .cta-mini{padding:12px 18px}
}
@media (min-width:1024px) and (max-width:1140px){
  header nav{gap:16px}
  header nav > a:not(.cta-mini),header nav > .nav-emp > a{font-size:.82rem;letter-spacing:.03em}
  header nav .cta-mini{font-size:.8rem;padding:12px 16px}
  .brand .bs{letter-spacing:.36em}
}

@media screen {
  :where(body > header, body > footer, .topbar, main > :is(section, div, nav, aside, article):not(.pin-spacer)){background-color:#faf6ee}
  body, .topbar, body > header, body > footer, main > :is(section, div, nav, aside, article):not(.pin-spacer),
  header nav .sub, .buscador, .kbusca, .placa, .dev, .barb, .scard, .acard, .fcard, .puerta, .tform .pquote,
  .lanz-placa, .fsm-placa, .card, .equipa, .cocheras, .mapa-caja, .pestanas, aside.lamina, li.grupo,
  .carta-vent, .telon-velo, .hpin{
    background-image:url("grano-160-32.webp"),
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E") !important;
    background-size:160px 160px,180px 180px !important;background-repeat:repeat !important;
    background-blend-mode:overlay,multiply !important}
}
@media screen and (min-resolution:2dppx){
  body, .topbar, body > header, body > footer, main > :is(section, div, nav, aside, article):not(.pin-spacer),
  header nav .sub, .buscador, .kbusca, .placa, .dev, .barb, .scard, .acard, .fcard, .puerta, .tform .pquote,
  .lanz-placa, .fsm-placa, .card, .equipa, .cocheras, .mapa-caja, .pestanas, aside.lamina, li.grupo,
  .carta-vent, .telon-velo, .hpin{background-size:80px 80px,180px 180px !important}
}

@media screen { body.menu-open > header{background-image:none !important} }

@media screen {
  :is(.final, .aform)::after, :is(.final, .aform) .cierre-foto::after{border-image:url("grano-160-velo.webp") 0 fill / 0 / 0 repeat}
  .final:has(.tierra)::after{border-image-source:url("grano-160-velo-verde.webp")}
  .final.claro .cierre-foto::after{border-image-source:url("grano-160-velo-crema.webp")}
}
@media screen and (min-resolution:2dppx){
  :is(.final, .aform)::after, :is(.final, .aform) .cierre-foto::after{border-image-source:image-set(url("grano-160-velo.webp") 2x)}
  .final:has(.tierra)::after{border-image-source:image-set(url("grano-160-velo-verde.webp") 2x)}
  .final.claro .cierre-foto::after{border-image-source:image-set(url("grano-160-velo-crema.webp") 2x)}
}

@media screen {
  html{background-color:#320b13}
  :where(body){background-color:#faf6ee}
}

main:has(~ footer:not([data-costura])) > :is(.final, .aform):not(.claro):last-of-type > :is(.frame, .marco):empty{
  bottom:0;border-bottom:0;left:20px;right:20px}
main:has(> :is(.final, .aform):not(.claro):last-of-type) ~ footer:not([data-costura]) > .frame{
  top:0;border-top:0;left:20px;right:20px;border-color:rgba(205,169,120,.25)}
@media (max-width:999px){
  main:has(~ footer:not([data-costura])) > :is(.final, .aform):not(.claro):last-of-type > :is(.frame, .marco):empty{left:12px;right:12px}
  main:has(> :is(.final, .aform):not(.claro):last-of-type) ~ footer:not([data-costura]) > .frame{left:12px;right:12px}
}
main:has(> :is(.final, .aform):last-of-type) ~ footer:not([data-costura])::before{
  content:"";position:absolute;left:50%;top:0;width:7px;height:7px;margin:-4px 0 0 -4px;z-index:3;
  border:1px solid #b0875a;background:#320b13;transform:rotate(45deg);pointer-events:none}

@supports (animation-timeline: scroll()) {
  body > header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:#b0875a;
    opacity:0;transform-origin:left center;pointer-events:none;
    animation:dmb-despega linear both;animation-timeline:scroll(root);animation-range:30px 70px}
  @media (prefers-reduced-motion:no-preference){
    body[data-progreso] > header::after{
      animation:dmb-despega linear both,dmb-progreso linear both;
      animation-timeline:scroll(root),scroll(root);animation-range:30px 70px,normal}
  }
  body.menu-open > header::after{display:none}
}
@keyframes dmb-despega{from{opacity:0}to{opacity:.55}}
@keyframes dmb-progreso{from{transform:scaleX(0)}to{transform:scaleX(1)}}

header nav a.con-ind::after{opacity:0}
header nav .nav-ind{position:absolute;left:0;right:0;bottom:0;height:1px;background:#6b1f2e;pointer-events:none;
  view-transition-name:dmb-nav}
::view-transition-group(dmb-nav){animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1)}

@media (min-width:701px){
  body > footer .rieles nav{margin-left:-33px;clip-path:inset(-6px -6px -6px 29px)}
  body > footer .rieles nav a{margin-left:33px;position:relative}
  body > footer .rieles nav a+a::before{position:absolute;left:-17px;top:50%;margin:0;transform:translateY(-50%)}
}
