/* ============================================================
   RIWAYA SOLUTIONS — Design System
   Editorial premium · Turismo & Gastronomía Empresarial
   ============================================================ */

:root{
  /* Colors — sampled from brand mark */
  --gold:        #C2A26B;
  --gold-deep:   #9C7C48;
  --gold-pale:   #E7D9BC;
  --ink:         #211C16;
  --ink-soft:    #4A4238;
  --cream:       #FBF6EE;
  --cream-deep:  #F1E8D8;
  --white:       #FFFFFF;
  --teal:        #2C5850;
  --teal-deep:   #1D3D37;

  --font-display: "Fraunces", "Times New Roman", serif;
  --font-body: "Manrope", -apple-system, BlinkMacSystemFont, sans-serif;

  --space-3xs: .25rem;
  --space-xs:  .5rem;
  --space-sm:  1rem;
  --space-md:  1.75rem;
  --space-lg:  3rem;
  --space-xl:  5.5rem;
  --space-2xl: 9rem;

  --ease: cubic-bezier(.22,1,.36,1);
  --dur-fast: .35s;
  --dur-med: .7s;
  --dur-slow: 1.1s;

  --container: 1240px;
  --header-h: 92px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--ink);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font:inherit; background:none; border:none; cursor:pointer; color:inherit; }
input, textarea{ font:inherit; }
::selection{ background: var(--gold); color: var(--white); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- Preloader ---------- */
.preloader{
  position:fixed; inset:0; z-index:9999;
  background: var(--ink);
  display:flex; align-items:center; justify-content:center;
  transition: opacity .6s var(--ease), visibility .6s var(--ease);
}
.preloader-logo{ width:120px; filter: brightness(0) invert(1); opacity:.9; animation: pulse-logo 1.4s ease-in-out infinite; }
.preloader.is-hidden{ opacity:0; visibility:hidden; pointer-events:none; }
@keyframes pulse-logo{ 0%,100%{ opacity:.55; transform:scale(.96);} 50%{ opacity:1; transform:scale(1);} }

/* ---------- Scroll progress ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; height:3px; width:0%;
  background: linear-gradient(90deg, var(--gold), var(--teal));
  z-index:1001; transition: width .1s linear;
}

/* ============================================================
   HEADER — logo + Nosotros / Servicios / Contacto only
   ============================================================ */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:900;
  padding: 22px 0;
  transition: background var(--dur-fast) var(--ease), padding var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
  border-bottom: 1px solid transparent;
}
.site-header.is-scrolled{
  background: rgba(251,246,238,.88);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  padding: 14px 0;
  border-color: rgba(33,28,22,.08);
  box-shadow: 0 12px 30px -20px rgba(33,28,22,.35);
}
.header-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
  display:flex; align-items:center; justify-content:space-between;
}
.brand{ display:inline-flex; align-items:center; }
.brand-logo{
  height:54px; width:auto;
  transition: height var(--dur-fast) var(--ease), filter var(--dur-fast) var(--ease);
}
.site-header.is-scrolled .brand-logo{ height:44px; }
.site-header:not(.is-scrolled) .brand-logo{ filter: drop-shadow(0 2px 14px rgba(0,0,0,.25)); }

