:root {
  --bg-1: #fffdf9;
  --bg-2: #fff3f7;
  --bg-3: #faf4ff;
  --ink: #302a32;
  --ink-soft: #4a3f46;
  --muted: #7b6c74;
  --soft: #95888e;
  --line: rgba(239, 224, 231, .94);
  --card: rgba(255, 255, 255, .82);
  --pink: #ef7fa3;
  --pink-deep: #e76892;
  --peach: #f3aa82;
  --gold: #e5b768;
  --violet: #a497e4;
  --mint: #72c4b6;
  --bad: #b75d68;
  --good: #4f9d88;
  --shadow: 0 16px 38px rgba(211, 158, 179, .12);
  --shadow-hover: 0 22px 46px rgba(211, 158, 179, .18);
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 10% -3%, rgba(255, 221, 232, .56), transparent 28%),
    radial-gradient(circle at 93% 1%, rgba(255, 237, 209, .48), transparent 26%),
    radial-gradient(circle at 96% 62%, rgba(234, 224, 255, .38), transparent 25%),
    linear-gradient(135deg, var(--bg-1), var(--bg-2) 52%, var(--bg-3));
  font-family: var(--font);
  line-height: 1.7;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }
p, h1, h2, h3 { margin-top: 0; }
::selection { background: #ffdbe8; color: var(--ink); }

.page-shell { overflow: hidden; }
.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; }
.page-progress { position: fixed; top: 0; left: 0; z-index: 80; width: 100%; height: 3px; pointer-events: none; }
.page-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--pink), var(--peach), var(--violet)); transition: width .08s linear; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 76px;
  padding: 9px max(24px, 5vw);
  border-bottom: 1px solid rgba(234, 221, 228, .74);
  background: rgba(255, 250, 248, .82);
  backdrop-filter: blur(18px);
  transition: box-shadow .25s ease, background .25s ease;
}
.topbar.is-scrolled { background: rgba(255, 250, 248, .94); box-shadow: 0 12px 30px rgba(202, 139, 161, .08); }
.brand { display: inline-flex; align-items: center; gap: 11px; flex-shrink: 0; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.92); border-radius: 14px; background: linear-gradient(135deg, var(--pink), var(--peach)); color: #fff; font-size: 19px; font-weight: 800; line-height: 1; box-shadow: 0 10px 21px rgba(239, 127, 163, .23); }
.brand-copy { display: grid; gap: 0; line-height: 1.15; }
.brand-copy strong { color: var(--ink); font-size: 17px; letter-spacing: .08em; }
.brand-copy small { color: var(--soft); font-size: 10px; letter-spacing: .08em; }
.main-nav { display: flex; align-items: center; gap: 7px; margin-left: auto; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.main-nav::-webkit-scrollbar { display: none; }
.main-nav a { padding: 8px 12px; border: 1px solid transparent; border-radius: 999px; color: var(--muted); font-size: 12px; font-weight: 700; transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease; }
.main-nav a:hover, .main-nav a:focus-visible, .main-nav a.is-active { border-color: rgba(239, 127, 163, .2); background: rgba(255, 255, 255, .72); color: var(--pink-deep); transform: translateY(-1px); }
.nav-cta { display: inline-flex; align-items: center; gap: 8px; padding: 10px 15px; border: 1px solid rgba(239, 127, 163, .22); border-radius: 999px; background: rgba(255, 255, 255, .72); color: var(--pink-deep); font-size: 12px; font-weight: 800; white-space: nowrap; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.nav-cta:hover, .nav-cta:focus-visible { background: #fff; box-shadow: 0 10px 22px rgba(239, 127, 163, .14); transform: translateY(-2px); }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 10px; border: 1px solid rgba(239, 224, 231, .94); border-radius: 14px; background: rgba(255,255,255,.82); cursor: pointer; }
.menu-toggle span:not(.sr-only) { display: block; width: 20px; height: 2px; margin: 4px auto; border-radius: 99px; background: var(--pink-deep); }

.hero { position: relative; min-height: 680px; padding: 92px max(24px, 7vw) 62px; overflow: hidden; }
.hero::before { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(239, 127, 163, .09) 1px, transparent 1px), linear-gradient(180deg, rgba(239, 127, 163, .07) 1px, transparent 1px); background-size: 36px 36px; mask-image: linear-gradient(90deg, rgba(0,0,0,.48), transparent 74%); content: ""; pointer-events: none; }
.hero::after { position: absolute; width: 520px; height: 520px; right: -160px; top: -190px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.8), rgba(255,225,235,.38) 43%, transparent 70%); content: ""; pointer-events: none; }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(420px, .98fr); align-items: center; gap: 65px; max-width: 1220px; margin: 0 auto; }
.hero-copy { max-width: 650px; }
.eyebrow, .section-kicker { display: inline-flex; flex-direction: column; gap: 7px; margin-bottom: 15px; color: var(--pink-deep); font-size: 11px; font-weight: 900; letter-spacing: .08em; line-height: 1.35; }
.eyebrow::after, .section-kicker::after { width: 36px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, var(--pink), var(--peach)); content: ""; }
.eyebrow.light, .section-kicker.light { color: var(--pink-deep); }
.hero h1 { max-width: 720px; margin-bottom: 24px; color: var(--ink-soft); font-size: clamp(50px, 6.4vw, 82px); font-weight: 800; letter-spacing: -.05em; line-height: 1.03; }
.hero h1 em, .product-shell h2 em, .contact-section h2 em { color: var(--pink-deep); font-style: normal; background: linear-gradient(100deg, var(--pink-deep), var(--peach)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero-lead { max-width: 600px; margin-bottom: 31px; color: var(--muted); font-size: 15px; font-weight: 600; }
.hero-actions { display: flex; align-items: center; gap: 18px; margin-bottom: 34px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 45px; padding: 11px 20px; border: 0; border-radius: 999px; background: linear-gradient(135deg, var(--pink), var(--peach)); box-shadow: 0 14px 26px rgba(239, 127, 163, .2); color: #fff; font-size: 13px; font-weight: 800; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease; }
.button:hover, .button:focus-visible { box-shadow: 0 17px 29px rgba(239, 127, 163, .28); filter: saturate(1.08); transform: translateY(-3px); }
.button-light { background: linear-gradient(135deg, var(--pink), var(--peach)); color: #fff; }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; }.light-link { color: var(--pink-deep); }.light-link:hover { color: var(--pink); }
.hero-tags { display: flex; flex-wrap: wrap; gap: 8px; }.hero-tags span { padding: 6px 11px; border: 1px solid rgba(239, 127, 163, .18); border-radius: 999px; background: rgba(255,255,255,.62); color: var(--muted); font-size: 11px; font-weight: 700; }
.hero-visual { position: relative; min-height: 455px; }
.hero-panel { position: absolute; border: 1px solid rgba(255, 255, 255, .96); background: rgba(255, 255, 255, .68); box-shadow: var(--shadow); backdrop-filter: blur(16px); }
.hero-panel-main { top: 70px; right: 7%; width: min(390px, 88%); padding: 25px; border-radius: var(--radius-xl); background: linear-gradient(145deg, rgba(255,255,255,.84), rgba(255,242,247,.68)); transform: rotate(3deg); transition: transform .35s ease, box-shadow .35s ease; }
.hero-panel-main:hover { box-shadow: var(--shadow-hover); transform: rotate(1deg) translateY(-5px); }
.panel-topline, .panel-caption, .report-window-top, .report-footer, .board-header, .board-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.panel-kicker, .mini-label { color: var(--pink-deep); font-size: 11px; font-weight: 800; letter-spacing: .07em; }.status-chip { padding: 4px 9px; border: 1px solid rgba(98,191,174,.22); border-radius: 999px; background: rgba(244, 251, 248, .8); color: var(--good); font-size: 10px; font-weight: 800; }
.panel-profile { display: flex; align-items: center; gap: 13px; margin: 34px 0 24px; }.profile-avatar { display: grid; place-items: center; width: 50px; height: 50px; border: 1px solid rgba(239,127,163,.22); border-radius: 17px; background: linear-gradient(135deg, #ffd9e4, #f4ab84); color: #fff; font-size: 24px; font-weight: 800; box-shadow: 0 11px 22px rgba(239,127,163,.16); }.panel-profile strong, .panel-profile span { display: block; }.panel-profile strong { color: var(--ink); font-size: 20px; letter-spacing: .03em; }.panel-profile span { color: var(--muted); font-size: 12px; }
.signal-chart { display: flex; align-items: end; gap: 9px; height: 128px; padding: 14px 14px 0; border-bottom: 1px solid var(--line); }.signal-chart i { flex: 1; min-height: 20px; border-radius: 8px 8px 0 0; background: linear-gradient(180deg, var(--pink), var(--peach)); opacity: .88; }.signal-chart i:nth-child(2n) { background: linear-gradient(180deg, var(--violet), #d1c9f6); }.panel-caption { margin-top: 9px; color: var(--soft); font-size: 10px; }
.hero-panel-float { display: grid; gap: 4px; padding: 14px 17px; border-radius: 18px; }.hero-panel-float strong { color: var(--ink); font-size: 14px; letter-spacing: .04em; }.float-top { top: 21px; left: 2%; transform: rotate(-7deg); }.float-bottom { right: 1%; bottom: 26px; transform: rotate(-4deg); }.hero-panel-float:hover { box-shadow: var(--shadow-hover); transform: rotate(0) translateY(-3px); }
.orbit { position: absolute; border: 1px solid rgba(239,127,163,.22); border-radius: 50%; }.orbit-one { width: 380px; height: 380px; top: 31px; left: 5%; }.orbit-two { width: 290px; height: 290px; top: 76px; left: 17%; border-style: dashed; border-color: rgba(164,151,228,.38); }.orbit-dot { position: absolute; width: 10px; height: 10px; border-radius: 50%; box-shadow: 0 0 0 8px rgba(239,127,163,.08); }.dot-one { top: 54px; right: 9%; background: var(--gold); }.dot-two { bottom: 30px; left: 16%; background: var(--mint); }.dot-three { top: 230px; left: 2%; width: 7px; height: 7px; background: var(--violet); }.hero-scroll-hint { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; max-width: 1220px; margin: 58px auto 0; color: var(--soft); font-size: 11px; font-weight: 700; letter-spacing: .06em; }.hero-scroll-hint span { display: block; width: 35px; height: 1px; background: rgba(239,127,163,.45); }

.section { position: relative; max-width: 1280px; margin: 18px auto; padding: 98px max(24px, 7vw); border: 1px solid rgba(234, 221, 228, .9); border-radius: var(--radius-xl); background: var(--card); box-shadow: 0 14px 34px rgba(202, 139, 161, .07); }.section::before { position: absolute; top: 28px; left: 0; width: 4px; height: 47px; border-radius: 0 999px 999px 0; background: linear-gradient(180deg, var(--pink), var(--peach)); content: ""; }.section-white { background: rgba(255,255,255,.78); }.section-soft { background: rgba(255,250,248,.54); }.section-heading { max-width: 720px; margin-bottom: 52px; }.section-heading h2, .brand-story h2, .architecture-section h2, .advantage-section h2 { margin-bottom: 0; color: var(--ink); font-size: clamp(36px, 4.6vw, 62px); font-weight: 800; letter-spacing: -.045em; line-height: 1.12; }.section-heading h2 span, .brand-story h2 em, .architecture-section h2 span, .advantage-section h2 span { color: var(--pink-deep); font-style: normal; }.split-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; max-width: 1160px; }.heading-aside { max-width: 315px; margin: 0 0 5px; color: var(--muted); font-size: 13px; font-weight: 600; }
.section-problem { max-width: 1360px; }.problem-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 90px; max-width: 1160px; margin: 0 auto; }.problem-lead { color: var(--muted); font-size: 14px; font-weight: 500; }.lead-copy { color: var(--ink-soft); font-size: 19px; font-weight: 800; line-height: 1.7; }.quote-line { display: flex; gap: 13px; align-items: flex-start; margin-top: 34px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--pink-deep); }.quote-line span { color: var(--peach); font-family: Georgia, serif; font-size: 34px; line-height: .7; }.quote-line strong { font-size: 14px; }.problem-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.info-card, .audience-card, .advantage-card, .partner-card { border: 1px solid rgba(239, 224, 231, .92); border-radius: var(--radius-lg); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }.info-card:hover, .audience-card:hover, .advantage-card:hover, .partner-card:hover { border-color: rgba(239,127,163,.28); box-shadow: var(--shadow-hover); transform: translateY(-4px); }.info-card { min-height: 190px; padding: 23px; background: rgba(255,255,255,.76); box-shadow: 0 10px 22px rgba(202, 139, 161, .06); }.info-card.card-mint { background: rgba(244,251,248,.8); }.info-card.card-gold { background: rgba(255,248,235,.8); }.info-card.card-rose { background: rgba(255,244,247,.8); }.card-index, .audience-number, .observe-number, .advantage-icon { display: inline-block; color: var(--pink-deep); font-size: 11px; font-weight: 900; letter-spacing: .1em; }.info-card h3 { margin: 28px 0 9px; color: var(--ink); font-size: 18px; }.info-card p, .audience-card p, .advantage-card p, .partner-card p { margin-bottom: 0; color: var(--muted); font-size: 13px; font-weight: 500; line-height: 1.75; }

.brand-story { display: grid; grid-template-columns: minmax(220px, .6fr) minmax(0, 1.4fr); gap: 70px; align-items: center; max-width: 1360px; }.story-mark { display: grid; place-items: center; width: min(250px, 100%); aspect-ratio: 1; border: 1px solid rgba(239,127,163,.18); border-radius: 42% 58% 54% 46% / 48% 44% 56% 52%; background: radial-gradient(circle at 40% 35%, #fff 0 18%, #ffd6e2 18% 36%, transparent 36%), linear-gradient(140deg, #fff1f5, #f6f1ff); color: var(--pink-deep); font-size: 74px; font-weight: 800; box-shadow: inset 20px 20px 45px rgba(255,255,255,.8), 0 24px 50px rgba(202,139,161,.12); transform: rotate(-8deg); }.story-copy { max-width: 760px; }.brand-story h2 { margin-bottom: 22px; }.brand-story h2 em { color: var(--violet); }.brand-story p { color: var(--muted); font-size: 14px; font-weight: 500; }.story-proof { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 27px; }.story-proof article { min-height: 142px; padding: 15px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-md); background: rgba(255,255,255,.62); box-shadow: 0 9px 19px rgba(202,139,161,.05); }.story-proof span { color: var(--pink-deep); font-size: 10px; font-weight: 900; letter-spacing: .1em; }.story-proof article:nth-child(2) span { color: var(--mint); }.story-proof article:nth-child(3) span { color: var(--gold); }.story-proof strong { display: block; margin: 11px 0 6px; color: var(--ink); font-size: 13px; }.story-proof p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.65; }.story-signature { margin-top: 29px; padding-left: 18px; border-left: 3px solid var(--pink); color: var(--pink-deep); font-size: 12px; font-weight: 700; line-height: 1.9; }

.audience-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; max-width: 1160px; margin: 0 auto; }.audience-card { min-height: 360px; padding: 23px; display: flex; flex-direction: column; background: rgba(255,255,255,.66); box-shadow: 0 10px 22px rgba(202,139,161,.06); }.audience-blue { background: linear-gradient(145deg, rgba(255,245,248,.9), rgba(255,255,255,.7)); }.audience-teal { background: linear-gradient(145deg, rgba(241,252,249,.92), rgba(255,255,255,.72)); }.audience-gold { background: linear-gradient(145deg, rgba(255,249,238,.94), rgba(255,255,255,.72)); }.audience-ink { background: linear-gradient(145deg, rgba(247,244,255,.94), rgba(255,255,255,.72)); color: var(--ink); }.audience-top { display: flex; align-items: center; justify-content: space-between; }.audience-symbol { color: var(--pink); font-size: 26px; }.audience-teal .audience-symbol { color: var(--mint); }.audience-gold .audience-symbol { color: var(--gold); }.audience-ink .audience-symbol { color: var(--violet); }.audience-card h3 { max-width: 190px; margin: auto 0 13px; color: var(--ink); font-size: 21px; line-height: 1.35; }.audience-card p { min-height: 102px; }.card-link { display: inline-flex; gap: 8px; align-items: center; margin-top: 20px; color: var(--pink-deep); font-size: 12px; font-weight: 900; }

.method-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; max-width: 1160px; margin: 0 auto; }.method-card { display: grid; grid-template-columns: 56px 1fr; gap: 18px; padding: 22px 20px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-lg); background: rgba(255,255,255,.76); box-shadow: 0 10px 22px rgba(202,139,161,.06); transition: transform .25s ease, box-shadow .25s ease; }.method-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-4px); }.method-letter { color: var(--pink); font-size: 43px; font-weight: 800; line-height: 1; }.teal-text { color: var(--mint) !important; }.gold-text { color: var(--gold) !important; }.rose-text { color: var(--pink-deep) !important; }.method-card h3 { margin: 2px 0 8px; color: var(--ink); font-size: 17px; }.method-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.75; }

.architecture-section { max-width: 1360px; }.architecture-layout { display: grid; grid-template-columns: 260px 100px 1fr; align-items: center; max-width: 1160px; margin: 0 auto; }.architecture-core { padding: 25px; border: 1px solid rgba(239,127,163,.18); border-radius: var(--radius-xl); background: linear-gradient(145deg, rgba(255,244,248,.94), rgba(255,255,255,.68)); box-shadow: 0 12px 28px rgba(202,139,161,.09); }.core-number { display: block; margin-bottom: 14px; color: var(--pink-deep); font-size: 70px; font-weight: 800; line-height: .8; }.core-label { color: var(--pink-deep); font-size: 11px; font-weight: 900; letter-spacing: .12em; }.architecture-core h3 { margin: 25px 0 12px; color: var(--ink); font-size: 20px; line-height: 1.35; }.architecture-core p { margin: 0; color: var(--muted); font-size: 12px; }.architecture-lines { display: grid; gap: 40px; }.architecture-lines i { display: block; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(239,127,163,.4), rgba(164,151,228,.25)); }.architecture-branches { display: grid; gap: 13px; }.architecture-branches article { display: grid; grid-template-columns: 52px 190px 1fr; align-items: center; gap: 16px; min-height: 92px; padding: 15px 21px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-lg); background: rgba(255,255,255,.72); box-shadow: 0 10px 22px rgba(202,139,161,.06); }.branch-number { color: var(--pink-deep); font-size: 12px; font-weight: 900; letter-spacing: .08em; }.architecture-branches h3 { margin: 0; color: var(--ink); font-size: 17px; }.architecture-branches p { margin: 0; color: var(--muted); font-size: 12px; }.service-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; max-width: 1160px; margin: 44px auto 0; padding: 16px 18px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-lg); background: rgba(255,255,255,.62); color: var(--soft); font-size: 12px; }.service-strip i { width: 1px; height: 18px; background: var(--line); }.service-strip b { color: var(--ink-soft); font-weight: 700; }

