/*
 * Landing Page Sections
 * 
 * @package Viva_Magenta_V1
 */

/* Section Visibility Helper */
.hero-section,
.manifesto-section,
.services-section,
.portfolio-section,
.testimonials-section,
.blog-section,
.final-cta-section {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

/* Legal Pages */
.legal-page { padding: var(--section-padding) 0 4rem; background: var(--background-gray); }
.legal-container { max-width: 980px; }
.legal-header { margin-bottom: 2.25rem; }
.legal-title { font-size: 2.2rem; margin-bottom: 1.25rem; position:relative; }
.legal-title:after { content:""; position:absolute; left:0; bottom:-10px; width:72px; height:4px; background:var(--primary-color); border-radius:2px; }
.legal-toc { background:#fff; border:1px solid var(--border-color); border-radius:12px; padding:1.2rem 1.4rem 1.4rem; box-shadow: var(--shadow-light); font-size:.9rem; line-height:1.4; }
.legal-toc .toc-heading { display:block; font-weight:600; font-size:.85rem; letter-spacing:.7px; text-transform:uppercase; margin:0 0 .65rem; color:var(--text-dark); }
.toc-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.35rem; max-height:320px; overflow:auto; }
.toc-item a { text-decoration:none; color:var(--primary-dark); position:relative; padding:.25rem .35rem; border-radius:6px; display:inline-block; }
.toc-item a:hover { background:rgba(214,51,132,.08); color:var(--primary-color); }
.toc-h3 a { padding-left:1.1rem; font-size:.82rem; }
.legal-content { background:#fff; border:1px solid var(--border-color); border-radius:16px; padding:2.25rem 2.2rem; box-shadow: var(--shadow-light); }
.legal-content p { line-height:1.7; margin:0 0 1.15rem; font-size:1rem; }
.legal-content h2, .legal-content h3 { scroll-margin-top:120px; }
.legal-content h2 { font-size:1.6rem; margin:2.4rem 0 1rem; font-weight:600; }
.legal-content h3 { font-size:1.25rem; margin:1.8rem 0 .75rem; font-weight:600; }
.legal-content ul, .legal-content ol { margin:0 0 1.25rem 1.4rem; padding:0; }
/* Mostrar viñetas y numeración en listas legales (el reset global las ocultaba) */
.legal-content ul { list-style:disc outside; padding-left:1.2rem; }
.legal-content ol { list-style:decimal outside; padding-left:1.2rem; }
.legal-content ul ul { list-style:circle outside; margin-top:.4rem; }
.legal-content ul ul ul { list-style:square outside; }
.legal-content li { margin:.4rem 0; line-height:1.55; }
.legal-content a { color:var(--primary-color); text-decoration:underline; }
.legal-content a:hover { color:var(--primary-dark); }
.legal-footer { margin-top:2.5rem; margin-bottom:3rem; font-size:.8rem; text-align:right; opacity:.75; }
@media (max-width: 780px){
  .legal-content { padding:1.8rem 1.4rem; }
  .legal-title { font-size:1.9rem; }
  .legal-toc { font-size:.85rem; }
  .legal-content h2 { font-size:1.4rem; }
  .legal-content h3 { font-size:1.15rem; }
}

.section-hidden {
  display: none !important;
}

/* Manifesto Section */
.manifesto-section {
  padding: var(--section-padding);
  background-color: var(--background-gray);
}

.manifesto-content {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 4rem;
  align-items: center;
}

.manifesto-description {
  font-size: 1.1rem;
  color: var(--text-light);
  margin-bottom: 1.5rem;
  line-height: 1.7;
}

.founder-photo {
  text-align: center;
}

.founder-image {
  width: 250px;
  height: 250px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 1rem;
  box-shadow: var(--shadow-medium);
}

.founder-name {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--text-dark);
}

.founder-name span {
  font-size: 1rem;
  color: var(--text-light);
  font-weight: 400;
}

/* Services Section */
.services-section {
  padding: var(--section-padding);
}

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

/* Portfolio Section */
/* Portfolio Section (revamped) */
.portfolio-section { padding: var(--section-padding); background:linear-gradient(140deg,var(--background-gray) 0%, #ffffff 100%); position:relative; }
.portfolio-section:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 70% 20%, rgba(214,51,132,.10), transparent 60%); pointer-events:none; }
.portfolio-gallery { --cols:4; display:grid; grid-template-columns:repeat(var(--cols),1fr); gap:1.15rem; margin-bottom:2.75rem; }
@media (max-width: 1100px){ .portfolio-gallery { --cols:3; } }
@media (max-width: 820px){ .portfolio-gallery { --cols:2; } }
@media (max-width: 520px){ .portfolio-gallery { --cols:1; } }
.gallery-item { position:relative; border-radius:20px; overflow:hidden; aspect-ratio: 4 / 5; background:#f2f2f2; display:flex; align-items:center; justify-content:center; isolation:isolate; box-shadow:0 8px 20px -8px rgba(0,0,0,.25),0 2px 6px -2px rgba(0,0,0,.15); }
.gallery-item.wide { grid-column:span 2; aspect-ratio: 16 / 9; }
.gallery-item.tall { aspect-ratio: 3 / 5; }
@media (max-width: 820px){ .gallery-item.wide { grid-column:span 1; aspect-ratio:4/5; } }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition: transform .9s cubic-bezier(.22,.61,.36,1), filter .6s ease; }
.gallery-item:after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.58),rgba(0,0,0,.18)); opacity:.55; transition:opacity .5s ease; }
.gallery-item:hover img { transform:scale(1.08); filter:brightness(.92) saturate(1.1); }
.gallery-item:hover:after { opacity:.78; }
/* Meta con fondo degradado propio para asegurar legibilidad en imágenes claras */
.gallery-meta { position:absolute; inset:auto 0 0 0; padding:1rem 1.1rem 1.15rem; color:#fff; z-index:2; display:flex; flex-direction:column; gap:.35rem; font-size:.78rem; letter-spacing:.3px; background:linear-gradient(to top,rgba(0,0,0,.65) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,0) 100%); backdrop-filter:blur(2px); }
.gallery-meta .g-title, .gallery-meta .g-tagline { text-shadow:0 2px 6px rgba(0,0,0,.35); }
.gallery-meta .g-title { font-size:.95rem; font-weight:600; line-height:1.15; }
.gallery-meta .g-tagline { opacity:.82; font-size:.7rem; text-transform:uppercase; letter-spacing:.85px; }
.portfolio-section .section-title { margin-bottom:2.25rem; }
.portfolio-cta { text-align:center; }

/* Testimonials Section */
.testimonials-section {
  padding: var(--section-padding);
}

.testimonials-slider {
  position: relative;
  max-width: 800px;
  margin: 0 auto 2rem;
}

.testimonials-nav {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
}

.nav-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--border-color);
  border: none;
  cursor: pointer;
  transition: var(--transition);
}

