:root{
  --orange:#e28e17;
  --orange-2:#f2a23a;
  --ink:#121212;
  --muted:#6b6b6b;
  --surface:#fffdfa;
  --surface-2:#f7f2e8;
  --surface-3:#efe3cf;
  --ring:rgba(226,142,23,.20);
  --hero-accent:#e28e17;

  --bg:#ffffff;
  --card:#f2ede4;
  --line:rgba(0,0,0,.10);

  --shadow: 0 18px 46px rgba(0,0,0,.14);
  --shadow-soft: 0 10px 24px rgba(0,0,0,.10);

  --radius: 18px;
  --container: 1180px;
  --ease: cubic-bezier(.2,.8,.2,1);

  --headerH: 128px;
  --fixedH: var(--headerH);
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at top left, rgba(242,162,58,.10), transparent 28%),
    radial-gradient(circle at right 12%, rgba(226,142,23,.08), transparent 24%),
    linear-gradient(180deg, #fffdfa 0%, #ffffff 34%, #fbf7f0 100%);
  overflow-x:hidden;
}

body.home-page{
  position:relative;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.page-progress{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:4px;
  z-index:100100;
  background:linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,0));
  pointer-events:none;
}

.page-progress__bar{
  display:block;
  width:0;
  height:100%;
  background:linear-gradient(90deg, var(--orange), #ffd18a);
  box-shadow:0 0 20px rgba(226,142,23,.45);
  transform-origin:left center;
}

.container{
  width:min(var(--container), calc(100% - 32px));
  margin-inline:auto;
}

/* HEADER */
.header{
  background:rgba(255,255,255,.92);
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:99999;
  backdrop-filter:saturate(1.15) blur(10px);
  transition: box-shadow .25s var(--ease), background .25s var(--ease), backdrop-filter .25s var(--ease);
}

.header.is-scrolled{
  box-shadow: 0 18px 48px rgba(0,0,0,.09);
  background:rgba(255,255,255,.84);
}

.header__row{
  display:grid;
  grid-template-columns: 320px 1fr auto;
  align-items:center;
  gap:20px;
  padding:16px 0;
  position:relative;
  z-index:5;
}

main{
  padding-top: var(--fixedH);
  position:relative;
  overflow:hidden;
}

#productos,
#marcas,
#servicios,
#nosotros,
#contacto{
  scroll-margin-top: calc(var(--headerH) + 24px);
}

/* BRAND */
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:280px;
}

.brand__logo{
  width:88px;
  height:88px;
  object-fit:contain;
  flex-shrink:0;
}

.brand__text{
  display:block;
  max-width:190px;
  font-size:12px;
  line-height:1.05;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:#2a2a2a;
  display:flex;
  align-items:center;
}

/* SEARCH */
.search{
  min-width:0;
  position:relative;
  z-index:6;
}

.search__inner{
  position:relative;
  height:46px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  display:flex;
  align-items:stretch;
  overflow:visible;
  transition: box-shadow .2s var(--ease), transform .2s var(--ease);
}

.search__inner:focus-within{
  box-shadow: 0 16px 40px rgba(226,142,23,.18);
  transform: translateY(-1px);
}

.search input{
  width:100%;
  border:0;
  outline:none;
  padding:0 16px;
  font-size:14px;
  background:transparent;
}

.search__btn{
  width:56px;
  border:0;
  cursor:pointer;
  background:var(--orange);
  color:#fff;
  display:grid;
  place-items:center;
  transition: filter .15s var(--ease);
}

.search__btn:hover{
  filter:brightness(1.05);
}

.search__results{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  display:grid;
  gap:6px;
  padding:10px;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
  box-shadow:0 18px 36px rgba(0,0,0,.12);
  z-index:100020;
}

.search__results[hidden]{
  display:none !important;
}

.search__result{
  display:block;
  padding:10px 12px;
  border-radius:12px;
  color:#222;
  font-size:14px;
  font-weight:700;
  transition:background .18s var(--ease), color .18s var(--ease);
}

.search__result:hover,
.search__result.is-active{
  background:#fff5e5;
  color:var(--orange);
}

.search__result-note{
  display:block;
  margin-top:4px;
  color:#777;
  font-size:12px;
  font-weight:600;
}

.search__glow{
  position:absolute;
  left:-30%;
  top:0;
  height:100%;
  width:30%;
  background: linear-gradient(90deg, transparent, rgba(226,142,23,.22), transparent);
  opacity:0;
}

.search__inner:focus-within .search__glow{
  opacity:1;
  animation: glow 1.2s var(--ease) infinite;
}

@keyframes glow{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(260%); }
}

/* ACTIONS */
.header__actions{
  display:flex;
  align-items:center;
  gap:12px;
  position:relative;
  z-index:2;
}

.header__actions .btn{
  min-width:170px;
  min-height:46px;
  padding:.78rem 1.15rem;
  box-shadow: 0 12px 28px rgba(226,142,23,.18);
  transform:none !important;
}

.header__actions .btn:hover{
  transform:none !important;
  box-shadow: 0 18px 34px rgba(226,142,23,.24);
}

.header__actions .btn::before{
  opacity:.7;
}

/* BUTTONS */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.62rem 1rem;
  border-radius:999px;
  border:1px solid transparent;
  cursor:pointer;
  font-weight:800;
  font-size:14px;
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
  user-select:none;
  white-space:nowrap;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transform: translate3d(0,0,0);
}

.btn:hover{
  transform: translate3d(0,0,0);
  box-shadow: 0 18px 44px rgba(0,0,0,.12);
}

.btn::before{
  content:"";
  position:absolute;
  inset:-1px;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.26) 24%, transparent 48%);
  transform:translateX(-130%);
  transition:transform .65s var(--ease);
  z-index:-1;
}

.btn:hover::before{
  transform:translateX(130%);
}

.btn--primary{
  background: linear-gradient(135deg, var(--orange), #f0aa46);
  color:#fff;
  box-shadow: 0 14px 34px rgba(226,142,23,.28);
}

.btn--primary:hover{
  background: linear-gradient(135deg, var(--orange-2), #f7b55f);
}

.btn--ghost{
  background:rgba(255,255,255,.12);
  color:#fff;
  border-color:rgba(255,255,255,.24);
  backdrop-filter:blur(10px);
}

.btn--ghost:hover{
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.42);
}

/* LANGUAGE */
.lang{
  position:relative;
  z-index:100005;
}

.lang__btn{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.58rem .9rem;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  cursor:pointer;
  font-weight:800;
  transition: transform .18s var(--ease), box-shadow .18s var(--ease);
  position:relative;
  z-index:100006;
}

.lang__btn:hover{
  transform:none;
  box-shadow:0 14px 34px rgba(0,0,0,.10);
}

.lang__menu{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:220px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:6px;
  box-shadow: 0 20px 50px rgba(0,0,0,.18);
  opacity:0;
  visibility:hidden;
  transform: translateY(-8px) scale(.98);
  pointer-events:none;
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s var(--ease);
  z-index:100010;
}

.lang.open .lang__menu{
  opacity:1;
  visibility:visible;
  transform: translateY(0) scale(1);
  pointer-events:auto;
}

.lang__menu button{
  width:100%;
  border:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
  padding:11px 12px;
  border-radius:12px;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:8px;
}

.lang__menu button:hover{
  background: rgba(226,142,23,.12);
}

.flag{
  width:22px;
  display:inline-block;
}

/* NAV */
.nav{
  background:#fff;
  border-top:1px solid rgba(0,0,0,.06);
  border-bottom:4px solid var(--orange);
  position:relative;
  z-index:2;
}

.nav__inner{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:36px;
  min-height:54px;
  padding:8px 0 12px;
  z-index:1;
}

.nav__inner--site{
  width:fit-content;
  margin:0 auto;
}

.nav__inner--home{
  width:fit-content;
  margin:0 auto;
}

.nav__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  color:#1b1b1b;
  opacity:.92;
  min-height:40px;
  padding:10px 8px;
  line-height:1;
  position:relative;
  transition: color .2s var(--ease), opacity .2s var(--ease);
  z-index:2;
}

