/* =====================================================================
   Origen Confort — sistema base del tema (portado 1:1 del boceto).
   Jost para cuerpo y UI, Cormorant para titulares. Crema #f6f6f3,
   fichas #eeede6, turquesa corporativo oscurecido #14605f en bandas
   grandes y el vivo #42cecf solo en puntos y filetes.
   Las secciones de portada van en home.css (fase 3).
   ===================================================================== */
:root{
  --bg:#f6f6f3; --card:#eeede6; --txt:#212529; --mut:#69727d; --line:rgba(33,37,41,.12);
  --acc:#14605f; --acc-vivo:#42cecf; --acc-dk:#0e4a49; --crema:#eeede6;
  --wrap:1400px; --gut:20px; --hdr:65px;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.77,0,.175,1);
  --ease-drawer:cubic-bezier(.32,.72,0,1);
  --serif:'Cormorant',Georgia,'Times New Roman',serif;
  --sans:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:var(--sans);font-size:15px;line-height:1.3;color:var(--txt);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a:focus,button:focus,input:focus,textarea:focus,select:focus{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
h1,h2,h3,h4,.h1,.h2,.h3,.h4{font-family:var(--serif);font-weight:400;letter-spacing:.005em}
.h3{font-size:32px;line-height:1.05}
.h4{font-size:28px;line-height:1.05}
.serif{font-family:var(--serif);font-weight:300;font-style:italic}
.mut{color:var(--mut)}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--txt);color:var(--bg);padding:10px 16px;font-size:14px;transition:top 160ms var(--ease-out)}
.skip:focus{top:12px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* ---- Botones: versalita 14/500 con punto delante ---- */
.btn{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;line-height:1.1;
  transition:transform 160ms var(--ease-out),color 200ms ease,background-color 200ms ease,border-color 200ms ease}
.btn::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}
.btn .t{display:block;position:relative;overflow:hidden}
.btn .t i{display:block;font-style:normal;transition:transform 1s var(--ease-out)}
.btn .t::after{content:attr(data-t);position:absolute;left:0;top:0;transform:translateY(101%);transition:transform 1s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.btn:hover .t i{transform:translateY(-101%)}.btn:hover .t::after{transform:translateY(0)}}
.btn:active{transform:scale(.97)}
.btn-pill{padding:16px 28px;border:1px solid currentColor;border-radius:999px}
.btn-fill{padding:14px 26px;border-radius:999px;background:var(--txt);color:var(--bg)}
.btn-fill::before{background:var(--acc-vivo)}
@media (hover:hover) and (pointer:fine){
  .btn-pill:hover{background:var(--txt);color:var(--bg);border-color:var(--txt)}
  .btn-fill:hover{background:var(--acc)}
  .btn-txt:hover{color:var(--acc)}
}

/* ---- Cabecera: transparente sobre foto, sólida en el resto ---- */
#hdr{position:sticky;top:0;z-index:50;height:var(--hdr);color:var(--crema);
  transition:background-color 200ms ease,color 200ms ease,box-shadow 200ms ease}
