/* =========================================================
   LANDING "HUELLITAS QUE PREMIAN" — Animal Center
   Pega este archivo en tu layout.css (o cárgalo como CSS aparte).
   Todo va prefijado con .ac- para NO chocar con el tema.
   (Montserrat ya lo carga el main, por eso no se importa aquí.)
   ========================================================= */
.ac-landing{
  --ac-pink:#EA118B;        /* = --colorAnimalCenter */
  --ac-cyan:#00AEEF;        /* azul secundario marca */
  --ac-purple:#662D91;      /* = --colorCta */
  --ac-dark:#1D1D2B;
  --ac-orange:#F5A623;      /* 3er lugar */
  --ac-gold:#FAB031;        /* = --colorAmarillo (1er lugar) */
  --ac-muted:#6B7280;
  --ac-cyan-soft:#E3F6FE;
  --ac-line:#EAECEF;
  --ac-maxw:1360px;
  font-family:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ac-dark);-webkit-font-smoothing:antialiased;line-height:1.45;
}
.ac-landing *,.ac-landing *::before,.ac-landing *::after{box-sizing:border-box;}
.ac-landing p,.ac-landing h2{margin:0;text-wrap:balance;}
.ac-container{max-width:var(--ac-maxw);margin:0 auto;padding:0 24px;width:95%;}
.ac-section-title{font-size:28px;font-weight:700;color:var(--ac-dark);text-align:center;margin:0 0 28px;letter-spacing:-.2px;}

/* HERO */
.ac-hero{
  position:relative;width:100%;
  --hero-img:url('https://cdn1.totalcommerce.cloud/animalcenter/web_content/assets/herodesk-landing_11zon.webp');
  background:#f3f4f6 var(--hero-img) center top/cover no-repeat;
  aspect-ratio:8001/3251;min-height:240px;
}
.ac-hero__cta{
  position:absolute;left:50%;bottom:13%;transform:translateX(-50%);
  display:inline-flex;align-items:center;gap:10px;padding:14px 34px;border-radius:999px;border:0;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:18px;color:#fff;background:linear-gradient(180deg,#2ec3f4,#00AEEF);
  box-shadow:0 10px 24px rgba(0,174,239,.45);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease;
}
.ac-hero__cta:hover{transform:translateX(-50%) translateY(-2px);box-shadow:0 14px 30px rgba(0,174,239,.55);}
.ac-hero__cta svg{width:22px;height:22px;}
.ac-hero__cta::before{content:"";width:22px;height:22px;flex:0 0 auto;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27%23ffffff%27%3E%3Cpath%20d%3D%27M5.5%2013.5a2%202%200%201%200%200-4%202%202%200%200%200%200%204Zm13%200a2%202%200%201%200%200-4%202%202%200%200%200%200%204ZM9%208a2%202%200%201%200%200-4%202%202%200%200%200%200%204Zm6%200a2%202%200%201%200%200-4%202%202%200%200%200%200%204Zm-3%202.2c-2.3%200-4.4%201.6-5%203.8-.4%201.6.8%203%202.4%203%20.9%200%201.7-.4%202.6-.4s1.7.4%202.6.4c1.6%200%202.8-1.4%202.4-3-.6-2.2-2.7-3.8-5-3.8Z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}

