/* Chollo Mascota · Evolution visual layer
   Progressive enhancement only: no JS hooks or interaction contracts changed. */
:root{
  --evo-ink:#142f2a;
  --evo-muted:#607069;
  --evo-deep:#0d4034;
  --evo-deep-2:#123d52;
  --evo-coral:#e06b4f;
  --evo-peach:#fff0e8;
  --evo-sky:#eaf4fb;
  --evo-mint:#eaf5ef;
  --evo-cream:#fffaf3;
  --evo-line:#dbe5df;
  --evo-shadow:0 18px 60px rgba(20,47,42,.10);
  --evo-shadow-soft:0 10px 30px rgba(20,47,42,.07);
  --evo-radius:28px;
}

html{scroll-behavior:smooth}
body{
  color:var(--evo-ink);
  background:
    radial-gradient(circle at 8% -10%,rgba(224,107,79,.12),transparent 28rem),
    radial-gradient(circle at 100% 12%,rgba(18,61,82,.09),transparent 30rem),
    linear-gradient(180deg,#fffdf9 0%,#fbfaf6 42%,#f8fbf9 100%);
  background-attachment:fixed;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.35;
  background-image:radial-gradient(rgba(20,47,42,.08) .7px,transparent .7px);
  background-size:18px 18px;
  mask-image:linear-gradient(to bottom,black,transparent 70%);
}

.header{
  margin-top:10px;
  width:min(calc(100% - 28px),1210px);
  border:1px solid rgba(20,47,42,.08);
  border-radius:22px;
  box-shadow:0 14px 40px rgba(20,47,42,.08);
  background:rgba(255,253,249,.86)!important;
  backdrop-filter:blur(20px) saturate(150%);
}
.header .brand{
  font-weight:900;
  letter-spacing:-1.35px;
}
.header .brand span{font-weight:450}
.header .brand b{
  color:var(--evo-coral);
  text-shadow:0 0 20px rgba(224,107,79,.28);
}
.header nav a{
  position:relative;
  border-radius:14px!important;
  transition:transform .18s ease,background-color .18s ease,color .18s ease,box-shadow .18s ease!important;
}
.header nav a:not(.discover-link):hover{transform:translateY(-1px);background:#f0f5f2!important}
.header nav .discover-link{
  background:linear-gradient(135deg,var(--evo-deep),#17634e)!important;
  box-shadow:0 8px 22px rgba(13,64,52,.18);
  border:1px solid rgba(255,255,255,.15);
}
.header nav .discover-link:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(13,64,52,.24)}

main{max-width:1240px}
.intro{
  position:relative;
  overflow:hidden;
  margin-top:28px;
  padding:clamp(32px,5vw,64px)!important;
  border:1px solid rgba(20,47,42,.08);
  border-radius:34px;
  background:
    radial-gradient(circle at 92% 18%,rgba(224,107,79,.22),transparent 18rem),
    radial-gradient(circle at 72% 110%,rgba(55,126,152,.17),transparent 24rem),
    linear-gradient(135deg,#fffaf3 0%,#f8fbf9 55%,#eef6f3 100%);
  box-shadow:var(--evo-shadow);
}
.intro::after{
  content:"";
  position:absolute;
  width:260px;height:260px;
  right:-85px;bottom:-110px;
  border-radius:50%;
  border:34px solid rgba(255,255,255,.45);
  box-shadow:0 0 0 1px rgba(20,47,42,.04);
}
.intro>div:first-child{position:relative;z-index:1}
.intro .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  color:#9f4a39;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(224,107,79,.18);
  box-shadow:0 6px 18px rgba(20,47,42,.04);
}
.intro h1{
  max-width:760px!important;
  font-size:clamp(42px,6vw,76px)!important;
  line-height:.98!important;
  letter-spacing:-.065em!important;
  margin:22px 0 18px!important;
  text-wrap:balance;
}
.intro h1 span{
  background:linear-gradient(100deg,var(--evo-deep),#277560 55%,var(--evo-deep-2));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.intro .lead{font-size:clamp(17px,2vw,20px)!important;line-height:1.65!important;color:#52645c!important}
.stamp{
  position:relative;
  z-index:1;
  min-width:190px;
  justify-content:center;
  border-radius:30px!important;
  background:rgba(255,255,255,.75)!important;
  border:1px solid rgba(20,47,42,.08);
  box-shadow:0 18px 40px rgba(20,47,42,.09);
  backdrop-filter:blur(12px);
}
.stamp strong{color:var(--evo-coral);font-weight:900}

.monthly-feature,.discover-invitation,.brand-directory,.assistant-box,.newsletter,.push-signup,.contact-card,.contact-note,.brand-main-offer,.secondary-offer{
  border-color:rgba(20,47,42,.09)!important;
  box-shadow:var(--evo-shadow-soft);
}
.discover-invitation{
  position:relative;
  overflow:hidden;
  padding:24px 26px!important;
  border-radius:24px!important;
  background:linear-gradient(120deg,#eef7f2,#f8fbf9 58%,#fff1ea)!important;
}
.discover-invitation::after{content:"✦";position:absolute;right:26px;top:-9px;font-size:74px;color:rgba(224,107,79,.12);transform:rotate(12deg)}
.discover-invitation>div,.discover-invitation .discover-link{position:relative;z-index:1}
.discover-invitation strong{font-size:1.28rem!important;letter-spacing:-.025em}
.discover-link{border-radius:14px!important;box-shadow:0 8px 20px rgba(13,64,52,.14)}

.catalog-heading{margin-top:40px!important}
.catalog-heading h2{font-size:clamp(28px,4vw,40px)!important;letter-spacing:-.05em!important}
.catalog-heading span{padding:8px 12px;border:1px solid var(--evo-line);border-radius:999px;background:rgba(255,255,255,.72)}
.catalog-search{font-size:.82rem!important;letter-spacing:.03em;text-transform:uppercase}
.catalog-search input,.filters select,.filters input{
  min-height:54px;
  border-radius:16px!important;
  border-color:#cad8d0!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 6px 18px rgba(20,47,42,.04)!important;
}
.catalog-search input:focus,.filters select:focus,.filters input:focus{border-color:#5f8d79!important;box-shadow:0 0 0 4px rgba(95,141,121,.12)!important}
.filters-panel{
  padding:18px;
  border:1px solid rgba(20,47,42,.07);
  border-radius:22px;
  background:rgba(255,255,255,.62);
  backdrop-filter:blur(10px);
}
.quick-filters button,.clear-filters,.favorite-brand{
  border-radius:999px!important;
  transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease!important;
}
.quick-filters button:hover,.clear-filters:hover,.favorite-brand:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(20,47,42,.08)}

.offers{gap:26px!important}
.offers .card{
  position:relative;
  overflow:hidden;
  border-radius:28px!important;
  background:rgba(255,255,255,.93)!important;
  border:1px solid rgba(20,47,42,.08)!important;
  box-shadow:0 14px 38px rgba(20,47,42,.07)!important;
  isolation:isolate;
}
.offers .card::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:4px;
  background:linear-gradient(90deg,var(--accent,var(--evo-deep)),var(--evo-coral));
  opacity:.7;
}
.card.premium{
  border-color:rgba(182,142,54,.28)!important;
  background:linear-gradient(180deg,#fffefb,#fff 46%)!important;
}
.card.premium::after{
  content:"✦";
  position:absolute;
  right:18px;top:12px;
  color:#b78b32;
  opacity:.28;
  font-size:26px;
  pointer-events:none;
}
.brand-visual .brand-identity{
  background:linear-gradient(180deg,#fff,#fbfcfb)!important;
  border-color:#edf2ef!important;
  border-radius:20px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);
}
.card .brand-visual .amount{
  box-shadow:0 8px 24px rgba(20,47,42,.10),inset 0 0 0 4px rgba(255,255,255,.7)!important;
}
.card h4{font-size:1.28rem!important;letter-spacing:-.035em!important}
.coupon{
  border-radius:16px!important;
  background:linear-gradient(135deg,#f3f9f6,#fff)!important;
  border-color:#9ebbaa!important;
}
.visit{
  border-radius:15px!important;
  background:linear-gradient(135deg,var(--evo-deep),#17634e)!important;
  box-shadow:0 9px 20px rgba(13,64,52,.17);
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease!important;
}
.visit:hover{transform:translateY(-1px);box-shadow:0 13px 28px rgba(13,64,52,.23);filter:saturate(1.08)}
.brand-page-link{font-weight:650}

.brand-directory,.assistant-box,.newsletter,.push-signup{
  border-radius:24px!important;
  background:rgba(255,255,255,.78)!important;
  backdrop-filter:blur(10px);
}
.trust{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.trust>div{
  padding:20px;
  border:1px solid rgba(20,47,42,.08);
  border-radius:20px;
  background:rgba(255,255,255,.72);
  box-shadow:0 8px 24px rgba(20,47,42,.05);
}
.trust strong{display:block;font-size:1rem;margin-bottom:5px}
.trust span{color:var(--evo-muted)}

.brand-heading{padding:22px 0 6px}
.brand-page-logo{border-radius:22px!important;box-shadow:var(--evo-shadow-soft)}
.brand-heading h1,.contact-intro h1,.legal-page h1{letter-spacing:-.055em!important}
.brand-main-offer{border-radius:28px!important;background:linear-gradient(145deg,#fff,#fbfdfc)!important}
.secondary-offer{border-radius:22px!important}
.brand-coupon{border-radius:16px!important;background:linear-gradient(135deg,#edf7f1,#fff)!important}

.contact-layout{gap:34px!important}
.contact-intro,.contact-card{position:relative}
.contact-card{border-radius:28px!important;background:rgba(255,255,255,.9)!important}
.contact-note{border-radius:20px!important;background:linear-gradient(135deg,#fff7f1,#fff)!important}
.contact-card input,.contact-card select,.contact-card textarea{border-radius:14px!important}

.public-footer{
  width:min(calc(100% - 28px),1210px);
  margin:44px auto 18px!important;
  padding:30px!important;
  border:1px solid rgba(20,47,42,.08)!important;
  border-radius:28px;
  background:linear-gradient(135deg,#12352f,#173f37)!important;
  color:#fff!important;
  box-shadow:0 16px 44px rgba(20,47,42,.14);
}
.public-footer p,.public-footer a{color:rgba(255,255,255,.8)!important}
.public-footer .brand{color:#fff!important}.public-footer .brand b{color:#ff9a7f!important}
.public-footer .powered{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.94)}
.public-footer .powered span{color:#42544c!important}

.mobile-navigation{
  border-top:0!important;
  box-shadow:0 -12px 34px rgba(20,47,42,.11);
  background:rgba(255,255,255,.92)!important;
  backdrop-filter:blur(20px) saturate(150%)!important;
}
.mobile-navigation a{border-radius:16px!important}
.mobile-navigation a[aria-current]{background:linear-gradient(135deg,#e9f5ef,#f6fbf8)!important}

.chat-launcher{box-shadow:0 14px 36px rgba(20,47,42,.18)!important;border:1px solid rgba(255,255,255,.7)!important}

@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .offers .card:hover{transform:translateY(-7px)!important;box-shadow:0 24px 60px rgba(20,47,42,.13)!important}
  .offers .card:hover .brand-visual .brand-identity{transform:scale(1.015)}
  .brand-visual .brand-identity{transition:transform .22s ease}
}

@media(max-width:800px){
  .intro{padding:34px 26px!important;border-radius:28px}
  .intro h1{font-size:clamp(38px,11vw,58px)!important}
  .trust{grid-template-columns:1fr!important}
  .catalog-heading span{display:none}
}
@media(max-width:650px){
  body{background-attachment:scroll}
  .header{width:calc(100% - 18px);margin-top:8px;border-radius:18px;padding:13px 14px!important}
  .has-mobile-nav .header nav{left:0!important;right:0!important;border-radius:20px!important;box-shadow:0 20px 48px rgba(20,47,42,.17)!important}
  main{padding-inline:14px!important}
  .intro{margin-top:16px;padding:30px 22px!important;border-radius:26px}
  .intro::after{width:180px;height:180px;right:-78px;bottom:-85px;border-width:24px}
  .intro h1{font-size:clamp(38px,12vw,52px)!important;line-height:1!important}
  .intro .lead{font-size:16px!important}
  .discover-invitation{align-items:flex-start!important;flex-direction:column;padding:20px!important}
  .discover-invitation .discover-link{width:100%}
  .filters-panel{padding:14px}
  .offers{gap:18px!important}
  .offers .card{border-radius:24px!important;padding:20px!important}
  .public-footer{width:calc(100% - 18px);margin:28px auto 84px!important;padding:24px!important;border-radius:24px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.offers .card,.brand-visual .brand-identity,.header nav a,.visit{transition:none!important}}