.admin-bar #hdr{top:32px}
@media (max-width:782px){.admin-bar #hdr{top:46px}}
@media (max-width:600px){.admin-bar #hdr{top:0}}
#hdr .wrap{height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
#hdr .nav{display:flex;gap:40px;font-size:16px;font-weight:500}
#hdr .nav a{position:relative;padding:4px 0}
#hdr .nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 250ms var(--ease-out)}
#hdr .nav a[aria-current]::after{transform:scaleX(1)}
@media (hover:hover) and (pointer:fine){#hdr .nav a:hover::after{transform:scaleX(1)}}
#hdr .logo{display:block;width:150px;position:relative;height:32px}
#hdr .logo img{position:absolute;inset:0;margin:auto;width:150px;height:auto;transition:opacity 200ms ease}
#hdr .logo .dark{opacity:0}
#hdr .tools{display:flex;justify-content:flex-end;align-items:center;gap:28px;font-size:16px}
#hdr .tools .tel{display:inline-flex;align-items:center;gap:8px}
#hdr .tools svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#hdr.solid{background:var(--bg);color:var(--txt);box-shadow:0 1px 0 var(--line)}
#hdr.solid .logo .light{opacity:0}
#hdr.solid .logo .dark{opacity:1}
.burger{display:none;width:44px;height:44px;margin-left:-12px;place-items:center}
.burger span{display:block;width:22px;height:1.5px;background:currentColor;position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:22px;height:1.5px;background:currentColor}
.burger span::before{top:-7px}.burger span::after{top:7px}

/* ---- Menú lateral (móvil) ---- */
#scrim{position:fixed;inset:0;background:rgba(33,37,41,.4);z-index:60;opacity:0;pointer-events:none;transition:opacity 250ms ease}
#menu{position:fixed;inset:0;width:100%;background:var(--bg);z-index:61;padding:24px var(--gut) 32px;display:flex;flex-direction:column;overflow-y:auto;
  transform:translateX(-100%);visibility:hidden;transition:transform 250ms var(--ease-out),visibility 0s linear 250ms;will-change:transform}
#menu.open{transform:none;visibility:visible;transition:transform 400ms var(--ease-drawer),visibility 0s}
#scrim.on{opacity:1;pointer-events:auto}
#menu .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8vh}
#menu .top img{width:150px}
#menu .x{width:40px;height:40px;display:grid;place-items:center;font-size:22px;line-height:1}
#menu nav a{display:block;font-family:var(--serif);font-size:clamp(38px,11vw,56px);line-height:1.1;padding:10px 0;border-bottom:1px solid var(--line);
  opacity:0;transform:translateX(-10px);transition:opacity 300ms var(--ease-out),transform 300ms var(--ease-out)}
#menu.open nav a{opacity:1;transform:none}
#menu.open nav a:nth-child(1){transition-delay:60ms}#menu.open nav a:nth-child(2){transition-delay:110ms}#menu.open nav a:nth-child(3){transition-delay:160ms}
#menu.open nav a:nth-child(4){transition-delay:210ms}#menu.open nav a:nth-child(5){transition-delay:260ms}#menu.open nav a:nth-child(6){transition-delay:310ms}
#menu.open nav a:nth-child(n+7){transition-delay:340ms}
#menu .foot{margin-top:auto;padding-top:32px;font-size:14px;color:var(--mut);line-height:1.7}

/* ---- Cabecera de páginas interiores ---- */
.pghead{padding:clamp(56px,9vw,120px) 0 clamp(36px,5vw,64px)}
.pghead .kick{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin-bottom:18px}
.pghead .kick::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--acc-vivo)}
.pgtitle{font-size:clamp(46px,6.4vw,92px);line-height:1.02;max-width:16ch;
  clip-path:inset(0 0 100% 0);transform:translateY(16px);animation:oc-rise 800ms var(--ease-out) 80ms forwards}
.pghead .lead{margin-top:24px;max-width:560px;font-size:17px;line-height:1.5;color:var(--mut);opacity:0;animation:oc-fade 600ms ease 300ms forwards}
@keyframes oc-rise{to{clip-path:inset(0 0 -20% 0);transform:none}}
@keyframes oc-fade{to{opacity:1}}

