/*
Theme Name: TD2E (Astra Child)
Template: astra
Description: Tema hijo de Astra con la identidad de marca de TD2E (Técnica y Desarrollo de la Energía Eléctrica). Diseño a medida en código, sin plantillas prefabricadas ni constructores visuales.
Version: 0.11.1
Text Domain: td2e-child
*/

:root{
  --td2e-red: #C5000A;
  --td2e-red-dark: #A00008;
  --td2e-black: #000000;
  --td2e-white: #FFFFFF;
  --td2e-ink: #1a1a1a;
  --td2e-gray-light: #f4f4f4;
  --td2e-gray-mid: #6b6b6b;
}

/* Astra's saved palette is its demo blue/purple; map its global colors to the brand. */
body{
  --ast-global-color-0: var(--td2e-red);
  --ast-global-color-1: var(--td2e-red-dark);
  --ast-global-color-2: var(--td2e-ink);
  --ast-global-color-3: #4a4a4a;
  --ast-global-color-4: var(--td2e-gray-light);
  --ast-global-color-5: var(--td2e-white);
  --ast-global-color-6: var(--td2e-gray-light);
  --ast-global-color-7: #e5e5e5;
  --ast-global-color-8: var(--td2e-black);
}

.site-header .ast-primary-header-bar,
.site-header .main-header-bar{
  background-color: var(--td2e-white);
}

/* Logo size lives in code: Astra's logo-width setting was wiped by a later Customizer publish. */
.site-header .custom-logo{
  width: 160px;
  height: auto;
}
@media (max-width: 921px){
  .site-header .custom-logo{ width: 120px; }
}

.site-header .main-header-menu .menu-item > .menu-link{
  color: var(--td2e-ink);
  font-weight: 700;
}
.site-header .main-header-menu .menu-item > .menu-link:hover,
.site-header .main-header-menu .menu-item > .menu-link:focus{
  color: var(--td2e-red);
}

.site-header .menu-toggle,
.site-header .menu-toggle:hover,
.site-header .menu-toggle:focus{
  color: var(--td2e-ink) !important;
  background: transparent !important;
}
.site-header .menu-toggle .ast-mobile-svg{
  fill: var(--td2e-ink) !important;
}

.site-header .ast-header-social-1-wrap .ast-builder-social-element svg{
  fill: var(--td2e-ink);
  width: 22px;
  height: 22px;
}
.site-header .ast-header-social-1-wrap .ast-builder-social-element{ margin: 0 0.35rem; }
.site-header .ast-header-social-1-wrap .ast-builder-social-element:hover svg,
.site-header .ast-header-social-1-wrap .ast-builder-social-element:focus svg{ fill: var(--td2e-red); }

html{ scroll-behavior: smooth; }

body, body.wp-site-blocks{
  font-family: Arial, Helvetica, sans-serif;
  color: var(--td2e-ink);
}

h1, h2, h3, h4, h5, h6{
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
}

a{ color: var(--td2e-red); }
a:hover{ color: var(--td2e-red-dark); }

/* Astra's full-width container is a flex row; without this the page shrinks to its content. */
#td2e-home{ width: 100%; }

.td2e-hero{
  position: relative;
  background: linear-gradient(135deg, #0d0d0d 0%, #1a1a1a 45%, var(--td2e-red-dark) 100%);
  color: var(--td2e-white);
  padding: 7rem 2rem 6rem;
  text-align: center;
  overflow: hidden;
}

.td2e-hero::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-image:
    repeating-linear-gradient(115deg, rgba(255,255,255,0.035) 0 2px, transparent 2px 60px);
  pointer-events: none;
}

.td2e-hero__content{
  position: relative;
  z-index: 2;
}

/* ===== Slider (only when photos are set in Personalizar → Slider de portada) ===== */
.td2e-hero--slider{
  min-height: clamp(520px, 80vh, 800px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #0d0d0d;
}
/* Text sits on the left over a dark fade; the right half of each photo stays clean. */
.td2e-hero--slider{
  align-items: flex-start;
  text-align: left;
  padding-left: max(2rem, calc((100% - 1100px) / 2));
}
.td2e-hero--slider::before{
  background-image: linear-gradient(90deg, rgba(10,10,10,0.78) 0%, rgba(10,10,10,0.55) 35%, rgba(10,10,10,0.12) 65%, rgba(10,10,10,0) 100%);
}
.td2e-hero--slider .td2e-hero__content{ max-width: 640px; }
.td2e-hero.td2e-hero--slider .td2e-hero__title{
  font-size: clamp(1.9rem, 3.4vw, 2.8rem);
  margin: 0.6rem 0 1rem;
  max-width: none;
  text-shadow: 0 2px 12px rgba(0,0,0,0.45);
}
.td2e-hero.td2e-hero--slider .td2e-hero__subtitle{
  font-size: 1.05rem;
  margin: 0 0 1.75rem;
  max-width: 480px;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5);
}
.td2e-hero--slider .td2e-hero__eyebrow{ text-shadow: 0 1px 6px rgba(0,0,0,0.5); }
.td2e-hero--slider .td2e-hero__dots{
  justify-content: flex-start;
  padding-left: max(2rem, calc((100% - 1100px) / 2));
}
@media (max-width: 921px){
  .td2e-hero--slider{
    align-items: center;
    text-align: center;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
  .td2e-hero--slider::before{ background-image: linear-gradient(rgba(10,10,10,0.5), rgba(10,10,10,0.5)); }
  .td2e-hero.td2e-hero--slider .td2e-hero__subtitle{ margin-left: auto; margin-right: auto; }
  .td2e-hero--slider .td2e-hero__dots{ justify-content: center; padding-left: 0; }
}
.td2e-hero__slides{
  position: absolute;
  inset: 0;
  z-index: 0;
}
.td2e-hero .td2e-hero__slide{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
}
.td2e-hero .td2e-hero__slide.is-active{ opacity: 1; }

.td2e-hero__dots{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.75rem;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 0.7rem;
}
.td2e-hero .td2e-hero__dot{
  width: 12px;
  height: 12px;
  min-width: 0;
  padding: 0;
  border: 2px solid var(--td2e-white);
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  opacity: 0.85;
}
.td2e-hero .td2e-hero__dot:hover,
.td2e-hero .td2e-hero__dot:focus{ background: rgba(255,255,255,0.5); }
.td2e-hero .td2e-hero__dot.is-active{
  background: var(--td2e-red);
  border-color: var(--td2e-red);
  opacity: 1;
}
.td2e-hero .td2e-hero__dot:focus-visible{
  outline: 2px solid var(--td2e-white);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce){
  .td2e-hero .td2e-hero__slide{ transition: none; }
}

.td2e-hero .td2e-hero__eyebrow,
.td2e-hero .td2e-hero__title,
.td2e-hero .td2e-hero__subtitle{
  color: #ffffff !important;
}
.td2e-hero .td2e-hero__eyebrow{
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.9rem;
  font-weight: 700;
  color: #ffb3ad !important;
}
.td2e-hero .td2e-hero__title{
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  line-height: 1.15;
  margin: 0.75rem auto 1.25rem;
  max-width: 900px;
}
.td2e-hero .td2e-hero__subtitle{
  font-size: 1.15rem;
  max-width: 640px;
  margin: 0 auto 2.25rem;
  color: #e7e7e7 !important;
}

.td2e-btn{
  display: inline-block;
  background: var(--td2e-red);
  color: var(--td2e-white);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.9rem 2.1rem;
  border-radius: 2px;
  text-decoration: none;
  transition: background-color .15s ease, transform .15s ease;
}
.td2e-btn:hover{
  background: var(--td2e-red-dark);
  color: var(--td2e-white);
  transform: translateY(-1px);
}

.td2e-section{ padding: 5rem 2rem; background: var(--td2e-white); }
.td2e-section--alt{ background: var(--td2e-gray-light); }
.td2e-section__inner{ max-width: 1100px; margin: 0 auto; }

.td2e-eyebrow{
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--td2e-red);
  margin-bottom: 0.5rem;
  display: block;
  text-align: center;
}

