:root { --product-navy:#071a39; --product-blue:#123f82; }
.product-page { background:var(--bg); color:var(--text-1); }
.product-nav { background:rgba(255,255,255,.92); }
.product-nav-links { display:flex; align-items:center; gap:28px; }
.product-nav-links > a { color:var(--text-2); font-size:14px; font-weight:600; text-decoration:none; }
.product-nav-links .nav-cta { color:#fff; }
.product-hero { min-height:660px; overflow:hidden; position:relative; padding:150px 0 90px; background:linear-gradient(125deg,#07162f 0%,#0b2f64 58%,#0c478a 100%); color:#fff; }
.product-hero::after { content:''; position:absolute; inset:0; opacity:.3; background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:44px 44px; }
.product-hero-inner { position:relative; z-index:1; display:grid; grid-template-columns:1.05fr .95fr; gap:72px; align-items:center; }
.product-copy h1 { margin:16px 0 20px; font-size:clamp(42px,5vw,68px); font-weight:900; letter-spacing:-.06em; line-height:1.08; }.product-copy h1 em { color:var(--gold); font-style:normal; }
.product-copy > p { max-width:560px; color:rgba(255,255,255,.7); font-size:17px; line-height:1.85; }.product-kicker { color:rgba(255,255,255,.7); font-size:13px; font-weight:700; letter-spacing:.08em; }.product-kicker span,.live-dot { display:inline-block; width:8px; height:8px; margin-right:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 5px rgba(240,160,32,.15); }.product-actions { display:flex; gap:14px; margin-top:32px; }.product-actions .btn-ghost { border-color:rgba(255,255,255,.45); color:#fff; }.member-note { margin-top:17px; font-size:12px!important; color:rgba(255,255,255,.48)!important; }
.product-window { position:relative; border:1px solid rgba(255,255,255,.2); border-radius:18px; overflow:hidden; background:rgba(255,255,255,.96); box-shadow:0 28px 70px rgba(0,0,0,.36); transform:rotate(2deg); }.window-bar { height:44px; display:flex; align-items:center; gap:7px; padding:0 16px; color:#6c7d95; font-size:12px; border-bottom:1px solid #e6eaf0; }.window-bar i { width:8px; height:8px; border-radius:50%; background:#e5a347; }.window-bar i:nth-child(2){background:#b5c0ce}.window-bar i:nth-child(3){background:#c8d1dc}.window-bar span { margin-left:6px; }.window-content { padding:25px; color:var(--text-1); }.window-status { display:flex; align-items:center; color:#61728c; font-size:12px; }.window-status b { margin-left:auto; color:var(--navy); }.live-dot { width:7px; height:7px; margin-right:7px; background:#21aa68; box-shadow:0 0 0 5px rgba(33,170,104,.13); }.interviewer-bubble { margin:22px 0 18px; max-width:88%; padding:16px 18px; border-radius:14px 14px 14px 3px; background:#edf2fa; color:#263b59; font-size:14px; line-height:1.65; }.analysis-card { padding:17px 18px; border:1px solid #ecd3a0; border-radius:13px; background:#fffaf0; }.analysis-card small { color:#b47a15; font-size:11px; font-weight:700; }.analysis-card strong { display:block; margin:6px 0 14px; font-size:15px; }.analysis-lines { display:flex; gap:7px; }.analysis-lines i { height:5px; flex:1; border-radius:6px; background:#e4c67d; }.analysis-lines i:nth-child(2){flex:1.8}.recording-row { display:flex; align-items:center; gap:8px; margin-top:20px; color:#74839a; font-size:12px; }.mic-icon { color:#d1534a; }.recording-row button { margin-left:auto; border:0; border-radius:7px; padding:8px 10px; color:#fff; background:var(--navy); font-size:11px; }.product-orbit { position:absolute; z-index:0; width:560px; height:560px; border:1px solid rgba(240,160,32,.18); border-radius:50%; }.product-orbit-a { top:-260px; right:-120px; }.product-orbit-b { width:780px; height:780px; right:-250px; bottom:-550px; }
.product-section { padding:110px 0; }.fade-static { opacity:1; transform:none; }.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:48px; }
.product-section-features { position:relative; overflow:hidden; color:#fff; background:linear-gradient(132deg,#0b2854,#123f7e); }.product-section-features::before { content:''; position:absolute; width:460px; height:460px; right:-180px; top:-240px; border-radius:50%; border:1px solid rgba(240,160,32,.24); box-shadow:0 0 0 60px rgba(240,160,32,.035),0 0 0 120px rgba(240,160,32,.025); }.product-section-features .container { position:relative; z-index:1; }.product-section-features .section-title { color:#fff; }.product-section-features .section-sub { color:rgba(255,255,255,.65); }
.product-feature { min-height:270px; padding:30px; border:1px solid rgba(255,255,255,.16); border-radius:var(--r-xl); background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.055)); box-shadow:0 14px 32px rgba(0,0,0,.12); transition:transform .22s,background .22s; }.product-feature:hover { transform:translateY(-5px); background:linear-gradient(145deg,rgba(255,255,255,.2),rgba(255,255,255,.09)); }.feature-number { color:var(--gold); font-size:13px; font-weight:800; letter-spacing:.08em; }.product-feature h3 { margin:36px 0 12px; font-size:19px; color:#fff; }.product-feature p { color:rgba(255,255,255,.7); font-size:14px; line-height:1.75; }
.product-section-scenarios { position:relative; overflow:hidden; background:linear-gradient(120deg,#dfeaf9 0%,#eef4fb 65%,#d6e5f7 100%); }.product-section-scenarios::after { content:'MMJD'; position:absolute; right:-16px; bottom:-44px; color:rgba(18,63,130,.055); font-size:160px; font-weight:900; letter-spacing:-.08em; }.scenario-layout { position:relative; z-index:1; display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:center; }.scenario-intro { margin-top:20px; max-width:420px; color:#46617f; line-height:1.8; }.scenario-list { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.scenario-list div { position:relative; min-height:132px; padding:25px; border-radius:16px; color:#fff; border:1px solid rgba(8,37,79,.13); background:linear-gradient(145deg,#173e78,#0d2d5d); box-shadow:0 12px 24px rgba(23,62,120,.14); }.scenario-list div::before { content:''; position:absolute; top:22px; left:0; width:3px; height:28px; border-radius:0 4px 4px 0; background:var(--gold); }.scenario-list b { display:block; margin-bottom:10px; font-size:16px; }.scenario-list span { color:rgba(255,255,255,.7); font-size:13px; line-height:1.65; }
.member-section { padding-top:92px; padding-bottom:92px; background:#fff; }.member-benefits { display:grid; grid-template-columns:.82fr 1.18fr; gap:74px; align-items:center; padding:44px 0; border-top:1px solid #dfe7f2; border-bottom:1px solid #dfe7f2; }.member-benefits-intro h2 { margin:12px 0; color:var(--navy); font-size:32px; line-height:1.3; }.member-benefits-intro p { max-width:330px; color:var(--text-2); font-size:14px; line-height:1.8; }.member-benefits-list { display:flex; flex-direction:column; }.member-benefits-list > div { display:grid; grid-template-columns:42px 1fr; gap:16px; padding:17px 0; border-bottom:1px solid #e8edf4; }.member-benefits-list > div:first-child { padding-top:0; }.member-benefits-list > div:last-child { padding-bottom:0; border-bottom:0; }.member-benefits-list span { color:var(--gold); font-size:13px; font-weight:800; letter-spacing:.06em; }.member-benefits-list p { color:var(--text-2); font-size:14px; line-height:1.7; }.member-benefits-list b { margin-right:10px; color:var(--text-1); font-size:15px; }
.download-section { padding:110px 0; color:#fff; background:var(--product-navy); }.download-heading { text-align:center; }.download-heading h2 { margin:12px 0; font-size:36px; }.download-heading p { color:rgba(255,255,255,.6); }.download-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:44px; }.download-card { display:block; padding:32px; border:1px solid rgba(255,255,255,.16); border-radius:18px; color:#fff; background:rgba(255,255,255,.055); text-decoration:none; transition:transform .2s,background .2s; }.download-card:hover { transform:translateY(-5px); background:rgba(255,255,255,.1); }.featured-download { border-color:rgba(240,160,32,.75); box-shadow:inset 0 0 0 1px rgba(240,160,32,.16); }.download-platform { color:var(--gold); font-size:12px; font-weight:800; letter-spacing:.08em; }.download-card h3 { margin:20px 0 8px; font-size:21px; }.download-card p { min-height:42px; color:rgba(255,255,255,.6); font-size:13px; line-height:1.6; }.download-card b { display:block; margin-top:23px; font-size:14px; }.download-card em { margin-left:8px; color:var(--gold); font-style:normal; }.download-help { margin-top:26px; text-align:center; color:rgba(255,255,255,.45); font-size:12px; }.product-footer { padding:27px 0; }
@media (max-width:1024px){.product-hero-inner,.scenario-layout,.member-benefits{grid-template-columns:1fr;gap:45px}.product-window{max-width:560px}.feature-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.product-nav-links{gap:16px}.product-nav-links>a:not(.nav-cta){display:none}.product-hero{padding:125px 0 70px}.product-copy h1{font-size:46px}.product-actions{flex-direction:column;align-items:flex-start}.feature-grid,.scenario-list,.download-grid{grid-template-columns:1fr}.product-section,.download-section{padding:75px 0}.member-section{padding-top:65px;padding-bottom:65px}.member-benefits{padding:30px 0}.member-benefits-intro h2{font-size:27px}.member-benefits-list > div{grid-template-columns:35px 1fr}.download-heading h2{font-size:29px}.product-footer .footer-bottom{gap:12px}}