.main-nav ul{ display:flex; align-items:center; gap: 2.6rem; }
.nav-link{
  position:relative; font-family: var(--font-body); font-weight:600;
  font-size:.92rem; letter-spacing:.04em; text-transform:uppercase;
  color: var(--ink); padding: 6px 2px;
}
.site-header:not(.is-scrolled) .nav-link{ color:#fff; text-shadow:0 1px 10px rgba(0,0,0,.25); }
.nav-link span{ position:relative; display:inline-block; }
.nav-link span::after{
  content:''; position:absolute; left:0; right:0; bottom:-6px; height:1.5px;
  background: currentColor; transform: scaleX(0); transform-origin:right;
  transition: transform var(--dur-fast) var(--ease);
}
.nav-link:hover span::after,
.nav-link:focus-visible span::after{ transform: scaleX(1); transform-origin:left; }

.nav-link--cta{
  border: 1px solid currentColor; border-radius: 999px; padding: 10px 22px;
}
.nav-link--cta span::after{ display:none; }
.nav-link--cta:hover{ background: var(--ink); color:#fff !important; border-color: var(--ink); }
.site-header:not(.is-scrolled) .nav-link--cta:hover{ background:#fff; color: var(--ink) !important; border-color:#fff; }

.menu-toggle{ display:none; flex-direction:column; gap:6px; width:34px; z-index:1200; }
.menu-toggle span{ height:2px; width:100%; background: var(--ink); transition: transform .35s var(--ease), opacity .35s var(--ease), background .3s; }
.site-header:not(.is-scrolled) .menu-toggle span{ background:#fff; }
.menu-toggle.is-active span{ background: var(--ink) !important; }
.menu-toggle.is-active span:nth-child(1){ transform: translateY(8px) rotate(45deg); }
.menu-toggle.is-active span:nth-child(2){ opacity:0; }
.menu-toggle.is-active span:nth-child(3){ transform: translateY(-8px) rotate(-45deg); }

/* ---------- Mobile nav ---------- */
.mobile-nav{
  position:fixed; inset:0; z-index:1100;
  background: var(--ink); color:#fff;
  clip-path: circle(0% at calc(100% - 40px) 40px);
  transition: clip-path .7s var(--ease);
  display:flex; align-items:center; justify-content:center;
}
.mobile-nav.is-open{ clip-path: circle(150% at calc(100% - 40px) 40px); }
.mobile-nav-inner{ text-align:center; padding: 32px; }
.mobile-nav-logo{ height:52px; margin:0 auto 3rem; filter:brightness(0) invert(1); }
.mobile-nav-link{
  display:flex; align-items:baseline; justify-content:center; gap:14px;
  font-family: var(--font-display); font-size: clamp(2.2rem,7vw,3.2rem); font-weight:400;
  padding: 14px 0; color:#fff; opacity:.55;
  transition: opacity .3s var(--ease), letter-spacing .3s var(--ease);
}
.mobile-nav-link .idx{ font-family: var(--font-body); font-size:.9rem; color: var(--gold); letter-spacing:.1em; }
.mobile-nav-link:hover{ opacity:1; letter-spacing:.01em; }
.mobile-nav-foot{ margin-top: 3rem; font-size:.9rem; color: var(--gold-pale); }
.mobile-nav-foot a{ text-decoration:underline; text-underline-offset:4px; }

/* ============================================================
   HERO SLIDER
   ============================================================ */
.hero{
  position:relative; height:100svh; min-height:640px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  background: var(--ink);
}
.hero-slides{ position:absolute; inset:0; }
.hero-slide{
  position:absolute; inset:0; opacity:0; visibility:hidden;
  transition: opacity 1.4s var(--ease), visibility 1.4s var(--ease);
}
.hero-slide.is-active{ opacity:1; visibility:visible; z-index:2; }
.hero-media{
  position:absolute; inset:0; background-size:cover; background-position:center;
  transform: scale(1.12); transition: transform 7s linear;
}
.hero-slide.is-active .hero-media{ transform: scale(1); }
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(20,16,11,.92) 0%, rgba(20,16,11,.55) 42%, rgba(20,16,11,.35) 65%, rgba(20,16,11,.6) 100%);
}

.hero-motif{ position:absolute; top: calc(var(--header-h) + 18px); left:40px; display:flex; gap:9px; z-index:3; }
.hero-motif span{ width:7px; height:7px; border-radius:50%; background: var(--gold); opacity:.8; }
.hero-motif span:nth-child(2){ opacity:.6; } .hero-motif span:nth-child(3){ opacity:.4; } .hero-motif span:nth-child(4){ opacity:.25; }

.hero-content{
  position:relative; z-index:4;
  max-width: var(--container); width:100%; margin: 0 auto;
  padding: 0 32px 6.5rem;
}
.hero-panels{ position:relative; min-height: 300px; }
.hero-panel{
  position:absolute; inset:0 auto auto 0; width:100%;
  opacity:0; visibility:hidden; pointer-events:none;
  transition: opacity .6s var(--ease);
}
.hero-panel.is-active{ position:relative; opacity:1; visibility:visible; pointer-events:auto; }

.hero-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  color: var(--gold-pale); font-size:.85rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600;
  margin-bottom: 1.4rem;
  opacity:0; transform: translateY(14px);
}
.hero-eyebrow i{ width:26px; height:1.5px; background: var(--gold); display:inline-block; }
.hero-panel.is-active .hero-eyebrow{ animation: rise .8s var(--ease) .15s forwards; }

.hero-title{
  font-family: var(--font-display); font-weight:400; color:#fff;
  font-size: clamp(2.4rem, 5.4vw, 4.6rem); line-height:1.06; letter-spacing:-.01em;
  max-width: 15ch;
  opacity:0; transform: translateY(24px);
}
.hero-title em{ font-style:italic; color: var(--gold-pale); font-weight:300; }
.hero-panel.is-active .hero-title{ animation: rise 1s var(--ease) .3s forwards; }

.hero-desc{
  color: rgba(255,255,255,.78); font-size: 1.08rem; max-width:46ch; margin-top:1.6rem;
  opacity:0; transform: translateY(18px);
}
.hero-panel.is-active .hero-desc{ animation: rise .9s var(--ease) .48s forwards; }

.hero-actions{ display:flex; gap:1rem; flex-wrap:wrap; margin-top: 2.4rem;
  opacity:0; transform: translateY(18px); }
.hero-panel.is-active .hero-actions{ animation: rise .9s var(--ease) .62s forwards; }

@keyframes rise{ to{ opacity:1; transform:none; } }

/* Buttons */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  padding: 15px 30px; border-radius: 999px; font-size:.92rem; font-weight:700;
  letter-spacing:.03em; overflow:hidden; isolation:isolate;
}
.btn span{ position:relative; z-index:2; transition: color .4s var(--ease); }
.btn--primary{ background: var(--gold); color: var(--ink); }
.btn--primary::before{
  content:''; position:absolute; inset:0; background: var(--ink); z-index:1;
  transform: translateY(102%); transition: transform .45s var(--ease);
}
.btn--primary:hover::before{ transform: translateY(0); }
.btn--primary:hover span{ color: var(--gold-pale); }

