/* Membership niche pages - matched to launchautomation.ai's theme:
   alternating WHITE (dark text) and STAR-VIDEO DARK (light text) sections after the hero,
   site button style + aura, site type scale, star video (/img/starfield/stars.mp4) in every
   dark section. Scoped to .lp-main so the shared header/footer are untouched.
   Rebuilt 2026-09-12. */

:root{
  --lp-ink:#141726; --lp-body:#4b5164; --lp-line:#ece7f5;
  --lp-p1:#5b21b6; --lp-p2:#7c3aed; --lp-p3:#9333ea; --lp-p4:#b06bff; --lp-p5:#c4a5ff; --lp-p6:#e9d5ff;
  --lp-cos1:#0a0617; --lp-cos2:#140a30; --lp-gold:#fbbf24; --lp-wide:1180px;
}

/* ---- scoped resets ---- */
.lp-main{position:relative;font-size:16px;line-height:1.65;color:var(--lp-ink);
  font-family:Lato,Arial,sans-serif;background:#fff;-webkit-font-smoothing:antialiased}
.lp-main *{box-sizing:border-box}
.lp-main a{color:inherit}
.lp-main img{max-width:100%;height:auto;display:block}
.lp-main :is(button,input,select){font:inherit}
.lp-main :is(a,button,summary):focus-visible{outline:3px solid var(--lp-p4);outline-offset:4px;border-radius:6px}
.lp-main :is(h1,h2,h3,p,figure){margin:0}
.lp-main :is(h1,h2,h3){font-family:Oswald,'Arial Narrow',sans-serif;font-weight:700;line-height:1.12;letter-spacing:.2px;text-wrap:balance}
.lp-main h2{font-size:clamp(1.8rem,4vw,2.6rem)}
.lp-main h3{font-weight:600;letter-spacing:-.005em}
.lp-main p{line-height:1.65;max-width:68ch}
.lp-main strong{font-weight:800}
.lp-wrap{max-width:var(--lp-wide);margin:0 auto;padding:0 20px;width:100%}
.lp-skip{position:absolute;left:12px;top:-100px;z-index:100;background:#fff;color:#000;padding:12px}
.lp-skip:focus{top:10px}
/* per Corey: no eyebrows, no kicker, no breadcrumb, no hero subline / screen label / caption */
.lp-main .lp-eyebrow,.lp-main .lp-kicker{display:none!important}
.lp-breadcrumb,.lp-hero .lp-small,.lp-screen-label,.lp-caption-tag{display:none}

/* ---- buttons: site .btn gradient pill + animated aura ---- */
.lp-btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:15px 30px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;
  font-family:Oswald,sans-serif;font-weight:700;font-size:.92rem;letter-spacing:.06em;text-transform:uppercase;
  text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}
.lp-btn-gold,.lp-btn-purple{color:#fff;background:linear-gradient(135deg,#7c3aed,#9333ea 55%,#b06bff);
  box-shadow:0 12px 30px rgba(124,58,237,.4)}
.lp-btn-gold::before,.lp-btn-purple::before{content:"";position:absolute;inset:-5px;z-index:-2;border-radius:999px;
  background-image:linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899,#f97316,#3b82f6);background-size:300% 300%;
  filter:blur(7px);opacity:.75;animation:lpAura 6s linear infinite;transition:opacity .3s}
.lp-btn-gold:hover,.lp-btn-purple:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(124,58,237,.5)}
.lp-btn-gold:hover::before,.lp-btn-purple:hover::before{opacity:1}
.lp-btn-outline,.lp-btn-light{background:transparent}
.lp-btn-outline:hover,.lp-btn-light:hover{transform:translateY(-2px)}
@keyframes lpAura{to{background-position:200% 0}}

