/* ── Rivonte · páginas de serviço v2 (usa os tokens do index: Inter/Montserrat/Open Sans, --gold) ── */

/* barra de progresso de scroll */
.sv-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--gold);z-index:700;transition:width .08s linear}

/* garantias por baixo dos CTAs do hero */
/* Badges do hero: sempre numa linha, com o certo dentro de uma bola laranja.
   Todas as regras de .sv-hero-badges vivem aqui, porque este ficheiro carrega
   depois do services.css e ganharia na cascata. */
.sv-hero-badges{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem;margin-top:1.1rem}
.sv-hero-badges span{display:inline-flex;align-items:center;gap:5px;font-family:"Inter",sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.65);white-space:nowrap}
.sv-hero-badges svg{width:13px;height:13px;flex-shrink:0;padding:2.2px;box-sizing:border-box;border-radius:50%;background:var(--gold);stroke:#fff;fill:none;stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}
/* entre 769 e 1099 o formulario ao lado aperta a coluna do hero */
@media(min-width:769px) and (max-width:1099px){
  .sv-hero-badges span{font-size:.58rem;letter-spacing:.03em}
}
@media(max-width:768px){
  .sv-hero-badges{justify-content:center;width:100%;gap:.4rem}
  .sv-hero-badges span{font-size:min(2.25vw,.63rem);letter-spacing:.02em;gap:4px}
  .sv-hero-badges svg{width:min(3.6vw,12px);height:min(3.6vw,12px);padding:1.9px;stroke-width:5}
}

/* cascata (stagger) — funciona com o .reveal existente */
.sv-stagger>*{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
.sv-stagger.visible>*{opacity:1;transform:none}
.sv-stagger.visible>*:nth-child(2){transition-delay:.08s}
.sv-stagger.visible>*:nth-child(3){transition-delay:.16s}
.sv-stagger.visible>*:nth-child(4){transition-delay:.24s}
.sv-stagger.visible>*:nth-child(5){transition-delay:.32s}
.sv-stagger.visible>*:nth-child(6){transition-delay:.4s}

/* secções */
.sv-dark{background:#080808;padding:6rem 5vw;position:relative;overflow:hidden}
.sv-light{background:#D9DEE4;color:#141414;padding:6rem 5vw;position:relative;overflow:hidden}
.sv-light .stag{color:rgba(20,20,20,.55)}
.sv-light .stitle{color:#141414}
.sv-light .stitle em{color:#2563EB}
.sv-wrap{max-width:1180px;margin:0 auto;position:relative;z-index:1}
.sv-head{max-width:680px;margin:0 auto 3rem;text-align:center}
.sv-head .stag,.sv-head .stitle{display:block}
.sv-desc{font-family:"Open Sans","Inter",sans-serif;font-size:1rem;line-height:1.8;color:rgba(255,255,255,.62);margin-top:1rem}
.sv-light .sv-desc{color:rgba(20,20,20,.68)}
.sv-wm{position:absolute;width:520px;height:auto;opacity:.06;pointer-events:none;z-index:0}
.sv-wm-r{right:-160px;top:-80px}
.sv-wm-l{left:-180px;bottom:-120px}

/* ── DEMO: o teu cliente pergunta, tu apareces ── */
.sv-demo{display:grid;grid-template-columns:1fr 1.15fr;gap:4rem;align-items:center}
.sv-demo-copy .stag,.sv-demo-copy .stitle{display:block}
.sv-checks{list-style:none;margin:1.5rem 0 0;padding:0;display:flex;flex-direction:column;gap:.8rem}
.sv-checks li{display:flex;gap:.75rem;align-items:flex-start;font-family:"Open Sans","Inter",sans-serif;font-size:.95rem;line-height:1.6;color:rgba(255,255,255,.72)}
.sv-checks li::before{content:"";flex-shrink:0;width:22px;height:22px;border-radius:50%;background:rgba(217,118,46,.15);border:1px solid rgba(217,118,46,.5);margin-top:2px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9762E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");background-size:12px;background-position:center;background-repeat:no-repeat}
.sv-tabs{display:flex;gap:.4rem;margin-bottom:1rem}
.sv-tab{font-family:"Inter",sans-serif;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:.55rem 1rem;border-radius:999px;border:1px solid rgba(255,255,255,.15);background:transparent;color:rgba(255,255,255,.6);cursor:pointer;transition:all .25s}
.sv-tab:hover{border-color:var(--gold);color:#fff}
.sv-tab.active{background:var(--gold);border-color:var(--gold);color:#1a1204}
/* Quando a secção de demonstração (checklist + separador do chat) fica sobre fundo
   cinzento (.sv-light) em vez do preto habitual, o texto e as abas herdavam cores
   pensadas para fundo escuro e ficavam quase invisíveis. */
.sv-light .sv-checks li{color:rgba(20,20,20,.72)}
.sv-light .sv-tab:not(.active){border-color:rgba(20,20,20,.18);color:rgba(20,20,20,.55)}
.sv-light .sv-tab:not(.active):hover{border-color:var(--gold);color:#141414}
.sv-screen{background:#111;border:1px solid rgba(255,255,255,.1);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.55);overflow:hidden;min-height:340px}
.sv-screen-bar{display:flex;align-items:center;gap:6px;padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.08);background:#161616}
.sv-screen-bar i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.15);display:block}
.sv-screen-bar span{margin-left:auto;font-family:"Inter",sans-serif;font-size:.68rem;color:rgba(255,255,255,.4);letter-spacing:.06em}
.sv-pane{display:none;padding:1.4rem}
.sv-pane.active{display:block}
/* google */
.sv-serp-q{display:flex;align-items:center;gap:.6rem;background:#1e1e1e;border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:.6rem 1rem;font-family:"Open Sans","Inter",sans-serif;font-size:.85rem;color:#fff;margin-bottom:1.2rem}
.sv-serp-q svg{width:16px;height:16px;stroke:rgba(255,255,255,.5);fill:none;stroke-width:2;flex-shrink:0}
.sv-result{padding:.85rem 1rem;border-radius:10px;margin-bottom:.6rem;border:1px solid transparent;opacity:0;transform:translateY(10px);transition:all .5s ease}
.sv-pane.active .sv-result{opacity:1;transform:none}
.sv-pane.active .sv-result:nth-child(3){transition-delay:.15s}
.sv-pane.active .sv-result:nth-child(4){transition-delay:.3s}
.sv-result.win{background:rgba(217,118,46,.1);border-color:rgba(217,118,46,.5);position:relative}
.sv-result.win::after{content:"1º";position:absolute;right:1rem;top:.8rem;font-family:"Inter",sans-serif;font-weight:900;color:var(--gold);font-size:.8rem}
.sv-result small{display:block;font-family:"Open Sans","Inter",sans-serif;font-size:.7rem;color:rgba(255,255,255,.45);margin-bottom:.15rem}
.sv-result b{display:block;font-family:"Inter",sans-serif;font-size:.95rem;color:#8ab4f8;font-weight:700;margin-bottom:.2rem}
.sv-result.win b{color:#fff}
.sv-result p{margin:0;font-family:"Open Sans","Inter",sans-serif;font-size:.78rem;color:rgba(255,255,255,.6);line-height:1.5}
/* chat */
.sv-msg{max-width:88%;padding:.8rem 1rem;border-radius:14px;font-family:"Open Sans","Inter",sans-serif;font-size:.88rem;line-height:1.6;margin-bottom:.9rem}
.sv-msg.user{margin-left:auto;background:#2a2a2a;color:#fff;border-bottom-right-radius:4px}
.sv-msg.ai{background:#1a1a1a;border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.85);border-bottom-left-radius:4px;min-height:3.2em}
.sv-msg.ai mark{background:rgba(217,118,46,.22);color:#fff;padding:0 .25em;border-radius:4px}
.sv-caret{display:inline-block;width:2px;height:1em;background:var(--gold);vertical-align:-2px;margin-left:2px;animation:svBlink .8s step-end infinite}
@keyframes svBlink{50%{opacity:0}}
.sv-ai-label{display:flex;align-items:center;gap:.5rem;font-family:"Inter",sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:.5rem}
.sv-ai-label i{width:8px;height:8px;border-radius:50%;background:#4ade80;display:block;box-shadow:0 0 8px rgba(74,222,128,.6)}

/* ── O QUE FAZEMOS (cartões brancos) ── */
.sv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.sv-card{background:#fff;border:1px solid rgba(20,20,20,.08);border-radius:18px;padding:1.75rem;position:relative;overflow:hidden;box-shadow:0 10px 30px rgba(20,20,20,.06);transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease}
.sv-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .4s ease}
.sv-card:hover{transform:translateY(-8px);box-shadow:0 22px 48px rgba(20,20,20,.14)}
.sv-card:hover::before{transform:scaleX(1)}
.sv-card-icon{width:46px;height:46px;border-radius:12px;background:rgba(217,118,46,.12);display:flex;align-items:center;justify-content:center;margin-bottom:1rem}
.sv-card-icon svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sv-card h3{font-family:"Inter",sans-serif;font-size:1rem;font-weight:800;color:#141414;margin:0 0 .45rem}
.sv-card p{font-family:"Open Sans","Inter",sans-serif;font-size:.86rem;line-height:1.65;color:rgba(20,20,20,.65);margin:0}
.sv-card-num{position:absolute;top:1.1rem;right:1.3rem;font-family:"Inter",sans-serif;font-weight:900;font-size:1.6rem;color:transparent;-webkit-text-stroke:1px rgba(217,118,46,.45)}

/* ── TIMELINE que se preenche ao rolar ── */
.sv-tl{position:relative;margin-top:3.5rem;padding-top:1.4rem}
.sv-tl-track{position:absolute;left:0;right:0;top:0;height:2px;background:rgba(255,255,255,.1)}
.sv-tl-fill{position:absolute;left:0;top:0;height:2px;width:0;background:var(--gold);box-shadow:0 0 14px rgba(217,118,46,.6);transition:width .15s linear}
.sv-tl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.sv-tl-step{position:relative;padding-top:1.6rem}
.sv-tl-step::before{content:"";position:absolute;top:-1.4rem;left:0;width:14px;height:14px;border-radius:50%;background:#080808;border:2px solid rgba(255,255,255,.25);transform:translateY(-6px);transition:all .3s ease}
.sv-tl-step.on::before{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 6px rgba(217,118,46,.18)}
.sv-tl-when{font-family:"Inter",sans-serif;font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.4rem}
.sv-tl-step h3{font-family:"Inter",sans-serif;font-size:1rem;font-weight:800;color:#fff;margin:0 0 .4rem;opacity:.55;transition:opacity .3s}
.sv-tl-step p{font-family:"Open Sans","Inter",sans-serif;font-size:.85rem;line-height:1.65;color:rgba(255,255,255,.5);margin:0;transition:color .3s}
.sv-tl-step.on h3{opacity:1}
.sv-tl-step.on p{color:rgba(255,255,255,.7)}
.sv-note{margin-top:3rem;background:#111;border:1px solid rgba(255,255,255,.08);border-left:4px solid var(--gold);border-radius:12px;padding:1.5rem 1.75rem;font-family:"Open Sans","Inter",sans-serif;font-size:.9rem;line-height:1.75;color:rgba(255,255,255,.65)}
.sv-note b{color:#fff;font-family:"Inter",sans-serif}

/* ── ONDE APARECES + BLOG ── */
.sv-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-bottom:4rem}
.sv-badge{display:inline-flex;align-items:center;gap:.6rem;background:#fff;border:1px solid rgba(20,20,20,.08);border-radius:999px;padding:.75rem 1.3rem;font-family:"Inter",sans-serif;font-size:.85rem;font-weight:700;color:#141414;box-shadow:0 6px 18px rgba(20,20,20,.06);transition:transform .3s cubic-bezier(.34,1.56,.64,1),border-color .3s}
.sv-badge:hover{transform:translateY(-4px);border-color:var(--gold)}
.sv-badge i{width:10px;height:10px;border-radius:50%;display:block;background:var(--gold)}
.sv-badge i.b{background:#2563EB}.sv-badge i.g{background:#16a34a}.sv-badge i.p{background:#7c3aed}
.sv-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.sv-post{background:#fff;border:1px solid rgba(20,20,20,.08);border-radius:18px;padding:1.6rem;text-decoration:none;color:#141414;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 10px 30px rgba(20,20,20,.06);transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s}
.sv-post:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(20,20,20,.14)}
.sv-post-cat{font-family:"Inter",sans-serif;font-size:.62rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.sv-post h3{font-family:"Inter",sans-serif;font-size:.98rem;font-weight:800;line-height:1.35;margin:0;flex:1}
.sv-post span{font-family:"Inter",sans-serif;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#2563EB}

@media(max-width:960px){
  .sv-demo{grid-template-columns:1fr;gap:2.5rem}
  .sv-grid,.sv-posts{grid-template-columns:repeat(2,1fr)}
  .sv-tl-steps{grid-template-columns:repeat(2,1fr);row-gap:2.5rem}
}
@media(max-width:600px){
  .sv-dark,.sv-light{padding:4rem 5vw}
  .sv-grid,.sv-posts,.sv-tl-steps{grid-template-columns:1fr}
  .sv-tl-track,.sv-tl-fill{display:none}
  .sv-tl-step::before{display:none}
  .sv-tl-step{padding-top:0;padding-left:1rem;border-left:2px solid rgba(255,255,255,.12)}
  .sv-tl-step.on{border-left-color:var(--gold)}
  .sv-wm{width:320px}
}

/* SV-NIGHT-CTA */
/* Seccoes pretas com estrelas e meteoros, como no index */
.sv-dark>.sv-wrap{position:relative;z-index:1}
.sv-dark.sv-night-r [class^="sobre-meteor-"]{transform:rotate(-135deg);animation-name:sobre-meteor-r}
@keyframes sobre-meteor-r{0%{opacity:1;margin-top:-300px}12%{opacity:0}15%{margin-top:300px;margin-left:600px;opacity:0}100%{opacity:0}}
/* CTA igual ao index: faixa de ponta a ponta, colada ao banner Rivonte */
.sv-dark.sv-has-cta{padding-bottom:100px!important}
.sv-has-cta .cta-rivonte-bg{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1.5rem;width:calc(100% + 10vw);margin:5rem -5vw 0;padding:3.5rem 6rem;background:#141414;border:2px solid var(--gold);border-radius:0;position:relative;z-index:2;overflow:hidden;box-sizing:border-box}
.cta-rivonte-bg::before,.cta-rivonte-bg::after{content:"RIVONTE";position:absolute;font-family:"Inter",sans-serif;font-weight:800;font-size:min(7vw,90px);letter-spacing:-0.02em;line-height:1;color:rgba(255,255,255,0.035);pointer-events:none;z-index:0;white-space:nowrap}
.cta-rivonte-bg::before{left:-0.05em;top:-0.1em}
.cta-rivonte-bg::after{right:-0.05em;bottom:-0.1em}
.cta-rivonte-bg>div{position:relative;z-index:1}
.cta-eyebrow-sobre{font-family:"Inter",sans-serif;font-size:1.05rem;color:rgba(255,255,255,0.72);font-weight:600;letter-spacing:0.1em;text-transform:uppercase;margin:0 0 0.5rem}
.cta-headline{font-family:"Inter",sans-serif;font-size:clamp(2rem,3.6vw,2.8rem);color:#fff;font-weight:800;letter-spacing:-0.02em;line-height:1.15;margin:0}
.cta-headline span{color:var(--gold)}
.proc-cta-btn{display:inline-flex;align-items:center;gap:0.5rem;padding:0.85rem 1.75rem;border-radius:50px;font-family:"Inter",sans-serif;font-weight:700;font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase;text-decoration:none;transition:transform 0.25s ease,box-shadow 0.25s ease}
.proc-cta-btn:hover{transform:translateY(-2px)}
.proc-cta-btn-solid{background:#F38020;color:#fff;box-shadow:0 6px 20px rgba(243,128,32,0.35)}
.proc-cta-btn-solid:hover{box-shadow:0 10px 28px rgba(243,128,32,0.5)}
@media(max-width:768px){
  .sv-dark.sv-has-cta{padding-bottom:65px!important}
  .sv-has-cta .cta-rivonte-bg{margin-top:3rem;padding:2rem 1.25rem;flex-direction:column;text-align:center}
  .cta-eyebrow-sobre{font-size:0.75rem}
  .cta-headline{font-size:1.7rem}
}