:root{--bg:#fff3f6;--soft:#f4eef2;--text:#2f2735;--muted:#6f6678;--red:#e8324f;--red2:#ff6b7e;--line:#e5dce4;--card:#fffafd;--shadow:0 24px 70px rgba(130,40,65,.14);--radius:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% 10%,#ffe8ee 0,#fff3f6 34%,#fff3f6 100%);font-family:Inter,system-ui,sans-serif;color:var(--text)}a{text-decoration:none;color:inherit}.topbar{text-align:center;background:linear-gradient(90deg,var(--red),var(--red2));color:white;padding:12px 16px;font-weight:800;font-size:14px}.header{height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 max(20px,calc((100vw - 1180px)/2));border-bottom:1px solid var(--line);background:rgba(255,214,222,.82);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.logo{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:900;line-height:1}.logo-mascot{width:40px;height:40px;object-fit:contain;display:block;flex:0 0 auto}.logo-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff0f3;color:var(--red)}.nav{display:flex;gap:28px;font-weight:600;color:#50475a}.login{background:white;border:1px solid var(--line);padding:12px 18px;border-radius:14px;font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.04)}.section{max-width:1180px;margin:auto;padding:88px 20px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;min-height:650px}.pill{display:inline-flex;border:1px solid #ffc1cb;background:#fff3f5;color:var(--red);border-radius:999px;padding:9px 16px;font-weight:800;font-size:14px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(44px,6vw,76px);line-height:.98;letter-spacing:-.07em;margin:32px 0 22px}h1 span{display:block;font-family:'Dancing Script',cursive;color:var(--red);letter-spacing:0;font-size:.7em;margin-top:18px}h2{font-size:clamp(34px,4.5vw,54px);line-height:1.05;letter-spacing:-.05em;margin:18px 0}h2 span{color:var(--red)}p{color:var(--muted);font-size:18px;line-height:1.65}.actions{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:13px;font-weight:900;border:0}.primary{background:linear-gradient(135deg,var(--red),var(--red2));color:white;box-shadow:0 12px 28px rgba(232,50,79,.28)}.ghost{background:white;border:1px solid var(--line);color:var(--text)}.ghost.red{color:var(--red)}.light{background:white;color:var(--red)}.review{display:flex;gap:14px;align-items:center;margin-top:34px}.review span{color:var(--muted)}.avatar{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,var(--red),#ffc1cb);display:grid;place-items:center;color:white;font-weight:900}.hero-art{position:relative;height:520px}.phone{position:absolute;width:245px;height:460px;border:10px solid #27222b;border-radius:42px;background:#1d1820;box-shadow:var(--shadow);overflow:hidden}.phone-main{left:38%;top:60px;transform:translateX(-50%);z-index:3}.phone-back{top:120px;opacity:.96}.phone-back.left{left:10%;transform:rotate(-10deg)}.phone-back.right{right:3%;transform:rotate(10deg)}.phone-screen{height:100%;padding:20px;background:#33282d;color:white}.phone-screen h3{margin:30px 0 5px}.status{background:#e94b54;border-radius:999px;width:48px;text-align:center;font-size:12px}.counter{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0}.counter span{background:rgba(255,255,255,.08);border-radius:12px;text-align:center;padding:12px 4px;font-size:11px}.counter b{display:block;font-size:20px}.message{background:#e94b54;border-radius:16px;padding:14px}.message p{font-size:15px;color:white;line-height:1.35}.phone button,.phone-screen button{border:0;border-radius:999px;padding:10px 14px;font-weight:900}.dark{background:#09090a}.dark p{color:white;margin-top:150px}.dark button{background:#25d366;color:#061}.blue{background:#245d97}.floating-card{position:absolute;right:16%;top:10px;background:white;border:1px solid var(--line);box-shadow:var(--shadow);padding:18px 24px;border-radius:18px;z-index:5}.floating-card small{display:block;color:var(--muted)}.heart{position:absolute;color:#ffb3bf;font-size:86px;opacity:.85}.h1{left:8%;top:50px;transform:rotate(-18deg)}.h2{right:3%;top:30px;color:var(--red)}.h3{left:12%;bottom:80px}.center{text-align:center}.lead{max-width:720px;margin:0 auto 50px}.steps,.prices{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.card{background:rgba(255,250,253,.78);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:0 12px 38px rgba(100,16,31,.06)}.step{position:relative;min-height:270px}.step i{position:absolute;top:-21px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--red),var(--red2));color:white;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:900}.icon{font-size:54px;margin:12px 0 24px}.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.left-text{margin-left:0}.timeline-phone{width:270px;height:470px;margin:auto;border:10px solid #27222b;border-radius:42px;background:#141116;color:white;padding:40px 30px;position:relative;box-shadow:var(--shadow)}.timeline-phone p{font-size:13px;color:#f6d8de}.line{position:absolute;left:34px;top:50px;bottom:40px;width:2px;background:var(--red)}.photo{height:120px;background:linear-gradient(135deg,#ffe0e6,#ff8494);border-radius:12px;margin:12px 0 28px}.photo.small{height:90px}.round-icon{width:58px;height:58px;border:2px solid #ffc1cb;border-radius:50%;display:grid;place-items:center;font-size:25px}.features{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px;text-align:left}.features .wide{grid-column:span 2}.features .tall{grid-row:span 2}.mini-phone{height:280px;background:#111;border-radius:30px;padding:60px 18px;color:white;display:grid;gap:10px;font-size:40px;font-weight:900;overflow:hidden}.mini-phone span:nth-child(1){color:#ff9d00}.mini-phone span:nth-child(2){color:#28c76f}.mini-phone span:nth-child(3){color:#ff5ca8}.demo-banner{background:linear-gradient(135deg,var(--red),var(--red2));border-radius:24px;color:white;text-align:center;margin-top:40px}.demo-banner p,.demo-banner h2{color:white}.prices{grid-template-columns:repeat(2,minmax(0,360px));justify-content:center}.price strong{display:block;font-size:42px;margin:18px 0}.featured{border:2px solid #ff9cac;transform:translateY(-12px)}.featured small{color:var(--red);font-weight:900}.form-section{max-width:760px}.form-card{background:white;border:1px solid var(--line);border-radius:30px;padding:34px;box-shadow:var(--shadow)}label{display:block;margin:16px 0;font-weight:800}input,textarea{width:100%;margin-top:8px;border:1px solid var(--line);border-radius:14px;padding:15px;font:inherit;background:#fffafd}textarea{min-height:120px;resize:vertical}.faq{max-width:820px}details{background:white;border:1px solid var(--line);border-radius:16px;padding:20px;margin:14px 0}summary{font-weight:900;cursor:pointer}.footer{text-align:center;padding:34px 20px;color:var(--muted);border-top:1px solid var(--line)}@media (max-width:850px){.logo-mascot{width:34px;height:34px}.topbar{font-size:12px;padding:10px}.header{height:64px;padding:0 16px}.nav{display:none}.login{padding:10px 12px}.logo{font-size:18px}.section{padding:58px 18px}.hero{grid-template-columns:1fr;gap:24px;min-height:auto}.hero-copy{text-align:left}.hero-art{height:420px;margin-top:10px}.phone{width:205px;height:385px;border-width:8px;border-radius:34px}.phone-main{left:50%;top:20px}.phone-back.left{left:0;top:80px}.phone-back.right{right:0;top:82px}.floating-card{right:4%;top:0;padding:12px 14px;font-size:12px}.heart{font-size:55px}.steps,.features,.prices,.split{grid-template-columns:1fr}.step{min-height:auto}.features .wide{grid-column:auto}.features .tall{grid-row:auto}.card{padding:24px}.center{text-align:left}.lead{margin-left:0}.demo-banner{margin-left:18px;margin-right:18px}.featured{transform:none}.actions .btn{width:100%}h1{font-size:48px}.phone-back{opacity:.55}.phone-screen{padding:16px}.message p{font-size:13px}.counter{margin:16px 0}.hero p{font-size:17px}}@media (max-width:420px){.hero-art{height:380px}.phone{width:185px;height:350px}.phone-back.left{left:-16px}.phone-back.right{right:-16px}.floating-card{display:none}h1{font-size:42px}.form-card{padding:24px}.topbar{font-size:11px}.section{padding-left:16px;padding-right:16px}}

/* Smartphones com imagens reais da demo */
.media-phone{background:#111;padding:0;display:block}
.media-phone img{width:100%;height:100%;display:block;object-fit:cover;object-position:top center;border-radius:30px}
.phone-main.media-phone img{object-position:top center}
.phone-back.left.media-phone img{object-position:top center}
.phone-back.right.media-phone img{object-position:top center}
@media (max-width:850px){.media-phone img{border-radius:26px}.phone-main{box-shadow:0 22px 58px rgba(130,40,65,.22)}}
@media (max-width:420px){.media-phone img{border-radius:24px}}


/* V5 - animação de escrita sem empurrar layout e sem cursor */
.typing-text{
  display:block;
  width:10.7em;
  max-width:100%;
  min-height:1.35em;
  line-height:1.35;
  padding-bottom:.12em;
  margin-top:18px;
  overflow:visible;
  white-space:nowrap;
  position:relative;
  color:transparent;
  border-right:0;
}
.typing-text::after{
  content:'de um jeito único.';
  position:absolute;
  left:0;
  top:0;
  width:0;
  max-width:10.7em;
  overflow:hidden;
  white-space:nowrap;
  color:var(--red);
  animation:typingUniqueFixed 12s steps(18,end) infinite;
}
@keyframes typingUniqueFixed{
  0%{width:0;opacity:1}
  20%{width:10.7em;opacity:1}
  82%{width:10.7em;opacity:1}
  90%{width:10.7em;opacity:0}
  91%{width:0;opacity:0}
  100%{width:0;opacity:1}
}
.heart-phone{background:linear-gradient(165deg,#111 0%,#23161d 48%,#e8324f 100%);padding:0;display:block}
.heart-screen{height:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;text-align:center;color:white;overflow:hidden}
.heart-screen:before,.heart-screen:after{content:'♥';position:absolute;color:rgba(255,255,255,.13);font-size:150px;line-height:1}.heart-screen:before{top:28px;right:-38px;transform:rotate(18deg)}.heart-screen:after{bottom:-30px;left:-28px;transform:rotate(-18deg)}
.mini-status{position:absolute;top:22px;left:24px;background:#ef4058;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:900}
.big-heart{width:132px;height:132px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#fff 0%,#fff5f7 55%,#ffd2da 100%);color:var(--red);font-size:82px;box-shadow:0 18px 40px rgba(232,50,79,.28);margin-bottom:22px;animation:heartPulse 2.4s ease-in-out infinite}
.heart-screen p{font-size:16px;line-height:1.4;color:white;font-weight:800;margin:0;position:relative;z-index:1}
@keyframes heartPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@media(max-width:850px){.big-heart{width:110px;height:110px;font-size:68px}.heart-screen p{font-size:14px}.mini-status{top:18px;left:20px}}

/* V6 - frase rotativa com cursor só enquanto escreve/apaga */
.typing-text{
  display:block;
  width:min(12.8em, 100%);
  min-height:1.45em;
  line-height:1.38;
  padding-bottom:.18em;
  margin-top:18px;
  overflow:visible;
  white-space:nowrap;
  position:relative;
  color:var(--red);
  border-right:0;
}
.typing-text::after{
  content:'';
  position:static;
  display:inline-block;
  width:0;
  height:.95em;
  margin-left:4px;
  border-right:3px solid var(--red);
  vertical-align:-.08em;
  opacity:0;
  animation:none;
  max-width:none;
  overflow:visible;
  color:inherit;
}
.typing-text.is-typing::after{opacity:1;animation:caretBlink .7s step-end infinite}
@keyframes caretBlink{0%,45%{opacity:1}46%,100%{opacity:0}}
@media(max-width:850px){.typing-text{width:min(12.8em,100%);min-height:1.5em;line-height:1.42}}

.footer-brand{padding:48px 20px;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,240,244,.72));}
.footer-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:20px;text-align:left;}
.footer-mascot{width:92px;height:92px;object-fit:contain;display:block;flex:0 0 auto;filter:drop-shadow(0 14px 26px rgba(80,35,50,.12));}
.footer-copy{display:flex;flex-direction:column;gap:6px;color:var(--muted);}
.footer-copy strong{font-size:24px;color:var(--text);font-weight:900;letter-spacing:-.03em;}
.footer-copy span{font-size:15px;}
.footer-copy small{font-size:13px;color:#8b8190;}
@media (max-width:520px){.footer-brand{padding:36px 18px}.footer-inner{flex-direction:column;text-align:center;gap:12px}.footer-mascot{width:86px;height:86px}.footer-copy strong{font-size:22px}}


/* V9 - trava a frase animada para não empurrar os smartphones */
.hero-copy{min-width:0;}
.hero-art{min-width:0;}
h1{max-width:560px;}
.typing-text{
  width:min(520px, 100%) !important;
  max-width:520px !important;
  min-width:0 !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  font-size:clamp(34px, 3.55vw, 50px) !important;
  line-height:1.42 !important;
  padding-bottom:.22em !important;
  contain:layout paint;
}
@media(max-width:850px){
  .typing-text{
    width:100% !important;
    max-width:100% !important;
    font-size:clamp(31px, 9vw, 43px) !important;
  }
}
@media(max-width:420px){
  .typing-text{font-size:clamp(28px, 8.2vw, 36px) !important;}
}

/* V10 - demo real dentro dos smartphones com rolagem automática */
.demo-scroll-phone{background:#121116;padding:0;display:block;overflow:hidden;border-color:#231f28}
.phone-notch{position:absolute;left:50%;top:8px;transform:translateX(-50%);width:72px;height:17px;background:#231f28;border-radius:0 0 16px 16px;z-index:5}
.demo-scroll-content{height:auto;min-height:100%;padding:18px 12px 18px;background:linear-gradient(180deg,#e8324f 0%,#9b2035 25%,#171316 48%,#111 100%);color:#fff;display:flex;flex-direction:column;gap:12px;will-change:transform}.demo-phone-main .demo-scroll-content{padding-top:30px}.demo-phone-secondary .demo-scroll-content{padding-top:34px}.main-scroll{animation:phoneAutoScrollMain 18s ease-in-out infinite}.medium-scroll{animation:phoneAutoScrollMedium 15s ease-in-out infinite}.slow-scroll{animation:phoneAutoScrollSlow 20s ease-in-out infinite}.demo-topbar{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 2px 8px;background:linear-gradient(180deg,rgba(232,50,79,.96),rgba(232,50,79,.70),rgba(232,50,79,0));font-size:12px}.demo-topbar b{font-size:13px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-photo{height:198px;min-height:198px;border-radius:17px;position:relative;overflow:hidden;background:linear-gradient(135deg,#ffd6df,#ff7d92 35%,#4c1727 100%);box-shadow:0 16px 35px rgba(0,0,0,.18)}.photo-shine{position:absolute;inset:0;background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.72),transparent 17%),radial-gradient(circle at 65% 42%,rgba(255,255,255,.46),transparent 15%),linear-gradient(135deg,transparent 0 58%,rgba(0,0,0,.22) 59% 100%)}.demo-player,.demo-couple-card,.demo-message-card,.demo-gallery-card,.demo-achievements,.demo-card{border-radius:18px;background:rgba(24,20,25,.92);box-shadow:0 10px 28px rgba(0,0,0,.18);padding:14px}.demo-player{display:grid;grid-template-columns:1fr 46px;gap:10px;align-items:center}.demo-player h4,.demo-couple-card h4{margin:0 0 4px;font-size:20px;line-height:1.05}.demo-player p,.demo-couple-card p,.demo-message-card p,.demo-card p,.demo-cover p,.demo-wrapped p{margin:0;color:rgba(255,255,255,.72);font-size:12px;line-height:1.45}.demo-player button{width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#e8324f;font-weight:900}.music-line{grid-column:1/3;height:4px;border-radius:20px;background:rgba(255,255,255,.24);overflow:hidden}.music-line i{display:block;width:46%;height:100%;background:#fff;border-radius:20px}.controls{grid-column:1/3;text-align:center;letter-spacing:7px;color:rgba(255,255,255,.86);font-size:13px}.couple-banner{height:105px;margin:-14px -14px 14px;border-radius:18px 18px 0 0;background:linear-gradient(135deg,#ffb5c0,#e8324f,#7b1326)}.time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}.time-grid span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:53px;border:1px solid rgba(255,255,255,.09);border-bottom-width:4px;border-radius:12px;color:rgba(255,255,255,.76);font-size:10px}.time-grid b{font-size:18px;color:#fff}.demo-message-card{background:#ff6b7e;color:#fff}.demo-message-card b,.demo-gallery-card b,.demo-achievements b,.demo-card b{display:block;font-size:16px;margin-bottom:7px}.demo-message-card p{color:#2b1118;font-weight:800;font-size:13px}.demo-message-card button{margin-top:12px;border:0;border-radius:20px;padding:8px 12px;background:#fff;color:#e8324f;font-weight:900;font-size:11px}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.gallery-grid i{height:108px;border-radius:12px;background:linear-gradient(135deg,#ffd6df,#fa8091,#4d1622)}.gallery-grid i:nth-child(2){background:linear-gradient(135deg,#ffe0aa,#ff6b7e,#2b1118)}.gallery-grid i:nth-child(3){background:linear-gradient(135deg,#f5f7ff,#e8324f,#101010)}.demo-achievements{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}.demo-achievements small{background:#0d0b0d;border-radius:30px;padding:5px 8px;color:#d8d3d7}.demo-achievements div{grid-column:1/3;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.demo-achievements i{display:grid;place-items:center;aspect-ratio:1;border-radius:12px;background:#121212;border:1px solid rgba(255,255,255,.12);font-style:normal}.demo-cover{min-height:240px;border-radius:24px;padding:18px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden}.red-cover{background:radial-gradient(circle at 50% 34%,#fff0f3 0 12%,transparent 13%),linear-gradient(135deg,#e8324f,#64101f)}.dark-cover{background:radial-gradient(circle at 50% 35%,#ff8fa0 0 12%,transparent 13%),linear-gradient(135deg,#23212a,#080709)}.demo-cover strong{font-size:26px;line-height:1}.demo-time{position:absolute;top:14px;left:16px;font-size:11px;font-weight:900;color:rgba(255,255,255,.76)}.demo-date span{font-size:42px;display:block;margin-bottom:12px}.demo-letter{background:#fff;color:#2f2735}.demo-letter p{color:#6f6678}.demo-heart-end{min-height:170px;display:grid;place-items:center;color:#ffb8c3;font-size:86px}.mini-timeline{position:relative;padding-left:24px}.mini-timeline:before{content:"";position:absolute;left:11px;top:17px;bottom:17px;width:2px;background:#e8324f}.mini-timeline i{display:block;height:100px;border-radius:14px;margin:10px 0 12px;background:linear-gradient(135deg,#ffc5ce,#ff6b7e,#651220)}.demo-wrapped strong{display:block;font-size:42px;color:#ffb000;line-height:1.05;margin:8px 0}.demo-wrapped{background:#050505}
@keyframes phoneAutoScrollMain{0%,12%{transform:translateY(0)}28%,38%{transform:translateY(-245px)}54%,64%{transform:translateY(-500px)}80%,88%{transform:translateY(-735px)}100%{transform:translateY(0)}}
@keyframes phoneAutoScrollMedium{0%,15%{transform:translateY(0)}45%,58%{transform:translateY(-255px)}78%,90%{transform:translateY(-430px)}100%{transform:translateY(0)}}
@keyframes phoneAutoScrollSlow{0%,18%{transform:translateY(0)}48%,62%{transform:translateY(-240px)}82%,92%{transform:translateY(-390px)}100%{transform:translateY(0)}}
@media (max-width:850px){.demo-scroll-content{padding-left:10px;padding-right:10px;gap:10px}.demo-photo{height:165px;min-height:165px}.demo-player h4,.demo-couple-card h4{font-size:17px}.couple-banner{height:84px}.time-grid span{min-height:45px}.gallery-grid i{height:88px}.demo-cover{min-height:205px}.demo-cover strong{font-size:23px}@keyframes phoneAutoScrollMain{0%,12%{transform:translateY(0)}28%,38%{transform:translateY(-210px)}54%,64%{transform:translateY(-430px)}80%,88%{transform:translateY(-625px)}100%{transform:translateY(0)}}}
@media (max-width:420px){.demo-scroll-content{padding-left:9px;padding-right:9px}.demo-photo{height:150px;min-height:150px}.demo-player,.demo-couple-card,.demo-message-card,.demo-gallery-card,.demo-achievements,.demo-card{padding:12px}.couple-banner{margin:-12px -12px 12px;height:76px}.demo-message-card p{font-size:12px}.gallery-grid i{height:80px}.controls{letter-spacing:5px}.demo-cover{min-height:185px}.demo-cover strong{font-size:21px}}

/* V11 - correção da demo dos smartphones
   - só 2 celulares rolam automaticamente
   - celular esquerdo voltou a ser decorativo
   - imagens reais aparecem dentro da demo */
.real-photo-player{
  background-image:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.14)),url('demo-player.png');
  background-size:cover;
  background-position:top center;
}
.real-photo-wrapped{
  background-image:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.35)),url('demo-wrapped.png');
  background-size:cover;
  background-position:top center;
}
.demo-gallery-card .gallery-grid i:nth-child(1){background-image:url('demo-player.png');background-size:cover;background-position:center top}
.demo-gallery-card .gallery-grid i:nth-child(2){background-image:url('demo-wrapped.png');background-size:cover;background-position:center top}
.demo-gallery-card .gallery-grid i:nth-child(3){background:linear-gradient(135deg,#fff0f3,#ff6b7e,#251017)}
.phone-back.left.heart-phone{overflow:hidden}
.phone-back.left.heart-phone .heart-screen{height:100%}
.phone-back.left.heart-phone .big-heart{box-shadow:none}
@media (max-width:850px){
  .real-photo-player,.real-photo-wrapped{background-size:cover}
}


/* V12 - ajuste profissional dos smartphones: 1 celular principal rolando + laterais estáticas */
.hero-art{isolation:isolate}
.phone{box-sizing:border-box}
.demo-phone-main{z-index:6;box-shadow:0 28px 70px rgba(57,15,28,.30);}
.phone-back.right.side-shot-phone{z-index:3;opacity:.95;background:#0f1622;padding:0;overflow:hidden;}
.phone-back.right.side-shot-phone img{width:100%;height:100%;display:block;object-fit:cover;object-position:top center;border-radius:30px;filter:saturate(1.03) contrast(1.02);}
.phone-back.left.heart-phone{z-index:2;opacity:.82;}
.demo-scroll-phone{background:#101013;border-color:#201d24;}
.demo-scroll-content{padding:16px 10px 20px;background:linear-gradient(180deg,#24668f 0%,#24668f 34%,#1b4e70 52%,#121212 82%);gap:10px;}
.demo-phone-main .demo-scroll-content{padding-top:22px;}
.demo-topbar{background:linear-gradient(180deg,rgba(36,102,143,.98),rgba(36,102,143,.78),rgba(36,102,143,0));font-size:11px;padding:5px 2px 7px;}
.demo-topbar b{font-size:11px;max-width:145px;}
.demo-photo{height:205px;min-height:205px;border-radius:14px;box-shadow:0 12px 22px rgba(0,0,0,.18);background-color:#234;}
.real-photo-player{background-image:url('demo-player.png');background-size:cover;background-position:top center;}
.demo-player{background:transparent;box-shadow:none;padding:0 2px 4px;display:block;}
.demo-player h4{font-size:20px;margin:0 0 2px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.demo-player p{font-size:12px;color:rgba(255,255,255,.88);margin-bottom:8px;}
.demo-player button{display:none;}
.music-line{height:4px;background:rgba(255,255,255,.28);margin-bottom:6px;}
.music-line i{width:38%;}
.controls{font-size:13px;letter-spacing:12px;color:rgba(255,255,255,.88);padding-top:4px;}
.demo-couple-card{background:#302b2b;padding:0 12px 12px;border-radius:16px;overflow:hidden;}
.couple-banner{height:125px;margin:0 -12px 12px;border-radius:16px 16px 0 0;background-position:center 33%;}
.demo-couple-card h4{font-size:18px;}
.time-grid{gap:7px;margin-top:10px;}
.time-grid span{min-height:48px;border-color:rgba(255,255,255,.10);}
.demo-message-card{background:#4597c9;border-radius:16px;padding:13px;}
.demo-message-card p{font-size:12px;line-height:1.28;color:#fff;font-weight:800;}
.demo-gallery-card,.demo-achievements{border-radius:16px;background:#272323;}
.gallery-grid i{height:94px;}
.main-scroll{animation:phoneAutoScrollMainV12 22s ease-in-out infinite;}
@keyframes phoneAutoScrollMainV12{
  0%,14%{transform:translateY(0)}
  30%,43%{transform:translateY(-295px)}
  58%,70%{transform:translateY(-545px)}
  86%,94%{transform:translateY(-760px)}
  100%{transform:translateY(0)}
}
@media (max-width:850px){
  .phone-back.right.side-shot-phone img{border-radius:26px;}
  .demo-scroll-content{padding-left:9px;padding-right:9px;gap:9px;}
  .demo-photo{height:175px;min-height:175px;}
  .couple-banner{height:100px;}
  .controls{letter-spacing:9px;}
  @keyframes phoneAutoScrollMainV12{
    0%,14%{transform:translateY(0)}
    30%,43%{transform:translateY(-250px)}
    58%,70%{transform:translateY(-465px)}
    86%,94%{transform:translateY(-650px)}
    100%{transform:translateY(0)}
  }
}


/* V13 - limpeza da demo do smartphone
   - remove conquistas sem sentido
   - adiciona tela Wrapped real
   - ajusta scroll para não cortar cards no ponto de pausa */
.demo-achievements{display:none!important}
.demo-wrapped-card{
  border-radius:16px;
  overflow:hidden;
  background:#050505;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
  min-height:176px;
}
.demo-wrapped-card img{
  width:100%;
  height:220px;
  display:block;
  object-fit:cover;
  object-position:top center;
}
.demo-photo{height:210px;min-height:210px;}
.couple-banner{height:118px;}
.demo-gallery-card{padding:13px;}
.gallery-grid i{height:104px;}
.demo-scroll-content{padding-bottom:34px;}
.main-scroll{animation:phoneAutoScrollMainV13 24s ease-in-out infinite;}
@keyframes phoneAutoScrollMainV13{
  0%,16%{transform:translateY(0)}
  31%,43%{transform:translateY(-288px)}
  57%,69%{transform:translateY(-535px)}
  83%,94%{transform:translateY(-715px)}
  100%{transform:translateY(0)}
}
@media (max-width:850px){
  .demo-photo{height:178px;min-height:178px;}
  .couple-banner{height:98px;}
  .gallery-grid i{height:88px;}
  .demo-wrapped-card img{height:185px;}
  @keyframes phoneAutoScrollMainV13{
    0%,16%{transform:translateY(0)}
    31%,43%{transform:translateY(-245px)}
    57%,69%{transform:translateY(-455px)}
    83%,94%{transform:translateY(-610px)}
    100%{transform:translateY(0)}
  }
}



/* V15 - correção real sem deixar imagem pequena/cortada errada
   - restaura preenchimento profissional do celular principal
   - imagem do celular direito usa a tela nova enviada
   - fotos internas usam crop próprio para não aparecer bolinha/foto cortada feia */
.phone-back.right.side-shot-phone{
  background:#173f59;
  padding:0;
  overflow:hidden;
}
.phone-back.right.side-shot-phone img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:top center;
  border-radius:30px;
  filter:saturate(1.04) contrast(1.02);
}
.real-photo-player{
  background-image:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.10)),url('couple-photo.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.real-photo-wrapped,
.couple-banner.real-photo-wrapped{
  background-image:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.20)),url('couple-photo.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.demo-gallery-card .gallery-grid i:nth-child(1){
  background-image:url('couple-photo.png')!important;
  background-size:cover!important;
  background-position:center!important;
}
.demo-wrapped-card img{
  width:100%;
  height:210px;
  object-fit:cover;
  object-position:top center;
  display:block;
}
.demo-photo{
  overflow:hidden;
}
@media (max-width:850px){
  .phone-back.right.side-shot-phone img{border-radius:26px;}
  .demo-wrapped-card img{height:185px;}
}


/* V16 - ajustes solicitados
   - remove o bloco vermelho vazio dos momentos especiais
   - evita miniaturas repetidas
   - troca o celular direito para uma tela diferente */
.demo-gallery-card .gallery-grid i:nth-child(1){
  background-image:url('demo-player.png')!important;
  background-size:cover!important;
  background-position:top center!important;
}
.demo-gallery-card .gallery-grid i:nth-child(2){
  background-image:url('demo-wrapped.png')!important;
  background-size:cover!important;
  background-position:top center!important;
}
.demo-gallery-card .gallery-grid i:nth-child(3){
  background-image:url('couple-photo.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.phone-back.right.side-shot-phone img{
  object-fit:cover!important;
  object-position:top center!important;
}

/* V17 - troca das fotos repetidas e remoção da área vermelha vazia */
.real-photo-player{
  background-image:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.12)),url('couple-1.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.real-photo-wrapped,
.couple-banner.real-photo-wrapped{
  background-image:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.24)),url('couple-3.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.demo-gallery-card .gallery-grid i:nth-child(1){
  background-image:url('couple-1.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.demo-gallery-card .gallery-grid i:nth-child(2){
  background-image:url('couple-2.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.demo-gallery-card .gallery-grid i:nth-child(3){
  background-image:url('couple-3.png')!important;
  background-size:cover!important;
  background-position:center center!important;
}
.phone-back.right.side-shot-phone img{
  object-fit:cover!important;
  object-position:center center!important;
}
/* deixa o celular vermelho traseiro menos artificial */
.heart-screen{
  background:linear-gradient(160deg,rgba(232,50,79,.95),rgba(62,14,28,.98)), url('couple-3.png');
  background-size:cover;
  background-position:center;
  background-blend-mode:multiply;
}
.heart-screen .big-heart{opacity:.9;}


/* V18 - corrige frase animada cortando texto longo */
.hero .typing-text{
  display:block !important;
  width:100% !important;
  max-width:560px !important;
  min-height:1.62em !important;
  line-height:1.45 !important;
  padding-bottom:.22em !important;
  overflow:visible !important;
  white-space:nowrap !important;
  font-size:clamp(28px,2.15vw,36px) !important;
}
@media(max-width:850px){
  .hero .typing-text{
    max-width:100% !important;
    font-size:clamp(27px,7vw,34px) !important;
    white-space:normal !important;
    min-height:2.3em !important;
  }
}


/* V19 - corrige enquadramento da foto principal no celular central
   A foto é vertical e estava centralizada demais, cortando rosto. */
.real-photo-player{
  background-position:center 27% !important;
}
.demo-photo.hero-photo.real-photo-player{
  min-height:205px !important;
  height:205px !important;
}
.couple-banner.real-photo-wrapped{
  background-position:center 30% !important;
}
.demo-gallery-card .gallery-grid i:nth-child(1),
.demo-gallery-card .gallery-grid i:nth-child(2),
.demo-gallery-card .gallery-grid i:nth-child(3){
  background-position:center 30% !important;
}
@media(max-width:850px){
  .demo-photo.hero-photo.real-photo-player{
    min-height:175px !important;
    height:175px !important;
  }
}


/* V22 - Linha do tempo com fotos reais + player de áudio funcionando */
.timeline-demo-section .mock-timeline{display:flex;justify-content:center;align-items:center;min-height:520px}.timeline-phone-real{width:292px;height:535px;border:10px solid #27222b;border-radius:44px;background:#101013;color:#fff;padding:0;overflow:hidden;position:relative;box-shadow:0 28px 70px rgba(80,25,40,.18)}.timeline-phone-real .small-notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:78px;height:18px;border-radius:0 0 14px 14px;background:#27222b;z-index:4}.timeline-screen-content{height:auto;min-height:100%;padding:34px 14px 16px;overflow:visible;background:linear-gradient(180deg,#1a141a 0%,#0f0f12 100%);display:flex;flex-direction:column;gap:14px;animation:timelinePhoneScroll 26s ease-in-out infinite;will-change:transform}.timeline-music-card{border-radius:22px;background:linear-gradient(180deg,#24668f 0%,#17435f 100%);padding:12px;box-shadow:0 12px 28px rgba(0,0,0,.25);display:grid;grid-template-columns:64px 1fr 42px;gap:10px;align-items:center;min-height:104px}.timeline-cover{width:64px;height:64px;border-radius:14px;overflow:hidden;background:#0e2636}.timeline-cover img{width:100%;height:100%;object-fit:cover;object-position:center 25%;display:block}.timeline-music-info strong{display:block;font-size:17px;line-height:1.05;color:#fff}.timeline-music-info span{display:block;margin-top:4px;font-size:12px;color:rgba(255,255,255,.78)}.timeline-play-btn{width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:#24668f;font-size:17px;font-weight:900;display:grid;place-items:center;cursor:pointer}.timeline-progress{grid-column:1/4;height:4px;border-radius:999px;background:rgba(255,255,255,.25);overflow:hidden}.timeline-progress i{display:block;width:0%;height:100%;border-radius:999px;background:#fff;transition:width .15s linear}.timeline-event{position:relative;border-radius:20px;background:#1d1a1f;padding:14px;box-shadow:0 10px 24px rgba(0,0,0,.22);min-height:255px;overflow:hidden}.timeline-event:before{content:"";position:absolute;left:10px;top:20px;bottom:20px;width:2px;background:#e8324f;border-radius:20px;opacity:.85}.timeline-event b,.timeline-event p{position:relative;z-index:2;margin-left:14px}.timeline-event b{display:block;font-size:17px;color:#fff;margin-bottom:2px}.timeline-event p{font-size:12px;line-height:1.35;color:#f6d8de;margin-bottom:10px}.timeline-event img{position:relative;z-index:1;width:100%;height:176px;display:block;object-fit:cover;object-position:center 34%;border-radius:16px}.timeline-event:nth-child(4) img{object-position:center 30%}.timeline-event:nth-child(3) img{object-position:center 28%}@keyframes timelinePhoneScroll{0%,18%{transform:translateY(0)}34%,48%{transform:translateY(-165px)}62%,76%{transform:translateY(-430px)}90%,96%{transform:translateY(-690px)}100%{transform:translateY(0)}}
@media(max-width:850px){.timeline-demo-section .mock-timeline{min-height:430px}.timeline-phone-real{width:245px;height:455px;border-width:8px;border-radius:38px}.timeline-screen-content{padding:30px 12px 14px;min-height:100%;height:auto;overflow:visible}.timeline-event{min-height:220px}.timeline-event img{height:148px}.timeline-music-card{grid-template-columns:54px 1fr 38px;min-height:92px}.timeline-cover{width:54px;height:54px}.timeline-play-btn{width:38px;height:38px}@keyframes timelinePhoneScroll{0%,18%{transform:translateY(0)}34%,48%{transform:translateY(-145px)}62%,76%{transform:translateY(-365px)}90%,96%{transform:translateY(-585px)}100%{transform:translateY(0)}}}


/* v24 - timeline smartphone profissional com player real fixo e rolagem limpa */
.timeline-demo-section .mock-timeline{display:flex;justify-content:center;align-items:center;min-height:560px}.timeline-phone-premium{width:300px;height:548px;border:10px solid #27222b;border-radius:46px;background:#0d0d10;color:#fff;padding:0;overflow:hidden;position:relative;box-shadow:0 28px 70px rgba(80,25,40,.18)}.timeline-phone-premium .small-notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:80px;height:18px;border-radius:0 0 14px 14px;background:#27222b;z-index:10}.timeline-app{height:100%;padding:34px 13px 14px;background:linear-gradient(180deg,#141116 0%,#0b0b0d 100%);display:flex;flex-direction:column;gap:12px;overflow:hidden}.timeline-music-fixed{flex:0 0 auto;border-radius:22px;background:linear-gradient(180deg,#24668f 0%,#17435f 100%);padding:12px;box-shadow:0 12px 28px rgba(0,0,0,.25);display:grid;grid-template-columns:66px 1fr 42px;gap:10px;align-items:center;min-height:110px;position:relative;z-index:3}.timeline-cover{width:66px;height:66px;border-radius:15px;overflow:hidden;background:#0e2636}.timeline-cover img{width:100%;height:100%;object-fit:cover;object-position:center 32%;display:block}.timeline-music-info strong{display:block;font-size:17px;line-height:1.05;color:#fff}.timeline-music-info span{display:block;margin-top:4px;font-size:12px;color:rgba(255,255,255,.78)}.timeline-play-btn{width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:#24668f;font-size:17px;font-weight:900;display:grid;place-items:center;cursor:pointer}.timeline-progress{grid-column:1/4;height:4px;border-radius:999px;background:rgba(255,255,255,.25);overflow:hidden}.timeline-progress i{display:block;width:0%;height:100%;border-radius:999px;background:#fff;transition:width .15s linear}.timeline-feed-window{flex:1;overflow:hidden;border-radius:22px;background:#111114;position:relative}.timeline-feed-window:after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(180deg,rgba(17,17,20,0),#111114 88%);pointer-events:none;z-index:2}.timeline-feed-track{padding:12px;display:flex;flex-direction:column;gap:12px;animation:timelineFeedScroll 24s ease-in-out infinite;will-change:transform}.timeline-event{position:relative;border-radius:20px;background:#1d1a1f;padding:13px;box-shadow:0 10px 24px rgba(0,0,0,.22);min-height:238px;overflow:hidden;flex:0 0 auto}.timeline-event:before{content:"";position:absolute;left:10px;top:18px;bottom:18px;width:2px;background:#e8324f;border-radius:20px;opacity:.85}.timeline-event b,.timeline-event p{position:relative;z-index:2;margin-left:14px}.timeline-event b{display:block;font-size:16px;color:#fff;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timeline-event p{font-size:11px;line-height:1.35;color:#f6d8de;margin-bottom:10px}.timeline-event img{position:relative;z-index:1;width:100%;height:158px;display:block;object-fit:cover;object-position:center 35%;border-radius:16px}.timeline-event:nth-child(2) img{object-position:center 30%}.timeline-event:nth-child(3) img{object-position:center 36%}.timeline-event:nth-child(4) img{object-position:center 34%}@keyframes timelineFeedScroll{0%,20%{transform:translateY(0)}34%,49%{transform:translateY(-250px)}63%,78%{transform:translateY(-500px)}92%,96%{transform:translateY(-750px)}100%{transform:translateY(0)}}
@media(max-width:850px){.timeline-demo-section .mock-timeline{min-height:470px}.timeline-phone-premium{width:255px;height:470px;border-width:8px;border-radius:39px}.timeline-app{padding:30px 11px 12px;gap:10px}.timeline-music-fixed{grid-template-columns:54px 1fr 38px;min-height:94px;padding:10px}.timeline-cover{width:54px;height:54px}.timeline-play-btn{width:38px;height:38px}.timeline-event{min-height:205px;padding:11px}.timeline-event img{height:132px}@keyframes timelineFeedScroll{0%,20%{transform:translateY(0)}34%,49%{transform:translateY(-217px)}63%,78%{transform:translateY(-434px)}92%,96%{transform:translateY(-651px)}100%{transform:translateY(0)}}}

/* V25 - Linha do tempo usando o mesmo celular/app do hero, com player real */
.timeline-demo-section .mock-timeline{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:560px;
}
.timeline-reuse-phone{
  position:relative !important;
  left:auto !important;
  top:auto !important;
  right:auto !important;
  transform:none !important;
  margin:auto !important;
  width:292px !important;
  height:535px !important;
  z-index:1 !important;
}
.timeline-reuse-scroll{
  padding-top:22px !important;
  background:linear-gradient(180deg,#24668f 0%,#24668f 34%,#1b4e70 52%,#121212 82%) !important;
}
.timeline-reuse-phone .demo-topbar{
  background:linear-gradient(180deg,rgba(36,102,143,.98),rgba(36,102,143,.78),rgba(36,102,143,0));
}
.timeline-main-photo{
  background-image:url('timeline-player.png') !important;
  background-size:cover !important;
  background-position:center 18% !important;
}
.timeline-photo-2{
  background-image:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.25)),url('timeline-1.png') !important;
  background-size:cover !important;
  background-position:center 30% !important;
}
.timeline-photo-3{
  background-image:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.25)),url('timeline-2.png') !important;
  background-size:cover !important;
  background-position:center 32% !important;
}
.timeline-reuse-phone .demo-player.timeline-demo-player{
  display:grid !important;
  grid-template-columns:1fr 42px !important;
  gap:8px !important;
  align-items:center !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 2px 6px !important;
}
.timeline-reuse-phone .demo-player.timeline-demo-player button{
  display:grid !important;
  place-items:center !important;
  width:42px !important;
  height:42px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:#fff !important;
  color:#24668f !important;
  font-size:16px !important;
  font-weight:900 !important;
  cursor:pointer !important;
}
.timeline-reuse-phone .timeline-demo-player .music-line,
.timeline-reuse-phone .timeline-demo-player .controls{
  grid-column:1/3 !important;
}
.timeline-gallery i:nth-child(1){background-image:url('timeline-2.png') !important;background-size:cover !important;background-position:center 32% !important;}
.timeline-gallery i:nth-child(2){background-image:url('timeline-3.png') !important;background-size:cover !important;background-position:center 30% !important;}
.timeline-gallery i:nth-child(3){background-image:url('timeline-4.png') !important;background-size:cover !important;background-position:center 34% !important;}
@media(max-width:850px){
  .timeline-demo-section .mock-timeline{min-height:440px;}
  .timeline-reuse-phone{width:245px !important;height:455px !important;border-width:8px !important;border-radius:38px !important;}
  .timeline-reuse-phone .demo-photo{height:175px !important;min-height:175px !important;}
}

/* HOME HERO PREMIUM FIX - card e corações */
.hero-art .floating-card{
  right:0;
  top:0;
  z-index:20;
  padding:18px 26px;
  min-width:182px;
  border-radius:20px;
  background:rgba(255,255,255,.96);
  box-shadow:0 24px 70px rgba(232,50,79,.18), 0 10px 28px rgba(47,39,53,.10);
  transform:translate(10px,-10px);
}
.hero-art .floating-card b{font-size:18px;color:#2f2735;margin-left:4px;}
.hero-art .floating-card small{font-size:13px;margin-top:4px;}
.hero-art .heart{
  font-size:118px;
  opacity:.95;
  filter:drop-shadow(0 18px 30px rgba(232,50,79,.28));
  animation:homeHeartFloat 4.8s ease-in-out infinite;
  z-index:1;
}
.hero-art .h1{left:1%;top:88px;color:#ff9bac;transform:rotate(-18deg);animation-delay:.3s;}
.hero-art .h2{right:-7%;top:104px;color:#e8324f;font-size:132px;transform:rotate(12deg);animation-delay:.8s;z-index:2;}
.hero-art .h3{left:8%;bottom:44px;color:#ff6b7e;font-size:104px;transform:rotate(16deg);animation-delay:1.2s;}
@keyframes homeHeartFloat{
  0%,100%{translate:0 0;scale:1;}
  50%{translate:0 -14px;scale:1.06;}
}
@media(max-width:850px){
  .hero-art .floating-card{right:1%;top:-8px;transform:none;min-width:150px;padding:12px 14px;}
  .hero-art .heart{font-size:76px;}
  .hero-art .h2{right:-9%;top:88px;font-size:86px;}
  .hero-art .h3{bottom:34px;font-size:70px;}
}
@media(max-width:420px){
  .hero-art .floating-card{display:flex;flex-direction:column;right:2%;top:-4px;font-size:11px;min-width:130px;}
}

/* DEMO REAL NA HOME - usa o presente criado como prévia dentro do celular */
.live-demo-phone{
  padding:0 !important;
  background:#120f15 !important;
}
.live-demo-phone .phone-notch{
  z-index:5;
  pointer-events:none;
}
.live-demo-frame{
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:#120f15;
}
