/* Página comercial do Ryan — complementa assets/style.css (mesmos tokens, grade de 8px e componentes) */

/* acessibilidade */
.pular{position:absolute;left:var(--s2);top:-64px;z-index:100;height:40px;display:inline-flex;align-items:center;padding:0 var(--s2);border-radius:999px;background:var(--verde);color:#fff;font-size:14px;text-decoration:none;transition:top .2s ease;}
.pular:focus{top:var(--s2);}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.nav-links a:focus-visible,.brand:focus-visible,.menu-toggle:focus-visible,.menu-close:focus-visible,.proposta-apoio a:focus-visible,.footer a:focus-visible,.wa-float:focus-visible{outline:2px solid var(--acento);outline-offset:3px;border-radius:6px;}

/* faixa de prévia (só o painel vê) */
.previa{position:fixed;left:50%;bottom:var(--s3);transform:translateX(-50%);z-index:45;max-width:calc(100% - 32px);padding:10px var(--s2);border-radius:999px;background:var(--text);color:#fff;font-size:13px;text-align:center;box-shadow:0 12px 32px -12px rgba(0,0,0,.4);}

/* ===== TOPO ===== */
.rp-hero{min-height:auto;padding:calc(72px + var(--s12)) 0 var(--s12);}
.rp-hero .wrap{z-index:1;display:flex;flex-direction:column;align-items:center;}
.rp-badge{gap:10px;padding:0 var(--s2) 0 6px;}
.rp-badge strong{font-weight:600;color:var(--text);}
.rp-avatar{width:28px;height:28px;border-radius:50%;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;background:var(--verde);color:#fff;font-size:11px;font-weight:600;letter-spacing:.02em;}
.rp-avatar img{width:100%;height:100%;object-fit:cover;}
.rp-hero h1{max-width:18ch;font-size:clamp(40px,6vw,76px);}
.rp-sub{margin:var(--s3) auto var(--s6);max-width:52ch;text-wrap:balance;}

/* ===== SOBRE ===== */
.rp-sobre-grid{display:grid;gap:var(--s6);align-items:center;justify-items:center;}
/* foto ao lado do texto a partir do tablet; a foto encolhe junto com a tela */
@media(min-width:760px){.rp-sobre-grid{grid-template-columns:auto minmax(0,560px);justify-content:center;gap:clamp(48px,7vw,96px);}}
.retrato{position:relative;margin:0;width:clamp(200px,28vw,320px);aspect-ratio:1;}
/* anel duplo: traço externo girando + gradiente da marca */
.retrato::before{content:"";position:absolute;inset:-16px;border-radius:50%;border:1px dashed var(--border-2);animation:girar 60s linear infinite;}
.retrato-anel{width:100%;height:100%;border-radius:50%;padding:3px;background:conic-gradient(from 200deg,#B9CFA0,var(--verde),#9DBB7E,var(--verde-escuro),#B9CFA0);box-shadow:0 24px 64px -24px var(--glow),0 0 0 8px rgba(255,255,255,.6);}
.retrato-foto{width:100%;height:100%;border-radius:50%;overflow:hidden;border:4px solid var(--card);background:radial-gradient(circle at 50% 30%,#fff,var(--tint));display:flex;align-items:center;justify-content:center;}
.retrato-foto img{width:100%;height:100%;object-fit:cover;object-position:center 30%;}
.retrato-foto span{font-size:clamp(52px,6vw,72px);font-weight:500;letter-spacing:-.04em;color:var(--acento);}
@keyframes girar{to{transform:rotate(360deg);}}
.rp-sobre-texto{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2);}
.rp-sobre-texto .eyebrow{margin-bottom:0;}
.rp-sobre-texto h2{margin-bottom:var(--s1);}
.rp-sobre-texto .body{font-size:17px;max-width:52ch;}

/* ===== PLANO ===== */
.plano .proposta-corpo{gap:var(--s2);}
.plano .badge{align-self:flex-start;}
.plano .label{margin-top:var(--s2);}
.itens{list-style:none;margin:0;padding:0;display:grid;}
.item{display:grid;grid-template-columns:40px 1fr;gap:var(--s2);align-items:start;padding:var(--s2) 0;border-top:1px solid var(--border);}
.item:last-child{padding-bottom:0;}
.item .icon-box{width:40px;height:40px;border-radius:10px;}
.item-texto{display:grid;gap:4px;padding-top:2px;}
.item-texto strong{font-size:17px;font-weight:600;letter-spacing:-.01em;line-height:1.3;color:var(--text);}
.item-texto span{font-size:15px;line-height:1.55;color:var(--muted);}
.investimento-resumo{list-style:none;margin:var(--s3) 0 0;padding:var(--s3) 0 0;border-top:1px solid rgba(255,255,255,.16);display:grid;gap:12px;}
.investimento-resumo li{position:relative;padding-left:26px;font-size:15px;line-height:1.4;color:rgba(255,255,255,.9);}
.investimento-resumo li::before{content:"";position:absolute;left:2px;top:3px;width:6px;height:10px;border:solid #C9DBB4;border-width:0 2px 2px 0;transform:rotate(45deg);}
@media(min-width:900px){
  .plano.sem-preco{grid-template-columns:1fr;max-width:760px;}
}
/* com o preço embaixo da lista (abaixo de 900px), o resumo repetiria a lista */
@media(max-width:899px){
  .investimento-resumo{display:none;}
  .investimento-acao{padding-top:var(--s3);}
}

/* ===== PROPOSTA ===== */
.rp-proposta{padding-top:var(--s8);}
.proposta{
  display:grid;max-width:1040px;margin:0 auto;border-radius:var(--r-lg);overflow:hidden;
  background:var(--card);border:1px solid var(--border);box-shadow:0 0 0 1px rgba(74,90,58,.06),0 40px 80px -40px rgba(28,33,24,.35);
}
@media(min-width:900px){.proposta{grid-template-columns:1.35fr 1fr;}}
.proposta-corpo{padding:var(--s4) var(--s3);display:flex;flex-direction:column;gap:var(--s2);}
@media(min-width:720px){.proposta-corpo{padding:var(--s6);}}
.proposta-topo{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1) 12px;}
.proposta-cliente{font-size:13px;color:var(--faint);}
.proposta h3{font-size:clamp(26px,3vw,34px);letter-spacing:-.03em;line-height:1.15;}
.proposta-desc{font-size:16px;}
.proposta .label{margin-top:var(--s1);}
.proposta .checks{gap:12px;}
.proposta .plan-note{margin-top:var(--s1);}

/* painel do investimento: o destaque da página */
.investimento{
  position:relative;padding:var(--s4) var(--s3);display:flex;flex-direction:column;gap:var(--s1);color:#fff;
  background:radial-gradient(ellipse at 100% 0%,rgba(185,207,160,.28),transparent 55%),radial-gradient(ellipse at 0% 110%,rgba(150,184,112,.25),transparent 50%),linear-gradient(160deg,#4F6340,#2F3B25);
}
@media(min-width:720px){.investimento{padding:var(--s6);}}
.investimento::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:28px 28px;
  -webkit-mask-image:linear-gradient(transparent,#000);mask-image:linear-gradient(transparent,#000);}
.investimento > *{position:relative;}
.investimento-rotulo{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#C9DBB4;}
.investimento-valor strong{display:block;font-size:clamp(44px,5.6vw,60px);font-weight:500;letter-spacing:-.045em;line-height:1.05;}
.investimento-periodo{font-size:16px;color:rgba(255,255,255,.78);}
.investimento-cond{margin:var(--s3) 0 0;padding-top:var(--s3);border-top:1px solid rgba(255,255,255,.16);display:grid;gap:var(--s1);}
.investimento-cond p:last-child{font-size:15px;line-height:1.6;color:rgba(255,255,255,.85);}
.investimento-acao{margin-top:auto;padding-top:var(--s4);}
.btn-claro{background:#fff;color:var(--verde-escuro);width:100%;box-shadow:0 12px 32px -12px rgba(0,0,0,.45);}
.btn-claro:hover{background:#F1F6EC;}
.btn-claro:focus-visible{outline-color:#fff;}
.wa-ico{width:18px;height:18px;fill:currentColor;flex-shrink:0;}

.proposta-apoio{text-align:center;margin-top:var(--s4);font-size:15px;color:var(--muted);}
.proposta-apoio a{color:var(--acento);font-weight:500;text-underline-offset:3px;}

/* avisos: proposta protegida / encerrada / não encontrada */
.aviso{max-width:520px;margin:0 auto;padding:var(--s6) var(--s4);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s1);}
.aviso .icon-box{margin-bottom:var(--s2);}
.aviso .eyebrow{margin-bottom:0;}
.aviso h2{font-size:clamp(28px,3.4vw,36px);}
.aviso .body{margin-bottom:var(--s2);}
.aviso-campo{width:100%;max-width:320px;}
.aviso input{width:100%;height:48px;padding:0 14px;border-radius:var(--r-sm);border:1px solid var(--border-2);background:var(--card);font:16px 'Work Sans',sans-serif;color:var(--text);text-align:center;letter-spacing:.08em;}
.aviso input:focus{outline:none;border-color:var(--verde);box-shadow:0 0 0 3px rgba(74,90,58,.14);}
.aviso input[aria-invalid="true"]{border-color:#A33A2A;}
.aviso-erro{color:#A33A2A;font-size:14px;}
.aviso .btn{margin-top:var(--s1);}

/* ===== CONTATO ===== */
.rp-contato{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:880px;margin:0 auto;}
.rp-contato .lead{margin:var(--s3) 0 var(--s4);max-width:52ch;text-wrap:balance;}
.rp-contato .body{max-width:56ch;margin-bottom:var(--s4);}

/* ===== RODAPÉ ===== */
.rp-footer{text-align:center;}
.rp-footer .brand{justify-self:center;}
.rp-footer .body{margin:var(--s2) auto 0;max-width:none;}
.rp-rep{margin-top:var(--s1);font-size:14px;color:var(--faint);}
.rp-rep strong{font-weight:500;color:var(--text);}
.rp-footer .footer-bottom{justify-content:center;gap:var(--s1) var(--s3);margin-top:var(--s6);}
.rp-footer .footer-bottom a{color:var(--faint);}
.rp-footer .footer-bottom a:hover{color:var(--acento);}

@media (prefers-reduced-motion: reduce){.retrato::before{animation:none;}}

/* ===== CELULAR ===== */
@media(max-width:719px){
  .rp-hero{padding:calc(72px + var(--s6)) 0 var(--s8);}
  .rp-hero h1{font-size:clamp(34px,9.6vw,44px);}
  .rp-sub{margin:var(--s2) auto var(--s4);}
  .rp-badge{font-size:13px;}
  .retrato{width:200px;}
  .rp-sobre-grid{gap:var(--s4);}
  .rp-sobre-texto{align-items:center;}
  .rp-sobre-texto .body{font-size:16px;}
  /* plano: ícone sobre o texto, tudo centralizado como o resto da página */
  .plano .badge{align-self:center;}
  .item{grid-template-columns:1fr;justify-items:center;gap:12px;padding:var(--s3) 0;}
  .item-texto{padding-top:0;}
  .investimento{text-align:center;align-items:center;}
  .investimento-acao{width:100%;}
  .rp-footer{padding-bottom:calc(var(--s3) + 64px);}   /* espaço para o botão flutuante */
}

/* Marca própria do Ryan (monograma + nome), mesma identidade visual */
.rp-brand{display:inline-flex;align-items:center;gap:10px;}
.rp-mono{width:32px;height:32px;border-radius:10px;background:var(--acento);color:#F6F3EC;display:inline-flex;align-items:center;justify-content:center;font-family:'Work Sans',sans-serif;font-size:13px;font-weight:600;letter-spacing:.02em;flex:none;}
.rp-marca{font-family:'Work Sans',sans-serif;font-size:17px;font-weight:600;letter-spacing:-.02em;color:var(--text);white-space:nowrap;}

/* telas bem estreitas (320–360px) */
@media(max-width:374px){
  .wrap{padding-inline:var(--s2);}
  h2{font-size:26px;}
  .rp-hero h1{font-size:32px;}
  .rp-badge{font-size:12px;padding-right:12px;}
  .apply-card{padding:var(--s4) var(--s2);}
  .proposta-corpo,.investimento{padding:var(--s4) var(--s2);}
  .investimento-valor strong{font-size:40px;}
}
