:root{
  --bg:#efe5da;
  --cream:#f8f2eb;
  --cream2:#f1e7dc;
  --sand:#e3d1bf;
  --line:#dccbb9;
  --tan:#a8775a;
  --tan2:#c49a7c;
  --brown:#3f2a20;
  --brown2:#5a3d2f;
  --brown3:#7a5443;
  --text:#5b463a;
  --serif:'Cormorant Garamond',Georgia,serif;
  --script:'Great Vibes',cursive;
  --sans:'Poppins',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  min-height:100vh;background:radial-gradient(circle at 20% 0%,#f7efe6,var(--bg) 60%);
  font-family:var(--sans);color:var(--text);display:flex;justify-content:center;padding:28px 16px;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
svg{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}

.page{
  width:100%;max-width:430px;background:var(--cream);border-radius:34px;overflow:hidden;
  box-shadow:0 30px 70px -20px rgba(63,42,32,.35),0 0 0 1px rgba(63,42,32,.05);
}

/* ---------- TOPO ---------- */
.hero{position:relative;text-align:center;padding:52px 26px 30px;
  background:linear-gradient(180deg,#eadccd 0%,#f3eadf 45%,var(--cream) 100%)}
.monogram{position:absolute;top:8px;left:-10px;font-family:var(--script);font-size:120px;
  color:rgba(168,119,90,.13);transform:rotate(-8deg);pointer-events:none;user-select:none}
.avatar{position:relative;width:168px;height:168px;margin:0 auto 22px;border-radius:50%;padding:4px;
  background:conic-gradient(from 210deg,var(--tan),#ecd6c1,var(--brown3),#e7cfb8,var(--tan));
  box-shadow:0 18px 35px -10px rgba(63,42,32,.45)}
.avatar::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(168,119,90,.35)}
.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:4px solid var(--cream);display:block}
.hero h1{font-family:var(--serif);font-weight:500;font-size:52px;line-height:.95;color:var(--brown);letter-spacing:-.5px}
.hero h1 span{display:block;margin-top:8px;font-size:26px;font-style:italic;color:var(--tan)}
.bio{margin:16px auto 0;max-width:290px;font-size:14px;font-weight:300;line-height:1.65}
.bio b{font-weight:600;color:var(--brown2)}

/* ---------- BOTÕES ---------- */
.links{display:flex;flex-direction:column;gap:14px;padding:6px 18px 26px}
.btn{position:relative;display:flex;align-items:center;gap:16px;min-height:96px;padding:14px 16px 14px 14px;
  border-radius:16px;color:#fbf3ea;overflow:hidden;isolation:isolate;
  box-shadow:0 10px 22px -8px rgba(63,42,32,.55),inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.12);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.btn::before{content:"";position:absolute;inset:0;z-index:-2}
/* "foto" de fundo de cada botão (cena desfocada em gradiente) */
.b1::before{background:
  radial-gradient(ellipse 40% 60% at 80% 70%,rgba(255,232,205,.45),transparent 70%),
  radial-gradient(ellipse 25% 35% at 70% 85%,rgba(60,35,25,.5),transparent 70%),
  linear-gradient(105deg,#6b4636 0%,#8e634c 45%,#b98d6f 100%)}
.b2::before{background:
  linear-gradient(120deg,transparent 58%,rgba(255,240,225,.35) 58.5%,rgba(255,240,225,.1) 75%,transparent 75.5%),
  linear-gradient(60deg,transparent 70%,rgba(70,45,32,.35) 70.5%),
  linear-gradient(105deg,#7d5845 0%,#a07a63 50%,#c9a88f 100%)}
.b3::before{background:
  repeating-linear-gradient(170deg,transparent 0 14px,rgba(60,38,27,.18) 14px 16px,transparent 16px 30px),
  radial-gradient(ellipse 50% 70% at 85% 30%,rgba(255,236,215,.4),transparent 70%),
  linear-gradient(105deg,#6e4a39 0%,#93694f 55%,#b78f73 100%)}
.b4::before{background:
  radial-gradient(ellipse 30% 80% at 82% 60%,rgba(240,220,200,.28),transparent 70%),
  repeating-linear-gradient(80deg,transparent 0 10px,rgba(255,255,255,.05) 10px 20px),
  linear-gradient(105deg,#3d281f 0%,#55392c 55%,#7a5746 100%)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 45%),
  linear-gradient(90deg,rgba(40,25,18,.25),transparent 60%)}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 30px -10px rgba(63,42,32,.6),inset 0 1px 0 rgba(255,255,255,.35)}
.btn:active{transform:scale(.98)}
.ico{flex:none;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;color:var(--brown3);
  background:radial-gradient(circle at 35% 30%,#fffaf4,#efe2d4);
  box-shadow:0 6px 14px -4px rgba(0,0,0,.35),inset 0 0 0 1px rgba(168,119,90,.2)}
.ico svg{width:34px;height:34px;stroke-width:1.2}
.lbl{flex:1;font-family:var(--serif);font-size:27px;line-height:1.02;text-shadow:0 1px 6px rgba(40,25,18,.35)}
.lbl i{font-weight:400}
.arr{flex:none;width:30px;height:30px;border-radius:50%;border:1.3px solid rgba(255,248,240,.85);display:grid;place-items:center;transition:transform .35s}
.arr svg{width:16px;height:16px;stroke-width:1.6}
.btn:hover .arr{transform:translateX(3px)}
.btn .shine{position:absolute;top:0;left:-60%;width:40%;height:100%;z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.25),transparent);transform:skewX(-20deg);animation:shine 6s infinite}
.b2 .shine{animation-delay:1.5s}.b3 .shine{animation-delay:3s}.b4 .shine{animation-delay:4.5s}
@keyframes shine{0%,80%{left:-60%}100%{left:130%}}

/* ---------- CITAÇÃO ---------- */
.quote{margin:4px 22px 30px;padding:26px 24px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,#fbf6f0,var(--cream2))}
.flower{width:22px;height:22px;color:var(--tan2);margin-bottom:10px}
.quote p{font-size:14.5px;line-height:1.7}
.quote b{color:var(--tan);font-weight:600}
.quote .sub{margin-top:10px;font-size:13px;font-weight:300}

/* ---------- SOBRE ---------- */
.about{position:relative;display:flex;min-height:330px;background:var(--brown2);color:#efe2d5;overflow:hidden}
.about::before{content:"";position:absolute;top:-60px;left:-20%;width:140%;height:110px;border-radius:0 0 50% 50%;
  background:var(--cream);box-shadow:0 2px 0 var(--tan2);z-index:2;pointer-events:none}
.about-txt{position:relative;z-index:1;flex:1.15;padding:80px 0 30px 22px}
.about h2{font-family:var(--serif);font-weight:400;font-size:30px;color:#f6ebe0;margin-bottom:12px}
.about p{font-size:12px;font-weight:300;line-height:1.75}
.pill{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:9px 18px;border-radius:30px;font-size:12.5px;color:#fbefe3;
  background:linear-gradient(90deg,var(--tan),#b88566);box-shadow:0 6px 14px -6px rgba(0,0,0,.5);transition:transform .3s}
.pill:hover{transform:translateX(3px)}
.about-img{flex:1;position:relative}
.about-img img{position:absolute;inset:30px 0 0 0;width:100%;height:calc(100% - 30px);object-fit:cover;object-position:50% 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}

/* ---------- DÚVIDAS ---------- */
.faq{padding:30px 24px 22px;background:var(--cream)}
.faq h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:34px;color:var(--brown2);margin-bottom:6px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:14px 2px;font-size:13.5px;color:var(--brown2)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;font-weight:300;color:var(--brown3);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{font-size:13px;font-weight:300;line-height:1.65;padding:0 2px 14px;animation:fade .35s}
@keyframes fade{from{opacity:0;transform:translateY(-4px)}}

/* ---------- NÚMEROS ---------- */
.stats{display:flex;padding:24px 10px;background:linear-gradient(180deg,#e9d8c6,#dfc9b4)}
.stats div{flex:1;text-align:center;display:flex;flex-direction:column;align-items:center}
.stats div+div{border-left:1px solid rgba(122,84,67,.25)}
.stats svg{width:24px;height:24px;color:var(--brown3);margin-bottom:6px}
.stats strong{font-family:var(--serif);font-weight:500;font-size:28px;color:var(--brown);line-height:1.1}
.stats small{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--brown3);margin-top:2px}

/* ---------- RODAPÉ ---------- */
footer{background:var(--brown);color:#e4d3c3;text-align:center;padding:30px 22px 26px}
.cta{font-family:var(--serif);font-style:italic;font-size:25px;color:#e0c2a6}
.heart{color:var(--tan2);font-style:normal;display:inline-block;animation:beat 1.6s infinite}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}}
.follow{font-size:12px;margin-top:6px;font-weight:300}
.follow b{font-weight:500;color:#f3e4d6}
.social{display:flex;justify-content:center;gap:14px;margin:18px 0 22px}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(228,211,195,.55);display:grid;place-items:center;transition:all .3s}
.social a:hover{background:var(--tan);border-color:var(--tan);transform:translateY(-3px)}
.social svg{width:19px;height:19px;stroke-width:1.5}
.sign{font-family:var(--script);font-size:40px;color:var(--tan2);padding-top:14px;border-top:1px solid rgba(228,211,195,.18)}
.copy{font-size:11px;line-height:1.5;opacity:.75;margin-top:4px}

/* ---------- ANIMAÇÕES ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.btn .shine,.heart{animation:none}}

@media (max-width:480px){
  body{padding:0}
  .page{border-radius:0;max-width:none}
}

/* ---------- SEÇÕES / PRODUTOS ---------- */
.sec{display:flex;align-items:center;gap:12px;margin:10px 4px 0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:21px;color:var(--brown3)}
.sec::after{content:"";flex:1;height:1px;background:var(--line)}
.cover{flex:none;width:62px;height:86px;border-radius:8px;overflow:hidden;background:var(--cream);
  box-shadow:0 8px 16px -6px rgba(0,0,0,.45),0 0 0 3px rgba(255,248,240,.85);transform:rotate(-4deg);transition:transform .35s}
.cover img{width:100%;height:100%;object-fit:cover;display:block}
.btn:hover .cover{transform:rotate(0) scale(1.05)}
.price{display:table;margin-top:6px;padding:3px 10px;border-radius:20px;font-family:var(--sans);font-size:11px;font-style:normal;letter-spacing:.04em;
  background:rgba(255,248,240,.9);color:var(--brown2);text-shadow:none}
.desc{display:block;margin-top:6px;font-family:var(--sans);font-size:11.5px;font-style:normal;font-weight:300;line-height:1.45;color:rgba(255,248,240,.92);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