.nav-dot.active {
  background-color: var(--primary-color);
}

/* Blog Section */
.blog-section {
  padding: var(--section-padding);
  background-color: var(--background-gray);
}

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

/* Final CTA Section */
.final-cta-section {
  padding: var(--section-padding);
  background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
  color: var(--text-white);
  text-align: center;
}

/* Bodas Page Alternating Backgrounds */
/* (moved to _bodas-page.css) */

/* --- Portfolio Archive Additions (extract later to separate file) --- */
.portfolio-hero { padding:120px 0 70px; text-align:center; background:var(--background-light); }
.portfolio-hero .portfolio-title { font-size:2.8rem; margin-bottom:1rem; }
.portfolio-description { max-width:760px; margin:0 auto; }
.portfolio-filters-wrapper { position:sticky; top:70px; z-index:5; background:var(--background-light); border-bottom:1px solid var(--background-gray-dark,#eceff1); }
.filters-bar { display:flex; flex-wrap:wrap; gap:1.25rem; padding:18px 0; }
.filter-group { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.filter-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-light); font-weight:600; }
.filter-chip { display:inline-block; padding:6px 14px; background:#f3f4f6; border-radius:999px; font-size:.75rem; font-weight:500; color:#374151; transition:.25s; }
.filter-chip:hover { background:#e5e7eb; color:var(--primary-color); }
.filter-chip.active { background:var(--primary-color); color:#fff; }
.portfolio-masonry { column-count:4; column-gap:14px; }
@media (max-width:1200px){ .portfolio-masonry { column-count:3; } }
@media (max-width:900px){ .portfolio-masonry { column-count:2; } }
@media (max-width:560px){ .portfolio-masonry { column-count:1; } }
.portfolio-item { break-inside:avoid; margin:0 0 14px; position:relative; overflow:hidden; border-radius:12px; box-shadow:var(--shadow-light); background:var(--background-light); }
.portfolio-item .media-wrapper { position:relative; }
.portfolio-item img.portfolio-thumb { width:100%; height:auto; display:block; object-fit:cover; transition:transform .6s ease; }
.portfolio-item:hover img.portfolio-thumb { transform:scale(1.05); }
.portfolio-caption { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.0) 35%, rgba(0,0,0,.65) 100%); color:#fff; display:flex; flex-direction:column; justify-content:flex-end; padding:18px 16px 14px; opacity:0; transition:opacity .4s; }
.portfolio-item:hover .portfolio-caption { opacity:1; }
.portfolio-item-title { font-size:1rem; margin:0 0 4px; }
.portfolio-item-meta { font-size:.65rem; opacity:.85; margin:0; letter-spacing:.05em; }
.portfolio-pagination { text-align:center; margin:50px 0 30px; }
.portfolio-pagination .page-numbers { display:inline-block; margin:0 4px; padding:8px 12px; background:#f3f4f6; border-radius:6px; font-size:.75rem; }
.portfolio-pagination .current { background:var(--primary-color); color:#fff; }