/* link.arq: painel do arquiteto */

.lp, .lp *, .lp *::before, .lp *::after { box-sizing: border-box; }
.lp {
	--papel: #F4F1EA; --branco: #FFFFFF; --grafite: #1F1F1D; --texto-2: #5F5E5A; --concreto: #BDB7AC; --linha: rgba(31, 31, 29, .12);
	--terracota: #B5573A; --terracota-2: #9E4A30; --cianotipia: #2E4A6B; --erro: #A3362A; --ok: #3E6B4A;
	--f: 'Instrument Sans', 'Helvetica Neue', system-ui, sans-serif; --mono: 'JetBrains Mono', ui-monospace, monospace;
	background: var(--papel); color: var(--grafite); font-family: var(--f); font-size: 1rem; line-height: 1.5;
	-webkit-font-smoothing: antialiased; min-height: 100vh; text-align: left;
}
:where(.lp) :is(h1, h2, p) { margin: 0; }
:where(.lp) :is(h1, h2) { font-family: var(--f); font-weight: 500; letter-spacing: -.04em; line-height: 1.1; color: inherit; text-transform: none; }
:where(.lp) a { color: inherit; }
.lp :focus-visible { outline: 2px solid var(--cianotipia); outline-offset: 2px; }
.lp [hidden] { display: none !important; }

.lp-rot { display: block; font-family: var(--mono); font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; color: var(--cianotipia); margin-bottom: .6rem; }
.lp-sub { color: var(--texto-2); margin-top: .35rem; font-size: .95rem; }
.lp-sub a { color: var(--terracota); }

/* Logo */
.lp-logo { display: inline-flex; align-items: center; gap: .55rem; font-weight: 500; font-size: 1.2rem; letter-spacing: -.04em; text-decoration: none; }
.lp-logo svg { width: 2.9rem; height: 1rem; }