.nav__link:hover{
  color:var(--orange);
  opacity:1;
}

.nav__link.is-active{
  opacity:1;
}

.nav__line{
  position:absolute;
  bottom:6px;
  height:3px;
  border-radius:999px;
  background: var(--orange);
  width:40px;
  left:0;
  transform: translateX(0);
  transition: transform .28s var(--ease), width .28s var(--ease);
  pointer-events:none;
}

/* RESPONSIVE */
@media (max-width: 980px){
  :root{
    --headerH: 190px;
  }

  .header__row{
    grid-template-columns:1fr;
    gap:14px;
  }

  .brand{
    justify-content:center;
  }

  .brand__text{
    max-width:220px;
  }

  .header__actions{
    justify-content:center;
    flex-wrap:wrap;
  }

  .nav__inner{
    gap:18px;
    flex-wrap:wrap;
  }
}

@media (max-width: 620px){
  :root{
    --headerH: 220px;
  }

  .brand{
    gap:10px;
  }

  .brand__logo{
    width:72px;
    height:72px;
  }

  .brand__text{
    font-size:10px;
    max-width:140px;
  }

  .nav__inner{
    gap:14px;
  }
}

/* HERO */
.hero{
  position:relative;
  height: calc(100vh - var(--headerH));
  min-height:720px;
  touch-action:pan-y;
  background:
    radial-gradient(circle at 18% 25%, rgba(226,142,23,.24), transparent 26%),
    radial-gradient(circle at 78% 16%, rgba(255,255,255,.08), transparent 20%),
    #0b0b0b;
  overflow:hidden;
}

.hero::before,
.hero::after{
  content:"";
  position:absolute;
  inset:auto;
  border-radius:999px;
  pointer-events:none;
  filter:blur(30px);
  opacity:.6;
  z-index:1;
}

.hero::before{
  width:240px;
  height:240px;
  left:-70px;
  bottom:60px;
  background:rgba(226,142,23,.18);
}

.hero::after{
  width:320px;
  height:320px;
  right:-120px;
  top:80px;
  background:rgba(255,255,255,.10);
}

.hero__viewport{
  position:absolute;
  inset:0;
  touch-action:pan-y;
}

.hero__slide{
  position:absolute;
  inset:0;
  touch-action:pan-y;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:none;
  z-index:0;
  transition: opacity 1.05s cubic-bezier(.22,.61,.36,1), visibility 0s linear 1.05s;
  will-change:opacity;
}

.hero__slide.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  z-index:1;
  transition: opacity 1.05s cubic-bezier(.22,.61,.36,1), visibility 0s;
}

.hero__img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.035);
  filter: saturate(1.04) contrast(1.04);
  transition: transform 1.6s cubic-bezier(.22,.61,.36,1), filter 1.05s cubic-bezier(.22,.61,.36,1);
  will-change:transform, filter;
}

.hero__slide.is-active .hero__img{
  transform: scale(1);
  filter:saturate(1.06) contrast(1.03);
}

.hero__shade{
  position:absolute;
  inset:0;
  background:
    radial-gradient(1000px 500px at 20% 55%, rgba(0,0,0,.56), transparent 60%),
    linear-gradient(90deg, rgba(0,0,0,.74), rgba(0,0,0,.28), rgba(0,0,0,.10)),
    linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.18));
}

.hero__content{
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:18px;
  max-width:min(820px, 100%);
  transform:none;
  transition:none;
}

.hero__title{
  margin:0;
  color:#fff;
  font-family:"Barlow Condensed", "Arial Narrow", Arial, sans-serif;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:0;
  line-height:.96;
  font-size:6.6rem;
  text-shadow: 0 22px 44px rgba(0,0,0,.42);
  text-wrap:balance;
}

.hero__title span{
  display:block;
  opacity:1;
  transform:none;
  filter:none;
}

.hero__subtitle{
  margin:0;
  max-width:680px;
  color:rgba(255,255,255,.92);
  font-size:18px;
  line-height:1.65;
  font-weight:500;
  text-shadow:0 14px 30px rgba(0,0,0,.28);
}

.hero__cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:8px;
}

.hero__cta .btn{
  padding:.88rem 1.18rem;
  font-size:15px;
}

.hero__arrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:46px;
  height:46px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.25);
  background: rgba(0,0,0,.28);
  backdrop-filter: blur(6px);
  cursor:pointer;
  display:grid;
  place-items:center;
  transition: transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
  z-index:10;
  color:#fff;
}

.hero__arrow:hover{
  transform: translateY(-50%);
  background: rgba(0,0,0,.36);
  border-color: rgba(255,255,255,.35);
}

.hero__arrow--left{ left:18px; }
.hero__arrow--right{ right:18px; }

.hero__dots{
  position:absolute;
  left:0;
  right:0;
  bottom:14px;
  display:flex;
  justify-content:center;
  gap:10px;
  z-index:12;
}

.dot{
  width:10px;
  height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.55);
  background: rgba(255,255,255,.12);
  cursor:pointer;
  position:relative;
  transition: transform .15s var(--ease), background .15s var(--ease), border-color .15s var(--ease);
}

.dot:hover{
  transform:none;
}

.dot.is-active{
  background: var(--orange);
  border-color: var(--orange);
}

.dot .prog{
  position:absolute;
  left:-6px;
  right:-6px;
  bottom:-9px;
  height:3px;
  border-radius:999px;
  background: rgba(255,255,255,.15);
  overflow:hidden;
  opacity:0;
}

.dot.is-active .prog{
  opacity:1;
}

.dot .prog::after{
  content:"";
  display:block;
  height:100%;
  width:0%;
  background: var(--orange);
  animation: prog linear forwards;
  animation-duration: var(--dot-duration, 6500ms);
}

@keyframes prog{
  to{ width:100%; }
}

/* FEATURE */
.feature{
  padding:34px 0 54px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,0)),
    #fff;
}

.feature__wrap{
  position:relative;
  background:
    linear-gradient(145deg, rgba(255,255,255,.76), rgba(255,255,255,.28)),
    var(--card);
  border-radius:26px;
  padding:30px 60px 22px;
  overflow:hidden;
  box-shadow: 0 22px 52px rgba(0,0,0,.08);
  border:1px solid rgba(255,255,255,.55);
}

.feature__track{
  position:relative;
  min-height:280px;
}

.feature__item{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  align-items:center;
  gap:22px;
  opacity:0;
  transform: translateX(18px);
  transition: opacity .35s var(--ease), transform .35s var(--ease);
}

.feature__item.is-active{
  opacity:1;
  transform: translateX(0);
}

.feature__kicker{
  margin:0 0 10px;
  color:#2d2d2d;
  font-weight:800;
  opacity:.85;
}

.feature__title{
  margin:0 0 12px;
  font-size: clamp(1.4rem, 2.4vw, 2.05rem);
  font-weight:1000;
  letter-spacing:.3px;
  text-transform:uppercase;
  line-height:1.05;
}

.feature__desc{
  margin:0 0 12px;
  color:#2c2c2c;
  opacity:.9;
  max-width:520px;
}

.feature__bullets{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  font-weight:900;
  color:#2a2a2a;
  opacity:.85;
}

.feature__media img{
  width:100%;
  height:250px;
  object-fit:cover;
  border-radius:18px;
  box-shadow: 0 20px 38px rgba(0,0,0,.16);
  transition:transform .45s var(--ease), box-shadow .45s var(--ease);
}

.feature__item.is-active .feature__media img{
  transform:scale(1.02);
}

.feature__arrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:38px;
  height:38px;
  border-radius:999px;
  border:0;
  background: var(--orange);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  transition: transform .18s var(--ease), filter .18s var(--ease);
  z-index:5;
}

.feature__arrow:hover{
  transform: translateY(-50%);
  filter: brightness(1.05);
}

