@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-400.ttf?v=10.1.0") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-500.ttf?v=10.1.0") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-600.ttf?v=10.1.0") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-700.ttf?v=10.1.0") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/Manrope-800.ttf?v=10.1.0") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "Material Symbols Rounded";
  src: url("/assets/fonts/MaterialSymbols-400.ttf?v=10.1.0") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}

@font-face {
  font-family: "Nunito";
  src: url("/assets/fonts/Nunito-800.ttf?v=10.3.0") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "Nunito";
  src: url("/assets/fonts/Nunito-900.ttf?v=10.3.0") format("truetype");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

:root {
  --content: 920px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 24px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-width: 0;
  margin: 0;
  overflow-x: clip;
  color: var(--ink);
  background:
    radial-gradient(circle at 11% 48%, rgba(7, 151, 237, 0.08), transparent 26rem),
    radial-gradient(circle at 90% 73%, rgba(255, 189, 24, 0.09), transparent 25rem),
    radial-gradient(circle at 78% 38%, rgba(255, 128, 108, 0.045), transparent 20rem),
    var(--page);
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img {
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
a,
summary {
  -webkit-tap-highlight-color: transparent;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1,
h2,
h3 {
  color: var(--ink);
  line-height: 1.18;
  letter-spacing: -0.035em;
}

h1,
h2 {
  font-family: "Nunito", "Manrope", sans-serif;
  font-weight: 900;
}

h3 {
  font-family: "Nunito", "Manrope", sans-serif;
  font-weight: 800;
}

.material-symbols-rounded {
  display: inline-block;
  font-family: "Material Symbols Rounded" !important;
  font-size: 24px;
  font-style: normal;
  font-weight: 400 !important;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

:focus-visible {
  outline: 3px solid rgba(8, 118, 216, 0.38);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  transform: translateY(-160%);
  border-radius: 10px;
  color: #fff;
  background: var(--ink);
  font-size: 14px;
  font-weight: 800;
  transition: transform 160ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: 590px;
  place-items: center;
  overflow: hidden;
  padding: max(48px, env(safe-area-inset-top)) 24px 88px;
  text-align: center;
  background:
    radial-gradient(circle at 10% 18%, rgba(80, 180, 255, 0.32), transparent 34rem),
    radial-gradient(circle at 88% 9%, rgba(255, 199, 42, 0.34), transparent 30rem),
    radial-gradient(circle at 73% 64%, rgba(255, 128, 108, 0.1), transparent 22rem),
    linear-gradient(180deg, #fbfdff 0%, #edf7ff 100%);
}

.hero::after {
  position: absolute;
  z-index: -2;
  inset: auto 0 0;
  height: 3px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(8, 118, 216, 0.23), rgba(255, 189, 24, 0.22), transparent);
}

.hero-content {
  position: relative;
  z-index: 2;
  width: min(100%, 690px);
  min-width: 0;
  max-width: 100%;
}

.hero-mark {
  display: block;
  width: 154px;
  height: 154px;
  margin: 0 auto 18px;
  object-fit: contain;
  filter: drop-shadow(0 18px 26px rgba(4, 85, 164, 0.2));
}

.hero h1 {
  margin-bottom: 14px;
  font-family: "Nunito", "Manrope", sans-serif;
  font-size: clamp(46px, 5.5vw, 68px);
  font-weight: 900;
  letter-spacing: -0.045em;
}

.hero-lead {
  max-width: 650px;
  margin: 0 auto 27px;
  color: var(--ink-soft);
  font-size: clamp(17px, 1.65vw, 20px);
  line-height: 1.55;
}

.store-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  gap: 16px;
}

.store-button {
  display: inline-flex;
  min-width: 204px;
  min-height: 66px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 21px;
  border: 1px solid transparent;
  border-radius: var(--up-radius-md);
  text-align: left;
  box-shadow: var(--shadow-sm);
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.store-button > .material-symbols-rounded {
  font-size: 31px;
}

.store-button small,
.store-button strong {
  display: block;
  line-height: 1.15;
}

.store-button small {
  margin-bottom: 3px;
  font-size: 12px;
  font-weight: 600;
}

.store-button strong {
  font-size: 16px;
  font-weight: 800;
}

.store-button-primary {
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--blue-dark));
  box-shadow: 0 13px 28px rgba(4, 85, 164, 0.26);
}

.store-button-web {
  border-color: #edaa00;
  color: var(--ink);
  background: linear-gradient(135deg, #ffd452, var(--gold));
  box-shadow: 0 13px 28px rgba(216, 145, 0, 0.23);
}

.store-button-web > .material-symbols-rounded {
  color: var(--blue-dark);
}

.store-button-secondary {
  border-color: #afd4f4;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.9);
}

.store-button-secondary > .material-symbols-rounded {
  color: var(--blue);
}

.store-button-soon {
  cursor: default;
}

.trial-note {
  margin: 19px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}

.cloud {
  position: absolute;
  z-index: -1;
  bottom: -52px;
  width: 310px;
  height: 130px;
  border-radius: 52% 48% 0 0;
  opacity: 0.94;
  background: rgba(255, 255, 255, 0.84);
  box-shadow:
    78px -52px 0 18px rgba(255, 255, 255, 0.9),
    175px -20px 0 7px rgba(255, 255, 255, 0.86);
}

.cloud-left {
  left: -120px;
}

.cloud-right {
  right: -112px;
  transform: scaleX(-1);
}

.hero-star {
  position: absolute;
  z-index: -1;
  width: 12px;
  aspect-ratio: 1;
  clip-path: polygon(50% 0, 61% 36%, 100% 50%, 63% 62%, 50% 100%, 37% 63%, 0 50%, 37% 37%);
  background: var(--gold);
  filter: drop-shadow(0 3px 5px rgba(183, 121, 0, 0.2));
}

.hero-star-one {
  top: 28%;
  left: 12%;
}

.hero-star-two {
  top: 14%;
  right: 8%;
  width: 10px;
}

.hero-star-three {
  right: 12%;
  bottom: 38%;
  width: 9px;
}

.page-content {
  width: min(100%, calc(var(--content) + 48px));
  margin: 0 auto;
  padding: 0 24px;
}

.content-section {
  padding-top: 76px;
}

.section-heading {
  margin-bottom: 25px;
}

.section-heading h2 {
  max-width: 760px;
  margin-bottom: 0;
  font-size: clamp(31px, 4vw, 40px);
  font-weight: 700;
}

.section-heading-inline {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.eyebrow {
  margin-bottom: 8px;
  color: var(--blue-dark);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.feature-card {
  min-height: 204px;
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-sm);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.feature-icon {
  display: grid;
  width: 50px;
  height: 50px;
  margin-bottom: 16px;
  place-items: center;
  border-radius: var(--up-radius-md);
  color: var(--gold-dark);
  background: var(--gold-soft);
  font-size: 27px;
}

.feature-voice .feature-icon {
  color: var(--blue-dark);
  background: var(--blue-soft);
}

.feature-family .feature-icon {
  color: var(--coral-dark);
  background: var(--coral-soft);
}

.feature-limits .feature-icon {
  color: var(--gold-dark);
  background: var(--gold-soft);
}

.feature-offline .feature-icon {
  color: var(--blue);
  background: var(--blue-soft);
}

.feature-shield .feature-icon {
  color: var(--ink);
  background: #eaf1ff;
}

.feature-card h3 {
  margin-bottom: 8px;
  font-size: 18px;
  letter-spacing: -0.02em;
}

.feature-card p {
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.6;
}

.quiet-button {
  display: inline-flex;
  min-height: 46px;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border: 1px solid var(--line);
  border-radius: var(--up-radius-pill);
  color: var(--ink);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 5px 16px rgba(32, 75, 120, 0.05);
  font-size: 13px;
  font-weight: 700;
  transition: color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.quiet-button .material-symbols-rounded {
  font-size: 18px;
}

.story-shelf {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(178px, 1fr));
  gap: 20px;
}

.story-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.story-art {
  position: relative;
  margin: 7px 7px 0;
  overflow: hidden;
  border-radius: var(--up-radius-md);
  background: var(--blue-soft);
}

.story-art img,
.story-placeholder {
  display: grid;
  width: 100%;
  aspect-ratio: 1 / 1;
  place-items: center;
  object-fit: cover;
}

.story-placeholder {
  color: #fff;
  background: linear-gradient(145deg, var(--story-color), #183e75);
  font-family: "Nunito", "Manrope", sans-serif;
  font-size: 46px;
}

.story-badge {
  position: absolute;
  top: 9px;
  left: 9px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 5px 8px;
  border-radius: var(--up-radius-pill);
  color: #fff;
  background: rgba(188, 73, 59, 0.96);
  box-shadow: 0 5px 12px rgba(126, 42, 32, 0.2);
  font-size: 12px;
  font-weight: 800;
}

.story-badge .material-symbols-rounded {
  font-size: 13px;
}

.story-copy {
  padding: 14px 15px 16px;
}

.story-copy h3 {
  display: -webkit-box;
  min-height: 42px;
  margin-bottom: 6px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 15px;
  line-height: 1.35;
  letter-spacing: -0.02em;
}

.story-copy p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.library-empty {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px;
  border: 1px dashed #cbd9e7;
  border-radius: var(--radius-md);
  color: var(--ink-soft);
  background: rgba(255, 255, 255, 0.7);
}

.library-empty > .material-symbols-rounded {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: var(--up-radius-md);
  color: var(--blue);
  background: var(--blue-soft);
}

.library-empty h3 {
  margin-bottom: 3px;
  font-size: 18px;
}

.library-empty p {
  margin-bottom: 0;
  font-size: 14px;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 20px;
}

.price-card {
  position: relative;
  padding: 29px 25px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.price-card-featured {
  border: 2px solid var(--blue);
  box-shadow: 0 18px 38px rgba(8, 118, 216, 0.15);
}

.price-label {
  position: absolute;
  top: 0;
  left: 50%;
  padding: 5px 15px;
  transform: translate(-50%, -50%);
  border: 1px solid #d99600;
  border-radius: var(--up-radius-pill);
  color: #503400;
  background: var(--gold);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.price-card h3 {
  margin-bottom: 9px;
  font-size: 18px;
}

.price-amount {
  margin-bottom: 14px;
  color: var(--ink);
  font-size: 34px;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.1;
}

.price-amount span {
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: normal;
}

.price-card ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.price-card li {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.45;
}

.price-card li .material-symbols-rounded {
  margin-top: 1px;
  color: var(--blue);
  font-size: 16px;
}

.trust-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 16px;
  padding: 12px 16px;
  border: 1px solid #e8eef4;
  border-radius: var(--up-radius-md);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 8px 22px rgba(32, 75, 120, 0.045);
}

.trust-strip span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}

.trust-strip i {
  color: var(--green);
  font-size: 19px;
}

.faq-section {
  padding-bottom: 80px;
}

.faq-list {
  display: grid;
  gap: 9px;
}

.faq-list details {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--up-radius-md);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 7px 18px rgba(32, 75, 120, 0.045);
}

.faq-list summary {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 19px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
  list-style: none;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary .material-symbols-rounded {
  flex: 0 0 auto;
  color: #6b7a90;
  font-size: 20px;
  transition: transform 160ms ease;
}

.faq-list details[open] summary .material-symbols-rounded {
  transform: rotate(180deg);
}

.faq-list details p {
  margin: 0;
  padding: 0 19px 18px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.65;
}

.site-footer {
  padding: 42px 20px max(35px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--line);
  text-align: center;
  background: linear-gradient(180deg, rgba(246, 250, 255, 0.82), #eef6ff);
}

.site-footer img {
  display: block;
  width: 230px;
  height: auto;
  margin: 0 auto 10px;
}

.site-footer p {
  margin-bottom: 7px;
  color: #68788f;
  font-size: 13px;
}

.site-footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  color: var(--blue-dark);
  font-size: 13px;
  font-weight: 600;
}

.site-footer a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding-inline: 4px;
  text-underline-offset: 3px;
}

.site-footer .copyright {
  margin-top: 8px;
  margin-bottom: 0;
  color: #8290a3;
  font-size: 12px;
}

@media (hover: hover) {
  .store-button:not(.store-button-soon):hover,
  .story-card:hover,
  .feature-card:hover,
  .quiet-button:hover {
    transform: translateY(-3px);
  }

  .store-button:not(.store-button-soon):hover,
  .story-card:hover {
    box-shadow: var(--shadow-md);
  }

  .feature-card:hover,
  .quiet-button:hover {
    border-color: #a9cfee;
  }

  .quiet-button:hover {
    color: var(--blue-dark);
  }

  .site-footer a:hover {
    text-decoration: underline;
  }
}

@media (max-width: 760px) {
  .hero {
    min-height: 570px;
    padding-bottom: 72px;
  }

  .hero-mark {
    width: 138px;
    height: 138px;
  }

  .hero h1 {
    font-size: clamp(41px, 9vw, 54px);
  }

  .feature-grid,
  .pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pricing-grid .price-card:last-child {
    grid-column: 1 / -1;
  }

  .trust-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .section-heading-inline {
    align-items: center;
  }

  .story-shelf {
    grid-auto-columns: minmax(168px, 45vw);
    grid-auto-flow: column;
    grid-template-columns: none;
    margin-inline: -24px;
    padding: 3px 24px 20px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-padding-inline: 24px;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
  }

  .story-card {
    scroll-snap-align: start;
  }
}

@media (max-width: 540px) {
  .hero {
    min-height: 580px;
    padding: max(38px, env(safe-area-inset-top)) 18px 76px;
  }

  .hero-mark {
    width: 124px;
    height: 124px;
    margin-bottom: 13px;
  }

  .hero h1 {
    margin-bottom: 10px;
    font-size: clamp(38px, 11vw, 48px);
  }

  .hero-lead {
    font-size: 16px;
  }

  .store-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .store-button-web {
    grid-column: 1 / -1;
  }

  .store-button {
    min-width: 0;
    min-height: 58px;
    gap: 7px;
    padding-inline: 10px;
  }

  .store-button > .material-symbols-rounded {
    font-size: 25px;
  }

  .store-button strong {
    font-size: 14px;
  }

  .store-button small {
    font-size: 12px;
  }

  .trial-note span {
    display: none;
  }

  .trial-note {
    max-width: 240px;
    margin-inline: auto;
  }

  .cloud {
    width: 230px;
    height: 100px;
  }

  .page-content {
    padding-inline: 16px;
  }

  .content-section {
    padding-top: 52px;
  }

  .section-heading {
    margin-bottom: 18px;
  }

  .section-heading h2 {
    font-size: 30px;
  }

  .section-heading-inline {
    display: block;
  }

  .quiet-button {
    margin-top: 14px;
  }

  .feature-grid,
  .pricing-grid {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .feature-card {
    display: grid;
    min-height: 0;
    grid-template-columns: 44px 1fr;
    column-gap: 13px;
    padding: 18px;
  }

  .feature-icon {
    width: 44px;
    height: 44px;
    grid-row: 1 / 3;
    margin-bottom: 0;
  }

  .feature-card h3 {
    align-self: end;
    margin-bottom: 3px;
    font-size: 17px;
  }

  .feature-card p {
    grid-column: 2;
  }

  .story-shelf {
    grid-auto-columns: minmax(162px, 72vw);
    margin-inline: -16px;
    padding-inline: 16px;
    scroll-padding-inline: 16px;
  }

  .pricing-grid .price-card:last-child {
    grid-column: auto;
  }

  .price-card {
    padding: 24px 21px;
  }

  .price-card-featured {
    order: -1;
  }

  .trust-strip {
    grid-template-columns: 1fr 1fr;
    padding-inline: 8px;
  }

  .trust-strip span {
    justify-content: flex-start;
    padding: 5px;
    text-align: left;
  }

  .faq-section {
    padding-bottom: 58px;
  }

  .faq-list summary {
    padding-inline: 15px;
    font-size: 14px;
  }

  .site-footer img {
    width: 205px;
  }
}

/* Un Puișor Soft UI 2026: semantic surfaces shared with the application. */
:root {
  --surface-hover: #fdfeff;
  --error: #b8443f;
  --info: #176fbf;
  --shadow-dark: rgba(103, 122, 145, .2);
  --shadow-light: rgba(255, 255, 255, .92);
  --content: 1180px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --motion-fast: 140ms;
  --motion-standard: 220ms;
  --motion-slow: 360ms;
  --z-header: 20;
}

html { scroll-padding-top: 112px; }

body {
  color: var(--text-primary);
  background:
    radial-gradient(circle at 8% 24%, rgba(39, 137, 200, .08), transparent 28rem),
    radial-gradient(circle at 91% 62%, rgba(245, 185, 26, .08), transparent 28rem),
    var(--background-primary);
}

.site-header {
  position: absolute;
  z-index: 20;
  top: max(18px, env(safe-area-inset-top));
  left: 50%;
  display: grid;
  width: min(calc(100% - 40px), var(--content));
  min-height: 76px;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 28px;
  padding: 9px 11px 9px 17px;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: var(--up-radius-card);
  background: rgba(248, 250, 253, .88);
  box-shadow: var(--soft-sm);
  backdrop-filter: none;
}

.site-brand { display: inline-flex; min-height: 52px; align-items: center; }
.site-brand img { width: 166px; height: 52px; object-fit: contain; }
.site-nav { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 2.5vw, 32px); }
.site-nav a { min-height: 44px; display: inline-flex; align-items: center; color: var(--text-secondary); font-size: 13px; font-weight: 700; }
.header-cta {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  gap: 7px;
  padding: 0 18px;
  border: 1px solid #278ee3;
  border-radius: var(--up-radius-md);
  color: #fff;
  background: linear-gradient(145deg, #248ce4, var(--brand-primary-dark));
  box-shadow: 0 8px 18px rgba(19, 120, 212, .16);
  font-size: 13px;
  font-weight: 800;
}
.header-cta .material-symbols-rounded { font-size: 18px; }

.hero {
  min-height: 780px;
  padding: 126px 24px 92px;
  text-align: left;
  background:
    radial-gradient(circle at 11% 16%, rgba(39, 137, 200, .15), transparent 32rem),
    radial-gradient(circle at 89% 14%, rgba(245, 185, 26, .2), transparent 30rem),
    linear-gradient(155deg, #fafdff 0%, #eef4fa 58%, #fbf6e9 100%);
}
.hero::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  pointer-events: none;
  background: url('/assets/brand/hero-night-texture-v1.webp') center / cover no-repeat;
  opacity: .1;
  mix-blend-mode: multiply;
}
.hero > .hero-star,
.hero > .cloud { z-index: 1; }
.hero-content {
  display: grid;
  width: min(100%, var(--content));
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .72fr);
  align-items: center;
  gap: clamp(46px, 7vw, 96px);
}
.hero-copy { position: relative; z-index: 2; min-width: 0; }
.hero-kicker {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  margin: 0 0 18px;
  padding: 6px 12px;
  border: 1px solid var(--border-soft);
  border-radius: var(--up-radius-pill);
  color: var(--brand-primary-dark);
  background: var(--surface-raised);
  box-shadow: var(--soft-sm);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .025em;
}
.hero-kicker .material-symbols-rounded { color: var(--brand-secondary-dark); font-size: 18px; }
.hero-mark { width: 104px; height: 104px; margin: 0 0 12px; filter: drop-shadow(7px 9px 16px rgba(58, 83, 112, .17)); }
.hero h1 { max-width: 680px; margin-bottom: 17px; font-size: clamp(48px, 5.5vw, 76px); line-height: 1.02; }
.hero-lead { max-width: 650px; margin: 0 0 28px; color: var(--text-secondary); font-size: clamp(17px, 1.55vw, 20px); }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-3); }
.hero-action { display: inline-flex; min-height: 58px; align-items: center; justify-content: center; gap: 9px; padding: 0 21px; border: 1px solid var(--border-soft); border-radius: var(--up-radius-md); font-size: 14px; font-weight: 800; transition: transform var(--motion-fast) ease, box-shadow var(--motion-standard) ease, border-color var(--motion-standard) ease; }
.hero-action-primary { min-width: 220px; color: #112a4d; border-color: rgba(179, 123, 0, .24); background: linear-gradient(145deg, #ffdd72, var(--brand-secondary)); box-shadow: 0 12px 26px rgba(151, 103, 0, .18), var(--soft-sm); }
.hero-action-secondary { color: var(--brand-primary-dark); background: var(--surface-raised); box-shadow: var(--soft-sm); }
.hero-action .material-symbols-rounded { font-size: 22px; }
.store-actions { justify-content: flex-start; gap: 12px; }
.store-actions-platform { margin-top: var(--space-3); }
.store-actions-platform .store-button { min-height: 50px; box-shadow: none; }
.store-button { min-width: 188px; min-height: 62px; border-color: var(--border-soft); border-radius: var(--up-radius-md); box-shadow: var(--soft-sm); }
.store-button-web { color: var(--text-primary); background: linear-gradient(145deg, #ffdd72, var(--brand-secondary)); }
.store-button-primary { border-color: #278ee3; background: linear-gradient(145deg, #248ce4, var(--brand-primary-dark)); }
.store-button-secondary { color: var(--text-primary); background: var(--surface-raised); }
.trial-note { color: var(--text-muted); }

.app-preview {
  position: relative;
  width: min(100%, 380px);
  min-height: 610px;
  justify-self: center;
  overflow: hidden;
  padding: 28px 24px 23px;
  border: 9px solid #0a1b30;
  border-radius: 46px;
  color: #f8f4e9;
  background: linear-gradient(155deg, #123b6d 0%, #092b60 44%, #07182e 100%);
  box-shadow: 22px 28px 58px rgba(7, 21, 38, .27), -12px -12px 32px rgba(255, 255, 255, .72), inset 0 0 0 1px rgba(255, 255, 255, .16);
  transform: rotate(1.5deg);
}
.app-preview::after { position: absolute; inset: 0; pointer-events: none; content: ""; background: linear-gradient(145deg, rgba(255,255,255,.1), transparent 24%, transparent 76%, rgba(0,0,0,.13)); }
.preview-speaker { width: 92px; height: 18px; margin: -20px auto 22px; border-radius: 0 0 13px 13px; background: #061526; }
.preview-topbar { display: flex; align-items: center; justify-content: space-between; color: #d9e3f0; font-size: 12px; font-weight: 700; }
.preview-topbar > span { display: flex; align-items: center; gap: 7px; }
.brand-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--brand-secondary); box-shadow: 0 0 0 4px rgba(255, 208, 90, .13); }
.preview-heading { display: grid; gap: 3px; margin: 24px 0 17px; }
.preview-heading small { color: #9fd0f7; font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.preview-heading strong { overflow: hidden; font-family: "Nunito", sans-serif; font-size: 23px; line-height: 1.18; text-overflow: ellipsis; white-space: nowrap; }
.preview-cover { display: grid; width: 100%; aspect-ratio: 1; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.17); border-radius: var(--up-radius-xl); background-color: #173d6e; background-position: center; background-size: cover; box-shadow: 12px 16px 30px rgba(1, 8, 20, .33), -7px -7px 18px rgba(76, 125, 178, .17); }
.preview-cover img { width: 126px; height: 126px; object-fit: contain; }
.preview-progress { height: 8px; margin-top: 25px; overflow: hidden; border-radius: var(--up-radius-pill); background: #08182b; box-shadow: inset 3px 3px 7px #020a14, inset -2px -2px 6px #173d63; }
.preview-progress i { display: block; width: 38%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #67b4f7, #ffd05a); }
.preview-time { display: flex; justify-content: space-between; margin-top: 6px; color: #aebed2; font-size: 12px; }
.preview-controls { display: flex; align-items: center; justify-content: center; gap: 28px; margin-top: 15px; }
.preview-controls span { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid #263e5b; border-radius: var(--up-radius-md); color: #d9e3f0; background: #10243c; box-shadow: 5px 6px 13px #030b16, -3px -3px 9px #173a60; }
.preview-controls b { display: grid; width: 62px; height: 62px; place-items: center; border-radius: var(--up-radius-lg); color: #092b60; background: linear-gradient(145deg, #ffe28a, #f5b91a); box-shadow: 7px 9px 18px #030b16, -3px -3px 10px #1b4c7a; font-size: 28px; }
.preview-soft-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 18px; }
.preview-soft-row span { display: flex; min-height: 45px; align-items: center; justify-content: center; gap: 7px; border: 1px solid #263e5b; border-radius: var(--up-radius-md); color: #d9e3f0; background: rgba(16, 36, 60, .75); font-size: 12px; font-weight: 700; }
.preview-soft-row .material-symbols-rounded { color: #ffd05a; font-size: 17px; }

.page-content { width: min(100%, calc(var(--content) + 48px)); }
.content-section { padding-top: 96px; }
.section-heading h2 { font-weight: 900; }
.feature-grid { gap: 22px; }
.feature-card,
.story-card,
.price-card,
.faq-list details,
.library-empty { border-color: var(--border-soft); background: var(--surface-raised); box-shadow: var(--soft-sm); }
.feature-card { border-radius: var(--up-radius-card); }
.feature-icon { background: var(--surface-inset); box-shadow: var(--inset-sm); }
.story-card { border-radius: var(--up-radius-card); }
.story-art { border-radius: var(--up-radius-md); }
.price-card { border-radius: var(--up-radius-card); }
.price-card-featured { border-color: rgba(245,185,26,.54); background: linear-gradient(155deg, var(--surface-raised), var(--brand-secondary-soft)); box-shadow: var(--soft-md); }
.faq-list details { box-shadow: none; }
.faq-list details[open] { box-shadow: var(--inset-sm); }

.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.steps-grid li { display: flex; min-height: 148px; gap: 16px; padding: 22px; border-top: 1px solid var(--border-soft); }
.steps-grid li > span { flex: 0 0 auto; color: var(--brand-primary); font-family: "Nunito", sans-serif; font-size: 18px; font-weight: 900; }
.steps-grid h3 { margin: 0 0 7px; font-size: 19px; }
.steps-grid p { margin: 0; color: var(--text-muted); font-size: 14px; }

.characters-section { display: grid; grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr); align-items: center; gap: clamp(40px, 8vw, 104px); }
.characters-copy h2,
.parent-copy h2 { margin-bottom: 14px; font-size: clamp(34px, 4vw, 46px); }
.characters-copy > p:not(.eyebrow),
.parent-copy > p:not(.eyebrow) { color: var(--text-secondary); }
.character-cloud { position: relative; display: grid; min-height: 410px; place-items: center; border: 1px solid var(--border-soft); border-radius: var(--up-radius-xxl); background: radial-gradient(circle at 50% 42%, var(--brand-primary-soft), transparent 58%), var(--surface); box-shadow: var(--inset-md); }
.character-cloud::before,
.character-cloud::after { position: absolute; width: 120px; height: 42px; border-radius: var(--up-radius-pill); content: ""; background: var(--surface-raised); box-shadow: var(--soft-sm); }
.character-cloud::before { top: 48px; left: 38px; }
.character-cloud::after { right: 24px; bottom: 78px; width: 88px; }
.character { position: relative; z-index: 2; margin: 0; text-align: center; }
.character img { width: 220px; filter: drop-shadow(12px 18px 22px rgba(58, 83, 112, .18)); }
.character figcaption { margin-top: 4px; font-family: "Nunito", sans-serif; font-size: 18px; font-weight: 900; }
.character-note { position: absolute; z-index: 3; right: 22px; bottom: 20px; display: grid; min-width: 230px; grid-template-columns: 38px 1fr; gap: 1px 10px; padding: 13px; border: 1px solid var(--border-soft); border-radius: var(--up-radius-lg); background: var(--surface-raised); box-shadow: var(--soft-sm); }
.character-note > span { grid-row: 1 / 3; display: grid; width: 38px; height: 38px; place-items: center; border-radius: var(--up-radius-sm); color: var(--coral-dark); background: var(--coral-soft); }
.character-note strong { font-size: 12px; }
.character-note small { color: var(--text-muted); font-size: 12px; }

.parent-panel { display: grid; grid-template-columns: 1fr minmax(360px, .8fr); align-items: center; gap: clamp(36px, 7vw, 90px); padding: clamp(28px, 5vw, 58px); border: 1px solid #173f6c; border-radius: var(--up-radius-xxl); color: #d9e3f0; background: linear-gradient(145deg, #123b6d, #07182e); box-shadow: var(--soft-lg); }
.parent-panel h2 { color: #f8f4e9; }
.parent-panel .eyebrow { color: #ffd05a; }
.parent-copy > p:not(.eyebrow) { color: #c7d4e4; }
.parent-settings { display: grid; gap: 12px; }
.parent-settings > div { display: grid; min-height: 72px; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #263e5b; border-radius: var(--up-radius-lg); background: #10243c; box-shadow: 6px 7px 16px #020a14, -3px -3px 10px #173b61; }
.parent-settings > div > span { display: grid; width: 44px; height: 44px; place-items: center; border-radius: var(--up-radius-md); color: #91c9f8; background: #08182b; box-shadow: inset 2px 2px 5px #020a14, inset -2px -2px 5px #213a58; }
.parent-settings p { display: grid; gap: 2px; margin: 0; }
.parent-settings small { color: #aebed2; }
.parent-settings b { color: #70d0a4; }
.parent-settings i { position: relative; width: 44px; height: 25px; border-radius: var(--up-radius-pill); background: #173d63; box-shadow: inset 2px 2px 5px #020a14; }
.parent-settings i::after { position: absolute; top: 4px; right: 4px; width: 17px; height: 17px; border-radius: 50%; content: ""; background: #67b4f7; box-shadow: 2px 2px 5px #020a14; }

.testimonial-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.testimonial-grid blockquote { margin: 0; padding: 28px; border: 1px solid var(--border-soft); border-radius: var(--up-radius-card); background: var(--surface-raised); box-shadow: var(--soft-sm); }
.testimonial-grid blockquote > p { margin-bottom: 24px; color: var(--text-secondary); font-size: 17px; line-height: 1.7; }
.testimonial-grid footer { display: flex; align-items: center; gap: 12px; }
.testimonial-grid footer > span { display: grid; width: 46px; height: 46px; place-items: center; border-radius: var(--up-radius-md); color: var(--brand-primary-dark); background: var(--brand-primary-soft); font-size: 12px; font-weight: 800; box-shadow: var(--inset-sm); }
.testimonial-grid footer div { display: grid; }
.testimonial-grid footer small { color: var(--text-muted); }

.site-footer { margin-top: 92px; background: var(--background-secondary); }

@media (hover: hover) {
  .site-nav a:hover { color: var(--brand-primary-dark); }
  .header-cta:hover,
  .hero-action:hover,
  .store-button:not(.store-button-soon):hover { transform: translateY(-2px); }
  .feature-card:hover,
  .story-card:hover,
  .price-card:hover,
  .testimonial-grid blockquote:hover { border-color: var(--border-strong); box-shadow: var(--soft-md); }
}

@media (max-width: 1020px) {
  .site-header { grid-template-columns: auto 1fr; }
  .site-nav { display: none; }
  .header-cta { justify-self: end; }
  .hero { min-height: 730px; padding-top: 132px; }
  .hero-content { grid-template-columns: minmax(0, 1fr) 320px; gap: 34px; }
  .app-preview { min-height: 548px; padding: 25px 20px 20px; border-width: 8px; }
  .preview-heading { margin-top: 16px; }
  .characters-section { gap: 40px; }
}

@media (max-width: 760px) {
  html { scroll-padding-top: 90px; }
  .site-header { position: absolute; top: max(10px, env(safe-area-inset-top)); width: calc(100% - 24px); min-height: 66px; gap: 10px; padding: 6px 7px 6px 12px; border-radius: var(--up-radius-lg); }
  .site-brand img { width: 132px; height: 48px; }
  .header-cta { min-height: 48px; padding-inline: 13px; white-space: nowrap; }
  .header-cta .material-symbols-rounded { display: none; }
  .hero { min-height: 0; padding: 112px 20px 78px; text-align: center; }
  .hero-content { width: 100%; min-width: 0; max-width: 100%; grid-template-columns: minmax(0, 1fr); gap: 44px; }
  .hero-kicker { margin-inline: auto; }
  .hero-mark { margin-inline: auto; }
  .hero h1 { max-width: 620px; margin-inline: auto; font-size: clamp(40px, 11vw, 52px); line-height: 1.04; }
  .hero-lead { margin-inline: auto; }
  .hero-actions { width: 100%; max-width: 540px; margin-inline: auto; }
  .hero-action { flex: 1 1 210px; }
  .store-actions { display: grid; width: 100%; max-width: 540px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); justify-content: center; gap: 10px; margin-inline: auto; }
  .store-button { width: 100%; min-width: 0; min-height: 58px; gap: 7px; padding-inline: 10px; }
  .store-button > .material-symbols-rounded { flex: 0 0 auto; font-size: 25px; }
  .store-button > span:last-child { min-width: 0; }
  .store-button strong { font-size: 14px; }
  .store-button small { font-size: 12px; }
  .app-preview { width: min(88vw, 365px); min-height: 590px; transform: none; }
  .steps-grid { grid-template-columns: 1fr; gap: 0; }
  .steps-grid li { min-height: 0; padding-inline: 5px; }
  .characters-section,
  .parent-panel { grid-template-columns: 1fr; }
  .character-cloud { min-height: 360px; }
  .parent-panel { gap: 28px; }
}

@media (max-width: 540px) {
  .site-header { width: calc(100% - 20px); }
  .header-cta { font-size: 12px; }
  .hero { padding-inline: 16px; }
  .hero-kicker { font-size: 12px; }
  .hero-mark { width: 94px; height: 94px; }
  .hero h1 { font-size: clamp(36px, 10.8vw, 44px); }
  .hero-lead { font-size: 15px; line-height: 1.52; }
  .app-preview { width: min(92vw, 350px); min-height: 548px; padding-inline: 18px; border-radius: var(--up-radius-xxl); }
  .preview-heading strong { font-size: 20px; }
  .preview-controls { gap: 20px; }
  .content-section { padding-top: 68px; }
  .character-cloud { min-height: 330px; }
  .character img { width: 180px; }
  .character-note { right: 12px; left: 12px; min-width: 0; }
  .parent-panel { margin-inline: -4px; padding: 25px 18px; border-radius: var(--up-radius-xl); }
  .testimonial-grid { grid-template-columns: 1fr; gap: 14px; }
  .testimonial-grid blockquote { padding: 22px; }
}

@media (max-width: 360px) {
  .site-brand img { width: 116px; }
  .header-cta { min-height: 44px; padding-inline: 10px; }
  .hero { padding-inline: 14px; }
  .hero h1 { font-size: 35px; }
  .hero-actions { display: grid; grid-template-columns: 1fr; }
  .store-actions { grid-template-columns: 1fr; }
}

@media (prefers-color-scheme: dark) {
  :root {
    --surface-hover: #1e3a5f;
    --shadow-dark: rgba(0, 4, 10, .58);
    --shadow-light: rgba(36, 65, 95, .72);
  }
  body { background: radial-gradient(circle at 12% 20%, rgba(144,202,249,.08), transparent 28rem), radial-gradient(circle at 88% 64%, rgba(255,209,102,.055), transparent 26rem), var(--background-primary); }
  .site-header { border-color: var(--border-soft); background: rgba(19, 34, 68, .9); }
  .site-brand img,
  .site-footer img { filter: drop-shadow(0 5px 12px rgba(0,0,0,.18)) brightness(1.08); }
  .hero { background: radial-gradient(circle at 12% 18%, rgba(144,202,249,.1), transparent 32rem), radial-gradient(circle at 88% 12%, rgba(255,209,102,.09), transparent 30rem), linear-gradient(155deg, #132a50, #0e1530 58%, #171b2c); }
  .hero::before { opacity: .48; mix-blend-mode: soft-light; }
  .cloud { background: rgba(23, 42, 74, .62); box-shadow: 78px -52px 0 18px rgba(23,42,74,.72), 175px -20px 0 7px rgba(23,42,74,.66); }
  .store-button-web { color: #112a4d; }
  .quiet-button { color: var(--text-primary); background: var(--surface-raised); border-color: var(--border-strong); box-shadow: var(--soft-sm); }
  .story-placeholder { color: #fff; }
  .story-badge { color: #112a4d; }
  .price-card-featured .price-label { color: #112a4d; }
  .price-card-featured { background: linear-gradient(155deg, var(--surface-raised), #332c1c); }
  .trust-strip { border-color: var(--border-soft); background: var(--surface-inset); box-shadow: var(--inset-sm); }
  .faq-list details[open] { background: var(--surface-inset); }
  .site-footer p,
  .site-footer .copyright { color: var(--text-muted); }
}

@media (forced-colors: active) {
  .app-preview,
  .parent-panel,
  .feature-card,
  .story-card,
  .price-card,
  .testimonial-grid blockquote { border: 1px solid CanvasText; box-shadow: none; }
  :focus-visible { outline: 3px solid Highlight; }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media print {
  .skip-link,
  .store-actions,
  .quiet-button {
    display: none !important;
  }

  body,
  .hero,
  .site-footer {
    background: #fff !important;
  }

  .hero {
    min-height: auto;
    padding-block: 30px;
  }

  .content-section {
    break-inside: avoid;
  }
}

/* Final product pass — storytelling surfaces inspired by the warmth of a picture book. */
.modes-heading{max-width:820px;margin-inline:auto;text-align:center}.modes-heading>p:last-child{max-width:680px;margin:14px auto 0;color:var(--text-secondary);font-size:16px;line-height:1.7}.story-modes-layout{display:grid;grid-template-columns:minmax(0,.86fr) minmax(440px,1.14fr);align-items:center;gap:54px;margin-top:44px}.story-mode-list{display:grid;gap:12px}.story-mode{display:grid;grid-template-columns:54px minmax(0,1fr);gap:14px;padding:20px;border:1px solid var(--border-soft);border-radius:var(--up-radius-card);background:var(--surface-raised);box-shadow:var(--soft-sm)}.story-mode>span{display:grid;width:54px;height:54px;place-items:center;border-radius:var(--up-radius-lg);color:var(--brand-primary-dark);background:var(--brand-primary-soft);font-size:27px;box-shadow:var(--inset-sm)}.story-mode small{color:var(--brand-primary-dark);font-size:12px;font-weight:900;letter-spacing:.13em}.story-mode h3{margin:4px 0 6px;font-size:18px}.story-mode p{margin:0;color:var(--text-secondary);font-size:13px;line-height:1.65}.story-mode.is-primary{border-color:rgba(204,153,24,.32);background:linear-gradient(145deg,#fffdf7,#fff5d6)}.story-mode.is-primary>span{color:#654300;background:var(--brand-secondary)}.story-mode.is-primary h3{color:#16365e}.story-mode.is-primary p{color:#53647a}.story-mode.is-primary small{color:#245d91}.story-mode.is-family{border-color:rgba(110,89,201,.26);background:linear-gradient(145deg,#fcfbff,#eee9ff)}.story-mode.is-family>span{color:#6550c9;background:#ebe5ff}.story-mode.is-family h3{color:#35285f}.story-mode.is-family p{color:#625978}.story-mode.is-family small{color:#6550c9}.modes-device-stage{position:relative;min-height:570px;border:1px solid rgba(154,184,219,.55);border-radius:42px;background:radial-gradient(circle at 72% 17%,rgba(255,209,102,.34),transparent 25%),linear-gradient(150deg,#eaf5ff,#f7faff 48%,#fff6df);box-shadow:var(--soft-lg);overflow:hidden}.modes-device-stage::before{content:"";position:absolute;inset:auto -80px -130px 34%;height:310px;border-radius:50%;background:#cbe4ff;filter:blur(2px);opacity:.72}.modes-device{position:absolute;width:252px;min-height:482px;padding:18px;border:8px solid #11294b;border-radius:var(--up-radius-xxl);background:#fafdff;box-shadow:14px 23px 48px rgba(13,48,87,.23);overflow:hidden}.modes-device-a{left:46px;top:42px;z-index:2;color:#f8fbff;background:linear-gradient(165deg,#0e3971,#07162d)}.modes-device-b{right:38px;top:83px;transform:rotate(3deg);color:#3d2d21;background:#fff8e9}.modes-device-top,.modes-reader-top{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:800}.modes-cover{height:210px;margin:20px 0 15px;border-radius:var(--up-radius-card);background:#1e6cb6 url('/assets/brand/logo-mark-ui.webp') center/120px no-repeat;box-shadow:0 15px 28px rgba(0,0,0,.24)}.modes-device-a>small{color:#8fcaff;font-size:12px;font-weight:900;letter-spacing:.12em}.modes-device-a>strong{display:block;min-height:46px;margin-top:5px;font-size:17px;line-height:1.3}.modes-progress{height:5px;margin:15px 0 9px;border-radius:var(--up-radius-pill);background:#ffffff24}.modes-progress i{display:block;width:42%;height:100%;border-radius:inherit;background:var(--brand-secondary)}.modes-device-a>button{display:grid;width:54px;height:54px;margin:18px auto 0;place-items:center;border:0;border-radius:var(--up-radius-lg);color:#18345d;background:var(--brand-secondary);font-size:28px}.modes-reader-top{color:#796957}.modes-reader-top>span{color:#9b6313}.modes-reader-top b{font-size:12px}.modes-device-b h3{margin:42px 4px 22px;font-family:var(--font-display);font-size:25px;line-height:1.16;text-align:center}.modes-device-b>p{margin:0 5px;color:#49392c;font-family:Georgia,serif;font-size:15px;line-height:1.75}.reader-lines{display:grid;gap:10px;margin:24px 5px}.reader-lines i{height:7px;border-radius:var(--up-radius-pill);background:#d8c8ad}.reader-lines i:nth-child(2){width:88%}.reader-lines i:nth-child(3){width:94%}.reader-lines i:nth-child(4){width:64%}.reader-bookmark{position:absolute;right:20px;bottom:24px;color:#ac6c18}.bedtime-story-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);align-items:center;gap:54px;padding:52px!important;border:1px solid rgba(123,160,204,.24);border-radius:var(--up-radius-xxl);background:radial-gradient(circle at 84% 16%,rgba(255,209,102,.18),transparent 25%),linear-gradient(145deg,#102c57,#07152c);box-shadow:var(--soft-lg);overflow:hidden}.bedtime-story-copy h2{max-width:650px;color:#fff8e8}.bedtime-story-copy>p:not(.eyebrow){max-width:620px;color:#c1d2e8;font-size:16px;line-height:1.7}.bedtime-story-copy .eyebrow{color:#ffd66d}.bedtime-flow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:25px 0}.bedtime-flow span{display:flex;align-items:center;gap:8px;color:#eaf3ff;font-size:12px;font-weight:800}.bedtime-flow b{display:grid;width:30px;height:30px;place-items:center;border-radius:var(--up-radius-sm);color:#18345d;background:#ffd166}.bedtime-flow>i{color:#7895b8;font-size:18px}.bedtime-story-section .quiet-button{color:#ffd66d}.bedtime-orbit{position:relative;display:grid;min-height:350px;place-items:center}.bedtime-orbit>img{position:relative;z-index:2;width:190px;height:190px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.32))}.bedtime-moon{position:absolute;width:282px;height:282px;border:1px solid #ffffff16;border-radius:50%;box-shadow:0 0 0 42px #ffffff08,0 0 0 84px #ffffff05}.sound-pill{position:absolute;z-index:3;display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid #ffffff20;border-radius:var(--up-radius-pill);color:#e8f3ff;background:#183861dd;font-size:12px;font-weight:800;box-shadow:0 10px 25px rgba(0,0,0,.2)}.sound-pill i{color:#ffd66d;font-size:17px}.sound-rain{top:34px;left:5px}.sound-waves{right:-8px;top:117px}.sound-timer{left:32px;bottom:23px}.family-voice-section{display:grid;grid-template-columns:minmax(380px,.9fr) minmax(0,1fr);align-items:center;gap:52px}.family-voice-visual{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;min-height:270px;padding:38px;border:1px solid rgba(156,136,225,.28);border-radius:var(--up-radius-xxl);background:radial-gradient(circle at 10% 15%,#fff0bb,transparent 38%),linear-gradient(145deg,#f7f4ff,#e9f4ff);box-shadow:var(--soft-lg)}.voice-avatar{display:grid;width:72px;height:72px;place-items:center;border-radius:var(--up-radius-card);color:#fff;background:linear-gradient(145deg,#8d79e8,#5c48b4);font-family:var(--font-display);font-size:28px;box-shadow:0 13px 26px rgba(87,65,174,.23)}.voice-wave{display:flex;height:70px;align-items:center;justify-content:center;gap:4px}.voice-wave i{width:4px;height:var(--h);border-radius:var(--up-radius-pill);background:linear-gradient(#6c56ca,#2794e6)}.family-voice-visual>button{display:grid;width:54px;height:54px;place-items:center;border:0;border-radius:var(--up-radius-lg);color:#172e50;background:var(--brand-secondary);font-size:28px;box-shadow:var(--soft-sm)}.family-voice-visual>small{grid-column:1/-1;color:#5c6f87;font-weight:800;text-align:center}.family-voice-copy h2{max-width:670px}.family-voice-copy>p:not(.eyebrow){color:var(--text-secondary);font-size:16px;line-height:1.7}.family-voice-copy ul{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none}.family-voice-copy li{display:flex;align-items:center;gap:9px;color:var(--text-primary);font-size:13px;font-weight:800}.family-voice-copy li span{color:var(--brand-primary);font-size:20px}.daily-fact{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:22px;padding:28px 32px!important;border:1px solid rgba(201,152,33,.28);border-radius:var(--up-radius-xl);background:linear-gradient(145deg,#fff9e8,#fff2c7);box-shadow:var(--soft-sm)}.daily-fact-icon{display:grid;width:62px;height:62px;place-items:center;border-radius:var(--up-radius-lg);color:#734d02;background:#ffd166;font-size:30px;box-shadow:var(--inset-sm)}.daily-fact h2{margin:2px 0 4px;color:#4c370f;font-size:24px}.daily-fact .eyebrow{color:#76530a}.daily-fact p{margin:0;color:#725f3d;line-height:1.6}.daily-fact-count{padding:8px 12px;border-radius:var(--up-radius-pill);color:#72500b;background:#fff;font-size:12px;font-weight:900;white-space:nowrap}

@media(max-width:980px){.story-modes-layout{grid-template-columns:1fr}.modes-device-stage{min-height:560px}.bedtime-story-section{grid-template-columns:1fr;padding:36px!important}.family-voice-section{grid-template-columns:1fr}.family-voice-visual{order:2}}
@media(max-width:640px){.story-modes-layout{gap:28px;margin-top:28px}.story-mode{padding:16px;grid-template-columns:46px 1fr}.story-mode>span{width:46px;height:46px;border-radius:var(--up-radius-md)}.modes-device-stage{min-height:465px;margin-inline:-8px;border-radius:var(--up-radius-xl)}.modes-device{width:205px;min-height:400px;padding:14px;border-width:6px;border-radius:29px}.modes-device-a{left:12px;top:28px}.modes-device-b{right:5px;top:58px}.modes-cover{height:166px;margin:15px 0 12px}.modes-device-a>strong{font-size:14px}.modes-device-a>button{width:46px;height:46px;margin-top:12px}.modes-device-b h3{margin:31px 2px 15px;font-size:20px}.modes-device-b>p{font-size:12px}.reader-lines{margin-top:16px}.bedtime-story-section{margin-inline:-4px;padding:26px 18px!important;border-radius:var(--up-radius-xl)}.bedtime-flow{align-items:flex-start}.bedtime-flow>i{display:none}.bedtime-flow span{width:100%}.bedtime-orbit{min-height:300px}.sound-rain{left:0}.sound-waves{right:0}.family-voice-visual{grid-template-columns:auto 1fr;padding:24px 16px;gap:12px}.family-voice-visual>button{grid-column:1/-1;justify-self:center}.voice-avatar{width:58px;height:58px;border-radius:var(--up-radius-lg)}.daily-fact{grid-template-columns:auto 1fr;padding:22px 18px!important}.daily-fact-count{grid-column:1/-1;justify-self:start}.daily-fact-icon{width:52px;height:52px;border-radius:var(--up-radius-md)}}

/* ========================================================================== 
   Major landing polish 16.0 — cinematic hierarchy, editorial rhythm, calm CTA
   ========================================================================== */
:root{
  --content:1180px;
  --landing-gutter:clamp(18px,3vw,34px);
  --section-space:clamp(96px,9vw,142px);
  --surface-hover:#1e3a5f;
  --shadow-dark:rgba(0,4,10,.58);
  --shadow-light:rgba(36,65,95,.72);
}

body{background:radial-gradient(circle at 8% 18%,rgba(79,156,228,.075),transparent 30rem),radial-gradient(circle at 92% 64%,rgba(255,209,102,.05),transparent 28rem),var(--background-primary)}
.page-content{width:min(100%,calc(var(--content) + (var(--landing-gutter) * 2)));padding-inline:var(--landing-gutter)}
.content-section{padding-top:var(--section-space);content-visibility:auto;contain-intrinsic-size:1px 760px}
.section-heading{margin-bottom:clamp(30px,4vw,48px)}
.section-heading h2{max-width:850px;font-size:clamp(38px,4.35vw,56px);font-weight:900;line-height:1.06;letter-spacing:-.045em}
.section-intro{max-width:690px;margin:18px 0 0;color:var(--text-secondary);font-size:clamp(15px,1.35vw,18px);line-height:1.72}
.eyebrow{margin-bottom:11px;color:var(--brand-primary);font-size:12px;font-weight:900;letter-spacing:.17em}

.site-header{position:fixed;top:max(14px,env(safe-area-inset-top));width:min(calc(100% - 32px),var(--content));min-height:70px;gap:22px;padding:8px 9px 8px 16px;border-color:rgba(157,188,222,.22);background:rgba(13,30,58,.78);box-shadow:0 10px 36px rgba(2,10,24,.12);backdrop-filter:none;transition:top .25s ease,min-height .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}
.site-header.is-scrolled{top:max(8px,env(safe-area-inset-top));min-height:62px;border-color:rgba(157,188,222,.32);background:rgba(10,25,49,.94);box-shadow:0 14px 38px rgba(1,8,20,.28)}
.site-brand img{width:158px;height:50px}
.site-nav{gap:clamp(13px,1.7vw,24px)}
.site-nav a{position:relative;min-height:42px;color:#becde0;font-size:12px;transition:color .18s ease}
.site-nav a::after{position:absolute;right:50%;bottom:4px;left:50%;height:2px;border-radius:var(--up-radius-pill);content:"";background:var(--brand-secondary);transition:right .2s ease,left .2s ease}
.site-nav a:hover,.site-nav a.is-active,.site-nav a[aria-current="location"]{color:#fff8e8}
.site-nav a:hover::after,.site-nav a.is-active::after,.site-nav a[aria-current="location"]::after{right:8px;left:8px}
.site-nav-app-link{display:none!important}
.nav-toggle{display:none;width:46px;height:46px;place-items:center;border:1px solid var(--border-soft);border-radius:var(--up-radius-md);color:var(--text-primary);background:var(--surface-raised)}
.nav-toggle .material-symbols-rounded{font-size:24px}.nav-toggle-close{display:none}.nav-toggle[aria-expanded="true"] .nav-toggle-open{display:none}.nav-toggle[aria-expanded="true"] .nav-toggle-close{display:inline-block}
.header-cta{min-height:48px;padding-inline:17px;border-radius:var(--up-radius-md);background:linear-gradient(145deg,#2998ec,#0870cc);box-shadow:0 9px 20px rgba(5,92,178,.2);transition:transform .18s ease,box-shadow .18s ease}

.hero{min-height:850px;padding:130px var(--landing-gutter) 104px;background:radial-gradient(circle at 18% 20%,rgba(62,139,215,.16),transparent 28rem),radial-gradient(circle at 82% 26%,rgba(255,209,102,.095),transparent 25rem),linear-gradient(150deg,#122b50 0%,#0d1833 50%,#121a31 100%)}
.hero::before{opacity:.32;mix-blend-mode:soft-light}
.hero::after{height:1px;background:linear-gradient(90deg,transparent,rgba(103,180,247,.34),rgba(255,209,102,.3),transparent)}
.hero-content{width:min(100%,var(--content));grid-template-columns:minmax(0,1.08fr) minmax(340px,.82fr);gap:clamp(54px,7vw,96px)}
.hero-copy{max-width:680px}
.hero-kicker{margin-bottom:22px;padding:7px 13px;border-color:rgba(150,192,232,.22);color:#b8deff;background:rgba(20,49,87,.66);box-shadow:none}
.hero-mark{width:110px;height:110px;margin-bottom:16px;filter:drop-shadow(0 14px 22px rgba(0,0,0,.2))}
.hero h1{max-width:690px;margin-bottom:22px;color:#fff8e8;font-size:clamp(56px,5.8vw,78px);line-height:.98;letter-spacing:-.055em;text-wrap:balance}
.hero-lead{max-width:620px;margin-bottom:30px;color:#cbd8e8;font-size:clamp(17px,1.55vw,20px);line-height:1.68;text-wrap:pretty}
.hero-actions{gap:10px}
.hero-action{min-height:62px;border-radius:var(--up-radius-md)}
.hero-action-primary{min-width:242px;padding-inline:25px;border-color:#f1bd38;background:linear-gradient(145deg,#ffe17e,#f8bd2e);box-shadow:0 12px 28px rgba(190,131,0,.2)}
.hero-action-secondary{min-width:158px;border-color:rgba(142,178,216,.22);color:#d3e4f4;background:rgba(20,47,82,.56);box-shadow:none}
.hero-trust{display:flex;flex-wrap:wrap;gap:8px 16px;margin:20px 0 0;padding:0;list-style:none}
.hero-trust li{display:inline-flex;align-items:center;gap:6px;color:#aebed2;font-size:12px;font-weight:800;white-space:nowrap}
.hero-trust .material-symbols-rounded{color:#ffd166;font-size:16px}
.store-availability{margin-top:23px;padding-top:17px;border-top:1px solid var(--up-border-soft)}
.store-availability>p{display:flex;align-items:center;gap:7px;margin:0 0 12px;color:var(--up-text-secondary);font-size:13px;font-weight:600;line-height:1.5}
.store-availability>p .material-symbols-rounded{font-size:16px}
.store-actions-platform{display:flex;flex-wrap:wrap;margin:0;gap:12px}
.store-actions-platform .store-button{position:relative;flex:0 1 220px;width:220px;max-width:100%;min-width:0;min-height:72px;justify-content:flex-start;gap:12px;padding:12px 18px;border:1px solid #596078;border-radius:var(--up-radius-md);color:var(--up-brand-milk);background:var(--up-brand-night);box-shadow:var(--up-shadow-soft-xs);opacity:1;text-align:left;isolation:isolate}
.store-button-icon{display:block;flex:0 0 36px;width:36px;height:36px;filter:none}
.store-button-copy{display:grid;min-width:0;gap:3px}
.store-actions-platform .store-button small{margin:0;color:var(--up-brand-chick);font-size:11px;font-weight:600;letter-spacing:.07em;line-height:1.3;text-transform:uppercase}
.store-actions-platform .store-button strong{color:var(--up-brand-milk);font-size:23px;font-weight:700;letter-spacing:-.025em;line-height:1.2;white-space:nowrap}
.store-actions-platform .store-button-soon{cursor:default}
.store-actions-platform .store-button:focus-visible{outline:3px solid var(--up-brand-primary);outline-offset:4px}
.trial-note{display:flex;align-items:center;gap:7px;margin-top:12px;color:#93a8c2;font-size:12px}.trial-note .material-symbols-rounded{color:#ffd166;font-size:16px}
.app-preview{width:min(100%,390px);min-height:628px;padding:29px 25px 24px;border:8px solid #06172d;border-radius:48px;background:linear-gradient(160deg,#16477e,#0a2a59 48%,#07182e);box-shadow:22px 30px 68px rgba(1,8,20,.34),-9px -9px 26px rgba(86,137,191,.16),inset 0 0 0 1px rgba(255,255,255,.14);transform:rotate(1deg)}
.app-preview::before{position:absolute;z-index:-1;inset:12% -16% -8%;border-radius:50%;content:"";background:radial-gradient(circle,rgba(75,156,228,.16),transparent 65%);filter:blur(12px)}
.preview-topbar{gap:8px}.preview-status{margin-left:auto;padding:4px 7px;border:1px solid rgba(255,209,102,.22);border-radius:var(--up-radius-pill);color:#ffd166;font-size:12px;letter-spacing:.08em}
.preview-cover{border-radius:var(--up-radius-card);box-shadow:0 16px 30px rgba(0,0,0,.3)}
.preview-story-meta{display:flex;gap:8px;margin:13px 0 -5px}.preview-story-meta span{display:inline-flex;align-items:center;gap:4px;color:#b6c9df;font-size:12px;font-weight:700}.preview-story-meta i{color:#ffd166;font-size:13px}

#functii{position:relative}
#functii::before{position:absolute;z-index:-1;top:70px;right:-10vw;bottom:-50px;left:-10vw;content:"";background:radial-gradient(circle at 15% 35%,rgba(47,137,222,.08),transparent 32rem)}
.feature-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.feature-card{position:relative;grid-column:span 4;min-height:218px;overflow:hidden;padding:26px;border-color:rgba(142,177,216,.18);border-radius:var(--up-radius-card);background:linear-gradient(145deg,rgba(25,50,86,.92),rgba(18,38,72,.96));box-shadow:0 14px 34px rgba(1,9,24,.14);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.feature-card-featured{grid-column:span 6;display:grid;min-height:248px;grid-template-columns:62px 1fr;align-content:center;gap:0 20px;padding:32px;background:radial-gradient(circle at 88% 18%,rgba(255,209,102,.2),transparent 10rem),linear-gradient(145deg,#193f6d,#10284c)}
.feature-voice,.feature-family{grid-column:span 3}
.feature-card .feature-icon{margin:0 0 18px;border:1px solid rgba(255,255,255,.06);box-shadow:inset 2px 2px 5px rgba(0,0,0,.24),inset -2px -2px 5px rgba(73,116,165,.28)}
.feature-card-featured .feature-icon{grid-row:1/3;width:62px;height:62px;margin:0;border-radius:var(--up-radius-lg);font-size:30px}
.feature-card h3{margin-bottom:10px;color:#fff8e8;font-size:20px;line-height:1.25}.feature-card p{color:#bfcde0;font-size:13px;line-height:1.7}
.feature-card-featured h3{font-size:26px}.feature-card-featured p{max-width:560px;margin:0}
.feature-kicker{display:block;margin-bottom:5px;color:#ffd166;font-size:12px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.feature-mini-flow{grid-column:2;display:flex;align-items:center;gap:8px;margin-top:20px;color:#d8e6f5;font-size:12px}.feature-mini-flow i{width:24px;height:1px;background:linear-gradient(90deg,#ffd166,#79bff4)}

.steps-section{position:relative;padding:clamp(34px,5vw,58px)!important;border:1px solid rgba(210,166,55,.22);border-radius:var(--up-radius-xxl);background:radial-gradient(circle at 92% 12%,rgba(255,196,48,.25),transparent 17rem),linear-gradient(145deg,#fffaf0,#fff1c9);box-shadow:0 22px 54px rgba(2,10,24,.16)}
.steps-section .eyebrow{color:#7a5504}.steps-section .section-heading h2{max-width:760px;color:#17345a}.steps-section .section-intro{color:#655d4f}
.steps-grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.steps-grid::before{position:absolute;top:48px;right:15%;left:15%;height:2px;content:"";background:linear-gradient(90deg,#e1b54c,#8bc5ed,#e1b54c)}
.steps-grid li{position:relative;display:grid;min-height:230px;grid-template-columns:auto 1fr;align-content:start;gap:12px;padding:24px;border:1px solid rgba(73,105,144,.13);border-radius:var(--up-radius-card);background:rgba(255,255,255,.74);box-shadow:0 12px 24px rgba(80,61,13,.07)}
.steps-grid .step-number{grid-column:1/-1;color:#7f5a07;font-size:12px;letter-spacing:.18em}.step-icon{position:relative;z-index:1;display:grid;width:54px;height:54px;place-items:center;border-radius:var(--up-radius-lg);color:#15365f;background:#ffd166;font-size:26px;box-shadow:0 9px 19px rgba(127,90,7,.15)}
.steps-grid h3{margin:3px 0 7px;color:#17345a;font-size:20px}.steps-grid p{color:#625d53;font-size:13px;line-height:1.65}

.library-section .section-heading-inline{align-items:end}.library-section .section-heading-inline>div{max-width:760px}.library-section .quiet-button{margin-bottom:4px}
.library-showcase{display:grid;grid-template-columns:minmax(330px,.92fr) minmax(0,1.35fr);align-items:start;gap:22px}
.story-featured{display:grid;overflow:hidden;border:1px solid rgba(238,186,55,.32);border-radius:var(--up-radius-xxl);background:linear-gradient(155deg,#fffaf0,#fff1c8);box-shadow:0 20px 48px rgba(1,9,24,.2)}
.story-featured-art{position:relative;margin:10px 10px 0;overflow:hidden;border-radius:var(--up-radius-card);background:#dfefff}.story-featured-art img,.story-featured-art .story-placeholder{width:100%;aspect-ratio:1.18/1;object-fit:cover;transition:transform .5s ease}
.story-featured-badge{position:absolute;top:13px;left:13px;display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border-radius:var(--up-radius-pill);color:#17345a;background:rgba(255,244,207,.94);box-shadow:0 7px 18px rgba(38,31,12,.13);font-size:12px;font-weight:900}.story-featured-badge .material-symbols-rounded{color:#9c6800;font-size:16px}
.story-featured-copy{padding:24px 26px 27px}.story-featured-copy .eyebrow{margin-bottom:7px;color:#815700}.story-featured-copy h3{margin-bottom:10px;color:#17345a;font-size:clamp(24px,2.4vw,32px);line-height:1.12}.story-featured-summary{display:-webkit-box;margin-bottom:17px;overflow:hidden;color:#5e5b55;font-size:13px;line-height:1.68;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.story-featured-meta{display:flex;gap:9px;margin-bottom:20px}.story-featured-meta span{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid rgba(75,95,118,.12);border-radius:var(--up-radius-pill);color:#536273;background:#fff;font-size:12px;font-weight:800}.story-featured-meta i{color:#9c6800;font-size:15px}
.story-play-cta{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:7px;padding:10px 16px;border-radius:var(--up-radius-md);color:#17345a;background:#ffd166;font-size:12px;font-weight:900;box-shadow:0 10px 20px rgba(151,103,0,.14)}.story-play-cta .material-symbols-rounded{font-size:20px}
.story-shelf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.story-card{border-color:rgba(143,177,214,.18);border-radius:var(--up-radius-lg);background:linear-gradient(145deg,#193657,#132b4d);box-shadow:0 12px 28px rgba(1,9,24,.15)}
.story-art{margin:7px 7px 0;border-radius:var(--up-radius-md)}.story-art img{transition:transform .45s ease}.story-play-mark{position:absolute;right:9px;bottom:9px;display:grid;width:34px;height:34px;place-items:center;border-radius:var(--up-radius-sm);color:#17345a;background:#ffd166;box-shadow:0 7px 16px rgba(0,0,0,.19);font-size:20px;opacity:0;transform:translateY(5px);transition:opacity .2s ease,transform .2s ease}
.story-copy{padding:12px 13px 15px}.story-copy h3{min-height:41px;color:#fff8e8;font-size:13px}.story-copy p{color:#aabbd0;font-size:12px}

.characters-section{grid-template-columns:minmax(0,.85fr) minmax(470px,1.15fr);gap:clamp(54px,8vw,108px)}
.characters-copy h2{font-size:clamp(40px,4.5vw,58px);line-height:1.04}.characters-copy>p:not(.eyebrow){max-width:580px;font-size:17px;line-height:1.78}.character-values{display:grid;gap:9px;margin:22px 0 25px;padding:0;list-style:none}.character-values li{display:flex;align-items:center;gap:9px;color:var(--text-secondary);font-size:12px;font-weight:800}.character-values span{color:#ffd166;font-size:20px}
.character-world{min-height:500px;overflow:hidden;border-color:rgba(107,167,222,.24);background:radial-gradient(circle at 50% 42%,rgba(70,151,226,.28),transparent 34%),linear-gradient(145deg,#15385f,#0b1f3c);box-shadow:0 23px 58px rgba(1,9,24,.2)}
.character-world::before,.character-world::after{border:1px solid rgba(160,205,244,.12);background:rgba(31,72,115,.55);box-shadow:none}.character-world::before{width:150px}.character-world-label{position:absolute;top:24px;left:26px;color:#8fc8f5;font-size:12px;font-weight:900;letter-spacing:.16em}
.character-world .character img{width:250px;filter:drop-shadow(0 24px 30px rgba(0,0,0,.28))}.character-world .character figcaption{color:#fff8e8;font-size:21px}
.character-orbit-card{position:absolute;z-index:3;display:grid;min-width:126px;padding:11px 14px;border:1px solid rgba(255,255,255,.12);border-radius:var(--up-radius-md);color:#fff8e8;background:rgba(22,57,95,.88);box-shadow:0 12px 26px rgba(0,0,0,.2)}.character-orbit-card b{font-size:12px}.character-orbit-card small{color:#9fc5e9;font-size:12px}.character-cleo{top:84px;right:28px}.character-ame{bottom:99px;left:28px}
.character-world .character-note{right:25px;bottom:25px;left:auto;min-width:265px;border-color:rgba(255,255,255,.12);background:#fff7e6}.character-world .character-note strong{color:#17345a}.character-world .character-note small{color:#667085}

.parent-section{position:relative}
.parent-panel{grid-template-columns:minmax(0,.82fr) minmax(440px,1.18fr);gap:clamp(46px,7vw,88px);padding:clamp(38px,5vw,64px);border-color:rgba(77,159,231,.28);border-radius:var(--up-radius-xxl);background:radial-gradient(circle at 6% 5%,rgba(255,209,102,.14),transparent 20rem),linear-gradient(145deg,#123f70,#071a35);box-shadow:0 25px 64px rgba(1,9,24,.28)}
.parent-copy h2{max-width:540px;font-size:clamp(40px,4.5vw,58px);line-height:1.04}.parent-copy>p:not(.eyebrow){max-width:520px;font-size:16px;line-height:1.72}
.parent-benefits{display:grid;gap:9px;margin:24px 0;padding:0;list-style:none}.parent-benefits li{display:flex;align-items:center;gap:8px;color:#dce8f5;font-size:12px;font-weight:800}.parent-benefits span{color:#76d8aa;font-size:19px}
.parent-cta{display:inline-flex;min-height:50px;align-items:center;gap:7px;padding:11px 17px;border:1px solid rgba(255,209,102,.28);border-radius:var(--up-radius-md);color:#182f51;background:#ffd166;font-size:12px;font-weight:900}.parent-cta .material-symbols-rounded{font-size:18px}
.parent-dashboard{overflow:hidden;padding:15px;border:1px solid rgba(148,190,230,.17);border-radius:var(--up-radius-xl);background:rgba(6,23,45,.72);box-shadow:inset 4px 4px 10px rgba(0,0,0,.32),inset -3px -3px 9px rgba(36,79,120,.34)}
.parent-dashboard-head{display:flex;min-height:48px;align-items:center;justify-content:space-between;padding:0 8px;color:#eaf3ff;font-size:12px;font-weight:900}.parent-dashboard-head span{display:flex;align-items:center;gap:7px}.parent-dashboard-head i{color:#ffd166;font-size:18px}.parent-dashboard-head small{color:#8eabc9;font-size:12px}
.parent-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:5px 0 11px}.parent-summary span{display:grid;gap:2px;padding:11px;border:1px solid rgba(255,255,255,.08);border-radius:var(--up-radius-md);background:rgba(20,53,88,.72)}.parent-summary b{color:#fff8e8;font-size:18px}.parent-summary small{color:#91abc6;font-size:12px;text-transform:uppercase}
.parent-dashboard .parent-settings{gap:8px}.parent-dashboard .parent-settings>div{min-height:64px;border-color:rgba(255,255,255,.08);border-radius:var(--up-radius-md);background:#102c4c;box-shadow:4px 5px 12px rgba(0,0,0,.25),-2px -2px 7px rgba(37,81,123,.28)}

.pricing-section .section-heading{text-align:center}.pricing-section .section-heading h2,.pricing-section .section-intro{margin-inline:auto}.pricing-grid{gap:18px;align-items:stretch}.price-card{display:flex;min-height:520px;flex-direction:column;padding:31px 28px 27px;border-color:rgba(141,177,216,.19);border-radius:var(--up-radius-xl);background:linear-gradient(145deg,#193553,#132844);box-shadow:0 17px 38px rgba(1,9,24,.17)}
.price-card-featured{z-index:2;margin-top:-14px;margin-bottom:-14px;padding-top:39px;border:1px solid rgba(255,209,102,.62);background:radial-gradient(circle at 88% 8%,rgba(255,209,102,.16),transparent 13rem),linear-gradient(145deg,#1c3f63,#152d4c);box-shadow:0 24px 52px rgba(1,9,24,.28),0 0 0 1px rgba(255,209,102,.12)}
.price-kicker{display:block;margin-bottom:9px;color:#8fb7da;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.price-card h3{margin-bottom:12px;color:#fff8e8;font-size:23px}.price-amount{color:#fff8e8;font-size:41px}.price-amount span{color:#aebed2}.price-description{min-height:45px;margin:0 0 19px;color:#aebed2;font-size:12px;line-height:1.55}.price-card ul{gap:10px;margin-bottom:25px}.price-card li{color:#d3deec;font-size:12px}.price-card li .material-symbols-rounded{color:#7fc4f7}
.price-label{top:0;color:#17345a;background:#ffd166}.price-save{position:absolute;top:18px;right:18px;padding:5px 8px;border-radius:var(--up-radius-pill);color:#17442f;background:#a8eccb;font-size:12px;font-weight:900}.price-cta{display:flex;min-height:49px;align-items:center;justify-content:center;margin-top:auto;padding:10px 14px;border-radius:var(--up-radius-md);font-size:12px;font-weight:900}.price-cta-primary{color:#17345a;background:#ffd166;box-shadow:0 10px 21px rgba(151,103,0,.17)}.price-cta-secondary{border:1px solid rgba(137,183,225,.25);color:#dcecff;background:rgba(26,67,108,.52)}.price-microcopy{margin-top:9px;color:#91a8c1;font-size:12px;text-align:center}
.trust-strip{margin-top:29px;padding:15px 18px;border-color:rgba(122,165,207,.15);border-radius:var(--up-radius-lg);background:rgba(6,20,40,.58);box-shadow:inset 3px 3px 8px rgba(0,0,0,.28),inset -2px -2px 7px rgba(35,73,111,.28)}.trust-strip span{color:#b8c8da;font-weight:800}.trust-strip i{color:#70d0a4}

.testimonials-section{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr);align-items:end;gap:clamp(42px,6vw,78px)}
.testimonials-section .section-heading{margin-bottom:0}.testimonial-grid{gap:16px}.testimonial-grid blockquote{position:relative;min-height:310px;padding:30px;border-color:rgba(135,174,216,.2);border-radius:var(--up-radius-xl);background:linear-gradient(145deg,#1a3658,#132945);box-shadow:0 16px 37px rgba(1,9,24,.16)}
.testimonial-quote{display:grid;width:45px;height:45px;margin-bottom:23px;place-items:center;border-radius:var(--up-radius-md);color:#17345a;background:#ffd166;font-size:26px;box-shadow:0 9px 20px rgba(0,0,0,.15)}.testimonial-grid blockquote>p{color:#edf4fb;font-size:17px;line-height:1.72}.testimonial-grid footer{margin-top:auto}.testimonial-grid footer>span{color:#c8e5fb;background:#15385d}.testimonial-grid footer strong{color:#fff8e8}.testimonial-grid footer em{margin-left:auto;padding:5px 8px;border-radius:var(--up-radius-pill);color:#8fbce1;background:#102641;font-size:12px;font-style:normal;font-weight:900;text-transform:uppercase}

.faq-section{padding-bottom:0}.faq-layout{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:clamp(44px,7vw,92px)}.faq-intro{position:sticky;top:110px;align-self:start}.faq-intro .section-heading h2{font-size:clamp(38px,4vw,50px)}
.faq-help{display:flex;align-items:flex-start;gap:13px;padding:19px;border:1px solid rgba(125,170,215,.18);border-radius:var(--up-radius-lg);background:rgba(21,49,82,.62)}.faq-help>span{display:grid;width:42px;height:42px;flex:0 0 auto;place-items:center;border-radius:var(--up-radius-md);color:#17345a;background:#ffd166}.faq-help strong{color:#fff8e8;font-size:12px}.faq-help p{margin:2px 0;color:#aebed2;font-size:12px}.faq-help a{color:#91cdf7;font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.faq-list{gap:11px}.faq-list details{border-color:rgba(132,172,214,.18);border-radius:var(--up-radius-lg);background:linear-gradient(145deg,#193553,#132944);box-shadow:0 10px 25px rgba(1,9,24,.12)}.faq-list summary{min-height:70px;padding:18px 21px;color:#fff8e8;font-size:14px}.faq-list summary .material-symbols-rounded{display:grid;width:34px;height:34px;place-items:center;border-radius:var(--up-radius-sm);color:#9fc8e9;background:#102641}.faq-list details p{padding:0 64px 22px 21px;color:#b9c9dc;line-height:1.75}.faq-list details[open]{background:linear-gradient(145deg,#1d3d60,#142d4c)}

.closing-cta{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:28px;margin-top:var(--section-space);padding:clamp(28px,4vw,44px)!important;border:1px solid rgba(235,184,53,.34);border-radius:var(--up-radius-xxl);background:radial-gradient(circle at 8% 20%,rgba(255,255,255,.75),transparent 13rem),linear-gradient(145deg,#fff9e9,#ffedb6);box-shadow:0 22px 52px rgba(1,9,24,.2)}.closing-cta img{width:112px;height:112px;filter:drop-shadow(0 13px 18px rgba(112,72,0,.16))}.closing-cta .eyebrow{color:#7d5706}.closing-cta h2{margin:0 0 7px;color:#17345a;font-size:clamp(30px,3.3vw,43px);line-height:1.08}.closing-cta p:last-child{margin:0;color:#675c49}.closing-cta-button{display:inline-flex;min-height:56px;align-items:center;justify-content:center;gap:7px;padding:12px 20px;border-radius:var(--up-radius-md);color:#fff;background:#126fc4;box-shadow:0 12px 25px rgba(12,93,171,.22);font-size:13px;font-weight:900;white-space:nowrap}

.site-footer{margin-top:100px;padding:58px var(--landing-gutter) max(28px,env(safe-area-inset-bottom));border-color:rgba(137,175,214,.16);text-align:left;background:linear-gradient(180deg,#0d1e39,#08162c)}
.footer-inner{display:grid;width:min(100%,var(--content));grid-template-columns:minmax(280px,1.4fr) repeat(3,minmax(150px,.65fr));gap:clamp(26px,4vw,54px);margin:auto}.footer-brand img{width:210px;height:auto;margin:0 0 10px}.footer-brand>p{max-width:360px;color:#9fb1c8;font-size:12px;line-height:1.65}.footer-brand>span{display:flex;align-items:center;gap:6px;color:#d5e1ee;font-size:12px;font-weight:800}.footer-brand>span i{color:#ff8c7c;font-size:16px}
.footer-column{display:flex;align-items:flex-start;flex-direction:column;gap:8px;color:#aebed2;font-size:12px}.footer-column strong{margin-bottom:4px;color:#fff8e8;font-size:12px;text-transform:uppercase;letter-spacing:.11em}.footer-column a{min-height:30px;padding:0;color:#aebed2}.footer-column a:hover{color:#fff}.footer-contact p{margin:0;color:#91a5bd;font-size:12px}.footer-contact>a{color:#91cdf7;font-weight:800}.footer-contact small{max-width:190px;margin-top:9px;color:#748ca7;font-size:12px;line-height:1.5}
.footer-bottom{display:flex;width:min(100%,var(--content));justify-content:space-between;gap:18px;margin:38px auto 0;padding-top:18px;border-top:1px solid rgba(135,174,216,.14)}.footer-bottom p,.site-footer .copyright{margin:0;color:#7187a2;font-size:12px}

.has-js .content-section.reveal-ready{opacity:1;transform:translateY(16px);transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.has-js .content-section.reveal-ready.is-revealed{opacity:1;transform:none}

@media(hover:hover){
  .header-cta:hover,.hero-action-primary:hover,.story-play-cta:hover,.parent-cta:hover,.price-cta:hover,.closing-cta-button:hover{transform:translateY(-2px);filter:brightness(1.03)}
  .store-actions-platform a.store-button:hover{border-color:var(--up-brand-chick);background:var(--up-night-raised);box-shadow:var(--up-shadow-soft-xs);transform:translateY(-2px)}
  .feature-card:hover,.story-card:hover,.testimonial-grid blockquote:hover{transform:translateY(-5px);border-color:rgba(130,190,239,.38);box-shadow:0 22px 46px rgba(1,9,24,.23)}
  .story-card:hover .story-art img,.story-featured:hover .story-featured-art img{transform:scale(1.035)}
  .story-card:hover .story-play-mark{opacity:1;transform:none}
  .faq-list summary:hover{background:rgba(55,101,148,.14)}
}

@media(max-width:1100px){
  .site-header{grid-template-columns:auto 1fr auto auto}.site-nav{position:absolute;top:calc(100% + 9px);right:0;left:0;display:none;align-items:stretch;gap:3px;padding:9px;border:1px solid var(--border-soft);border-radius:var(--up-radius-lg);background:rgba(10,26,51,.98);box-shadow:0 20px 48px rgba(1,8,20,.34)}.site-nav.is-open{display:grid}.site-nav a{justify-content:flex-start;padding-inline:13px;border-radius:var(--up-radius-sm)}.site-nav a::after{display:none}.site-nav a:hover,.site-nav a.is-active{background:#15375c}.site-nav-app-link{display:none!important}.nav-toggle{display:grid}.header-cta{justify-self:auto}
  .hero-content{grid-template-columns:minmax(0,1fr) 350px;gap:42px}.hero h1{font-size:clamp(52px,6vw,68px)}
  .feature-card-featured{grid-column:span 7}.feature-voice{grid-column:span 5}.feature-family,.feature-limits,.feature-offline,.feature-shield{grid-column:span 6}
  .library-showcase{grid-template-columns:minmax(310px,.8fr) minmax(0,1.2fr)}.story-shelf{grid-template-columns:repeat(2,minmax(0,1fr))}
  .characters-section{grid-template-columns:minmax(0,.85fr) minmax(400px,1.15fr);gap:45px}
  .parent-panel{grid-template-columns:minmax(0,.78fr) minmax(390px,1.22fr);gap:40px}
  .testimonials-section{grid-template-columns:1fr}.testimonials-section .section-heading{max-width:790px}
}

@media(max-width:880px){
  .hero{padding-top:118px;text-align:center}.hero-content{grid-template-columns:1fr;gap:56px}.hero-copy{max-width:700px;margin:auto}.hero-kicker,.hero-mark,.hero-lead{margin-inline:auto}.hero-actions,.hero-trust{justify-content:center}.store-availability>p{justify-content:center}.store-actions-platform{justify-content:center}.trial-note{justify-content:center}.app-preview{width:min(88vw,385px);transform:none}
  .steps-grid{grid-template-columns:1fr}.steps-grid::before{top:10%;right:auto;bottom:10%;left:50px;width:2px;height:auto}.steps-grid li{min-height:0;grid-template-columns:auto auto 1fr;align-items:center}.steps-grid .step-number{grid-column:auto}.steps-grid h3{margin-top:0}
  .library-showcase{grid-template-columns:1fr}.story-featured{grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr)}.story-featured-art{margin:10px 0 10px 10px}.story-featured-art img,.story-featured-art .story-placeholder{height:100%;aspect-ratio:auto}.story-shelf{grid-template-columns:repeat(3,minmax(0,1fr))}
  .characters-section{grid-template-columns:1fr}.characters-copy{max-width:700px}.character-world{min-height:470px}
  .parent-panel{grid-template-columns:1fr}.parent-copy{max-width:690px}.parent-dashboard{max-width:620px;width:100%;margin:auto}
  .pricing-grid{grid-template-columns:1fr}.price-card,.price-card-featured{min-height:0;margin:0}.price-card-featured{order:-1}.price-card ul{margin-bottom:24px}
  .faq-layout{grid-template-columns:1fr}.faq-intro{position:static}.faq-intro .section-heading{max-width:760px}
  .closing-cta{grid-template-columns:auto 1fr}.closing-cta-button{grid-column:1/-1;width:100%}
  .footer-inner{grid-template-columns:1.2fr 1fr 1fr}.footer-contact{grid-column:2/4}
}

@media(max-width:640px){
  :root{--section-space:82px}.page-content{padding-inline:16px}.content-section{contain-intrinsic-size:1px 620px}.section-heading h2{font-size:clamp(34px,10vw,43px)}.section-intro{font-size:15px;line-height:1.65}
  .site-header{top:max(9px,env(safe-area-inset-top));width:calc(100% - 18px);min-height:62px;grid-template-columns:minmax(0,1fr) auto auto;gap:7px;padding:6px 7px 6px 10px}.site-brand{min-width:0}.site-brand img{width:124px;height:44px}.nav-toggle{width:44px;height:44px}.header-cta{min-height:44px;padding-inline:12px;font-size:12px}.header-cta .material-symbols-rounded{display:none}
  .hero{padding:104px 16px 76px}.hero h1{font-size:clamp(40px,12vw,52px);line-height:1.01}.hero-lead{font-size:15px;line-height:1.62}.hero-actions{display:grid;max-width:520px;grid-template-columns:1fr}.hero-action{width:100%;min-width:0}.hero-trust{display:grid;grid-template-columns:1fr 1fr;justify-items:start;width:min(100%,410px);margin-inline:auto}.store-actions-platform{display:flex}.app-preview{width:min(94vw,360px);min-height:560px;padding-inline:18px;border-width:7px;border-radius:var(--up-radius-xxl)}
  .feature-grid{grid-template-columns:1fr}.feature-card,.feature-card-featured,.feature-voice,.feature-family,.feature-limits,.feature-offline,.feature-shield{grid-column:auto}.feature-card-featured{grid-template-columns:54px 1fr;padding:25px}.feature-card-featured .feature-icon{width:54px;height:54px}.feature-card-featured h3{font-size:22px}.feature-mini-flow{grid-column:1/-1}
  .steps-section{margin-inline:-3px;padding:28px 18px!important;border-radius:var(--up-radius-xl)}.steps-grid li{grid-template-columns:auto 1fr;padding:19px}.steps-grid .step-number{grid-column:1/-1}.steps-grid::before{display:none}.step-icon{width:48px;height:48px;border-radius:var(--up-radius-md)}
  .library-section .section-heading-inline{align-items:flex-start;flex-direction:column}.library-section .quiet-button{width:100%;justify-content:center}.story-featured{grid-template-columns:1fr}.story-featured-art{margin:8px 8px 0}.story-featured-art img,.story-featured-art .story-placeholder{height:auto;aspect-ratio:1.12/1}.story-featured-copy{padding:21px}.story-shelf{display:flex;margin-inline:-16px;padding:2px 16px 16px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory}.story-card{flex:0 0 min(70vw,250px);scroll-snap-align:start}.story-play-mark{opacity:1;transform:none}
  .characters-copy h2,.parent-copy h2{font-size:clamp(36px,10vw,46px)}.character-world{min-height:410px;margin-inline:-3px}.character-world .character img{width:205px}.character-cleo{top:67px;right:14px}.character-ame{bottom:92px;left:14px}.character-world .character-note{right:13px;bottom:15px;left:13px;min-width:0}.character-world-label{top:19px;left:20px}
  .parent-panel{margin-inline:-3px;padding:28px 18px;border-radius:29px}.parent-summary{gap:6px}.parent-summary span{padding:9px}.parent-dashboard{padding:10px;border-radius:var(--up-radius-card)}.parent-dashboard .parent-settings>div{grid-template-columns:40px 1fr auto;padding-inline:10px}.parent-dashboard .parent-settings>div>span{width:40px;height:40px}
  .pricing-section .section-heading{text-align:left}.pricing-section .section-heading h2,.pricing-section .section-intro{margin-inline:0}.price-card{padding:28px 22px;border-radius:var(--up-radius-card)}.trust-strip{grid-template-columns:1fr 1fr;gap:12px}.trust-strip span{justify-content:flex-start}
  .testimonial-grid{grid-template-columns:1fr}.testimonial-grid blockquote{min-height:0;padding:24px}.testimonial-grid footer em{display:none}
  .faq-layout{gap:28px}.faq-list summary{min-height:64px;padding:15px 16px}.faq-list details p{padding:0 50px 18px 16px}.faq-help{padding:16px}
  .closing-cta{grid-template-columns:1fr;text-align:center;margin-inline:-3px;padding:28px 20px!important}.closing-cta img{width:96px;height:96px;margin:auto}.closing-cta .eyebrow{margin-bottom:8px}.closing-cta-button{grid-column:auto}
  .site-footer{margin-top:76px;padding-top:46px}.footer-inner{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-contact{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column}
}

@media(max-width:520px){
  .site-header{grid-template-columns:minmax(0,1fr) auto}.header-cta{display:none}.site-nav-app-link{display:flex!important;margin-top:5px;color:#17345a!important;background:#ffd166!important}.nav-menu-open{overflow:hidden}
}

@media(max-width:390px){
  .hero{padding-inline:13px}.hero h1{font-size:38px}.hero-kicker{font-size:12px}.hero-trust{gap:7px 10px}.store-actions-platform{grid-template-columns:1fr}.app-preview{width:100%;min-height:530px}.preview-soft-row{gap:6px}.preview-soft-row span{font-size:12px}.character-orbit-card{min-width:108px;padding:9px 11px}.character-cleo{right:9px}.character-ame{left:9px}.parent-summary small{font-size:12px}.footer-inner{grid-template-columns:1fr}.footer-brand,.footer-contact{grid-column:auto}
}

@media(prefers-reduced-motion:reduce){.has-js .content-section.reveal-ready{opacity:1;transform:none}.app-preview{transform:none}}