/* Botões */
.lp-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4rem; cursor: pointer;
	font: 500 .95rem var(--f); padding: .8rem 1.2rem; border: 1px solid transparent; border-radius: 0; text-decoration: none;
	transition: background-color .2s, color .2s, border-color .2s, transform .15s;
}
.lp-btn:active { transform: scale(.98); }
.lp-btn-p { background: var(--terracota); color: var(--branco); }
.lp-btn-p:hover { background: var(--terracota-2); }
.lp-btn-s { background: var(--branco); border-color: var(--grafite); color: var(--grafite); }
.lp-btn-s:hover { background: var(--grafite); color: var(--papel); }
.lp-btn-mini { padding: .45rem .8rem; font-size: .85rem; position: relative; overflow: hidden; }
.lp-link { background: none; border: 0; padding: .3rem 0; font: inherit; font-size: .9rem; color: var(--texto-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.lp-link:hover { color: var(--erro); }

/* Entrada (login) */
.lp-entrada { display: grid; place-items: center; padding: 3rem 1.25rem; }
.lp-entrada-caixa { width: 100%; max-width: 26rem; background: var(--branco); border: 1px solid var(--linha); padding: 2.25rem 2rem; }
.lp-entrada .lp-logo { margin-bottom: 2rem; }
.lp-entrada h1 { font-size: 2rem; }
.lp-entrada form { margin-top: 1.5rem; display: grid; gap: 1rem; }
.lp-entrada form p { margin: 0; }
.lp-entrada label { display: block; font-size: .85rem; font-weight: 500; margin-bottom: .35rem; }
.lp-entrada input[type=text], .lp-entrada input[type=password] { width: 100%; }
.lp-entrada .login-remember label { display: flex; align-items: center; gap: .5rem; font-weight: 400; color: var(--texto-2); }
.lp-entrada input[type=submit] { width: 100%; background: var(--terracota); color: var(--branco); border: 0; padding: .9rem; font: 500 1rem var(--f); cursor: pointer; }
.lp-entrada input[type=submit]:hover { background: var(--terracota-2); }
.lp-mini { margin-top: 1.25rem !important; font-size: .9rem; color: var(--texto-2); }
.lp-acoes-entrada { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1.75rem !important; }

/* Campos */
.lp input[type=text], .lp input[type=url], .lp input[type=email], .lp input[type=tel], .lp input[type=password], .lp textarea {
	width: 100%; font: 400 1rem var(--f); color: var(--grafite); background: var(--branco);
	border: 1px solid var(--linha); border-radius: 0; padding: .75rem .85rem; transition: border-color .2s;
	box-shadow: none; min-height: 0; margin: 0;
}
.lp input:focus, .lp textarea:focus { outline: none; border-color: var(--cianotipia); box-shadow: 0 0 0 3px rgba(46, 74, 107, .12); }
.lp textarea { resize: vertical; min-height: 5.5rem; }
.lp-campo { display: flex; flex-direction: column; gap: .35rem; margin-top: 1.1rem; }
.lp-campo > label, .lp-label { font-size: .85rem; font-weight: 500; }
.lp-campo small, .lp-img small { color: var(--texto-2); font-size: .8rem; }
.lp-grade-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.lp-inteiro { grid-column: 1 / -1; }
.lp-check { display: inline-flex; align-items: center; gap: .5rem; font-size: .88rem; color: var(--texto-2); cursor: pointer; }
.lp-check input { accent-color: var(--terracota); width: 1rem; height: 1rem; margin: 0; }

/* Estrutura */
.lp-topo { display: flex; align-items: center; gap: 1.25rem; padding: 1rem clamp(1.25rem, 3vw, 2rem); border-bottom: 1px solid var(--linha); background: var(--papel); }
.lp-ola { font-family: var(--mono); font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-2); }
.lp-topo-links { margin-left: auto; display: flex; gap: 1.25rem; font-size: .92rem; }
.lp-topo-links a { color: var(--texto-2); text-decoration: none; }
.lp-topo-links a:hover { color: var(--grafite); }
.lp-avisos { max-width: 1200px; margin: 1.25rem auto 0; padding-inline: clamp(1.25rem, 3vw, 2rem); display: grid; gap: .5rem; }
.lp-aviso { padding: .8rem 1rem; font-size: .92rem; border-left: 3px solid; background: var(--branco); }
.lp-aviso-ok { border-color: var(--ok); }
.lp-aviso-erro { border-color: var(--erro); color: var(--erro); }
.lp-grade { max-width: 1200px; margin: 0 auto; padding: 1.5rem clamp(1.25rem, 3vw, 2rem) 7rem; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 2rem; align-items: start; }
.lp-form { display: grid; gap: 1rem; min-width: 0; }
.lp-card { background: var(--branco); border: 1px solid var(--linha); padding: 1.75rem clamp(1.25rem, 3vw, 2rem) 2rem; }
.lp-card h2 { font-size: 1.6rem; }
.lp-card-topo { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }

/* Sua página */
.lp-selo { font-family: var(--mono); font-size: .66rem; letter-spacing: .04em; text-transform: uppercase; padding: .3rem .6rem; border: 1px solid currentColor; color: var(--cianotipia); }
.lp-selo-atrasada { color: var(--terracota); }
.lp-selo-cancelada { color: var(--erro); }
.lp-alerta { margin-top: 1rem !important; padding: .8rem 1rem; background: #F7EBE6; color: var(--terracota-2); font-size: .92rem; }
.lp-url { display: flex; align-items: stretch; border: 1px solid var(--linha); background: var(--branco); }
.lp-url span { display: flex; align-items: center; padding-inline: .85rem; background: var(--papel); color: var(--texto-2); font-family: var(--mono); font-size: .82rem; border-right: 1px solid var(--linha); white-space: nowrap; }
.lp .lp-url input { border: 0; font-family: var(--mono); font-size: .9rem; }
.lp-url:focus-within { border-color: var(--cianotipia); }
.lp-numeros { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 1.5rem; border: 1px solid var(--linha); }
.lp-numeros div { padding: .9rem 1rem; display: flex; flex-direction: column; }
.lp-numeros div + div { border-left: 1px solid var(--linha); }
.lp-numeros strong { font-size: 1.6rem; font-weight: 500; letter-spacing: -.04em; line-height: 1.1; }
.lp-numeros span { font-family: var(--mono); font-size: .64rem; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-2); margin-top: .2rem; }
.lp-publicar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-top: 1.5rem; }