/* ---- Contenido editorial (páginas legales, noticias, textos) ---- */
.prose{max-width:760px;padding:0 0 clamp(64px,8vw,110px);font-size:16px;line-height:1.65}
.prose > * + *{margin-top:1.1em}
.prose h2{font-size:clamp(30px,3vw,40px);line-height:1.1;margin-top:1.8em}
.prose h3{font-size:clamp(24px,2.2vw,30px);line-height:1.15;margin-top:1.5em}
.prose h4,.prose h5,.prose h6{font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;margin-top:1.6em}
.prose a:not(.btn){color:var(--acc);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:1.2em}
.prose ul{list-style:none}
.prose ul li{position:relative}
.prose ul li::before{content:"";position:absolute;left:-1.05em;top:.62em;width:5px;height:5px;border-radius:50%;background:var(--acc)}
.prose ol{list-style:decimal}
.prose li + li{margin-top:.4em}
.prose strong,.prose b{font-weight:500}
.prose blockquote{font-family:var(--serif);font-style:italic;font-size:26px;line-height:1.25;border-left:1px solid var(--acc);padding-left:22px}
.prose table{width:100%;border-collapse:collapse;font-size:14px}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}
.prose th{font-weight:500}
.prose img{height:auto}
.prose-fig{margin:0 0 2em}
.prose .back{margin-top:3em}
.nf p{display:flex;flex-wrap:wrap;gap:12px}

/* ---- Listado de noticias ---- */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 12px;padding-bottom:60px}
.news-card .ph{aspect-ratio:4/3;background:var(--card);overflow:hidden;margin-bottom:14px}
.news-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform 300ms ease}
@media (hover:hover) and (pointer:fine){.news-card:hover .ph img{transform:scale(1.05)}}
.news-card .date{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--mut);margin-bottom:8px}
.news-card .h4{margin-bottom:10px}
.news-card p.mut{font-size:14px;line-height:1.5}
.paginacion{padding-bottom:90px}
.paginacion .nav-links{display:flex;gap:6px;justify-content:center;align-items:center;font-size:14px}
.paginacion .page-numbers{min-width:40px;height:40px;display:grid;place-items:center;padding:0 12px;border-radius:999px;border:1px solid transparent}
.paginacion .page-numbers.current{border-color:var(--txt)}

