@font-face {
  font-family: Inter;
  src: url(/modulos/inter.woff2) format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --ink: #172039;
  --muted: #536079;
  --blue: #224ec0;
  --line: #dce2ec;
  font: 16px/1.5 Inter, -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--ink);
  background: #f7f8fc;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; }
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 4px; }
svg { width: 18px; height: 18px; flex-shrink: 0; }
.top {
  width: min(1152px, calc(100% - 64px)); height: 78px; margin: auto;
  display: flex; align-items: center; justify-content: space-between;
}
.brand, .store { display: inline-flex; align-items: center; gap: 9px; color: var(--ink); }
.brand { font-size: 23px; font-weight: 740; letter-spacing: -.065em; }
.brand:hover { text-decoration: none; }
.mark, .tile { display: inline-flex; justify-content: center; align-items: end; }
.mark { width: 29px; height: 29px; background: #202e54; border-radius: 9px; padding: 7px; gap: 2px; }
.mark i, .tile i { background: white; transform: skewY(-16deg); }
.mark i { width: 4px; height: 7px; }
.mark i:nth-child(2) { height: 11px; }
.mark i:nth-child(3) { height: 15px; }
.store { font-size: 13px; font-weight: 590; min-height: 44px; }
.store svg, footer svg:last-child { width: 15px; }
main {
  width: min(880px, calc(100% - 64px)); margin: clamp(24px,8vh,82px) auto 40px;
  display: grid; grid-template-columns: .84fr 1fr; overflow: hidden;
  border-radius: 32px; border: 1px solid #dde3ed; background: white;
  box-shadow: 0 16px 50px -38px #23365a80;
}
.cover {
  position: relative; isolation: isolate; overflow: hidden; padding: clamp(30px,4vw,48px);
  color: white; background: radial-gradient(ellipse at 97% 105%,#5a60a5,transparent 61%),linear-gradient(136deg,#0d2247 7%,#183e83 70%,#3562af);
}
.cover::after {
  content: ""; position: absolute; z-index: -1;
  width: 135%; aspect-ratio: 1; left: 22%; top: 49%; transform: rotate(-18deg);
  border: 1px solid #cedaff30; border-radius: 38%;
  box-shadow: 0 0 0 19px #c1d6ff0d, 0 0 0 40px #c1d6ff0a, 0 0 0 68px #c1d6ff09;
}
h1 { margin: 0; font-weight: 660; letter-spacing: -.055em; line-height: 1.05; font-size: clamp(38px,4.5vw,56px); text-wrap: balance; }
.cover-copy { position: relative; z-index: 1; }
.cover-copy p { margin: 14px 0 0; font-size: 16px; color: #dce7ff; text-wrap: pretty; }
.cover-art { margin: clamp(54px,8vh,96px) auto 22px; display: grid; justify-content: start; padding-left: 10%; }
.tile {
  width: 124px; height: 124px; padding: 28px; gap: 7px; border-radius: 31px;
  transform: rotate(-12deg); background: linear-gradient(145deg,#87a9f7 -5%,#506dc5 68%,#41479d);
  border: 1px solid #c7d6ffa6; box-shadow: -7px 9px 0 #34539b,-8px 10px 0 #5572b2,-15px 18px 0 #274579,0 25px 36px #0c204d6b;
}
.tile i { width: 15px; height: 25px; border-radius: 2px; }
.tile i:nth-child(2) { height: 40px; }
.tile i:nth-child(3) { height: 55px; }
.panel { min-width: 0; padding: clamp(26px,4.3vw,48px); align-self: center; }
.panel > p { margin: 0 0 22px; color: var(--muted); }
form, label, #code-fields { display: grid; }
form, #code-fields { gap: 16px; }
label, .password-group { font-size: 14px; font-weight: 590; }
label { gap: 6px; }
input, select, button { font: inherit; }
input, select {
  width: 100%; min-width: 0; min-height: 46px; border: 1px solid #cbd3df;
  border-radius: 12px; padding: 10px 13px; background: white; color: var(--ink); font-size: 16px;
}
input:focus, select:focus { outline: 2px solid var(--blue); outline-offset: 1px; }
.password-group { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 8px; }
.password-group a { justify-self: end; font-size: 13px; padding: 6px 0; margin: -6px 0 0; }
.password-group input { grid-column: 1 / -1; }
button, .methods a {
  cursor: pointer; min-height: 46px; border: 0; border-radius: 13px; padding: 10px 14px;
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-weight: 620; background: var(--blue); color: white;
}
button:hover { background: #193d9f; }
button:disabled { opacity: .55; cursor: default; }
form > button[type=submit], form > button:not([type]):first-of-type { margin-top: 2px; }
.methods { display: flex; flex-wrap: wrap; gap: 8px; }
.methods:not(:has(> :not([hidden]))) { display: none; }
.methods:not(:empty) { margin-top: 10px; }
.methods a, .methods button, button.secondary, #again {
  color: #263b62; background: #f0f3f9; font-size: 13px; min-height: 44px;
}
.methods > * { flex: 1 1 max-content; }
.methods a:hover, .methods button:hover, .secondary:hover, #again:hover { background: #e5ebf7; text-decoration: none; }
.buyer-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; margin-top: 24px; border-top: 1px solid var(--line); padding-top: 8px; font-size: 14px; }
.buyer-row span { color: var(--muted); }
.buyer-row a, footer a { display: inline-flex; gap: 7px; align-items: center; min-height: 44px; font-weight: 630; }
.buyer-row svg { width: 15px; }
footer { margin-top: 14px; font-size: 13px; }
footer a { color: var(--muted); font-weight: 520; }
[data-mode=entrar] footer { margin-top: 0; }
.panel small, .key { color: var(--muted); }
.notice, .note, #notice:not(:empty) { margin: 12px 0; padding: 12px 14px; border-radius: 12px; background: #eef3fd; color: var(--ink); }
#notice:empty, [hidden] { display: none !important; }
:focus-visible { outline: 3px solid #b37a12; outline-offset: 3px; }
#keys { padding: 0; }
.key { display: flex; align-items: center; gap: 10px; justify-content: space-between; margin: 8px 0; font-size: 14px; }
.key button { min-height: 44px; padding: 6px 10px; }
.key span { overflow-wrap: anywhere; }
@media (max-width: 680px) {
  .top { width: calc(100% - 40px); height: 60px; }
  .brand { font-size: 21px; }
  main { display: block; width: min(480px,calc(100% - 28px)); margin: 6px auto 24px; border-radius: 24px; }
  .cover { padding: 23px 22px; }
  h1 { font-size: clamp(29px,7.7vw,37px); text-wrap: initial; }
  .cover-copy p { margin-top: 6px; font-size: 14px; }
  .cover-art { display: none; }
  .cover::after { width: 66%; left: 72%; top: -23%; }
  .panel { padding: 22px; }
  .buyer-row { margin-top: 18px; }
}
@media (max-width: 360px) {
  .panel { padding: 19px 16px; }
  .cover { padding: 21px 16px; }
  .methods { gap: 6px; }
  .methods a, .methods button { padding-inline: 8px; }
}
@media (min-width: 681px) and (max-height: 650px) { main { margin-top: 12px; } }

.trial-password{display:flex;align-items:center;border:1px solid var(--line);border-radius:12px;background:white}
.trial-password input{min-width:0;flex:1;border:0;background:transparent}
.trial-password #show-password{width:auto;min-height:44px;margin:0;padding:0 12px;background:transparent;color:var(--blue);font-size:13px}

main.trial-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.85fr);align-items:start;gap:18px;max-width:920px;background:transparent;box-shadow:none;border:0;overflow:visible}
.trial-layout .panel,.trial-aside{border-radius:22px;padding:clamp(20px,3vw,32px);min-width:0}
.trial-layout .panel{background:#fff;border:1px solid var(--line)}
.trial-layout h1{font-size:clamp(30px,4vw,40px);margin:10px 0;color:var(--ink)}
.trial-module{font-weight:700;color:var(--blue)}.trial-aside{background:#eef1ff}.trial-aside strong{font-size:22px;letter-spacing:-.04em}.trial-aside p{color:var(--muted);font-size:14px}
[data-module=agenda] .trial-layout{--blue:#70479b}[data-module=agenda] .trial-aside{background:#f3edf8}
@media(max-width:680px){main.trial-layout{display:grid;grid-template-columns:1fr;gap:12px}}

.mail-help{margin-top:16px}.mail-help summary{cursor:pointer;font-weight:600}.mail-help p{margin:10px 0}
[data-mode=entrar] footer .shopify-login-note{color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 8px}