.feature__arrow--left{ left:12px; }
.feature__arrow--right{ right:12px; }

.feature__dots{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:14px;
}

.feature__dots .dot{
  border-color: rgba(0,0,0,.22);
  background: rgba(0,0,0,.08);
}

.feature__dots .dot.is-active{
  background: var(--orange);
  border-color: var(--orange);
}

/* REVEAL */
.reveal{
  opacity:1;
  transform: translateY(0);
}

.js-ready .reveal{
  opacity:0;
  transform: translateY(14px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}

.js-ready .reveal.is-visible{
  opacity:1;
  transform: translateY(0);
}

/* SECTION TITLES */
.section-title{
  margin:0;
  width:100%;
  text-align:center;
  font-size:44px;
  line-height:1.1;
  font-weight:1000;
  color:#000;
  letter-spacing:-.02em;
  text-wrap:balance;
}

.portfolio__head,
.brands__head,
.services__head,
.business__head,
.news__head,
.partners__head{
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  margin-bottom:28px;
  width:100%;
}

/* PORTFOLIO */
.portfolio{
  padding:68px 0;
  background:linear-gradient(180deg, #fff 0%, #fffaf2 100%);
}

.portfolio__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
  margin-top:18px;
}

.p-card{
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  box-shadow: 0 14px 34px rgba(0,0,0,.10);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
  display:flex;
  flex-direction:column;
  min-height:300px;
  position:relative;
  isolation:isolate;
}

.p-card:hover{
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 26px 60px rgba(0,0,0,.16);
  border-color: rgba(226,142,23,.35);
}

.p-card::before,
.s-card::before,
.business-site-card::before,
.brand-logo-card::before,
.contact__list a::before,
.partner-card__circle::before,
.contact__form::before,
.contact__info::before,
.brands__panel::after,
.business__panel::before,
.partners__box::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(242,162,58,.22), transparent 44%);
  opacity:0;
  transition:opacity .28s var(--ease);
  pointer-events:none;
}

.p-card:hover::before,
.s-card:hover::before,
.business-site-card:hover::before,
.brand-logo-card:hover::before,
.partner-card:hover .partner-card__circle::before,
.contact__list a:hover::before,
.feature__wrap:hover::before,
.brands__panel:hover::after,
.business__panel:hover::before,
.partners__box:hover::before,
.contact__form:hover::before,
.contact__info:hover::before{
  opacity:1;
}

.p-card__media{
  position:relative;
  height:185px;
  overflow:hidden;
}

.p-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.02);
  transition: transform 1.2s var(--ease), filter .22s var(--ease);
  filter: saturate(1.03) contrast(1.03);
}

.p-card:hover .p-card__media img{
  transform: scale(1.08);
}

.p-card__badge{
  position:absolute;
  top:12px;
  left:12px;
  background: rgba(0,0,0,.55);
  color:#fff;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  backdrop-filter: blur(6px);
  border:1px solid rgba(255,255,255,.18);
}

.p-card__body{
  padding:16px 16px 18px;
  display:flex;
  flex-direction:column;
  gap:14px;
  flex:1;
  position:relative;
  z-index:1;
}

.p-card__title{
  margin:0;
  font-size:18px;
  font-weight:1000;
  letter-spacing:.2px;
}

.p-card__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:1000;
  color: var(--orange);
  margin-top:auto;
}

.p-card__arrow{
  display:inline-block;
  font-size:1.28em;
  line-height:1;
  transform:scaleX(.82);
  transform-origin:left center;
  transition: transform .18s var(--ease);
}

.p-card:hover .p-card__arrow{
  transform: translateX(4px) scaleX(.82);
}

/* BRANDS */
.brands{
  padding:68px 0;
  background:linear-gradient(180deg, #fffaf2 0%, #fff 100%);
}

.brands__panel{
  background:
    linear-gradient(145deg, rgba(255,255,255,.76), rgba(255,255,255,.24)),
    #f6f3ec;
  border-radius:40px;
  padding:34px 34px;
  box-shadow: 0 18px 44px rgba(0,0,0,.06);
  border:1px solid rgba(0,0,0,.06);
  position:relative;
  overflow:hidden;
}

.brands__panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.65), transparent 35%),
    radial-gradient(circle at 80% 80%, rgba(255,255,255,.35), transparent 35%);
  pointer-events:none;
}

.brands__grid{
  position:relative;
  z-index:1;
  display:grid;
  align-items:center;
  gap:28px;
}

.brands__grid--three{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.brand-logo-card{
  min-height:170px;
  border-radius:24px;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px 24px;
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease);
  position:relative;
  isolation:isolate;
}

.brand-logo-card:hover{
  transform: translateY(-6px) scale(1.01);
  background: rgba(255,255,255,.58);
  box-shadow: 0 18px 34px rgba(0,0,0,.08);
}

.brand-logo-card img{
  width:100%;
  max-width:280px;
  max-height:90px;
  object-fit:contain;
  transition: transform .22s var(--ease);
}

.brand-logo-card:hover img{
  transform: scale(1.03);
}
/* SERVICES */
.services{
  padding:68px 0;
  background:linear-gradient(180deg, #fff 0%, #fffaf3 100%);
}

.services__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:22px;
  margin-top:18px;
}

.s-card{
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  box-shadow: 0 14px 34px rgba(0,0,0,.10);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
  display:flex;
  flex-direction:column;
  min-height:360px;
  position:relative;
  isolation:isolate;
}

.s-card:hover{
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 26px 60px rgba(0,0,0,.16);
  border-color: rgba(226,142,23,.35);
}

.s-card__media{
  position:relative;
  height:185px;
  overflow:hidden;
}

.s-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.02);
  transition: transform 1.2s var(--ease);
  filter: saturate(1.03) contrast(1.03);
}

.s-card:hover .s-card__media img{
  transform: scale(1.08);
}

.s-card__badge{
  position:absolute;
  top:12px;
  left:12px;
  background: rgba(0,0,0,.55);
  color:#fff;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  backdrop-filter: blur(6px);
  border:1px solid rgba(255,255,255,.18);
}

.s-card__body{
  padding:16px 16px 18px;
  display:flex;
  flex-direction:column;
  gap:14px;
  flex:1;
  position:relative;
  z-index:1;
}

.s-card__title{
  margin:0;
  font-size:18px;
  font-weight:1000;
  letter-spacing:.2px;
}

.s-card__desc{
  margin:0;
  color:#5b5b5b;
  line-height:1.65;
  font-size:14px;
}

.s-card__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:1000;
  color: var(--orange);
  margin-top:auto;
}

.s-card__arrow{
  display:inline-block;
  font-size:1.28em;
  line-height:1;
  transform:scaleX(.82);
  transform-origin:left center;
  transition: transform .18s var(--ease);
}

.s-card:hover .s-card__arrow{
  transform: translateX(4px) scaleX(.82);
}