/* ---- Pie: banda de color + telón con foto fijada abajo ---- */
.site-foot{position:relative;color:var(--crema)}
.site-foot .fmain{background:var(--acc);position:relative;z-index:2}
.site-foot .reveal{position:sticky;bottom:0;height:450px;z-index:1;overflow:hidden;display:grid;place-items:center;background:#1b1d1f;isolation:isolate}
.site-foot .reveal img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.2);will-change:transform;z-index:-1}
.site-foot .reveal::before{content:"";position:absolute;inset:0;background:rgba(20,22,24,.42);z-index:0}
.site-foot .reveal .btn-pill{position:relative;z-index:1;color:var(--crema)}
@media (hover:hover) and (pointer:fine){.site-foot .reveal .btn-pill:hover{background:var(--crema);color:var(--txt);border-color:var(--crema)}}
.site-foot .top{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:16px 0;color:rgba(238,237,230,.8)}
.site-foot .top img{width:150px}
.site-foot .colsf{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(238,237,230,.25);border-bottom:1px solid rgba(238,237,230,.25)}
.site-foot .colsf > div{padding:16px 0 20px 0;border-right:1px solid rgba(238,237,230,.25)}
.site-foot .colsf > div:not(:first-child){padding-left:20px}
.site-foot .colsf > div:last-child{border-right:0}
.site-foot .colsf .h5{font-family:var(--sans);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.site-foot .colsf li{font-size:12px;line-height:1.9;color:rgba(238,237,230,.85)}
@media (hover:hover) and (pointer:fine){.site-foot .colsf a:hover{color:#fff}}
.site-foot .giant{padding:54px 0 72px;position:relative;overflow:hidden}
.site-foot .giant .word{display:block;text-align:center;font-family:var(--serif);font-size:clamp(34px,10.1vw,148px);line-height:1;font-weight:500;text-transform:uppercase;color:rgba(238,237,230,.92);letter-spacing:.02em;white-space:nowrap}
.site-foot .giant .word span{display:inline-block;transform:translateY(18px);opacity:0;transition:transform 700ms var(--ease-out),opacity 500ms ease}
.site-foot .giant .word span:nth-child(2){transition-delay:90ms}
.site-foot .giant.in .word span{transform:none;opacity:1}
.site-foot .giant .up{position:absolute;right:0;bottom:36px;width:40px;height:40px;display:grid;place-items:center;transition:transform 200ms var(--ease-out)}
.site-foot .giant .up svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.2}
@media (hover:hover) and (pointer:fine){.site-foot .giant .up:hover{transform:translateY(-4px)}}
.site-foot .kit{display:flex;justify-content:center;padding:0 0 24px}
.site-foot .kit img{width:min(100%,640px);height:auto;background:#fff;padding:8px 14px;border-radius:4px}
.site-foot .bottom{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;font-size:12px;padding:16px 0 18px;border-top:1px solid rgba(238,237,230,.25);color:rgba(238,237,230,.85)}
.site-foot .bottom .l{display:flex;gap:16px;flex-wrap:wrap}
.site-foot .bottom .r{display:flex;gap:16px;justify-content:flex-end}
@media (hover:hover) and (pointer:fine){.site-foot .bottom a:hover{color:#fff}}
.site-foot .bottom .c a{border-bottom:1px solid rgba(238,237,230,.4)}

/* ---- Aparición al hacer scroll (solo si corre el JS: sin JS todo se ve) ---- */
.oc-js .rv{opacity:0;transition:opacity 1s ease 200ms}
.oc-js .rv.in{opacity:1}
.oc-js .stag > *{opacity:0;transform:translateY(12px);transition:opacity 500ms ease,transform 600ms var(--ease-out)}
.oc-js .stag.in > *{opacity:1;transform:none}
.stag.in > *:nth-child(1){transition-delay:0ms}.stag.in > *:nth-child(2){transition-delay:60ms}.stag.in > *:nth-child(3){transition-delay:120ms}.stag.in > *:nth-child(4){transition-delay:180ms}
.stag.in > *:nth-child(5){transition-delay:240ms}.stag.in > *:nth-child(6){transition-delay:300ms}.stag.in > *:nth-child(7){transition-delay:360ms}.stag.in > *:nth-child(n+8){transition-delay:420ms}

/* ---- Responsive ---- */
@media (max-width:900px){
  #hdr .nav,#hdr .tools .txt{display:none}
  .burger{display:grid}
  #hdr .wrap{grid-template-columns:44px 1fr 44px}
  #hdr .logo{margin-inline:auto}
  #hdr .tools{gap:0}
  #hdr .tools .tel{width:44px;height:44px;justify-content:center;margin-right:-12px}
  .news{grid-template-columns:1fr 1fr}
  .site-foot .colsf{grid-template-columns:1fr 1fr}
  .site-foot .colsf > div{border-right:0;padding-left:0 !important;border-bottom:1px solid rgba(238,237,230,.25)}
  .site-foot .colsf > div:nth-child(odd){border-right:1px solid rgba(238,237,230,.25);padding-right:20px}
  .site-foot .colsf > div:nth-child(even){padding-left:20px !important}
  .site-foot .colsf > div:nth-child(n+3){border-bottom:0}
  .site-foot .bottom{grid-template-columns:1fr;gap:10px;text-align:center}
  .site-foot .bottom .l,.site-foot .bottom .r{justify-content:center}
}
@media (max-width:560px){
  .news{grid-template-columns:1fr}
  .site-foot .top{flex-direction:column;gap:10px;text-align:center}
  .site-foot .giant .up{bottom:8px}
  .site-foot .reveal{height:360px}
  .site-foot .giant{padding:40px 0 60px}
  .site-foot .giant .word{white-space:normal;font-size:17vw;line-height:.95}
  .site-foot .kit img{padding:6px 8px}
}
@media (prefers-reduced-motion:reduce){
  *{transition-duration:1ms !important;animation-duration:1ms !important;transition-delay:0ms !important;animation-delay:0ms !important}
  .oc-js .rv,.oc-js .stag > *{transform:none}
  .site-foot .reveal img{transform:none}
}