/* Modelos e paletas */
.lp-modelos { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: .6rem; margin-top: 1.25rem; }
.lp-modelo, .lp-paleta { position: relative; display: flex; flex-direction: column; gap: .15rem; padding: .85rem; border: 1px solid var(--linha); cursor: pointer; transition: border-color .2s, background-color .2s; }
.lp-modelo:hover, .lp-paleta:hover { border-color: var(--concreto); }
.lp-modelo input, .lp-paleta input { position: absolute; opacity: 0; pointer-events: none; }
.lp-modelo:has(input:checked), .lp-paleta:has(input:checked) { border-color: var(--grafite); box-shadow: inset 0 0 0 1px var(--grafite); }
.lp-modelo:has(input:focus-visible), .lp-paleta:has(input:focus-visible) { outline: 2px solid var(--cianotipia); outline-offset: 2px; }
.lp-amostra { display: flex; height: 2.25rem; margin-bottom: .55rem; border: 1px solid var(--linha); }
.lp-amostra i { flex: 1; }
.lp-amostra i:first-child { flex: 2; }
.lp-modelo-nome { font-weight: 500; font-size: 1.02rem; letter-spacing: -.02em; }
.lp-modelo-desc { font-size: .78rem; color: var(--texto-2); line-height: 1.35; }
.lp-so-patio { margin-top: .5rem; }
.lp-paletas { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.lp-paleta { font-size: .85rem; }
.lp-paleta .lp-amostra { height: 1.5rem; }

/* Imagens */
.lp-img { display: flex; gap: 1rem; align-items: center; margin-top: 1.25rem; }
.lp-img-previa { flex-shrink: 0; width: 5.5rem; height: 5.5rem; background: var(--papel) center / cover no-repeat; border: 1px dashed var(--concreto); }
.lp-img-previa[style] { border-style: solid; border-color: var(--linha); }
.lp-img-redonda .lp-img-previa { border-radius: 50%; }
.lp-img-larga { flex-direction: column; align-items: stretch; }
.lp-img-larga .lp-img-previa { width: 100%; height: auto; aspect-ratio: 16 / 7; }
.lp-img-retrato .lp-img-previa { width: 5rem; height: 6.25rem; }
.lp-img-txt { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.lp-img-rot { font-size: .85rem; font-weight: 500; }
.lp-img-acoes { display: flex; align-items: center; gap: .9rem; margin-top: .4rem; }
.lp-arquivo { position: absolute; inset: 0; opacity: 0; cursor: pointer; font-size: 0; }

/* Listas de links e projetos */
.lp-lista { display: grid; gap: .6rem; margin: 1.25rem 0 1rem; }
.lp-lista:empty { margin-bottom: .5rem; }
.lp-linha { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .9rem; align-items: start; padding: .9rem; background: var(--papel); border: 1px solid var(--linha); }
.lp-linha-proj { grid-template-columns: auto minmax(0, 1fr) auto; }
.lp-linha-proj .lp-img { margin-top: 0; flex-direction: column; align-items: flex-start; }
.lp-linha-proj .lp-img-rot, .lp-linha-proj .lp-img small { display: none; }
.lp-linha-proj .lp-img-acoes { flex-direction: column; align-items: flex-start; gap: .3rem; margin: 0; }
.lp-alca { width: .35rem; align-self: stretch; background: repeating-linear-gradient(var(--concreto) 0 2px, transparent 2px 5px); }
.lp-linha-proj .lp-alca { display: none; }
.lp-linha-campos { display: grid; gap: .5rem; }
.lp-linha-campos.lp-grade-2 { gap: .5rem; }
.lp-linha-rodape { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.lp-cliques { font-family: var(--mono); font-size: .64rem; letter-spacing: .04em; text-transform: uppercase; color: var(--cianotipia); }
.lp-linha-botoes { display: flex; flex-direction: column; gap: .25rem; }
.lp-icone { width: 2rem; height: 2rem; display: grid; place-items: center; background: var(--branco); border: 1px solid var(--linha); color: var(--texto-2); cursor: pointer; font-size: .95rem; line-height: 1; padding: 0; transition: border-color .2s, color .2s; }
.lp-icone:hover { border-color: var(--grafite); color: var(--grafite); }
.lp-icone-x:hover { border-color: var(--erro); color: var(--erro); }
.lp-linha.lp-nova { animation: lp-entra .45s cubic-bezier(.2, .8, .2, 1); }
@keyframes lp-entra { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }

/* Recursos do plano Pro */
.lp-bloqueado { background: #FAF8F4; }
.lp-bloqueado h2 { color: var(--texto-2); }

/* Barra de salvar */
.lp-barra {
	position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: .85rem clamp(1.25rem, 3vw, 2rem); margin-top: .5rem; background: var(--grafite); color: var(--papel);
}
.lp-barra-txt { margin-right: auto; font-family: var(--mono); font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; color: var(--concreto); }
.lp-barra.lp-sujo .lp-barra-txt { color: #F2C9B9; }

/* Prévia */
.lp-previa { position: sticky; top: 1.5rem; }
.lp-previa-in { display: flex; flex-direction: column; align-items: center; }
.lp-fone { --h: 650px; --b: 10px; --s: .8; width: calc(375px * var(--s) + 2 * var(--b)); height: var(--h); border: var(--b) solid var(--grafite); border-radius: 44px; overflow: hidden; background: var(--grafite); box-shadow: 0 40px 70px -45px rgba(31, 31, 29, .55); }
/* Blindado contra o CSS do tema e do Elementor, que limita a largura de iframes */
.lp .lp-fone iframe {
	display: block !important; border: 0 !important; margin: 0 !important; background: var(--branco);
	width: 375px !important; min-width: 375px !important; max-width: none !important;
	height: calc((var(--h) - 2 * var(--b)) / var(--s)) !important; max-height: none !important;
	transform: scale(var(--s)); transform-origin: top left;
}

@media (max-width: 980px) {
	.lp-grade { grid-template-columns: 1fr; }
	.lp-previa { position: static; order: -1; }
	.lp-previa .lp-fone { --h: 440px; }
}
@media (max-width: 600px) {
	.lp-grade-2, .lp-paletas { grid-template-columns: 1fr; }
	.lp-ola { display: none; }
	.lp-linha-proj { grid-template-columns: minmax(0, 1fr) auto; }
	.lp-linha-proj .lp-img { grid-column: 1 / -1; flex-direction: row; align-items: center; }
	.lp-numeros strong { font-size: 1.3rem; }
}
@media (prefers-reduced-motion: reduce) { .lp *, .lp *::before, .lp *::after { animation: none !important; transition: none !important; } }

/* Boas-vindas depois do pagamento */
.lp-bv .lp-entrada-caixa { max-width: 40rem; }
.lp-bv h1 { font-size: clamp(2rem, 5vw, 2.6rem); }
.lp-bv fieldset { border: 0; border-top: 1px solid var(--linha); margin: 1.75rem 0 0; padding: 1.5rem 0 0; min-width: 0; }
.lp-bv legend { padding: 0 .6rem 0 0; margin: 0; }
.lp-bv .lp-form { display: block; }
.lp-valor { font-family: var(--mono); font-size: .9rem; padding: .7rem .85rem; background: var(--papel); border: 1px solid var(--linha); }
.lp-etapas { list-style: none; display: flex; gap: .35rem; padding: 0; margin: 1.5rem 0 0; counter-reset: etapa; }
.lp-etapas li { flex: 1; counter-increment: etapa; font-family: var(--mono); font-size: .64rem; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-2); padding-top: .55rem; border-top: 2px solid var(--linha); }
.lp-etapas li::before { content: "0" counter(etapa) " · "; }
.lp-etapas li.lp-etapa-atual { color: var(--grafite); border-top-color: var(--terracota); }
.lp-avisos-bv { display: grid; gap: .5rem; margin-top: 1.25rem; }
.lp-bv .lp-modelos { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); margin-top: 0; }
.lp-bv .lp-modelo { padding: .6rem; }
.lp-bv .lp-amostra { height: 1.75rem; }
.lp-btn-cheio { width: 100%; margin-top: 2rem; padding: 1rem; font-size: 1rem; }
.lp-opcional { font-family: var(--mono); font-size: .62rem; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-2); font-weight: 400; margin-left: .35rem; }
.lp-nota-teste { margin-top: 1rem !important; padding: .8rem 1rem; background: #EAF0F5; color: var(--cianotipia); font-size: .92rem; }

/* Recursos por plano */
.lp-numeros-essencial { grid-template-columns: 1fr 2fr; }
.lp-numeros-pro { justify-content: center; gap: .35rem; background: #FAF8F4; }
.lp-numeros-pro span { margin: 0 !important; }
.lp-numeros-pro a { font-size: .85rem; color: var(--terracota); }
.lp-trava { margin-top: 1rem !important; padding: .8rem 1rem; background: #FAF8F4; border-left: 3px solid var(--concreto); }
.lp-cor { margin-top: 1.5rem; }
.lp-cor-linha { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; }
.lp input[type=color] { width: 3rem; height: 2.5rem; padding: .2rem; border: 1px solid var(--linha); background: var(--branco); cursor: pointer; }
.lp input[type=color][data-sem-cor] { opacity: .45; }
.lp-cor-txt { font-family: var(--mono); font-size: .8rem; color: var(--texto-2); min-width: 9rem; }

/* Botão de atualizar prévia, na barra escura */
.lp-btn-claro { background: transparent; color: var(--papel); border-color: rgba(244, 241, 234, .45); }
.lp-btn-claro:hover { background: var(--papel); color: var(--grafite); }
.lp-btn-claro[aria-busy="true"] { opacity: .6; pointer-events: none; }
.lp-fone.lp-carregando iframe { opacity: .55; transition: opacity .2s; }
@media (max-width: 600px) { .lp-barra-txt { display: none; } .lp-barra { gap: .5rem; } .lp-barra .lp-btn { flex: 1; padding-inline: .6rem; } }

.lp select.lp-select { width: 100%; font: 400 1rem var(--f); color: var(--grafite); background: var(--branco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231F1F1D' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right .9rem center / 12px; border: 1px solid var(--linha); border-radius: 0; padding: .75rem 2.4rem .75rem .85rem; appearance: none; -webkit-appearance: none; margin: 0; }
.lp select.lp-select:focus { outline: none; border-color: var(--cianotipia); box-shadow: 0 0 0 3px rgba(46, 74, 107, .12); }

/* Modelos exclusivos do Pro */
.lp-modelo-pro { display: inline-block; margin-left: .3rem; font-family: var(--mono); font-size: .58rem; letter-spacing: .04em; text-transform: uppercase; color: var(--terracota); vertical-align: middle; }
.lp-modelo-trava { cursor: not-allowed; }
.lp-modelo-trava .lp-amostra, .lp-modelo-trava .lp-modelo-desc { opacity: .5; }
.lp-modelo-trava:hover { border-color: var(--linha); }
.lp [data-so-capa][hidden] { display: none; }

/* Logo da tela de entrada leva para a home */
.lp-entrada .lp-logo { display: inline-flex; margin-bottom: 2rem; color: var(--grafite); }
.lp-entrada .lp-logo:hover span { text-decoration: underline; text-underline-offset: 4px; }
.lp-mini-dupla { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.lp-mini a { color: var(--texto-2); }
.lp-mini a:hover { color: var(--grafite); }

/* Celular: modelos compactos e a prévia logo abaixo deles, para ver a troca na hora */
@media (max-width: 979px) {
	.lp-modelos { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .3rem; }
	.lp-modelo { padding: .35rem .3rem .4rem; }
	.lp-modelo .lp-amostra { height: 1.1rem; margin-bottom: .35rem; }
	.lp-modelo-desc { display: none; }
	.lp-modelo-nome { font-size: .64rem; display: block; line-height: 1.2; letter-spacing: -.035em; white-space: nowrap; }
	.lp-modelo { overflow: hidden; }
	.lp-modelo-pro { display: block; margin: .1rem 0 0; font-size: .5rem; letter-spacing: .02em; }
	.lp-previa.lp-previa-movel { position: static; order: 0; margin: 1.5rem 0 .5rem; padding-top: 1.25rem; border-top: 1px solid var(--linha); }
	.lp-previa-movel .lp-fone { --s: .66; --h: 540px; }
}
@media (max-width: 600px) { .lp-barra .lp-btn { font-size: .9rem; white-space: nowrap; padding-inline: .5rem; } }