/* BUSINESS */
.business{
  padding:68px 0;
  background:linear-gradient(180deg, #fffaf3 0%, #fff 100%);
}

.business__panel{
  background:
    linear-gradient(145deg, rgba(255,255,255,.78), rgba(255,255,255,.22)),
    var(--card);
  border-radius:28px;
  padding:30px;
  box-shadow: 0 22px 52px rgba(0,0,0,.08);
  border:1px solid rgba(0,0,0,.06);
  position:relative;
  overflow:hidden;
}

.business__grid{
  display:grid;
  gap:22px;
}

.business__grid--four{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.business-site-card{
  background:#fff;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.08);
  box-shadow: 0 14px 30px rgba(0,0,0,.08);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
  display:flex;
  flex-direction:column;
  min-height:320px;
  position:relative;
  isolation:isolate;
}

.business-site-card:hover{
  transform: translateY(-8px) scale(1.01);
  box-shadow: 0 26px 60px rgba(0,0,0,.14);
  border-color: rgba(226,142,23,.35);
}

.business-site-card__media{
  height:160px;
  background:linear-gradient(180deg, #fff, #f8f6f1);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  border-bottom:1px solid rgba(0,0,0,.05);
}

.business-site-card__media img{
  width:100%;
  max-width:280px;
  max-height:150px;
  object-fit:contain;
  transition: transform .22s var(--ease);
}

.business-site-card:hover .business-site-card__media img{
  transform: scale(1.04);
}

.business-site-card__body{
  padding:18px 18px 20px;
  display:flex;
  flex-direction:column;
  gap:10px;
  flex:1;
  position:relative;
  z-index:1;
}

.business-site-card__body h3{
  margin:0;
  font-size:18px;
  line-height:1.2;
  font-weight:1000;
  color:#111;
}

.business-site-card__body p{
  margin:0;
  font-size:14px;
  line-height:1.5;
  color:#2f2f2f;
  opacity:.86;
  flex:1;
}

.business-site-card__body span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:1000;
  color:var(--orange);
}

.about-home__grid{
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(320px, .9fr);
  gap:28px;
  align-items:stretch;
}

.about-home__content{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:16px;
  padding:8px 6px;
}

.about-home__kicker{
  margin:0;
  color:var(--orange);
  font-size:13px;
  font-weight:1000;
  letter-spacing:.7px;
  text-transform:uppercase;
}

.about-home__title{
  margin:0;
  font-size:clamp(1.9rem, 3vw, 2.8rem);
  line-height:1.08;
  font-weight:1000;
  color:#111;
}

.about-home__text{
  margin:0;
  font-size:15px;
  line-height:1.75;
  color:#3b3b3b;
}

.about-home__cta{
  align-self:flex-start;
  margin-top:8px;
}

.about-home__cards{
  display:grid;
  gap:18px;
}

.about-home__card{
  background:#fff;
  border-radius:20px;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 14px 30px rgba(0,0,0,.08);
  padding:20px 20px 22px;
}

.about-home__card-label{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#fff3df;
  color:var(--orange);
  font-size:11px;
  font-weight:1000;
  letter-spacing:.4px;
  text-transform:uppercase;
}

.about-home__card h3{
  margin:14px 0 10px;
  font-size:20px;
  line-height:1.2;
  font-weight:1000;
  color:#111;
}

.about-home__card p{
  margin:0;
  font-size:14px;
  line-height:1.65;
  color:#3b3b3b;
}
/* PARTNERS */
.partners{
  padding:68px 0;
  background:linear-gradient(180deg, #fff 0%, #fffaf3 100%);
}
.partner-card{
  cursor: default;
}

.partners__box{
  position:relative;
  background:
    linear-gradient(145deg, rgba(255,255,255,.74), rgba(255,255,255,.20)),
    var(--card);
  border-radius:26px;
  padding:26px 56px 22px;
  box-shadow: 0 22px 52px rgba(0,0,0,.08);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.46);
}

.partners__viewport{
  width:100%;
  overflow:hidden;
}

.partners__track{
  display:flex;
  align-items:center;
  gap:34px;
  padding:14px 10px;
  overflow-x:auto;
  scrollbar-width:none;
  will-change:scroll-position;
}

.partners__track::-webkit-scrollbar{
  display:none;
}

.partner-card{
  flex:0 0 auto;
  width:240px;
  height:240px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background: transparent;
  transition: transform .22s var(--ease);
}

.partner-card:hover{
  transform: translateY(-6px);
}

.partner-card__circle{
  width:210px;
  height:210px;
  border-radius:999px;
  background:#fff;
  display:grid;
  place-items:center;
  box-shadow: 0 18px 46px rgba(0,0,0,.10);
  border:1px solid rgba(0,0,0,.06);
  transition: box-shadow .22s var(--ease), transform .22s var(--ease), border-color .22s var(--ease);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.partner-card img{
  width:160px;
  height:160px;
  object-fit:contain;
  filter: contrast(1.05);
  transition: transform .22s var(--ease);
}

.partner-card:hover .partner-card__circle{
  box-shadow: 0 26px 64px rgba(0,0,0,.14);
  border-color: rgba(226,142,23,.30);
  transform: scale(1.02);
}

.partner-card:hover img{
  transform: scale(1.04);
}

.partners__arrow{
  display:none;
}

.partners__arrow:hover{
  transform: translateY(-50%);
  filter: brightness(1.05);
}

.partners__arrow--left{ left:14px; }
.partners__arrow--right{ right:14px; }

.partners__dots{
  display:none;
}

.partners__dots .dot{
  border-color: rgba(0,0,0,.22);
  background: rgba(0,0,0,.08);
}

.partners__dots .dot.is-active{
  background: var(--orange);
  border-color: var(--orange);
}

/* FOOTER */
.footer{
  background:#0f0f0f;
  color:#fff;
  padding:22px 0;
}

.footer__inner{
  display:flex;
  justify-content:space-between;
  gap:16px;
  opacity:.95;
}

/* RESPONSIVE */
@media (max-width: 980px){
  :root{
    --headerH: 176px;
  }

  .header__row{
    grid-template-columns:1fr;
  }

  .brand{
    justify-content:center;
  }

  .header__actions{
    justify-content:center;
    flex-wrap:wrap;
  }

  .nav__inner{
    gap:18px;
    flex-wrap:wrap;
  }

  .hero{
    height: calc(100vh - var(--headerH));
    min-height:620px;
  }

  .feature__wrap{
    padding:18px 44px 16px;
  }

  .feature__item{
    grid-template-columns:1fr;
  }

  .feature__media img{
    height:210px;
  }

  .portfolio__grid,
  .services__grid,
  .news__grid{
    grid-template-columns: repeat(2, 1fr);
  }

  .brands__box,
  .business__box,
  .partners__box{
    padding:18px 44px 16px;
  }

  .section-title{
    font-size:36px;
  }

  .biz-card{
    width:190px;
    height:190px;
  }

  .biz-card img{
    width:150px;
    height:150px;
  }

  .partner-card{
    width:220px;
    height:220px;
  }

  .partner-card__circle{
    width:190px;
    height:190px;
  }

  .partner-card img{
    width:140px;
    height:140px;
  }
}

@media (max-width: 620px){
  :root{
    --headerH: 190px;
  }

  .hero{
    min-height:560px;
  }

  .hero__title{
    font-size:3.7rem;
  }

  .hero__subtitle{
    font-size:15px;
    line-height:1.6;
  }

  .portfolio__grid,
  .services__grid,
  .news__grid{
    grid-template-columns:1fr;
  }

  .p-card__media,
  .s-card__media,
  .n-card__media{
    height:210px;
  }

  .brands__box,
  .business__box,
  .partners__box{
    padding:16px 16px 14px;
  }

  .brands__arrow,
  .business__arrow,
  .partners__arrow{
    display:none;
  }

  .brands__track,
  .business__track,
  .partners__track{
    gap:18px;
  }

  .brand-card{
    width:170px;
    height:170px;
  }

  .brand-card img{
    width:130px;
    height:130px;
  }

  .biz-card{
    width:170px;
    height:170px;
  }

  .biz-card img{
    width:130px;
    height:130px;
  }

  .partner-card{
    width:200px;
    height:200px;
  }

  .partner-card__circle{
    width:170px;
    height:170px;
  }

  .partner-card img{
    width:130px;
    height:130px;
  }

  .section-title{
    font-size:30px;
  }

  .footer__inner{
    flex-direction:column;
    text-align:center;
  }
}
/* CONTACT */
.contact{
  padding: 72px 0;
  background:linear-gradient(180deg, #fffaf3 0%, #fff 100%);
}

.contact__head{
  margin-bottom: 28px;
}

.contact__wrap{
  display:grid;
  grid-template-columns: 420px 1fr;
  gap: 28px;
  align-items:start;
}

.contact__info{
  background:
    linear-gradient(145deg, rgba(255,255,255,.72), rgba(255,255,255,.22)),
    var(--card);
  border-radius: 24px;
  padding: 28px;
  box-shadow: 0 22px 52px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.contact__kicker{
  margin:0 0 8px;
  color: var(--orange);
  font-weight:900;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.contact__info h3{
  margin:0 0 12px;
  font-size:30px;
  line-height:1.1;
  font-weight:1000;
  color:#000;
}

.contact__text{
  margin:0 0 20px;
  color:#2f2f2f;
  opacity:.85;
  line-height:1.5;
}

.contact__list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.contact__list a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:14px;
  background: rgba(255,255,255,.66);
  border:1px solid rgba(0,0,0,.06);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.contact__list a:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.08);
  border-color: rgba(226,142,23,.22);
}

.contact__form{
  background:
    linear-gradient(145deg, rgba(255,255,255,.94), rgba(255,255,255,.74)),
    #fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:24px;
  padding:28px;
  box-shadow: 0 22px 52px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.contact__grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:16px;
}

.contact__field{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:16px;
}

.contact__field label{
  font-weight:800;
  color:#111;
  font-size:14px;
}

.contact__field input,
.contact__field textarea{
  width:100%;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  padding:14px 15px;
  font:inherit;
  outline:none;
  background:#fff;
  transition: border-color .18s var(--ease), box-shadow .18s var(--ease), transform .18s var(--ease);
}

.contact__field input:focus,
.contact__field textarea:focus{
  border-color: rgba(226,142,23,.7);
  box-shadow: 0 0 0 4px rgba(226,142,23,.12);
  transform:translateY(-1px);
}

.contact__field textarea{
  resize:vertical;
  min-height:140px;
}

.contact__actions{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  margin-top:6px;
}

.contact__status{
  margin:14px 0 0;
  min-height:20px;
  font-size:14px;
  font-weight:700;
  color: var(--orange);
}

/* WHATSAPP FLOAT */
.whatsapp-float{
  position:fixed;
  right:22px;
  bottom:22px;
  width:62px;
  height:62px;
  border-radius:999px;
  background:#25d366;
  display:grid;
  place-items:center;
  box-shadow: 0 18px 34px rgba(0,0,0,.20);
  z-index:9999;
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), filter .18s var(--ease);
}

.whatsapp-float:hover{
  transform:none;
  box-shadow: 0 24px 40px rgba(0,0,0,.24);
  filter: brightness(1.03);
}

.whatsapp-float svg{
  width:30px;
  height:30px;
  fill:#fff;
}

@media (max-width: 980px){
  .contact__wrap{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px){
  .contact{
    padding: 54px 0;
  }

  .contact__info,
  .contact__form{
    padding:20px;
  }

  .contact__grid{
    grid-template-columns: 1fr;
  }

  .contact__info h3{
    font-size:24px;
  }

  .whatsapp-float{
    right:16px;
    bottom:16px;
    width:56px;
    height:56px;
  }

  .whatsapp-float svg{
    width:27px;
    height:27px;
  }

}

/* FOOTER PROFESIONAL */
.footer--pro{
  background:#3a3a3a;
  color:#fff;
  margin-top:64px;
  position:relative;
  overflow:hidden;
}

.footer--pro::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 12% 18%, rgba(226,142,23,.18), transparent 26%),
    radial-gradient(circle at 88% 0%, rgba(255,255,255,.08), transparent 20%);
  pointer-events:none;
}

.footer__top{
  display:grid;
  grid-template-columns: 1.15fr 1fr 1fr 1fr;
  gap:48px;
  padding:56px 0 34px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.footer__brand{
  max-width:320px;
}

.footer__logo{
  width:96px;
  height:auto;
  margin-bottom:16px;
  object-fit:contain;
}

.footer__brand-text{
  margin:0;
  color:rgba(255,255,255,.72);
  line-height:1.7;
  font-size:15px;
}

.footer__col h3{
  margin:0 0 18px;
  font-size:15px;
  font-weight:900;
  letter-spacing:.3px;
  color:#fff;
  text-transform:uppercase;
}

.footer__col p{
  margin:0 0 14px;
  color:rgba(255,255,255,.82);
  line-height:1.7;
  font-size:15px;
}

.footer__links,
.footer__contact{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}

.footer__links a,
.footer__contact a,
.footer__map{
  color:rgba(255,255,255,.84);
  text-decoration:none;
  transition: color .2s var(--ease), opacity .2s var(--ease);
}

.footer__links a:hover,
.footer__contact a:hover,
.footer__map:hover{
  color:#fff;
}

.footer__bottom{
  background:#454545;
}

.footer__bottom-inner{
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
}

.footer__bottom p{
  margin:0;
  color:rgba(255,255,255,.86);
  font-size:15px;
  line-height:1.6;
}

/* WHATSAPP CTA ESTILO IMAGEN */
.whatsapp-cta{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:9999;
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:14px 18px;
  border-radius:999px;
  background:#fff;
  color:#1a1a1a;
  box-shadow:0 18px 40px rgba(0,0,0,.22);
  font-weight:800;
  font-size:15px;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}

.whatsapp-cta:hover{
  transform:none;
  box-shadow:0 24px 48px rgba(0,0,0,.28);
}

.whatsapp-cta__icon{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#fff;
  color:#111;
  flex-shrink:0;
}

.whatsapp-cta__icon svg{
  width:22px;
  height:22px;
}

/* RESPONSIVE */
@media (max-width: 1100px){
  .footer__top{
    grid-template-columns: 1fr 1fr;
    gap:34px 28px;
  }
}

@media (max-width: 640px){
  .footer__top{
    grid-template-columns: 1fr;
    padding:42px 0 26px;
  }

  .footer__brand{
    max-width:none;
  }

  .footer__bottom-inner{
    min-height:64px;
    padding:0 10px;
  }

  .whatsapp-cta{
    right:14px;
    bottom:14px;
    padding:12px 16px;
    font-size:14px;
  }

  .whatsapp-cta span:last-child{
    display:none;
  }

  .whatsapp-cta{
    width:58px;
    height:58px;
    padding:0;
    justify-content:center;
  }

  .whatsapp-cta__icon{
    width:24px;
    height:24px;
  }
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }

  .hero__particles{
    animation:none !important;
  }
}

/* RESPONSIVE REFINADO */
@media (max-width: 1024px){
  :root{
    --headerH: 206px;
  }

  .container{
    width:min(var(--container), calc(100% - 28px));
  }

  .header__row{
    grid-template-columns:1fr;
    gap:14px;
    padding:14px 0 12px;
  }

  .brand,
  .header__actions{
    justify-content:center;
  }

  .brand{
    min-width:0;
    width:100%;
  }

  .brand__text{
    max-width:220px;
    text-align:center;
  }

  .search{
    width:100%;
  }

  .search__inner{
    max-width:720px;
    margin-inline:auto;
  }

  .header__actions .btn{
    min-width:190px;
  }

  .nav__inner{
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:14px;
    min-height:50px;
    padding:8px 2px 12px;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
  }

  .nav__inner::-webkit-scrollbar{
    display:none;
  }

  .nav__link{
    flex:0 0 auto;
    white-space:nowrap;
  }

  .nav__line{
    display:none;
  }

  .hero{
    min-height:680px;
  }

  .hero__content{
    max-width:700px;
    padding:28px 0;
  }

  .hero__title{
    font-size:4.9rem;
  }

  .hero__subtitle{
    max-width:620px;
    font-size:17px;
  }

  .portfolio__grid,
  .services__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .business__grid--four{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .about-home__grid{
    grid-template-columns:1fr;
  }

  .brands__grid--three{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .feature__grid,
  .contact__wrap{
    grid-template-columns:1fr;
  }

  .contact__info,
  .contact__form{
    padding:24px;
  }
}

@media (max-width: 768px){
  :root{
    --headerH: 146px;
  }

  .container{
    width:min(var(--container), calc(100% - 22px));
  }

  .header__row{
    grid-template-columns:64px minmax(0, 1fr);
    align-items:center;
    gap:10px;
    padding:10px 0;
  }

  .brand{
    width:auto;
    min-width:0;
    gap:0;
    flex-direction:row;
    justify-content:flex-start;
  }

  .brand__logo{
    width:64px;
    height:64px;
  }

  .brand__text{
    display:none;
  }

  .search{
    width:100%;
  }

  .search__inner{
    height:42px;
    max-width:none;
    margin:0;
  }

  .search input{
    font-size:15px;
    padding:0 14px;
  }

  .header__actions{
    display:none;
  }

  .search__btn{
    width:52px;
  }

  .nav{
    border-bottom-width:3px;
  }

  .nav__inner{
    justify-content:space-between;
    gap:8px;
    min-height:48px;
    padding:8px 0 9px;
    overflow:visible;
  }

  .nav__link{
    flex:1 1 0;
    min-width:0;
    min-height:34px;
    padding:6px 4px;
    font-size:13px;
    text-align:center;
  }

  .hero{
    min-height:820px;
    height:auto;
  }

  .hero__img{
    object-position:center center;
    transform:scale(1.12);
  }

  .hero__slide.is-active .hero__img{
    transform:scale(1.07);
  }

  .hero__slide:nth-child(1) .hero__img{
    object-position:68% center;
  }

  .hero__slide:nth-child(2) .hero__img{
    object-position:52% center;
  }

  .hero__slide:nth-child(3) .hero__img{
    object-position:58% center;
  }

  .hero__content{
    align-items:center;
    gap:18px;
    justify-content:center;
    max-width:100%;
    padding:74px 0 112px;
    text-align:center;
  }

  .hero__title{
    max-width:345px;
    margin-inline:auto;
    font-size:3.12rem;
    line-height:.96;
    letter-spacing:0;
  }

  .hero__subtitle{
    max-width:330px;
    margin-inline:auto;
    font-size:15px;
    line-height:1.68;
    color:rgba(255,255,255,.93);
    text-shadow:0 2px 16px rgba(0,0,0,.46);
  }

  .hero__cta{
    width:100%;
    flex-direction:column;
    align-items:center;
    gap:8px;
    max-width:268px;
  }

  .hero__cta .btn{
    width:100%;
    justify-content:center;
    min-height:50px;
    padding:.78rem 1rem;
    border-radius:16px;
    font-size:14px;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
  }

  .hero__cta .btn--primary{
    order:-1;
  }

  .hero__arrow{
    display:none;
  }

  .hero__dots{
    bottom:34px;
  }

  .hero__shade{
    background:
      linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.20) 25%, rgba(0,0,0,.30) 48%, rgba(0,0,0,.66) 100%),
      radial-gradient(520px 360px at 50% 50%, rgba(0,0,0,.18), transparent 62%),
      radial-gradient(720px 420px at 50% 64%, rgba(0,0,0,.58), transparent 70%);
  }

  .feature__wrap,
  .brands__panel,
  .business__panel,
  .partners__box,
  .contact__info,
  .contact__form{
    border-radius:24px;
  }

  .portfolio__grid,
  .services__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .brands__grid--three,
  .business__grid--four,
  .news__grid,
  .contact__grid{
    grid-template-columns:1fr;
  }

  .brands{
    padding:48px 0;
  }

  .brands__panel{
    padding:16px;
    border-radius:18px;
  }

  .brands__grid--three{
    gap:12px;
  }

  .brand-logo-card{
    min-height:112px;
    border-radius:14px;
    background:rgba(255,255,255,.62);
    border:1px solid rgba(0,0,0,.06);
  }

  .brand-logo-card img{
    max-width:210px;
    max-height:58px;
  }

  .brand-logo-card:nth-child(3) img{
    max-width:190px;
    max-height:68px;
  }

  .p-card__media,
  .s-card__media,
  .n-card__media{
    height:220px;
  }

  .partner-card{
    width:190px;
    height:190px;
  }

  .partner-card__circle{
    width:170px;
    height:170px;
  }

  .partner-card img{
    width:128px;
    height:128px;
  }

  .section-title{
    font-size:34px;
  }

  .footer__top{
    grid-template-columns:1fr;
    gap:28px;
    padding:40px 0 24px;
    text-align:left;
  }

  .footer__logo{
    margin-inline:0;
  }

  .footer__links,
  .footer__contact{
    justify-items:start;
  }
}

@media (max-width: 480px){
  :root{
    --headerH: 138px;
  }

  .container{
    width:min(var(--container), calc(100% - 18px));
  }

  .header__row{
    grid-template-columns:58px minmax(0, 1fr);
    gap:8px;
    padding:10px 0 10px;
  }

  .nav__inner{
    gap:4px;
    min-height:42px;
  }

  .nav__link{
    min-height:32px;
    padding:6px 2px;
    font-size:11px;
    letter-spacing:-.1px;
  }

  .brand__logo{
    width:58px;
    height:58px;
  }

  .search__inner{
    height:40px;
  }

  .search input{
    font-size:14px;
  }

  .hero{
    min-height:840px;
  }

  .hero__img{
    object-position:center center;
    transform:scale(1.14);
  }

  .hero__slide.is-active .hero__img{
    transform:scale(1.08);
  }

  .hero__slide:nth-child(1) .hero__img{
    object-position:70% center;
  }

  .hero__slide:nth-child(2) .hero__img{
    object-position:53% center;
  }

  .hero__slide:nth-child(3) .hero__img{
    object-position:60% center;
  }

  .hero__content{
    gap:16px;
    padding:82px 0 116px;
    text-align:center;
  }

  .hero__title{
    max-width:330px;
    font-size:2.9rem;
    line-height:.96;
  }

  .hero__subtitle{
    max-width:318px;
    font-size:14.5px;
    line-height:1.62;
  }

  .hero__cta{
    max-width:258px;
  }

  .hero__cta .btn{
    min-height:50px;
    padding:.78rem 1rem;
    border-radius:16px;
    font-size:14px;
  }

  .feature{
    display:none;
  }

  .portfolio__grid,
  .services__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
    align-items:start;
  }

  .portfolio__grid{
    gap:12px;
  }

  .p-card{
    border-radius:14px;
    align-self:start;
    min-height:0;
    height:100%;
  }

  .p-card__media{
    height:auto;
    aspect-ratio:1 / 1;
  }

  .p-card__body{
    min-height:58px;
    padding:12px 12px 14px;
    justify-content:center;
    gap:0;
  }

  .p-card__title{
    font-size:16px;
    line-height:1.1;
  }

  .p-card__link{
    display:none;
  }

  .s-card{
    border-radius:14px;
    align-self:start;
    min-height:0;
    height:100%;
  }

  .s-card__media{
    height:auto;
    aspect-ratio:1 / 1;
  }

  .s-card__body{
    flex:1;
    min-height:58px;
    padding:10px 12px 11px;
    justify-content:center;
    gap:0;
  }

  .s-card__title{
    font-size:16px;
    line-height:1.1;
  }

  .s-card__desc,
  .s-card__link{
    display:none;
  }

  .section-title{
    font-size:29px;
  }

  .contact__info,
  .contact__form,
  .feature__wrap,
  .brands__panel,
  .business__panel,
  .partners__box{
    padding:18px;
  }

  .whatsapp-float,
  .whatsapp-cta{
    right:12px;
    bottom:12px;
  }
}

/* PAGINAS INTERNAS: NOSOTROS Y CONTACTO */
body.subpage{
  font-family:"Manrope", system-ui, sans-serif;
  background:
    radial-gradient(circle at top left, rgba(226,142,23,.15), transparent 28%),
    radial-gradient(circle at right top, rgba(107,31,18,.10), transparent 26%),
    linear-gradient(180deg, #fffaf4 0%, #f8efe1 46%, #f4eadc 100%);
}

.subpage main{
  padding-top:var(--headerH);
}

.subpage .btn--ghost{
  color:#6b1f12;
  background:rgba(255,255,255,.74);
  border-color:rgba(107,31,18,.14);
}

.breadcrumb{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  color:rgba(24,21,18,.62);
  font-size:14px;
  margin-bottom:22px;
}

.breadcrumb a:hover{
  color:var(--orange);
}

.contact-hero{
  padding:56px 0 30px;
}

.contact-hero__grid{
  display:grid;
  grid-template-columns:minmax(0, 1.1fr) minmax(300px, .9fr);
  gap:26px;
  align-items:stretch;
}

.contact-hero__kicker,
.contact-info__kicker{
  margin:0 0 12px;
  color:var(--orange);
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px;
}

.contact-hero__title,
.contact-info h2,
.contact-map__head h2,
.contact-form-panel__head h2,
.about-hero__title,
.section-head__title,
.about-cta__title,
.principle-block h2{
  margin:0;
  font-family:"Fraunces", serif;
  font-weight:700;
  letter-spacing:-.03em;
  color:#1a130f;
  text-wrap:balance;
}

.contact-hero__title{
  font-size:clamp(2.6rem, 6vw, 4.8rem);
  line-height:.96;
  max-width:860px;
}

.contact-hero__text{
  margin:20px 0 0;
  max-width:700px;
  font-size:18px;
  line-height:1.9;
  color:#4c4138;
}

.contact-hero__card,
.contact-info,
.contact-map,
.contact-form-panel{
  border:1px solid rgba(24,21,18,.10);
  border-radius:30px;
  background:rgba(255,255,255,.88);
  box-shadow:0 14px 30px rgba(52,34,14,.10);
}

.contact-hero__card{
  padding:24px;
  background:linear-gradient(145deg, rgba(255,255,255,.88), rgba(255,247,235,.66));
  box-shadow:0 24px 54px rgba(52,34,14,.12);
}

.contact-hero__label{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  background:#fff1d7;
  color:#b86c00;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.contact-hero__card h2{
  margin:14px 0 10px;
  font-size:30px;
  line-height:1.05;
}

.contact-hero__card p{
  margin:0 0 18px;
  color:#4c4138;
  line-height:1.8;
}

.contact-page{
  padding:24px 0 40px;
}

.contact-page__grid{
  display:grid;
  grid-template-columns:minmax(320px, .9fr) minmax(0, 1.1fr);
  gap:24px;
  align-items:start;
}

.contact-info,
.contact-map{
  padding:24px;
}

.contact-info__block{
  margin-bottom:18px;
}

.contact-info h2,
.contact-map__head h2,
.contact-form-panel__head h2{
  font-size:clamp(2rem, 3vw, 2.8rem);
  line-height:1.02;
}

.contact-map__head p,
.contact-form-panel__head p{
  margin:12px 0 0;
  color:#4d433b;
  line-height:1.8;
  font-size:15px;
}

.contact-info__list{
  display:grid;
  gap:14px;
}

.contact-link-card{
  display:grid;
  grid-template-columns:52px 1fr;
  gap:14px;
  align-items:start;
  padding:16px 16px 18px;
  border-radius:18px;
  border:1px solid rgba(24,21,18,.08);
  background:linear-gradient(145deg, #fff, #faf3e8);
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease);
}

.contact-link-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 30px rgba(52,34,14,.10);
  border-color:rgba(226,142,23,.22);
}

.contact-link-card .material-symbols-outlined{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#fff1d7;
  color:var(--orange);
  font-size:28px;
}

.contact-link-card strong{
  display:block;
  font-size:16px;
  line-height:1.3;
}

.contact-link-card span:last-child{
  display:block;
  margin-top:6px;
  color:#645b54;
  line-height:1.6;
  font-size:14px;
}

.contact-map__frame{
  margin-top:18px;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(24,21,18,.08);
  background:#fff;
  box-shadow:0 14px 30px rgba(52,34,14,.10);
}

.contact-map__frame iframe{
  display:block;
  width:100%;
  min-height:520px;
  border:0;
}

.contact-form-panel{
  margin-top:24px;
  padding:26px;
  background:linear-gradient(145deg, rgba(255,255,255,.92), rgba(255,247,235,.76));
  box-shadow:0 24px 54px rgba(52,34,14,.12);
}

.contact-form-panel__head{
  max-width:820px;
  margin-bottom:20px;
}

.contact-form{
  display:grid;
  gap:16px;
}

.contact-form__grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

.contact-form__field{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.contact-form__field label{
  font-weight:800;
  color:#1e1713;
  font-size:14px;
}

.contact-form__field input,
.contact-form__field textarea{
  width:100%;
  border:1px solid rgba(24,21,18,.10);
  border-radius:16px;
  padding:14px 15px;
  font:inherit;
  outline:none;
  background:#fff;
  transition:border-color .18s var(--ease), box-shadow .18s var(--ease), transform .18s var(--ease);
}

.contact-form__field input:focus,
.contact-form__field textarea:focus{
  border-color:rgba(226,142,23,.68);
  box-shadow:0 0 0 4px rgba(226,142,23,.12);
  transform:translateY(-1px);
}

.contact-form__field textarea{
  resize:vertical;
  min-height:150px;
}

.contact-form__actions{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}

.contact-form__status{
  margin:0;
  min-height:20px;
  color:var(--orange);
  font-size:14px;
  font-weight:700;
}

.about-hero{
  position:relative;
  padding:64px 0 34px;
}

.about-hero__layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(380px, .9fr);
  gap:34px;
  align-items:center;
}

.about-hero__copy{
  padding:20px 6px 20px 0;
}

.about-hero__kicker,
.section-head__kicker,
.about-cta__kicker,
.principle-block__kicker{
  margin:0 0 12px;
  color:#b86c00;
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px;
}

.about-hero__title{
  font-size:clamp(2.55rem, 5.4vw, 4.75rem);
  line-height:.98;
  max-width:860px;
}

.about-hero__text{
  margin:22px 0 0;
  max-width:700px;
  font-size:18px;
  line-height:1.82;
  color:#4c4138;
}

.about-hero__actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:26px;
}