/* ============================================================= */
/* STAR-VIDEO DARK machinery (hero + .lp-dark + .lp-final)        */
/* ============================================================= */
.lp-hero,.lp-section.lp-dark,.lp-final{position:relative;isolation:isolate;overflow:hidden;background:#0b0620;color:#fff}
.lp-hero>.secbed,.lp-dark>.secbed,.lp-final>.secbed{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;z-index:-2;display:block;border:0;margin:0;pointer-events:none}
.lp-hero>.secveil,.lp-dark>.secveil,.lp-final>.secveil{position:absolute;inset:0;z-index:-1;display:block;pointer-events:none}
/* top of the hero veil matches the (transparent) header's dark ground so header+hero read as
   one continuous field with no seam, then the stars emerge lower down */
.lp-hero>.secveil{background:
  linear-gradient(180deg,#0a0617 0,rgba(10,6,23,.55) 12%,transparent 34%),
  radial-gradient(820px 520px at 82% 64%,rgba(124,58,237,.32),transparent 60%),
  linear-gradient(160deg,rgba(10,5,30,.60),rgba(28,12,66,.42) 50%,rgba(9,5,20,.66))}
.lp-dark>.secveil{background:linear-gradient(160deg,rgba(10,5,30,.80),rgba(28,12,66,.58) 52%,rgba(9,5,20,.84))}
.lp-hero>.lp-wrap,.lp-dark>.lp-wrap,.lp-final>.lp-wrap{position:relative;z-index:1}
/* light text on dark */
.lp-section.lp-dark :is(h2,h3){color:#fff}
.lp-section.lp-dark h2{background:linear-gradient(90deg,#ffffff,#efe6ff 48%,#c9b6ff);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.lp-section.lp-dark p,.lp-section.lp-dark li,.lp-section.lp-dark dt{color:#d4cde6}
.lp-section.lp-dark .lp-eyebrow{color:#ccabff}
.lp-section.lp-dark .lp-btn-outline{color:#fff;border-color:rgba(196,165,255,.5)}
.lp-section.lp-dark .lp-btn-outline:hover{background:rgba(255,255,255,.1);border-color:rgba(216,180,254,.85)}

/* ---- hero ---- */
.lp-hero{padding:26px 0 88px}
.lp-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:52px;align-items:start}
/* the section eyebrow lives here now: a formatted label-headline above the screenshot */
.lp-hero .lp-case-media{padding-top:4px}
.lp-hero-eyebrow{display:flex;align-items:flex-start;gap:12px;margin:0 0 20px;font-family:Oswald,sans-serif;
  font-weight:800;font-size:clamp(.92rem,1.1vw,1.08rem);letter-spacing:.15em;text-transform:uppercase;
  color:#cdafff;line-height:1.35}
.lp-hero-eyebrow::before{content:"";width:30px;height:2px;margin-top:.55em;border-radius:2px;background:currentColor;flex:0 0 auto}
.lp-hero .lp-case-media .lp-frame{margin-top:0}
.lp-hero-figcap{margin:16px 4px 0;font-size:.8rem;color:#b3a8cc;text-align:center;line-height:1.5}
.lp-hero-figcap strong{color:#d9cdf0;font-weight:700}
.lp-hero .lp-lead{margin-top:24px;max-width:52ch}
.lp-hero h1{max-width:15ch;font-family:Oswald,sans-serif;font-weight:700;line-height:1.08;letter-spacing:.2px;
  font-size:clamp(2.1rem,3.4vw,3.3rem);color:#fff;text-shadow:0 0 40px rgba(150,120,255,.35)}
.lp-hero h1 .lp-hl{background:linear-gradient(92deg,#c4b5fd,#f0abfc 55%,#fbbf24);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.lp-lead{font-size:1.12rem;color:#e0d9ee;margin-top:22px;line-height:1.7;max-width:54ch}
.lp-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:30px}
.lp-showcase{position:relative;padding:14px 0 14px;min-width:0}
.lp-screen{background:#0d0a1c;border:7px solid #241d38;border-radius:16px;overflow:hidden;
  box-shadow:0 34px 80px rgba(6,2,18,.7);transform:perspective(1200px) rotateY(-7deg) rotateX(2deg)}
.lp-screen-top{height:30px;background:#1a1530;color:#a99fc6;display:flex;gap:5px;align-items:center;padding:0 12px;font:11px Lato,sans-serif}
.lp-screen-top i{height:6px;width:6px;border-radius:50%;background:#4a4166}
.lp-screen-top span{margin:auto;position:relative;left:-10px}
.lp-screen img{width:100%;aspect-ratio:1330/755;object-fit:contain;background:#fff}

/* ---- pill row (caps the hero band) ---- */
.lp-pillrow{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 40px;padding:20px 24px;
  background:#0b0620;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);
  font-size:.94rem;font-weight:700;color:#efeaff}
.lp-pillrow span{display:flex;align-items:center;gap:9px}
.lp-pillrow span:before{content:'';width:15px;height:15px;border-radius:50%;flex:0 0 auto;
  background:radial-gradient(circle at 35% 30%,#e9d5ff,#7c3aed);box-shadow:0 0 10px rgba(176,107,255,.6)}

/* ============================================================= */
/* LIGHT sections (default) - white ground, dark text            */
/* ============================================================= */
.lp-section{padding:84px 0;position:relative;background:linear-gradient(180deg,#ffffff,#faf8ff);color:var(--lp-ink)}
.lp-section.lp-dark{background:#0b0620}
.lp-section-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:end;margin-bottom:44px}
.lp-section h2{color:var(--lp-ink);background:linear-gradient(90deg,#1b1230,#5b21b6 90%);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.lp-section p{color:var(--lp-body)}
.lp-section .lp-btn-outline{color:var(--lp-ink);border-color:#d8cbf0}
.lp-section .lp-btn-outline:hover{background:#f3edff;border-color:var(--lp-p4)}
.lp-eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#6530a7;margin-bottom:16px}

/* problems (light) */
.lp-problems{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.lp-problems article{padding-top:24px;border-top:2px solid var(--lp-p4)}
.lp-problems h3{font-size:1.24rem;color:var(--lp-ink)}
.lp-problems p{font-size:1rem;margin-top:14px}

/* journey (dark) */
.lp-journey{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:46px}
.lp-journey article{position:relative;border-top:1px solid rgba(176,107,255,.4);padding:32px 22px 0 0}
.lp-journey article:before{content:attr(data-step);position:absolute;top:-18px;left:0;width:34px;height:34px;
  background:linear-gradient(160deg,#9333ea,#5b21b6);border:3px solid var(--lp-cos1);border-radius:50%;
  display:grid;place-items:center;font-size:13px;color:#fff;font-weight:900;box-shadow:0 0 16px rgba(124,58,237,.6)}
.lp-journey h3{font-size:1.1rem;color:#fff}
.lp-journey p{font-size:.96rem;margin-top:12px}
.lp-product-example{border-left:3px solid var(--lp-gold);padding:20px 26px;background:rgba(124,58,237,.16);
  border-radius:0 12px 12px 0;margin-top:42px;font-size:1.02rem;color:#ece7f8}
.lp-product-example p{max-width:100%;color:#ece7f8}

/* features (light) */
.lp-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 38px}
.lp-feature{padding:28px 0;border-bottom:1px solid var(--lp-line)}
.lp-feature-number{font-family:Oswald,sans-serif;color:var(--lp-p2);font-size:26px;display:block;margin-bottom:10px}
.lp-feature h3{font-size:1.12rem;color:var(--lp-ink)}
.lp-feature p{margin-top:10px;font-size:1rem}

/* course library (dark) */
.lp-library{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:start}
.lp-library p{margin-top:20px}
.lp-course-list{display:grid;gap:16px}
.lp-course-row{padding:22px;background:rgba(255,255,255,.05);border:1px solid rgba(176,107,255,.24);border-radius:14px;
  display:grid;grid-template-columns:42px 1fr;gap:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.lp-course-row>span{font-size:24px;color:var(--lp-p5);font-family:Oswald,sans-serif}
.lp-course-row h3{font-size:1.05rem;color:#fff}
.lp-course-row p{font-size:.95rem;margin:6px 0 0}
.lp-course-callout{padding:16px 0;font-size:.95rem;color:#b3a8cc}

/* ideas (light) */
.lp-ideas{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.lp-idea{border-radius:16px;padding:28px;background:#fff;border:1px solid var(--lp-line);box-shadow:0 12px 30px rgba(60,30,120,.06)}
.lp-idea h3{font-size:1.18rem;color:var(--lp-ink)}
.lp-idea p{font-size:1rem;margin-top:14px}
.lp-ideas-label{font-size:.85rem;color:#725094;margin-top:18px}

/* possibility / config (dark) */
.lp-possibility{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.lp-possibility h2{max-width:12ch}
.lp-possibility p{margin-top:20px}
/* customization panel: readable on the LIGHT customization section (was white-on-white before) */
.lp-config{background:#fff;border:1px solid #e7ddf6;border-radius:18px;overflow:hidden;box-shadow:0 26px 58px rgba(60,30,120,.14)}
.lp-config-title{background:linear-gradient(135deg,#7c3aed,#9333ea 60%,#b06bff);padding:20px 24px;
  font:800 13px Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.lp-config dl{margin:0;padding:6px 24px}
.lp-config dl>div{padding:16px 0;border-bottom:1px solid #efe8fa;display:flex;justify-content:space-between;align-items:center;gap:20px}
.lp-config dl>div:last-child{border:0}
.lp-config dt{font-size:.94rem;color:#5c5470;font-weight:600;display:flex;align-items:center;gap:10px}
.lp-config dt::before{content:"";width:18px;height:18px;border-radius:50%;flex:0 0 auto;
  background:radial-gradient(circle at 35% 30%,#c4a5ff,#7c3aed);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/13px no-repeat}
.lp-config dd{font-size:.95rem;font-weight:800;margin:0;text-align:right;color:#4c1d95}
.lp-config .lp-swatch{display:inline-block;width:16px;height:16px;border-radius:50%;background:var(--swatch);vertical-align:middle;margin-left:5px;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.lp-config-bottom{padding:16px 24px;background:#faf6ff;border-top:1px solid #efe8fa;font-size:.85rem;color:#6b6480}
/* dark-section fallback (if ever used on a dark section) */
.lp-section.lp-dark .lp-config{background:rgba(255,255,255,.05);border-color:rgba(176,107,255,.24);box-shadow:0 26px 60px rgba(6,2,18,.5)}
.lp-section.lp-dark .lp-config dl>div{border-color:rgba(255,255,255,.08)}
.lp-section.lp-dark .lp-config dt{color:#cabfe0}
.lp-section.lp-dark .lp-config dd{color:#fff}
.lp-section.lp-dark .lp-config-bottom{background:rgba(124,58,237,.12);border-color:rgba(255,255,255,.08);color:#c3b8dc}

/* investment / money (light) */
.lp-money{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.lp-money h2{max-width:12ch}
.lp-money p{margin-top:20px}
.lp-price-panel{padding:36px;border-radius:20px;border:1px solid #e0d3f5;
  background:linear-gradient(160deg,#f7f1ff,#fff);box-shadow:0 24px 54px rgba(60,30,120,.1)}
.lp-price-panel h3{font-size:1.4rem;color:var(--lp-ink)}
.lp-price-panel ul{padding-left:0;margin:22px 0;color:var(--lp-body);list-style:none}
.lp-price-panel li{margin:11px 0;padding-left:28px;position:relative}
.lp-price-panel li:before{content:'✓';position:absolute;left:0;top:0;color:var(--lp-p2);font-weight:900}
.lp-price-panel .lp-small{display:block;margin-top:14px;font-size:.85rem;color:#7a6b93}

/* launch / process (dark) */
.lp-process{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;margin-top:42px}
.lp-process strong{display:block;font:700 38px Oswald,sans-serif;
  background:linear-gradient(135deg,#c4b5fd,#f0abfc);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;margin-bottom:14px}
.lp-process h3{font-size:1.1rem;color:#fff}
.lp-process p{font-size:1rem;margin-top:12px}
.lp-static-note{font-size:.85rem;color:#b3a8cc;margin-top:16px}

/* faq (light) */
.lp-faq-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:56px}
.lp-faq-intro p{margin-top:20px}
.lp-faq details{border-bottom:1px solid var(--lp-line)}
.lp-faq summary{cursor:pointer;padding:20px 40px 20px 0;list-style:none;font-weight:800;font-size:1.06rem;position:relative;color:var(--lp-ink)}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary:after{content:'+';position:absolute;right:3px;color:var(--lp-p2);font-size:26px;top:12px}
.lp-faq details[open] summary:after{content:'−'}
.lp-faq details p{padding:0 30px 22px 0;color:var(--lp-body);font-size:1rem;max-width:none}

/* closing CTA (dark + star video) */
.lp-final{padding:88px 0}
.lp-final>.secveil{background:
  radial-gradient(700px 360px at 15% 25%,rgba(176,107,255,.4),transparent 60%),
  linear-gradient(95deg,rgba(50,17,107,.9),rgba(91,33,182,.78))}
.lp-final .lp-wrap{display:grid;grid-template-columns:1.35fr 1fr;align-items:center;gap:48px}
.lp-final h2{color:#fff;-webkit-text-fill-color:#fff;background:none}
.lp-final p{color:#e8dbff;margin-top:18px}
.lp-final .lp-actions{margin:0;justify-content:flex-end}

/* related (dark) */
.lp-related{padding:46px 0;position:relative;isolation:isolate;overflow:hidden;background:#0b0620;color:#fff}
.lp-related h3{color:#fff;font-size:1.16rem}
.lp-related-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px}
.lp-related-links a{padding:11px 20px;text-decoration:none;border:1px solid rgba(196,165,255,.32);
  border-radius:999px;font-size:.95rem;font-weight:700;color:#efeaff;background:rgba(255,255,255,.05);transition:.15s}
.lp-related-links a:hover{border-color:rgba(216,180,254,.8);background:rgba(255,255,255,.1);transform:translateY(-1px)}

/* ============================================================= */
/* Redesign components (2026-09-12): case features, browser frames, */
/* showcase grid, product demo, chips                              */
/* ============================================================= */
.lp-eyebrow2{display:inline-flex;align-items:center;gap:8px;font-size:.74rem;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;margin-bottom:18px}
.lp-section.lp-dark .lp-eyebrow2{color:#c9aaff}
.lp-section .lp-eyebrow2{color:#7c3aed}
.lp-eyebrow2::before{content:"";width:26px;height:2px;border-radius:2px;background:currentColor;display:inline-block}

/* browser frame (product screenshots as centerpiece) */
.lp-frame{border-radius:14px;overflow:hidden;box-shadow:0 34px 80px rgba(6,2,18,.55);position:relative}
.lp-frame-top{height:36px;display:flex;align-items:center;gap:7px;padding:0 15px;background:#1a1530;border-bottom:1px solid rgba(255,255,255,.06)}
.lp-frame-top i{width:9px;height:9px;border-radius:50%;background:#4a4166}
.lp-frame-top i:nth-child(1){background:#ff5f57}.lp-frame-top i:nth-child(2){background:#febc2e}.lp-frame-top i:nth-child(3){background:#28c840}
.lp-frame-top .lp-url{margin-left:12px;font:11px Lato,sans-serif;color:#b7add0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-frame>img{display:block;width:100%;height:auto;aspect-ratio:1280/800;object-fit:cover;object-position:top;background:#0d0a1c}
.lp-section .lp-frame{border:1px solid #e3d9f4}
.lp-section.lp-dark .lp-frame,.lp-hero .lp-frame{border:1px solid #2a2340}

/* hero uses the frame as the centerpiece */
.lp-hero .lp-frame{transform:perspective(1400px) rotateY(-6deg) rotateX(2deg)}
.lp-hero-trust{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:20px;font-size:.86rem;color:#c7bce0}
.lp-hero-trust span{display:inline-flex;align-items:center;gap:8px}
.lp-hero-trust span::before{content:"✓";color:#c4a5ff;font-weight:900}

/* case feature block (editorial, alternating) */
.lp-case{display:grid;grid-template-columns:1.02fr .98fr;gap:54px;align-items:center}
.lp-case.rev .lp-case-media{order:2}
.lp-brandrow{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.lp-brandrow img{height:40px;width:auto;background:#fff;border-radius:9px;padding:6px 11px;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.lp-brandrow .lp-tag{font-size:.7rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;padding:5px 11px;border-radius:999px}
.lp-section.lp-dark .lp-tag{background:rgba(196,165,255,.16);color:#d9c7ff;border:1px solid rgba(196,165,255,.3)}
.lp-section .lp-tag{background:#f0e9ff;color:#6d28d9;border:1px solid #e0d3f5}
.lp-chips{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 24px}
.lp-chips span{font-size:.82rem;font-weight:700;padding:8px 14px;border-radius:999px}
.lp-section.lp-dark .lp-chips span{background:rgba(255,255,255,.06);border:1px solid rgba(176,107,255,.28);color:#e7e0f5}
.lp-section .lp-chips span{background:#fff;border:1px solid #e6ddf5;color:#4b3d66}
.lp-cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:6px}
.lp-textlink{font-family:Oswald,sans-serif;font-weight:700;font-size:.9rem;letter-spacing:.02em;text-decoration:none;
  display:inline-flex;align-items:center;gap:7px;transition:gap .16s}
.lp-textlink:hover{gap:11px}
.lp-section.lp-dark .lp-textlink{color:#d9c7ff}.lp-section .lp-textlink{color:#7c3aed}

/* showcase grid of real builds */
.lp-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:44px}
.lp-casecard{border-radius:16px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease}
.lp-casecard:hover{transform:translateY(-5px)}
.lp-section.lp-dark .lp-casecard{background:rgba(255,255,255,.05);border:1px solid rgba(176,107,255,.24)}
.lp-section.lp-dark .lp-casecard:hover{box-shadow:0 24px 50px rgba(6,2,18,.6);border-color:rgba(196,165,255,.5)}
.lp-section .lp-casecard{background:#fff;border:1px solid #e9e0f5;box-shadow:0 10px 26px rgba(60,30,120,.06)}
.lp-section .lp-casecard:hover{box-shadow:0 22px 46px rgba(60,30,120,.14)}
.lp-casecard-shot{aspect-ratio:1280/800;overflow:hidden;border-bottom:1px solid rgba(128,90,200,.14)}
.lp-casecard-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.lp-casecard-b{padding:20px 20px 22px;display:flex;flex-direction:column;gap:9px;flex:1}
.lp-casecard-cat{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.lp-section.lp-dark .lp-casecard-cat{color:#b79aff}.lp-section .lp-casecard-cat{color:#8b5cf6}
.lp-casecard h3{font-size:1.05rem;line-height:1.2}
.lp-section.lp-dark .lp-casecard h3{color:#fff}.lp-section .lp-casecard h3{color:var(--lp-ink)}
.lp-casecard p{font-size:.92rem;flex:1;margin:0}
.lp-casecard .lp-cclink{font-family:Oswald,sans-serif;font-weight:700;font-size:.85rem;display:inline-flex;align-items:center;gap:6px;margin-top:2px}
.lp-section.lp-dark .lp-casecard .lp-cclink{color:#d9c7ff}.lp-section .lp-casecard .lp-cclink{color:#7c3aed}

/* product demonstration: 3 layers (public / member / owner) */
.lp-demo3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.lp-demo3 article{padding:26px 24px;border-radius:15px}
.lp-section.lp-dark .lp-demo3 article{background:rgba(255,255,255,.05);border:1px solid rgba(176,107,255,.24)}
.lp-section .lp-demo3 article{background:#fff;border:1px solid #ece4f8;box-shadow:0 10px 26px rgba(60,30,120,.05)}
.lp-demo3 .lp-step{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;color:#8b5cf6}
.lp-section.lp-dark .lp-demo3 .lp-step{color:#b79aff}
.lp-demo3 h3{font-size:1.12rem;margin-bottom:8px}
.lp-demo3 p{font-size:.95rem}

/* section intro (centered) */
.lp-intro{max-width:760px;margin:0 auto 8px;text-align:center}
.lp-intro.left{margin:0 0 8px;text-align:left}
.lp-intro p{margin:16px auto 0;max-width:64ch}
.lp-intro.left p{margin-left:0}

/* ============ responsive ============ */
@media(max-width:1000px){
  .lp-hero-grid{gap:30px;grid-template-columns:1fr 1fr}
  .lp-hero h1{font-size:3.4rem}
  .lp-section-heading,.lp-library,.lp-possibility,.lp-money,.lp-faq-layout{gap:38px}
  .lp-problems,.lp-ideas{gap:24px}
  .lp-feature-grid{gap:0 24px}
  .lp-final .lp-wrap{grid-template-columns:1fr}
  .lp-final .lp-actions{justify-content:flex-start}
}
@media(max-width:760px){
  .lp-wrap{padding:0 20px}
  .lp-hero{padding:22px 0 46px}
  .lp-hero-grid{grid-template-columns:1fr;gap:32px}
  .lp-hero h1{font-size:2.6rem;max-width:16ch}
  .lp-lead{font-size:1.05rem;margin-top:18px}
  .lp-actions{gap:10px}
  .lp-btn{width:100%}
  .lp-hero .lp-actions .lp-btn{width:auto;flex:1 1 auto}
  .lp-showcase{max-width:560px;width:100%;margin:auto}
  .lp-section{padding:56px 0}
  .lp-section-heading,.lp-library,.lp-possibility,.lp-money,.lp-faq-layout{grid-template-columns:1fr;gap:24px}
  .lp-section-heading{margin-bottom:28px}
  .lp-problems,.lp-ideas,.lp-process{grid-template-columns:1fr;gap:24px}
  .lp-journey{grid-template-columns:1fr 1fr;gap:42px 22px}
  .lp-journey article{padding-right:0}
  .lp-feature-grid{grid-template-columns:1fr 1fr;gap:0 22px}
  .lp-product-example{padding:18px;margin-top:32px}
  .lp-price-panel{padding:26px}
  .lp-final{padding:56px 0}
  .lp-pillrow{gap:12px 22px;font-size:.82rem}
}
@media(max-width:430px){
  .lp-hero h1{font-size:2.25rem}
  .lp-journey,.lp-feature-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .lp-btn,.lp-related-links a{transition:none}
  .lp-btn-gold::before,.lp-btn-purple::before{animation:none;opacity:.55}
  .lp-btn-gold:hover,.lp-btn-purple:hover,.lp-btn-outline:hover{transform:none}
  .lp-hero>.secbed,.lp-dark>.secbed,.lp-final>.secbed{display:none}
}

/* ---- redesign component responsive ---- */
@media(max-width:1000px){
  .lp-cases{grid-template-columns:repeat(2,1fr)}
  .lp-demo3{grid-template-columns:1fr}
  .lp-case{gap:36px}
}
@media(max-width:860px){
  .lp-case{grid-template-columns:1fr;gap:30px}
  .lp-case.rev .lp-case-media{order:0}
}
@media(max-width:760px){
  .lp-cases{grid-template-columns:1fr}
  .lp-hero .lp-frame{transform:none}
  .lp-brandrow img{height:34px}
}

/* ================= detail polish (2026-09-12) ================= */
:root{--lp-eo:cubic-bezier(.23,1,.32,1)}
/* tactile press feedback + stronger easing on every button */
.lp-main .lp-btn{transition:transform .18s var(--lp-eo),box-shadow .22s var(--lp-eo),background .18s var(--lp-eo)}
.lp-main .lp-btn:active{transform:scale(.975)}
.lp-main .lp-textlink{transition:gap .18s var(--lp-eo),color .16s var(--lp-eo)}
/* case cards: gentle image zoom on hover, smoother lift (pointer devices only) */
.lp-casecard-shot img{transition:transform .55s var(--lp-eo)}
.lp-casecard{transition:transform .2s var(--lp-eo),box-shadow .2s var(--lp-eo),border-color .2s var(--lp-eo)}
@media (hover:hover) and (pointer:fine){
  .lp-casecard:hover .lp-casecard-shot img{transform:scale(1.05)}
}
/* browser frames ease their shadow */
.lp-frame{transition:box-shadow .3s var(--lp-eo)}
/* scroll reveal: opt-in via .lp-anim (added by JS). Content stays visible without JS or reduced-motion. */
.lp-anim .lp-reveal{opacity:0;transform:translateY(16px);transition:opacity .55s var(--lp-eo),transform .55s var(--lp-eo)}
.lp-anim .lp-reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.lp-anim .lp-reveal{opacity:1!important;transform:none!important;transition:none!important}}

/* ================= polish round 2 (2026-09-12) ================= */
/* accessibility: freeze the background star videos for reduced-motion (dark veil ground remains) */
@media (prefers-reduced-motion:reduce){
  .lp-hero>.secbed,.lp-section.lp-dark>.secbed,.lp-final>.secbed{display:none}
}
/* FAQ: smoothly rotating +/x marker, hover affordance, answer fades in on open */
.lp-faq summary{transition:color .16s var(--lp-eo)}
.lp-faq summary:hover{color:#7c3aed}
.lp-section.lp-dark .lp-faq summary:hover{color:#c9aaff}
.lp-faq summary:after{transition:transform .22s var(--lp-eo)}
.lp-faq details[open] summary:after{content:"+";transform:rotate(45deg)}
.lp-faq details[open] > p{animation:lpFaqIn .3s var(--lp-eo)}
@keyframes lpFaqIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.lp-faq details[open] > p{animation:none}}
/* keyboard: full-card focus ring on case cards + related links */
.lp-casecard:focus-visible{outline:3px solid var(--lp-p4);outline-offset:4px;border-radius:16px}
/* text links get an animated underline on hover for a bit more life */
.lp-textlink{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1.5px;
  background-position:0 100%;background-repeat:no-repeat;transition:gap .18s var(--lp-eo),background-size .22s var(--lp-eo)}
.lp-textlink:hover{background-size:100% 1.5px}

/* ================= scrolling screenshots (2026-09-13) ================= */
/* tall full-page capture fills the frame window and pans top->bottom; only while in view */
.lp-frame>img.lp-shot,.lp-casecard-shot img.lp-shot{object-position:50% 0%}
.lp-frame>img.lp-shot.pan,.lp-casecard-shot img.lp-shot.pan{
  animation:lpPan var(--pan,28s) linear infinite alternate}
@keyframes lpPan{from{object-position:50% 0%}to{object-position:50% 100%}}
@media (prefers-reduced-motion:reduce){
  .lp-frame>img.lp-shot.pan,.lp-casecard-shot img.lp-shot.pan{animation:none;object-position:50% 0%}
}