.td2e-section .td2e-section__title{
  text-align: center;
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  margin: 0 auto 1rem;
  max-width: 760px;
  color: var(--td2e-ink) !important;
}

.td2e-section__lead{
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  color: var(--td2e-gray-mid);
  font-size: 1.05rem;
}

.td2e-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.75rem;
}

.td2e-sectors{
  list-style: none;
  margin: 0 auto 2rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  max-width: 820px;
}
.td2e-sectors li{
  border: 2px solid var(--td2e-red);
  color: var(--td2e-ink);
  font-weight: 700;
  padding: 0.55rem 1.2rem;
  border-radius: 999px;
  margin: 0;
}

/* Second paragraph of "Quiénes somos", right under the lead. */
.td2e-section__lead:has(+ .td2e-section__text){ margin-bottom: 1rem; }
.td2e-section__text{
  max-width: 700px;
  margin: 0 auto 3rem;
  color: var(--td2e-gray-mid);
  line-height: 1.7;
  text-align: center;
}

/* Front page "Automatización": technology groups, each a card with chips. */
.td2e-auto__groups{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}
@media (max-width: 921px){
  .td2e-auto__groups{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px){
  .td2e-auto__groups{ grid-template-columns: 1fr; }
}
.td2e-auto__group{
  padding: 1.4rem 1.3rem 1.5rem;
  border: 1px solid #e5e5e5;
  border-top: 4px solid var(--td2e-red);
  background: var(--td2e-white);
}
.td2e-auto__label{
  margin: 0 0 0.9rem;
  color: var(--td2e-ink) !important;
  font-size: 1.05rem;
}
.td2e-auto__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.td2e-auto__chips li{
  margin: 0;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  background: var(--td2e-gray-light);
  color: var(--td2e-ink);
  font-size: 0.86rem;
  font-weight: 600;
}
.td2e-auto__more{
  margin: 2.5rem 0 0;
  text-align: center;
}

.td2e-card{
  background: var(--td2e-white);
  border: 1px solid #e5e5e5;
  border-top: 4px solid var(--td2e-red);
  padding: 2rem 1.6rem;
  text-align: left;
}

.td2e-card h3{
  font-size: 1.15rem;
  margin: 0 0 0.6rem;
  color: var(--td2e-ink) !important;
}

.td2e-card p{
  color: var(--td2e-gray-mid);
  font-size: 0.97rem;
  line-height: 1.5;
  margin: 0;
}
.td2e-card .td2e-highlight{
  color: var(--td2e-red);
}

/* ===== Flip cards (only services with a photo in Personalizar → Fotos de servicios) ===== */
.td2e-card.td2e-card--flip{
  background: none;
  border: 0;
  padding: 0;
  min-height: 230px;
  perspective: 1400px;
  cursor: pointer;
}
/* The outer card never moves, so the hover area stays put while the inner part lifts and turns. */
.td2e-card--flip .td2e-card__inner{
  position: relative;
  height: 100%;
  min-height: inherit;
  transform-style: preserve-3d;
  transition: transform 1.1s cubic-bezier(0.65, 0, 0.35, 1);
}
/* Short delay so sweeping the mouse across the grid doesn't flip every card on the way. */
.td2e-card--flip:hover .td2e-card__inner,
.td2e-card--flip:focus .td2e-card__inner{
  transform: translateY(-6px) rotateY(180deg);
  transition-delay: 0.12s;
}
.td2e-card--flip .td2e-card__front,
.td2e-card--flip .td2e-card__back,
.td2e-card--flip .td2e-card__img,
.td2e-card--flip .td2e-card__back-title{
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.td2e-card--flip .td2e-card__front{
  height: 100%;
  background: var(--td2e-white);
  border: 1px solid #e5e5e5;
  border-top: 4px solid var(--td2e-red);
  padding: 2rem 1.6rem;
}
.td2e-card__back{
  position: absolute;
  inset: 0;
  transform: rotateY(180deg);
  overflow: hidden;
  border-top: 4px solid var(--td2e-red);
  background: var(--td2e-ink);
  box-shadow: 0 22px 40px -18px rgba(0,0,0,0.45);
}
/* Photo eases out of a zoom once the card has turned. */
.td2e-card .td2e-card__img{
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  transform: scale(1.15);
  transition: transform 0.8s ease;
}
.td2e-card--flip:hover .td2e-card__img,
.td2e-card--flip:focus .td2e-card__img{
  transform: scale(1);
  transition: transform 4s cubic-bezier(0.22, 1, 0.36, 1) 0.5s;
}
/* Title rises in after the turn, then a red rule draws in above it. */
.td2e-card__back-title{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 2.5rem 1.25rem 1rem;
  color: var(--td2e-white);
  font-size: 1.1rem;
  font-weight: 700;
  background: linear-gradient(transparent, rgba(0,0,0,0.8));
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.td2e-card__back-title::before{
  content: "";
  display: block;
  width: 0;
  height: 3px;
  margin-bottom: 0.55rem;
  background: var(--td2e-red);
  transition: width 0.3s ease;
}
.td2e-card--flip:hover .td2e-card__back-title,
.td2e-card--flip:focus .td2e-card__back-title{
  opacity: 1;
  transform: none;
  transition: opacity 0.5s ease 0.8s, transform 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.8s;
}
.td2e-card--flip:hover .td2e-card__back-title::before,
.td2e-card--flip:focus .td2e-card__back-title::before{
  width: 44px;
  transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1.1s;
}
/* Logos (PNG) on the back: whole, on white, with the title below instead of over the image. */
.td2e-card--logo .td2e-card__back{
  display: flex;
  flex-direction: column;
  border: 1px solid #e5e5e5;
  border-top: 4px solid var(--td2e-red);
  background: var(--td2e-white);
}
.td2e-card--logo .td2e-card__img{
  flex: 1;
  min-height: 0;
  height: auto;
  padding: 1.75rem 2.5rem 0.5rem;
  box-sizing: border-box;
  object-fit: contain;
}
.td2e-card--logo .td2e-card__back-title{
  position: static;
  padding: 0.5rem 1.25rem 1.1rem;
  color: var(--td2e-ink);
  background: none;
}
/* Cards linked to their service page: the whole card is clickable ("Saber más" under the text). */
.td2e-card.td2e-card--link{
  position: relative;
  cursor: pointer;
  transition: box-shadow 0.25s ease;
}
.td2e-card--link:not(.td2e-card--flip):hover{ box-shadow: 0 16px 34px -20px rgba(0,0,0,0.35); }
.td2e-card__link{
  position: absolute;
  inset: 0;
  z-index: 3;
}
.td2e-card__link:focus-visible{
  outline: 3px solid var(--td2e-red);
  outline-offset: 3px;
}
.td2e-card--flip:focus-within .td2e-card__inner{ transform: translateY(-6px) rotateY(180deg); }
.td2e-card__more{
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 1rem;
  color: var(--td2e-red);
  font-size: 0.9rem;
  font-weight: 700;
}
.td2e-card__more::after{
  content: "→";
  transition: transform 0.2s ease;
}
.td2e-card--link:hover .td2e-card__more::after{ transform: translateX(4px); }
.td2e-card--flip:focus{ outline: none; }
.td2e-card--flip:focus-visible .td2e-card__back{
  outline: 3px solid var(--td2e-red);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce){
  .td2e-card--flip .td2e-card__inner,
  .td2e-card--flip .td2e-card__img,
  .td2e-card--flip .td2e-card__back-title,
  .td2e-card--flip .td2e-card__back-title::before{ transition: none !important; }
  .td2e-card--flip .td2e-card__img{ transform: none; }
}

.td2e-stats{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1.5rem;
  text-align: center;
}
.td2e-stats strong{
  display: block;
  font-size: 2.2rem;
  color: var(--td2e-red);
  line-height: 1;
  margin-bottom: 0.4rem;
}
.td2e-stats span{
  color: var(--td2e-gray-mid);
  font-size: 0.9rem;
}

.td2e-cta{
  background: var(--td2e-ink);
  color: var(--td2e-white);
  text-align: center;
  padding: 4.5rem 2rem;
}
.td2e-cta h2{
  margin: 0 0 1.5rem;
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: var(--td2e-white) !important;
}

@media (max-width: 600px){
  .td2e-hero{ padding: 5rem 1.25rem 4rem; }
  .td2e-section{ padding: 3.5rem 1.25rem; }
}

/* ===== Floating WhatsApp button (Personalizar → Botón de WhatsApp) ===== */
.td2e-whatsapp{
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none !important;
}
.td2e-whatsapp__icon{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #25D366;
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease;
}
.td2e-whatsapp__icon svg{
  width: 30px;
  height: 30px;
  fill: #fff;
}
/* Ring that pulses a few times after load to draw the eye, then stops. */
.td2e-whatsapp__icon::after{
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid #25D366;
  border-radius: 50%;
  opacity: 0;
  animation: td2e-wa-pulse 1.8s ease-out 1.5s 3;
}
.td2e-whatsapp:hover .td2e-whatsapp__icon,
.td2e-whatsapp:focus-visible .td2e-whatsapp__icon{
  transform: scale(1.08);
  box-shadow: 0 10px 24px rgba(0,0,0,0.3);
}
.td2e-whatsapp:focus{ outline: none; }
.td2e-whatsapp:focus-visible .td2e-whatsapp__icon{
  outline: 3px solid var(--td2e-ink);
  outline-offset: 3px;
}
/* Greeting bubble: shows once a few seconds after load, and again on hover. */
.td2e-whatsapp__label{
  padding: 0.65rem 1.1rem;
  border-radius: 999px;
  background: var(--td2e-white);
  color: var(--td2e-ink);
  font-size: 0.95rem;
  font-weight: 600;
  white-space: nowrap;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18);
  opacity: 0;
  transform: translateX(10px);
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
  animation: td2e-wa-hello 6s ease 3s backwards;
}
.td2e-whatsapp:hover .td2e-whatsapp__label,
.td2e-whatsapp:focus-visible .td2e-whatsapp__label{
  opacity: 1;
  transform: none;
}
@keyframes td2e-wa-pulse{
  0%{ transform: scale(1); opacity: 0.7; }
  100%{ transform: scale(1.7); opacity: 0; }
}
@keyframes td2e-wa-hello{
  0%, 100%{ opacity: 0; transform: translateX(10px); }
  8%, 92%{ opacity: 1; transform: none; }
}
/* Astra's "scroll to top" button sits centred above the WhatsApp one. */
.td2e-has-whatsapp #ast-scroll-top{
  right: 37px;
  bottom: 96px;
}
@media (max-width: 544px){
  .td2e-whatsapp{ right: 16px; bottom: 16px; }
  .td2e-whatsapp__icon{ width: 52px; height: 52px; }
  .td2e-whatsapp__icon svg{ width: 28px; height: 28px; }
  .td2e-has-whatsapp #ast-scroll-top{ right: 26px; bottom: 80px; }
}
@media (prefers-reduced-motion: reduce){
  .td2e-whatsapp__icon::after,
  .td2e-whatsapp__label{ animation: none; }
}
@media print{
  .td2e-whatsapp{ display: none; }
}

/* ===== Sticky header and scroll effects (classes added by script) ===== */
#masthead{
  position: sticky;
  top: var(--wp-admin--admin-bar--height, 0px);
  z-index: 99;
  transition: box-shadow 0.3s ease;
}
.td2e-scrolled #masthead{ box-shadow: 0 8px 24px -14px rgba(0,0,0,0.35); }
/* Under 600px the admin bar scrolls away with the page. */
@media (max-width: 600px){
  #masthead{ top: 0; }
}
/* Menu anchors land below the sticky header. */
#td2e-home section[id],
.td2e-svc [id]{ scroll-margin-top: 100px; }

