/*
Theme Name: Pampa Properties
Theme URI: https://www.pampaproperties.es
Author: Pampa Properties
Description: Tema a medida para Pampa Properties — compra, reforma y venta de inmuebles.
Version: 1.8
Text Domain: pampa-properties
*/

:root{
  --bg:#F5F2EA; --bg-soft:#EDE8DB; --ink:#211D18; --ink-soft:#5C574C;
  --brass:#8B8A6B; --sage:#A8A887; --line:#D8D0BC; --card:#FBF9F3;
}
*{margin:0; padding:0; box-sizing:border-box;}
html,body{height:100%;}
body{
  background:var(--bg); color:var(--ink);
  font-family:'Archivo',system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased; line-height:1.55; overflow-x:hidden;
}
h1,h2,h3{font-family:'Fraunces',Georgia,serif; font-weight:500; line-height:1.1; letter-spacing:-0.01em;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1080px; margin:0 auto; padding:0 24px;}

/* aparición suave de textos e imágenes al hacer scroll */
.reveal{
  opacity:0; transform:translateY(22px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}
.reveal.in-view{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
}

/* header */
header.site-header{
  position:sticky; top:0; z-index:20;
  background:rgba(245,242,234,0.9); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:18px 24px;}
.brand{display:flex; align-items:center;}
.brand img{height:34px; width:auto;}
.nav-right{display:flex; align-items:center; gap:28px;}
.main-nav ul{display:flex; gap:28px; list-style:none; font-size:0.92rem; color:var(--ink-soft);}
.main-nav a:hover{color:var(--brass);}
.header-icons{display:flex; align-items:center; gap:8px;}
.icon-badge{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%; border:1px solid var(--line);
  color:var(--ink-soft); flex-shrink:0;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.icon-badge svg{width:16px; height:16px;}
.icon-badge:hover{background:var(--ink); color:var(--bg); border-color:var(--ink);}
.btn{
  display:inline-block; padding:11px 22px; border-radius:2px; font-size:0.9rem;
  background:var(--ink); color:var(--bg); border:1px solid var(--ink);
  transition:background .2s ease, color .2s ease;
}
.btn:hover{background:transparent; color:var(--ink);}
.btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--line);}
.btn-ghost:hover{border-color:var(--brass); color:var(--brass);}
@media (max-width:720px){
  .main-nav{display:none;}
  .nav-right{gap:14px;}
  .header-icons{gap:6px;}
  .icon-badge{width:30px; height:30px;}
}
@media (max-width:420px){ .btn{display:none;} }

/* hero */
.hero{position:relative; padding:110px 0 88px; overflow:hidden;}
.hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, var(--bg) 42%, rgba(245,242,234,0.55) 78%, rgba(245,242,234,0.15)), var(--hero-img) center/cover no-repeat;
}
.hero .wrap{position:relative; z-index:1;}
.hero h1{font-size:clamp(2.1rem,5vw,3.3rem); max-width:16ch;}
.hero p.lede{margin-top:22px; font-size:1.08rem; color:var(--ink-soft); max-width:46ch;}
.hero-cta{margin-top:32px; display:flex; gap:14px; flex-wrap:wrap;}
@media (max-width:780px){ .hero::before{background:linear-gradient(180deg, var(--bg) 55%, rgba(245,242,234,0.6) 85%), var(--hero-img) center/cover no-repeat;} }

