/* HOUR Depth v2 — camada de luz, sombra e tempo por cima do Orbit.
   Só CSS local, sem dependências. A peça-assinatura: o halo do hero é um
   mostrador desenhado em SVG (marcas nítidas, sem serrilhado) e um ponteiro
   de luz dá a volta completa em exatamente 60 segundos, alinhado com os
   segundos reais por /depth.js; as marcas acendem à passagem e apagam-se
   devagar, como um rasto. */

@property --d-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

html[data-orbit] {
  --d-ease: cubic-bezier(.2, .7, .1, 1);
  /* Marcas do mostrador (as mesmas do SVG do hero) usadas como máscara. */
  --d-ticks: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cg fill='none' stroke='%23000'%3E%3Ccircle cx='300' cy='300' r='297' stroke-width='2'/%3E%3Ccircle cx='300' cy='300' r='281' stroke-width='7' pathLength='60' stroke-dasharray='.05 .95' stroke-dashoffset='.025'/%3E%3Ccircle cx='300' cy='300' r='278' stroke-width='15' pathLength='12' stroke-dasharray='.012 .988' stroke-dashoffset='.006'/%3E%3C/g%3E%3C/svg%3E");
}

/* ── Grão de filme: dá matéria ao preto ─────────────────────────────────── */
html[data-orbit] body::after {
  content: ""; position: fixed; inset: 0; z-index: 1000; pointer-events: none; opacity: .035;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0 / 200px 200px;
}