.product-section { padding-top: 96px; padding-bottom: 108px; background: rgba(255,250,248,.42); }.product-shell { position: relative; display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(360px, .94fr); align-items: center; gap: 50px; max-width: 1160px; min-height: 510px; margin: 0 auto; padding: 53px 58px; overflow: hidden; border: 1px solid rgba(255,255,255,.95); border-radius: var(--radius-xl); background: linear-gradient(135deg, #fff3f7 0%, #fff0e4 58%, #f7f1ff 100%); box-shadow: var(--shadow); }.product-shell::before { position: absolute; width: 420px; height: 420px; right: -170px; top: -170px; border: 1px solid rgba(239,127,163,.16); border-radius: 50%; box-shadow: 0 0 0 35px rgba(239,127,163,.04), 0 0 0 70px rgba(164,151,228,.04); content: ""; }.product-copy, .product-visual { position: relative; z-index: 1; }.product-shell h2 { max-width: 650px; margin-bottom: 21px; color: var(--ink); font-size: clamp(33px, 4.2vw, 57px); letter-spacing: -.045em; line-height: 1.14; }.product-description { max-width: 575px; margin-bottom: 26px; color: var(--muted); font-size: 14px; font-weight: 600; transition: opacity .18s ease, transform .18s ease; }.product-description.is-switching { opacity: 0; transform: translateY(5px); }.product-switch { display: flex; gap: 7px; margin-bottom: 18px; padding: 4px; width: max-content; border: 1px solid rgba(239,127,163,.14); border-radius: 999px; background: rgba(255,255,255,.62); }.product-tab { padding: 8px 15px; border: 0; border-radius: 999px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; cursor: pointer; transition: background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease; }.product-tab.is-active, .product-tab:hover, .product-tab:focus-visible { background: #fff; color: var(--pink-deep); box-shadow: 0 8px 17px rgba(202,139,161,.1); transform: translateY(-1px); }.product-tags { display: flex; flex-wrap: wrap; gap: 8px; min-height: 28px; margin-bottom: 29px; }.product-tags span { padding: 5px 10px; border: 1px solid rgba(239,127,163,.16); border-radius: 999px; background: rgba(255,255,255,.55); color: var(--pink-deep); font-size: 11px; font-weight: 800; }.product-visual { min-height: 350px; }
.report-window { position: absolute; width: 320px; min-height: 250px; padding: 19px; border: 1px solid rgba(239,127,163,.16); border-radius: var(--radius-lg); background: rgba(255,255,255,.72); box-shadow: var(--shadow); }.report-back { top: 33px; right: 6%; background: rgba(255,255,255,.46); transform: rotate(8deg); opacity: .78; }.report-back::after { position: absolute; content: ""; inset: 40px 24px auto; height: 7px; border-radius: 99px; background: rgba(239,127,163,.16); box-shadow: 0 28px rgba(164,151,228,.15), 0 56px rgba(114,196,182,.15), 0 84px rgba(229,183,104,.16); }.report-front { top: 60px; left: 4%; min-height: 315px; background: rgba(255,255,255,.92); color: var(--ink); transform: rotate(-6deg); transition: transform .35s ease, box-shadow .35s ease; }.report-front:hover { box-shadow: var(--shadow-hover); transform: rotate(-3deg) translateY(-5px); }.report-window-top { color: var(--pink-deep); font-size: 11px; font-weight: 900; }.report-dots { color: #cba9b6; letter-spacing: 4px; }.report-score-row { display: flex; align-items: center; gap: 14px; margin: 27px 0 22px; }.score-ring { display: grid; place-items: center; width: 84px; height: 84px; border: 9px solid #f9e5ed; border-top-color: var(--pink); border-right-color: var(--peach); border-radius: 50%; }.score-ring span { font-size: 24px; font-weight: 800; line-height: 1; }.score-ring small { color: var(--muted); font-size: 9px; }.report-score-row strong, .report-score-row span { display: block; }.report-score-row strong { margin-bottom: 4px; color: var(--ink); font-size: 17px; }.report-score-row span { color: var(--muted); font-size: 10px; }.report-bars { display: grid; gap: 11px; }.report-bars div { display: grid; grid-template-columns: 78px 1fr; gap: 10px; align-items: center; }.report-bars span { color: var(--muted); font-size: 10px; }.report-bars i { height: 7px; overflow: hidden; border-radius: 99px; background: #f4e6ec; }.report-bars b { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--pink), var(--peach)); }.report-bars div:nth-child(2) b { background: linear-gradient(90deg, var(--mint), #a4dfd4); }.report-bars div:nth-child(3) b { background: linear-gradient(90deg, var(--violet), #d2c9f4); }.report-bars div:nth-child(4) b { background: linear-gradient(90deg, var(--gold), #f2d89b); }.report-footer { margin-top: 24px; padding-top: 13px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }.report-footer strong { color: var(--pink); font-size: 17px; }.product-observe-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; max-width: 1160px; margin: 19px auto 0; }.product-observe-grid article { padding: 18px 16px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-md); background: rgba(255,255,255,.72); box-shadow: 0 10px 22px rgba(202,139,161,.05); transition: transform .2s ease, box-shadow .2s ease; }.product-observe-grid article:hover { box-shadow: var(--shadow-hover); transform: translateY(-4px); }.product-observe-grid strong { display: block; margin: 19px 0 8px; color: var(--ink); font-size: 15px; }.product-observe-grid p { min-height: 65px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }

.platform-section { background: rgba(255,255,255,.56); }.platform-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 70px; max-width: 1160px; margin: 0 auto; }.platform-lead { max-width: 500px; color: var(--muted); font-size: 14px; font-weight: 600; }.platform-quote { margin-top: 30px; padding: 15px 19px; border-left: 4px solid var(--pink); border-radius: 0 16px 16px 0; background: rgba(255,243,247,.72); color: var(--pink-deep); font-size: 14px; }.platform-quote strong { color: var(--ink); font-size: 18px; }.signal-board { padding: 26px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-xl); background: rgba(255,255,255,.75); box-shadow: var(--shadow); }.board-header { padding-bottom: 15px; border-bottom: 1px solid var(--line); color: var(--pink-deep); font-size: 11px; font-weight: 900; letter-spacing: .1em; }.board-main { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 28px; padding: 32px 18px; }.radar-placeholder { position: relative; width: min(260px,100%); aspect-ratio: 1; margin: auto; border: 1px solid rgba(239,127,163,.2); border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 24%, rgba(239,127,163,.11) 24% 25%); }.radar-placeholder::before, .radar-placeholder::after { position: absolute; content: ""; background: rgba(239,127,163,.18); }.radar-placeholder::before { top: 50%; left: 0; width: 100%; height: 1px; }.radar-placeholder::after { top: 0; left: 50%; width: 1px; height: 100%; }.radar-placeholder span, .radar-placeholder i, .radar-placeholder b, .radar-placeholder em, .radar-placeholder small { position: absolute; z-index: 1; width: 10px; height: 10px; border-radius: 50%; background: var(--pink); box-shadow: 0 0 0 5px rgba(239,127,163,.12); }.radar-placeholder span { top: 17%; left: 48%; }.radar-placeholder i { top: 36%; right: 13%; background: var(--mint); }.radar-placeholder b { bottom: 20%; right: 26%; background: var(--gold); }.radar-placeholder em { bottom: 28%; left: 17%; background: var(--violet); }.radar-placeholder small { top: 40%; left: 13%; width: 7px; height: 7px; background: var(--peach); }.radar-placeholder span::after, .radar-placeholder i::after, .radar-placeholder b::after, .radar-placeholder em::after { position: absolute; content: ""; width: 92px; height: 1px; transform-origin: left; background: rgba(239,127,163,.38); }.radar-placeholder span::after { top: 4px; left: 4px; transform: rotate(72deg); }.radar-placeholder i::after { top: 4px; left: 4px; transform: rotate(145deg); }.radar-placeholder b::after { top: 4px; left: 4px; transform: rotate(210deg); }.radar-placeholder em::after { top: 4px; left: 4px; transform: rotate(300deg); }.board-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.board-metrics div { padding: 15px 12px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.72); }.board-metrics span, .board-metrics strong { display: block; }.board-metrics span { color: var(--muted); font-size: 10px; }.board-metrics strong { margin-top: 12px; color: var(--pink-deep); font-size: 28px; line-height: 1; }.board-metrics div:nth-child(2) strong { color: var(--mint); }.board-metrics div:nth-child(3) strong { color: var(--gold); }.board-bottom { justify-content: flex-start; flex-wrap: wrap; padding-top: 16px; border-top: 1px solid var(--line); color: var(--soft); font-size: 10px; }.legend-dot { display: inline-block; width: 8px; height: 8px; margin-right: -4px; border-radius: 50%; }.blue-dot { background: var(--pink); }.teal-dot { background: var(--mint); }.gold-dot { background: var(--gold); }

