/* Pallares Enterprise: hero, logos y aviso de cookies */
:root{
  --pe-petroleo:#133b50;
  --pe-noche:#071a25;
  --pe-dorado:#b98a4a;
  --pe-dorado-claro:#d4ae6e;
  --pe-marfil:#f5f3ef;
}

/* =========================================================
   HERO
   ========================================================= */
.hero.pe-hero{
  position:relative;display:block;padding:0;overflow:hidden;
  min-height:calc(100vh - 84px);min-height:calc(100svh - 84px);
  /* Azul petróleo profundo, casi negro, con una luz cálida muy sutil detrás de la animación */
  background:
    radial-gradient(42% 52% at 73% 50%,rgba(185,138,74,.11) 0%,rgba(185,138,74,0) 70%),
    radial-gradient(120% 95% at 78% 42%,#103446 0%,#0b2635 42%,#071a25 78%,#05131c 100%)!important;
}
.hero.pe-hero::after{display:none!important}
/* Velo lateral: asegura el contraste del texto sobre las partículas ambientales */
.hero.pe-hero::before{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(5,19,28,.62) 0%,rgba(5,19,28,.28) 38%,rgba(5,19,28,0) 58%),
             linear-gradient(180deg,rgba(5,19,28,0) 70%,rgba(5,19,28,.35) 100%);
}
.pe-hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}

.pe-hero-inner{
  position:relative;z-index:2;
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6.2fr);align-items:center;gap:3.5vw;
  max-width:1440px;margin:0 auto;min-height:inherit;
  padding:clamp(64px,9vh,112px) 5vw clamp(56px,8vh,96px);
  pointer-events:none;              /* solo el bloque de texto recibe clics */
}
.pe-hero-inner .hero-copy{pointer-events:auto;max-width:600px;padding:0;margin:0}
.pe-hero-stage{height:min(64vh,580px);min-height:360px;pointer-events:none}

/* Jerarquía tipográfica */
.hero.pe-hero .eyebrow{color:rgba(245,243,239,.66);margin:0 0 26px;font-size:11px;letter-spacing:.2em}
.hero.pe-hero .eyebrow .dot{background:var(--pe-dorado)}
.hero.pe-hero h1{
  margin:0 0 26px;color:var(--pe-marfil);
  font-size:clamp(46px,5.1vw,84px);line-height:1.02;letter-spacing:-.028em;font-weight:800;
  text-wrap:balance;
}
.hero.pe-hero h1 .blue{color:var(--pe-dorado-claro);display:inline}
.hero.pe-hero .hero-text{
  margin:0;max-width:510px;color:rgba(245,243,239,.8);
  font-size:clamp(17px,1.22vw,20px);line-height:1.65;
}