/* ── Cabeçalho: ganha sombra ao descer e mostra o tempo de leitura ─────── */
html[data-orbit] .site-header { transition: box-shadow .3s; }
html[data-orbit] .site-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; pointer-events: none;
  transform: scaleX(0); transform-origin: 0 50%;
  background: linear-gradient(90deg, #ffffff00, #ffffffb0 60%, #fff); box-shadow: 0 0 12px #ffffff80;
}
@supports (animation-timeline: scroll()) {
  html[data-orbit] .site-header { animation: d-header linear both; animation-timeline: scroll(root); animation-range: 0 160px; }
  html[data-orbit] .site-header::after { animation: d-progress linear both; animation-timeline: scroll(root); }
}
@keyframes d-header { to { box-shadow: 0 1px 0 #ffffff10, 0 24px 60px -24px #000, 0 8px 20px -12px #000c; } }
@keyframes d-progress { to { transform: scaleX(1); } }

/* ── Hero: texto ────────────────────────────────────────────────────────── */
/* A marca de água do relógio passa a desvanecer em vez de ser cortada a seco. */
html[data-orbit] .home-v2 .hero::before {
  opacity: .05;
  -webkit-mask-image: radial-gradient(closest-side, #000 35%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 35%, transparent 100%);
}
/* Luz que segue o ponteiro por todo o primeiro ecrã (usa --mx/--my do depth.js). */
html[data-orbit] .home-v2 .hero::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(520px circle at var(--mx, 70%) var(--my, 40%), #ffffff0d, transparent 70%);
  transition: opacity .6s;
}

/* Título: um reflexo de cromado atravessa «Finalmente teu.» */
.home-v2 .hero h1 span {
  background-image: linear-gradient(100deg, transparent 42%, #fffffff2 50%, transparent 58%), linear-gradient(120deg, #fafafa 0%, #bcbcbc 42%, #666 100%);
  background-size: 250% 100%, 100% 100%; background-repeat: no-repeat; background-position: 150% 0, 0 0;
  animation: d-sheen 8s var(--d-ease) 1.4s infinite;
}
@keyframes d-sheen { 0% { background-position: 150% 0, 0 0; } 30%, 100% { background-position: -60% 0, 0 0; } }

/* Os links diretos para as lojas ocupam o espaço principal do hero. */
html[data-orbit] .home-v2 .hero__actions { margin-top: 30px; }
html[data-orbit] .home-v2 .hero__inner:has(.store-badge:not([hidden])) .hero__actions,
html[data-orbit] .home-v2 .final-cta:has(.store-badge:not([hidden])) .final-cta__actions { display: none; }
/* Sem nenhuma loja publicada, o contentor dos badges não ocupa lugar. */
html[data-orbit] .home-v2 .store-badges:not(:has(.store-badge:not([hidden]))) { display: none; }
html[data-orbit] .home-v2 .btn--light {
  position: relative; overflow: hidden; isolation: isolate;
  background: linear-gradient(180deg, #fff, #dcdcdc); color: #0a0a0a;
  box-shadow: inset 0 1px 0 #fff, inset 0 -2px 0 #0002, 0 1px 2px #0006, 0 14px 34px -12px #ffffff70;
}
html[data-orbit] .home-v2 .btn--light::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(105deg, transparent 35%, #ffffffe6 50%, transparent 65%) 200% 0 / 250% 100% no-repeat;
  animation: d-btn-shine 6s var(--d-ease) 2.4s infinite;
}
@keyframes d-btn-shine { 0% { background-position: 200% 0; } 25%, 100% { background-position: -100% 0; } }
html[data-orbit] .home-v2 .btn--ghost,
html[data-orbit] .home-v2 .final-cta .btn--outline-light {
  border-color: #ffffff38; background: linear-gradient(180deg, #ffffff14, #ffffff05); color: #fff;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  box-shadow: inset 0 1px 0 #ffffff26, 0 10px 30px -14px #000;
}
html[data-orbit] .home-v2 .btn span { margin-left: 10px; font-size: 1.1em; transition: transform .25s var(--d-ease); }

/* Entrada do texto do hero, em cascata. */
@media (prefers-reduced-motion: no-preference) {
  html[data-orbit] .home-v2 .hero__inner > * { animation: d-in 1s var(--d-ease) both; }
  html[data-orbit] .home-v2 .hero__inner > :nth-child(2) { animation-delay: .12s; }
  html[data-orbit] .home-v2 .hero__inner > :nth-child(3) { animation-delay: .22s; }
  html[data-orbit] .home-v2 .hero__inner > :nth-child(n+4) { animation-delay: .32s; }
  html[data-orbit] .hero-bottom a span { animation: d-nudge 2.4s ease-in-out 1.6s infinite; }
}
@keyframes d-in { from { opacity: 0; translate: 0 26px; filter: blur(10px); } to { opacity: 1; translate: 0 0; filter: blur(0); } }
@keyframes d-nudge { 0%, 100% { translate: 0 0; } 50% { translate: 0 6px; } }

/* ── Hero: o mostrador ──────────────────────────────────────────────────── */
html[data-orbit] .d-dial { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
/* Rasto do ponteiro: um cone suave (sem aresta dura) por baixo das marcas. */
html[data-orbit] .orbit-halo::after {
  content: ""; position: absolute; inset: 1%; border-radius: 50%;
  background: conic-gradient(transparent 0 290deg, #ffffff03 315deg, #ffffff0c 345deg, #ffffff1f 358deg, #ffffff47 359.7deg, transparent 360deg);
  -webkit-mask: radial-gradient(closest-side, transparent 8%, #0006 30%, #000 70%, transparent);
  mask: radial-gradient(closest-side, transparent 8%, #0006 30%, #000 70%, transparent);
  animation: d-sweep 60s linear calc(var(--d-now, 0) * -1s) infinite;
}
/* As marcas acendem quando o ponteiro passa: a camada fica parada e só a
   luz roda por dentro da máscara (tudo no compositor). */
html[data-orbit] .d-dial-lit {
  position: absolute; inset: 0;
  -webkit-mask: var(--d-ticks) center / 100% 100% no-repeat; mask: var(--d-ticks) center / 100% 100% no-repeat;
}
html[data-orbit] .d-dial-lit__sweep {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(transparent 0 200deg, #ffffff1a 280deg, #ffffff66 340deg, #ffffffe6 358deg, #fff 359.8deg, transparent 360deg);
  animation: d-sweep 60s linear calc(var(--d-now, 0) * -1s) infinite;
}
@keyframes d-sweep { to { transform: rotate(1turn); } }

/* Órbitas elípticas: contorno mais fino e um cometa a percorrê-las. */
html[data-orbit] .orbit-halo__ring { border-color: #ffffff1c; box-shadow: none; }
html[data-orbit] .orbit-halo__ring::before {
  content: ""; position: absolute; inset: -1px; border-radius: 50%;
  background: conic-gradient(transparent 0 62%, #ffffff30 85%, #ffffffb3 98%, #fff 99.6%, transparent 100%);
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px) calc(100% - .5px), transparent);
  mask: radial-gradient(closest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px) calc(100% - .5px), transparent);
  animation: d-spin 18s linear infinite;
}
html[data-orbit] .orbit-halo__ring::after {
  top: -9px; left: -9px; right: -9px; bottom: -9px; width: auto; height: auto; border-radius: 50%; box-shadow: none;
  background: radial-gradient(circle at 50% 8px, #fff 0 3px, #ffffffa6 4px, #ffffff26 8px, transparent 16px);
  animation: d-spin 18s linear infinite;
}
html[data-orbit] .orbit-halo__ring--cross::before,
html[data-orbit] .orbit-halo__ring--cross::after { animation-duration: 29s; animation-direction: reverse; }
html[data-orbit] .orbit-halo__ring--cross::before { background: conic-gradient(transparent 0%, #fff 0.4%, #ffffffb3 2%, #ffffff30 15%, transparent 38% 100%); }
@keyframes d-spin { to { transform: rotate(1turn); } }

/* Luz de palco: a luz de topo perde a aresta dura e ganha feixes suaves. */
html[data-orbit] .hero-3d__light { -webkit-mask: radial-gradient(closest-side, #000 40%, transparent); mask: radial-gradient(closest-side, #000 40%, transparent); }
html[data-orbit] .d-rays {
  position: absolute; left: -10%; right: -10%; top: -14%; height: 95%; pointer-events: none;
  background: repeating-conic-gradient(from 150deg at 56% 0%, #ffffff00 0deg, #ffffff0b 2.5deg, #ffffff00 6deg, #ffffff00 9deg);
  -webkit-mask: radial-gradient(ellipse 55% 95% at 56% 0%, #000 10%, transparent 78%);
  mask: radial-gradient(ellipse 55% 95% at 56% 0%, #000 10%, transparent 78%);
  animation: d-breathe 9s ease-in-out infinite;
}
@keyframes d-breathe { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }

/* Chão: espelho escuro onde os aparelhos se refletem. */
html[data-orbit] .hero-3d__floor::before,
html[data-orbit] .hero-3d__floor::after { background: radial-gradient(50% 42% at 50% 62%, #ffffff29, #ffffff08 55%, transparent 76%); }
html[data-orbit] .home-v2 .hero-3d__device { -webkit-box-reflect: below 18px linear-gradient(transparent 72%, #ffffff1c); }

/* Aparelhos: sombra de contacto, ambiente profundo, contorno e o ecrã a
   derramar luz para fora. */
html[data-orbit] .home-v2 .hero-3d__device--hour {
  box-shadow: inset 0 0 0 2px #ffffff40, inset 1px 1px 0 3px #ffffff14, -3px 1px 0 #999, -6px 3px 0 #454545, -9px 4px 0 #222,
    -22px 36px 45px #000b, -50px 90px 110px -30px #000, 0 0 90px -10px #ffffff2b;
}
html[data-orbit] .home-v2 .hero-3d__device--hours {
  box-shadow: inset 0 0 0 1px #ffffff14, 1px 0 0 #2a2a2a, 2px 0 0 #262626, 3px 1px 0 #222, 4px 1px 0 #1d1d1d, 5px 2px 0 #181818, 6px 3px 0 #131313,
    16px 40px 40px -18px #000d, 40px 80px 100px -30px #000, 0 0 80px -12px #ffffff21;
}
html[data-orbit] .hero-3d__rig::after { bottom: -26px; height: 46px; left: -2%; right: -2%; filter: blur(4px); }
/* Reflexo no vidro que segue o ponteiro (usa --tx/--ty do hero-3d.js). */
html[data-orbit] .hero-3d__glass { overflow: hidden; }
html[data-orbit] .hero-3d__glass::after {
  content: ""; position: absolute; inset: -40% -60%; pointer-events: none;
  background: linear-gradient(115deg, transparent 38%, #ffffff17 46%, #ffffff05 52%, transparent 60%);
  transform: translate3d(calc(var(--ty, 0) * 22%), calc(var(--tx, 0) * 10%), 0);
}

/* Ecrãs: os blocos deixam de ser caixas chapadas — ganham vidro, relevo e
   um pouco de vida (seleção que percorre as opções, cursor, brilho). */
html[data-orbit] .home-v2 .hero-3d__screen { background: radial-gradient(ellipse 120% 70% at 0% 0%, #2c2c2c, #0b0b0b 62%), #000; }
html[data-orbit] .home-v2 .hero-3d__ui-search,
html[data-orbit] .home-v2 .hero-3d__ui-chips span,
html[data-orbit] .home-v2 .hero-3d__ui-list li,
html[data-orbit] .home-v2 .hero-3d__ui-steps {
  border-color: #ffffff17; background: linear-gradient(180deg, #1b1b1b, #0c0c0c);
  box-shadow: inset 0 1px 0 #ffffff17, 0 8px 16px -8px #000;
}
html[data-orbit] .home-v2 .hero-3d__ui-chips span,
html[data-orbit] .home-v2 .hero-3d__ui-list li { transition: none; }
html[data-orbit] .home-v2 .hero-3d__pill { border-color: #ffffff2e; background: #ffffff0d; color: #d0d0d0; box-shadow: inset 0 1px 0 #ffffff1a; }
html[data-orbit] .home-v2 .hero-3d__ui-search span::before {
  content: ""; display: inline-block; width: 1px; height: 12px; margin-right: 5px; vertical-align: -2px; background: #fff;
}
html[data-orbit] .home-v2 .hero-3d__ui-card { position: relative; overflow: hidden; box-shadow: inset 0 1px 0 #fff, 0 10px 24px -10px #000, 0 0 30px -10px #ffffff40; }
html[data-orbit] .home-v2 .hero-3d__ui-card::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 38%, #ffffffb3 50%, transparent 62%) 220% 0 / 260% 100% no-repeat;
}
html[data-orbit] .home-v2 .hero-3d__ui-steps li:first-child::before { box-shadow: 0 0 0 3px #ffffff26, 0 0 10px #fff; }
@media (prefers-reduced-motion: no-preference) {
  html[data-orbit] .home-v2 .hero-3d__ui-search span::before { animation: d-caret 1.1s steps(1) infinite; }
  html[data-orbit] .home-v2 .hero-3d__ui-card::after { animation: d-card-shine 7s var(--d-ease) 2s infinite; }
  html[data-orbit] .home-v2 .hero-3d__ui-chips span { animation: d-pick 8s ease-in-out infinite; }
  html[data-orbit] .home-v2 .hero-3d__ui-chips span:nth-child(2) { animation-delay: 2s; }
  html[data-orbit] .home-v2 .hero-3d__ui-chips span:nth-child(3) { animation-delay: 4s; }
  html[data-orbit] .home-v2 .hero-3d__ui-chips span:nth-child(4) { animation-delay: 6s; }
  html[data-orbit] .home-v2 .hero-3d__ui-list li { animation: d-pick 6s ease-in-out .8s infinite; }
  html[data-orbit] .home-v2 .hero-3d__ui-list li:nth-child(2) { animation-delay: 2.8s; }
  html[data-orbit] .home-v2 .hero-3d__ui-list li:nth-child(3) { animation-delay: 4.8s; }
  html[data-orbit] .home-v2 .hero-3d__ui-steps li:first-child::before { animation: d-pulse 2.2s ease-out infinite; }
}
@keyframes d-caret { 50% { opacity: 0; } }
@keyframes d-card-shine { 0% { background-position: 220% 0; } 28%, 100% { background-position: -120% 0; } }
@keyframes d-pick {
  0%, 30%, 100% { border-color: #ffffff17; box-shadow: inset 0 1px 0 #ffffff17, 0 8px 16px -8px #000; }
  8%, 22% { border-color: #ffffff8c; box-shadow: inset 0 1px 0 #ffffff40, 0 0 0 1px #ffffff26, 0 0 22px -2px #ffffff40, 0 8px 16px -8px #000; }
}
@keyframes d-pulse { 0% { box-shadow: 0 0 0 0 #ffffff80, 0 0 10px #fff; } 100% { box-shadow: 0 0 0 9px #ffffff00, 0 0 10px #fff; } }

/* Cartões de vidro a flutuar junto aos aparelhos (profundidade + paralaxe). */
html[data-orbit] .d-float {
  position: absolute; z-index: 4; display: flex; align-items: center; gap: 11px;
  padding: 9px 18px 9px 9px; border: 1px solid #ffffff2e; border-radius: 18px;
  background: linear-gradient(135deg, #ffffff26, #ffffff08 70%);
  -webkit-backdrop-filter: blur(16px) saturate(1.3); backdrop-filter: blur(16px) saturate(1.3);
  box-shadow: inset 0 1px 0 #ffffff40, inset 0 -1px 0 #0005, 0 2px 6px #0009, 0 24px 50px -14px #000;
  color: #fff; font-size: 13px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap;
  transform: translate3d(calc(var(--ty, 0) * -16px), calc(var(--tx, 0) * -12px), 0);
}
html[data-orbit] .d-float__icon {
  display: grid; place-items: center; width: 32px; height: 32px; border-radius: 11px;
  background: linear-gradient(180deg, #fff, #cfcfcf); color: #0a0a0a;
  box-shadow: inset 0 -2px 0 #0002, 0 0 22px -2px #ffffff66;
}
html[data-orbit] .d-float__icon svg { width: 17px; height: 17px; }
html[data-orbit] .d-float--verified { left: -28px; top: 28px; }
html[data-orbit] .d-float--secure { right: -34px; top: 548px; }
@media (prefers-reduced-motion: no-preference) {
  html[data-orbit] .d-float { animation: d-pop 1s var(--d-ease) both, d-bob 7s ease-in-out infinite; }
  html[data-orbit] .d-float--verified { animation-delay: 1s, 2s; }
  html[data-orbit] .d-float--secure { animation-delay: 1.35s, 0s; animation-duration: 1s, 8.5s; }
}
@keyframes d-pop { from { opacity: 0; scale: .8; filter: blur(8px); } to { opacity: 1; scale: 1; filter: blur(0); } }
@keyframes d-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }

/* ── Botões de loja: vidro com espessura ────────────────────────────────── */
html[data-orbit] .store-badge {
  border-color: #ffffff24; border-radius: 14px; background: linear-gradient(180deg, #ffffff12, #ffffff03);
  box-shadow: inset 0 1px 0 #ffffff26, inset 0 -1px 0 #0007, 0 2px 6px #0009, 0 14px 30px -14px #000;
  transition: transform .3s var(--d-ease), box-shadow .3s, border-color .3s, background .3s;
}
html[data-orbit] .store-badge--disabled { box-shadow: inset 0 1px 0 #ffffff12, 0 2px 6px #0006; }

/* ── Secções: separadores de luz em vez de linhas chapadas ──────────────── */
html[data-orbit] .home-v2 main > section { position: relative; border-bottom-color: transparent; }
html[data-orbit] .home-v2 main > section:not(.hero):not(.final-section)::after,
html[data-orbit] .home-v2 .hero .hero-bottom::before {
  content: ""; position: absolute; left: 50%; bottom: 0; width: min(1240px, 92%); height: 1px; translate: -50% 0; pointer-events: none;
  background: linear-gradient(90deg, transparent, #ffffff26 25%, #ffffff66 50%, #ffffff26 75%, transparent);
}
html[data-orbit] .home-v2 .hero-bottom { position: relative; border-top-color: transparent; }
html[data-orbit] .home-v2 .hero .hero-bottom::before { top: -1px; bottom: auto; width: 100%; }
html[data-orbit] .home-v2 .section h2 {
  background: linear-gradient(180deg, #fff 30%, #9a9a9a); -webkit-background-clip: text; background-clip: text; color: transparent;
}
html[data-orbit] .home-v2 .ecosystem-panel--provider h3 { color: #111; }

/* ── Cartões: profundidade em camadas ───────────────────────────────────── */
html[data-orbit] body .ecosystem-panel,
html[data-orbit] body .page-hero__panel,
html[data-orbit] body .final-cta {
  box-shadow: inset 0 1px 0 #ffffff17, 0 1px 2px #0008, 0 8px 18px -6px #000a, 0 30px 60px -24px #000, 0 70px 120px -50px #000;
}
html[data-orbit] body .ecosystem-panel--provider { box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 #0002, 0 1px 2px #0008, 0 8px 18px -6px #000a, 0 30px 60px -24px #000, 0 70px 120px -50px #000; }
/* Contorno que acende junto ao cursor (usa --light-x/--light-y do orbit.js). */
html[data-orbit] body [data-motion-card]::before {
  content: ""; position: absolute; inset: 0; z-index: 3; padding: 1px; border-radius: inherit; pointer-events: none;
  background: radial-gradient(260px circle at var(--light-x, 50%) var(--light-y, 50%), #ffffffd9, #ffffff00 70%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  opacity: 0; transition: opacity .35s;
}
html[data-orbit] body .ecosystem-panel--provider::before { background: radial-gradient(260px circle at var(--light-x, 50%) var(--light-y, 50%), #000000b3, #00000000 70%); }

/* Arte dos cartões. Cliente: um mostrador onde a luz anda para trás — o
   tempo a voltar. Prestador: a moeda oscila e apanha a luz. */
html[data-orbit] .orbit-art--time .orbit-official-clock { position: relative; z-index: 1; width: 132px; height: 132px; }
html[data-orbit] .d-rewind {
  position: absolute; left: 50%; top: 50%; width: 206px; height: 206px; translate: -50% -50%;
  -webkit-mask: var(--d-ticks) center / 100% 100% no-repeat; mask: var(--d-ticks) center / 100% 100% no-repeat;
  background: #ffffff38;
}
html[data-orbit] .d-rewind::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(#fff 0deg, #ffffffb3 4deg, #ffffff33 90deg, transparent 170deg);
  animation: d-spin 10s linear infinite reverse;
}
html[data-orbit] .orbit-coin { position: relative; overflow: hidden; box-shadow: 3px 3px 0 #ddd, 7px 7px 0 #666, 11px 11px 0 #444, 22px 30px 25px #0004, 40px 60px 60px -10px #0005, inset 0 0 0 8px #333, inset 6px 6px 18px #fff3; }
html[data-orbit] .orbit-coin::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  background: linear-gradient(115deg, transparent 36%, #ffffff8c 50%, transparent 64%) 220% 0 / 260% 100% no-repeat;
}
html[data-orbit] .orbit-official-clock { filter: drop-shadow(0 18px 24px #000c) drop-shadow(0 0 30px #ffffff14); }
@media (prefers-reduced-motion: no-preference) {
  html[data-orbit] .orbit-coin { animation: d-coin 9s ease-in-out infinite; }
  html[data-orbit] .orbit-coin::after { animation: d-card-shine 6s var(--d-ease) 1s infinite; }
}
@keyframes d-coin {
  0%, 100% { transform: perspective(600px) rotateY(-28deg) rotateX(20deg) rotateZ(12deg); }
  50% { transform: perspective(600px) rotateY(-8deg) rotateX(12deg) rotateZ(4deg) translateY(-6px); }
}

/* O CTA final: luz a percorrer o contorno e um mostrador gigante ao fundo. */
html[data-orbit] body .final-cta::before {
  opacity: 1;
  background: conic-gradient(from var(--d-angle), #ffffff00 0 62%, #ffffff40 80%, #ffffffe6 88%, #ffffff00 92%);
  animation: d-orbit 14s linear infinite;
}
@keyframes d-orbit { to { --d-angle: 1turn; } }
html[data-orbit] .home-v2 .final-cta {
  position: relative; overflow: hidden; align-items: center; min-height: 340px;
  background:
    radial-gradient(ellipse 60% 90% at 88% 110%, #ffffff24, transparent 60%),
    radial-gradient(ellipse at 80% 100%, #3a3a3a, #141414 65%);
}
html[data-orbit] .home-v2 .final-cta > div:first-child > *,
html[data-orbit] .home-v2 .final-cta > :not(:first-child) { position: relative; z-index: 4; }
/* Sem posição (nem translate) no primeiro filho: o mostrador ancora no cartão. */
html[data-orbit] .home-v2 .final-cta > div:first-child { position: static; }
html[data-orbit] .home-v2 .final-cta > div:first-child::before {
  content: ""; position: absolute; z-index: -1; width: 620px; height: 620px; right: -260px; top: 50%; translate: 0 -50%; pointer-events: none;
  -webkit-mask: var(--d-ticks) center / 100% 100% no-repeat; mask: var(--d-ticks) center / 100% 100% no-repeat;
  background: conic-gradient(from 200deg, #ffffff0a, #ffffff3d 60%, #ffffff0a);
}
html[data-orbit] .home-v2 .final-cta h2 { font-size: clamp(3.2rem, 6vw, 6rem); letter-spacing: -.06em; }
html[data-orbit] .home-v2 .final-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; min-width: 0; }
html[data-orbit] .home-v2 .final-cta .btn--light { box-shadow: inset 0 1px 0 #fff, inset 0 -2px 0 #0002, 0 16px 40px -12px #ffffff80; }

/* ── Confiança (home e /clientes/): peças com ícone e título próprios, em
   vez de listas de ✓ iguais. O :is() com IDs vence as regras antigas de
   #beneficios (fundo claro) e de .trust-section nas páginas interiores. ── */
html[data-orbit] body section#beneficios { background: radial-gradient(ellipse 70% 60% at 50% 0%, #1c1c1c, #0a0a0a 70%); color: #fff; }
html[data-orbit] body section#beneficios .eyebrow { color: #a1a1a1; }
html[data-orbit] body section#beneficios h2 { color: #fff; }
html[data-orbit] body section#requisitos { background: radial-gradient(ellipse 70% 60% at 50% 0%, #1c1c1c, #0a0a0a 70%); color: #fff; border-bottom-color: #ffffff18; }
html[data-orbit] body section#requisitos .eyebrow { color: #a1a1a1; }
html[data-orbit] body section#requisitos h2 { color: #fff; }
html[data-orbit] body section#requisitos .requirements-intro { max-width: 64ch; color: #bdbdbd; line-height: 1.8; }
/* As duas notas passam a uma faixa de vidro discreta por baixo dos cartões. */
html[data-orbit] body section#requisitos .requirements-note { max-width: none; margin: 0; padding: 14px 20px 14px 46px; border: 1px solid #ffffff14; border-radius: 14px; background: #ffffff06; color: #a9a9a9; font-size: 13.5px; line-height: 1.7; position: relative; }
html[data-orbit] body section#requisitos .requirements-note::before { content: "i"; position: absolute; left: 16px; top: 15px; width: 18px; height: 18px; display: grid; place-items: center; border: 1px solid #ffffff38; border-radius: 50%; color: #ddd; font: italic 600 11px/1 Georgia, serif; }
html[data-orbit] body section#requisitos .trust-list--bento + .requirements-note { margin-top: 20px; }
html[data-orbit] body section#requisitos .requirements-note + .requirements-note { margin-top: 10px; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 48px; border: 0; background: none; box-shadow: none; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento.trust-list--steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento li {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; font-weight: 400; font-size: inherit; padding: 34px 34px 36px; border: 1px solid #ffffff1a; border-radius: 22px;
  background: radial-gradient(120% 80% at 0% 0%, #1d1d1d, #0c0c0c 60%);
  box-shadow: inset 0 1px 0 #ffffff14, 0 1px 2px #0008, 0 24px 50px -30px #000;
}
/* Número ímpar de peças: a última ocupa a linha inteira. */
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento:not(.trust-list--steps) li:last-child:nth-child(odd) { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; column-gap: 26px; row-gap: 10px; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento:not(.trust-list--steps) li:last-child:nth-child(odd) span { grid-row: 1 / span 2; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento:not(.trust-list--steps) li:last-child:nth-child(odd) h3 { margin-top: 4px; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento:not(.trust-list--steps) li:last-child:nth-child(odd) p { max-width: 90ch; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento li span {
  display: grid; place-items: center; flex: 0 0 auto; width: 54px; height: 54px; border: 1px solid #ffffff2e; border-radius: 16px; color: #fff; font-size: inherit;
  background: radial-gradient(circle at 30% 25%, #ffffff30, #ffffff08 70%);
  box-shadow: inset 0 1px 0 #ffffff4d, 0 0 0 6px #ffffff06, 0 0 34px -4px #ffffff30, 0 10px 20px -6px #000;
  transition: box-shadow .35s, transform .35s var(--d-ease);
}
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento li span svg { width: 26px; height: 26px; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento h3 { margin: 10px 0 0; color: #fff; font-size: clamp(1.15rem, 1.6vw, 1.45rem); font-weight: 500; letter-spacing: -.03em; line-height: 1.2; }
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento li p { margin: 0; max-width: 60ch; color: #bbb; font-size: 14px; line-height: 1.8; }
/* Passos: número grande em contorno, no canto. */
html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento .trust-step {
  position: absolute; top: 22px; right: 28px; color: transparent; -webkit-text-stroke: 1px #ffffff2e;
  font-size: 64px; font-weight: 300; line-height: 1; letter-spacing: -.04em; font-variant-numeric: tabular-nums; pointer-events: none;
}

/* ── Perguntas: o «+» roda para «×» e a resposta desliza ─────────────────── */
html[data-orbit] .home-v2 .faq-item summary::after,
html[data-orbit] .home-v2 .faq-item[open] summary::after {
  content: "+"; border-color: #ffffff2e; background: linear-gradient(180deg, #ffffff12, #ffffff03);
  box-shadow: inset 0 1px 0 #ffffff1f; transition: transform .4s var(--d-ease), background .3s, color .3s;
}
html[data-orbit] .home-v2 .faq-item[open] summary::after { transform: rotate(45deg); background: #fff; color: #000; }
html[data-orbit] body .faq-item[open] { border-radius: 14px; box-shadow: inset 0 1px 0 #ffffff12, 0 24px 50px -30px #000; }
@supports selector(::details-content) {
  @media (prefers-reduced-motion: no-preference) {
    html[data-orbit] .home-v2 .faq-item { interpolate-size: allow-keywords; }
    html[data-orbit] .home-v2 .faq-item::details-content { height: 0; overflow: clip; transition: height .45s var(--d-ease), content-visibility .45s allow-discrete; }
    html[data-orbit] .home-v2 .faq-item[open]::details-content { height: auto; }
  }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html[data-orbit] a.store-badge:hover { transform: translateY(-3px); border-color: #ffffff5c; background: linear-gradient(180deg, #ffffff1f, #ffffff06); box-shadow: inset 0 1px 0 #ffffff40, 0 4px 10px #0009, 0 24px 44px -16px #000, 0 0 34px -8px #ffffff40; }
  html[data-orbit] body [data-motion-card]:hover::before { opacity: 1; }
  html[data-orbit] body .ecosystem-panel:hover,
  html[data-orbit] body .page-hero__panel:hover {
    box-shadow: inset 0 1px 0 #ffffff24, 0 2px 4px #0008, 0 16px 30px -10px #000c, 0 50px 90px -30px #000, 0 100px 160px -60px #000;
  }
  html[data-orbit] body .ecosystem-panel--provider:hover { box-shadow: inset 0 1px 0 #fff, 0 2px 4px #0008, 0 16px 30px -10px #000c, 0 50px 90px -30px #000, 0 100px 160px -60px #000; }
  html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento li:hover span { transform: translateY(-3px) rotate(-4deg); box-shadow: inset 0 1px 0 #ffffff66, 0 0 0 7px #ffffff0d, 0 0 44px 0 #ffffff47, 0 14px 24px -6px #000; }
  html[data-orbit] .home-v2 .btn--light:hover { box-shadow: inset 0 1px 0 #fff, inset 0 -2px 0 #0002, 0 2px 4px #0006, 0 20px 44px -10px #ffffff99; }
  html[data-orbit] .home-v2 .btn--ghost:hover,
  html[data-orbit] .home-v2 .final-cta .btn--outline-light:hover { border-color: #ffffff73; background: linear-gradient(180deg, #ffffff24, #ffffff08); }
  html[data-orbit] .home-v2 .btn:hover span { transform: translate(3px, -3px); }
  html[data-orbit] .home-v2 .faq-item summary:hover::after { background: #ffffff26; }
}

/* ── Entradas no scroll (só onde o browser liga animações ao scroll) ────── */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    html[data-orbit] main .section .eyebrow,
    html[data-orbit] main .section h2,
    html[data-orbit] main .faq-item {
      animation: d-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 75%;
    }
    /* Cartões: só movimento — a opacidade já é tratada pelo orbit.js. */
    html[data-orbit] .ecosystem-panel,
    html[data-orbit] .trust-list li,
    html[data-orbit] .final-cta {
      animation: d-lift linear both; animation-timeline: view(); animation-range: entry 0% entry 80%;
    }
    html[data-orbit] .ecosystem-panel + .ecosystem-panel,
    html[data-orbit] .trust-list li:nth-child(2n) { animation-range: entry 12% entry 92%; }
    /* O CTA final mantém a luz do contorno; o levantar vai para o conteúdo. */
    html[data-orbit] .home-v2 .final-cta { animation: none; }
    html[data-orbit] .home-v2 .final-cta > div:first-child > *,
    html[data-orbit] .home-v2 .final-cta > :not(:first-child) { animation: d-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
  }
}
@keyframes d-rise { from { opacity: 0; translate: 0 36px; filter: blur(8px); } to { opacity: 1; translate: 0 0; filter: blur(0); } }
@keyframes d-lift { from { translate: 0 70px; scale: .96; } to { translate: 0 0; scale: 1; } }

/* ── Telemóvel ──────────────────────────────────────────────────────────── */
@media (max-width: 1100px) { html[data-orbit] .d-float--secure { right: 6px; } }
@media (max-width: 860px) {
  html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento.trust-list--steps { grid-template-columns: 1fr; }
  html[data-orbit] .home-v2 .hero__actions { justify-content: center; }
  html[data-orbit] .home-v2 .final-cta > div:first-child::before { width: 460px; height: 460px; right: -220px; top: 0; }
}
@media (max-width: 620px) {
  html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento { grid-template-columns: 1fr; }
  html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento li { padding: 26px 24px 28px; }
  html[data-orbit] body :is(#confianca, #beneficios, #requisitos) .trust-list--bento:not(.trust-list--steps) li:last-child:nth-child(odd) { display: flex; }
  html[data-orbit] .d-float { font-size: 14px; }
  html[data-orbit] .d-float--verified { left: -4px; top: 556px; }
  html[data-orbit] .d-float--secure { right: -10px; top: 430px; }
  html[data-orbit] .home-v2 .hero__actions { flex-direction: column; align-items: stretch; }

  html[data-orbit] .home-v2 .final-cta__actions { display: grid; width: 100%; }
  html[data-orbit] .home-v2 .final-cta > div:first-child::before { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-orbit] .orbit-halo::after,
  html[data-orbit] .d-dial-lit__sweep,
  html[data-orbit] .orbit-halo__ring::before,
  html[data-orbit] .orbit-halo__ring::after,
  html[data-orbit] .d-rays,
  html[data-orbit] .d-rewind::before,
  html[data-orbit] .home-v2 .btn--light::after,
  html[data-orbit] .home-v2 .hero h1 span,
  html[data-orbit] body .final-cta::before { animation: none; }
  html[data-orbit] .orbit-halo::after,
  html[data-orbit] .d-dial-lit__sweep { transform: rotate(calc(var(--d-now, 0) * 6deg)); }
  html[data-orbit] .hero-3d__glass::after,
  html[data-orbit] .d-float { transform: none; }
  html[data-orbit] .home-v2 .hero-3d__device { -webkit-box-reflect: none; }
}
