/* Landing do Troku (desenho V3): Inter, azul-tinta, laranja do favo, hexágonos e cantos muito redondos. */
.lp {
  --ink: #2A3F8F; --ink-deep: #1A2657; --mute: #55607A; --rust: #B33C06;
  --o1: #FF5F1F; --o2: #FF7A3D; --o3: #FFA26B; --grad: linear-gradient(120deg, #FF5F1F 0%, #FF7A3D 55%, #FFA26B 100%);
  /* Texto em gradiente: tons mais escuros da mesma família, com contraste de pelo menos 4:1 no creme e no branco (o gradiente claro fica nos fundos e contornos). */
  --grad-text: linear-gradient(120deg, #D9480F 0%, #C9420B 55%, #B33C06 100%);
  --bg: #FFFBF7; --cream: #F6F3EE; --peach: #FFF4EC; --peach-line: #FFE4D4; --line: #EFE7DC; --line2: #E5DFD6;
  --ok: #16794C; --ok-bg: #DDF3E8; --f: 'Inter', system-ui, 'Segoe UI', sans-serif; --mono: 'JetBrains Mono', ui-monospace, monospace;
  position: relative; background: var(--bg); color: var(--ink); font: 17px/27px var(--f); font-feature-settings: 'cv11', 'ss01';
  color-scheme: light; overflow-x: clip; -webkit-font-smoothing: antialiased;
}
.lp *, .lp *::before, .lp *::after { box-sizing: border-box; }
.lp h1, .lp h2, .lp h3, .lp p { margin: 0; }
.lp a { color: inherit; text-decoration: none; }
.lp a:hover { color: var(--rust); }
.lp a:focus-visible, .lp button:focus-visible, .lp summary:focus-visible, .lp label:focus-within { outline: 3px solid var(--ink); outline-offset: 3px; }
.lp ul, .lp ol { list-style: none; margin: 0; padding: 0; }
.lp .mut { color: var(--mute); }
.lp .num { font-variant-numeric: tabular-nums; }
.lp .mono { font-family: var(--mono); }
.lp .grow { flex: 1; }
.lp-rel { position: relative; }
.lp [id] { scroll-margin-top: 104px; }
.lp-ico { display: block; flex: none; }
.lp-wrap { width: 100%; max-width: 1248px; margin: 0 auto; padding: 0 24px; }
.lp-wrap.wide { max-width: 1368px; }

/* hexágono do favo */
.lp .hx { clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.lp .hx.ic { width: 46px; height: 53px; background: var(--peach); }
.lp .hx.ic.lg { width: 52px; height: 60px; }
.lp .hx.ic.xl { width: 60px; height: 69px; }
.lp .hx.white { background: #FFFFFF; }
.lp .hx.orange { background: var(--o1); }
.lp .hx.n { width: 30px; height: 35px; background: var(--o1); color: var(--ink-deep); font-size: 13px; font-weight: 700; }
.lp-deco { position: absolute; pointer-events: none; }
.lp-mb { display: none; }

/* texto em gradiente */
.lp .gt { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* botões */
.lp .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 52px; padding: 0 24px; border-radius: 999px; border: 1.5px solid transparent;
  font: 600 16px/20px var(--f); white-space: nowrap; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease; }
.lp .btn:hover { transform: translateY(-2px); }
.lp .bp { background: var(--o1); color: var(--ink-deep); box-shadow: 0 10px 24px rgba(255, 95, 31, .32); }
.lp .bp:hover { background: var(--o2); color: var(--ink-deep); }
.lp .bw { background: #FFFFFF; color: var(--ink); border-color: var(--line2); }
.lp .bw:hover { border-color: var(--ink); color: var(--ink); }
.lp .btn-xl { height: 58px; padding: 0 30px; font-size: 17px; }

/* animações */
.lp .fl { animation: lpFloat 6s ease-in-out infinite; }
.lp .fl2 { animation: lpFloat 7.5s ease-in-out -2s infinite; }
.lp .fl3 { animation: lpFloat 9s ease-in-out -4s infinite; }
.lp .spin { animation: lpSpin 40s linear infinite; transform-origin: 50% 50%; }
.lp .blob { position: absolute; border-radius: 50%; filter: blur(80px); animation: lpBlob 14s ease-in-out infinite; pointer-events: none; }
.lp .up { animation: lpUp .8s cubic-bezier(.2, .7, .2, 1) both; }
.lp .pulse { animation: lpPulse 1.8s ease-out infinite; }
.lp .bar { transform-origin: 50% 100%; animation: lpGrow 2.4s cubic-bezier(.2, .7, .2, 1) infinite alternate; }
.lp .prog { animation: lpBar 3.2s ease-in-out infinite; }
@keyframes lpFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes lpSpin { to { transform: rotate(360deg); } }
@keyframes lpMarq { to { transform: translateX(-50%); } }
@keyframes lpPulse { 0% { box-shadow: 0 0 0 0 rgba(255, 95, 31, .5); } 100% { box-shadow: 0 0 0 16px rgba(255, 95, 31, 0); } }
@keyframes lpUp { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes lpGrow { from { transform: scaleY(.35); } to { transform: scaleY(1); } }
@keyframes lpBar { 0% { width: 6%; } 55%, 100% { width: 100%; } }
@keyframes lpDash { to { background-position: 24px 0; } }
@keyframes lpBlob { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(34px, -22px) scale(1.1); } }
@media (prefers-reduced-motion: reduce) {
  .lp *, .lp *::before, .lp *::after { animation: none !important; transition: none !important; }
}

/* ---------- navegação ---------- */
.lp-top { position: sticky; top: 0; z-index: 30; padding-top: 20px; }
.lp-nav { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 68px; padding: 0 12px 0 26px;
  background: rgba(255, 255, 255, .86); backdrop-filter: saturate(140%) blur(12px); -webkit-backdrop-filter: saturate(140%) blur(12px);
  border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 10px 30px rgba(11, 37, 69, .06); }
.lp-brand { display: inline-flex; flex: none; }
.lp-brand-logo { display: block; height: 36px; width: auto; }
.lp-nav-links { display: flex; align-items: center; gap: 28px; font-size: 15px; font-weight: 500; color: var(--mute); }
.lp-nav-cta { display: flex; align-items: center; gap: 18px; }
.lp-nav-login { font-size: 15px; font-weight: 600; }
.lp .lp-nav-btn { height: 46px; padding: 0 22px; font-size: 15px; }
.lp-menu { position: relative; display: none; }
.lp-menu summary { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 999px; cursor: pointer; list-style: none; color: var(--ink); }
.lp-menu summary::-webkit-details-marker { display: none; }
.lp-menu[open] summary { background: var(--peach); }
.lp-menu-panel { position: absolute; right: 0; top: calc(100% + 12px); min-width: 230px; display: flex; flex-direction: column; padding: 10px;
  background: #FFFFFF; border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 18px 40px rgba(11, 37, 69, .12); }
.lp-menu-panel a { padding: 10px 14px; border-radius: 12px; font-size: 15px; line-height: 22px; font-weight: 600; }
.lp-menu-panel a:hover { background: var(--peach); }
.lp-menu-login { border-top: 1px solid var(--line); margin-top: 6px; padding-top: 14px !important; }

/* ---------- herói ---------- */
.lp-hero { position: relative; padding: 64px 0 40px; }
.lp-hero-in { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 26px; }
.lp-badge-pill { display: inline-flex; align-items: center; gap: 10px; padding: 7px 16px 7px 10px; background: #FFFFFF; border: 1px solid var(--line); border-radius: 999px;
  font-size: 13px; line-height: 18px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ink); box-shadow: 0 6px 18px rgba(11, 37, 69, .06); }
.lp-pulse-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--o1); flex: none; }
.lp-hero h1 { font-size: clamp(40px, 6.2vw, 80px); line-height: 1.03; font-weight: 800; letter-spacing: -.045em; max-width: 1000px; }
.lp-hero-lead { font-size: 20px; line-height: 32px; max-width: 680px; }
.lp-hero-cta { display: flex; gap: 12px; }
.lp-hero-cta .bw { padding: 0 28px; }
.lp-proof { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; }
.lp-proof li { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; line-height: 22px; font-weight: 500; }

/* maqueta do POS */
.lp-stage { position: relative; width: 100%; max-width: 1200px; margin-top: 40px; text-align: left; }
.lp-stage-glow { position: absolute; left: 16%; right: 16%; top: 30%; bottom: -2%; background: var(--grad); filter: blur(80px); opacity: .5; border-radius: 50%; }
.lp-pos { position: relative; width: min(900px, 100%); margin: 0 auto; padding: 10px; border-radius: 28px; background: #FFFFFF; border: 1px solid var(--line);
  box-shadow: 0 50px 100px rgba(255, 95, 31, .20), 0 12px 32px rgba(26, 38, 87, .10); }
.lp-pos-in { display: grid; grid-template-columns: 64px minmax(0, 1fr) 268px; height: 500px; border-radius: 20px; background: #FBF8F4; overflow: hidden; color: var(--ink); }
.lp-pos-side { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 0; background: #FFFFFF; border-right: 1px solid var(--line); }
.lp-pos-mark { display: block; height: 26px; width: auto; }
.lp-pos-side .sp { height: 10px; }
.lp-pos-side .it { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: #8A93A3; }
.lp-pos-side .it.on { background: var(--peach); color: var(--rust); }
.lp-pos-side .av { width: 34px; height: 34px; border-radius: 50%; background: var(--grad); color: var(--ink-deep); font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.lp-pos-main { display: flex; flex-direction: column; gap: 12px; padding: 16px; min-width: 0; }
.lp-pos-mhead { display: none; }
.lp-pos-search { display: flex; align-items: center; gap: 10px; }
.lp-pos-search .q { flex: 1; display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border-radius: 12px; background: #FFFFFF; border: 1px solid var(--line); font-size: 13px; color: #8A93A3; }
.lp-online { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; background: var(--ok-bg); color: var(--ok); font-size: 12px; font-weight: 600; line-height: 1; }
.lp-online span { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }
.lp-pos-cats { display: flex; gap: 6px; }
.lp-pos-cats span { height: 30px; padding: 0 14px; border-radius: 999px; display: flex; align-items: center; font-size: 12px; font-weight: 600; white-space: nowrap; background: #FFFFFF; border: 1px solid var(--line); color: var(--mute); }
.lp-pos-cats span.on { background: var(--ink); border-color: var(--ink); color: #FFFFFF; }
.lp-pos-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.lp-prod { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 8px; background: #FFFFFF; border: 1px solid var(--line); border-radius: 16px; }
.lp-prod.sel { border: 1.5px solid var(--o1); box-shadow: 0 6px 16px rgba(255, 95, 31, .16); }
.lp-prod .qty { position: absolute; right: 8px; top: 8px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--o1); color: var(--ink-deep);
  font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; z-index: 1; }
.lp-prod .img { height: 74px; border-radius: 11px; display: flex; align-items: center; justify-content: center; }
.lp-prod .img > div { width: 54px; height: 54px; }
.lp-prod .img svg { display: block; }
.lp-prod .txt { padding: 0 4px 4px; }
.lp-prod .n { font-size: 12px; line-height: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-prod .pr { font-size: 13px; line-height: 18px; font-weight: 700; color: var(--rust); }
.lp-pos-cart { display: flex; flex-direction: column; gap: 10px; padding: 16px; background: #FFFFFF; border-left: 1px solid var(--line); }
.lp-pos-cart .hd { display: flex; align-items: center; justify-content: space-between; }
.lp-pos-cart .hd .t { font-size: 15px; font-weight: 700; }
.lp-pos-cart .hd .mono { font-size: 11px; color: var(--mute); }
.lp-pos-cart .cli { display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 10px; border-radius: 10px; background: #FBF8F4; font-size: 12px; color: var(--mute); }
.lp-pos-cart .ln { display: flex; align-items: center; gap: 10px; }
.lp-pos-cart .ln .q { width: 26px; height: 26px; border-radius: 8px; background: var(--peach); color: var(--rust); font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex: none; }
.lp-pos-cart .ln .n { flex: 1; font-size: 13px; line-height: 18px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-pos-cart .ln .v { font-size: 13px; font-weight: 600; }
.lp-pos-cart .tot { display: flex; flex-direction: column; gap: 2px; padding-top: 10px; border-top: 1px dashed var(--line2); }
.lp-pos-cart .tot .r { display: flex; justify-content: space-between; font-size: 12px; line-height: 18px; color: var(--mute); }
.lp-pos-cart .tot .r.big { align-items: baseline; margin-top: 4px; color: var(--ink); }
.lp-pos-cart .tot .r.big span:first-child { font-size: 13px; font-weight: 600; }
.lp-pos-cart .tot .r.big .num { font-size: 26px; line-height: 30px; font-weight: 800; letter-spacing: -.03em; }
.lp-pos-cart .pay { display: flex; gap: 6px; }
.lp-pos-cart .pay span { flex: 1; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; border: 1px solid var(--line); color: var(--mute); }
.lp-pos-cart .pay span.on { background: var(--peach); border: 1.5px solid var(--o1); color: var(--rust); }
.lp .lp-pos-charge { height: 46px; font-size: 15px; padding: 0 16px; }
.lp-pos-bar { display: none; }
.lp-float { position: absolute; z-index: 2; }
.lp-float.f1 { left: -10px; top: 396px; }
.lp-float.f2 { left: calc(50% + 412px); top: 54px; }
.lp-float.f3 { left: calc(50% + 426px); top: 300px; }
.lp-float-card { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #FFFFFF; border: 1px solid var(--line); border-radius: 18px;
  box-shadow: 0 18px 40px rgba(11, 37, 69, .12); white-space: nowrap; }
.lp-float-card .hx.ic { width: 38px; height: 44px; }
.lp-float-card > div { display: flex; flex-direction: column; }
.lp-float-card b { font-size: 14px; line-height: 19px; font-weight: 700; }
.lp-float-card div span { font-size: 12px; line-height: 16px; color: var(--mute); }

/* ---------- faixa ---------- */
.lp-marq-wrap { position: relative; padding: 30px 0; background: #FFFFFF; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.lp .lp-marq { display: flex; gap: 56px; width: max-content; animation: lpMarq 30s linear infinite; }
.lp-marq li { display: inline-flex; align-items: center; gap: 12px; font-size: 16px; font-weight: 600; white-space: nowrap; }
.lp-marq .hx { width: 14px; height: 16px; }

/* ---------- secções ---------- */
.lp-sec { position: relative; padding: 0 0 110px; }
.lp-sec-first { padding-top: 110px; }
.lp-sec-feat { padding-top: 20px; }
.lp-head { display: flex; flex-direction: column; gap: 16px; max-width: 780px; margin-bottom: 56px; }
.lp-head.center { max-width: 900px; margin-left: auto; margin-right: auto; align-items: center; text-align: center; margin-bottom: 48px; }
.lp-kicker { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 6px 14px 6px 10px; background: var(--peach); border: 1px solid var(--peach-line);
  border-radius: 999px; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--rust); }
.lp-head.center .lp-kicker { align-self: center; }
.lp-kicker .hx { width: 12px; height: 14px; background: var(--o1); }
.lp h2 { font-size: clamp(30px, 3.9vw, 48px); line-height: 1.08; font-weight: 700; letter-spacing: -.035em; }
.lp-sub { font-size: 18px; line-height: 29px; }

/* tiles */
.lp .tile { position: relative; display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 30px; overflow: hidden; background: #FFFFFF;
  border: 1px solid var(--line); border-radius: 28px; transition: transform .25s ease, box-shadow .25s ease; }
.lp .tile:hover { transform: translateY(-6px); box-shadow: 0 24px 48px rgba(255, 95, 31, .14); }
.lp .tile.peach { background: var(--peach); }

/* dores */
.lp-pains { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.lp-bignum { font-size: 76px; line-height: 1; font-weight: 800; letter-spacing: -.05em; align-self: flex-start; padding-right: .06em; }
.lp-pains h3 { font-size: 23px; line-height: 30px; font-weight: 700; letter-spacing: -.015em; }
.lp-pains p { font-size: 16px; line-height: 26px; }
.lp-tile-deco { right: -34px; top: -40px; }

/* funcionalidades (bento) */
.lp-bento { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px; }
.lp-bento .tile { grid-column: span 2; }
.lp-bento .lp-b-pos { grid-column: span 4; }
.lp-bento .lp-b-wide { grid-column: span 6; flex-direction: row; align-items: center; gap: 48px; }
.lp-bento h3 { font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -.015em; }
.lp-bento p { font-size: 15px; line-height: 24px; max-width: 520px; }
.lp-bento .sm h3 { font-size: 19px; line-height: 25px; }
.lp-bento .sm p { line-height: 22px; }
.lp-b-wide-txt { display: flex; flex-direction: column; gap: 12px; flex: 1; }
.lp-bento .lp-b-wide h3 { font-size: 24px; line-height: 30px; }
.lp-bento .lp-b-wide p { max-width: 560px; }
.lp-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; }
.lp-chips span:not(.btn) { background: var(--cream); border-radius: 12px; padding: 9px 14px; font-size: 13px; line-height: 20px; font-weight: 600; }
.lp .lp-chips .btn { height: 40px; padding: 0 20px; font-size: 14px; }
.lp-docs { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.lp-docs > div { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-radius: 12px; background: var(--cream); }
.lp-docs .mono { font-size: 12px; line-height: 18px; }
.lp .ok { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ok); }
.lp-bars { display: flex; align-items: flex-end; gap: 8px; height: 90px; margin-top: 8px; }
.lp-bars .bar { flex: 1; border-radius: 8px 8px 3px 3px; }
.lp-bars-wide { width: 420px; height: 120px; flex: none; margin-top: 0; }

/* offline */
.lp-offline { position: relative; overflow: hidden; border-radius: 56px; background: linear-gradient(160deg, #FFF1E6, #FFE4D4); padding: 88px 60px; }
.lp-offline .lp-head { margin-bottom: 52px; }
.lp-flow { position: relative; display: flex; align-items: flex-start; gap: 126px; padding: 44px; background: rgba(255, 255, 255, .72); border: 1px solid #FFFFFF; border-radius: 32px; }
.lp-flow li { position: relative; flex: 1; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.lp-flow li:not(:last-child)::after { content: ""; position: absolute; top: 32px; right: -98px; width: 70px; height: 2.5px; border-radius: 2px;
  background: repeating-linear-gradient(90deg, var(--o2) 0 6px, transparent 6px 12px); animation: lpDash 1.2s linear infinite; }
.lp-flow li > div { display: flex; flex-direction: column; gap: 6px; }
.lp-flow h3 { font-size: 23px; line-height: 30px; font-weight: 700; }
.lp-flow p { font-size: 16px; line-height: 26px; }
.lp-pulse-wrap { display: inline-flex; align-self: flex-start; flex: none; border-radius: 50%; }

/* vendus */
.lp-vendus { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; align-items: center; }
.lp-vendus-txt { display: flex; flex-direction: column; gap: 22px; }
.lp-vendus-txt .lp-head { margin-bottom: 0; }
.lp-switch { font-size: 16px; line-height: 25px; }
.lp-hexlist { display: flex; flex-direction: column; gap: 12px; }
.lp-hexlist li { display: flex; align-items: flex-start; gap: 14px; font-size: 16px; line-height: 25px; }
.lp-hexlist li > span:last-child { padding-top: 4px; }
.lp .lp-vendus-btn { align-self: flex-start; margin-top: 6px; }
.lp .lp-migrate { gap: 12px; padding: 36px; box-shadow: 0 30px 60px rgba(11, 37, 69, .08); }
.lp-migrate .hd { display: flex; align-items: center; justify-content: space-between; }
.lp-migrate .lab { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); }
.lp-migrate-mark { display: block; height: 32px; width: auto; }
.lp-migrate ul { display: flex; flex-direction: column; gap: 12px; }
.lp-migrate li { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px; border-radius: 16px; background: var(--cream); }
.lp-migrate .r { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lp-migrate .n { font-size: 16px; line-height: 22px; font-weight: 600; }
.lp-migrate .ok { font-size: 13px; }
.lp-migrate .track { height: 6px; border-radius: 99px; background: #E9E1D6; overflow: hidden; }
.lp-migrate .prog { height: 100%; border-radius: 99px; background: var(--grad); }
.lp-ro { display: flex; align-items: center; gap: 10px; font-size: 13px; line-height: 19px; color: var(--mute); }

/* detalhes */
.lp-panel-white { background: #FFFFFF; border: 1px solid var(--line); border-radius: 56px; padding: 80px 60px; }
.lp-panel-white .lp-head { margin-bottom: 44px; }
.lp-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 64px; }
.lp-detail { display: flex; align-items: flex-start; gap: 14px; padding: 22px 0; border-top: 1px solid var(--line); }
.lp-detail .hx { width: 16px; height: 18px; margin-top: 4px; }
.lp-detail > div { display: flex; flex-direction: column; gap: 3px; }
.lp-detail h3 { font-size: 18px; line-height: 25px; font-weight: 700; }
.lp-detail p { font-size: 15px; line-height: 23px; }
.lp-more-ck { display: none; }
.lp-more { display: none; }

/* à medida */
.lp-custom { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 520px; gap: 80px; align-items: start; }
.lp-custom-txt { display: flex; flex-direction: column; gap: 36px; }
.lp-custom-txt .lp-head { margin-bottom: 0; }
.lp-hexsteps { display: flex; flex-direction: column; gap: 22px; }
.lp-hexsteps li { display: flex; align-items: flex-start; gap: 16px; }
.lp .lp-hexsteps .hx.n { width: 42px; height: 48px; font-size: 15px; }
.lp-hexsteps li > div { display: flex; flex-direction: column; gap: 2px; }
.lp-hexsteps h3 { font-size: 18px; line-height: 26px; font-weight: 700; }
.lp-hexsteps p { font-size: 15px; line-height: 23px; }
.lp-form-card { position: relative; display: flex; flex-direction: column; gap: 16px; padding: 32px; background: #FFFFFF; border: 1px solid var(--line2); border-radius: 28px;
  box-shadow: 0 24px 48px rgba(11, 37, 69, .10); }
.lp-form-card form { display: flex; flex-direction: column; gap: 16px; }
.lp-form-hd { display: flex; flex-direction: column; gap: 4px; }
.lp-form-hd h3 { font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: -.01em; }
.lp-form-hd p { font-size: 15px; line-height: 22px; }
.lp-kinds { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--cream); }
.lp-kinds label { position: relative; flex: 1; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 999px; font-size: 14px; font-weight: 600;
  color: var(--mute); cursor: pointer; white-space: nowrap; }
.lp-kinds label input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.lp-kinds label.on, .lp-kinds label:has(input:checked) { background: #FFFFFF; color: var(--ink); box-shadow: 0 2px 8px rgba(11, 37, 69, .12); }
.lp-fields-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.lp-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.lp .lp-field:focus-within { outline: none; }
.lp-field > span { font-size: 13px; line-height: 18px; font-weight: 600; }
.lp-field input, .lp-field textarea { width: 100%; height: 48px; padding: 0 14px; border: 1.5px solid #C9CFD9; border-radius: 14px; background: #FFFFFF; color: var(--ink); font: 15px/22px var(--f); }
.lp-field textarea { height: 108px; padding: 12px 14px; resize: vertical; }
.lp-field input::placeholder, .lp-field textarea::placeholder { color: #737D8E; }
.lp-field input:focus, .lp-field textarea:focus { outline: 2px solid var(--ink); outline-offset: 0; border-color: var(--ink); }
.lp-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lp-error { color: #B4282E; font-weight: 600; font-size: 14px; line-height: 20px; }
.lp .lp-submit { width: 100%; }
.lp-fine { font-size: 13px; line-height: 18px; }
.lp-sent { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 30px 10px; }
.lp-sent h3 { font-size: 22px; line-height: 28px; font-weight: 700; }

/* compromisso */
.lp-promises { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.lp-promises .tile > div { display: flex; flex-direction: column; gap: 8px; }
.lp-promises h3 { font-size: 19px; line-height: 26px; font-weight: 700; }
.lp-promises p { font-size: 15px; line-height: 23px; }

/* para quem */
.lp-who { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.lp .lp-who .tile { padding: 32px; min-height: 250px; justify-content: flex-end; }
.lp-who-hex { right: -36px; top: -44px; }
.lp-who-ic { position: absolute; right: 22px; top: 24px; }
.lp-who h3 { font-size: 21px; line-height: 28px; font-weight: 700; }
.lp-who p { font-size: 15px; line-height: 23px; }

/* preços */
.lp-offer { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 0 62px; }
.lp-offer li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; background: #FFFFFF; border: 1px solid var(--line); border-radius: 999px; font-size: 14px; line-height: 20px; font-weight: 600; }
.lp-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.lp-plan { display: flex; flex-direction: column; gap: 16px; padding: 36px; background: #FFFFFF; border: 1px solid var(--line); border-radius: 32px; min-width: 0; }
.lp-plan.featured { border: 2px solid transparent; background: linear-gradient(#FFFFFF, #FFFFFF) padding-box, var(--grad) border-box;
  box-shadow: 0 30px 60px rgba(255, 95, 31, .22); transform: translateY(-14px); }
.lp-plan-badge { align-self: flex-start; padding: 6px 14px; border-radius: 999px; background: var(--grad); color: var(--ink-deep); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .04em; }
.lp-plan-gap { height: 28px; }
.lp-plan-hd { display: flex; flex-direction: column; gap: 4px; }
.lp-plan h3 { font-size: 24px; line-height: 30px; font-weight: 700; letter-spacing: -.015em; }
.lp-plan-hd p { font-size: 15px; line-height: 22px; }
.lp-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.lp-price b { font-size: 60px; line-height: 1.05; font-weight: 800; letter-spacing: -.04em; padding-right: .04em; }
.lp-price span { font-size: 15px; }
.lp-price-note { font-size: 13px; line-height: 19px; }
.lp-plan hr { height: 1px; margin: 0; border: 0; background: var(--line); }
.lp-plan ul { display: flex; flex-direction: column; gap: 10px; }
.lp-plan li { display: flex; align-items: flex-start; gap: 8px; font-size: 15px; line-height: 22px; font-weight: 500; }
.lp-plan li .lp-ico { margin-top: 2px; }
.lp-plans-foot { margin-top: 48px; text-align: center; font-size: 14px; line-height: 21px; }

/* perguntas */
.lp-faq-wrap { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 72px; align-items: start; }
.lp-faq-wrap .lp-head { margin-bottom: 0; }
.lp-faq { padding: 10px 36px; background: #FFFFFF; border: 1px solid var(--line); border-radius: 32px; }
.lp-faq details { padding: 20px 0; border-bottom: 1px solid var(--line); }
.lp-faq details:last-child { border-bottom: 0; }
.lp-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; list-style: none; font-size: 18px; line-height: 26px; font-weight: 600; }
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary .lp-ico { color: var(--rust); transition: transform .2s ease; }
.lp-faq details[open] summary .lp-ico { transform: rotate(180deg); }
.lp-faq details p { margin-top: 10px; font-size: 16px; line-height: 25px; max-width: 760px; }

/* chamada final */
.lp-sec-final { padding-bottom: 80px; }
.lp-final { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 22px; padding: 92px 80px; border-radius: 56px; background: var(--grad); color: var(--ink-deep); }
.lp-final > :not(.lp-deco) { position: relative; }
.lp-final-kicker { font-size: 14px; line-height: 20px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.lp .lp-final h2 { font-size: clamp(32px, 4.8vw, 62px); line-height: 1.03; font-weight: 800; letter-spacing: -.04em; max-width: 760px; }
.lp-final p { font-size: 19px; line-height: 30px; max-width: 560px; }
.lp-final-cta { display: flex; gap: 12px; margin-top: 6px; }
.lp .lp-final-cta .btn { height: 56px; font-size: 17px; }
.lp .lp-btn-white { background: #FFFFFF; color: var(--ink-deep); padding: 0 30px; box-shadow: 0 12px 28px rgba(11, 37, 69, .18); }
.lp .lp-btn-navy { border-color: var(--ink-deep); color: var(--ink-deep); padding: 0 28px; }
.lp .lp-btn-white:hover, .lp .lp-btn-navy:hover { color: var(--ink-deep); }
.lp .lp-btn-navy:hover { background: rgba(255, 255, 255, .18); }
.lp .lp-final a:focus-visible { outline-color: var(--ink-deep); }

/* rodapé */
.lp-foot { padding: 40px 0 44px; background: #FFFFFF; border-top: 1px solid var(--line); }
.lp-foot-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 48px; }
.lp-foot-brand { display: flex; flex-direction: column; gap: 16px; }
.lp-foot-brand p { font-size: 15px; line-height: 23px; max-width: 360px; }
.lp-flogo { display: flex; align-items: center; gap: 14px; }
.lp-flogo-mark { display: block; height: 70px; width: auto; }
.lp-flogo-txt { display: flex; flex-direction: column; gap: 8px; }
.lp-flogo-word { display: block; height: 36px; width: auto; }
.lp-flogo-txt span { font-size: 12px; line-height: 14px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
.lp-foot-col { display: flex; flex-direction: column; gap: 10px; }
.lp-foot-h { font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--rust); }
.lp-foot-col a { font-size: 15px; line-height: 22px; color: var(--mute); }
.lp-foot-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 44px; padding-top: 44px; border-top: 1px solid var(--line); font-size: 13px; line-height: 19px; }

/* ---------- intermédio ---------- */
@media (max-width: 1319px) {
  .lp-float.f1 { left: -8px; }
  .lp-float.f2, .lp-float.f3 { left: auto; right: -8px; }
}
@media (max-width: 1180px) {
  .lp-custom { grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: 48px; }
  .lp-vendus { gap: 48px; }
  .lp-faq-wrap { grid-template-columns: 300px minmax(0, 1fr); gap: 48px; }
}
@media (max-width: 1080px) {
  .lp-nav-links { display: none; }
  .lp-menu { display: block; }
  .lp-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-bento .tile, .lp-bento .lp-b-pos { grid-column: span 1; }
  .lp-bento .lp-b-pos, .lp-bento .lp-b-wide { grid-column: span 2; }
  .lp-bento .lp-b-wide { flex-direction: column; align-items: stretch; gap: 12px; }
  .lp-bars-wide { width: 100%; height: 90px; margin-top: 6px; }
  .lp-promises, .lp-who { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-flow { flex-direction: column; gap: 22px; padding: 32px; }
  .lp-flow li { flex-direction: row; align-items: flex-start; }
  .lp-flow li:not(:last-child)::after { display: none; }
  .lp-vendus, .lp-custom, .lp-faq-wrap { grid-template-columns: minmax(0, 1fr); }
  .lp-custom > .lp-rel { max-width: 560px; }
  .lp-offline, .lp-panel-white { padding: 64px 40px; }
  .lp-final { padding: 72px 48px; }
}
@media (max-width: 900px) {
  .lp-pains { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .lp-plans { grid-template-columns: minmax(0, 1fr); gap: 16px; max-width: 520px; margin: 0 auto; }
  .lp-plan.featured { order: -1; transform: none; }
  .lp-plan-gap { display: none; }

  /* maqueta do POS em formato telemóvel */
  .lp-stage { margin-top: 14px; }
  .lp-stage-glow { left: 8%; right: 8%; top: 30%; bottom: -6%; filter: blur(50px); opacity: .45; }
  .lp-pos { width: min(330px, 100%); padding: 8px; border-radius: 26px; box-shadow: 0 30px 60px rgba(255, 95, 31, .20), 0 8px 20px rgba(26, 38, 87, .10); }
  .lp-pos-in { grid-template-columns: minmax(0, 1fr); height: auto; border-radius: 19px; }
  .lp-pos-side, .lp-pos-cart, .lp-pos-search, .lp-pos-cats, .lp-dt-grid { display: none; }
  .lp-pos-main { padding: 0; gap: 0; }
  .lp-pos-mhead { display: flex; align-items: center; justify-content: space-between; height: 46px; padding: 0 12px; background: #FFFFFF; border-bottom: 1px solid var(--line); }
  .lp-pos-lockup { display: block; height: 24px; width: auto; }
  .lp-pos-mhead .lp-online { height: 24px; padding: 0 10px; font-size: 11px; }
  .lp-pos-mhead .lp-online span { width: 6px; height: 6px; }
  .lp-pos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; }
  .lp-prod .img { height: 62px; }
  .lp-prod .img > div { width: 46px; height: 46px; }
  .lp-pos-bar { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; background: #FFFFFF; border-top: 1px solid var(--line); }
  .lp-pos-bar > div { display: flex; flex-direction: column; }
  .lp-pos-bar .l { font-size: 11px; line-height: 16px; color: var(--mute); }
  .lp-pos-bar .v { font-size: 20px; line-height: 24px; font-weight: 800; letter-spacing: -.02em; }
  .lp .lp-pos-bar .btn { height: 42px; padding: 0 22px; font-size: 14px; }
  .lp-float.f1, .lp-float.f3 { display: none; }
  .lp-float.f2 { left: auto; right: -6px; top: -22px; transform: scale(.82); transform-origin: top right; }
  .lp-mb { display: block; }
}

/* ---------- telemóvel ---------- */
@media (max-width: 760px) {
  .lp { font-size: 16px; line-height: 25px; }
  .lp-wrap { padding: 0 20px; }
  .lp-wrap.wide { padding: 0 12px; }
  .lp-dt { display: none; }

  .lp-top { padding-top: 12px; }
  .lp-top .lp-wrap { padding: 0 14px; }
  .lp-nav { height: 56px; padding: 0 8px 0 16px; box-shadow: 0 8px 24px rgba(11, 37, 69, .06); }
  .lp-brand-logo { height: 30px; }
  .lp-nav-login { display: none; }
  .lp-nav-cta { gap: 6px; }
  .lp .lp-nav-btn { height: 40px; padding: 0 16px; font-size: 14px; }

  .lp-hero { padding: 34px 0 56px; }
  .lp-hero-in { gap: 18px; }
  .lp-badge-pill { font-size: 11px; }
  .lp-hero h1 { font-size: 40px; line-height: 43px; max-width: 350px; }
  .lp-hero-lead { font-size: 16px; line-height: 25px; max-width: 350px; }
  .lp-hero-cta { flex-direction: column; align-self: stretch; }
  .lp .lp-hero-cta .btn { height: 52px; }
  .lp-proof { gap: 8px 14px; }
  .lp-proof li { font-size: 13px; }

  .lp-marq-wrap { padding: 22px 0; }
  .lp-marq li { font-size: 14px; }

  .lp-sec { padding-bottom: 56px; }
  .lp-sec-first, .lp-sec-feat { padding-top: 56px; }
  .lp-head, .lp-head.center { gap: 12px; margin-bottom: 28px; }
  .lp-head.center { align-items: flex-start; text-align: left; margin-bottom: 24px; }
  .lp-head.center .lp-kicker { align-self: flex-start; }
  .lp-kicker { font-size: 11px; }
  .lp h2 { font-size: 30px; line-height: 32px; }
  .lp-sub { font-size: 15px; line-height: 23px; }

  .lp .tile { padding: 24px; }
  .lp-bignum { font-size: 56px; }
  .lp-pains h3 { font-size: 19px; line-height: 25px; }
  .lp-pains p { font-size: 15px; line-height: 23px; }

  .lp-bento { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .lp-bento .tile, .lp-bento .lp-b-pos, .lp-bento .lp-b-wide { grid-column: span 1; }
  .lp-bento h3 { font-size: 20px; line-height: 26px; }
  .lp-bento .sm h3, .lp-bento .lp-b-wide h3 { font-size: 17px; line-height: 25px; }
  .lp-bento .sm p { font-size: 14px; }

  .lp-offline { border-radius: 32px; padding: 40px 20px; }
  .lp-offline .lp-head { margin-bottom: 28px; }
  .lp-flow { padding: 24px; border-radius: 24px; }
  .lp .lp-flow .hx.ic.xl { width: 48px; height: 55px; }
  .lp-flow h3 { font-size: 18px; line-height: 24px; }
  .lp-flow p { font-size: 15px; line-height: 23px; }

  .lp-vendus { gap: 28px; }
  .lp .lp-vendus-btn { align-self: stretch; }
  .lp .lp-migrate { padding: 20px; }
  .lp-migrate li { padding: 14px 16px; }
  .lp-migrate .n { font-size: 14px; line-height: 20px; }

  .lp-panel-white { border-radius: 32px; padding: 36px 20px; }
  .lp-panel-white .lp-head { margin-bottom: 28px; }
  .lp-details { grid-template-columns: minmax(0, 1fr); }
  .lp-detail { padding: 16px 0; }
  .lp-detail h3 { font-size: 16px; line-height: 25px; }
  .lp-detail p { font-size: 14px; line-height: 21px; }
  .lp-extra { display: none; }
  .lp-more-ck { display: block; position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  .lp-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 15px; line-height: 22px; font-weight: 600; color: var(--rust); cursor: pointer; }
  .lp-more-ck:checked ~ .lp-details .lp-extra { display: flex; }
  .lp-more-ck:checked ~ .lp-more { display: none; }
  .lp-more-ck:focus-visible ~ .lp-more { outline: 3px solid var(--ink); outline-offset: 3px; border-radius: 6px; }

  .lp-custom { gap: 28px; }
  .lp-custom-txt { gap: 24px; }
  .lp-hexsteps h3 { font-size: 16px; }
  .lp-hexsteps p { font-size: 14px; }
  .lp-form-card { padding: 22px; }
  .lp-kinds label { font-size: 12px; }
  .lp-fields-2 { grid-template-columns: minmax(0, 1fr); }

  .lp-promises { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .lp-who { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .lp .lp-who .tile { padding: 18px; min-height: 0; border-radius: 22px; justify-content: flex-start; }
  .lp-who-hex { width: 90px; height: 102px; right: -26px; top: -30px; }
  .lp-who-ic { right: 12px; top: 12px; }
  .lp-who-ic .lp-ico { width: 26px; height: 26px; }
  .lp-who h3 { font-size: 15px; line-height: 20px; margin-top: 56px; }
  .lp-who p { font-size: 13px; line-height: 19px; }

  .lp-offer { justify-content: flex-start; margin-bottom: 24px; }
  .lp-plan { padding: 26px; }
  .lp-price b { font-size: 52px; }
  .lp-plans-foot { margin-top: 24px; text-align: left; }

  .lp-faq-wrap { gap: 20px; }
  .lp-faq { padding: 4px 18px; border-radius: 24px; }
  .lp-faq details { padding: 16px 0; }
  .lp-faq summary { font-size: 16px; line-height: 23px; }
  .lp-faq details p { font-size: 14px; line-height: 22px; }

  .lp-sec-final { padding-bottom: 40px; }
  .lp-final { border-radius: 32px; padding: 40px 24px; gap: 16px; }
  .lp-final-kicker { font-size: 12px; }
  .lp .lp-final h2 { font-size: 32px; line-height: 35px; }
  .lp-final p { font-size: 15px; line-height: 23px; }
  .lp-final-cta { flex-direction: column; }
  .lp-final-d1 { width: 130px; height: 148px; right: -40px !important; top: -40px !important; }
  .lp-final-d2 { width: 56px; height: 64px; right: 70px !important; top: 20px !important; }

  .lp-foot { padding: 36px 0 32px; }
  .lp-foot-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .lp-flogo-mark { height: 60px; }
  .lp-flogo-word { height: 30px; }
  .lp-foot-bottom { margin-top: 28px; padding-top: 28px; }
}
@media (max-width: 380px) {
  .lp .lp-nav-btn { padding: 0 12px; }
  .lp-hero h1 { font-size: 36px; line-height: 39px; }
}

/* O Blazor põe o foco no h1 ao navegar (FocusOnNavigate, para leitores de ecrã): sem moldura visível nesse caso. */
h1[tabindex="-1"]:focus, h1[tabindex="-1"]:focus-visible { outline: none; }

/* App no telemóvel: texto à esquerda, dois cartões (Android a descarregar, iPhone com os passos do Safari). */
.lp-app { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 40px; align-items: center; background: #FFFFFF; border: 1px solid #EFE7DC; border-radius: 40px; padding: 56px; }
.lp-app h2 { margin: 10px 0 12px; }
.lp-app-cards { display: flex; flex-direction: column; gap: 14px; }
.lp-app-card { display: block; background: #FBF8F4; border: 1.5px solid #EFE7DC; border-radius: 22px; padding: 20px 22px; color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
a.lp-app-card, .lp-app-card summary { display: flex; align-items: center; gap: 16px; cursor: pointer; list-style: none; }
.lp-app-card summary::-webkit-details-marker { display: none; }
a.lp-app-card:hover, .lp-app-card summary:hover { border-color: #FF5F1F; }
a.lp-app-card:hover { transform: translateY(-2px); }
a.lp-app-card > span > b, .lp-app-card summary b { display: block; font-size: 18px; line-height: 24px; }
a.lp-app-card small, .lp-app-card summary small { display: block; font-size: 14px; line-height: 20px; color: #55607A; }
.lp-app-ic { width: 52px; height: 52px; flex: none; border-radius: 16px; background: #FF5F1F; color: #1A2657; display: flex; align-items: center; justify-content: center; }
.lp-app-card ol { margin: 16px 0 2px 68px; padding: 0 0 0 20px; list-style: decimal; display: flex; flex-direction: column; gap: 8px; font-size: 15px; line-height: 22px; }
.lp-app-card ol li { display: list-item; }
.lp-app-card a:focus-visible, a.lp-app-card:focus-visible, .lp-app-card summary:focus-visible { outline: 2px solid #1A2657; outline-offset: 3px; border-radius: 18px; }
@media (max-width: 900px) {
  .lp-app { grid-template-columns: minmax(0, 1fr); padding: 32px 22px; border-radius: 28px; gap: 24px; }
  .lp-app-card ol { margin-left: 0; }
}