/* Botones */
.hero.pe-hero .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:40px 0 0}
.hero.pe-hero .button{min-height:52px;padding:0 28px;display:inline-flex;align-items:center;justify-content:center}
.hero.pe-hero .button.primary{background:var(--pe-dorado);border-color:var(--pe-dorado);color:#0b2635}
.hero.pe-hero .button.primary:hover,.hero.pe-hero .button.primary:focus-visible{background:var(--pe-marfil);border-color:var(--pe-marfil);color:#0b2635}
.hero.pe-hero .button.secondary{background:transparent;border-color:rgba(245,243,239,.45);color:var(--pe-marfil)}
.hero.pe-hero .button.secondary:hover,.hero.pe-hero .button.secondary:focus-visible{background:rgba(245,243,239,.08);border-color:var(--pe-marfil);color:var(--pe-marfil)}
.hero.pe-hero .button:focus-visible{outline:2px solid var(--pe-dorado-claro);outline-offset:3px}

/* Entrada suave del texto cuando la animación está lista */
@media (prefers-reduced-motion:no-preference){
  .pe-hero .hero-copy>*{animation:pe-rise .9s cubic-bezier(.2,.7,.2,1) both}
  .pe-hero .hero-copy>*:nth-child(2){animation-delay:.08s}
  .pe-hero .hero-copy>*:nth-child(3){animation-delay:.16s}
  .pe-hero .hero-copy>*:nth-child(4){animation-delay:.24s}
}
@keyframes pe-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Tablet y móvil: composición vertical */
@media (max-width:960px){
  .hero.pe-hero{min-height:0}
  .pe-hero-inner{grid-template-columns:1fr;gap:4px;padding:8px 6vw 56px}
  .pe-hero-inner .hero-copy{max-width:640px}
  /* La animación va arriba para que se vea en la primera pantalla */
  .pe-hero-stage{order:-1;height:clamp(200px,38vw,320px);min-height:0}
  .hero.pe-hero h1{font-size:clamp(38px,7.4vw,62px)}
  .hero.pe-hero::before{background:linear-gradient(180deg,rgba(5,19,28,0) 0%,rgba(5,19,28,0) 30%,rgba(5,19,28,.45) 55%,rgba(5,19,28,.2) 100%)}
}
@media (max-width:480px){
  .pe-hero-inner{padding:0 22px 44px}
  .hero.pe-hero .eyebrow{display:none}
  .hero.pe-hero h1{font-size:clamp(34px,10.4vw,44px);margin-bottom:18px}
  .hero.pe-hero .hero-text{font-size:16px}
  .hero.pe-hero .hero-actions{flex-direction:column;margin-top:28px}
  .hero.pe-hero .button{width:100%}
  .pe-hero-stage{height:clamp(170px,48vw,220px)}
}

/* =========================================================
   LOGOS
   ========================================================= */
.nav a.brand img.brand-mark{height:72px!important;width:auto!important;max-height:72px!important}
@media (max-width:640px){.nav a.brand img.brand-mark{height:52px!important;max-height:52px!important}}

/* Franja de contacto: logo corporativo claro sobre fondo oscuro */
.contact-side img.pe-contact-logo{width:100%;max-width:440px;height:auto;display:block}

/* =========================================================
   AVISO DE COOKIES
   ========================================================= */
.pe-cookie{position:fixed;left:16px;right:16px;bottom:16px;max-width:560px;margin:0 auto;z-index:9999;background:var(--pe-petroleo);color:var(--pe-marfil);border:1px solid rgba(185,138,74,.35);border-radius:14px;padding:18px 20px;box-shadow:0 18px 40px rgba(0,0,0,.35);font-size:14px;line-height:1.55;display:none}
.pe-cookie.show{display:block}
.pe-cookie p{margin:0 0 12px}
.pe-cookie a{color:var(--pe-dorado-claro)}
.pe-cookie .row{display:flex;gap:10px;flex-wrap:wrap}
.pe-cookie button{font:inherit;border-radius:999px;padding:9px 18px;cursor:pointer;border:1px solid var(--pe-dorado)}
.pe-cookie .ok{background:var(--pe-dorado);color:var(--pe-petroleo);font-weight:600}
.pe-cookie .no{background:transparent;color:var(--pe-marfil)}
.cookie-open{background:none;border:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px;opacity:.85}

/* =========================================================
   SERVICIOS: jerarquía título > frase principal > descripción > lista
   ========================================================= */
.svc-grid .svc-card h3{margin-bottom:12px}
.svc-grid .svc-lead{font-size:17px;line-height:1.4;font-weight:700;margin:0 0 10px;color:inherit;letter-spacing:-.005em}
.svc-grid .svc-desc{font-size:14.5px;line-height:1.62;margin:0 0 18px;opacity:.78}
.svc-grid .svc-card .pkg-list li{font-size:13.5px;line-height:1.45}
@media (max-width:640px){
  .svc-grid .svc-lead{font-size:16px}
  .svc-grid .svc-desc{font-size:14px}
}
/* refuerzo de especificidad: los estilos base de las tarjetas no deben pisar la frase principal */
.expertise .svc-grid .svc-card .svc-lead{font-size:17px;line-height:1.4;font-weight:700;color:var(--pe-dorado-claro);margin:0 0 10px}
.expertise .svc-grid .svc-card .svc-desc{font-size:14.5px;line-height:1.62;margin:0 0 18px}
@media (min-width:961px){
  /* alturas alineadas para que las listas empiecen a la misma altura */
  .expertise .svc-grid .svc-card h3{min-height:2.3em}
  .expertise .svc-grid .svc-card .svc-lead{min-height:2.85em}
  .expertise .svc-grid .svc-card .svc-desc{min-height:8.2em}
}
@media (max-width:640px){
  .expertise .svc-grid .svc-card .svc-lead{font-size:16px}
  .expertise .svc-grid .svc-card .svc-desc{font-size:14px}
}

/* =========================================================
   PLANES: condiciones del dominio y preguntas frecuentes
   ========================================================= */
.comparison .cell-text{font-size:.82rem;font-weight:600;letter-spacing:.01em;white-space:nowrap}
.comparison .cell-yes{color:#8a6531}
.comparison .cell-no{color:#7a7f8a}
.comparison-note{max-width:900px;margin:16px auto 0;font-size:.85rem;line-height:1.6;color:#4a5263;text-align:left}

.pe-faq{margin:72px auto 24px;max-width:900px}
.pe-faq .section-title{margin-bottom:28px}
.pe-faq-list{display:grid;gap:10px;text-align:left}
.pe-faq-item{background:rgba(255,255,255,.82);border:1px solid #e2d1b3;border-radius:14px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.pe-faq-item[open]{border-color:#c9a063;box-shadow:0 10px 28px rgba(19,59,80,.08)}
.pe-faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 20px;min-height:56px}
.pe-faq-item summary::-webkit-details-marker{display:none}
.pe-faq-item summary:focus-visible{outline:2px solid #b98a4a;outline-offset:-2px;border-radius:14px}
.pe-faq-n{font-size:.75rem;font-weight:700;color:#b98a4a;letter-spacing:.08em;min-width:22px}
.pe-faq-q{flex:1;font-weight:700;color:#133b50;font-size:1rem;line-height:1.4}
.pe-faq-icon{width:22px;height:22px;flex:0 0 22px;position:relative;border-radius:50%;border:1px solid #d9c29b}
.pe-faq-icon::before,.pe-faq-icon::after{content:'';position:absolute;left:50%;top:50%;width:10px;height:1.5px;background:#b98a4a;transform:translate(-50%,-50%);transition:transform .25s}
.pe-faq-icon::after{transform:translate(-50%,-50%) rotate(90deg)}
.pe-faq-item[open] .pe-faq-icon::after{transform:translate(-50%,-50%) rotate(0deg)}
.pe-faq-a{padding:0 20px 20px 56px;color:#3c4556;font-size:.95rem;line-height:1.65}
.pe-faq-a p{margin:0 0 10px}
.pe-faq-a ul{margin:4px 0 0;padding-left:18px}
.pe-faq-a li{margin:4px 0}
@media (max-width:640px){
  .pe-faq{margin-top:48px}
  .pe-faq-item summary{padding:16px;gap:10px}
  .pe-faq-q{font-size:.95rem}
  .pe-faq-a{padding:0 16px 18px 16px;font-size:.92rem}
}

/* =========================================================
   v6 — HERO (solo página principal): en móvil la animación usa todo el ancho
   ========================================================= */
@media (max-width:480px){.pe-hero .pe-hero-stage{margin:0 -22px}}

/* =========================================================
   v6 — FONDO «ARQUITECTURA DIGITAL LUMINOSA» — EXCLUSIVO DE /planes
   Todas las reglas dependen de .pe-arch-page (clase del <body> de /planes)
   ========================================================= */
.pe-arch-page{position:relative;overflow-x:hidden}
.pe-arch-page .watermark{display:none}
.pe-arch-page>header,.pe-arch-page>main{position:relative;z-index:1}
.pe-arch-page .pe-arch{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.pe-arch-page .pe-arch-item{position:absolute;pointer-events:none}
.pe-arch-page .pe-arch-item svg{display:block;width:100%;height:auto;overflow:visible}
.pe-arch-page .pe-arch-item.tl{top:0;left:0;width:clamp(300px,38vw,640px)}
.pe-arch-page .pe-arch-item.tr{top:0;right:0;width:clamp(280px,34vw,600px);transform:scaleX(-1)}
.pe-arch-page .pe-arch-item.ml{left:0;top:36%;width:clamp(90px,11vw,200px)}
.pe-arch-page .pe-arch-item.mr{right:0;top:58%;width:clamp(90px,11vw,200px);transform:scaleX(-1)}
.pe-arch-page .pe-arch-item.bl{bottom:0;left:0;width:clamp(260px,32vw,560px);transform:scaleY(-1)}
.pe-arch-page .pe-arch-item.br{bottom:0;right:0;width:clamp(300px,38vw,640px);transform:scale(-1,-1)}
.pe-arch-page .pe-arch-flow{stroke-dasharray:46 954;stroke-dashoffset:1000;opacity:.9;animation:pe-arch-flow 14s linear infinite}
.pe-arch-page .pe-arch-flow.slow{animation-duration:20s}
.pe-arch-page .pe-arch-node{animation:pe-arch-node 6s ease-in-out infinite}
.pe-arch-page .pe-arch-node.d1{animation-delay:-1.5s}
.pe-arch-page .pe-arch-node.d2{animation-delay:-3s}
.pe-arch-page .pe-arch-node.d3{animation-delay:-4.5s}
.pe-arch-page .pe-arch-float{animation:pe-arch-float 22s ease-in-out infinite alternate}
@keyframes pe-arch-flow{to{stroke-dashoffset:0}}
@keyframes pe-arch-node{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes pe-arch-float{from{transform:translateY(0)}to{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){
  .pe-arch-page .pe-arch *{animation:none!important}
  .pe-arch-page .pe-arch-flow{display:none}
}
@media (max-width:900px){
  .pe-arch-page .pe-arch-item.ml,.pe-arch-page .pe-arch-item.mr{display:none}
  .pe-arch-page .pe-arch-item.tl{width:72vw}.pe-arch-page .pe-arch-item.tr{width:58vw}
  .pe-arch-page .pe-arch-item.bl{width:58vw}.pe-arch-page .pe-arch-item.br{width:72vw}
}
@media (max-width:480px){
  .pe-arch-page .pe-arch-item.tr,.pe-arch-page .pe-arch-item.bl{display:none}
  .pe-arch-page .pe-arch-item{opacity:.8}
  .pe-arch-page .pe-arch-item.tl,.pe-arch-page .pe-arch-item.br{width:88vw}
}

/* =========================================================
   v8 — SECCIÓN TECNOLOGÍA (solo .pe-tech)
   ========================================================= */
.pe-tech{position:relative;overflow:hidden;background:#0b2635;color:#f5f3ef;padding-top:110px;padding-bottom:96px}
.pe-tech .section-tag{display:flex;align-items:center;gap:14px;color:#d4ae6e}
.pe-tech .section-tag::after{content:'';width:70px;height:1px;background:#b98a4a}
.pe-tech-head{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:4vw;align-items:end;margin:20px 0 48px}
.pe-tech h2{font-size:clamp(34px,3.9vw,58px);line-height:1.02;letter-spacing:-.045em;margin:0 0 18px;color:#f5f3ef}
.pe-tech h2 span{color:#d4ae6e}
.pe-tech-intro{font-size:17px;line-height:1.6;color:#c9d3d6;max-width:600px;margin:0}
.pe-tech-quote{margin:0;padding:4px 0 4px 18px;border-left:1px solid #b98a4a;font-family:Georgia,"Times New Roman",serif;font-size:20px;line-height:1.5;color:#e9e4d8}
.pe-tech-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.pe-tech-card{grid-column:span 2;min-width:0;background:#12354a;border:1px solid rgba(185,138,74,.35);border-radius:16px;padding:24px 22px 18px;transition:transform .25s,border-color .25s}
.pe-tech-card.wide{grid-column:span 3}
.pe-tech-card.featured{background:#143a50;border-color:#b98a4a}
.pe-tech-card:hover{transform:translateY(-2px);border-color:#c9a063}
.pe-tech-top{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px}
.pe-tech-ico{width:46px;height:46px;flex:0 0 46px;border-radius:12px;border:1px solid rgba(212,174,110,.55);display:flex;align-items:center;justify-content:center;color:#d4ae6e}
.pe-tech-card.featured .pe-tech-ico{border-color:#d4ae6e}
.pe-tech-ico svg{width:24px;height:24px}
.pe-tech-card h3{font-size:19px;line-height:1.25;letter-spacing:-.01em;margin:0 0 5px;color:#f5f3ef}
.pe-tech-card p{font-size:14px;line-height:1.5;color:#b9c6ca;margin:0}
.pe-tech-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pe-tech-chips li{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;border:1px solid rgba(245,243,239,.18);background:#0e2c3d;font-size:13px;line-height:1.2;color:#e9e4d8}
.pe-tech-chips svg{width:15px;height:15px;flex:0 0 15px;color:#d4ae6e}
.pe-tech-rule{height:1px;background:#b98a4a;opacity:.55;margin-top:48px}
@media (max-width:960px){
  .pe-tech-head{grid-template-columns:1fr;gap:22px;margin-bottom:36px}
  .pe-tech-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pe-tech-card,.pe-tech-card.wide{grid-column:span 1}
  .pe-tech-card:last-child{grid-column:span 2}
}
@media (max-width:640px){
  .pe-tech{padding-top:80px;padding-bottom:72px}
  .pe-tech-grid{grid-template-columns:1fr;gap:14px}
  .pe-tech-card:last-child{grid-column:span 1}
  .pe-tech-card{padding:20px 18px 16px}
  .pe-tech-quote{font-size:18px}
}
@media (prefers-reduced-motion:reduce){.pe-tech-card{transition:none}.pe-tech-card:hover{transform:none}}

/* =====================================================================
   v10 · Contraste WCAG 2.1 AA (solo colores de texto; misma paleta y diseño)
   Tonos calculados: mismo matiz de la marca, ajustando solo luminosidad.
   - Dorado para texto pequeño sobre fondos claros: #7f5d2e
   - Dorado para títulos grandes sobre fondos claros: #94703c
   - Dorado claro de la marca para texto sobre fondos oscuros: #d4ae6e
   ===================================================================== */
:root{--muted:#676660;--pe-gold-ink:#7f5d2e;--pe-gold-head:#94703c;--pe-gold-on-dark:#d4ae6e}
/* Títulos con acento dorado en secciones claras del inicio (ES/EN) */
#problems .sec-head h2 span,#solve h2 span,#process h2 span,#work h2 span{color:var(--pe-gold-head)}
/* «frecuentes» queda en parte sobre la foto difuminada del fondo: tono más profundo */
#faq h2 span{color:var(--pe-gold-ink)}
/* Texto dorado pequeño sobre fondo claro */
#process .step strong,#about .formula i,.case-proj a,.case-modal-hero .project-type{color:var(--pe-gold-ink)}
.faq-sub{color:#6a665f}
.faq-feat span{color:#403d38}
#faq .section-tag{color:#56554f}
/* Texto dorado sobre fondos oscuros: dorado claro de la marca */
.expertise .section-tag,.expertise-card .card-top span,.card-learn,.sel-kicker,.case-plans{color:var(--pe-gold-on-dark)}
/* Número de pregunta: dorado profundo con la pregunta cerrada (fondo claro), dorado claro abierta (fondo petróleo) */
.faq-n{color:var(--pe-gold-ink)}
.faq .faq-list details[open] .faq-n{color:var(--pe-gold-on-dark)}
/* Etiqueta de sección sobre fondo oscuro (Resultados) */
.impact .section-tag{color:#9a9893}
.lead-sec.dark .channels small{color:#ccd3db}
/* Botones dorados: texto azul petróleo (como en /planes); al pasar el mouse el fondo pasa a petróleo y el texto a blanco */
.button.gold{color:#0b2635}
.button.gold:hover{color:#fff}
/* Estados hover sobre fondos claros o dorados */
.nav nav a:hover,.lang-switch a:hover{color:var(--pe-gold-ink)}
.nav-cta:hover{color:#0b2635}
.pe-cookie .ok{color:#0b2635}
/* Pie de página */
footer{color:#8f8f8f}
.cookie-open{opacity:1}
/* v10 · Responsive: en pantallas de 360 px o menos, los títulos de Servicios y Resultados
   (64 px) desbordaban 2 px; se reduce solo su tamaño, sin cambiar el texto. */
@media (max-width:360px){.expertise-head h2{font-size:50px!important}}