.about-hero__media{
  position:relative;
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(24,21,18,.08);
  background:linear-gradient(145deg, rgba(255,255,255,.84), rgba(255,247,235,.58)), #fffaf2;
  box-shadow:0 24px 54px rgba(52,34,14,.12);
  min-height:480px;
}

.about-hero__media::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 38%, rgba(24,21,18,.58));
  z-index:2;
}

.about-hero__img{
  position:absolute;
  object-fit:cover;
  border-radius:inherit;
}

.about-hero__img--main{
  inset:0;
  width:100%;
  height:100%;
}

.about-hero__img--side{
  z-index:3;
  right:18px;
  top:18px;
  width:42%;
  height:34%;
  border:6px solid rgba(255,250,242,.88);
  box-shadow:0 18px 36px rgba(24,21,18,.22);
}

.about-hero__badge{
  position:absolute;
  z-index:4;
  left:22px;
  right:22px;
  bottom:22px;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:center;
  padding:18px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:22px;
  background:rgba(107,31,18,.86);
  color:#fff7ec;
  backdrop-filter:blur(10px);
}

.about-hero__badge strong{
  font-family:"Fraunces", serif;
  font-size:46px;
  line-height:.9;
}

.about-hero__badge span{
  max-width:240px;
  font-size:14px;
  line-height:1.45;
  font-weight:800;
}

