:root{
  --purple:#3b176b;
  --purple-2:#5b2b83;
  --gold:#d89a24;
  --green:#137a39;
  --cream:#fffaf5;
  --ink:#25213b;
  --muted:#6c6877;
  --border:#eadfd9;
  --shadow:0 10px 30px rgba(58,31,82,.09);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(circle at 0 0, rgba(197,175,220,.24), transparent 22rem),
    radial-gradient(circle at 100% 100%, rgba(205,185,227,.22), transparent 25rem),
    linear-gradient(180deg,#fffdfa 0%,#fffaf5 52%,#fbf6fb 100%);
  font-family:"DM Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body:before, body:after{
  content:"";
  position:fixed;
  width:240px;height:240px;
  border-radius:50%;
  filter:blur(55px);
  opacity:.18;
  z-index:-1;
}
body:before{background:#c8b5dc;left:-90px;top:20%}
body:after{background:#f0cf87;right:-100px;bottom:5%}
main{width:min(1440px,100%);margin:auto;padding:0 26px 40px}

.hero{
  position:relative;
  text-align:center;
  padding:42px 20px 30px;
  overflow:hidden;
}
.brand-badge{
  width:142px;height:142px;
  margin:0 auto 18px;
  border-radius:50%;
  padding:3px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.9);
  border:2px solid rgba(91,43,131,.3);
  box-shadow:0 8px 26px rgba(60,24,100,.12), inset 0 0 0 3px #fff;
}
.brand-badge img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:50%;
}
.eyebrow{
  margin:0 0 3px;
  letter-spacing:.24em;
  font-size:14px;
  color:#55427c;
  font-weight:600;
}
.hero h1{
  margin:0;
  color:var(--purple);
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:600;
  font-size:clamp(48px,7vw,88px);
  line-height:1.03;
}
.ornament{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:13px;
  margin:13px auto;
  color:var(--gold);
}
.ornament span{width:98px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.ornament span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.ornament b{font-size:29px;font-weight:400}
.intro{
  max-width:690px;
  margin:0 auto;
  font-size:19px;
  line-height:1.55;
}
.intro strong{color:#4f2093}
.hero-leaf{
  position:absolute;
  width:190px;height:190px;
  opacity:.22;
  background:
    radial-gradient(ellipse at center, #7d9a78 0 34%, transparent 35%) 30px 22px/56px 30px no-repeat,
    radial-gradient(ellipse at center, #9ab291 0 34%, transparent 35%) 78px 60px/60px 31px no-repeat,
    linear-gradient(105deg,transparent 48%,#889d80 49% 51%,transparent 52%);
  transform:rotate(-25deg)
}
.hero-leaf-left{left:-30px;top:38px}
.hero-leaf-right{right:-40px;top:32px;transform:scaleX(-1) rotate(-25deg);filter:hue-rotate(35deg)}

.community-section{padding:10px 0 18px}
.community-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.community-card{
  position:relative;
  display:flex;
  gap:16px;
  align-items:center;
  min-height:210px;
  padding:20px 18px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(229,215,207,.86);
  border-radius:22px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(8px);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.community-card:hover{
  transform:translateY(-3px);
  box-shadow:0 15px 35px rgba(58,31,82,.13);
  border-color:#dfd0e8;
}
.number{
  position:absolute;
  top:13px;left:13px;
  width:32px;height:32px;
  display:grid;place-items:center;
  border-radius:50%;
  background:var(--purple);
  color:white;
  font-weight:700;
  z-index:2;
  box-shadow:0 4px 9px rgba(59,23,107,.2);
}
.community-image{
  width:116px;height:116px;
  flex:0 0 116px;
  border-radius:50%;
  object-fit:cover;
  border:5px solid #fff;
  outline:2px solid #decce8;
  box-shadow:0 8px 20px rgba(56,35,64,.13);
}
.community-content{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.community-content h2{
  margin:0 0 8px;
  color:var(--purple);
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:500;
  font-size:27px;
  line-height:1.08;
}
.community-content p{
  margin:0 0 15px;
  color:#4f4a5e;
  line-height:1.48;
  font-size:14px;
}
.join-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 13px;
  border:1px solid #8fc49d;
  border-radius:999px;
  color:#106d31;
  background:#fbfffb;
  text-decoration:none;
  font-weight:700;
  font-size:14px;
  transition:all .18s ease;
  white-space:nowrap;
}
.join-btn:hover{background:#effaf1;border-color:#4fa866;transform:translateY(-1px)}
.wa-icon{
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
  color:#25d366;
  flex:0 0 22px;
}
.wa-icon svg{width:22px;height:22px;display:block}

.connect-section{padding:8px 5% 20px}
.section-title{
  display:flex;align-items:center;justify-content:center;gap:14px;
  margin:6px auto 17px;
}
.section-title span{width:80px;height:1px;background:var(--gold)}
.section-title h2{
  margin:0;
  color:var(--purple);
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:500;
  font-size:30px;
}
.connect-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}
.connect-card{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  min-height:136px;
  padding:24px 28px;
  border-radius:24px;
  text-decoration:none;
  color:var(--ink);
  transition:transform .2s ease, box-shadow .2s ease;
  box-shadow:0 8px 24px rgba(62,41,78,.07);
  border:1px solid rgba(255,255,255,.68);
}
.connect-card:hover{transform:translateY(-3px);box-shadow:0 13px 32px rgba(62,41,78,.12)}
.connect-card.instagram{background:linear-gradient(135deg,#fff0f3,#f7e8f0 48%,#f4eff9)}
.connect-card.review{background:linear-gradient(135deg,#eef7ff,#ecf4fd 48%,#edf4fb)}
.social-icon{
  width:72px;height:72px;
  border-radius:50%;
  display:grid;place-items:center;
  background:white;
  font-size:48px;
  box-shadow:0 6px 18px rgba(58,31,82,.07);
}
.instagram-icon{
  color:#d72976;
  border:2px solid rgba(215,41,118,.15);
}
.star-icon{color:#f4a900;font-size:54px}
.connect-card small{display:block;font-size:15px;color:#5d5870}
.connect-card strong{display:block;font-size:27px;color:var(--purple);margin:2px 0 4px}
.connect-card p{margin:0;color:#5f5970}
.arrow{
  width:42px;height:42px;
  border-radius:50%;
  display:grid;place-items:center;
  background:rgba(255,255,255,.58);
  color:var(--purple);
  font-size:25px;
}

.contact-wrap{padding:0 8%}
.contact-card{
  min-height:112px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  padding:20px 28px;
  border-radius:23px;
  background:linear-gradient(105deg,#4e2470,#5e3183 55%,#3c155f);
  color:white;
  text-decoration:none;
  box-shadow:0 15px 30px rgba(59,23,107,.18);
}
.contact-card:hover{filter:brightness(1.04)}
.contact-whatsapp{
  width:58px;height:58px;
  display:grid;place-items:center;
  border-radius:50%;
  background:#25d366;
  color:white;
  border:4px solid white;
}
.contact-whatsapp svg{width:35px;height:35px;display:block}
.contact-card div{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.contact-card strong{
  color:#fff0a2;
  font-family:"DM Sans", sans-serif;
  font-weight:600;
  font-size:36px;
  line-height:1.1;
  letter-spacing:0.5px;
}
.contact-card span{font-size:19px}
.contact-card small{flex-basis:100%;font-size:13px;opacity:.85;margin-top:3px}

footer{text-align:center;color:#766d7f;padding:10px 20px 28px;font-size:13px}


/* --------------------------------------------
   Subtle motion — activated by assets/site.js
--------------------------------------------- */
body.motion-ready .reveal{
  opacity:0;
  transform:translateY(24px);
}
body.motion-ready .reveal.is-visible{
  opacity:1;
  transform:translateY(0);
  transition:
    opacity .65s cubic-bezier(.2,.7,.2,1),
    transform .65s cubic-bezier(.2,.7,.2,1);
}
body.motion-ready .community-card:nth-child(2),
body.motion-ready .community-card:nth-child(6){transition-delay:.06s}
body.motion-ready .community-card:nth-child(3),
body.motion-ready .community-card:nth-child(7){transition-delay:.12s}
body.motion-ready .community-card:nth-child(4),
body.motion-ready .community-card:nth-child(8){transition-delay:.18s}

.community-image{
  transition:transform .38s ease, box-shadow .38s ease;
}
.community-card:hover .community-image{
  transform:scale(1.045);
  box-shadow:0 12px 27px rgba(56,35,64,.18);
}
.community-card:hover h2{color:#55248d}
.join-btn{
  overflow:hidden;
  position:relative;
}
.join-btn::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.8) 50%,transparent 80%);
  transform:translateX(-130%);
  transition:transform .55s ease;
}
.join-btn:hover::after{transform:translateX(130%)}

.brand-badge{
  animation:brandFloat 5s ease-in-out infinite;
}
@keyframes brandFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}

@media (hover:none){
  .community-card:hover .community-image{transform:none}
}

@media (max-width:1180px){
  .community-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .community-card{min-height:210px}
}
@media (max-width:760px){
  main{padding:0 13px 26px}
  .hero{padding:24px 8px 18px}
  .brand-badge{width:112px;height:112px;margin-bottom:14px}
  .eyebrow{font-size:12px;letter-spacing:.18em}
  .hero h1{font-size:48px}
  .intro{font-size:16px;padding:0 4px}
  .hero-leaf{opacity:.14;width:140px;height:140px}
  .community-grid{grid-template-columns:1fr;gap:13px}
  .community-card{
    min-height:0;
    padding:17px 15px 17px 17px;
    gap:15px;
    border-radius:19px;
  }
  .community-image{width:100px;height:100px;flex-basis:100px}
  .community-content h2{font-size:23px}
  .community-content p{font-size:14px;margin-bottom:12px}
  .join-btn{padding:8px 11px;font-size:13px}
  .number{width:28px;height:28px;top:10px;left:10px;font-size:13px}
  .connect-section{padding:6px 0 15px}
  .section-title h2{font-size:25px;text-align:center}
  .section-title span{width:32px}
  .connect-grid{grid-template-columns:1fr;gap:12px}
  .connect-card{min-height:112px;padding:18px 18px;gap:14px}
  .social-icon{width:58px;height:58px;font-size:38px}
  .star-icon{font-size:45px}
  .connect-card strong{font-size:23px}
  .contact-wrap{padding:0}
  .contact-card{
    min-height:0;
    padding:20px 16px;
    gap:14px;
    justify-content:flex-start;
  }
  .contact-whatsapp{width:50px;height:50px;flex:0 0 50px}
  .contact-card div{display:block}
  .contact-card strong{display:block;font-size:31px;margin-bottom:4px}
  .contact-card span{display:block;font-size:15px}
  .contact-card small{display:block;font-size:12px;margin-top:5px}
}
@media (max-width:420px){
  .community-card{align-items:flex-start}
  .community-image{width:88px;height:88px;flex-basis:88px;margin-top:3px}
  .community-content h2{font-size:21px;padding-right:3px}
  .join-btn{font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
  body.motion-ready .reveal{opacity:1!important;transform:none!important}
}

.join-btn.is-pressed,.connect-card.is-pressed,.contact-card.is-pressed{transform:scale(.985)!important}