/* ===== Floating logo =====
   A lower header bar, and the logo on a white card that hangs over the bar and the top of the photo below.
   Once the page scrolls (or the mobile menu opens) the card shrinks back inside the bar. Astra's own header
   height setting (110px) is overridden here. */
.site-header .site-branding{ position: relative; padding: 0; }
.site-header .site-branding .custom-logo-link{
  position: absolute;
  left: 0;
  z-index: 2;
  display: block;
  background: var(--td2e-white);
  transition: top 0.35s ease, padding 0.35s ease, box-shadow 0.35s ease;
}
.site-header .site-branding .custom-logo{
  display: block;
  transition: width 0.35s ease;
}
@media (min-width: 922px){
  #ast-desktop-header .site-primary-header-wrap{ min-height: 72px; }
  #ast-desktop-header .site-branding{ width: 192px; height: 72px; }
  #ast-desktop-header .custom-logo-link{
    top: 12px;
    padding: 14px 16px;
    border-radius: 6px;
    box-shadow: 0 22px 44px -22px rgba(0,0,0,0.55), 0 2px 8px rgba(0,0,0,0.08);
  }
  #ast-desktop-header .custom-logo{ width: 160px; }
  .td2e-scrolled #ast-desktop-header .custom-logo-link{
    top: 4px;
    padding: 6px 10px;
    box-shadow: none;
  }
  .td2e-scrolled #ast-desktop-header .custom-logo{ width: 104px; }
}
@media (max-width: 921px){
  #ast-mobile-header .ast-primary-header-bar,
  #ast-mobile-header .site-primary-header-wrap{ min-height: 60px; }
  #ast-mobile-header .site-branding{ width: 126px; height: 60px; }
  #ast-mobile-header .custom-logo-link{
    top: 8px;
    padding: 8px 10px;
    border-radius: 5px;
    box-shadow: 0 16px 30px -16px rgba(0,0,0,0.55), 0 2px 6px rgba(0,0,0,0.08);
  }
  #ast-mobile-header .custom-logo{ width: 106px; }
  .td2e-scrolled #ast-mobile-header .custom-logo-link,
  .ast-main-header-nav-open #ast-mobile-header .custom-logo-link{
    top: 5px;
    padding: 4px 6px;
    box-shadow: none;
  }
  .td2e-scrolled #ast-mobile-header .custom-logo,
  .ast-main-header-nav-open #ast-mobile-header .custom-logo{ width: 92px; }
}
/* Pages without a photo at the top: a thin line closes the bar and the content starts below the card. */
body:not(:has(.td2e-hero, .td2e-svc__hero)) #masthead{ box-shadow: 0 1px 0 #ececec; }
body:not(:has(.td2e-hero, .td2e-svc__hero)) .site-content{ padding-top: 1.5rem; }
@media (min-width: 922px){
  body:not(:has(.td2e-hero, .td2e-svc__hero)) .site-content{ padding-top: 3rem; }
}
.td2e-scrolled body #masthead{ box-shadow: 0 8px 24px -14px rgba(0,0,0,0.35); }
.td2e-reveal{
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--td2e-delay, 0s);
}
.td2e-reveal.is-visible{
  opacity: 1;
  transform: none;
}

