/* Linkcore's own sections on top of the base: split hero with the orbiting core, platform strip,
   rotating statement, live mini-builder and the typing URL footer. */

/* ---------- hero: split layout ---------- */
.lc-hero { justify-content: center; }
.lc-hero-grid { position: relative; flex: 1; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 2rem; padding: 2rem 0 4rem; }
.lc-hero-copy { max-width: 36rem; }
.lc-hero .hero-title { font-size: clamp(3.6rem, 8.4vw, 7.4rem); line-height: .95; margin-bottom: 1.6rem; text-align: left; }
.lc-hero .hero-support { margin: 0 0 1.8rem; padding: 0; max-width: 30rem; font-size: 1.0625rem; text-align: left; color: rgb(255 255 255 / .86); }
.lc-hero .capture { max-width: 32rem; }
.lc-hero .capture-msg { justify-content: flex-start; padding-left: 1.4rem; min-height: 1.6rem; margin-top: .7rem; color: rgb(255 255 255 / .7); }
.lc-hero-links { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-top: 1.4rem; }
.lc-kicker { display: inline-flex; align-items: center; gap: .55rem; margin-bottom: 1.4rem; padding: .4rem .9rem; border-radius: 999px; border: 1px solid rgb(255 255 255 / .28); background: rgb(255 255 255 / .08); font-size: .8125rem; font-weight: 500; color: rgb(255 255 255 / .9); }
.lc-kicker .lc-dot { background: var(--mint); box-shadow: 0 0 0 4px rgb(111 240 201 / .2); }

