:root { --navy:#002f6d; --blue:#134289; --green:#3bad2d; --ink:#162231; --muted:#737e88; --line:#dadddc; --paper:#f1f3f1; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); font-synthesis:none; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:var(--paper); }
button,input { font:inherit; }
button { cursor:pointer; }
a { color:inherit; }
.signup-header { position:absolute; z-index:10; inset:0 0 auto; height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(20px,4vw,68px); color:#fff; }
.signup-header > a { width:148px; }
.signup-header img { display:block; width:100%; }
.signup-header > div { display:flex; align-items:center; gap:20px; color:#445362; font-size:13px; }
.signup-header a { text-decoration:none; }
.login-button { min-height:38px; display:grid; place-items:center; padding:0 17px; color:var(--navy); border:1px solid #aebdc9; }
.signup-layout { min-height:100svh; display:grid; grid-template-columns:minmax(360px,.78fr) minmax(600px,1.22fr); }
.signup-intro { position:relative; min-height:100svh; display:flex; flex-direction:column; overflow:hidden; padding:145px clamp(30px,5vw,80px) 55px; color:#fff; background:var(--navy); }
.signup-intro::before { position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:68px 68px; mask-image:linear-gradient(to bottom right,transparent,#000); content:""; }
.intro-glow { position:absolute; right:-28%; bottom:5%; width:82%; aspect-ratio:1; border:1px solid rgba(128,215,90,.28); border-radius:50%; box-shadow:0 0 0 55px rgba(128,215,90,.04),0 0 0 110px rgba(199,215,234,.035); transform:rotateX(64deg); }
.intro-copy,.selected-offer { position:relative; z-index:1; }
.intro-copy h1 { max-width:650px; margin:0; font-size:clamp(42px,4.4vw,70px); font-weight:570; letter-spacing:-.06em; line-height:.98; }
.intro-copy > p { max-width:520px; margin:27px 0 0; color:rgba(255,255,255,.64); font-size:15px; line-height:1.65; }
.intro-copy ul { display:grid; gap:13px; margin:38px 0 0; padding:0; list-style:none; color:rgba(255,255,255,.72); font-size:11px; }
.intro-copy li { display:flex; align-items:center; gap:9px; }
.intro-copy li::before { width:6px; height:6px; border-radius:50%; background:#80d75a; box-shadow:0 0 11px rgba(128,215,90,.65); content:""; }
.selected-offer { margin-top:auto; padding:18px; border:1px solid rgba(255,255,255,.17); background:rgba(255,255,255,.06); backdrop-filter:blur(12px); }
.selected-offer > span { color:rgba(255,255,255,.48); font-size:7px; font-weight:800; letter-spacing:.13em; }
.selected-offer > div { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-top:9px; }
.selected-offer strong { font-size:18px; }
.selected-offer b { color:#80d75a; font-size:22px; letter-spacing:-.04em; }
.selected-offer b small { margin-left:4px; color:rgba(255,255,255,.48); font-size:8px; }
.selected-offer p { margin:9px 0 0; color:rgba(255,255,255,.55); font-size:10px; }
.signup-panel { min-height:100svh; padding:80px clamp(30px,6vw,95px); background:var(--paper); }
.panel-heading { max-width:780px; display:flex; align-items:center; gap:13px; margin-bottom:35px; }
.panel-heading img { width:42px; height:42px; object-fit:contain; }
.panel-heading span { color:#76818b; font-size:9px; font-weight:800; letter-spacing:.14em; }
.panel-heading h2 { margin:0; font-size:30px; font-weight:620; letter-spacing:-.04em; }
.checkout-steps { max-width:780px; display:grid; grid-template-columns:repeat(3,1fr); margin:0 0 48px; padding:0; list-style:none; border-bottom:1px solid var(--line); }
.checkout-steps li { position:relative; display:flex; align-items:center; gap:8px; padding:0 0 14px; color:#929aa1; font-size:13px; font-weight:700; }
.checkout-steps li b { width:23px; height:23px; display:grid; place-items:center; border:1px solid #cfd4d4; border-radius:50%; font-size:9px; }
.checkout-steps li.is-current { color:var(--navy); }
.checkout-steps li.is-current b { color:#fff; border-color:var(--navy); background:var(--navy); }
.checkout-steps li.is-current::after,.checkout-steps li.is-complete::after { position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--green); content:""; }
.checkout-steps li.is-complete { color:#4e7e49; }
.signup-panel form,.checkout-step { max-width:780px; }
.checkout-step[hidden],.checkout-success[hidden] { display:none; }
.step-heading h3,.checkout-success h3 { margin:0; font-size:clamp(28px,3vw,43px); font-weight:590; letter-spacing:-.05em; }
.step-heading p,.checkout-success p { margin:10px 0 31px; color:var(--muted); font-size:14px; line-height:1.55; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:17px; }
.field { display:grid; gap:7px; }
.field-wide { grid-column:1/-1; }
.field > span,.coupon-field > span { color:#56616d; font-size:11px; font-weight:720; }
.field input,.coupon-field input { width:100%; height:49px; padding:0 13px; color:#263240; border:1px solid #d6dad9; border-radius:0; outline:0; background:#fff; font-size:14px; }
.field input:focus,.coupon-field input:focus { border-color:var(--blue); box-shadow:inset 0 -2px var(--blue); }
.field input:invalid[data-touched="true"] { border-color:#b94c51; }
.honeypot { position:absolute; left:-9999px; }
.form-actions { display:flex; align-items:center; justify-content:space-between; margin-top:28px; }
.primary-button { min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:20px; padding:0 21px; color:#fff; border:0; background:var(--navy); text-decoration:none; font-size:13px; font-weight:760; }
.primary-button:hover { background:var(--blue); }
.back-button,.back-link { color:#68737d; border:0; background:transparent; text-decoration:none; font-size:11px; font-weight:700; }
.plan-choice-list { display:grid; gap:9px; }
.plan-choice { position:relative; min-height:75px; display:grid; grid-template-columns:18px 1fr auto; align-items:center; gap:13px; padding:12px 15px; border:1px solid #d6dad9; background:#fff; cursor:pointer; }
.plan-choice input,.payment-option input { position:absolute; opacity:0; }
.plan-choice > i,.payment-option > i { width:14px; height:14px; border:1px solid #aeb6bc; border-radius:50%; }
.plan-choice.is-selected { border-color:var(--blue); box-shadow:inset 3px 0 var(--green); }
.plan-choice.is-selected > i,.payment-option.is-selected > i { border:4px solid var(--blue); }
.plan-choice span b,.plan-choice span small { display:block; }
.plan-choice span b { color:#263240; font-size:14px; }
.plan-choice span small { margin-top:4px; color:#66727e; font-size:12px; }
.trial-badge { position:absolute; top:-8px; right:13px; padding:4px 8px; color:#082b19; background:#80d75a; font-size:10px; font-weight:850; letter-spacing:.06em; line-height:1; }
.plan-choice em { margin-left:5px; color:#4f7d49; font-size:8px; font-style:normal; text-transform:uppercase; }
.plan-choice > strong { display:grid; justify-items:end; color:var(--navy); font-size:16px; }
.plan-choice > strong del { color:#8c959d; font-size:9px; font-weight:500; }
.plan-choice > strong small { margin-top:2px; color:#7c8690; font-size:9px; }
.payment-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.payment-option { min-height:74px; display:grid; grid-template-columns:30px minmax(0,1fr) 16px; align-items:center; gap:9px; padding:13px 12px; border:1px solid #d6dad9; background:#fff; cursor:pointer; }
.payment-option.is-selected { border-color:var(--blue); box-shadow:inset 0 0 0 1px var(--blue); }
.payment-option:focus-within { outline:2px solid rgba(19,66,137,.28); outline-offset:2px; }
.payment-icon { width:30px; height:30px; display:grid; place-items:center; color:var(--blue); background:#edf3fb; }
.payment-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.payment-copy b { display:block; color:#263240; font-size:14px; }
.card-payment-fields { display:grid; gap:14px; margin-top:18px; padding:17px; border:1px solid #ccd9eb; background:#f7faff; }
.card-payment-fields[hidden] { display:none; }
.inline-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:14px; }.inline-section-heading b { color:#243f68; font-size:12px; }.inline-section-heading span { color:#75839a; font-size:10px; }
.card-payment-fields .field em { color:#8792a0; font-size:9px; font-style:normal; font-weight:500; }.card-payment-fields > p { margin:0; color:#68798e; font-size:10px; line-height:1.45; }
.coupon-field { display:grid; gap:7px; margin-top:20px; }
.coupon-field > div { display:grid; grid-template-columns:minmax(0,1fr) auto; min-height:49px; }
.coupon-field input { min-width:0; }
.coupon-field button { min-width:96px; padding:0 18px; color:#fff; border:0; background:var(--blue); font-size:11px; font-weight:780; }
.coupon-field button:hover { background:var(--navy); }.coupon-field button:disabled { cursor:wait; opacity:.65; }
.coupon-field > small { min-height:15px; color:#657d68; font-size:10px; line-height:1.35; }.coupon-field > small.is-error { color:#a64c50; }.coupon-field > small.is-success { color:#317551; }
.order-summary { display:grid; gap:8px; margin-top:9px; padding:15px; border:1px solid #d6dad9; background:#fff; }
.order-summary span,.order-summary strong { display:flex; justify-content:space-between; gap:14px; color:#66727e; font-size:12px; font-weight:600; }.order-summary span[hidden] { display:none; }
.order-summary span b { color:#273341; }
.order-summary strong { margin-top:4px; padding-top:11px; color:#33404d; border-top:1px solid #e4e7e5; font-size:10px; }.order-summary strong b { color:var(--navy); font-size:18px; }
.trial-disclosure { margin:13px 0 0; padding:12px 15px; color:#37503c; border-left:3px solid var(--green); background:#eef6ea; font-size:15px; line-height:1.5; }
.trial-disclosure[hidden] { display:none; }
.terms-check { display:grid; grid-template-columns:14px 1fr; gap:8px; margin-top:15px; color:#5e6b76; font-size:13px; line-height:1.5; }.terms-check input { margin:0; accent-color:var(--blue); }
.form-status { min-height:17px; margin:11px 0 0; color:#a54d51; font-size:11px; }
.checkout-success { padding:40px 0; }.checkout-success > img { width:58px; margin-bottom:30px; }.checkout-success > span { color:#668061; font-size:10px; font-weight:800; letter-spacing:.14em; }
.integrated-payment { display:grid; gap:15px; margin:24px 0 18px; padding:17px; border:1px solid #d4dfeb; background:#fff; }.integrated-payment[hidden],.pix-payment[hidden],.boleto-payment[hidden],.card-payment-confirmation[hidden] { display:none; }
.payment-progress { display:flex; align-items:center; gap:9px; color:#526378; font-size:11px; font-weight:700; }.payment-progress i { width:9px; height:9px; flex:0 0 auto; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(59,173,45,.12); animation:payment-pulse 1.5s ease-in-out infinite; }
.pix-payment { display:grid; justify-items:center; gap:10px; text-align:center; }.pix-payment img { width:min(230px,100%); aspect-ratio:1; object-fit:contain; padding:8px; border:1px solid #e0e6eb; background:#fff; }.pix-payment p,.boleto-payment p,.card-payment-confirmation p { margin:0; color:#6d7882; font-size:11px; line-height:1.45; }.pix-payment > div,.boleto-payment > div { display:grid; grid-template-columns:minmax(0,1fr) auto; width:100%; border:1px solid #d7dde1; background:#fafbfb; }.pix-payment code,.boleto-payment code { min-width:0; padding:10px 11px; overflow:hidden; color:#344355; font-size:10px; line-height:1.35; text-align:left; text-overflow:ellipsis; white-space:nowrap; }.pix-payment button,.boleto-payment button,.secondary-payment-button { border:0; background:#e9f0fa; color:var(--blue); font-size:10px; font-weight:800; }.pix-payment button,.boleto-payment button { min-width:80px; padding:0 10px; }.secondary-payment-button { min-height:40px; border:1px solid #c7d7eb; background:#fff; }.card-payment-confirmation { padding:13px; border-left:3px solid var(--green); background:#f2f8ef; }.card-payment-confirmation b { display:block; margin-bottom:4px; color:#315c34; font-size:12px; }
.checkout-success > .primary-button { margin:0 0 17px; }
@keyframes payment-pulse { 50% { transform:scale(.75); opacity:.55; } }
@media(max-width:980px){.signup-layout{grid-template-columns:1fr}.signup-intro{min-height:640px;padding-top:130px}.signup-panel{min-height:auto}.selected-offer{margin-top:60px}.signup-header>div{color:rgba(255,255,255,.78)}.login-button{color:#fff;border-color:rgba(255,255,255,.38)}}
@media(max-width:620px){.signup-header{height:70px}.signup-header>div span{display:none}.signup-header>a{width:125px}.signup-layout{display:block}.signup-intro{min-height:650px;padding:115px 20px 38px}.intro-copy h1{font-size:44px}.signup-panel{padding:58px 20px 75px}.form-grid,.payment-options{grid-template-columns:1fr}.field-wide{grid-column:auto}.checkout-steps li span{font-size:8px}.plan-choice{grid-template-columns:16px 1fr}.plan-choice>strong{grid-column:2;justify-items:start;margin-top:3px}.coupon-field button{min-width:88px;padding:0 13px}.form-actions{gap:15px}.primary-button{padding:0 15px}.inline-section-heading{display:grid;gap:3px}.pix-payment > div,.boleto-payment > div{grid-template-columns:minmax(0,1fr)}.pix-payment button,.boleto-payment button{min-height:36px}.pix-payment code,.boleto-payment code{white-space:normal;overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}