/* ===== Language switcher (Polylang): globe + current code that opens the list ===== */
.td2e-lang{
  position: relative;
  display: flex;
  align-items: center;
  margin-left: 0.75rem;
}
.td2e-lang .td2e-lang__toggle{
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.45rem 0.75rem;
  border: 1px solid #dcdcdc;
  border-radius: 999px;
  background: var(--td2e-white);
  color: var(--td2e-ink);
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
  cursor: pointer;
  transition: border-color 0.2s ease, color 0.2s ease;
}
.td2e-lang .td2e-lang__toggle:hover,
.td2e-lang .td2e-lang__toggle:focus-visible,
.td2e-lang.is-open .td2e-lang__toggle{
  border-color: var(--td2e-red);
  background: var(--td2e-white);
  color: var(--td2e-red);
}
.td2e-lang__toggle svg{
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}
.td2e-lang__toggle .td2e-lang__chevron{
  width: 13px;
  height: 13px;
  stroke-width: 2.2;
  transition: transform 0.25s ease;
}
.td2e-lang.is-open .td2e-lang__chevron{ transform: rotate(180deg); }
.td2e-lang .td2e-lang__menu{
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 1000;
  min-width: 180px;
  margin: 0;
  padding: 0.4rem;
  list-style: none;
  line-height: 1.4; /* Astra gives header menus the header's line-height (110px). */
  background: var(--td2e-white);
  border-radius: 10px;
  box-shadow: 0 16px 36px -12px rgba(0,0,0,0.28);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}