/* ---------- the core: disc + two orbits + satellites ---------- */
.lc-core-wrap { display: grid; place-items: center; }
.lc-core { position: relative; width: min(38vw, 520px); aspect-ratio: 1; }
.lc-sphere--core { position: absolute !important; inset: 22% !important; width: auto !important; left: 22% !important; top: 22% !important; transform: none !important; animation: lcBreathe 7s ease-in-out infinite alternate !important; }
@keyframes lcBreathe { to { transform: scale(1.04); } }
.lc-orbit { position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid rgb(255 255 255 / .35); }
.lc-orbit--a { border-style: dashed; border-color: rgb(255 255 255 / .3); }
.lc-orbit--b { inset: 13%; border-color: rgb(111 240 201 / .5); }
.lc-sat-track { position: absolute; inset: 0; animation: lcSpin 40s linear infinite; }
.lc-sat-track--b { inset: 13%; animation-duration: 30s; animation-direction: reverse; }
@keyframes lcSpin { to { transform: rotate(360deg); } }
/* each satellite sits on its ring (rotate → push out to the radius → rotate back) */
.lc-sat { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform: rotate(var(--a)) translateY(var(--r)) rotate(calc(var(--a) * -1)); }
.lc-sat-track--a .lc-sat { --r: calc(var(--core) / -2); }
.lc-sat-track--b .lc-sat { --r: calc(var(--core) * .74 / -2); }
.lc-sat-track--a .lc-sat:nth-child(1) { --a: 0deg; } .lc-sat-track--a .lc-sat:nth-child(2) { --a: 120deg; } .lc-sat-track--a .lc-sat:nth-child(3) { --a: 240deg; }
.lc-sat-track--b .lc-sat:nth-child(1) { --a: 90deg; } .lc-sat-track--b .lc-sat:nth-child(2) { --a: 210deg; } .lc-sat-track--b .lc-sat:nth-child(3) { --a: 330deg; }
/* the chip counter-spins so its label stays level while the ring turns */
.lc-sat-in { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); }
.lc-sat-in > span { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .8rem .45rem .45rem; border-radius: 999px; white-space: nowrap;
  background: rgb(255 255 255 / .16); border: 1px solid rgb(255 255 255 / .34); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 10px 30px -10px rgb(4 18 90 / .6); font-size: .8125rem; color: #fff; animation: lcSpin 40s linear infinite reverse; }
.lc-sat-track--b .lc-sat-in > span { animation-duration: 30s; animation-direction: normal; }
.lc-sat-in .icon { width: 16px; height: 16px; padding: 6px; box-sizing: content-box; border-radius: 50%; background: rgb(255 255 255 / .22); }
.lc-sat-in b { font-weight: 600; }
.lc-core { --core: min(38vw, 520px); }

@media (max-width: 900px) {
  .lc-hero-grid { grid-template-columns: 1fr; text-align: left; padding-top: 1rem; }
  .lc-core-wrap { order: -1; }
  .lc-core { width: min(60vw, 300px); margin: 1.5rem 0 2.5rem; }
  .lc-core { --core: min(60vw, 300px); }
  .lc-sat-in > span { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) { .lc-sat-track, .lc-sat-in > span, .lc-sphere--core { animation: none !important; } }

/* ---------- platform strip ---------- */
.lc-strip { padding: 1rem 0 3rem; }
.lc-strip-row { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; }
.lc-chip { display: inline-flex; align-items: baseline; gap: .45rem; padding: .7rem 1.15rem; border-radius: 999px; font-size: .9375rem; color: rgb(255 255 255 / .82); }
.lc-chip b { font-family: var(--font-display); font-weight: 400; font-size: 1.35rem; color: #fff; font-variant-numeric: tabular-nums; }

/* ---------- rotating statement ---------- */
.lc-rotator { text-align: center; }
.lc-rotator h2 { min-height: 2.2em; }
.lc-rotator .lead { margin: 1.4rem auto 0; text-align: center; color: rgb(255 255 255 / .78); }
.lc-rotate { display: inline-block; color: var(--mint); transition: opacity .25s ease, transform .25s ease; }
.lc-rotate.is-out { opacity: 0; transform: translateY(.18em); }
.lc-caret { display: inline-block; width: 3px; height: .78em; margin-left: .14em; color: var(--mint); vertical-align: -.05em; background: currentColor; animation: lcBlink 1s steps(1) infinite; }
@keyframes lcBlink { 50% { opacity: 0; } }

/* ---------- live mini-builder ---------- */
.lc-builder { padding: 2rem 0 var(--section); }
.lc-builder-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.lc-builder-form { margin-top: 2rem; padding: 1.4rem; border-radius: var(--r-card); display: grid; gap: 1.1rem; }
.lc-field { display: grid; gap: .45rem; border: 0; padding: 0; min-width: 0; }
.lc-field input { min-height: 48px; padding: 0 1rem; border-radius: 14px; border: 1px solid rgb(255 255 255 / .26); background: rgb(255 255 255 / .08); color: #fff; font-size: 1rem; outline: none; }
.lc-field input:focus { border-color: var(--mint); box-shadow: 0 0 0 3px rgb(111 240 201 / .2); }
.lc-field input::placeholder { color: rgb(255 255 255 / .5); }
.lc-field legend { margin-bottom: .45rem; }
.lc-builder .label { color: rgb(255 255 255 / .72); }
.lc-swatches { display: flex; gap: .6rem; flex-wrap: wrap; }
.lc-swatches button { width: 44px; height: 44px; border-radius: 50%; background: var(--sw); border: 2px solid rgb(255 255 255 / .3); transition: transform .15s; }
.lc-swatches button[aria-checked="true"] { border-color: #fff; box-shadow: 0 0 0 3px rgb(111 240 201 / .45); transform: scale(1.08); }
.lc-toggles { display: flex; flex-wrap: wrap; gap: .5rem; }
.lc-toggle { display: inline-flex; align-items: center; gap: .45rem; min-height: 42px; padding: 0 1rem; border-radius: 999px; border: 1px solid rgb(255 255 255 / .28); color: rgb(255 255 255 / .8); font-size: .875rem; font-weight: 500; transition: background .15s, color .15s; }
.lc-toggle .icon { width: 16px; height: 16px; }
.lc-toggle[aria-pressed="true"] { background: #fff; color: #0a2a9c; border-color: #fff; }

.lc-phone-wrap { display: grid; place-items: center; }
.lc-phone { width: 300px; min-height: 600px; border-radius: 44px; border: 9px solid rgb(8 20 80 / .85); padding: 26px 18px 22px; display: flex; flex-direction: column; align-items: center; gap: 10px;
  box-shadow: 0 40px 100px -30px rgb(4 18 90 / .9), 0 0 0 1px rgb(255 255 255 / .2); transition: background .4s ease, color .4s ease; --pc: #fff; --pcard: rgb(255 255 255 / .14); --pacc: #6ff0c9; color: var(--pc); }
.lc-phone[data-theme="portal"] { background: radial-gradient(120% 70% at 80% 0%, #6ff0c9 0%, transparent 55%), linear-gradient(170deg, #0a2a9c, #2f52d9 60%, #6b55e6); }
.lc-phone[data-theme="neon"] { background: radial-gradient(90% 50% at 10% 0%, rgb(0 255 213 / .25), transparent 60%), #050507; --pacc: #00ffd5; --pcard: rgb(0 0 0 / .5); }
.lc-phone[data-theme="sunset"] { background: linear-gradient(165deg, #ff7a59, #c2416d 50%, #3b1a5a); --pacc: #ffd166; }
.lc-phone[data-theme="core"] { background: radial-gradient(120% 60% at 50% -10%, #3b1d8f, #0b0b14 60%); --pacc: #8b5cf6; --pcard: rgb(255 255 255 / .07); }
.lc-phone[data-theme="paper"] { background: #f5f5f7; --pc: #111114; --pcard: #fff; --pacc: #6d28d9; }
.lc-phone[data-theme="paper"] .lc-ph-btn, .lc-phone[data-theme="paper"] .lc-ph-video, .lc-phone[data-theme="paper"] .lc-ph-shop, .lc-phone[data-theme="paper"] .lc-ph-mail { border-color: #e4e4ea; }
.lc-ph-top { width: 100%; display: flex; justify-content: center; margin-bottom: 8px; }
.lc-ph-url { font-size: 11px; padding: 4px 10px; border-radius: 999px; background: var(--pcard); opacity: .9; font-family: var(--font-mono); }
.lc-ph-av { width: 78px; height: 78px; border-radius: 50%; display: grid; place-items: center; font-family: var(--font-hero); font-size: 40px; background: var(--pacc); color: #0a0a12; box-shadow: 0 10px 30px -10px rgb(0 0 0 / .5); }
.lc-ph-name { font-weight: 700; font-size: 18px; margin-top: 4px; }
.lc-ph-bio { font-size: 12.5px; opacity: .8; margin-top: -6px; text-align: center; }
.lc-ph-blocks { width: 100%; display: grid; gap: 8px; margin-top: 8px; }
.lc-ph-blocks > div { border-radius: 16px; background: var(--pcard); border: 1px solid rgb(255 255 255 / .18); font-size: 13px; animation: lcPop .3s ease both; }
@keyframes lcPop { from { opacity: 0; transform: scale(.96); } }
.lc-ph-btn { padding: 13px; text-align: center; font-weight: 600; }
.lc-ph-live { padding: 10px 12px; font-weight: 700; font-size: 11px !important; letter-spacing: .06em; display: flex; align-items: center; gap: 8px; background: #ff2d55 !important; color: #fff; border-color: transparent !important; }
.lc-ph-live .lc-dot { background: #fff; }
.lc-ph-video, .lc-ph-shop { display: flex; align-items: center; gap: 10px; padding: 8px; }
.lc-ph-video span, .lc-ph-shop span { width: 54px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: rgb(0 0 0 / .25); }
.lc-ph-shop span { width: 40px; background: var(--pacc); color: #0a0a12; }
.lc-ph-video .icon, .lc-ph-shop .icon { width: 16px; height: 16px; }
.lc-ph-shop b { flex: 1; }
.lc-ph-shop i { font-style: normal; font-weight: 800; color: var(--pacc); padding-right: 6px; }
.lc-ph-mail { padding: 12px; display: grid; gap: 8px; text-align: center; }
.lc-ph-mail span { padding: 9px; border-radius: 10px; background: rgb(0 0 0 / .2); opacity: .7; font-size: 12px; }
@media (max-width: 900px) { .lc-builder-grid { grid-template-columns: 1fr; } .lc-phone { width: min(300px, 86vw); min-height: 560px; } }

/* ---------- footer: typing URL instead of a ghost wordmark ---------- */
.lc-bigurl { font-family: var(--font-display); font-weight: 300; font-size: clamp(2.6rem, 8.5vw, 8rem); letter-spacing: -.04em; line-height: 1; color: rgb(255 255 255 / .16); margin: 3rem 0 2rem; white-space: nowrap; overflow: hidden; text-overflow: clip; }
.lc-bigurl span#lc-type { color: rgb(255 255 255 / .55); font-style: italic; }
.lc-bigurl .lc-caret { color: rgb(111 240 201 / .8); }