.about-facts{
  padding:16px 0 48px;
}

.facts-strip{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  border-top:1px solid rgba(24,21,18,.10);
  border-bottom:1px solid rgba(24,21,18,.10);
  background:rgba(255,250,242,.58);
}

.fact-item{
  min-height:118px;
  padding:24px 26px;
  border-right:1px solid rgba(24,21,18,.10);
}

.fact-item:last-child{
  border-right:0;
}

.fact-item span{
  display:block;
  margin-bottom:10px;
  color:#b86c00;
  font-size:12px;
  font-weight:800;
  letter-spacing:.6px;
  text-transform:uppercase;
}

.fact-item strong{
  display:block;
  font-family:"Fraunces", serif;
  font-size:clamp(1.5rem, 2.35vw, 2.1rem);
  line-height:1.05;
  letter-spacing:-.02em;
}

.about-story,
.about-process,
.about-principles,
.about-cta{
  padding:44px 0;
}

.section-head{
  max-width:860px;
  margin-bottom:22px;
}

.section-head__title{
  font-size:clamp(2rem, 4vw, 3.4rem);
  line-height:1.02;
}

.story-layout{
  display:grid;
  grid-template-columns:minmax(320px, .88fr) minmax(0, 1.12fr);
  gap:44px;
  align-items:end;
  margin-bottom:38px;
}