.btn--ghost{ border:1.5px solid rgba(255,255,255,.55); color:#fff; }
.btn--ghost:hover{ background:#fff; color: var(--ink); border-color:#fff; }
.btn--ghost.btn--light{ border-color: rgba(33,28,22,.3); color: var(--ink); }
.btn--ghost.btn--light:hover{ background: var(--ink); color:#fff; border-color:var(--ink); }
.btn--block{ width:100%; }

/* Hero footer bar: dots / arrows / scroll cue */
.hero-footer{
  position:relative; z-index:5;
  max-width: var(--container); margin: 0 auto; width:100%;
  padding: 0 32px 2.6rem;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
}
.hero-dots{ display:flex; gap:10px; }
.hero-dot{ width:34px; height:3px; background: rgba(255,255,255,.3); position:relative; overflow:hidden; }
.hero-dot i{ position:absolute; inset:0; background: var(--gold); transform: scaleX(0); transform-origin:left; }
.hero-dot.is-active i{ animation: dot-progress 6s linear forwards; }
@keyframes dot-progress{ to{ transform: scaleX(1); } }

.hero-arrows{ display:flex; align-items:center; gap:1.1rem; color:#fff; }
.hero-arrow{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center; transition: background .3s, border-color .3s, transform .3s; }
.hero-arrow:hover{ background:#fff; color:var(--ink); border-color:#fff; transform: translateY(-2px); }
.hero-count{ font-size:.82rem; letter-spacing:.08em; color: rgba(255,255,255,.65); }
.hero-count em{ font-style:normal; color:#fff; }

.hero-scroll{ display:flex; align-items:center; gap:.7rem; color:#fff; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; }
.hero-scroll-line{ width:1px; height:34px; background: rgba(255,255,255,.35); position:relative; overflow:hidden; }
.hero-scroll-line::after{ content:''; position:absolute; top:-100%; left:0; right:0; height:100%; background:#fff; animation: scroll-cue 2.2s ease-in-out infinite; }
@keyframes scroll-cue{ 0%{ top:-100%; } 60%{ top:100%; } 100%{ top:100%; } }

@media (max-width: 760px){
  .hero-footer{ flex-wrap:wrap; }
  .hero-scroll{ display:none; }
}

/* ============================================================
   MARQUEE
   ============================================================ */
.marquee{
  background: var(--ink); color: var(--gold-pale);
  padding: 1.15rem 0; overflow:hidden; white-space:nowrap;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.marquee-track{ display:inline-flex; align-items:center; gap: 1.2rem; animation: marquee 32s linear infinite; }
.marquee-track span{ font-family: var(--font-display); font-style:italic; font-size:1.05rem; }
.marquee-track .dot{ font-family:var(--font-body); font-style:normal; color: var(--gold); font-size:.6rem; }
@keyframes marquee{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee-track{ animation: none; } }

/* ============================================================
   SHARED SECTION STYLES
   ============================================================ */
.section{ position:relative; padding: var(--space-2xl) 0; overflow:clip; }
.section-inner{ max-width: var(--container); margin:0 auto; padding: 0 32px; }
.section-eyebrow{
  font-size:.82rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700;
  color: var(--gold-deep); margin-bottom: 1.1rem; display:flex; align-items:center; gap:10px;
}
.section-eyebrow::before{ content:''; width:22px; height:1.5px; background: var(--gold-deep); }
.section-title{
  font-family: var(--font-display); font-weight:400; letter-spacing:-.01em;
  font-size: clamp(2rem, 3.6vw, 3.1rem); line-height:1.14; max-width: 18ch;
}
.section-title--sm{ font-size: clamp(1.7rem, 2.6vw, 2.3rem); max-width:22ch; }
.section-title em{ font-style:italic; color: var(--gold-deep); font-weight:300; }
.lede{ font-size:1.08rem; color: var(--ink-soft); max-width: 52ch; margin-top:1.4rem; }

.reveal-up{ opacity:0; transform: translateY(38px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--delay, 0ms); }
.reveal-up.is-visible{ opacity:1; transform:none; }

/* ============================================================
   NOSOTROS
   ============================================================ */
.nosotros-grid{ display:grid; grid-template-columns: 1.05fr .95fr; gap: 5rem; align-items:start; }
.nosotros-copy p{ margin-top: 1.2rem; color: var(--ink-soft); }
.nosotros-copy p:first-of-type{ margin-top:0; }
.badge-row{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top: 2rem; }
.badge{
  font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  border:1px solid var(--gold-deep); color: var(--gold-deep); border-radius:999px; padding:8px 18px;
}

.nosotros-visual{ position:relative; }
.nosotros-image{
  aspect-ratio: 4/5; border-radius: 6px 60px 6px 6px; background-size:cover; background-position:center;
  box-shadow: 0 40px 60px -30px rgba(33,28,22,.4);
}
.nosotros-quote{
  background: var(--ink); color:#fff; padding: 2rem; border-radius: 6px;
  max-width: 320px; margin: -3.2rem 0 0 -1.6rem; position:relative; z-index:2;
  box-shadow: 0 30px 50px -25px rgba(0,0,0,.5);
}
.nosotros-quote p{ font-family: var(--font-display); font-style:italic; font-size:1.05rem; line-height:1.5; }
.nosotros-quote span{ display:block; margin-top:1rem; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color: var(--gold-pale); }

.motif-swirl{
  position:absolute; top:-40px; right:-40px; width:130px; height:130px; z-index:-1;
  border: 1.5px solid var(--gold); border-radius: 50% 50% 50% 0%;
  opacity:.5;
}

/* Mission / Vision */
.mv-grid{ display:grid; grid-template-columns:1fr 1fr; gap: 2px; margin-top: var(--space-2xl); background: var(--gold-pale); border-radius: 8px; overflow:hidden; }
.mv-card{ background: var(--cream-deep); padding: 2.6rem; }
.mv-index{ font-family: var(--font-display); font-style:italic; color: var(--gold-deep); font-size:1.6rem; }
.mv-card h3{ font-family: var(--font-display); font-weight:400; font-size:1.7rem; margin: .6rem 0 1rem; }
.mv-card p{ color: var(--ink-soft); }

/* Valores */
.valores{ margin-top: var(--space-2xl); }
.valores-list{ margin-top: 2rem; border-top:1px solid rgba(33,28,22,.14); }
.valor-item{
  display:flex; align-items:center; gap: 2rem; width:100%; text-align:left;
  padding: 1.5rem 0; border-bottom:1px solid rgba(33,28,22,.14);
  transition: padding .4s var(--ease);
}
.valor-num{ font-family: var(--font-display); font-style:italic; color: var(--gold-deep); font-size:1.1rem; width:2.4rem; flex-shrink:0; }
.valor-name{
  font-family: var(--font-display); font-size: clamp(1.3rem,2.6vw,2rem); font-weight:400; flex-shrink:0;
  width: 40%; transition: color .3s var(--ease);
}
.valor-desc{ color: var(--ink-soft); max-width: 46ch; opacity:.75; transition: opacity .3s var(--ease); }
.valor-item.is-active{ padding: 2.1rem 0; }
.valor-item.is-active .valor-name{ color: var(--gold-deep); }
.valor-item.is-active .valor-desc{ opacity:1; }
.valor-item:not(.is-active) .valor-desc{ display:none; }
@media (min-width: 761px){ .valor-item:not(.is-active) .valor-desc{ display:block; opacity:0; height:0; overflow:hidden; } }

@media (max-width: 760px){
  .nosotros-grid{ grid-template-columns:1fr; gap: 3rem; }
  .nosotros-quote{ margin: -2.2rem 1rem 0; max-width:none; }
  .mv-grid{ grid-template-columns:1fr; }
  .valor-item{ flex-wrap:wrap; gap:.6rem 1.4rem; }
  .valor-name{ width:auto; }
}

/* ============================================================
   SERVICIOS
   ============================================================ */
.servicios{ background: var(--cream-deep); }
.motif-dots{ position:absolute; display:flex; gap:9px; z-index:1; }
.motif-dots span{ width:7px; height:7px; border-radius:50%; background: var(--gold); }
.motif-dots--top{ top: 3.4rem; right: 32px; }
.motif-dots span:nth-child(2){ opacity:.7; } .motif-dots span:nth-child(3){ opacity:.45; } .motif-dots span:nth-child(4){ opacity:.25; }

.servicios-head{ max-width: 62ch; }

.pillars{ display:grid; grid-template-columns: .8fr 1.2fr; gap: 3rem; margin-top: var(--space-xl); }
.pillar{ background: var(--white); border-radius: 10px; padding: 2.6rem; }
.pillar-head{ margin-bottom: 1.8rem; padding-bottom:1.6rem; border-bottom: 1px solid rgba(33,28,22,.1); }
.pillar-tag{ font-size:.76rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color: var(--teal); }
.pillar-head h3{ font-family: var(--font-display); font-weight:400; font-size: clamp(1.5rem,2.4vw,2rem); margin-top:.6rem; }

.pillar-list li{
  display:flex; gap: 1.1rem; padding: 1rem 0; border-bottom: 1px dashed rgba(33,28,22,.14);
  font-size: .98rem; color: var(--ink-soft);
}
.pillar-list li:last-child{ border-bottom:none; }
.pillar-list-num{ font-family: var(--font-display); font-style:italic; color: var(--gold-deep); flex-shrink:0; width:1.8rem; }
.pillar-list li span:last-child{ color: var(--ink); }
.pillar-list li:hover{ background: linear-gradient(90deg, rgba(194,162,107,.08), transparent); }

/* Por qué elegirnos */
.porque{ margin-top: var(--space-2xl); }
.porque-copy{ max-width: 60ch; }
.porque-strip{
  margin-top: 2.6rem; display:grid; grid-template-columns: repeat(5,1fr); gap: 1px;
  background: rgba(33,28,22,.12); border-radius:8px; overflow:hidden;
}
.porque-item{ background: var(--cream-deep); padding: 2rem 1.6rem; transition: background .35s var(--ease), transform .35s var(--ease); }
.porque-item:hover{ background: var(--ink); transform: translateY(-4px); }
.porque-item:hover p{ color: rgba(255,255,255,.85); }
.porque-item:hover .porque-num{ color: var(--gold); }
.porque-num{ font-family: var(--font-display); font-style:italic; font-size:1.8rem; color: var(--gold-deep); }
.porque-item p{ margin-top:1rem; font-size:.92rem; color: var(--ink-soft); transition: color .35s var(--ease); }

@media (max-width: 980px){
  .pillars{ grid-template-columns:1fr; }
  .porque-strip{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 560px){
  .porque-strip{ grid-template-columns: 1fr; }
}

/* ============================================================
   CONTACTO
   ============================================================ */
.contacto{ background: var(--ink); color:#fff; }
.contacto .section-eyebrow{ color: var(--gold); }
.contacto .section-eyebrow::before{ background: var(--gold); }
.contacto .section-title{ color:#fff; }
.contacto .section-title em{ color: var(--gold); }
.contacto .lede{ color: rgba(255,255,255,.65); }

.motif-swirl--contact{
  position:absolute; top:-60px; left:-60px; width:220px; height:220px;
  border: 1.5px solid rgba(194,162,107,.35); border-radius: 50% 50% 0% 50%;
}

.contacto-grid{ display:grid; grid-template-columns: .95fr 1.05fr; gap: 4rem; margin-top: var(--space-xl); }

.info-block{ padding: 1.5rem 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.info-block:first-child{ padding-top:0; }
.info-label{ font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color: var(--gold); font-weight:700; }
.info-block p{ margin-top:.6rem; color: rgba(255,255,255,.82); max-width: 42ch; }
.info-block a:hover{ color: var(--gold); }

.contacto-form{ background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); border-radius: 10px; padding: 2.4rem; }
.form-row{ margin-bottom: 1.3rem; }
.form-row label{ display:block; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color: var(--gold-pale); margin-bottom:.5rem; }
.form-row input, .form-row textarea{
  width:100%; background: transparent; border:none; border-bottom:1px solid rgba(255,255,255,.28);
  color:#fff; padding: .7rem 0; resize:vertical; transition: border-color .3s;
}
.form-row input::placeholder, .form-row textarea::placeholder{ color: rgba(255,255,255,.35); }
.form-row input:focus, .form-row textarea:focus{ outline:none; border-color: var(--gold); }

@media (max-width: 900px){
  .contacto-grid{ grid-template-columns:1fr; gap:2.6rem; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{ background: var(--ink); color:#fff; }
.footer-top{ border-top:1px solid rgba(255,255,255,.1); }
.footer-statement{
  max-width: var(--container); margin:0 auto; padding: var(--space-xl) 32px 3rem;
  text-align:center; display:flex; flex-direction:column; align-items:center; gap:1.6rem;
}
.footer-logo{ height:46px; filter: brightness(0) invert(1); opacity:.9; }
.footer-statement p{ font-family: var(--font-display); font-style:italic; font-size: clamp(1.4rem,3vw,2.1rem); max-width: 18ch; color: var(--gold-pale); }

.footer-grid{
  max-width: var(--container); margin:0 auto; padding: 0 32px 3.5rem;
  display:grid; grid-template-columns: repeat(3,1fr); gap: 2rem;
  border-top:1px solid rgba(255,255,255,.1); padding-top: 3rem;
}
.footer-heading{ display:block; font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color: var(--gold); margin-bottom:1rem; font-weight:700; }
.footer-col a, .footer-col p{ display:block; color: rgba(255,255,255,.72); padding: .3rem 0; font-size:.94rem; }
.footer-col a:hover{ color: var(--gold-pale); }

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1); padding: 1.6rem 32px;
  max-width: var(--container); margin:0 auto;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem;
  font-size:.8rem; color: rgba(255,255,255,.5);
}

@media (max-width:700px){
  .footer-grid{ grid-template-columns:1fr; gap:2rem; }
}

/* ============================================================
   RESPONSIVE — HEADER / GLOBAL
   ============================================================ */
@media (max-width: 900px){
  .main-nav{ display:none; }
  .menu-toggle{ display:flex; }
  .section{ padding: var(--space-xl) 0; }
  :root{ --space-2xl: 5rem; }
}

@media (max-width: 480px){
  .header-inner{ padding: 0 20px; }
  .section-inner{ padding: 0 20px; }
  .hero-content{ padding: 0 20px 5.5rem; }
  .hero-footer{ padding: 0 20px 2rem; }
  .hero-motif{ left:20px; }
}