.td2e-lang.is-open .td2e-lang__menu{
  opacity: 1;
  visibility: visible;
  transform: none;
}
.td2e-lang .td2e-lang__menu a{
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.55rem 0.7rem;
  border-radius: 7px;
  color: var(--td2e-ink) !important;
  font-size: 0.92rem;
  text-decoration: none;
}
.td2e-lang .td2e-lang__menu a:hover,
.td2e-lang .td2e-lang__menu a:focus-visible{
  background: var(--td2e-gray-light);
  color: var(--td2e-red) !important;
}
.td2e-lang__code{
  min-width: 2.2em;
  padding: 0.15rem 0.3rem;
  border-radius: 4px;
  background: #ececec;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
}
.td2e-lang__item.is-current .td2e-lang__code{
  background: var(--td2e-red);
  color: var(--td2e-white);
}
.td2e-lang__item.is-current a{ font-weight: 700; }
/* Inside the mobile menu the languages show as a row of pills, no dropdown. */
@media (max-width: 921px){
  .td2e-lang{
    display: block;
    margin: 0;
    padding: 1rem 20px;
  }
  .td2e-lang .td2e-lang__toggle{ display: none; }
  .td2e-lang .td2e-lang__menu{
    position: static;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    min-width: 0;
    padding: 0;
    background: none;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .td2e-lang .td2e-lang__menu a{
    gap: 0.45rem;
    padding: 0.4rem 0.7rem 0.4rem 0.4rem;
    border: 1px solid #dcdcdc;
    border-radius: 999px;
    font-size: 0.86rem;
  }
  .td2e-lang .td2e-lang__item.is-current a{ border-color: var(--td2e-red); }
  /* Astra makes every mobile menu item full width. */
  .td2e-lang .td2e-lang__menu li.td2e-lang__item{ width: auto !important; }
}

/* ===== Footer (Personalizar → Pie de página) ===== */
.td2e-footer{
  background: #111;
  border-top: 1px solid rgba(255,255,255,0.08);
  color: #bdbdbd;
  font-size: 0.95rem;
  line-height: 1.7;
}
.td2e-footer p{ margin: 0; }
.td2e-footer a{
  color: var(--td2e-white);
  text-decoration: none;
}
.td2e-footer a:hover,
.td2e-footer a:focus-visible{
  color: var(--td2e-white);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.td2e-footer__main{
  display: grid;
  grid-template-columns: 1.2fr 1.1fr 1.1fr;
  gap: 2.5rem;
  max-width: 1100px;
  margin: 0 auto;
  padding: 3.5rem 2rem 2.5rem;
}
.td2e-footer .td2e-footer__logo{
  display: block;
  width: 150px;
  height: auto;
  margin-bottom: 1rem;
}
.td2e-footer__brand p{ max-width: 320px; }
.td2e-footer__title{
  color: var(--td2e-white);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 1rem !important;
}
.td2e-footer__title::after{
  content: "";
  display: block;
  width: 28px;
  height: 3px;
  margin-top: 0.5rem;
  background: var(--td2e-red);
}
.td2e-footer address{
  margin: 0;
  font-style: normal;
}
/* Social icons reuse Astra's header markup; restyle them as round buttons. */
.td2e-footer .header-social-inner-wrap{
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.td2e-footer .ast-builder-social-element{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  transition: background 0.25s ease, transform 0.25s ease;
}
.td2e-footer .ast-builder-social-element:hover,
.td2e-footer .ast-builder-social-element:focus-visible{
  background: var(--td2e-red);
  transform: translateY(-2px);
}
.td2e-footer .ast-builder-social-element svg{
  width: 18px;
  height: 18px;
  fill: var(--td2e-white);
}
.td2e-footer__brand .header-social-inner-wrap{ margin-top: 1.25rem; }
/* Static map image (OpenStreetMap) that links out to Google Maps, so no third-party content loads here. */
.td2e-footer__map{
  display: block;
  overflow: hidden;
  border-radius: 6px;
  box-shadow: 0 10px 24px -12px rgba(0,0,0,0.6);
}
.td2e-footer__map img{
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.td2e-footer__map:hover img,
.td2e-footer__map:focus-visible img{ transform: scale(1.04); }
.td2e-footer__map-meta{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-top: 0.8rem !important;
}
.td2e-footer a.td2e-footer__directions{
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 1rem;
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.25s ease, border-color 0.25s ease;
}
.td2e-footer a.td2e-footer__directions::after{
  content: "→";
  transition: transform 0.25s ease;
}
.td2e-footer a.td2e-footer__directions:hover,
.td2e-footer a.td2e-footer__directions:focus-visible{
  background: var(--td2e-red);
  border-color: var(--td2e-red);
  text-decoration: none;
}
.td2e-footer a.td2e-footer__directions:hover::after{ transform: translateX(3px); }
.td2e-footer__map-meta small,
.td2e-footer__map-meta small a{
  color: #8a8a8a;
  font-size: 0.72rem;
}
.td2e-footer__bottom{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 2rem;
  max-width: 1100px;
  margin: 0 auto;
  padding: 1.25rem 2rem 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.12);
  font-size: 0.85rem;
}
.td2e-footer__legal{
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.td2e-footer__legal a{ color: #bdbdbd; }
.td2e-footer__copy{
  color: #9a9a9a;
  font-weight: 700;
}
@media (max-width: 921px){
  .td2e-footer__main{ grid-template-columns: 1fr 1fr; }
  .td2e-footer__brand{ grid-column: 1 / -1; }
  /* Keep the copyright clear of the floating WhatsApp button. */
  .td2e-has-whatsapp .td2e-footer__bottom{ padding-bottom: 6rem; }
}
@media (max-width: 600px){
  .td2e-footer__main{
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 3rem 1.25rem 2rem;
  }
  .td2e-footer__bottom{
    flex-direction: column;
    align-items: flex-start;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

/* ===== Service pages =====
   Built with ordinary blocks inside a Group with the class "td2e-svc" (Astra page settings: title hidden,
   full-width container). Each band is a Group "td2e-svc__section"; the classes below give it the site's look. */
.td2e-svc{
  --td2e-band-pad: max(20px, calc((100% - 1100px) / 2));
  margin: 0;
}
/* Astra pads every top-level Group; the bands carry their own padding. */
.entry-content > .td2e-svc{ padding: 0 !important; }
.entry-content .td2e-svc > *{
  margin-top: 0;
  margin-bottom: 0;
}
.td2e-svc .td2e-svc__section{
  padding: 4.5rem var(--td2e-band-pad);
}
.td2e-svc .td2e-svc__section--alt{ background: var(--td2e-gray-light); }
.td2e-svc .td2e-svc__section > .td2e-eyebrow{
  color: var(--td2e-red) !important;
  text-align: left;
}
.td2e-svc .td2e-svc__section h2{
  margin: 0 0 1rem;
  color: var(--td2e-ink) !important;
  font-size: clamp(1.5rem, 2.6vw, 2.05rem);
  line-height: 1.2;
}
.td2e-svc .td2e-svc__section > p{
  max-width: 780px;
  color: var(--td2e-gray-mid);
  font-size: 1.05rem;
  line-height: 1.7;
}

/* Hero: a Cover block with the photo, darker on the text side like the front page. */
.td2e-svc .td2e-svc__hero{
  min-height: clamp(380px, 56vh, 540px) !important;
  padding: 4rem var(--td2e-band-pad) !important;
  justify-content: flex-start !important;
}
/* Room above the text for the floating logo card. */
@media (min-width: 922px){
  .td2e-svc .td2e-svc__hero{ padding-top: 5.5rem !important; }
}
/* Hero without a photo yet: dark band with a soft red glow. */
.td2e-svc .td2e-svc__hero:not(:has(.wp-block-cover__image-background)){
  background: radial-gradient(circle at 85% 25%, rgba(197,0,10,0.35), transparent 55%), var(--td2e-ink);
}
.td2e-svc .td2e-svc__hero .wp-block-cover__background{
  background: linear-gradient(90deg, rgba(10,10,10,0.88) 0%, rgba(10,10,10,0.62) 45%, rgba(10,10,10,0.2) 100%) !important;
  opacity: 1 !important;
}
.td2e-svc .td2e-svc__hero .wp-block-cover__inner-container{
  width: 100%;
  max-width: 680px;
  margin: 0;
}
/* Astra greys out every paragraph inside a Cover block, hence the !important colours. */
.td2e-svc .td2e-svc__hero .td2e-eyebrow{
  text-align: left;
  color: #ffb3ad !important;
  letter-spacing: 0.12em;
  text-shadow: 0 1px 6px rgba(0,0,0,0.5);
}
.td2e-svc .td2e-svc__hero h1{
  margin: 0.4rem 0 1rem;
  color: var(--td2e-white) !important;
  font-size: clamp(1.9rem, 3.8vw, 2.9rem);
  line-height: 1.15;
  text-shadow: 0 2px 12px rgba(0,0,0,0.35);
}
.td2e-svc .td2e-svc__hero p:not(.td2e-eyebrow){
  max-width: 560px;
  color: rgba(255,255,255,0.92) !important;
  font-size: 1.08rem;
  line-height: 1.6;
}

/* Buttons: red like the front page; the outline style goes white on dark bands. */
.td2e-svc .wp-block-buttons{
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}
.td2e-svc .wp-block-button__link{
  display: inline-block;
  padding: 0.85rem 1.8rem;
  border: 2px solid var(--td2e-red);
  border-radius: 2px !important;
  background: var(--td2e-red);
  color: var(--td2e-white) !important;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.td2e-svc .wp-block-button__link:hover,
.td2e-svc .wp-block-button__link:focus-visible{
  border-color: var(--td2e-red-dark);
  background: var(--td2e-red-dark);
  transform: translateY(-1px);
}
/* Astra fills outline buttons with grey; keep them transparent. */
.td2e-svc .is-style-outline .wp-block-button__link{
  border-color: rgba(255,255,255,0.7) !important;
  background: transparent !important;
}
.td2e-svc .is-style-outline .wp-block-button__link:hover,
.td2e-svc .is-style-outline .wp-block-button__link:focus-visible{
  border-color: var(--td2e-white) !important;
  background: rgba(255,255,255,0.12) !important;
}
.td2e-svc .td2e-svc__section .is-style-outline .wp-block-button__link{
  border-color: var(--td2e-ink) !important;
  color: var(--td2e-ink) !important;
}

/* "What we do": cards with the red top edge of the front page. */
.td2e-svc .td2e-features{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  margin-top: 2rem;
}
/* Five or more cards go three per row, so six make two full rows. */
.td2e-svc .td2e-features:has(> :nth-child(5)){ grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 921px){
  .td2e-svc .td2e-features,
  .td2e-svc .td2e-features:has(> :nth-child(5)){ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px){
  .td2e-svc .td2e-features,
  .td2e-svc .td2e-features:has(> :nth-child(5)){ grid-template-columns: 1fr; }
}
.td2e-svc .td2e-feature{
  margin: 0;
  padding: 1.6rem 1.4rem;
  border: 1px solid #e5e5e5;
  border-top: 4px solid var(--td2e-red);
  background: var(--td2e-white);
}
.td2e-svc .td2e-feature h3,
.td2e-svc .td2e-feature h4{
  margin: 0 0 0.5rem;
  color: var(--td2e-ink) !important;
  font-size: 1.08rem;
}
/* Text marked as code in a card title (e.g. "Ex d") shows as a red badge above it. */
.td2e-svc .td2e-feature h3 code,
.td2e-svc .td2e-feature h4 code{
  display: table;
  margin-bottom: 0.55rem;
  padding: 0.2rem 0.55rem;
  border-radius: 3px;
  background: var(--td2e-red);
  color: var(--td2e-white);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.td2e-svc .td2e-feature p{
  margin: 0;
  color: var(--td2e-gray-mid);
  font-size: 0.95rem;
  line-height: 1.55;
}

/* "How we work": numbered steps (an ordered list). */
.td2e-svc .td2e-steps{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.25rem;
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
  counter-reset: td2e-step;
}
.td2e-svc .td2e-steps li{
  position: relative;
  margin: 0;
  padding: 3.4rem 1.3rem 1.3rem;
  border-radius: 8px;
  background: var(--td2e-white);
  box-shadow: 0 12px 32px -20px rgba(0,0,0,0.3);
  color: var(--td2e-gray-mid);
  font-size: 0.95rem;
  line-height: 1.55;
  counter-increment: td2e-step;
}
.td2e-svc .td2e-steps li::before{
  content: counter(td2e-step, decimal-leading-zero);
  position: absolute;
  top: 1rem;
  left: 1.3rem;
  color: var(--td2e-red);
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
}
.td2e-svc .td2e-steps li strong{
  display: block;
  margin-bottom: 0.3rem;
  color: var(--td2e-ink);
  font-size: 1.02rem;
}
/* On a white band the shadow alone is too faint. */
.td2e-svc .td2e-svc__section:not(.td2e-svc__section--alt) .td2e-steps li{ border: 1px solid #e5e5e5; }

/* Pills for sectors, equipment and brands. */
.td2e-svc .td2e-pills{
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.td2e-svc .td2e-pills li{
  margin: 0;
  padding: 0.5rem 1.1rem;
  border: 2px solid var(--td2e-red);
  border-radius: 999px;
  background: var(--td2e-white);
  color: var(--td2e-ink);
  font-size: 0.92rem;
  font-weight: 700;
}
.td2e-svc .td2e-pills--light li{
  border: 1px solid #d6d6d6;
  font-weight: 600;
}

/* Checklist: red ticks. */
.td2e-svc .td2e-checklist{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0.85rem 2rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.td2e-svc .td2e-checklist li{
  position: relative;
  margin: 0;
  padding-left: 2rem;
  color: var(--td2e-ink);
  font-weight: 600;
}
.td2e-svc .td2e-checklist li::before{
  content: "";
  position: absolute;
  top: 0.1em;
  left: 0;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50%;
  background: var(--td2e-red);
}
.td2e-svc .td2e-checklist li::after{
  content: "";
  position: absolute;
  top: 0.32em;
  left: 0.47rem;
  width: 0.36rem;
  height: 0.66rem;
  border: solid var(--td2e-white);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Tables (e.g. ATEX zones): dark header, first columns highlighted. */
.td2e-svc .td2e-table{
  margin: 2rem 0 0;
  overflow-x: auto;
}
.td2e-svc .td2e-table table{
  width: 100%;
  border-collapse: collapse;
  background: var(--td2e-white);
}
.td2e-svc .td2e-table th{
  padding: 0.85rem 1rem;
  border: 0;
  background: var(--td2e-ink);
  color: var(--td2e-white);
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  text-align: left;
  text-transform: uppercase;
}
.td2e-svc .td2e-table td{
  padding: 0.85rem 1rem;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
  color: var(--td2e-ink);
}
.td2e-svc .td2e-table td:first-child,
.td2e-svc .td2e-table td:nth-child(2){
  color: var(--td2e-red);
  font-size: 1.15rem;
  font-weight: 800;
}
.td2e-svc .td2e-table figcaption{
  margin-top: 0.75rem;
  color: var(--td2e-gray-mid);
  font-size: 0.9rem;
  text-align: left;
}

/* "Saber más": a Details block with the class "td2e-more" that opens in place, without leaving the page
   (e.g. ATEX on the switchboards page). Inside, headings go one level down (h3, and h4 in the cards). */
.td2e-svc .td2e-more{
  margin: 2rem 0 0;
  border: 1px solid #e5e5e5;
  border-left: 4px solid var(--td2e-red);
  border-radius: 4px;
  background: var(--td2e-white);
  box-shadow: 0 14px 36px -26px rgba(0,0,0,0.35);
}
.td2e-svc .td2e-more > summary{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem 1.4rem;
  color: var(--td2e-ink);
  font-size: 1.05rem;
  font-weight: 700;
  list-style: none;
  cursor: pointer;
  transition: color 0.15s ease;
}
.td2e-svc .td2e-more > summary::-webkit-details-marker{ display: none; }
/* Round red "+" that turns into an "×" when open. */
.td2e-svc .td2e-more > summary::after{
  content: "+";
  display: grid;
  flex: none;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 50%;
  background: var(--td2e-red);
  color: var(--td2e-white);
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1;
  transition: transform 0.3s ease, background-color 0.15s ease;
}
.td2e-svc .td2e-more > summary:hover{ color: var(--td2e-red); }
.td2e-svc .td2e-more > summary:hover::after{ background: var(--td2e-red-dark); }
.td2e-svc .td2e-more > summary:focus-visible{
  outline: 3px solid var(--td2e-red);
  outline-offset: 3px;
}
.td2e-svc .td2e-more[open] > summary{ border-bottom: 1px solid #ececec; }
.td2e-svc .td2e-more[open] > summary::after{ transform: rotate(135deg); }
.td2e-svc .td2e-more > :not(summary){
  margin-right: 1.4rem;
  margin-left: 1.4rem;
}
.td2e-svc .td2e-more > :last-child{ margin-bottom: 1.8rem; }
.td2e-svc .td2e-more > h3{
  margin-top: 2.2rem;
  margin-bottom: 0.75rem;
  color: var(--td2e-ink) !important;
  font-size: clamp(1.2rem, 2vw, 1.4rem);
  line-height: 1.25;
}
.td2e-svc .td2e-more > p{
  max-width: 780px;
  color: var(--td2e-gray-mid);
  line-height: 1.7;
}
.td2e-svc .td2e-more .td2e-features{ margin-top: 1.25rem; }
.td2e-svc .td2e-more .td2e-feature{ background: #fafafa; }
/* Smooth opening where the browser can animate to "auto" height (it just opens elsewhere). */
@media (prefers-reduced-motion: no-preference){
  @supports (interpolate-size: allow-keywords) and selector(::details-content){
    .td2e-svc .td2e-more{ interpolate-size: allow-keywords; }
    .td2e-svc .td2e-more::details-content{
      height: 0;
      overflow: clip;
      transition: height 0.45s ease, content-visibility 0.45s allow-discrete;
    }
    .td2e-svc .td2e-more[open]::details-content{ height: auto; }
  }
}
@media (max-width: 600px){
  .td2e-svc .td2e-more > summary{ padding: 1rem 1.1rem; }
  .td2e-svc .td2e-more > :not(summary){
    margin-right: 1.1rem;
    margin-left: 1.1rem;
  }
}

/* Body text of the inner pages (services, legal...) justified, with hyphenation so the gaps stay even.
   On phones the lines are too short for that, so it stays left-aligned there. */
@media (min-width: 601px){
  .td2e-svc .td2e-svc__section > p,
  .td2e-svc .td2e-more > p,
  .page .entry-content > p{
    text-align: justify;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}

/* Closing call to action: dark band like the front page. */
.td2e-svc .td2e-svc__cta{
  padding: 4.5rem var(--td2e-band-pad);
  background: var(--td2e-ink);
  text-align: center;
}
.td2e-svc .td2e-svc__cta h2{
  margin: 0 0 0.75rem;
  color: var(--td2e-white) !important;
  font-size: clamp(1.5rem, 3vw, 2rem);
}
.td2e-svc .td2e-svc__cta p{
  max-width: 620px;
  margin: 0 auto;
  color: rgba(255,255,255,0.8);
}
.td2e-svc .td2e-svc__cta .wp-block-buttons{ justify-content: center; }

@media (max-width: 600px){
  .td2e-svc .td2e-svc__section,
  .td2e-svc .td2e-svc__cta{
    padding-top: 3.25rem;
    padding-bottom: 3.25rem;
  }
  .td2e-svc .td2e-svc__hero{ min-height: 440px !important; }
}

/* ===== Área de clientes (WooCommerce) ===== */
/* Header button (Personalizar → Área de clientes, only on HTTPS): red outlined pill before the language switcher. */
.td2e-account{
  display: flex;
  align-items: center;
  margin-left: 0.75rem;
}
.td2e-account .td2e-account__link{
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.85rem;
  border: 1px solid var(--td2e-red);
  border-radius: 999px;
  background: var(--td2e-white);
  color: var(--td2e-red) !important;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1; /* Astra gives header menus the header's line-height (110px). */
  white-space: nowrap;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.td2e-account .td2e-account__link:hover,
.td2e-account .td2e-account__link:focus-visible,
.td2e-account .td2e-account__link[aria-current="page"]{
  background: var(--td2e-red);
  color: var(--td2e-white) !important;
}
.td2e-account .td2e-account__link:focus-visible{
  outline: 2px solid var(--td2e-red);
  outline-offset: 2px;
}
.td2e-account__link svg{
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}
/* Inside the mobile menu: the pill on its own row, above the language pills. */
@media (max-width: 921px){
  .td2e-account{
    display: block;
    margin: 0;
    padding: 1rem 20px 0;
  }
}

/* Store buttons: red with the square-ish corners of .td2e-btn and the service pages.
   Astra paints WooCommerce buttons from its own settings, hence the !important. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button{
  border-color: var(--td2e-red) !important;
  border-radius: 2px !important;
  background-color: var(--td2e-red) !important;
  color: var(--td2e-white) !important;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page input.button:hover,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce-page a.button:focus-visible,
.woocommerce-page button.button:focus-visible{
  border-color: var(--td2e-red-dark) !important;
  background-color: var(--td2e-red-dark) !important;
}
.woocommerce table.shop_table{ border-radius: 2px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ color: var(--td2e-ink); }
.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title{ color: var(--td2e-red); }

/* "Precio a confirmar" / "A confirmar" in place of amounts. */
.td2e-price-tbc{
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 2px;
  background: var(--td2e-gray-light);
  color: var(--td2e-gray-mid);
  font-size: 0.85rem;
  font-style: italic;
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
}
.woocommerce div.product .price .td2e-price-tbc{ font-size: 0.95rem; }

/* My account menu: plain list, current item marked in red. */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #e5e5e5;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li{
  margin: 0;
  border-bottom: 1px solid #e5e5e5;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a{
  display: block;
  padding: 0.7rem 1rem;
  border-left: 3px solid transparent;
  color: var(--td2e-ink);
  font-weight: 600;
  text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{
  border-left-color: var(--td2e-red);
  background: var(--td2e-gray-light);
  color: var(--td2e-red);
}

/* ===== Cookie table (Política de cookies) =====
   A Table block with the class "td2e-cookie-table": cookie names, purpose and duration. On phones each cookie
   becomes a card, with a "Duración" label translated per page language. */
.wp-block-table.td2e-cookie-table table{
  table-layout: auto;
  border-collapse: collapse;
  font-size: 0.93rem;
  line-height: 1.55;
}
.wp-block-table.td2e-cookie-table thead{ border: 0; }
.wp-block-table.td2e-cookie-table th{
  padding: 0.75rem 0.9rem;
  border: 0;
  background: var(--td2e-ink);
  color: var(--td2e-white);
  text-align: left;
}
.wp-block-table.td2e-cookie-table td{
  padding: 0.85rem 0.9rem;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
  vertical-align: top;
}
.wp-block-table.td2e-cookie-table td:first-child{ width: 30%; }
.wp-block-table.td2e-cookie-table td:nth-child(3){ width: 24%; color: var(--td2e-gray-mid); }
.wp-block-table.td2e-cookie-table code{
  padding: 0.1em 0.35em;
  border-radius: 3px;
  background: var(--td2e-gray-light);
  color: var(--td2e-ink);
  font-size: 0.86em;
  overflow-wrap: anywhere;
}
@media (max-width: 600px){
  .wp-block-table.td2e-cookie-table thead{ display: none; }
  .wp-block-table.td2e-cookie-table table,
  .wp-block-table.td2e-cookie-table tbody,
  .wp-block-table.td2e-cookie-table tr,
  .wp-block-table.td2e-cookie-table td{
    display: block;
    width: auto;
  }
  .wp-block-table.td2e-cookie-table tr{
    padding: 1rem 0;
    border-bottom: 1px solid #e5e5e5;
  }
  .wp-block-table.td2e-cookie-table td{
    padding: 0.2rem 0;
    border: 0;
  }
  .wp-block-table.td2e-cookie-table td:first-child{ width: auto; padding-bottom: 0.45rem; }
  .wp-block-table.td2e-cookie-table td:nth-child(3){ width: auto; }
  .wp-block-table.td2e-cookie-table td:nth-child(3)::before{
    content: "Duración: ";
    color: var(--td2e-ink);
    font-weight: 700;
  }
  html[lang^="en"] .wp-block-table.td2e-cookie-table td:nth-child(3)::before{ content: "Duration: "; }
}