/* Product presentation and accessible NFC demonstration. */
.plaque-pair{display:flex;align-items:center;justify-content:center;gap:6px;padding:20px 10px}
.plaque-pair img{width:50%;height:100%;object-fit:contain}
.plaque-pair img+img{width:44%;height:78%}
.plaque-pair .plaque-google-v2,.plaque-pair .plaque-google-v2+img{width:46%;height:82%;object-fit:contain}
.card-views{display:grid;grid-template-columns:1fr;gap:8px;padding:10px 28px;height:285px}
.card-views figure{margin:0;min-height:0;display:flex;align-items:center;justify-content:center;gap:8px}
.card-views figure img{width:72%;height:100%;object-fit:contain}
.card-views figcaption{font-size:10px;color:#475e7a;line-height:1.4;width:70px}
.power svg{width:18px;height:18px;stroke-width:2.6}
.nfc-demo.hero-product{padding:0;margin-right:-20px;width:100%;align-self:center;filter:none}
.plaque-stage{position:relative;aspect-ratio:1.2;isolation:isolate}
.hero-product .blue-stand{position:absolute;left:0;bottom:13%;width:54%;height:83%;object-fit:contain;filter:drop-shadow(0 14px 9px #0c172e33)}
.hero-product .black-flat{position:absolute;right:1%;bottom:9%;width:45%;height:47%;object-fit:contain;transform:perspective(700px) rotateX(48deg) rotateZ(-13deg);transform-origin:center bottom;filter:drop-shadow(0 6px 3px #0004)}
.demo-phone{position:absolute;z-index:4;right:4%;top:1%;width:33%;height:78%;min-width:130px;border:6px solid #17202a;border-radius:27px;background:#fff;box-shadow:0 14px 25px #05152d38;overflow:hidden;transform-origin:bottom center;animation:phone-approach 10s ease-in-out infinite;font-family:Poppins,Arial,sans-serif}
.phone-camera{position:absolute;z-index:4;top:5px;left:36%;width:28%;height:10px;background:#17202a;border-radius:10px}
.phone-start,.review-screen{position:absolute;inset:0;padding:28px 10px 12px;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:12px;text-align:center}
.phone-start{background:#edf6ff;color:#0066ff;animation:screen-start 10s infinite}.phone-start i svg{width:42px;height:42px}.phone-start strong{font-size:13px}.phone-start span{font-size:10px;color:#475e7a}
.review-screen{gap:9px;justify-content:flex-start;background:#fff;opacity:0;animation:screen-review 10s infinite}
.google-word{font:500 24px Arial,sans-serif;letter-spacing:-1px}.google-word span:nth-child(1),.google-word span:nth-child(4){color:#4285f4}.google-word span:nth-child(2),.google-word span:nth-child(6){color:#ea4335}.google-word span:nth-child(3){color:#fbbc05}.google-word span:nth-child(5){color:#34a853}
.shop-avatar{width:34px;height:34px;border-radius:50%;background:#eaf2ff;color:#0066ff;display:grid;place-items:center}.shop-avatar svg{width:20px;height:20px}
.review-screen>strong{font-size:12px;line-height:1.3}.review-subtitle{font-size:9px;color:#5f6368;line-height:1.3}.review-stars{font-size:23px;color:#fbbc04;white-space:nowrap;line-height:1.3;letter-spacing:-2px}.review-input{border:1px solid #dadce0;border-radius:5px;padding:9px 7px;text-align:left;color:#70757a;font-size:8px;min-height:48px;width:100%}.review-publish{background:#1a73e8;border-radius:15px;color:white;font-size:9px;padding:5px 16px;align-self:flex-end}.review-screen small{font-size:7px;color:#70757a;margin-top:auto}
.nfc-pulse{position:absolute;z-index:3;width:38px;height:38px;left:29%;top:51%;border:3px solid #00c2ff;border-radius:50%;opacity:0;animation:nfc-touch 10s infinite;box-shadow:0 0 0 8px #00c2ff30,0 0 0 18px #00c2ff15}
.demo-controls{position:relative;z-index:5;display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:-22px;padding:10px 0 17px}.demo-controls p{position:relative;width:100%;height:28px;text-align:center;color:#071a38;font-size:13px;font-weight:600}.demo-controls p span{position:absolute;inset:0;background:#ffffffe8;border-radius:20px;padding:4px 12px;width:max-content;max-width:100%;margin:auto}.demo-step-touch{animation:screen-start 10s infinite}.demo-step-review{opacity:0;animation:screen-review 10s infinite}.demo-controls button{border:1px solid #91abc6;background:#fffffff0;color:#294563;border-radius:20px;font-size:11px;padding:5px 14px;min-height:34px}
.nfc-demo.is-paused *{animation-play-state:paused!important}
@keyframes phone-approach{0%,8%{transform:translate(-4%,-4%) rotate(4deg)}25%,36%{transform:translate(-95%,17%) rotate(-13deg)}48%,86%{transform:translate(0,0) rotate(0)}100%{transform:translate(-4%,-4%) rotate(4deg)}}
@keyframes screen-start{0%,34%{opacity:1}40%,91%{opacity:0}98%,100%{opacity:1}}
@keyframes screen-review{0%,34%{opacity:0}40%,91%{opacity:1}98%,100%{opacity:0}}
@keyframes nfc-touch{0%,24%,41%,100%{opacity:0;transform:scale(.6)}29%,35%{opacity:1;transform:scale(1.3)}}
@media(max-width:1150px){.demo-phone{width:36%;height:83%;right:0}.review-screen{gap:6px;padding:23px 7px 8px}.google-word{font-size:20px}.review-input{min-height:35px}.shop-avatar{width:27px;height:27px}.nfc-demo.hero-product{margin-right:0}.demo-controls{margin-top:-10px}.card-views{padding:12px;height:245px}}
@media(min-width:601px) and (max-width:900px){.solution-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.card-copy h3{font-size:15px}.card-copy{padding:15px}.card-copy p,.card-copy ul{font-size:13px}.product-image{height:225px}.card-views{padding:8px}.card-views figure{flex-direction:column;gap:1px}.card-views figure img{width:100%;height:82%}.card-views figcaption{width:100%;text-align:center;font-size:9px}.demo-phone{border-width:4px;border-radius:20px;height:88%;min-width:110px}.review-screen{gap:4px;padding:20px 6px 6px}.google-word{font-size:17px}.shop-avatar{display:none}.review-stars{font-size:20px}.review-screen>strong{font-size:10px}.review-input{font-size:7px;min-height:30px}.review-screen small{font-size:6px}.demo-controls p{font-size:10px}.demo-controls button{font-size:10px}.phone-start strong{font-size:11px}}
@media(max-width:600px){.nfc-demo.hero-product{max-width:430px;margin:12px auto 0}.plaque-stage{aspect-ratio:1.05}.demo-phone{width:36%;height:77%;top:0;right:1%;min-width:110px;border-width:5px;border-radius:22px}.review-screen{gap:7px}.review-screen>strong{font-size:11px}.review-stars{font-size:22px}.review-input{font-size:8px}.demo-controls{margin-top:-28px;padding-bottom:25px}.demo-controls p{font-size:11px}.card-views{height:300px;padding:14px 25px}.card-views figure img{width:76%}.card-views figcaption{font-size:11px}.plaque-pair{height:285px}.hero-scene{inset:54% 0 0}}
@media(prefers-reduced-motion:reduce){.nfc-demo:not(.motion-enabled) *{animation:none!important}.nfc-demo:not(.motion-enabled) .phone-start,.nfc-demo:not(.motion-enabled) .demo-step-touch{opacity:0}.nfc-demo:not(.motion-enabled) .review-screen,.nfc-demo:not(.motion-enabled) .demo-step-review{opacity:1}.nfc-demo:not(.motion-enabled) .demo-phone{transform:none}}
.hero-product .black-flat{right:23%;bottom:-5%;width:48%;height:38%;z-index:5;transform:perspective(700px) rotateX(42deg) rotateZ(-13deg)}.demo-controls{margin-top:20px}@media(max-width:600px){.demo-controls{margin-top:12px}}

/* Sequência completa da avaliação: estrelas, comentário e publicação. */
.review-stars{display:flex;gap:2px;color:#dadce0;letter-spacing:0}
.review-stars span{animation:star-fill 10s infinite}
.review-stars span:nth-child(2){animation-name:star-fill-2}.review-stars span:nth-child(3){animation-name:star-fill-3}.review-stars span:nth-child(4){animation-name:star-fill-4}.review-stars span:nth-child(5){animation-name:star-fill-5}
.review-input{position:relative;overflow:hidden}.review-placeholder,.review-comment{position:absolute;left:7px;right:6px;top:9px}.review-placeholder{animation:placeholder-hide 10s infinite}.review-comment{width:0;color:#3c4043;font-weight:600;white-space:nowrap;overflow:hidden;opacity:0;animation:comment-type 10s steps(22,end) infinite}
.review-publish{position:relative;min-width:58px;min-height:21px;overflow:hidden;animation:publish-tap 10s infinite}.review-publish span{position:absolute;inset:0;display:grid;place-items:center}.review-publish span:first-child{animation:publish-label 10s infinite}.review-publish span:last-child{opacity:0;animation:published-label 10s infinite}
@keyframes star-fill{0%,43%,100%{color:#dadce0;transform:scale(.7)}46%,91%{color:#fbbc04;transform:scale(1)}}
@keyframes star-fill-2{0%,46%,100%{color:#dadce0;transform:scale(.7)}49%,91%{color:#fbbc04;transform:scale(1)}}
@keyframes star-fill-3{0%,49%,100%{color:#dadce0;transform:scale(.7)}52%,91%{color:#fbbc04;transform:scale(1)}}
@keyframes star-fill-4{0%,52%,100%{color:#dadce0;transform:scale(.7)}55%,91%{color:#fbbc04;transform:scale(1)}}
@keyframes star-fill-5{0%,55%,100%{color:#dadce0;transform:scale(.7)}58%,91%{color:#fbbc04;transform:scale(1)}}
@keyframes placeholder-hide{0%,59%{opacity:1}61%,100%{opacity:0}}
@keyframes comment-type{0%,60%{width:0;opacity:0}62%{opacity:1}78%,91%{width:calc(100% - 13px);opacity:1}96%,100%{width:0;opacity:0}}
@keyframes publish-tap{0%,80%,100%{transform:scale(1);background:#1a73e8}83%{transform:scale(.88);background:#0b57d0}86%,91%{transform:scale(1);background:#1e8e3e}}
@keyframes publish-label{0%,84%{opacity:1}86%,100%{opacity:0}}@keyframes published-label{0%,84%{opacity:0}86%,91%{opacity:1}96%,100%{opacity:0}}
@media(max-width:900px){.review-placeholder,.review-comment{top:7px}.review-publish{min-width:50px;min-height:18px}}

/* Prévia viva do OnTOQUE Page nos dois mockups do produto. */
.page-live-product{display:grid;place-items:center;overflow:hidden;padding:8px}
.virtual-phone{position:relative;width:140px;height:calc(100% - 10px);max-height:225px;padding:6px 4px 5px;border:4px solid #101b2b;border-radius:22px;background:#101b2b;box-shadow:0 12px 24px #071a3840,0 0 0 1px #738195;overflow:hidden}
.virtual-phone-speaker{position:absolute;z-index:3;top:5px;left:50%;width:27px;height:5px;transform:translateX(-50%);border-radius:10px;background:#101b2b}
.virtual-card-frame{display:block;border:0;background:#fff;pointer-events:none;transform-origin:top left}
.virtual-phone .virtual-card-frame{position:absolute;left:50%;top:7px;width:390px;height:844px;transform:translateX(-50%) scale(.25);transform-origin:top center;border-radius:13px}
@media(min-width:601px) and (max-width:1150px){.product-image{height:270px}.virtual-phone{height:250px;max-height:250px}.virtual-phone .virtual-card-frame{transform:translateX(-50%) scale(.285)}}
.mini-page{width:145px;height:225px;padding:12px 9px 9px;border:5px solid #17202a;border-radius:22px;background:#fff;box-shadow:0 12px 28px #071a3830;display:flex;flex-direction:column;gap:5px;overflow:hidden;font-family:Poppins,Arial,sans-serif}
.mp-logo{width:92%!important;height:25px!important;object-fit:contain!important;margin:0 auto;filter:none!important}
.mp-demo{position:relative;height:84px;border-radius:10px;background:#f2f7ff;overflow:hidden}.mp-demo>img{position:absolute;left:3px;bottom:2px;width:61%!important;height:78px!important;object-fit:contain!important;filter:none!important;animation:mp-plaque-pulse 10s infinite}.mp-review{position:absolute;right:4px;top:8px;width:42%;height:68px;border:2px solid #17202a;border-radius:8px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#4285f4;font-size:7px;animation:mp-review-open 10s infinite}.mp-review span{position:relative;color:#dadce0;font-size:10px;white-space:nowrap}.mp-review span::after{content:"★★★★★";position:absolute;left:0;top:0;width:0;color:#fbbc04;overflow:hidden;animation:mp-stars-fill 10s steps(5,end) infinite}.mp-review small{display:block;width:0;max-width:94%;overflow:hidden;white-space:nowrap;color:#3c4043;font-size:4.5px;font-weight:600;animation:mp-comment-type 10s steps(22,end) infinite}
.mp-button{height:24px;border-radius:8px;color:#fff;display:flex;align-items:center;padding:0 8px;font-size:7px;font-weight:700;box-shadow:inset 0 1px #ffffff50}.mp-google{background:linear-gradient(120deg,#0874ff,#0345f3)}.mp-whatsapp{background:linear-gradient(120deg,#00c640,#00ad43)}.mp-site{background:linear-gradient(120deg,#09243d,#04172c)}
.hand-live{position:relative}.hand-screen{position:absolute;z-index:2;left:47%;top:8%;width:36%;max-width:140px;height:69%;transform:translateX(-50%);overflow:hidden;border:0;border-radius:20px;background:#fff;box-shadow:none}.hand-screen .mini-page{width:100%;height:100%;padding:9px 8px 8px;border:0;border-radius:0;box-shadow:none;gap:4px}.hand-screen .mp-logo{height:23px!important}.hand-screen .mp-demo{height:96px;flex-shrink:0}.hand-screen .mp-demo>img{height:88px!important}.hand-screen .mp-review{height:76px}.hand-screen .mp-button{height:29px;font-size:7px;flex-shrink:0}
.hand-screen .virtual-card-hand{position:absolute;left:50%;top:0;width:390px;height:844px;transform:translateX(-50%) scale(.34);transform-origin:top center;border-radius:15px;background:#fff}
@keyframes mp-review-open{0%,35%{opacity:0;transform:translateY(8px)}42%,92%{opacity:1;transform:none}98%,100%{opacity:0;transform:translateY(8px)}}
@keyframes mp-plaque-pulse{0%,32%,100%{transform:scale(1)}36%{transform:scale(1.06)}42%{transform:scale(1)}}
@keyframes mp-stars-fill{0%,45%{width:0}61%,92%{width:100%}98%,100%{width:0}}
@keyframes mp-comment-type{0%,62%{width:0;opacity:0}65%{opacity:1}82%,92%{width:94%;opacity:1}98%,100%{width:0;opacity:0}}
@media(max-width:900px){.mini-page{width:135px;height:210px}.hand-screen{max-width:138px}}
@media(max-width:600px){.mini-page{width:165px;height:255px}.virtual-phone{width:150px;height:267px}.virtual-phone .virtual-card-frame{height:844px;transform:translateX(-50%) scale(.3)}.hand-screen{left:47%;top:8%;width:36%;max-width:118px;height:69%}.hand-screen .virtual-card-hand{transform:translateX(-50%) scale(.285)}.hand-screen .mini-page{width:100%;height:100%}.hand-screen .mp-demo{height:78px}.hand-screen .mp-demo>img{height:70px!important}.hand-screen .mp-review{height:61px}.hand-screen .mp-button{height:23px;font-size:6px}}

/* Center the two-part demonstration on the countertop. */
.nfc-demo.hero-product{width:92%;max-width:590px;margin:35px auto 0;justify-self:center}
.plaque-stage{aspect-ratio:1.32}
.hero-product .blue-stand{left:4%;bottom:8%;width:52%;height:80%}
.demo-phone{right:7%;top:13%;width:32%;height:78%;min-width:0}
.nfc-pulse{left:33%;top:58%}
.demo-controls{margin-top:0;padding:0 0 22px}
@keyframes phone-approach{0%,8%,100%{transform:translate(0,-2%) rotate(3deg)}25%,36%{transform:translate(-76%,5%) rotate(-10deg)}48%,86%{transform:translate(0,0) rotate(0)}}
@media(max-width:900px){.nfc-demo.hero-product{width:100%;margin:28px auto 0}.plaque-stage{aspect-ratio:1.08}.demo-phone{right:4%;top:12%;width:36%;height:78%}.hero-product .blue-stand{left:0;width:58%;bottom:8%;height:80%}}
@media(max-width:600px){.nfc-demo.hero-product{width:100%;max-width:400px;margin:18px auto 0}.plaque-stage{aspect-ratio:1.12}.demo-controls{margin-top:0;padding-bottom:24px}}

/* Cobre integralmente a tela antiga do celular no mockup da mão. */
.hand-screen{left:50%;top:6.4%;width:48%;max-width:184px;height:75%;border-radius:27px;background:#fff;box-shadow:0 0 0 4px #111b27;clip-path:inset(0 round 27px)}
.hand-screen .virtual-card-hand{top:0;transform:translateX(-50%) scale(.43);transform-origin:top center}
@media(max-width:900px){.hand-screen{left:50%;width:48%;max-width:178px;height:75%}.hand-screen .virtual-card-hand{transform:translateX(-50%) scale(.415)}}
@media(max-width:600px){.hand-screen{left:50%;top:6.4%;width:48%;max-width:145px;height:75%;border-radius:22px;box-shadow:0 0 0 3px #111b27;clip-path:inset(0 round 22px)}.hand-screen .virtual-card-hand{transform:translateX(-50%) scale(.335)}}

/* Novo mockup frontal: a animação ocupa somente a tela branca do aparelho. */
.hand-scene.hand-live{display:grid;place-items:end center;background:radial-gradient(ellipse,#ddebdf00,#fff 80%),url('assets/cafe.png') center/cover}
.hand-device{position:relative;width:293px;height:440px;overflow:visible}
.hand-device>img{position:absolute;z-index:3;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.hand-device .hand-screen{z-index:4;left:50%;top:8.1%;width:44.7%;max-width:none;height:61.9%;border:0;border-radius:16%/8%;box-shadow:none;clip-path:inset(0 round 16% 8%)}
.hand-device .hand-screen::after{content:"";position:absolute;z-index:6;top:0;left:50%;width:48%;height:3.8%;transform:translateX(-50%);border-radius:0 0 12px 12px;background:#05080d;pointer-events:none}
.hand-device .virtual-card-hand{top:0;width:390px;height:844px;transform:translateX(-50%) scale(.337);transform-origin:top center}
@media(max-width:600px){.hand-scene.hand-live{height:390px}.hand-device{width:260px;height:390px}.hand-device .hand-screen{left:50%;top:8.1%;width:44.7%;height:61.9%;border-radius:16%/8%;box-shadow:none;clip-path:inset(0 round 16% 8%)}.hand-device .virtual-card-hand{transform:translateX(-50%) scale(.299)}}

/* A mesma nova imagem também apresenta o produto OnTOQUE Page. */
.product-hand-device{position:relative;width:150px;height:225px}
.product-hand-device>img{position:absolute;z-index:3;inset:0;width:100%;height:100%;object-fit:contain;filter:none}
.product-hand-screen{position:absolute;z-index:4;left:50%;top:8.1%;width:44.7%;height:61.9%;transform:translateX(-50%);overflow:hidden;border-radius:16%/8%;background:#fff;clip-path:inset(0 round 16% 8%)}
.product-hand-screen::after{content:"";position:absolute;z-index:6;top:0;left:50%;width:48%;height:3.8%;transform:translateX(-50%);border-radius:0 0 7px 7px;background:#05080d;pointer-events:none}
.product-hand-screen .product-card-hand{position:absolute;left:50%;top:0;width:390px;height:844px;transform:translateX(-50%) scale(.172);transform-origin:top center}
@media(min-width:601px) and (max-width:1150px){.product-hand-device{width:163px;height:245px}.product-hand-screen .product-card-hand{transform:translateX(-50%) scale(.187)}}
@media(max-width:600px){.product-hand-device{width:177px;height:265px}.product-hand-screen .product-card-hand{transform:translateX(-50%) scale(.203)}}