/* Estilo compartilhado das páginas do Appura (site do app iOS).
   Mesmas cores do app e do web app — ver rn/src/theme/index.ts e index.html. */
:root{
  --bg:#0a0d14; --surface:#111520; --surface2:#161c2e; --border:#1e2840;
  --text:#e2e8f8; --muted:#8390ad; --accent:#00e5a0; --accent2:#4f8fff;
  --r-sm:6px; --r-md:10px; --r-lg:16px;
  --sp-xs:4px; --sp-sm:8px; --sp-md:12px; --sp-lg:16px; --sp-xl:24px; --sp-2xl:40px;
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Consolas,monospace;
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#f4f6fb; --surface:#ffffff; --surface2:#eaeef7; --border:#d7dde9;
    --text:#1a202c; --muted:#64748b; --accent:#00a878; --accent2:#2563eb;
  }
}
:root[data-theme="dark"]{
  --bg:#0a0d14; --surface:#111520; --surface2:#161c2e; --border:#1e2840;
  --text:#e2e8f8; --muted:#8390ad; --accent:#00e5a0; --accent2:#4f8fff;
}
:root[data-theme="light"]{
  --bg:#f4f6fb; --surface:#ffffff; --surface2:#eaeef7; --border:#d7dde9;
  --text:#1a202c; --muted:#64748b; --accent:#00a878; --accent2:#2563eb;
}
*{box-sizing:border-box}
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--font-sans);
     line-height:1.6; -webkit-font-smoothing:antialiased}
a{color:var(--accent2); text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible, button:focus-visible{outline:2px solid var(--accent2); outline-offset:3px; border-radius:4px}
.wrap{max-width:740px; margin:0 auto; padding:0 var(--sp-xl)}

header.site{border-bottom:1px solid var(--border)}
header.site .bar{display:flex; align-items:center; justify-content:space-between;
                 padding:14px var(--sp-xl); max-width:740px; margin:0 auto}
.brand{display:flex; align-items:center; gap:9px; font-weight:800; font-size:18px; text-decoration:none}
.brand img{width:28px; height:28px; display:block; border-radius:7px}
.brand b{color:var(--accent)} .brand span{color:var(--text)}
.brand:hover{text-decoration:none}
.back{font-size:13.5px; color:var(--muted); text-decoration:none; font-weight:600}
.back:hover{color:var(--text); text-decoration:none}
.bar-right{display:flex; align-items:center; gap:16px}
.theme-toggle{display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%; border:1px solid var(--border);
  background:transparent; color:var(--text); font-size:15px; line-height:1; cursor:pointer}
.theme-toggle:hover{border-color:var(--accent2)}

main{padding:var(--sp-2xl) 0 64px}
.eyebrow{font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
         color:var(--accent); font-weight:600; margin:0 0 8px}
h1{font-size:clamp(1.8rem, 2.6vw + .8rem, 2.4rem); letter-spacing:-.02em; margin:0 0 10px; text-wrap:balance}
.lede{color:var(--muted); font-size:16px; max-width:56ch; margin:0 0 4px}
.updated{font-family:var(--font-mono); font-size:12px; color:var(--muted); margin:0 0 var(--sp-2xl)}

.summary-card{background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent);
  border-radius:var(--r-md); padding:var(--sp-lg) var(--sp-xl); margin-bottom:var(--sp-2xl)}
.summary-card strong{color:var(--text)}
.summary-card ul{margin:10px 0 0; padding-left:20px; color:var(--muted); font-size:14px; line-height:1.7}
.summary-card li b{color:var(--text)}

h2{font-size:16px; margin:var(--sp-2xl) 0 var(--sp-md); padding-bottom:8px;
   border-bottom:1px solid var(--border); display:flex; align-items:baseline; gap:8px}
h2 .num{font-family:var(--font-mono); color:var(--accent2); font-size:13px}
section p{font-size:14.5px; color:var(--muted); margin:0 0 12px}
section p strong{color:var(--text)}
section ul{margin:0 0 12px; padding-left:20px; color:var(--muted); font-size:14.5px; line-height:1.7}
section ul li b{color:var(--text)}
code{font-family:var(--font-mono); background:var(--surface2); padding:1px 5px;
     border-radius:4px; font-size:13px; color:var(--text)}

.table-wrap{overflow-x:auto; margin:0 0 var(--sp-lg)}
table{width:100%; border-collapse:collapse; font-size:13.5px; min-width:520px}
th{text-align:left; font-family:var(--font-mono); font-size:11px; letter-spacing:.05em;
   text-transform:uppercase; color:var(--muted); font-weight:600; padding:8px 12px;
   border-bottom:1px solid var(--border)}
td{padding:10px 12px; border-bottom:1px solid var(--border); color:var(--muted); vertical-align:top}
td b{color:var(--text)}
tr:last-child td{border-bottom:none}

.contact-card{background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent);
  border-radius:var(--r-md); padding:var(--sp-lg) var(--sp-xl); margin-top:var(--sp-lg);
  display:flex; flex-wrap:wrap; gap:var(--sp-md); align-items:center; justify-content:space-between}
.contact-card .label{font-size:13px; color:var(--muted); margin-bottom:2px}
.contact-card .email{font-family:var(--font-mono); font-size:16px; font-weight:600}
.contact-card .btn{background:var(--accent); color:#04150d; font-weight:700; font-size:14px;
  padding:10px 18px; border-radius:var(--r-sm); white-space:nowrap}
.contact-card .btn:hover{text-decoration:none; filter:brightness(1.07)}

/* ── Landing ─────────────────────────────────────────────────────────────── */
.hero{display:flex; flex-wrap:wrap; gap:var(--sp-2xl); align-items:center; padding:var(--sp-2xl) 0}
.hero-icon{width:120px; height:120px; border-radius:27px; flex:none;
           box-shadow:0 10px 30px rgba(0,0,0,.25)}
.hero-txt{flex:1; min-width:260px}
.price{display:inline-flex; gap:8px; flex-wrap:wrap; margin:var(--sp-lg) 0 0}
.price .tag{background:var(--surface); border:1px solid var(--border); border-radius:999px;
  padding:6px 14px; font-size:13.5px; color:var(--text); font-weight:600}
.price .tag b{color:var(--accent)}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:var(--sp-lg);
      margin:var(--sp-lg) 0 0}
.feature{background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);
         padding:var(--sp-lg)}
.feature h3{margin:0 0 6px; font-size:15px; color:var(--text)}
.feature p{margin:0; font-size:13.5px; color:var(--muted); line-height:1.6}
.feature .ic{font-size:22px; display:block; margin-bottom:8px}

footer{border-top:1px solid var(--border); padding:var(--sp-xl) 0; margin-top:var(--sp-2xl)}
.foot-row{display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--sp-lg);
  align-items:center; max-width:740px; margin:0 auto; padding:0 var(--sp-xl)}
.foot-links{display:flex; gap:var(--sp-lg); font-size:13.5px; flex-wrap:wrap}
.foot-links a{color:var(--muted); text-decoration:none}
.foot-links a:hover{color:var(--text)}
.foot-copy{font-size:12.5px; color:var(--muted)}