[hidden] { display: none !important; }


:root {
  --ink: #211430;
  --muted: #685d74;
  --cream: #fff7ed;
  --cream-2: #fdf0e4;
  --night: #16072d;
  --night-2: #0f0b25;
  --purple: #7551c7;
  --purple-2: #a47ae9;
  --lavender: #e4d4f5;
  --mint: #48d1b0;
  --mint-dark: #148b78;
  --rose: #f56f9c;
  --line: rgba(52, 31, 79, .12);
  --shadow: 0 28px 80px rgba(33, 20, 48, .14);
  --radius-xl: 42px;
  --radius-lg: 30px;
  --radius-md: 22px;
  --container: min(1180px, calc(100% - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: Inter, ui-rounded, "SF Pro Rounded", "SF Pro Display", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
.container { width: var(--container); margin-inline: auto; }
.section-pad { padding: 116px 0; position: relative; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; top: 10px; left: 10px; z-index: 999;
  transform: translateY(-150%); background: #fff; color: var(--ink);
  padding: 10px 14px; border-radius: 12px; box-shadow: var(--shadow);
}
.skip-link:focus { transform: none; }

.site-header {
  position: fixed; inset: 0 0 auto; z-index: 100;
  padding: max(12px, env(safe-area-inset-top)) 0 12px;
  transition: background .25s ease, box-shadow .25s ease, backdrop-filter .25s ease;
}
.site-header.scrolled {
  background: rgba(22, 7, 45, .82);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
}
.nav-wrap { display: flex; align-items: center; justify-content: space-between; min-height: 58px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: white; }
.brand img { width: 48px; height: 48px; object-fit: contain; background: transparent; }
.brand span { display: grid; line-height: 1; }
.brand strong { font-size: 1.55rem; letter-spacing: .07em; font-weight: 850; }
.brand small { margin-top: 5px; font-size: .62rem; text-transform: uppercase; letter-spacing: .18em; opacity: .65; }
.site-nav { display: flex; align-items: center; gap: 28px; color: rgba(255,255,255,.78); font-size: .91rem; font-weight: 700; }
.site-nav a { transition: color .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible { color: white; }
.nav-login {
  padding: 12px 18px; border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px; background: rgba(255,255,255,.08);
}
.menu-button { display: none; background: none; border: 0; padding: 8px; }
.menu-button > span:not(.sr-only) { display: block; width: 25px; height: 2px; margin: 5px; background: white; border-radius: 999px; }

.hero {
  min-height: 850px;
  padding-top: 154px;
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 82% 20%, rgba(117,81,199,.36), transparent 34%),
    radial-gradient(circle at 6% 94%, rgba(72,209,176,.17), transparent 30%),
    linear-gradient(145deg, var(--night) 0%, #130b31 50%, var(--night-2) 100%);
  color: white;
  isolation: isolate;
  overflow: hidden;
}
.hero::before {
  content: ""; position: absolute; inset: 0; opacity: .3; pointer-events: none;
  background-image:
    radial-gradient(circle at 15% 30%, #fff 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 14%, #fff 0 1px, transparent 1.5px),
    radial-gradient(circle at 50% 70%, #fff 0 1px, transparent 1.5px);
  background-size: 170px 170px, 230px 230px, 310px 310px;
}
.hero-grid { position: relative; display: grid; grid-template-columns: .92fr 1.08fr; gap: 54px; align-items: center; z-index: 2; }
.hero-copy { padding-bottom: 34px; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  color: rgba(255,255,255,.72); text-transform: uppercase;
  letter-spacing: .15em; font-size: .73rem; font-weight: 850;
}
.eyebrow i { width: 8px; height: 8px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 16px rgba(72,209,176,.8); }
.eyebrow.dark { color: var(--purple); }
.hero h1, .section-heading h2, .family-copy h2, .security-copy h2, .install-card h2, .final-card h2 {
  margin: 22px 0; font-size: clamp(3rem, 5.6vw, 5.25rem); line-height: .98;
  letter-spacing: -.055em; font-weight: 880;
}
.hero h1 em, h2 em { color: var(--purple-2); font-style: normal; }
.hero-lead { max-width: 610px; color: rgba(255,255,255,.68); font-size: 1.13rem; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 34px; }
.hero-actions.center { justify-content: center; }
.button {
  min-height: 54px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 0 24px; border-radius: 999px; border: 1px solid transparent;
  font-weight: 830; font-size: .93rem; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: linear-gradient(135deg, #a87cf0, #7653ca); color: white; box-shadow: 0 18px 40px rgba(117,81,199,.35); }
.button-secondary { color: white; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); }
.button-light { color: var(--night); background: white; box-shadow: 0 18px 40px rgba(0,0,0,.12); }
.button-outline-light { color: white; background: transparent; border-color: rgba(255,255,255,.26); }
.trust-row { display: flex; flex-wrap: wrap; gap: 19px; margin-top: 30px; color: rgba(255,255,255,.58); font-size: .78rem; font-weight: 720; }
.trust-row b { color: var(--mint); margin-right: 4px; }

.hero-visual { position: relative; min-height: 625px; display: grid; place-items: center; }
.orbit-aura {
  position: absolute; width: 590px; height: 590px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: inset 0 0 100px rgba(117,81,199,.08);
}
.orbit-aura::before, .orbit-aura::after {
  content: ""; position: absolute; border-radius: 50%; inset: 50%;
  width: 12px; height: 12px; background: var(--mint); box-shadow: 0 0 20px var(--mint);
}
.orbit-aura::before { transform: translate(-290px, -25px); }
.orbit-aura::after { transform: translate(265px, 100px); background: #f8d170; box-shadow: 0 0 20px #f8d170; }
.phone {
  position: relative; width: 344px; min-height: 660px; border-radius: 48px;
  padding: 20px 18px 24px; background: linear-gradient(180deg, #fffaf4, #f7edf8);
  color: var(--ink); border: 7px solid #29203c; box-shadow: 0 42px 100px rgba(0,0,0,.42);
  transform: rotate(2deg); z-index: 2; overflow: hidden;
}
.phone::before { content: ""; position: absolute; top: 9px; left: 50%; translate: -50%; width: 95px; height: 22px; border-radius: 999px; background: #21172d; }
.phone-status { display: flex; justify-content: space-between; font-size: .64rem; font-weight: 800; padding: 8px 5px 21px; }
.app-head { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 9px; }
.baby-avatar { width: 42px; height: 42px; border-radius: 15px; display: grid; place-items: center; background: linear-gradient(135deg, #e5d5ff, #b6efd9); font-weight: 900; color: var(--purple); }
.app-head div:nth-child(2) { display: grid; }
.app-head small { font-size: .48rem; letter-spacing: .14em; color: #847992; font-weight: 850; }
.app-head strong { font-size: .78rem; }
.sync-pill { font-size: .47rem; color: var(--mint-dark); background: rgba(72,209,176,.13); padding: 6px 7px; border-radius: 999px; font-weight: 850; }
.app-meta { margin: 17px 2px 10px; font-size: .49rem; letter-spacing: .11em; color: #867b91; font-weight: 800; }
.orbit-card {
  min-height: 338px; display: grid; place-items: center; border-radius: 31px;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.95), rgba(255,255,255,.62) 42%, transparent 70%),
    linear-gradient(145deg, rgba(117,81,199,.11), rgba(255,255,255,.76));
  border: 1px solid rgba(117,81,199,.08); overflow: hidden;
}
.orbit-ring {
  width: 284px; height: 284px; border-radius: 50%; position: relative;
  display: grid; place-items: center; isolation: isolate;
  filter: drop-shadow(0 20px 34px rgba(72,45,103,.10));
}
.orbit-dial { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.orbit-base { fill: rgba(255,255,255,.35); stroke: rgba(117,81,199,.20); stroke-width: 8; }
.orbit-guide { fill: none; stroke: rgba(117,81,199,.13); stroke-width: 1.2; stroke-dasharray: 2.6 5; }
.orbit-arc { fill: none; stroke-width: 10; stroke-linecap: round; transform: rotate(-90deg); transform-origin: 150px 150px; }
.orbit-sleep-arc { stroke: url(#ninou-orbit-sleep); }
.orbit-sleep-arc-a { stroke-dasharray: 88 685; stroke-dashoffset: -17; }
.orbit-sleep-arc-b { stroke-dasharray: 48 725; stroke-dashoffset: -267; opacity: .76; }
.orbit-awake-arc { stroke: url(#ninou-orbit-awake); stroke-dasharray: 53 720; stroke-dashoffset: -174; }
.orbit-tick { stroke: rgba(71,47,94,.22); stroke-width: 1.5; stroke-linecap: round; }
.orbit-tick-medium { stroke: rgba(71,47,94,.34); stroke-width: 2; }
.orbit-tick-major { stroke: rgba(71,47,94,.58); stroke-width: 2.6; }
.orbit-now-line { stroke: rgba(71,47,94,.46); stroke-width: 1.5; stroke-linecap: round; stroke-dasharray: 3 4; }
.orbit-now-halo { fill: rgba(72,209,176,.18); }
.orbit-now-dot { fill: #48d1b0; stroke: white; stroke-width: 2.2; animation: orbitNowPulse 2.2s ease-in-out infinite; }
.orbit-center-pin { fill: #6d4ac0; stroke: white; stroke-width: 2; }
.orbit-hour { position: absolute; z-index: 2; color: #8a7b97; font-size: .40rem; line-height: 1; font-weight: 900; letter-spacing: .02em; }
.hour-00 { top: 8px; left: 50%; translate: -50% 0; }
.hour-06 { right: 8px; top: 50%; translate: 0 -50%; }
.hour-12 { bottom: 8px; left: 50%; translate: -50% 0; }
.hour-18 { left: 8px; top: 50%; translate: 0 -50%; }
.orbit-24h { position: absolute; right: 45px; top: 42px; color: rgba(117,81,199,.54); font-size: .40rem; font-weight: 950; letter-spacing: .09em; }
.orbit-center {
  width: 142px; height: 142px; border-radius: 50%; z-index: 1;
  display: grid; place-items: center; align-content: center; text-align: center;
  background: linear-gradient(160deg, rgba(255,255,255,.98), rgba(250,244,252,.88));
  border: 1px solid rgba(117,81,199,.10);
  box-shadow: 0 18px 40px rgba(67,42,91,.11), inset 0 1px 0 white;
}
.orbit-center small { font-size: .43rem; letter-spacing: .18em; font-weight: 900; color: #876f9b; }
.orbit-center strong { margin-top: 2px; font-size: 1.82rem; line-height: 1.05; letter-spacing: -.055em; color: #2f2040; font-variant-numeric: tabular-nums; }
.orbit-state { margin-top: 8px; min-height: 20px; padding: 0 9px; display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; background: rgba(72,209,176,.13); color: #357b6a; font-size: .48rem; font-weight: 900; }
.orbit-state i { width: 5px; height: 5px; border-radius: 50%; background: #48d1b0; box-shadow: 0 0 8px rgba(72,209,176,.75); }
.orbit-center em { margin-top: 4px; color: #8c7f96; font-size: .44rem; font-style: normal; font-weight: 720; }
.orbit-event {
  position: absolute; width: 42px; height: 42px; border-radius: 50%; z-index: 3;
  display: grid; place-items: center; background: rgba(255,255,255,.96);
  border: 1px solid rgba(117,81,199,.08); box-shadow: 0 10px 24px rgba(44,27,67,.15);
}
.orbit-event b { font-size: 1rem; line-height: 1; font-weight: normal; }
.orbit-event small { position: absolute; top: 43px; white-space: nowrap; font-size: .42rem; color: #695b77; font-weight: 850; }
.event-1 { left: -9px; top: 118px; }
.event-2 { left: 39px; top: 21px; }
.event-3 { left: 195px; top: 9px; }
.event-4 { right: -7px; top: 132px; }
.event-5 { left: 78px; bottom: -3px; }
@keyframes orbitNowPulse {
  0%,100% { r: 5; opacity: 1; }
  50% { r: 7; opacity: .76; }
}
.mock-action { width: 100%; border: 0; min-height: 45px; margin-top: 12px; border-radius: 17px; background: linear-gradient(135deg, #b9efd9, #9bdac9); color: #4e2d75; font-weight: 900; }
.mock-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-top: 11px; }
.mock-summary span { padding: 9px 7px; border-radius: 14px; background: white; box-shadow: 0 8px 20px rgba(44,27,67,.06); display: grid; }
.mock-summary small { font-size: .42rem; color: #887c92; }
.mock-summary strong { font-size: .72rem; margin-top: 2px; }
.floating-card {
  position: absolute; z-index: 4; display: flex; align-items: center; gap: 11px;
  min-width: 225px; padding: 13px 15px; border-radius: 19px;
  background: rgba(255,255,255,.92); color: var(--ink); box-shadow: 0 20px 50px rgba(0,0,0,.22);
  backdrop-filter: blur(12px);
}
.floating-card small, .floating-card strong { display: block; }
.floating-card small { color: #84778d; font-size: .62rem; }
.floating-card strong { font-size: .72rem; }
.float-icon { width: 37px; height: 37px; border-radius: 13px; display: grid; place-items: center; background: #efe4ff; }
.card-last { right: 0; top: 140px; }
.card-family { left: 0; bottom: 82px; }
.avatars { display: flex; }
.avatars i { width: 31px; height: 31px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: .6rem; font-weight: 900; color: white; background: var(--purple); border: 2px solid white; margin-left: -7px; }
.avatars i:first-child { margin-left: 0; background: #7551c7; }
.avatars i:nth-child(2) { background: #e477a5; }
.avatars i:nth-child(3) { background: #3cbca0; }

.proof-strip { background: #0f0b25; color: white; border-top: 1px solid rgba(255,255,255,.07); border-bottom: 1px solid rgba(255,255,255,.07); }
.proof-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.proof-grid article { padding: 28px 22px; display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; border-right: 1px solid rgba(255,255,255,.07); }
.proof-grid article:last-child { border-right: 0; }
.proof-grid span { grid-row: span 2; width: 34px; height: 34px; border-radius: 12px; display: grid; place-items: center; background: rgba(164,122,233,.15); color: #c9abff; }
.proof-grid .proof-orbit svg { width: 24px; height: 24px; display: block; }
.proof-grid .proof-orbit svg > circle:first-child { fill: rgba(255,255,255,.03); stroke: rgba(201,171,255,.72); stroke-width: 1.6; }
.proof-orbit-inner { stroke: rgba(201,171,255,.32); stroke-width: 1; stroke-dasharray: 1.6 2.2; }
.proof-orbit-arc { stroke: #c9abff; stroke-width: 2.4; stroke-linecap: round; }
.proof-orbit-hand { stroke: #8ee2cb; stroke-width: 1.5; stroke-linecap: round; }
.proof-orbit-core { fill: #8ee2cb; }
.proof-orbit-event { fill: #a47ae9; stroke: white; stroke-width: 1; }
.proof-grid strong { font-size: .82rem; }
.proof-grid small { color: rgba(255,255,255,.48); font-size: .67rem; margin-top: 3px; }

.light-section { background: linear-gradient(180deg, #fff8ef, #f8edeb); }
.section-heading { max-width: 760px; }
.section-heading h2, .family-copy h2, .security-copy h2, .install-card h2, .final-card h2 { font-size: clamp(2.45rem, 4.4vw, 4.3rem); color: var(--ink); }
.section-heading p { max-width: 650px; color: var(--muted); font-size: 1.04rem; }
.feature-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; margin-top: 55px; }
.feature-card { position: relative; min-height: 310px; padding: 34px; border-radius: var(--radius-lg); background: rgba(255,255,255,.72); border: 1px solid rgba(74,48,98,.08); box-shadow: 0 18px 50px rgba(73,46,95,.07); overflow: hidden; }
.feature-card::after { content:""; position:absolute; width:220px; height:220px; border-radius:50%; right:-100px; bottom:-110px; background:rgba(164,122,233,.10); }
.feature-large { grid-column: 1 / -1; min-height: 430px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 44px; align-items: center; background: linear-gradient(135deg, #fff, #f0e4f7); }
.feature-number { font-size: .7rem; letter-spacing: .14em; font-weight: 900; color: var(--purple); }
.feature-card h3 { margin: 18px 0 12px; font-size: 1.65rem; letter-spacing: -.035em; }
.feature-card p { color: var(--muted); }
.feature-card ul { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 10px; font-size: .86rem; font-weight: 750; }
.feature-card li::before { content: "✓"; color: var(--mint-dark); margin-right: 8px; }
.feature-symbol { margin-top: 28px; width: 64px; height: 64px; border-radius: 22px; display: grid; place-items: center; background: #efe5fa; color: var(--purple); font-size: 2rem; }
.feature-symbol svg { width: 42px; height: 42px; display: block; overflow: visible; }
.orbit-feature-symbol { background: linear-gradient(145deg, #f3eafb, #e8dcf6); box-shadow: inset 0 1px 0 rgba(255,255,255,.85); }
.orbit-feature-track { fill: rgba(255,255,255,.52); stroke: rgba(117,81,199,.33); stroke-width: 2.4; }
.orbit-feature-inner { fill: none; stroke: rgba(117,81,199,.17); stroke-width: 1.2; stroke-dasharray: 2.5 3.5; }
.orbit-feature-arc { fill: none; stroke: #7551c7; stroke-width: 4.2; stroke-linecap: round; }
.orbit-feature-arc-mint { stroke: #48cfae; }
.orbit-feature-hand { stroke: #4c316b; stroke-width: 2.4; stroke-linecap: round; }
.orbit-feature-core { fill: #7551c7; stroke: white; stroke-width: 1.5; }
.orbit-feature-event { fill: #a47ae9; stroke: white; stroke-width: 2; }
.orbit-feature-event-mint { fill: #48cfae; }
.mini-dashboard { padding: 25px; border-radius: 27px; background: #17102f; color: white; box-shadow: var(--shadow); transform: rotate(1.5deg); }
.mini-top { display: flex; justify-content: space-between; align-items: center; font-size: .86rem; font-weight: 850; }
.mini-top b { padding: 7px 10px; border-radius: 999px; background: rgba(72,209,176,.12); color: #75dbc2; font-size: .62rem; }
.mini-tiles { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; margin-top: 18px; }
.mini-tiles span { min-height: 102px; padding: 15px; border-radius: 18px; background: rgba(255,255,255,.07); display: grid; align-content: center; }
.mini-tiles small { color: rgba(255,255,255,.48); font-size: .63rem; }
.mini-tiles strong { margin-top: 5px; font-size: 1.15rem; }
.mini-tiles em { color: #70d7bd; font-style: normal; font-size: .62rem; }

.family-section { background: linear-gradient(145deg, #17092e, #0e0d25); color: white; overflow: hidden; }
.family-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.family-visual { min-height: 530px; display: grid; place-items: center; }
.family-orbit { width: 430px; height: 430px; border-radius: 50%; border: 1px solid rgba(255,255,255,.15); position: relative; display: grid; place-items: center; }
.family-orbit::before { content:""; position:absolute; inset:55px; border-radius:50%; border:1px dashed rgba(255,255,255,.11); }
.family-center { width: 205px; height: 205px; border-radius: 50%; display:grid; place-items:center; background: radial-gradient(circle, rgba(117,81,199,.34), rgba(117,81,199,.05)); box-shadow: 0 0 80px rgba(117,81,199,.28); }
.family-center img { width: 148px; height: 148px; object-fit: contain; }
.person { position: absolute; display: grid; place-items: center; gap: 7px; color: rgba(255,255,255,.7); font-size: .7rem; font-weight: 760; }
.person b { width: 64px; height: 64px; border-radius: 50%; display:grid; place-items:center; background: linear-gradient(135deg,#9f79e7,#6546b5); color:white; font-size:1.1rem; border:4px solid rgba(255,255,255,.13); box-shadow:0 15px 30px rgba(0,0,0,.25); }
.person-a { left: -12px; top: 180px; }
.person-b { right: 18px; top: 46px; }
.person-c { right: 37px; bottom: 25px; }
.person-b b { background: linear-gradient(135deg,#ed8bb2,#c24f83); }
.person-c b { background: linear-gradient(135deg,#54d5b8,#248c7b); }
.family-copy h2 { color: white; }
.family-copy p { color: rgba(255,255,255,.61); font-size: 1.02rem; line-height: 1.75; }
.family-points { margin-top: 30px; display:grid; gap:13px; }
.family-points article { display:grid; grid-template-columns:42px 1fr; gap:13px; padding:15px; border-radius:18px; background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.07); }
.family-points article > span { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:rgba(164,122,233,.16); color:#c7a9ff; font-size:.68rem; font-weight:900; }
.family-points div { display:grid; }
.family-points strong { font-size:.88rem; }
.family-points small { margin-top:4px; color:rgba(255,255,255,.48); line-height:1.55; }

.security-section { background: #f7ece8; }
.security-card { min-height: 490px; padding: 64px; border-radius: var(--radius-xl); background: linear-gradient(135deg,#fff,#f1e3f5); display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:40px; box-shadow:var(--shadow); overflow:hidden; }
.security-copy p { max-width: 620px; color: var(--muted); line-height:1.75; }
.security-badges { display:flex; flex-wrap:wrap; gap:9px; margin:25px 0; }
.security-badges span { padding:9px 13px; border-radius:999px; background:white; color:#574763; font-size:.72rem; font-weight:800; box-shadow:0 7px 20px rgba(52,31,79,.06); }
.security-badges span::first-letter { color:var(--mint-dark); }
.text-link { color:var(--purple); font-weight:850; font-size:.88rem; }
.security-mark { min-height:330px; display:grid; place-items:center; position:relative; }
.shield { width:160px; height:190px; display:grid; place-items:center; font-size:3.2rem; color:white; background:linear-gradient(160deg,#8d67df,#5f3db0); clip-path:polygon(50% 0, 92% 18%, 86% 72%, 50% 100%, 14% 72%, 8% 18%); box-shadow:0 30px 65px rgba(96,61,177,.3); }
.shield-orbit { position:absolute; border-radius:50%; border:1px solid rgba(117,81,199,.18); }
.orbit-one { width:290px; height:290px; }
.orbit-two { width:370px; height:230px; transform:rotate(-20deg); }

.install-section { background: var(--night); color:white; padding:80px 0; }
.install-card { display:grid; grid-template-columns:1fr auto; align-items:center; gap:50px; }
.install-card h2 { color:white; margin:15px 0; }
.install-card p { max-width:650px; color:rgba(255,255,255,.58); }
.install-actions { display:grid; gap:10px; min-width:230px; }
.install-actions small { max-width:260px; color:rgba(255,255,255,.55); font-size:.72rem; line-height:1.45; }

.faq-section { padding-top:100px; }
.faq-list { max-width:850px; margin:45px auto 0; display:grid; gap:12px; }
.faq-list details { background:white; border:1px solid rgba(52,31,79,.08); border-radius:20px; padding:0 22px; box-shadow:0 10px 30px rgba(52,31,79,.04); }
.faq-list summary { cursor:pointer; list-style:none; padding:22px 38px 22px 0; font-weight:850; position:relative; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:"+"; position:absolute; right:0; top:50%; translate:0 -50%; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:#f1e7fa; color:var(--purple); }
.faq-list details[open] summary::after { content:"–"; }
.faq-list p { color:var(--muted); margin:0; padding:0 35px 22px 0; }

.final-cta { padding:110px 0; background:linear-gradient(180deg,#f8edeb,#fff8ef); }
.final-card { padding:76px 30px; border-radius:var(--radius-xl); text-align:center; color:white; background:
  radial-gradient(circle at 15% 10%, rgba(72,209,176,.18), transparent 30%),
  radial-gradient(circle at 90% 90%, rgba(164,122,233,.35), transparent 38%),
  var(--night);
  box-shadow:var(--shadow);
}
.final-card > img { width:108px; height:108px; object-fit:contain; background:transparent; }
.final-card h2 { color:white; margin:18px auto; max-width:800px; }
.final-card p { color:rgba(255,255,255,.58); }

.site-footer { background:#0d091e; color:white; padding:70px 0 25px; }
.footer-grid { display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:45px; }
.footer-grid > div:not(.footer-brand) { display:grid; align-content:start; gap:10px; }
.footer-grid > div > strong { font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:8px; }
.footer-grid a:not(.brand) { color:rgba(255,255,255,.52); font-size:.82rem; }
.footer-brand p { max-width:330px; color:rgba(255,255,255,.45); font-size:.8rem; line-height:1.65; }
.footer-bottom { margin-top:55px; padding-top:22px; border-top:1px solid rgba(255,255,255,.08); display:flex; justify-content:space-between; color:rgba(255,255,255,.32); font-size:.68rem; }
.offline-toast {
  position:fixed; left:50%; bottom:max(18px,env(safe-area-inset-bottom)); translate:-50% 0; z-index:300;
  width:min(520px,calc(100% - 28px)); padding:13px 17px; border-radius:16px;
  background:#251536; color:white; box-shadow:0 18px 50px rgba(0,0,0,.3); font-size:.78rem; font-weight:700;
}
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 980px) {
  .site-nav { gap:18px; }
  .hero-grid, .family-grid, .security-card { grid-template-columns:1fr; }
  .hero-copy { text-align:center; }
  .hero-lead { margin-inline:auto; }
  .hero-actions, .trust-row { justify-content:center; }
  .hero-visual { margin-top:10px; }
  .proof-grid { grid-template-columns:repeat(2,1fr); }
  .proof-grid article:nth-child(2) { border-right:0; }
  .proof-grid article:nth-child(-n+2) { border-bottom:1px solid rgba(255,255,255,.07); }
  .family-copy { text-align:center; }
  .family-copy p { margin-inline:auto; max-width:690px; }
  .family-points { text-align:left; }
  .security-mark { grid-row:1; min-height:260px; }
  .install-card { grid-template-columns:1fr; text-align:center; }
  .install-card p { margin-inline:auto; }
  .install-actions { justify-self:center; }
}

@media (max-width: 760px) {
  :root { --container:min(100% - 28px, 1180px); --radius-xl:30px; --radius-lg:25px; }
  .section-pad { padding:82px 0; }
  .site-header { background:rgba(22,7,45,.74); backdrop-filter:blur(18px); }
  .menu-button { display:block; }
  .site-nav {
    position:absolute; top:calc(100% + 4px); left:14px; right:14px; padding:18px;
    display:none; align-items:stretch; gap:5px; border-radius:22px; background:rgba(22,7,45,.97); box-shadow:var(--shadow);
  }
  .site-nav.open { display:grid; }
  .site-nav a { padding:12px 10px; }
  .nav-login { text-align:center; margin-top:5px; }
  .hero { min-height:auto; padding-top:126px; }
  .hero-grid { gap:20px; }
  .hero h1 { font-size:clamp(2.7rem,13vw,4.1rem); }
  .hero-visual { min-height:580px; scale:.86; margin-inline:-30px; }
  .floating-card { scale:.92; }
  .card-last { right:-4px; }
  .card-family { left:-3px; }
  .feature-grid { grid-template-columns:1fr; }
  .feature-large { grid-column:auto; grid-template-columns:1fr; }
  .mini-dashboard { transform:none; }
  .family-orbit { scale:.8; margin-inline:-40px; }
  .security-card { padding:38px 24px; }
  .security-mark { scale:.82; margin-block:-25px; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}

@media (max-width: 520px) {
  .hero-visual { scale:.72; min-height:490px; margin:-45px -75px -15px; }
  .proof-grid { grid-template-columns:1fr; }
  .proof-grid article { border-right:0; border-bottom:1px solid rgba(255,255,255,.07); }
  .feature-card { padding:26px 22px; min-height:auto; }
  .feature-large { gap:25px; }
  .mini-tiles { grid-template-columns:1fr 1fr; }
  .family-visual { min-height:390px; }
  .family-orbit { scale:.67; margin:-70px -85px; }
  .security-mark { scale:.67; margin:-55px; }
  .security-card { gap:15px; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-brand { grid-column:auto; }
  .footer-bottom { display:grid; gap:7px; }
  .button { width:100%; }
  .hero-actions { width:100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .reveal { opacity:1; transform:none; }
}

.install-status {
  display: block;
  max-width: 290px !important;
  padding: 11px 13px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.78) !important;
  font-size: .76rem !important;
  line-height: 1.5 !important;
}
.button[disabled] {
  cursor: default;
  opacity: .72;
  transform: none;
  box-shadow: none;
}


.safari-install-guide {
  max-width: 330px;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  background: rgba(255,255,255,.07);
  color: #fff;
  text-align: left;
}

.safari-guide-heading {
  display: flex;
  align-items: center;
  gap: 11px;
}

.safari-guide-heading > div {
  display: grid;
  gap: 3px;
}

.safari-guide-heading strong {
  font-size: .83rem;
  line-height: 1.25;
}

.safari-guide-heading span {
  color: rgba(255,255,255,.68);
  font-size: .72rem;
  line-height: 1.4;
}

.safari-guide-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
  background: rgba(255,255,255,.12);
  color: #fff !important;
  font-size: 1.2rem !important;
}

.safari-guide-steps {
  display: grid;
  gap: 10px;
  margin: 15px 0 0;
  padding: 0;
  list-style: none;
}

.safari-guide-steps li {
  display: grid;
  grid-template-columns: 25px 1fr;
  align-items: start;
  gap: 9px;
  color: rgba(255,255,255,.82);
  font-size: .76rem;
  line-height: 1.5;
}

.safari-step-number {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border-radius: 999px;
  background: rgba(126,226,195,.16);
  color: #7ee2c3;
  font-size: .7rem;
  font-weight: 900;
}

.share-symbol {
  display: inline-block;
  margin-left: 3px;
  color: #fff;
  font-size: .9rem;
  font-weight: 800;
}

.safari-guide-alternative {
  margin: 13px 0 0;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.66);
  font-size: .72rem;
  line-height: 1.45;
}

.install-actions.is-safari-mac .button-light::before {
  content: "";
  margin-right: 8px;
  font-size: 1rem;
}

@media (max-width: 560px) {
  .safari-install-guide {
    max-width: none;
  }
}


.hero-invite-link {
  flex-basis: 100%;
  width: fit-content;
  color: #d8cbff;
  font-size: .82rem;
  font-weight: 850;
  line-height: 1.4;
  text-decoration: none;
  transition: opacity .2s ease, transform .2s ease;
}
.hero-invite-link:hover {
  opacity: .82;
  transform: translateY(-1px);
}
.hero-invite-link.light {
  color: rgba(255,255,255,.82);
  text-align: center;
}
.hero-actions.center .hero-invite-link {
  margin-inline: auto;
}


/* Acesso web direto: Firebase no mesmo documento, sem iframe. */
body.entry-modal-open {
  overflow: hidden;
}

.entry-shell[hidden] {
  display: none !important;
}

.entry-shell {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding:
    max(20px, env(safe-area-inset-top))
    max(16px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(16px, env(safe-area-inset-left));
  overflow: auto;
  background:
    radial-gradient(circle at 20% 18%, rgba(255, 220, 166, .18), transparent 34%),
    radial-gradient(circle at 82% 26%, rgba(149, 111, 232, .24), transparent 38%),
    rgba(16, 8, 31, .72);
  -webkit-backdrop-filter: blur(22px) saturate(1.12);
  backdrop-filter: blur(22px) saturate(1.12);
  animation: ninou-entry-fade .2s ease both;
}

.entry-shell-backdrop {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  cursor: default;
}

.entry-shell::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  opacity: 0;
  transition: opacity .52s cubic-bezier(.22, .76, .2, 1);
}

body.entry-auth-transition-light .entry-shell::after {
  background:
    radial-gradient(circle at 4% 4%, rgba(255, 209, 142, .54), transparent 27%),
    radial-gradient(circle at 94% 16%, rgba(217, 199, 255, .58), transparent 31%),
    radial-gradient(circle at 4% 94%, rgba(189, 235, 220, .42), transparent 31%),
    linear-gradient(135deg, #FFF0D8 0%, #FFEEDB 52%, #F8EEFA 100%);
}

body.entry-auth-transition-dark .entry-shell::after {
  background:
    radial-gradient(circle at 92% 18%, rgba(120, 87, 216, .42), transparent 32%),
    radial-gradient(circle at 4% 92%, rgba(42, 147, 123, .25), transparent 33%),
    radial-gradient(circle at 2% 2%, rgba(242, 179, 91, .10), transparent 24%),
    linear-gradient(135deg, #0D091C 0%, #17102E 53%, #0B1627 100%);
}

.entry-direct-card,
.entry-shell-backdrop {
  transition:
    opacity .32s ease,
    transform .38s cubic-bezier(.22, .76, .2, 1),
    filter .38s ease;
}

body.entry-auth-transition .entry-shell {
  overflow: hidden;
}

body.entry-auth-transition .entry-shell::after {
  opacity: 1;
}

body.entry-auth-transition .entry-direct-card {
  opacity: 0;
  transform: translateY(-8px) scale(.985);
  filter: blur(2px);
  pointer-events: none;
}

body.entry-auth-transition .entry-shell-backdrop {
  opacity: 0;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .entry-shell::after,
  .entry-direct-card,
  .entry-shell-backdrop {
    transition-duration: .08s;
  }
}

.entry-direct-card {
  position: relative;
  z-index: 1;
  width: min(520px, 100%);
  max-height: calc(100dvh - 32px);
  overflow: auto;
  border: 1px solid rgba(91, 62, 133, .13);
  border-radius: 34px;
  padding: 24px;
  background:
    radial-gradient(circle at 92% 0%, rgba(164, 122, 233, .14), transparent 31%),
    rgba(255, 252, 250, .985);
  color: var(--ink);
  box-shadow:
    0 38px 110px rgba(8, 3, 22, .42),
    inset 0 1px 0 rgba(255,255,255,.9);
  animation: ninou-entry-card .24s cubic-bezier(.2,.8,.2,1) both;
}

.entry-direct-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.entry-direct-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #312244;
}

.entry-direct-brand img {
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.entry-direct-brand span {
  display: grid;
  line-height: 1;
}

.entry-direct-brand strong {
  font-size: 1.35rem;
  font-weight: 900;
  letter-spacing: .055em;
}

.entry-direct-brand small {
  margin-top: 5px;
  color: #756985;
  font-size: .57rem;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.entry-direct-close {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(68,45,100,.1);
  border-radius: 15px;
  background: rgba(68,45,100,.07);
  color: #3d2c52;
  font-size: 27px;
  line-height: 1;
  cursor: pointer;
}

.entry-direct-copy {
  margin-top: 28px;
}

.entry-direct-kicker {
  color: var(--purple);
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .14em;
}

.entry-direct-copy h2 {
  margin: 9px 0 8px;
  font-size: clamp(2rem, 7vw, 2.75rem);
  line-height: 1.03;
  letter-spacing: -.045em;
}

.entry-direct-copy p {
  margin: 0;
  color: var(--muted);
  font-size: .94rem;
  line-height: 1.6;
}

.entry-direct-account-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 22px;
  padding: 6px;
  border: 1px solid rgba(68,45,100,.09);
  border-radius: 20px;
  background: rgba(68,45,100,.055);
}

.entry-direct-account-switch[hidden] {
  display: none !important;
}

.entry-direct-account-switch button {
  min-height: 63px;
  display: grid;
  align-content: center;
  gap: 3px;
  border: 0;
  border-radius: 15px;
  background: transparent;
  color: #473558;
  text-align: left;
  padding: 10px 13px;
  cursor: pointer;
}

.entry-direct-account-switch button.active {
  background: linear-gradient(135deg, #8f68de, #6947bd);
  color: #fff;
  box-shadow: 0 11px 25px rgba(105,71,189,.24);
}

.entry-direct-account-switch small {
  font-size: .54rem;
  font-weight: 900;
  letter-spacing: .09em;
  opacity: .72;
}

.entry-direct-account-switch strong {
  font-size: .82rem;
  font-weight: 900;
}

.entry-direct-form {
  display: grid;
  gap: 13px;
  margin-top: 24px;
}

.entry-direct-form label {
  display: grid;
  gap: 7px;
}

.entry-direct-form label[hidden] {
  display: none !important;
}

.entry-direct-form label > span {
  color: #3d2d4d;
  font-size: .76rem;
  font-weight: 900;
}

.entry-direct-form input {
  width: 100%;
  min-height: 56px;
  border: 1px solid rgba(68,45,100,.12);
  border-radius: 17px;
  outline: none;
  background: rgba(246, 241, 249, .9);
  color: #2e203d;
  padding: 0 15px;
  font: inherit;
  font-size: .91rem;
  font-weight: 700;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.entry-direct-form input:focus {
  border-color: rgba(117,81,199,.58);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(117,81,199,.11);
}

.entry-direct-hint {
  margin: -1px 0 1px;
  color: #7a6d87;
  font-size: .73rem;
  line-height: 1.5;
}

.entry-direct-message {
  border-radius: 15px;
  padding: 11px 13px;
  font-size: .77rem;
  font-weight: 800;
  line-height: 1.45;
}

.entry-direct-message.error {
  border: 1px solid rgba(190,79,97,.16);
  background: rgba(190,79,97,.09);
  color: #a93f52;
}

.entry-direct-message.success {
  border: 1px solid rgba(20,139,120,.16);
  background: rgba(72,209,176,.11);
  color: #107765;
}

.entry-direct-submit {
  min-height: 57px;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(135deg, #8f68de, #6947bd);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 16px 34px rgba(105,71,189,.28);
}

.entry-direct-submit:disabled {
  cursor: wait;
  opacity: .72;
}

.entry-direct-submit.busy::after {
  content: "";
  display: inline-block;
  width: 13px;
  height: 13px;
  margin-left: 9px;
  border: 2px solid rgba(255,255,255,.38);
  border-top-color: #fff;
  border-radius: 50%;
  vertical-align: -2px;
  animation: ninou-entry-spin .8s linear infinite;
}

.entry-direct-recover {
  justify-self: center;
  border: 0;
  background: transparent;
  color: var(--purple);
  padding: 5px 10px;
  font-size: .75rem;
  font-weight: 900;
  cursor: pointer;
}

.entry-direct-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 19px;
  color: #756985;
  font-size: .75rem;
}

.entry-direct-footer[hidden] {
  display: none !important;
}

.entry-direct-footer button {
  border: 0;
  background: transparent;
  color: var(--purple);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.entry-direct-security {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  margin: 19px 0 0;
  color: #867a91;
  text-align: center;
  font-size: .64rem;
  line-height: 1.45;
}

.entry-direct-security span {
  color: var(--mint-dark);
  font-size: .55rem;
}

@keyframes ninou-entry-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes ninou-entry-card {
  from { opacity: 0; transform: translateY(14px) scale(.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes ninou-entry-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 560px) {
  .entry-shell {
    align-items: end;
    padding: 0;
  }

  .entry-direct-card {
    width: 100%;
    max-height: calc(100dvh - max(10px, env(safe-area-inset-top)));
    border-radius: 30px 30px 0 0;
    padding:
      20px
      18px
      max(22px, env(safe-area-inset-bottom));
  }

  .entry-direct-copy {
    margin-top: 21px;
  }

  .entry-direct-copy h2 {
    font-size: 2.15rem;
  }
}
\n

/* v85.0.20 — atualização PWA com recuperação automática. */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body.entry-modal-open {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: pan-y;
}

.entry-shell {
  top: var(--ninou-visual-offset-top, 0px);
  right: 0;
  bottom: auto;
  left: 0;
  width: 100%;
  height: var(--ninou-visual-height, 100dvh);
  min-height: 0;
  max-height: var(--ninou-visual-height, 100dvh);
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}

.entry-direct-card {
  max-height: calc(var(--ninou-visual-height, 100dvh) - 32px);
  overscroll-behavior: contain;
  scroll-padding-block: 18px;
}

.entry-direct-form input,
.entry-direct-form select,
.entry-direct-form textarea {
  font-size: 16px;
  line-height: 1.25;
}

@media (max-width: 560px) {
  .entry-shell {
    align-items: end;
  }

  .entry-direct-card {
    max-height: calc(
      var(--ninou-visual-height, 100dvh) -
      max(8px, env(safe-area-inset-top))
    );
  }

  .entry-direct-form input,
  .entry-direct-form select,
  .entry-direct-form textarea {
    font-size: 16px !important;
  }
}