.story-copy{
  padding:30px 0 30px 34px;
  border-left:4px solid var(--orange);
}

.story-copy p{
  margin:0;
  color:#473c34;
  font-size:17px;
  line-height:1.9;
}

.story-copy p + p{
  margin-top:16px;
}

.capability-list{
  border-top:1px solid rgba(24,21,18,.10);
}

.capability-row{
  display:grid;
  grid-template-columns:56px minmax(220px, .72fr) minmax(0, 1fr);
  gap:22px;
  align-items:center;
  padding:24px 0;
  border-bottom:1px solid rgba(24,21,18,.10);
}

.capability-row .material-symbols-outlined{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:#b86c00;
  background:rgba(226,142,23,.12);
}

.capability-row h3{
  margin:0;
  font-family:"Fraunces", serif;
  font-size:26px;
  line-height:1.1;
  letter-spacing:-.02em;
}

.capability-row p{
  margin:0;
  color:#4d433b;
  font-size:15px;
  line-height:1.75;
}

.process-layout{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(300px, .78fr) minmax(0, 1.22fr);
  gap:28px;
  align-items:center;
  padding:38px;
  border:1px solid rgba(24,21,18,.10);
  background:linear-gradient(135deg, rgba(255,255,255,.94), rgba(251,243,227,.76)), #fffaf2;
}