/* servicios / cards */
.section{padding:76px 0;}
.section.soft{background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.eyebrow{font-size:0.85rem; color:var(--brass);}
.section h2{font-size:clamp(1.7rem,3.5vw,2.3rem); margin-top:10px; max-width:24ch;}
.section .intro{margin-top:16px; color:var(--ink-soft); max-width:60ch;}
.card-grid{margin-top:44px; display:grid; grid-template-columns:repeat(3,1fr); gap:0;}
@media (max-width:780px){ .card-grid{grid-template-columns:1fr;} }
.card{padding:0 26px 28px; border-left:1px solid var(--line);}
.card:first-child{border-left:none;}
@media (max-width:780px){ .card{border-left:none; border-top:1px solid var(--line); padding:0 0 28px;} .card:first-child{border-top:none;} }
.card img{width:100%; height:170px; object-fit:cover; margin-bottom:20px;}
.card h3{font-size:1.2rem; padding:0 26px;}
.card p{margin-top:10px; color:var(--ink-soft); font-size:0.94rem; padding:0 26px;}
@media (max-width:780px){ .card h3, .card p{padding:0;} }

/* propuesta de valor (checks) */
.value-points{padding:56px 0 12px;}
.value-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; text-align:center;}
@media (max-width:780px){ .value-grid{grid-template-columns:1fr; gap:24px;} }
.value-item{
  padding:36px 24px 30px; border-radius:10px;
  background:var(--card); border:1px solid var(--line);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.value-item:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 32px -18px rgba(33,29,24,0.28);
  border-color:#1FA468;
}
.check-badge{
  display:inline-flex; align-items:center; justify-content:center;
  position:relative;
  width:72px; height:72px; border-radius:50%;
  background:linear-gradient(145deg, #2ECE84, #1A9A5D);
  color:#fff; margin-bottom:20px;
  box-shadow:0 10px 24px -6px rgba(26,154,93,0.55);
  animation:check-pulse 2.6s ease-in-out infinite;
}
.value-item:nth-child(2) .check-badge{ animation-delay:.3s; }
.value-item:nth-child(3) .check-badge{ animation-delay:.6s; }
.check-badge::after{
  content:""; position:absolute; inset:-6px; border-radius:50%;
  border:2px solid rgba(46,206,132,0.45);
  animation:check-ring 2.6s ease-out infinite;
}
.value-item:nth-child(2) .check-badge::after{ animation-delay:.3s; }
.value-item:nth-child(3) .check-badge::after{ animation-delay:.6s; }
.check-badge svg{width:32px; height:32px; stroke-width:3;}
@keyframes check-pulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.07); }
}
@keyframes check-ring{
  0%{ opacity:.9; transform:scale(0.92); }
  70%{ opacity:0; transform:scale(1.22); }
  100%{ opacity:0; transform:scale(1.22); }
}
@media (prefers-reduced-motion: reduce){
  .check-badge, .check-badge::after{ animation:none; }
}
.value-item p{color:var(--ink-soft); font-size:1rem; max-width:30ch; margin:0 auto;}

/* quienes somos */
.about-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:48px; align-items:center;}
.about-img img{width:100%; height:100%; object-fit:cover; border-radius:2px;}
@media (max-width:780px){
  .about-grid{grid-template-columns:1fr;}
  .about-img{order:-1;}
}
.about p{font-size:1.05rem; color:var(--ink-soft); max-width:70ch;}
.about strong{color:var(--ink);}

/* contacto / cta */
.cta-box{
  background:var(--ink); color:var(--bg); border-radius:4px; padding:56px 44px;
  display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;
}
@media (max-width:860px){ .cta-box{grid-template-columns:1fr; padding:40px 26px;} }
.cta-box h2{color:var(--bg);}
.cta-box p{margin-top:14px; color:rgba(245,242,234,0.7); max-width:38ch;}
.contact-list{display:flex; flex-direction:column; gap:12px; font-size:0.98rem;}
.contact-list a:hover{color:var(--sage);}
.contact-list .hours{margin-top:10px; padding-top:14px; border-top:1px solid rgba(245,242,234,0.2); font-size:0.9rem; color:rgba(245,242,234,0.7);}
.contact-list .hours strong{display:block; color:var(--bg); font-weight:600; margin-bottom:4px;}
.cta-box .btn{background:var(--brass); border-color:var(--brass); color:var(--ink); align-self:flex-start;}
.cta-box .btn:hover{background:transparent; color:var(--bg);}

footer.site-footer{padding:36px 0; border-top:1px solid var(--line);}
.foot-row{display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:0.85rem; color:var(--ink-soft);}
.foot-legal{display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); font-size:0.8rem; color:var(--ink-soft);}
.foot-legal a:hover{color:var(--brass);}

/* Nuestras creaciones — grid */
.creaciones-title{font-size:clamp(1.8rem,4vw,2.6rem); margin-top:10px; max-width:22ch;}
.creaciones-grid{margin-top:44px; display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
@media (max-width:860px){ .creaciones-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .creaciones-grid{grid-template-columns:1fr;} }
.creacion-card{display:block;}
.creacion-thumb{aspect-ratio:4/3; overflow:hidden; background:var(--bg-soft); border:1px solid var(--line);}
.creacion-thumb img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease;}
.creacion-card:hover .creacion-thumb img{transform:scale(1.04);}
.creacion-thumb-placeholder{width:100%; height:100%;}
.creacion-card h3{margin-top:14px; font-size:1.05rem;}

/* Nuestras creaciones — página individual */
.creacion-single h1{font-size:clamp(1.9rem,4vw,2.6rem); margin-top:8px; max-width:22ch;}
.creacion-hero-img{margin-top:32px; border:1px solid var(--line);}
.creacion-hero-img img{width:100%; height:auto; display:block;}
.creacion-content{margin-top:28px; max-width:70ch; color:var(--ink-soft); font-size:1.02rem;}

/* generic page content (Servicios detail / Contacto page template) */
.page-content{padding:80px 0; max-width:760px;}
.page-content h1{font-size:2.2rem; margin-bottom:24px;}
.page-content p{color:var(--ink-soft); margin-bottom:16px;}
