
:root{
  --white:#ffffff;
  --black:#111111;
  --red:#b5162c;
  --gold:#c9971a;
  --yellow:#ffd44a;
  --green:#238a4d;
  --muted:#5b534d;
  --border:rgba(17,17,17,.10);
  --shadow:0 18px 48px rgba(60,20,10,.12);
  --radius-xl:34px;
  --radius-lg:26px;
  --radius-md:18px;
  --container:min(1160px, calc(100% - 32px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--black);
  background:
    radial-gradient(circle at top left, rgba(255,212,74,.18), transparent 18%),
    radial-gradient(circle at top right, rgba(181,22,44,.08), transparent 18%),
    linear-gradient(180deg,#fff 0%,#fffaf3 38%,#fff 100%);
  line-height:1.6;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.container{width:var(--container);margin:0 auto;position:relative;z-index:2}

.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.95);
  border-bottom:1px solid rgba(201,151,26,.18);
  box-shadow:0 8px 20px rgba(0,0,0,.04);
}
.nav-wrap{
  min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.brand{
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(2rem,3vw,2.7rem);
  font-weight:700;letter-spacing:.05em;
  background:linear-gradient(135deg,var(--black),var(--red) 35%,var(--gold) 70%,var(--green));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.site-nav{display:flex;gap:22px;align-items:center}
.site-nav a{font-weight:700}
.site-nav a:hover{color:var(--red)}
.nav-cta{
  padding:11px 18px;border-radius:999px;border:1px solid rgba(201,151,26,.25);
  background:linear-gradient(135deg,#fff0b0,#ffe17a 38%,#ffd8a7 75%,#e5f6d6);
}
.menu-toggle{display:none;border:0;background:transparent;font-size:1.8rem}

.hero{
  position:relative;padding:60px 0 40px;
  background:
    radial-gradient(circle at 8% 8%, rgba(255,212,74,.28), transparent 18%),
    radial-gradient(circle at 92% 14%, rgba(181,22,44,.10), transparent 18%),
    linear-gradient(180deg,#ffffff 0%,#fff7ea 100%);
}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:36px;align-items:center}
.eyebrow,.section-kicker{
  display:inline-block;padding:8px 15px;border-radius:999px;
  font-size:.84rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:#5e1d07;
  background:linear-gradient(135deg,#fff0b0,#fff9db 45%,#ffe4a8 70%,#e7f9d9);
  border:1px solid rgba(201,151,26,.18);
}
.hero h1,.section-heading h2,.panel h2,.final-cta-box h2,.footer-grid h3{
  font-family:Georgia, "Times New Roman", serif;
  line-height:.98;
}
.hero h1{font-size:clamp(3.2rem,7vw,6rem);margin:16px 0 18px}
.hero h1 span{color:var(--red)}
.lead{font-size:clamp(1.12rem,2vw,1.35rem);font-weight:800;margin:0 0 10px}
.sublead{margin:0 0 28px;color:var(--muted)}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:28px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:14px 22px;border-radius:999px;font-weight:800;
  transition:transform .2s ease, box-shadow .2s ease;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.12)}
.btn-primary{
  background:linear-gradient(135deg,var(--black) 0%, var(--red) 34%, var(--gold) 72%, var(--green) 100%);
  color:#fff;
}
.btn-secondary{background:#fff;border:1px solid rgba(201,151,26,.22)}
.btn-light{background:#fff;color:#4b1700}
.hero-points{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hero-points article,.info-card,.panel,.gallery-item,.hero-card,.final-cta-box,.glass-card{
  background:#fff;border:1px solid var(--border);box-shadow:var(--shadow)
}
.hero-points article{
  padding:18px;border-radius:var(--radius-md);
  background:linear-gradient(180deg,#fff,#fff7df);
}
.hero-points strong{display:block;font-size:.82rem;text-transform:uppercase;color:var(--red);margin-bottom:6px}
.hero-card{
  border-radius:34px;overflow:hidden;padding:16px;position:relative;
  background:linear-gradient(135deg,var(--black) 0%, var(--red) 18%, var(--gold) 60%, var(--green) 100%);
}
.hero-card img{width:100%;height:auto;max-height:680px;object-fit:contain;border-radius:22px;background:#fff}

.section{padding:74px 0;position:relative}
.intro-grid,.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}
.section-heading.center{text-align:center;max-width:860px;margin:0 auto 36px}
.section-heading h2,.panel h2,.final-cta-box h2{font-size:clamp(2.3rem,4vw,3.9rem);margin:14px 0}
.section-heading p,.glass-card p,.panel p,.final-cta-box p,.footer-grid p{margin:0;color:var(--muted)}
.glass-card{
  padding:30px;border-radius:var(--radius-lg);
  background:linear-gradient(135deg,#ffffff,#fff9eb);
}
.cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.info-card{
  padding:28px;min-height:190px;border-radius:var(--radius-lg);
  background:linear-gradient(180deg,#ffffff 0%,#fff8e6 60%,#fff2d0 100%);
}
.card-label{
  display:inline-block;padding:8px 12px;border-radius:999px;margin-bottom:18px;
  font-size:.84rem;font-weight:800;color:#5e1d07;
  background:linear-gradient(135deg, rgba(255,212,74,.28), rgba(181,22,44,.16));
}
.info-card h3{font-size:1.5rem;line-height:1.2;margin:0}

.gallery{
  background:
    radial-gradient(circle at 14% 10%, rgba(255,212,74,.20), transparent 16%),
    radial-gradient(circle at 88% 82%, rgba(181,22,44,.12), transparent 18%),
    linear-gradient(180deg,#fffdfa 0%,#fff5ea 100%);
}
.gallery-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:22px;align-items:start}
.gallery-item{
  border-radius:var(--radius-xl);overflow:hidden;padding:14px;position:relative;
  background:linear-gradient(135deg,var(--black) 0%, var(--red) 18%, var(--gold) 55%, var(--yellow) 75%, var(--green) 100%);
}
.gallery-item img{width:100%;height:auto;object-fit:contain;border-radius:22px;background:#fff}
.gallery-item-large{grid-row:span 2}

.panel{
  padding:36px;border-radius:var(--radius-lg);
  background:linear-gradient(180deg,#fff,#fff7e5);
}
.panel-accent{
  background:linear-gradient(135deg,var(--black), var(--red) 34%, #9f6a05 62%, var(--gold) 82%, var(--green) 100%);
  color:#fff;
}
.panel-accent .section-kicker{
  color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.16)
}
.panel-accent p{color:#fff}
.whatsapp-number{font-size:clamp(1.85rem,4vw,2.8rem);font-weight:800;line-height:1;margin:16px 0 24px}

.final-cta-box{
  border-radius:38px;padding:48px 28px;text-align:center;
  background:linear-gradient(135deg,#fff2b5 0%, #fffef9 26%, #fff3dd 52%, #ffe3b0 70%, #ecf8db 100%);
}
.site-footer{
  padding:28px 0 92px;border-top:1px solid var(--border);
  background:linear-gradient(180deg,#fffefb,#fff4e5);
}
.footer-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px}
.footer-grid h3{font-size:2rem;margin:0 0 10px}
.floating-whatsapp{
  position:fixed;right:18px;bottom:18px;z-index:120;
  padding:14px 18px;border-radius:999px;
  background:linear-gradient(135deg,#12703d,var(--green));
  color:#fff;font-weight:800;box-shadow:0 18px 30px rgba(18,112,61,.28);
}
.colorful-frame{position:relative}
.colorful-frame::before{
  content:"";position:absolute;inset:-2px;border-radius:inherit;padding:2px;
  background:linear-gradient(135deg,var(--black),var(--red),var(--gold),var(--green));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;
}
.maguey{
  position:absolute;width:210px;height:210px;opacity:.24;pointer-events:none;z-index:1;
  background-repeat:no-repeat;background-position:center;background-size:contain;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%23228f4e' stroke-width='10' stroke-linecap='round'%3E%3Cpath d='M110 110 L110 18'/%3E%3Cpath d='M110 110 C98 78 78 54 46 28'/%3E%3Cpath d='M110 110 C86 92 58 82 18 78'/%3E%3Cpath d='M110 110 C122 78 142 54 174 28'/%3E%3Cpath d='M110 110 C134 92 162 82 202 78'/%3E%3Cpath d='M110 110 C90 110 60 124 36 152'/%3E%3Cpath d='M110 110 C130 110 160 124 184 152'/%3E%3Cpath d='M110 110 C98 130 90 162 92 202'/%3E%3Cpath d='M110 110 C122 130 130 162 128 202'/%3E%3C/g%3E%3C/svg%3E");
}
.maguey-left{left:-46px;bottom:16px}
.maguey-right{right:-40px;top:8px;transform:rotate(10deg)}
.maguey-gallery{right:-32px;bottom:14px}

@media (max-width:1024px){
  .hero-grid,.intro-grid,.split-grid,.gallery-grid{grid-template-columns:1fr 1fr}
  .cards-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-item-large{grid-row:auto}
}
@media (max-width:760px){
  .menu-toggle{display:block}
  .site-nav{
    position:absolute;top:calc(100% + 1px);left:0;right:0;width:var(--container);margin:0 auto;
    display:none;flex-direction:column;align-items:stretch;gap:10px;padding:16px;background:#fff;
    border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)
  }
  .site-nav.open{display:flex}
  .hero,.section{padding:56px 0}
  .hero-grid,.intro-grid,.split-grid,.cards-grid,.gallery-grid,.hero-points{grid-template-columns:1fr}
  .info-card,.panel,.final-cta-box,.glass-card{padding:24px}
  .site-footer{padding-bottom:100px}
  .floating-whatsapp{right:14px;bottom:14px}
  .maguey{width:136px;height:136px}
  .maguey-left{left:-20px}
  .maguey-right{right:-18px}
}