.process-layout::before{
  content:"";
  position:absolute;
  inset:0 0 auto auto;
  width:34%;
  height:100%;
  background:linear-gradient(135deg, transparent, rgba(226,142,23,.10));
  pointer-events:none;
}

.process-copy,
.process-timeline{
  position:relative;
  z-index:1;
}

.process-copy p:not(.section-head__kicker){
  margin:18px 0 0;
  color:#4d433b;
  font-size:16px;
  line-height:1.85;
}

.process-timeline{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border-top:1px solid rgba(24,21,18,.10);
}

.process-step{
  display:grid;
  grid-template-columns:72px 1fr;
  column-gap:22px;
  align-items:start;
  padding:24px 0;
  border-bottom:1px solid rgba(24,21,18,.10);
}

.process-step span{
  display:inline-flex;
  color:#b86c00;
  font-family:"Fraunces", serif;
  font-size:34px;
  font-weight:700;
  line-height:1;
}

.process-step h3{
  margin:0;
  font-size:20px;
  line-height:1.25;
}

.process-step p{
  margin:10px 0 0;
  color:#4d433b;
  font-size:14px;
  line-height:1.75;
}

.principles-panel{
  padding:6px 0;
  border-width:1px 0;
  border-style:solid;
  border-color:rgba(24,21,18,.10);
}

.principle-block{
  display:grid;
  grid-template-columns:190px 1fr;
  gap:34px;
  padding:34px 0;
  border-bottom:1px solid rgba(24,21,18,.10);
}

.principle-block:last-child{
  border-bottom:0;
}

.principle-block h2{
  margin-bottom:16px;
  font-size:clamp(2rem, 3vw, 2.8rem);
  line-height:1;
}

.principle-block p{
  margin:0;
  max-width:860px;
  color:#473c34;
  font-size:15px;
  line-height:1.9;
}

.principle-block p + p{
  margin-top:14px;
}

.vision-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:24px;
}

.vision-tags span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:7px 12px;
  border-radius:999px;
  color:#6b1f12;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(107,31,18,.10);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.4px;
}

.about-video{
  padding:34px 0;
}

.about-video__grid{
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  gap:24px;
  align-items:center;
}

.about-video__copy{
  padding-right:10px;
}

.about-video__text{
  margin:18px 0 0;
  max-width:560px;
  color:#4a3f36;
  font-size:16px;
  line-height:1.9;
}

.about-video__frame{
  position:relative;
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(24,21,18,.10);
  background:linear-gradient(145deg, rgba(255,255,255,.88), rgba(255,247,235,.7));
  box-shadow:0 24px 54px rgba(52,34,14,.12);
  padding:14px;
}

.about-video__frame::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top right, rgba(226,142,23,.14), transparent 34%);
  pointer-events:none;
}

.about-video__frame iframe{
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  aspect-ratio:16 / 9;
  border:0;
  border-radius:20px;
}

.about-cta__box{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:28px 30px;
  border-radius:30px;
  border:1px solid rgba(24,21,18,.10);
  background:linear-gradient(135deg, rgba(107,31,18,.96), rgba(184,108,0,.94));
  color:#fff;
}

.about-cta__title{
  max-width:820px;
  font-size:clamp(2rem, 4vw, 3.3rem);
  color:#fff7ec;
}

.about-cta .btn--primary{
  background:#fff3de;
  color:#6b1f12;
  box-shadow:none;
}

@media (max-width: 1100px){
  .contact-hero__grid,
  .contact-page__grid,
  .about-hero__layout,
  .story-layout,
  .about-video__grid,
  .process-layout{
    grid-template-columns:1fr;
  }

  .about-hero__media{
    min-height:420px;
  }

  .facts-strip{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .fact-item:nth-child(2){
    border-right:0;
  }

  .fact-item:last-child{
    grid-column:1 / -1;
    border-top:1px solid rgba(24,21,18,.10);
  }
}

@media (max-width: 980px){
  .about-cta__box{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 640px){
  .contact-hero__title,
  .about-hero__title{
    font-size:clamp(2.1rem, 11vw, 3.3rem);
  }

  .contact-hero__text{
    font-size:15px;
  }

  .contact-hero__card,
  .contact-info,
  .contact-map,
  .contact-form-panel{
    padding:20px;
    border-radius:24px;
  }

  .contact-map__frame{
    border-radius:20px;
  }

  .contact-map__frame iframe{
    min-height:420px;
  }

  .contact-form__grid{
    grid-template-columns:1fr;
  }

  .about-hero{
    padding:42px 0 24px;
  }

  .about-hero__layout{
    gap:24px;
  }

  .about-hero__text{
    font-size:16px;
    line-height:1.72;
  }

  .about-hero__actions .btn{
    width:100%;
  }

  .about-hero__media{
    min-height:340px;
    border-radius:24px;
  }

  .about-hero__img--side{
    width:46%;
    height:30%;
    right:12px;
    top:12px;
    border-width:4px;
  }

  .about-hero__badge{
    left:12px;
    right:12px;
    bottom:12px;
    grid-template-columns:1fr;
    gap:8px;
    padding:14px;
  }

  .about-hero__badge strong{
    font-size:38px;
  }

  .facts-strip{
    grid-template-columns:1fr;
  }

  .fact-item,
  .fact-item:nth-child(2),
  .fact-item:last-child{
    border-right:0;
    border-top:0;
    border-bottom:1px solid rgba(24,21,18,.10);
  }

  .about-video__frame{
    padding:10px;
    border-radius:24px;
  }

  .process-layout,
  .about-cta__box{
    padding:20px;
  }

  .story-copy{
    padding:22px 0 22px 18px;
  }

  .capability-row{
    grid-template-columns:44px 1fr;
    gap:14px;
    align-items:start;
  }

  .capability-row p{
    grid-column:2;
  }

  .principle-block{
    grid-template-columns:1fr;
    gap:12px;
    padding:26px 0;
  }

  .process-step{
    grid-template-columns:1fr;
  }

  .process-step span{
    margin-bottom:8px;
  }
}