/*
 * Webstian artboard renderer — shared by the Studio editor and published pages.
 * Every size is expressed in artboard pixels multiplied by --u, which is one artboard
 * pixel measured in the current container width. The design therefore scales as one
 * picture: what you see in the editor is exactly what visitors get, at any screen width.
 */
.lp-art{
  --u:calc(100cqw / var(--W,1080));
  position:relative;container-type:inline-size;overflow:hidden;overflow:clip;isolation:isolate;
  aspect-ratio:var(--W,1080)/var(--H,1920);
  color:var(--ink,#171725);font-family:var(--font,Inter,system-ui,sans-serif);
  background:var(--art-bg,#f6f5fb);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.lp-art *,.lp-art *::before,.lp-art *::after{box-sizing:border-box}
.lp-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.lp-bg-img{position:absolute;inset:calc(var(--bg-blur,0) * -2 * var(--u));background-repeat:no-repeat;background-position:var(--bg-pos,50% 50%);background-size:var(--bg-size,cover);filter:blur(calc(var(--bg-blur,0) * var(--u)))}
.lp-bg-ov{position:absolute;inset:0}

.lp-el{
  position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);
  transform:rotate(var(--rot,0deg));transform-origin:50% 50%;
  font-size:calc(var(--fs,32) * var(--u));
}
.lp-in{
  position:relative;width:100%;height:100%;display:flex;flex-direction:column;justify-content:var(--va,flex-start);
  gap:calc(var(--fs,32) * .32 * var(--u));
  padding:calc(var(--pad,0) * var(--u));text-align:var(--ta,left);
  line-height:var(--lh,1.2);overflow-wrap:anywhere;word-break:normal;
  transform:var(--flip,none);
}
.lp-in.lp-clip{overflow:hidden}
.lp-art h1,.lp-art h2,.lp-art h3,.lp-art p,.lp-art figure,.lp-art ul{margin:0;padding:0}
.lp-text{white-space:pre-wrap;font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit;letter-spacing:inherit}
.lp-title{font-size:calc(var(--fs,32) * var(--u));font-weight:var(--fw,700);line-height:var(--lh,1.12)}
.lp-body{font-size:calc(var(--fs,32) * var(--k-body,.5) * var(--u));font-weight:var(--fw-body,400);line-height:var(--lh-body,1.45);opacity:.86}
.lp-t-paragraph .lp-body{font-size:calc(var(--fs,28) * var(--u));font-weight:var(--fw,400);line-height:var(--lh,1.5);opacity:1}
.lp-eyebrow{font-size:calc(var(--fs,32) * .34 * var(--u));font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--acc,var(--accent,#7766e8))}

/* Buttons and calls to action */
.lp-btn,.lp-cta{
  display:flex;align-items:center;justify-content:center;gap:.4em;text-decoration:none;cursor:pointer;
  background:var(--btn-bg,var(--accent,#7766e8));color:var(--btn-ink,#fff);
  border-radius:var(--btn-rad,calc(18 * var(--u)));font-weight:var(--fw,700);
  transition:background-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.lp-btn{width:100%;height:100%;padding:calc(var(--pad,8) * var(--u)) calc(var(--pad,8) * 1.4 * var(--u));text-align:center;font-size:calc(var(--fs,30) * var(--u))}
.lp-cta{align-self:var(--cta-align,flex-start);width:var(--btn-w,auto);min-height:2.6em;padding:.7em 1.4em;font-size:calc(var(--fs,32) * .48 * var(--u));margin-top:calc(8 * var(--u))}
.lp-btn:hover,.lp-cta:hover{background:var(--hov-bg,var(--btn-bg,var(--accent,#7766e8)));color:var(--hov-ink,var(--btn-ink,#fff));transform:translateY(-1px)}
.lp-bs-outline .lp-btn,.lp-bs-outline .lp-cta{background:transparent;color:var(--btn-bg,var(--accent,#7766e8));box-shadow:inset 0 0 0 calc(3 * var(--u)) var(--btn-bg,var(--accent,#7766e8))}
.lp-bs-soft .lp-btn,.lp-bs-soft .lp-cta{background:color-mix(in srgb,var(--btn-bg,var(--accent,#7766e8)) 18%,#fff);color:var(--btn-bg,var(--accent,#7766e8))}
.lp-bs-ghost .lp-btn,.lp-bs-ghost .lp-cta{background:transparent;color:var(--btn-bg,var(--accent,#7766e8))}
.lp-bs-pill .lp-btn,.lp-bs-pill .lp-cta{border-radius:999px}

/* Images, logos and media */
.lp-img{display:block;width:100%;height:100%;min-height:0;flex:1 1 auto;object-fit:var(--fit,cover);object-position:var(--pos,50% 50%);filter:var(--filter,none);transform:scale(var(--zoom,1));transform-origin:var(--pos,50% 50%)}
.lp-media{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;border-radius:var(--img-rad,0)}
.lp-media .lp-img{position:absolute;inset:0}
.lp-mask-circle{border-radius:50%!important}
.lp-mask-rounded{border-radius:calc(48 * var(--u))!important}
.lp-mask-arch{border-radius:50% 50% calc(24 * var(--u)) calc(24 * var(--u)) / 34% 34% calc(24 * var(--u)) calc(24 * var(--u))!important}
.lp-mask-blob{border-radius:62% 38% 46% 54% / 46% 58% 42% 54%!important}
.lp-placeholder{flex:1 1 auto;display:grid;place-items:center;min-height:0;border-radius:inherit;background:repeating-linear-gradient(135deg,rgba(119,102,232,.10) 0 12px,rgba(119,102,232,.04) 12px 24px);color:rgba(80,70,160,.65);font-size:calc(var(--fs,32) * .8 * var(--u));font-weight:600}
.lp-caption{font-size:calc(var(--fs,32) * .45 * var(--u));opacity:.75}
.lp-frame{position:relative;flex:1 1 auto;min-height:0;border-radius:calc(12 * var(--u));overflow:hidden;background:#0f1320}
.lp-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lp-frame .lp-img{position:absolute;inset:0;opacity:.85}
.lp-play{position:absolute;left:50%;top:50%;width:calc(110 * var(--u));height:calc(110 * var(--u));transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:#111;font-size:calc(40 * var(--u))}

/* Profile / hero */
.lp-avatar{width:calc(var(--av,200) * var(--u));height:calc(var(--av,200) * var(--u));border-radius:50%;overflow:hidden;flex:0 0 auto;align-self:var(--cta-align,flex-start);background:var(--acc,var(--accent,#7766e8));color:#fff;display:grid;place-items:center;font-size:calc(var(--av,200) * .42 * var(--u));font-weight:800}
.lp-avatar .lp-img{width:100%;height:100%}
.lp-hero-media{flex:1 1 auto;min-height:calc(80 * var(--u));border-radius:calc(24 * var(--u));overflow:hidden;position:relative}
.lp-hero-media .lp-img{position:absolute;inset:0}

/* Lists, cards, grids */
.lp-stack{display:flex;flex-direction:column;gap:calc(14 * var(--u));min-height:0}
.lp-row{display:flex;flex-wrap:wrap;gap:calc(16 * var(--u));justify-content:var(--cta-align,flex-start)}
.lp-card{display:flex;align-items:center;gap:.6em;padding:.8em 1em;border-radius:calc(20 * var(--u));background:var(--card,rgba(255,255,255,.75));color:inherit;text-decoration:none;font-size:calc(var(--fs,32) * .5 * var(--u));box-shadow:0 calc(4 * var(--u)) calc(16 * var(--u)) rgba(20,20,50,.08);text-align:left}
.lp-card b{display:block;font-weight:700}
.lp-card small{display:block;opacity:.7;font-size:.82em}
.lp-card span.lp-grow{flex:1 1 auto;min-width:0}
.lp-card i{font-style:normal;opacity:.6}
.lp-social a svg,.lp-card-ico svg{width:56%;height:56%;fill:currentColor}
.lp-card-ico{flex:none;width:2.2em;height:2.2em;border-radius:50%;display:grid;place-items:center;background:var(--btn-bg,var(--accent,#7766e8));color:var(--btn-ink,#fff)}
.lp-social a{width:calc(var(--fs,32) * 2.2 * var(--u));height:calc(var(--fs,32) * 2.2 * var(--u));border-radius:50%;display:grid;place-items:center;background:var(--btn-bg,var(--accent,#7766e8));color:var(--btn-ink,#fff);text-decoration:none;font-weight:800;font-size:calc(var(--fs,32) * .8 * var(--u))}
.lp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(calc(220 * var(--u)),1fr));gap:calc(16 * var(--u))}
.lp-grid .lp-card{flex-direction:column;align-items:flex-start}
.lp-num{font-size:.8em;font-weight:800;color:var(--acc,var(--accent,#7766e8))}
.lp-stars{color:#f5a623;letter-spacing:.1em}
.lp-faq details{border-radius:calc(16 * var(--u));background:var(--card,rgba(255,255,255,.75));padding:.7em 1em;font-size:calc(var(--fs,32) * .48 * var(--u));text-align:left}
.lp-faq summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1em}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq details p{margin-top:.5em;opacity:.8}
.lp-price{font-size:calc(var(--fs,32) * 1.5 * var(--u));font-weight:800;line-height:1}
.lp-price small{font-size:.35em;font-weight:500;opacity:.7;margin-left:.2em}
.lp-gallery{flex:1 1 auto;display:grid;grid-template-columns:repeat(var(--cols,3),1fr);gap:calc(12 * var(--u));min-height:0}
.lp-gallery figure{position:relative;min-height:0;border-radius:calc(14 * var(--u));overflow:hidden;background:rgba(120,110,200,.12)}
.lp-gallery .lp-img{position:absolute;inset:0}
.lp-gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:.4em .6em;font-size:calc(var(--fs,32) * .38 * var(--u));background:linear-gradient(transparent,rgba(0,0,0,.55));color:#fff}
.lp-product{display:flex;gap:calc(24 * var(--u));flex:1 1 auto;min-height:0}
.lp-product .lp-media{flex:0 0 42%;border-radius:calc(20 * var(--u))}
.lp-product .lp-stack{flex:1 1 auto;justify-content:center}
.lp-form{display:flex;flex-direction:column;gap:calc(12 * var(--u));font-size:calc(var(--fs,32) * .44 * var(--u));text-align:left}
.lp-form label{display:flex;flex-direction:column;gap:.3em;font-weight:600}
.lp-form input,.lp-form textarea,.lp-form .lp-fake{width:100%;font:inherit;font-weight:400;padding:.6em .8em;border-radius:calc(14 * var(--u));border:calc(2 * var(--u)) solid rgba(120,120,160,.25);background:rgba(255,255,255,.9);color:#171725;min-height:2.4em}
.lp-form .lp-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.lp-form .lp-cta{align-self:stretch;width:100%;border:0;font:inherit;font-weight:700}
.lp-form-feedback{min-height:1em;font-size:.9em}

/* Shapes */
.lp-t-shape .lp-in,.lp-t-divider .lp-in{padding:0}
.lp-shape{width:100%;height:100%;background:var(--shape-fill,var(--accent,#7766e8))}
.lp-shape-circle .lp-shape{border-radius:50%}
.lp-shape-triangle .lp-shape{clip-path:polygon(50% 0,100% 100%,0 100%)}
.lp-shape-diamond .lp-shape{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.lp-shape-star .lp-shape{clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.lp-shape-arrow .lp-shape{clip-path:polygon(0 34%,62% 34%,62% 0,100% 50%,62% 100%,62% 66%,0 66%)}
.lp-shape-hexagon .lp-shape{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.lp-shape-pentagon .lp-shape{clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%)}
.lp-shape-heart .lp-shape{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 90' preserveAspectRatio='none'%3E%3Cpath d='M50 88C22 66 0 48 0 26 0 11 12 0 26 0c10 0 19 6 24 15C55 6 64 0 74 0c14 0 26 11 26 26 0 22-22 40-50 62z'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 90' preserveAspectRatio='none'%3E%3Cpath d='M50 88C22 66 0 48 0 26 0 11 12 0 26 0c10 0 19 6 24 15C55 6 64 0 74 0c14 0 26 11 26 26 0 22-22 40-50 62z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.lp-shape-speech .lp-shape{clip-path:polygon(0 0,100% 0,100% 78%,38% 78%,18% 100%,22% 78%,0 78%)}
.lp-shape-blob .lp-shape{border-radius:62% 38% 46% 54% / 46% 58% 42% 54%}
.lp-shape-line .lp-shape{height:max(calc(var(--bw,6) * var(--u)),1px);margin:auto 0;border-radius:999px}
.lp-shape-line .lp-in{justify-content:center}
.lp-divider{width:100%;height:max(calc(var(--bw,3) * var(--u)),1px);margin:auto 0;background:var(--shape-fill,currentColor);opacity:.35;border-radius:999px}

/* Text effects */
.lp-ts-soft{text-shadow:0 calc(3 * var(--u)) calc(8 * var(--u)) rgba(0,0,0,.22)}
.lp-ts-strong{text-shadow:0 calc(5 * var(--u)) calc(16 * var(--u)) rgba(0,0,0,.42)}
.lp-ts-glow{text-shadow:0 0 calc(18 * var(--u)) currentColor}
.lp-ts-neon{text-shadow:0 0 calc(6 * var(--u)) #fff,0 0 calc(18 * var(--u)) var(--acc,var(--accent,#7766e8)),0 0 calc(42 * var(--u)) var(--acc,var(--accent,#7766e8))}
.lp-ts-lift{text-shadow:calc(4 * var(--u)) calc(4 * var(--u)) 0 var(--acc,var(--accent,#7766e8))}

/* Entrance / loop animations (public pages only, motion-safe) */
@media (prefers-reduced-motion:no-preference){
  .lp-live .lp-anim-fade{animation:lp-fade .7s ease both}
  .lp-live .lp-anim-rise{animation:lp-rise .75s cubic-bezier(.2,.8,.2,1) both}
  .lp-live .lp-anim-zoom{animation:lp-zoom .7s cubic-bezier(.2,.8,.2,1) both}
  .lp-live .lp-anim-pulse .lp-in{animation:lp-pulse 2.2s ease-in-out infinite}
  .lp-live .lp-anim-float .lp-in{animation:lp-float 3.2s ease-in-out infinite}
}
@keyframes lp-fade{from{opacity:0}}
@keyframes lp-rise{from{opacity:0;translate:0 calc(40 * var(--u))}}
@keyframes lp-zoom{from{opacity:0;scale:.85}}
@keyframes lp-pulse{50%{scale:1.045}}
@keyframes lp-float{50%{translate:0 calc(-14 * var(--u))}}

/* Published page frame */
.lp-public{margin:0;min-height:100vh;min-height:100svh;background:var(--page-bg,#f6f5fb);display:flex;flex-direction:column;align-items:center}
.lp-public>main{width:100%;display:flex;flex-direction:column;align-items:center}
.lp-public .lp-art{width:min(100%,calc(var(--W) * 1px))}
.lp-public.lp-display-phone .lp-art{width:min(100%,520px)}
.lp-public.lp-display-fit .lp-art{width:min(100%,calc(var(--W) * 1px),calc(100svh * var(--W) / var(--H)))}
@media (min-width:700px){.lp-public.lp-display-phone .lp-art{margin:24px 0;border-radius:28px;box-shadow:0 30px 80px rgba(15,15,40,.18)}}
.lp-credit{margin:18px 0 28px;font:500 13px/1.4 system-ui,sans-serif;color:var(--credit,#6b6b80)}
.lp-credit a{color:inherit;text-decoration:none}
.lp-credit strong{font-weight:700}
/* inline SVG glyphs (replace emoji/text symbols) */
.lp-ico{width:1em;height:1em;flex:none;vertical-align:-.12em}
.lp-placeholder .lp-ico{width:2.4em;height:2.4em;opacity:.55}
.lp-stars{display:inline-flex;gap:.12em}
.lp-play .lp-ico{width:.9em;height:.9em;margin-left:.1em}