.advantage-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 1160px; margin: 0 auto; }.advantage-card { min-height: 230px; padding: 24px; background: rgba(255,255,255,.7); box-shadow: 0 10px 22px rgba(202,139,161,.05); }.advantage-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 14px; background: #fff3f7; }.teal-bg { background: #edf9f6; color: var(--mint); }.gold-bg { background: #fff7e8; color: var(--gold); }.rose-bg { background: #fff0f3; color: var(--pink-deep); }.advantage-card h3 { margin: 26px 0 8px; color: var(--ink); font-size: 19px; }.advantage-card p { font-size: 13px; }

.process-track { display: grid; grid-template-columns: repeat(7, 1fr); max-width: 1160px; margin: 0 auto; padding-top: 20px; border-top: 1px solid rgba(239,127,163,.28); }.process-step { position: relative; padding: 15px 16px 0 0; }.process-step::before { position: absolute; content: ""; top: -26px; left: 0; width: 11px; height: 11px; border: 3px solid #fff8fb; border-radius: 50%; background: var(--pink); box-shadow: 0 0 0 1px var(--pink); }.process-step:not(:last-child)::after { position: absolute; content: "→"; top: -34px; right: 9px; color: rgba(239,127,163,.52); font-size: 18px; }.process-step:nth-child(2n)::before { background: var(--mint); box-shadow: 0 0 0 1px var(--mint); }.process-step:nth-child(3n)::before { background: var(--gold); box-shadow: 0 0 0 1px var(--gold); }.process-step > span { color: var(--pink-deep); font-size: 11px; font-weight: 900; }.process-step h3 { min-height: 48px; margin: 14px 0 8px; color: var(--ink); font-size: 15px; line-height: 1.45; }.process-step p { margin: 0; color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.7; }

.partner-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; max-width: 1160px; margin: 0 auto; }.partner-card { min-height: 220px; padding: 22px; background: rgba(255,255,255,.72); box-shadow: 0 10px 22px rgba(202,139,161,.05); }.partner-card > span { color: var(--pink-deep); font-size: 10px; font-weight: 900; letter-spacing: .1em; }.partner-card h3 { margin: 31px 0 9px; color: var(--ink); font-size: 18px; line-height: 1.45; }