/* PASOS */
.ac-steps-wrap{position:relative;z-index:2;margin-top:-70px;}
.ac-steps{background:#fff;border-radius:24px;padding:34px 28px;box-shadow:0 18px 50px rgba(16,32,70,.10);display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
.ac-step{text-align:center;padding:0 8px;position:relative;}
.ac-step:not(:last-child)::after{content:"";position:absolute;right:-9px;top:14px;bottom:14px;width:1px;background:var(--ac-line);}
.ac-step__ico{width:52px;height:52px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:var(--ac-cyan-soft);color:var(--ac-cyan);}
.ac-step__ico svg{width:28px;height:28px;}
/* Iconos de los pasos como background (data-URI) — robusto ante editores que borran <svg> inline */
.ac-step__ico{background-repeat:no-repeat;background-position:center;background-size:30px;}
.ac-step__ico--dog{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2300AEEF%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M8%205C5.5%204.4%204%206.4%204%209c0%201.7.6%203.2%201.7%204.3%27%2F%3E%3Cpath%20d%3D%27M16%205c2.5-.6%204%201.4%204%204%200%201.7-.6%203.2-1.7%204.3%27%2F%3E%3Cpath%20d%3D%27M8%205c1.3-1%206.7-1%208%200%201.8%201.6%202.6%204.1%202.6%206.6%200%203.7-3%206.6-6.6%206.6S5.4%2015.3%205.4%2011.6C5.4%209.1%206.2%206.6%208%205Z%27%2F%3E%3Ccircle%20cx%3D%279.6%27%20cy%3D%2711.4%27%20r%3D%270.95%27%20fill%3D%27%2300AEEF%27%20stroke%3D%27none%27%2F%3E%3Ccircle%20cx%3D%2714.4%27%20cy%3D%2711.4%27%20r%3D%270.95%27%20fill%3D%27%2300AEEF%27%20stroke%3D%27none%27%2F%3E%3Cellipse%20cx%3D%2712%27%20cy%3D%2714%27%20rx%3D%271.3%27%20ry%3D%271%27%20fill%3D%27%2300AEEF%27%20stroke%3D%27none%27%2F%3E%3Cpath%20d%3D%27M12%2015v1M10.4%2016.2c.6.6%202.6.6%203.2%200%27%2F%3E%3C%2Fsvg%3E");}
.ac-step__ico--cat{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2300AEEF%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4.5%205%20L8%209.2%20C9.2%208.6%2010.6%208.3%2012%208.3%20C13.4%208.3%2014.8%208.6%2016%209.2%20L19.5%205%20C19.2%207.4%2018.8%209.4%2018%2011%20C16.5%2014.6%2014%2016.2%2012%2016.2%20C10%2016.2%207.5%2014.6%206%2011%20C5.2%209.4%204.8%207.4%204.5%205%20Z%27%2F%3E%3Ccircle%20cx%3D%279.6%27%20cy%3D%2712.4%27%20r%3D%270.95%27%20fill%3D%27%2300AEEF%27%20stroke%3D%27none%27%2F%3E%3Ccircle%20cx%3D%2714.4%27%20cy%3D%2712.4%27%20r%3D%270.95%27%20fill%3D%27%2300AEEF%27%20stroke%3D%27none%27%2F%3E%3Cpath%20d%3D%27M12%2013.8l-1%201.2h2z%27%20fill%3D%27%2300AEEF%27%20stroke%3D%27none%27%2F%3E%3Cpath%20d%3D%27M3.4%2012.6%206.2%2013M3.4%2014.8%206.2%2014.2M20.6%2012.6%2017.8%2013M20.6%2014.8%2017.8%2014.2%27%2F%3E%3C%2Fsvg%3E");}
.ac-step__t{font-weight:800;font-size:16px;color:var(--ac-dark);margin:0 0 6px;}
.ac-step__d{font-size:13px;color:var(--ac-muted);margin:0;line-height:1.4;}

/* TABLA + PREMIACIÓN */
.ac-grid2{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:start;margin-top:64px;}
.ac-h2{font-size:28px;font-weight:800;color:var(--ac-dark);margin:0 0 4px;font-family:inherit;}
.ac-sub{font-size:15px;color:var(--ac-muted);margin:0 0 22px;}
.ac-table{width:100%;border-collapse:collapse;}
.ac-table thead th{font-size:14px;font-weight:600;color:var(--ac-muted);text-align:center;padding:0 12px 16px;}
.ac-table tbody tr{border-top:1px solid var(--ac-line);}
.ac-table tbody td{padding:20px 12px;text-align:center;vertical-align:middle;}
.ac-table .ac-monto{font-weight:800;font-size:17px;color:var(--ac-dark);}
.ac-table .ac-huellitas{font-weight:800;font-size:16px;color:var(--ac-pink);white-space:nowrap;}
.ac-nota{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--ac-cyan-soft);color:var(--ac-cyan);font-size:12px;font-weight:700;}
.ac-min-banner{margin-top:18px;background:var(--ac-pink);color:#fff;border-radius:12px;padding:14px 24px;text-align:center;font-weight:800;font-size:18px;text-transform:lowercase;}
.ac-prizes{display:flex;flex-direction:column;gap:18px;}
.ac-prize{display:flex;align-items:center;gap:18px;border:2px solid var(--ac-line);border-radius:18px;padding:20px 22px;background:#fff;}
.ac-prize__ico{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:26px;flex:0 0 auto;}
.ac-prize__rank{font-size:18px;font-weight:800;margin:0 0 2px;}
.ac-prize__name{font-size:15px;font-weight:600;color:var(--ac-dark);margin:0;}
.ac-prize--gold{border-color:var(--ac-gold);background:#FFFBF0;}
.ac-prize--gold .ac-prize__ico{background:#FFE9A8;}
.ac-prize--gold .ac-prize__rank{color:#D99400;}
.ac-prize--silver{border-color:#E3E6EA;background:#F7F8FA;}
.ac-prize--silver .ac-prize__ico{background:#E7EAEE;}
.ac-prize--silver .ac-prize__rank{color:#6B7280;text-transform:uppercase;}
.ac-prize--bronze{border-color:var(--ac-orange);background:#FFF6EE;}
.ac-prize--bronze .ac-prize__ico{background:#FFE2C4;}
.ac-prize--bronze .ac-prize__rank{color:#E07B1A;text-transform:uppercase;}

/* PRODUCTOS */
.ac-products{margin-top:72px;}
.ac-landing .ac-products .container_div{grid-template-columns:repeat(5,1fr);padding:20px 0;}

/* FORMULARIO */
.ac-form-section{margin-top:80px;margin-bottom:80px;}
.ac-form-card{display:grid;grid-template-columns:560px 1fr;border-radius:32px;overflow:hidden;box-shadow:0 18px 50px rgba(16,32,70,.08);border:1px solid var(--ac-line);background:#fff;}
.ac-form-aside{background:linear-gradient(90deg,rgba(234,17,139,.20),rgba(0,174,239,.20));min-height:520px;}
.ac-form-body{padding:44px 48px;}
.ac-form-body h2{font-size:26px;font-weight:800;margin:0 0 4px;color:var(--ac-dark);font-family:inherit;}
.ac-form-body .ac-sub{margin-bottom:26px;}
.ac-field{margin-bottom:18px;}
.ac-field label{display:block;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--ac-muted);margin-bottom:8px;}
.ac-field input{width:100%;padding:14px 16px;height:auto;border:1px solid #D9DDE3;border-radius:12px;font-family:inherit;font-size:15px;color:var(--ac-dark);background:#fff;outline:none;transition:border-color .15s ease,box-shadow .15s ease;}
.ac-field input::placeholder{color:#AEB4BE;}
.ac-field input:focus{border-color:var(--ac-cyan);box-shadow:0 0 0 3px rgba(0,174,239,.15);}
.ac-drop{display:block;border:2px dashed #D9DDE3;border-radius:14px;padding:26px;text-align:center;cursor:pointer;transition:border-color .15s ease,background .15s ease;}
.ac-drop:hover,.ac-drop.is-drag{border-color:var(--ac-cyan);background:#F3FBFE;}
.ac-drop__title{font-weight:700;color:var(--ac-dark);margin:8px 0 4px;}
.ac-drop__hint{font-size:12px;color:var(--ac-muted);margin:0;}
.ac-drop__emoji{font-size:26px;}
.ac-submit{width:100%;margin-top:8px;padding:16px;height:auto;border:0;border-radius:12px;cursor:pointer;font-family:inherit;font-weight:800;font-size:16px;color:#fff;letter-spacing:.3px;background:linear-gradient(180deg,#2ec3f4,#00AEEF);box-shadow:0 10px 24px rgba(0,174,239,.35);transition:transform .15s ease;}
.ac-submit:hover{transform:translateY(-2px);}

/* --- Estilo para el formulario real insertado con [[formulario(1)]] --- */
.ac-form-body label{display:block;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--ac-muted);margin-bottom:8px;}
.ac-form-body input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=file]),
.ac-form-body select,
.ac-form-body textarea{
  width:100%;height:auto;padding:14px 16px;margin-bottom:18px;
  border:1px solid #D9DDE3;border-radius:12px;font-family:inherit;font-size:15px;color:var(--ac-dark);background:#fff;
}
.ac-form-body input:focus,.ac-form-body select:focus,.ac-form-body textarea:focus{
  border-color:var(--ac-cyan);box-shadow:0 0 0 3px rgba(0,174,239,.15);outline:none;
}
.ac-form-body button,
.ac-form-body input[type=submit]{
  width:100%;height:auto;padding:16px;margin-top:8px;border:0;border-radius:12px;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:16px;color:#fff;letter-spacing:.3px;
  background:linear-gradient(180deg,#2ec3f4,#00AEEF);box-shadow:0 10px 24px rgba(0,174,239,.35);transition:transform .15s ease;
}
.ac-form-body button:hover,.ac-form-body input[type=submit]:hover{transform:translateY(-2px);}

/* RESPONSIVE */
@media (max-width:1024px){
  .ac-grid2{grid-template-columns:1fr;}
  .ac-form-card{grid-template-columns:1fr;}
  .ac-form-aside{display:none;}        /* gradiente oculto en móvil/tablet */
  .ac-landing .ac-products .container_div{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:760px){
  .ac-steps{grid-template-columns:repeat(2,1fr);gap:22px 12px;}
  .ac-step:not(:last-child)::after{display:none;}
  .ac-steps-wrap{margin-top:-40px;}
  .ac-section-title,.ac-h2,.ac-form-body h2{font-size:22px;}
  .ac-landing .ac-products .container_div{grid-template-columns:repeat(2,1fr);}
  .ac-form-body{padding:28px 22px;}
  .ac-hero{--hero-img:url('https://cdn1.totalcommerce.cloud/animalcenter/web_content/assets/heromobile-landing_11zon.webp');aspect-ratio:2334/3501;}
  .ac-hero__cta{font-size:15px;padding:11px 24px;bottom:6%;z-index: 99;}
  .ac-table{table-layout:fixed;}
  .ac-table th,.ac-table td{padding:12px 4px;word-break:break-word;}
  .ac-table thead th:nth-child(1),.ac-table td:nth-child(1){width:28%;}
  .ac-table thead th:nth-child(2),.ac-table td:nth-child(2){width:34%;}
  .ac-table thead th:nth-child(3),.ac-table td:nth-child(3){width:38%;}
  .ac-table thead th{font-size:11px;padding-bottom:10px;}
  .ac-table .ac-monto{font-size:13px;}
  .ac-table .ac-huellitas{font-size:12px;white-space:normal;}
  .ac-nota{font-size:10px;padding:4px 8px;white-space:normal;line-height:1.2;}
  .ac-min-banner{font-size:14px;padding:12px 16px;}
}
