/* Grupo Paredes — paleta inspirada en piedra laja: pizarra, óxido y liquen */
:root{
  --slate:#2b302f; --slate-2:#3d4442; --stone:#8a8d86; --mist:#e6e7e2; --paper:#f4f4f1;
  --rust:#a8622f; --rust-2:#8c4f22; --lichen:#7d8445; --ink:#1f2322;
  --display:"Bricolage Grotesque", "Arial Narrow", system-ui, sans-serif;
  --body:"Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wrap:1180px; --r:3px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;font:400 1.0625rem/1.6 var(--body);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);line-height:1.08;letter-spacing:-.01em;margin:0 0 .5em;font-weight:800}
p{margin:0 0 1em;max-width:68ch}
:focus-visible{outline:3px solid var(--rust);outline-offset:3px}
.wrap{width:min(100% - 2.5rem, var(--wrap));margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--rust);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem}

/* Botones */
.btn{display:inline-block;background:var(--rust);color:#fff;text-decoration:none;font-weight:600;padding:.85rem 1.4rem;border-radius:var(--r);border:2px solid var(--rust);transition:background .2s,border-color .2s}
.btn:hover{background:var(--rust-2);border-color:var(--rust-2)}
.btn.small{padding:.6rem 1.1rem;font-size:.95rem}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.7)}
.btn.ghost:hover{background:rgba(255,255,255,.12)}
.btn.ghost-dark{background:transparent;color:var(--slate);border-color:var(--slate)}
.btn.ghost-dark:hover{background:var(--slate);color:#fff}
.link{color:var(--rust-2);font-weight:600;text-underline-offset:4px}

/* Cabecera */
.site-header{position:sticky;top:0;z-index:50;background:var(--slate);color:#fff}
.header-inner{display:flex;align-items:center;justify-content:space-between;min-height:72px;gap:1rem}
.brand{text-decoration:none;font-family:var(--display);font-weight:800;font-size:1.35rem}
.brand img{max-height:48px;width:auto}
.nav{display:flex;align-items:center;gap:1.6rem}
.nav a,.nav button{color:#e9eae6;text-decoration:none;font:500 .98rem var(--body);background:none;border:0;cursor:pointer;padding:.4rem 0}
.nav a:hover,.nav button:hover{color:#fff}
.nav .nav-cta{border:2px solid var(--rust);padding:.45rem 1rem;border-radius:var(--r)}
.nav .nav-cta:hover{background:var(--rust)}
.has-sub{position:relative}
.sub-toggle::after{content:"";display:inline-block;margin-left:.4rem;border:5px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.sub{position:absolute;top:100%;left:-1rem;min-width:260px;background:var(--slate-2);padding:.5rem 0;display:none;box-shadow:0 12px 24px rgba(0,0,0,.25)}
.sub a{display:block;padding:.6rem 1rem}
.sub a:hover{background:rgba(255,255,255,.06)}
.has-sub:hover .sub,.has-sub.open .sub{display:block}
.nav-toggle{display:none;background:none;border:2px solid rgba(255,255,255,.5);color:#fff;font:600 .95rem var(--body);padding:.45rem .9rem;border-radius:var(--r);cursor:pointer}

/* Hero con estratos de laja */
.hero,.page-hero{position:relative;overflow:hidden;background:var(--slate);color:#fff;isolation:isolate}
.hero{min-height:min(88vh,760px);display:flex;align-items:flex-end;padding:7rem 0 5.5rem}
.hero.has-img::before,.page-hero.has-img::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,35,34,.35),rgba(31,35,34,.82)),var(--hero) center/cover;z-index:-2}
.strata{position:absolute;inset:auto 0 0 0;height:62%;z-index:-1;pointer-events:none}
.strata i{position:absolute;left:-5%;right:-5%;height:30%;opacity:.9}
.strata i:nth-child(1){bottom:58%;background:#4a504d;clip-path:polygon(0 60%,18% 40%,37% 55%,58% 30%,79% 48%,100% 22%,100% 100%,0 100%);opacity:.55}
.strata i:nth-child(2){bottom:40%;background:#6e5440;clip-path:polygon(0 45%,22% 62%,46% 38%,64% 52%,86% 30%,100% 44%,100% 100%,0 100%);opacity:.6}
.strata i:nth-child(3){bottom:24%;background:var(--rust);clip-path:polygon(0 52%,15% 36%,40% 50%,62% 28%,82% 46%,100% 34%,100% 100%,0 100%);opacity:.55}
.strata i:nth-child(4){bottom:10%;background:#5d6235;clip-path:polygon(0 38%,26% 56%,50% 34%,73% 54%,100% 40%,100% 100%,0 100%);opacity:.6}
.strata i:nth-child(5){bottom:-6%;background:var(--paper);clip-path:polygon(0 58%,20% 42%,44% 60%,68% 40%,88% 54%,100% 46%,100% 100%,0 100%)}
.hero.has-img .strata i:not(:last-child){opacity:.28}
.hero-inner{position:relative}
.hero-kicker{font:500 1.15rem var(--body);color:#d8d9d3;margin:0}
.hero h1{font-size:clamp(3.2rem,10vw,8.5rem);font-weight:800;letter-spacing:-.035em;margin:.05em 0 .25em;line-height:.92}
.hero-text{font-size:clamp(1.05rem,1.8vw,1.3rem);max-width:46ch;color:#eceee8}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
@media (prefers-reduced-motion:no-preference){
  .hero .strata i{animation:settle 1.1s cubic-bezier(.2,.7,.2,1) both}
  .hero .strata i:nth-child(2){animation-delay:.08s}.hero .strata i:nth-child(3){animation-delay:.16s}.hero .strata i:nth-child(4){animation-delay:.24s}
  @keyframes settle{from{transform:translateY(40px)}to{transform:none}}
}

/* Unidades en bandas alternadas */
.section-title{font-size:clamp(2rem,4.5vw,3.2rem)}
.units{padding:4rem 0 2rem}
.unit{padding:2.2rem 0}
.unit+.unit{border-top:1px solid #d8d9d3}
.unit-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center}
.unit.rev .unit-media{order:2}
.unit-media{aspect-ratio:4/3;background:var(--mist);overflow:hidden;border-radius:var(--r)}
.unit-media img{width:100%;height:100%;object-fit:cover}
.unit-media.empty{background:
  linear-gradient(172deg,transparent 30%,rgba(168,98,47,.35) 30% 38%,transparent 38% 55%,rgba(125,132,69,.3) 55% 61%,transparent 61%),
  linear-gradient(176deg,#d3d4ce,#b8bab2)}
.unit-brand{color:var(--rust-2);font-weight:600;margin:0 0 .3rem}
.unit-brand.light{color:#e4b58f}
.unit h3{font-size:clamp(1.8rem,3.4vw,2.6rem)}
.unit h3 a{text-decoration:none}
.unit h3 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}

/* Nosotros */
.about{background:var(--slate);color:#eceee8;padding:5rem 0}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.about h2{color:#fff;font-size:clamp(1.8rem,3vw,2.4rem)}
.about p{font-size:1.1rem}
.values{margin-top:4rem}
.values .section-title{color:#fff}
.values dl{display:grid;grid-template-columns:repeat(4,1fr);margin:1.5rem 0 0;border-top:2px solid var(--rust)}
.values dl>div{padding:1.4rem 1.4rem 0 0}
.values dt{font:800 1.3rem var(--display);color:#fff;margin-bottom:.4rem}
.values dd{margin:0;color:#c9cbc4}

/* Redes */
.social{padding:4.5rem 0}
.social-list{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:#d0d1cb;border:1px solid #d0d1cb}
.social-list a{display:block;background:var(--paper);padding:1.3rem;text-decoration:none;height:100%}
.social-list a:hover{background:#fff}
.social-list span{display:block;color:var(--stone);font-size:.92rem}
.social-list b{font-family:var(--display);font-size:1.15rem;word-break:break-all}

/* Galería */
.gallery-sec{padding:4rem 0}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1.2rem}
.gallery figure{margin:0;position:relative;overflow:hidden;aspect-ratio:1;background:var(--mist)}
.gallery img{width:100%;height:100%;object-fit:cover}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:.6rem .8rem;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;font-size:.9rem}

/* Noticias */
.news{padding:4rem 0;background:var(--mist)}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin:1.5rem 0}
.post-card a{text-decoration:none;display:block}
.post-img{aspect-ratio:16/10;background:#cfd0ca;overflow:hidden;margin-bottom:.9rem}
.post-img img{width:100%;height:100%;object-fit:cover}
.post-card time,.article time{color:var(--stone);font-size:.9rem}
.post-card h3{font-size:1.35rem;margin:.3rem 0 .4rem}
.post-card a:hover h3{color:var(--rust-2)}
.post-card p{color:#4b504e;font-size:.98rem}

/* Contacto */
.contact{padding:5rem 0;background:var(--paper)}
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.contact h2{font-size:clamp(2rem,4vw,3rem)}
.addr{line-height:1.5}
.map{margin-top:1.5rem;aspect-ratio:4/3;overflow:hidden;border-radius:var(--r)}
.map iframe{width:100%;height:100%;border:0}
.contact-form{background:#fff;padding:clamp(1.3rem,3vw,2.2rem);border-top:4px solid var(--rust)}
.contact-form label{display:block;font-weight:600;font-size:.92rem;margin-bottom:1rem}
.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;margin-top:.35rem;padding:.75rem .8rem;font:inherit;font-weight:400;border:1px solid #b9bcb4;border-radius:var(--r);background:#fff;color:var(--ink)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:2px solid var(--rust);border-color:var(--rust)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.hp{position:absolute;left:-9999px}
.notice{padding:.8rem 1rem;border-radius:var(--r);font-weight:500}
.notice.ok{background:#e4ebd8;color:#3a4a1f}
.notice.err{background:#f6e1d8;color:#7d3413}

/* Páginas internas */
.page-hero{padding:4.5rem 0 7rem}
.page-hero .strata{height:45%}
.page-hero.has-img .strata i:not(:last-child){opacity:.25}
.page-hero h1{font-size:clamp(2.6rem,7vw,5.5rem);letter-spacing:-.03em}
.lead{font-size:1.2rem;max-width:56ch;color:#e4e5e0}
.crumbs{font-size:.9rem;color:#c7c9c2;margin-bottom:1.5rem}
.crumbs a{color:#fff}
.crumbs.dark{color:var(--stone)}.crumbs.dark a{color:var(--slate)}
.page-body{display:grid;grid-template-columns:1fr 280px;gap:4rem;padding:3.5rem 0}
.page-aside{display:flex;flex-direction:column;gap:.8rem;align-items:flex-start;position:sticky;top:100px;align-self:start}
.page-section{padding:3.5rem 0 4.5rem}
.narrow{max-width:720px}
.prose{font-size:1.08rem}
.prose h2{font-size:1.8rem;margin-top:1.6em}
.prose h3{font-size:1.35rem;margin-top:1.4em}
.prose ul,.prose ol{padding-left:1.2rem;max-width:66ch}
.prose li{margin-bottom:.4rem}
.prose img{margin:1.5rem 0;border-radius:var(--r)}
.prose a{color:var(--rust-2)}
.article{max-width:780px;padding:3rem 0 4rem}
.article h1{font-size:clamp(2.2rem,5vw,3.6rem);margin-top:.3rem}
.article-img{margin:1.5rem 0 2rem;width:100%;border-radius:var(--r)}
.pager{display:flex;gap:.4rem;margin-top:2rem}
.pager a{padding:.5rem .9rem;border:1px solid #c5c7c0;text-decoration:none;border-radius:var(--r)}
.pager a[aria-current]{background:var(--slate);color:#fff;border-color:var(--slate)}

/* Pie */
.site-footer{background:var(--ink);color:#bfc1ba;padding:4rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.footer-name{font:800 1.8rem var(--display);color:#fff;margin:0}
.footer-slogan{color:#e4b58f}
.site-footer h2{font:600 1rem var(--body);color:#fff;margin-bottom:.8rem}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.5rem}
.site-footer a{text-decoration:none}.site-footer a:hover{color:#fff;text-decoration:underline}
.footer-bottom{border-top:1px solid #343938;margin-top:3rem;padding-top:1.2rem;font-size:.88rem}
.wa-float{position:fixed;right:1.2rem;bottom:1.2rem;width:58px;height:58px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.25);z-index:60}

/* Responsive */
@media (max-width:960px){
  .nav-toggle{display:block}
  .nav{position:absolute;top:72px;left:0;right:0;background:var(--slate);flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1.25rem;display:none}
  .nav.open{display:flex}
  .nav a,.nav button{padding:.8rem 0;text-align:left;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav .nav-cta{margin-top:.8rem;text-align:center}
  .sub{position:static;box-shadow:none;background:transparent;padding:0 0 0 1rem;min-width:0}
  .has-sub:hover .sub{display:none}.has-sub.open .sub{display:block}
  .unit-inner,.about-grid,.contact-grid,.page-body{grid-template-columns:1fr}
  .unit.rev .unit-media{order:0}
  .values dl{grid-template-columns:1fr 1fr}
  .post-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .page-aside{position:static}
}
@media (max-width:600px){
  .values dl,.post-grid,.footer-grid,.row2{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .hero{padding:5rem 0 4.5rem}
}