.section-boundary { padding-top: 78px; padding-bottom: 78px; background: rgba(244,251,248,.72); }.boundary-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; max-width: 1160px; margin: 0 auto; align-items: center; }.boundary-layout h2 { margin: 0; color: var(--ink); font-size: clamp(34px, 4.5vw, 56px); line-height: 1.12; letter-spacing: -.04em; }.boundary-layout h2 span { color: var(--mint); }.boundary-copy { color: #657873; font-size: 14px; font-weight: 600; }.boundary-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 25px; }.boundary-pills span { padding: 7px 11px; border: 1px solid rgba(98,191,174,.25); border-radius: 999px; background: rgba(255,255,255,.62); color: var(--good); font-size: 11px; font-weight: 800; }

.contact-section { position: relative; max-width: 1280px; margin: 18px auto; overflow: hidden; padding: 120px max(24px, 7vw); border: 1px solid rgba(255,255,255,.94); border-radius: var(--radius-xl); background: linear-gradient(135deg, #fff3f7 0%, #fff0e5 56%, #f6f1ff 100%); color: var(--ink); box-shadow: var(--shadow); }.contact-inner { position: relative; z-index: 1; max-width: 1160px; margin: 0 auto; }.contact-section h2 { max-width: 760px; margin-bottom: 25px; color: var(--ink); font-size: clamp(43px, 6vw, 75px); font-weight: 800; letter-spacing: -.05em; line-height: 1.1; }.contact-section p:not(.section-kicker) { max-width: 470px; margin-bottom: 28px; color: var(--muted); font-size: 15px; font-weight: 600; }.contact-orbit { position: absolute; border: 1px solid rgba(239,127,163,.22); border-radius: 50%; }.orbit-contact-one { width: 620px; height: 620px; top: -270px; right: -60px; box-shadow: 0 0 0 45px rgba(239,127,163,.04), 0 0 0 90px rgba(164,151,228,.04); }.orbit-contact-two { width: 330px; height: 330px; top: 80px; right: 100px; border-style: dashed; border-color: rgba(164,151,228,.35); }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 18px; padding: 30px max(24px, 7vw); background: #302a32; color: #eadde4; }.footer-brand { display: flex; align-items: center; gap: 10px; }.small-mark { width: 31px; height: 31px; border-radius: 12px; background: linear-gradient(135deg, var(--pink), var(--peach)); color: #fff; font-size: 16px; }.footer-brand strong, .footer-brand span { display: block; }.footer-brand strong { color: #fff; font-size: 14px; letter-spacing: .08em; }.footer-brand span { color: #c9b9c1; font-size: 10px; }.footer-meta { display: flex; gap: 25px; color: #c9b9c1; font-size: 10px; }.footer-note { max-width: 250px; color: #b7a6ae; font-size: 10px; text-align: right; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .65s ease, transform .65s ease; }.reveal.is-visible { opacity: 1; transform: translateY(0); }.reveal-delay { transition-delay: .12s; }.reveal-delay-1 { transition-delay: .08s; }.reveal-delay-2 { transition-delay: .15s; }.reveal-delay-3 { transition-delay: .22s; }

@media (max-width: 1100px) {
  .topbar { gap: 13px; padding-inline: 4vw; }.main-nav { gap: 2px; }.main-nav a { padding-inline: 9px; }.nav-cta { padding-inline: 12px; }
  .hero { padding-inline: 5vw; }.hero-grid { gap: 35px; grid-template-columns: 1fr 1fr; }.hero-visual { transform: scale(.9); transform-origin: center right; }
  .section { padding-inline: 5vw; }.audience-grid, .method-grid, .partner-grid { grid-template-columns: repeat(2, 1fr); }.audience-card { min-height: 315px; }.product-shell { padding-inline: 42px; }.product-observe-grid { grid-template-columns: repeat(3, 1fr); }.product-observe-grid article:last-child { grid-column: 2; }.process-track { grid-template-columns: repeat(4, 1fr); gap: 35px 12px; }.process-step:not(:last-child)::after { display: none; }
}

@media (max-width: 760px) {
  .topbar { min-height: 68px; padding: 8px 18px; }.main-nav { position: absolute; top: 68px; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 18px 15px; border-bottom: 1px solid var(--line); background: rgba(255,250,248,.97); box-shadow: 0 15px 30px rgba(202,139,161,.1); }.main-nav.is-open { display: flex; }.main-nav a { padding: 13px 3px; border-bottom: 1px solid var(--line); border-radius: 0; }.nav-cta { display: none; }.menu-toggle { display: block; margin-left: auto; }
  .hero { min-height: auto; padding: 70px 22px 52px; }.hero-grid { grid-template-columns: 1fr; gap: 15px; }.hero h1 { font-size: clamp(51px, 16vw, 77px); }.hero-lead { font-size: 14px; }.hero-visual { min-height: 385px; transform: none; }.hero-panel-main { right: 1%; width: 90%; }.float-top { left: 0; }.float-bottom { right: 0; }.orbit-one { left: 0; width: 340px; height: 340px; }.orbit-two { left: 12%; width: 270px; height: 270px; }.hero-scroll-hint { margin-top: 45px; }
  .section { padding: 76px 22px; }.section::before { top: 22px; }.section-heading { margin-bottom: 35px; }.section-heading h2, .brand-story h2 { font-size: 38px; }.split-heading { display: block; }.heading-aside { margin-top: 20px; font-size: 13px; }.problem-layout, .brand-story, .platform-layout, .boundary-layout { grid-template-columns: 1fr; gap: 38px; }.problem-grid { gap: 9px; }.info-card { min-height: 198px; padding: 17px; }.info-card h3 { margin-top: 20px; font-size: 16px; }.info-card p { font-size: 12px; }.story-mark { width: 150px; margin: 0 auto; font-size: 48px; }.brand-story p { font-size: 14px; }.story-proof { grid-template-columns: 1fr; }
  .audience-grid, .method-grid, .advantage-grid, .partner-grid { grid-template-columns: 1fr; }.audience-card { min-height: 295px; }.method-card { grid-template-columns: 48px 1fr; }.method-letter { font-size: 37px; }.architecture-layout { grid-template-columns: 1fr; gap: 18px; }.architecture-lines { grid-template-columns: repeat(3, 1fr); gap: 10px; }.architecture-branches article { grid-template-columns: 40px 1fr; gap: 7px 12px; }.architecture-branches p { grid-column: 2; }.service-strip { gap: 9px; }
  .product-section { padding: 75px 15px; }.product-shell { grid-template-columns: 1fr; gap: 10px; padding: 35px 22px 23px; border-radius: 22px; }.product-shell h2 { font-size: 35px; }.product-description { font-size: 13px; }.product-visual { min-height: 335px; }.report-window { width: 278px; }.report-front { left: 0; }.report-back { right: 0; }.product-observe-grid { grid-template-columns: 1fr 1fr; }.product-observe-grid article:last-child { grid-column: span 2; }.product-observe-grid p { min-height: 0; }.signal-board { padding: 18px; }.board-main { grid-template-columns: 1fr; gap: 24px; }.board-metrics { width: 100%; }.radar-placeholder { width: 215px; }
  .process-track { grid-template-columns: 1fr 1fr; gap: 35px 20px; }.process-step { padding-right: 0; }.process-step h3 { min-height: 0; }.section-boundary { padding-top: 70px; padding-bottom: 70px; }.contact-section { margin-inline: 15px; padding: 90px 22px; }.contact-section h2 { font-size: 45px; }.site-footer { display: grid; gap: 17px; padding: 25px 22px; }.footer-meta { display: grid; gap: 4px; }.footer-note { text-align: left; }
}

@media (max-width: 420px) {
  .brand-copy small { display: none; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 16px; }.problem-grid { grid-template-columns: 1fr; }.info-card { min-height: auto; }.product-observe-grid { grid-template-columns: 1fr; }.product-observe-grid article:last-child { grid-column: auto; }.contact-section h2 { font-size: 40px; }.report-window { width: 255px; }.report-front { left: -4%; }.report-back { right: -4%; }
}

/* Third edition: a compact, product-led mini-program visual. */
.hero-app-shell { position: absolute; top: 35px; right: 3%; z-index: 2; width: min(414px, 92%); padding: 18px 18px 12px; border: 1px solid rgba(255,255,255,.95); border-radius: 32px; background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(255,242,247,.86) 54%, rgba(246,242,255,.86)); box-shadow: 0 24px 52px rgba(202,139,161,.18), inset 0 1px rgba(255,255,255,.95); backdrop-filter: blur(20px); transform: rotate(2.4deg); transition: transform .35s ease, box-shadow .35s ease; }
.hero-app-shell:hover { box-shadow: 0 30px 62px rgba(202,139,161,.23), inset 0 1px rgba(255,255,255,.95); transform: rotate(.8deg) translateY(-5px); }
.app-shell-head, .app-brand-lockup, .app-system-row, .app-bottom-nav { display: flex; align-items: center; }
.app-shell-head { justify-content: space-between; padding-bottom: 13px; border-bottom: 1px solid rgba(239,224,231,.82); }
.app-brand-lockup { gap: 9px; }.app-brand-mark { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 11px; background: linear-gradient(135deg, var(--pink), var(--peach)); color: #fff; font-size: 16px; font-weight: 900; box-shadow: 0 8px 17px rgba(239,127,163,.2); }.app-brand-lockup strong, .app-brand-lockup small { display: block; line-height: 1.2; }.app-brand-lockup strong { color: var(--ink); font-size: 13px; letter-spacing: .08em; }.app-brand-lockup small { margin-top: 3px; color: var(--soft); font-size: 8px; letter-spacing: .05em; }.app-state { padding: 5px 9px; border: 1px solid rgba(114,196,182,.22); border-radius: 999px; background: rgba(244,251,248,.8); color: var(--good); font-size: 9px; font-weight: 800; }
.app-greeting { display: grid; gap: 2px; padding: 16px 1px 13px; }.app-greeting span { color: var(--pink-deep); font-size: 10px; font-weight: 800; }.app-greeting strong { color: var(--ink); font-size: 15px; line-height: 1.45; letter-spacing: -.02em; }
.app-feature-card { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 130px; padding: 19px 20px; overflow: hidden; border: 1px solid rgba(255,255,255,.86); border-radius: 23px; background: linear-gradient(128deg, #ffd6e2, #f9b7c7 45%, #f7d9c4); box-shadow: 0 13px 25px rgba(239,127,163,.15); }.app-feature-card > div:first-child { position: relative; z-index: 1; }.app-feature-kicker { display: block; margin-bottom: 7px; color: rgba(125,61,81,.75); font-size: 8px; font-weight: 900; letter-spacing: .12em; }.app-feature-card strong { display: block; color: #5b3042; font-size: 25px; letter-spacing: -.04em; line-height: 1.1; }.app-feature-card p { max-width: 195px; margin: 7px 0 12px; color: rgba(91,48,66,.72); font-size: 10px; line-height: 1.5; }.app-feature-card button { padding: 6px 10px; border: 0; border-radius: 999px; background: rgba(255,255,255,.78); color: var(--pink-deep); font-size: 9px; font-weight: 900; }.app-feature-orbit { position: relative; width: 92px; height: 92px; margin-right: 4px; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; box-shadow: 0 0 0 13px rgba(255,255,255,.16), 0 0 0 26px rgba(255,255,255,.09); }.app-feature-orbit::before, .app-feature-orbit::after { position: absolute; border-radius: 50%; content: ""; }.app-feature-orbit::before { inset: 19px; border: 1px dashed rgba(255,255,255,.75); }.app-feature-orbit::after { top: 9px; left: 47px; width: 8px; height: 8px; background: #fff; box-shadow: 0 0 0 6px rgba(255,255,255,.18); }.app-feature-orbit i, .app-feature-orbit b, .app-feature-orbit em, .app-feature-orbit span { position: absolute; display: grid; place-items: center; border-radius: 50%; font-style: normal; }.app-feature-orbit i { top: 14px; right: 11px; width: 9px; height: 9px; background: var(--violet); }.app-feature-orbit b { right: 12px; bottom: 16px; width: 11px; height: 11px; background: var(--gold); }.app-feature-orbit em { bottom: 17px; left: 9px; width: 8px; height: 8px; background: var(--mint); }.app-feature-orbit span { inset: 32px; background: rgba(255,255,255,.55); color: #fff; font-size: 18px; font-weight: 900; }
.app-shortcuts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 14px 2px 12px; }.app-shortcuts > div { display: grid; justify-items: center; gap: 6px; }.shortcut-icon { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 11px; color: #fff; font-size: 12px; font-weight: 900; box-shadow: 0 6px 13px rgba(202,139,161,.12); }.shortcut-pink { background: linear-gradient(135deg, var(--pink), var(--peach)); }.shortcut-violet { background: linear-gradient(135deg, var(--violet), #c9c0f0); }.shortcut-gold { background: linear-gradient(135deg, var(--gold), #f2d89b); }.shortcut-mint { background: linear-gradient(135deg, var(--mint), #a5ded4); }.app-shortcuts small { color: var(--muted); font-size: 9px; font-weight: 700; }
.app-system-row { gap: 8px; }.app-system-row > div { flex: 1; min-width: 0; padding: 10px 11px; border: 1px solid rgba(239,224,231,.86); border-radius: 14px; background: rgba(255,255,255,.66); }.app-system-row span, .app-system-row strong, .app-system-row small { display: block; }.app-system-row span { color: var(--pink-deep); font-size: 8px; font-weight: 900; letter-spacing: .07em; }.app-system-row strong { margin-top: 4px; color: var(--ink); font-size: 11px; }.app-system-row small { margin-top: 2px; overflow: hidden; color: var(--soft); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.app-system-row > div:nth-child(2) span { color: var(--mint); }
.app-bottom-nav { justify-content: space-around; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(239,224,231,.82); color: #b6a7ad; font-size: 15px; }.app-bottom-nav span { display: grid; justify-items: center; gap: 2px; min-width: 42px; line-height: 1; }.app-bottom-nav span.is-active { color: var(--pink-deep); }.app-bottom-nav small { font-size: 8px; font-weight: 700; }
.company-intro-lead { color: var(--ink-soft) !important; font-size: 17px !important; font-weight: 800 !important; line-height: 1.65; }
.product-board { padding: 23px; border: 1px solid rgba(239,224,231,.92); border-radius: var(--radius-xl); background: rgba(255,255,255,.78); box-shadow: var(--shadow); }.product-board-head, .product-board-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.product-board-head { padding-bottom: 14px; border-bottom: 1px solid var(--line); color: var(--pink-deep); font-size: 10px; font-weight: 900; letter-spacing: .08em; }.product-board-main { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; padding: 20px 0 16px; }.product-tile { position: relative; min-height: 153px; padding: 17px; overflow: hidden; border: 1px solid rgba(255,255,255,.86); border-radius: 18px; background: linear-gradient(140deg, #fff3f7, #fffafa); box-shadow: 0 10px 20px rgba(202,139,161,.05); }.product-tile::after { position: absolute; right: -28px; bottom: -34px; width: 106px; height: 106px; border: 1px solid rgba(239,127,163,.16); border-radius: 50%; content: ""; box-shadow: 0 0 0 14px rgba(239,127,163,.04); }.product-tile-platform { background: linear-gradient(140deg, #fff0f5, #fff9f1); }.product-tile-assessment { background: linear-gradient(140deg, #fff6e9, #fffafa); }.product-tile-ability { background: linear-gradient(140deg, #f3fbf9, #fffafa); }.product-tile-focus { background: linear-gradient(140deg, #f7f4ff, #fffafa); }.product-tile > span, .product-tile > strong, .product-tile > p, .product-tile > b { position: relative; z-index: 1; display: block; }.product-tile > span { color: var(--pink-deep); font-size: 8px; font-weight: 900; letter-spacing: .08em; }.product-tile > strong { margin-top: 13px; color: var(--ink); font-size: 14px; line-height: 1.35; }.product-tile > p { max-width: 190px; margin: 6px 0 12px; color: var(--muted); font-size: 10px; line-height: 1.6; }.product-tile > b { width: max-content; padding: 4px 7px; border-radius: 999px; background: rgba(255,255,255,.7); color: var(--pink-deep); font-size: 8px; }.product-tile-ability > span, .product-tile-ability > b { color: var(--good); }.product-tile-focus > span, .product-tile-focus > b { color: #8272c9; }.product-board-foot { padding-top: 13px; border-top: 1px solid var(--line); color: var(--soft); font-size: 10px; }.product-board-foot span { padding: 4px 7px; border-radius: 999px; background: rgba(250,244,247,.84); }

@media (max-width: 1100px) {
  .hero-app-shell { right: 0; width: min(400px, 96%); transform: rotate(1.8deg); }
}

@media (max-width: 760px) {
  .hero-app-shell { top: 15px; right: 2%; width: 94%; padding: 16px 15px 11px; transform: rotate(1.2deg); }.hero-visual { min-height: 455px; }.app-feature-card { min-height: 122px; padding-inline: 16px; }.app-feature-card strong { font-size: 23px; }.app-feature-orbit { width: 80px; height: 80px; }.app-feature-orbit span { inset: 28px; }.app-feature-orbit::after { left: 41px; }.product-board { padding: 18px; }.product-board-main { gap: 8px; }.product-tile { min-height: 145px; padding: 14px; }.product-tile > strong { font-size: 13px; }.product-board-foot { flex-wrap: wrap; justify-content: flex-start; }.company-intro-lead { font-size: 15px !important; }
}

@media (max-width: 420px) {
  .hero-app-shell { width: 97%; right: 0; padding-inline: 12px; }.app-feature-card p { max-width: 160px; }.app-feature-orbit { width: 68px; height: 68px; }.app-feature-orbit span { inset: 23px; font-size: 15px; }.app-feature-orbit::after { top: 6px; left: 30px; }.app-shortcuts small { font-size: 8px; }.app-system-row > div { padding-inline: 8px; }.product-board-main { grid-template-columns: 1fr 1fr; }.product-tile { min-height: 151px; }.product-tile > p { font-size: 9px; }
}

@media (min-width: 761px) {
  .advantage-grid .advantage-card:last-child { grid-column: 2; }
}

.contact-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; }.contact-home-link { color: var(--pink-deep); }.contact-home-link:hover { color: var(--pink); }

@media (max-width: 760px) {
  .contact-actions { align-items: flex-start; flex-direction: column; gap: 15px; }
}

@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; }
}