/* Lead Game / Liquid Glass. Marketing presentation only. */
.liquid-page {
  --ink: #35272f;
  --brand: #d3403a;
  --glass-orange: #ff9548;
  --glass-violet: #8b4cb0;
  --muted: #735a5c;
  --red: #b63035;
  --line: #e7c2b6;
  --glass-edge: rgb(255 255 255 / .86);
  --glass-fill: rgb(255 255 255 / .57);
  --glass-shadow: 0 22px 55px -30px #8b3f4052, inset 0 1px 0 #fff, inset 0 -1px 0 #ffffff80;
  isolation: isolate;
  background: #f9e2d6;
  background-image: radial-gradient(ellipse at 12% 8%, #fff8e9 0, transparent 42%), linear-gradient(125deg, #fff0e1, #f8d6c4 58%, #f0b8ac);
  color: var(--ink);
}
.glass-atmosphere { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.glass-atmosphere::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 96% 16%, #d3403a99, transparent 53%), radial-gradient(ellipse at 38% 95%, #ff954880, transparent 56%), radial-gradient(ellipse at 0% 75%, #8b4cb033, transparent 30%); }
.glass-orb { position: absolute; border-radius: 50%; border: 1px solid #ffffffa3; box-shadow: inset -20px -22px 40px #a9394a30, inset 9px 10px 20px #ffffffa3, 0 26px 70px -25px #aa4b4840; }
.orb-coral { width: 440px; height: 440px; right: -105px; top: 160px; background: radial-gradient(circle at 30% 25%, #fff1cf 0, #ffa570c9 27%, #d3403a9c 62%, #a43c686b 87%); }
.orb-ice { width: 340px; height: 340px; left: -175px; top: 480px; background: radial-gradient(circle at 30% 25%, #fff3dc 0, #ffb46bce 38%, #e86b438c 72%, #8b4cb066 98%); }
.glass-orbit { position: absolute; width: 490px; height: 490px; top: 50px; right: 85px; border-radius: 50%; border: 24px solid #ffffff30; box-shadow: inset 2px 3px 3px #ffffffb0, inset -2px -3px 4px #9b405b36, 2px 4px 6px #9c3f5b26; transform: rotate(-25deg) scaleY(.42); }
/* Separate scroll depths; the fixed clipping frame never moves the content. */
.glass-atmosphere::before { transform: translate3d(calc(var(--parallax-progress, 0) * -18px), calc(var(--parallax-progress, 0) * -35px), 0) scale(1.14); }
.orb-coral { transform: translate3d(calc(var(--parallax-progress, 0) * 50px), calc(var(--parallax-progress, 0) * -210px), 0); }
.orb-ice { transform: translate3d(calc(var(--parallax-progress, 0) * -25px), calc(var(--parallax-progress, 0) * 130px), 0); }
.glass-orbit { transform: translate3d(calc(var(--parallax-progress, 0) * -30px), calc(var(--parallax-progress, 0) * -300px), 0) rotate(calc(-25deg + var(--parallax-progress, 0) * 14deg)) scaleY(.42); }
.liquid-page .prototype-bar { background: #ffffff45; color: #6c4e50; border-bottom: 1px solid #fff9; }
.liquid-page .prototype-bar a { color: #6c4e50; }
.liquid-page .site-header { min-height: 86px; margin-top: 20px; padding: 14px 24px; border: 1px solid var(--glass-edge); border-radius: 25px; background: var(--glass-fill); box-shadow: var(--glass-shadow); }
.liquid-page .site-header nav { color: #6c4e50; }
.liquid-page .site-header nav a:hover { color: var(--red); }
.liquid-page .site-header .brand img.lead-game-logo { width: 190px; }
.liquid-page .button { position: relative; overflow: hidden; border-radius: 16px; color: #fff; background: linear-gradient(150deg, #db5a58, #b9363e 70%, #982f42); border: 1px solid #fff8; box-shadow: 0 8px 18px -10px #9c233ca8, inset 0 1px 1px #ffffff90, inset 0 -2px 3px #7a223c3d; transition: transform .2s, box-shadow .2s; }
.liquid-page .button::before { content: ''; position: absolute; inset: 1px 2px auto; height: 43%; border-radius: 13px 13px 50% 50%; background: linear-gradient(#ffffff30, #fff0); pointer-events: none; }
.liquid-page .button:hover { transform: translateY(-2px); box-shadow: 0 13px 26px -13px #9c233ca8, inset 0 1px 1px #ffffff90; }
.liquid-page .hero { gap: 72px; padding-top: 68px; padding-bottom: 82px; }
.liquid-page .hero h1 { color: #35272f; text-shadow: 0 2px 0 #fff9; }
.liquid-page .hero h1 em { color: #b63035; }
.liquid-page .hero .intro { color: #573f44; }
.liquid-page .hero-offer { color: #74575b; }
.liquid-page .hero .eyebrow { color: #705459; }
.liquid-page .hero-foot { gap: 10px; margin-top: 28px; flex-wrap: wrap; }
.liquid-page .hero-foot span { border: 1px solid #fff; border-radius: 30px; background: #ffffff6b; padding: 7px 12px; color: #705056; box-shadow: 0 3px 10px -7px #9c4a5c66; }
.liquid-page .hero-foot span+span { padding: 7px 12px; }
.liquid-page .hero-foot span::before { color: #9e333c; }
.liquid-page .demo-exhibit { padding: 22px; border: 1px solid #ffffffd9; border-radius: 32px; background: linear-gradient(140deg, #ffffffc9, #ffffff4f 50%, #ffffff8a); box-shadow: 0 35px 65px -32px #984b5866, inset 0 2px 2px #fff, inset 0 -2px 3px #ffffffbd; transform: perspective(1400px) rotateY(-5deg) rotateX(2deg); }
.liquid-page .demo-exhibit::before { content: ''; position: absolute; inset: 7px; border: 1px solid #ffffff7a; border-radius: 25px; pointer-events: none; }
.liquid-page .exhibit-heading { padding: 1px 5px 18px; }
.liquid-page .exhibit-heading .eyebrow { color: #65474e; }
.liquid-page .exhibit-edition { color: #7a5a65; }
.liquid-page .stage-switch { background: #99403910; border: 1px solid #fff9; border-radius: 17px; padding: 5px; box-shadow: inset 0 2px 5px #99403912; margin-bottom: 17px; }
.liquid-page .stage-switch button { border-radius: 12px; color: #73535c; font-size: 12px; min-height: 44px; }
.liquid-page .stage-switch button[aria-pressed=true] { background: linear-gradient(155deg, #fff, #ffffff85); color: #a42f37; box-shadow: 0 4px 9px -5px #8d435c66, inset 0 1px 0 #fff; }
.liquid-page .stage-preview { border-radius: 19px; border: 1px solid #ffffffde; box-shadow: 0 10px 23px -17px #8c485966, inset 0 1px 0 #fff; background: #ffffffa1; }
.liquid-page .sample-head { border-color: #e6dfd175; color: #695159; padding: 11px 16px; background: linear-gradient(110deg, #ffffffda, #ffffff36); }
.liquid-page .sample-head span:last-child { color: #775a64; }
.liquid-page .clay-stage-image { border-radius: 0 0 18px 18px; }
.liquid-page .exhibit-footer { padding: 21px 5px 11px; }
.liquid-page .exhibit-footer .eyebrow { color: #7b5565; }
.liquid-page .exhibit-footer h2 { color: #533b46; }
.liquid-page .exhibit-footer a { background: linear-gradient(145deg, #ffffffed, #ffffff66); color: #ad3038; border: 1px solid #fff; box-shadow: 0 6px 17px -9px #9e455e66, inset 0 1px 2px #fff; transition: transform .2s; }
.liquid-page .exhibit-footer a:hover { transform: rotate(6deg) scale(1.05); background: #fff; }
.liquid-page .exhibit-note { color: #78565f; padding-inline: 5px; }
.liquid-page .service-strip { border: 1px solid #ffffffd9; border-radius: 20px; padding: 20px 25px; background: #ffffff57; box-shadow: var(--glass-shadow); }
.liquid-page .service-strip>span,.liquid-page .service-strip p,.liquid-page .service-strip a { color: #73525a; }
.liquid-page .section-heading>p { color: #72545f; }
.liquid-page .filter-row { border: 1px solid #ffffffd9; padding: 5px; background: #ffffff59; gap: 5px; width: fit-content; max-width: 100%; border-radius: 19px; box-shadow: inset 0 1px 0 #fff, 0 5px 17px -14px #a3485b66; }
.liquid-page .chip { padding: 9px 19px; min-height: 44px; border: 1px solid transparent; border-radius: 14px; color: #70505d; font-size: 12px; }
.liquid-page .chip:hover { background: #ffffff61; }
.liquid-page .chip.active { color: #a52d36; background: #ffffffd9; border: 1px solid #fff; box-shadow: 0 3px 8px -5px #9c4a5c44; }
.liquid-page .experience-list { gap: 24px; }
.liquid-page .experience { border: 1px solid #ffffffed; border-radius: 27px; padding: 11px; background: linear-gradient(145deg, #ffffffbf, #ffffff57 70%); box-shadow: 0 18px 36px -30px #9c4a5c66, inset 0 1px 1px #fff; transition: transform .25s, box-shadow .25s; }
.liquid-page .experience:hover { border-color: #fff; box-shadow: 0 25px 38px -27px #9c4a5c66, inset 0 1px 0 #fff; }
.liquid-page .experience-icon.clay-illustration { border-radius: 18px; border: 1px solid #fffc; box-shadow: inset 0 1px 1px #fff; }
.liquid-page .experience-number { top: 24px; left: 27px; font-size: 9px; color: #625f59; background: #ffffff99; border: 1px solid #fffb; border-radius: 9px; padding: 3px 7px; }
.liquid-page .experience-copy { padding: 22px 12px 12px; }
.liquid-page .experience-copy .eyebrow { color: #7c5868; }
.liquid-page .experience h3 { font-size: 20px; color: #503743; }
.liquid-page .experience-copy>p:last-child { color: #73515c; font-size: 14px; }
.liquid-page .experience-end { padding: 8px 12px 9px; color: #7b5761; }
.liquid-page .experience-end a { color: #a72e38; min-height: 44px; }
.liquid-page .experience-custom { padding: 9px 22px; background: #ffffff36; border-style: solid; border-color: #fff9; box-shadow: inset 0 1px 1px #ffffffb8; }
.liquid-page .experience-custom .experience-icon { color: #7e586e; }
.liquid-page .experience-custom h3 { font-size: 18px; }
.liquid-page .experience-custom .experience-end { padding: 8px 0; }
.liquid-page .caption { color: #7b5664; }
.liquid-page .workflow { position: relative; margin: 0 20px; border: 1px solid #ffffff8c; border-radius: 38px; overflow: hidden; background: radial-gradient(ellipse at 90% 12%, #dd703d99, transparent 56%), radial-gradient(ellipse at 5% 95%, #8b4cb080, transparent 55%), linear-gradient(125deg, #65333cee, #74352fe8); box-shadow: 0 24px 48px -33px #7d344f85, inset 0 1px 1px #ffffff69; }
.liquid-page .workflow .wrap { width: min(1280px, calc(100% - 88px)); }
.liquid-page .workflow-grid { gap: 86px; align-items: center; }
.liquid-page .workflow .eyebrow { color: #f7ddd8; }
.liquid-page .workflow em { color: #ffc4b7; }
.liquid-page .workflow p:not(.eyebrow) { color: #f8e4df; }
.liquid-page .workflow .button.light { background: linear-gradient(150deg, #ffffff40, #ffffff17); border-color: #ffffff80; color: #fff; box-shadow: inset 0 1px 0 #ffffff70, 0 6px 15px -10px #401c2c; }
.liquid-page .journey { display: grid; gap: 10px; }
.liquid-page .journey li { border: 1px solid #ffffff3b; border-radius: 19px; background: linear-gradient(130deg, #ffffff17, #ffffff09); padding: 19px; gap: 18px; box-shadow: inset 0 1px 0 #ffffff2e; }
.liquid-page .journey li>span { color: #fff; background: linear-gradient(145deg, #ffffff40, #ffffff12); border-color: #ffffff5e; box-shadow: 0 5px 12px -7px #401c2c; }
.liquid-page .journey h3 { font-size: 18px; }
.liquid-page .journey li p:not(.eyebrow) { font-size: 13px; }
.liquid-page .case-section p:not(.eyebrow) { color: #73515c; }
.liquid-page .case-note { border: 1px solid #fff; border-radius: 27px; background: linear-gradient(140deg, #ffffffb3, #ffffff59); box-shadow: var(--glass-shadow); }
.liquid-page .case-note dl>div { border-color: #d8a99466; }
.liquid-page .case-note dd { color: #73515c; }
.liquid-page .brief-section { background: radial-gradient(ellipse at 20% 70%, #ff954845, transparent 60%), #f8d3bf4d; border-block: 1px solid #ffffff8c; }
.liquid-page .brief-grid>div>p:not(.eyebrow) { color: #73515c; }
.liquid-page .brief-grid form { border: 1px solid #fffffff0; border-radius: 28px; background: linear-gradient(140deg, #ffffffb8, #ffffff63); box-shadow: var(--glass-shadow); padding: 32px; }
.liquid-page .form-kicker { color: #7d5567; border-color: #d8a99466; }
.liquid-page .brief-grid label { color: #65434e; font-size: 13px; }
.liquid-page input,.liquid-page select,.liquid-page textarea { border-radius: 12px; background: #ffffffb8; border-color: #dfbeb2; box-shadow: inset 0 2px 4px #a4453a10, 0 1px 0 #fff; color: #503743; font-size: 16px; }
.liquid-page input::placeholder,.liquid-page textarea::placeholder { color: #7d626b; }
.liquid-page input:focus,.liquid-page select:focus,.liquid-page textarea:focus { border-color: #b63035; box-shadow: 0 0 0 3px #b6303518; }
.liquid-page .site-footer { color: #765062; }
.liquid-page dialog { background: #fff6eef2; border: 1px solid #fff; border-radius: 26px; box-shadow: 0 30px 100px -30px #74384480, inset 0 1px 0 #fff; }
.liquid-page dialog::backdrop { background: #68323e63; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }

@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
  .liquid-page .site-header,.liquid-page .demo-exhibit,.liquid-page .service-strip,.liquid-page .experience,.liquid-page .case-note,.liquid-page .brief-grid form { backdrop-filter: blur(22px) saturate(135%); -webkit-backdrop-filter: blur(22px) saturate(135%); }
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .liquid-page .experience:not(.experience-custom):hover { transform: translateY(-6px); }
}
@media (max-width:1120px) {
  .liquid-page .hero { gap: 40px; }
  .liquid-page .site-header { padding-inline: 20px; }
  .liquid-page .experience-list { gap: 17px; }
  .liquid-page .experience h3 { font-size: 18px; }
  .liquid-page .workflow-grid { gap: 48px; }
}
@media (max-width:850px) {
  .liquid-page .site-header .brand img.lead-game-logo { width: 160px; }
  .liquid-page .site-header nav { gap: 14px; }
  .liquid-page .demo-exhibit { padding: 17px; border-radius: 26px; }
  .liquid-page .experience { padding: 8px; border-radius: 23px; }
  .liquid-page .experience-copy { padding-inline: 9px; }
  .liquid-page .experience-end { padding-inline: 9px; }
}
@media (max-width:760px) {
  .liquid-page .site-header { width: calc(100% - 28px); margin-top: 12px; min-height: 76px; padding: 12px 15px; border-radius: 21px; gap: 12px; }
  .liquid-page .site-header .brand img.lead-game-logo { width: 152px; }
  .liquid-page .site-header .button { padding: 10px 12px; gap: 16px; border-radius: 12px; }
  .liquid-page .hero { padding-top: 43px; padding-bottom: 42px; gap: 33px; }
  .liquid-page .hero h1 { margin-top: 22px; font-size: clamp(39px,10vw,59px); }
  .liquid-page .hero .intro { font-size: 16px; }
  .liquid-page .hero-offer { font-size: 13px; }
  .liquid-page .hero-foot { font-size: 10px; margin-top: 24px; gap: 7px; }
  .liquid-page .hero-foot span,.liquid-page .hero-foot span+span { padding: 6px 10px; }
  .liquid-page .demo-exhibit { transform: none; padding: 16px; max-width: 470px; border-radius: 27px; }
  .liquid-page .demo-exhibit::before { border-radius: 21px; inset: 5px; }
  .liquid-page .exhibit-heading { padding: 2px 4px 15px; }
  .liquid-page .stage-switch { gap: 3px; padding: 4px; margin-bottom: 12px; }
  .liquid-page .stage-switch button { font-size: 10px; padding: 7px; }
  .liquid-page .exhibit-footer h2 { font-size: 17px; }
  .liquid-page .service-strip { padding: 16px; border-radius: 17px; }
  .liquid-page .service-strip p { font-size: 10px; }
  .liquid-page .chip { font-size: 11px; padding-inline: 13px; }
  .liquid-page .filter-row { gap: 2px; width: 100%; border-radius: 17px; }
  .liquid-page .experience-list { gap: 22px; }
  .liquid-page .experience { padding: 10px; border-radius: 26px; }
  .liquid-page .experience h3 { font-size: 21px; }
  .liquid-page .experience-copy { padding: 21px 12px 10px; }
  .liquid-page .experience-copy .eyebrow { font-size: 9px; }
  .liquid-page .experience-copy>p:last-child { font-size: 14px; }
  .liquid-page .experience-end { padding: 0 12px 7px; font-size: 10px; }
  .liquid-page .experience-end a { font-size: 12px; }
  .liquid-page .experience-custom h3 { font-size: 18px; }
  .liquid-page .experience-custom .experience-copy { padding: 14px 12px 6px; }
  .liquid-page .experience-custom .experience-end { padding: 0 12px 4px; }
  .liquid-page .workflow { margin: 0 10px; border-radius: 27px; }
  .liquid-page .workflow .wrap { width: calc(100% - 34px); }
  .liquid-page .workflow-grid { gap: 32px; }
  .liquid-page .journey li { padding: 17px 14px; gap: 13px; }
  .liquid-page .journey h3 { font-size: 17px; }
  .liquid-page .case-note { border-radius: 24px; }
  .liquid-page .brief-grid form { padding: 25px; border-radius: 25px; }
  .orb-coral { width: 340px; height: 340px; top: 480px; right: -130px; }
  .orb-ice { width: 260px; height: 260px; top: 90px; left: -150px; }
  .glass-orbit { width: 340px; height: 340px; top: 520px; right: 0; border-width: 17px; }
}
@media (max-width:360px) {
  .liquid-page .site-header .brand img.lead-game-logo { width: 136px; }
  .liquid-page .site-header .button { font-size: 9px; gap: 9px; }
  .liquid-page .chip { padding-inline: 10px; font-size: 10px; }
  .liquid-page .hero .actions { gap: 12px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .liquid-page *, .liquid-page *::before, .liquid-page *::after { scroll-behavior: auto; transition: none; animation: none; }
  .liquid-page .demo-exhibit { transform: none; }
  .liquid-page .button:hover,.liquid-page .exhibit-footer a:hover { transform: none; }
  .glass-atmosphere::before,.orb-coral,.orb-ice { transform: none; }
  .glass-orbit { transform: rotate(-25deg) scaleY(.42); }
}
@media (prefers-reduced-transparency:reduce) {
  .liquid-page .site-header,.liquid-page .demo-exhibit,.liquid-page .service-strip,.liquid-page .experience,.liquid-page .case-note,.liquid-page .brief-grid form { background: #fff2e8; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .glass-atmosphere { display: none; }
}

/* Restraint pass (docs/10). Keeps the liquid glass direction but reserves glass for the two layers that
   float over the scene (header, playground, brief form); content cards become solid paper so the page
   has a hierarchy instead of glass on every surface. Remove this block to return to docs/09. */
.glass-atmosphere::before { background: radial-gradient(ellipse at 96% 16%, #d3403a73, transparent 50%), radial-gradient(ellipse at 38% 95%, #ff954866, transparent 56%); }
.glass-orb { opacity: .72; box-shadow: inset -14px -16px 30px #a9394a24, inset 6px 7px 14px #ffffff8c; }
.glass-orbit { border-width: 1px; border-color: #ffffff9e; box-shadow: none; }
.liquid-page .button { background: #b9363e; box-shadow: 0 6px 14px -10px #9c233c99; border-color: transparent; }
.liquid-page .button::before { display: none; }
.liquid-page .button:hover { background: #a42f37; transform: none; box-shadow: 0 6px 14px -10px #9c233c99; }
.liquid-page .hero h1 { text-shadow: none; }
.liquid-page .hero-foot { gap: 8px 22px; font-size: 12px; }
.liquid-page .hero-foot span, .liquid-page .hero-foot span+span { border: 0; background: none; box-shadow: none; padding: 0; color: #5d4448; }
.liquid-page .hero-foot b { color: #35272f; }
.liquid-page .demo-exhibit { transform: none; }
.liquid-page .experience, .liquid-page .case-note { background: #fffaf6; border: 1px solid #ecd3c8; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.liquid-page .experience:hover { border-color: #d9b3a6; box-shadow: none; }
.liquid-page .experience:not(.experience-custom):hover { transform: none; }
.liquid-page .experience-custom { background: transparent; border: 1px dashed #d9b3a6; }
.liquid-page .filter-row { background: #ffffff8c; box-shadow: none; }
.liquid-page .journey li, .liquid-page .journey li>span { background: none; box-shadow: none; }
.liquid-page .journey li { border-width: 0 0 1px; border-radius: 0; padding-inline: 0; }
.liquid-page .journey li:last-child { border-bottom: 0; }
@media (max-width:760px) {
  .liquid-page .experience:not(.experience-custom) { display: grid; grid-template-columns: 118px minmax(0,1fr); gap: 0 4px; padding: 8px; border-radius: 18px; }
  .liquid-page .experience:not(.experience-custom) .experience-icon { grid-column: 1; grid-row: 1/3; width: auto; height: 100%; min-height: 118px; aspect-ratio: auto; }
  .liquid-page .experience:not(.experience-custom) .experience-copy, .liquid-page .experience:not(.experience-custom) .experience-end { min-width: 0; }
  .liquid-page .experience:not(.experience-custom) .experience-icon img { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; }
  .liquid-page .experience:not(.experience-custom) .experience-copy { padding: 8px 8px 4px; }
  .liquid-page .experience:not(.experience-custom) h3 { font-size: 17px; margin: 4px 0 6px; }
  .liquid-page .experience:not(.experience-custom) .experience-copy>p:last-child { font-size: 12px; line-height: 1.7; }
  .liquid-page .experience:not(.experience-custom) .experience-end { grid-column: 2; padding: 0 8px 4px; }
  .liquid-page .experience-list { gap: 12px; }
  .orb-ice { display: none; }
}
.liquid-page .hero-foot span::before { content: none; }