:root { --nb-red:#e30613; --nb-gold:#f4c95d; --nb-ink:#080808; --nb-soft:#bdb9b5; }
html { scrollbar-color:#c80d15 #080808; scrollbar-width:thin; }
html::-webkit-scrollbar { width:11px; }
html::-webkit-scrollbar-track { background:#080808; }
html::-webkit-scrollbar-thumb { border:2px solid #080808; border-radius:20px; background:linear-gradient(#ef1c25,#8e070c); }
.notebook-premium-page { background:#080808; color:#fff; }
.notebook-premium-page .container { width:min(1220px,calc(100% - 40px)); max-width:none; padding:0; }
.notebook-premium-page em { color:var(--nb-gold); font-style:normal; }
.notebook-premium-page .section-kicker { display:inline-block; margin-bottom:13px; color:#ef4147; font-size:.68rem; font-weight:850; letter-spacing:.19em; text-transform:uppercase; }

.nb-hero { --nb-progress:0; position:relative; height:230svh; min-height:1500px; background:radial-gradient(circle at 72% 26%,rgba(171,17,23,.22),transparent 35%),linear-gradient(180deg,#050505 0%,#0b0909 70%,#090909 100%); }
.nb-hero::before { content:""; position:absolute; inset:0; opacity:.24; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(to bottom,#000,transparent 85%); }
.nb-hero-sticky { position:sticky; top:0; min-height:100svh; display:grid; align-items:center; overflow:hidden; padding:108px 0 42px; }
.nb-hero-grid { display:grid; grid-template-columns:minmax(0,.82fr) minmax(520px,1.18fr); align-items:center; gap:32px; }
.nb-breadcrumb { margin:0 0 19px; color:#817d7a; font-size:.76rem; }
.nb-breadcrumb a:hover { color:#fff; }
.nb-live { display:inline-flex; align-items:center; gap:9px; margin-bottom:16px; color:#f1666a; font-size:.64rem; font-weight:900; letter-spacing:.18em; }
.nb-live i { width:7px; height:7px; border-radius:50%; background:#ee1721; box-shadow:0 0 15px #ee1721; }
.nb-hero h1 { max-width:720px; margin:0 0 18px; font-size:clamp(3.4rem,5.7vw,6.4rem); line-height:.94; letter-spacing:-.07em; text-wrap:balance; }
.nb-hero-line { margin:0 0 14px; color:#ece9e6; font-size:clamp(1.08rem,1.6vw,1.36rem); font-weight:650; }
.nb-hero-lead { max-width:645px; margin:0 0 25px; color:#aaa6a3; font-size:.98rem; line-height:1.7; }
.nb-actions { display:flex; flex-wrap:wrap; gap:10px; }
.nb-actions .btn { min-height:52px; }
.nb-hero-proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; max-width:640px; margin-top:29px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:14px; background:rgba(255,255,255,.1); }
.nb-hero-proof span { padding:13px 15px; background:rgba(9,9,9,.88); color:#97928e; font-size:.66rem; line-height:1.35; }
.nb-hero-proof strong { display:block; margin-bottom:3px; color:#fff; font-size:.74rem; }

.nb-stage { position:relative; min-height:650px; isolation:isolate; }
.nb-stage::before { content:""; position:absolute; width:95%; height:57%; left:2.5%; bottom:8%; border-radius:50%; background:radial-gradient(ellipse,rgba(173,16,24,.32),rgba(0,0,0,0) 71%); filter:blur(26px); }
.nb-stage-label { position:absolute; z-index:8; top:8%; right:2%; padding:9px 12px; border:1px solid rgba(245,202,91,.25); border-radius:99px; background:rgba(0,0,0,.5); color:#ebcf8d; font-size:.57rem; font-weight:850; letter-spacing:.17em; }
.nb-stage-halo { position:absolute; inset:8% -14% 8% -14%; z-index:-1; background:radial-gradient(circle at 53% 58%,rgba(204,22,30,.16),transparent 51%),radial-gradient(circle at 83% 49%,rgba(223,169,76,.1),transparent 39%); filter:blur(10px); }
.nb-product-frame { position:absolute; z-index:2; left:50%; top:48%; width:min(840px,124%); aspect-ratio:3 / 2; transform:translate(-50%,-50%) scale(var(--nb-product-scale,1)); transform-origin:center; will-change:transform; }
.nb-frame { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 30px 26px rgba(0,0,0,.48)); will-change:opacity; }
.nb-frame--closed { opacity:var(--nb-closed,1); transform:translateY(12%); }
.nb-frame--middle { opacity:var(--nb-middle,0); }
.nb-frame--open { opacity:var(--nb-open,0); }
.nb-display-brand { position:absolute; left:42%; top:28%; width:35%; height:23%; z-index:4; display:grid; place-items:center; opacity:var(--nb-screen-opacity,0); transform:rotate(4deg) skew(-13deg) scale(var(--nb-brand-scale,.9)); mix-blend-mode:screen; pointer-events:none; }
.nb-display-brand img { display:block; width:88%; max-height:100%; object-fit:contain; filter:drop-shadow(0 0 12px rgba(238,11,26,.34)); }
.nb-stage-footnote { position:absolute; z-index:4; left:8%; bottom:11%; color:#807773; font-size:.54rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.nb-status { position:absolute; z-index:9; left:9%; right:9%; bottom:3%; display:flex; align-items:center; gap:12px; color:#85817e; font-size:.55rem; font-weight:800; letter-spacing:.14em; }
.nb-status i { flex:1; height:2px; background:rgba(255,255,255,.1); }
.nb-status i::after { content:""; display:block; width:var(--nb-status,0%); height:100%; background:linear-gradient(90deg,#e20d17,#f7ce67); box-shadow:0 0 12px #dc111a; }
.nb-scroll-cue { position:absolute; z-index:5; left:50%; bottom:24px; translate:-50%; color:#817c78; font-size:.63rem; font-weight:750; letter-spacing:.15em; text-transform:uppercase; }

.nb-section { position:relative; padding:110px 0; border-top:1px solid rgba(255,255,255,.07); background:#0b0b0b; }
.nb-section--soft { background:radial-gradient(circle at 15% 30%,rgba(125,13,18,.12),transparent 35%),#11100f; }
.nb-heading { display:grid; grid-template-columns:1.2fr .7fr; align-items:end; gap:60px; margin-bottom:45px; }
.nb-heading h2,.nb-section h2 { margin:0; font-size:clamp(2.3rem,4.6vw,4.6rem); line-height:1.02; letter-spacing:-.055em; text-wrap:balance; }
.nb-heading p { color:#aaa5a1; line-height:1.75; }
.nb-grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.nb-card { position:relative; min-height:255px; padding:27px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:20px; background:linear-gradient(145deg,#1a1919,#0b0b0b); transition:transform .3s,border-color .3s,box-shadow .3s; }
.nb-card:hover { transform:translateY(-6px); border-color:rgba(246,200,83,.42); box-shadow:0 24px 55px rgba(0,0,0,.34); }
.nb-card>span { color:#d9b95f; font-size:.6rem; font-weight:850; letter-spacing:.17em; }
.nb-card h3 { margin:44px 0 10px; font-size:1.5rem; letter-spacing:-.035em; }
.nb-card p { color:#a9a5a2; font-size:.88rem; line-height:1.68; }
.nb-card::after { content:""; position:absolute; width:130px; height:130px; top:-65px; right:-50px; border:1px solid rgba(228,17,25,.28); border-radius:50%; box-shadow:0 0 55px rgba(225,11,20,.12); }

.nb-spec-shell { display:grid; grid-template-columns:.92fr 1.08fr; gap:26px; align-items:stretch; }
.nb-spec-visual { position:relative; min-height:570px; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:26px; background:radial-gradient(circle at 50% 55%,rgba(183,16,24,.26),transparent 48%),repeating-linear-gradient(0deg,transparent 0 43px,rgba(255,255,255,.022) 44px),repeating-linear-gradient(90deg,transparent 0 43px,rgba(255,255,255,.022) 44px),#111; }
.nb-spec-visual img { width:93%; filter:drop-shadow(0 28px 28px rgba(0,0,0,.55)); }
.nb-spec-visual>span { position:absolute; top:20px; left:20px; color:#edcd7a; font-size:.61rem; font-weight:850; letter-spacing:.15em; }
.nb-spec-copy { padding:clamp(28px,4vw,55px); border:1px solid rgba(247,205,95,.15); border-radius:26px; background:linear-gradient(145deg,#1b1816,#0d0d0d); }
.nb-spec-copy h2 { font-size:clamp(2.3rem,3.7vw,3.9rem); }
.nb-spec-copy>p { margin:18px 0 28px; color:#aaa6a3; line-height:1.75; }
.nb-spec-list { display:grid; gap:1px; overflow:hidden; border:1px solid rgba(255,255,255,.09); border-radius:14px; background:rgba(255,255,255,.09); }
.nb-spec-list div { display:grid; grid-template-columns:135px 1fr; gap:18px; padding:14px 16px; background:#111; }
.nb-spec-list dt { color:#827d79; font-size:.69rem; font-weight:750; text-transform:uppercase; }
.nb-spec-list dd { margin:0; color:#eeeae7; font-size:.82rem; font-weight:650; }
.nb-spec-note { display:block; margin:16px 0 23px; color:#77726e; font-size:.7rem; line-height:1.5; }

.nb-process { display:grid; grid-template-columns:.66fr 1.34fr; gap:65px; align-items:start; }
.nb-process-intro { position:sticky; top:125px; }
.nb-process-intro p { margin-top:20px; color:#a8a39f; line-height:1.75; }
.nb-process-list { counter-reset:nb-step; display:grid; }
.nb-process-list article { counter-increment:nb-step; display:grid; grid-template-columns:70px 1fr; gap:22px; padding:28px 0; border-top:1px solid rgba(255,255,255,.1); }
.nb-process-list article::before { content:"0" counter(nb-step); color:#ebc764; font-size:.68rem; font-weight:900; letter-spacing:.14em; }
.nb-process-list h3 { margin:0 0 7px; font-size:1.35rem; }
.nb-process-list p { margin:0; color:#a6a19d; line-height:1.65; }

.nb-choice { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.nb-choice article { padding:34px; border:1px solid rgba(255,255,255,.1); border-radius:20px; background:#111; }
.nb-choice article:first-child { border-color:rgba(244,201,93,.3); background:linear-gradient(145deg,#241b14,#101010); }
.nb-choice h3 { margin:0 0 12px; font-size:1.7rem; }
.nb-choice ul { display:grid; gap:10px; margin:20px 0 0; padding:0; list-style:none; color:#b0aba7; }
.nb-choice li::before { content:"✓"; margin-right:10px; color:#f2c85c; font-weight:900; }

.nb-combo { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:55px; padding:48px; border:1px solid rgba(246,205,97,.18); border-radius:28px; background:radial-gradient(circle at 80% 50%,rgba(170,15,22,.24),transparent 40%),linear-gradient(135deg,#1d1714,#090909); }
.nb-combo h2 { font-size:clamp(2.4rem,4vw,4.2rem); }
.nb-combo p { margin:18px 0 26px; color:#ada8a4; line-height:1.7; }
.nb-combo-visual { position:relative; min-height:350px; display:grid; place-items:center; }
.nb-combo-visual-laptop { width:100%; filter:drop-shadow(0 23px 28px rgba(0,0,0,.4)); }
.nb-combo-visual-printer { position:absolute; right:0; bottom:7%; width:37%; filter:drop-shadow(0 18px 20px rgba(0,0,0,.55)); }

.nb-faq { max-width:900px; margin:40px auto 0; }
.nb-faq details { border-top:1px solid rgba(255,255,255,.11); }
.nb-faq summary { display:flex; justify-content:space-between; gap:20px; padding:23px 4px; cursor:pointer; font-weight:700; list-style:none; }
.nb-faq summary::after { content:"+"; color:#f2c75d; font-size:1.4rem; }
.nb-faq details[open] summary::after { content:"−"; }
.nb-faq p { max-width:760px; padding:0 4px 24px; color:#aaa6a2; line-height:1.7; }

.nb-proposal { scroll-margin-top:100px; }
.nb-proposal-grid { display:grid; grid-template-columns:.76fr 1.24fr; gap:60px; align-items:start; }
.nb-proposal-copy p { margin:20px 0; color:#aaa5a1; line-height:1.75; }
.nb-proposal-points { display:grid; gap:10px; color:#ddd8d4; font-size:.86rem; }
.nb-proposal-points span::before { content:"✓"; margin-right:9px; color:#efc65e; }
.nb-form { display:grid; gap:12px; padding:30px; border:1px solid rgba(246,204,96,.19); border-radius:22px; background:linear-gradient(145deg,#1b1816,#0b0b0b); }
.nb-form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.nb-form label { display:grid; gap:7px; color:#e5e0dc; font-size:.72rem; font-weight:750; }
.nb-form input,.nb-form select,.nb-form textarea { width:100%; min-height:48px; padding:12px 13px; border:1px solid rgba(255,255,255,.15); border-radius:10px; outline:0; background:#090909; color:#fff; font:inherit; font-size:.84rem; }
.nb-form textarea { min-height:100px; resize:vertical; }
.nb-form input:focus,.nb-form select:focus,.nb-form textarea:focus { border-color:#f0c45d; box-shadow:0 0 0 3px rgba(240,196,93,.1); }
.nb-form small { color:#77736f; font-size:.67rem; line-height:1.5; }

.nb-float { position:fixed; z-index:950; right:18px; bottom:18px; display:flex; gap:9px; align-items:center; opacity:0; visibility:hidden; translate:0 10px; transition:.3s; }
.nb-after-hero .nb-float { opacity:1; visibility:visible; translate:0; }
.nb-float a { display:inline-flex; min-height:49px; align-items:center; justify-content:center; border-radius:99px; box-shadow:0 12px 30px rgba(0,0,0,.4); }
.nb-float-proposal { padding:0 18px; background:#da0711; font-size:.76rem; font-weight:850; }
.nb-float-wa { width:49px; background:#20c965; font-size:1.35rem; }
.nb-reveal { opacity:0; transform:translateY(25px); transition:opacity .65s,transform .65s; }
.nb-reveal.is-visible { opacity:1; transform:none; }

.nb-combo-printer { display:none; }
.nb-performance-link { overflow:hidden; background:radial-gradient(circle at 80% 55%,rgba(173,21,28,.22),transparent 35%),#0b0909; }
.nb-performance-link-grid { display:grid; grid-template-columns:.92fr 1.08fr; align-items:center; gap:40px; }
.nb-performance-link-grid p { max-width:560px; margin:22px 0 26px; color:#aaa5a1; line-height:1.75; }
.nb-performance-link-art { position:relative; min-height:340px; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(241,195,79,.19); border-radius:25px; background:radial-gradient(circle at 50% 55%,rgba(179,25,33,.23),transparent 55%),repeating-linear-gradient(90deg,transparent 0 50px,rgba(255,255,255,.026) 51px),#120d0d; }
.nb-performance-link-art img { width:82%; filter:drop-shadow(0 26px 25px rgba(0,0,0,.55)); transition:transform .5s; }
.nb-performance-link-art:hover img { transform:scale(1.045); }
.nb-performance-link-art span { position:absolute; z-index:2; padding:7px 10px; border:1px solid rgba(245,203,97,.4); border-radius:99px; background:rgba(18,13,13,.9); color:#e9cc87; font-size:.53rem; font-weight:850; letter-spacing:.1em; }
.nb-performance-link-art span:nth-child(1) { left:10%; top:19%; }
.nb-performance-link-art span:nth-child(2) { right:7%; top:35%; }
.nb-performance-link-art span:nth-child(3) { left:18%; bottom:15%; }
.nb-performance-note { margin-top:26px; padding:22px; border:1px solid rgba(244,198,84,.24); border-radius:16px; background:linear-gradient(145deg,#211914,#111); }
.nb-performance-note>span { color:#edca76; font-size:.59rem; font-weight:900; letter-spacing:.14em; }
.nb-performance-note p { margin:10px 0 13px; font-size:.83rem; }
.nb-performance-note a { color:#f5cf77; font-size:.79rem; font-weight:850; }
.nb-performance-note a:hover { color:#fff; }
.nb-combo-page .nb-combo-printer { position:absolute; z-index:8; right:-6%; bottom:3%; display:block; width:min(365px,56%); height:auto; opacity:var(--nb-printer-opacity,0); transform:translate(var(--nb-printer-x,70px),var(--nb-printer-y,24px)) scale(var(--nb-printer-scale,.84)); filter:drop-shadow(0 30px 28px rgba(0,0,0,.68)) drop-shadow(0 0 19px rgba(218,24,32,.2)); will-change:opacity,transform; }

@media(max-width:980px){
  .nb-hero { height:215svh; min-height:1350px; }
  .nb-hero-sticky { padding-top:100px; align-items:start; }
  .nb-hero-grid { grid-template-columns:1fr; gap:4px; }
  .nb-hero-content { position:relative; z-index:6; }
  .nb-hero h1 { max-width:900px; font-size:clamp(3.2rem,8vw,5.2rem); }
  .nb-stage { min-height:470px; }
  .nb-product-frame { width:min(760px,105%); }
  .nb-heading,.nb-spec-shell,.nb-process,.nb-proposal-grid { grid-template-columns:1fr; gap:35px; }
  .nb-performance-link-grid { grid-template-columns:1fr; gap:25px; }
  .nb-process-intro { position:relative; top:auto; }
  .nb-spec-visual { min-height:470px; }
}
@media(min-width:681px) and (max-width:980px){
  .nb-hero-sticky { align-items:center; }
  .nb-hero-grid { grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr); gap:12px; align-items:center; }
  .nb-hero h1 { font-size:clamp(2.45rem,5.2vw,3.35rem); }
  .nb-hero-lead { font-size:.86rem; line-height:1.6; }
  .nb-actions .btn { min-height:46px; padding:11px 15px; font-size:.74rem; }
  .nb-hero-proof span { padding:10px 8px; font-size:.57rem; }
  .nb-hero-proof strong { font-size:.63rem; }
  .nb-stage { min-height:520px; }
  .nb-product-frame { left:48%; width:104%; }
  .nb-stage-label { font-size:.47rem; }
  .nb-status { font-size:.46rem; }
}
@media(max-width:680px){
  .notebook-premium-page .container { width:min(100% - 28px,1220px); }
  .nb-hero { height:190svh; min-height:1230px; }
  .nb-hero-sticky { min-height:100svh; padding:92px 0 30px; }
  .nb-breadcrumb { margin-bottom:12px; font-size:.65rem; }
  .nb-live { margin-bottom:10px; font-size:.55rem; }
  .nb-hero h1 { margin-bottom:12px; font-size:clamp(2.75rem,13vw,4rem); }
  .nb-hero-line { font-size:.96rem; }
  .nb-hero-lead { font-size:.82rem; line-height:1.55; margin-bottom:17px; }
  .nb-actions { flex-wrap:nowrap; }
  .nb-actions .btn { flex:1; min-height:46px; padding:10px 12px; font-size:.7rem; }
  .nb-hero-proof { margin-top:18px; }
  .nb-hero-proof span { padding:10px 8px; font-size:.55rem; }
  .nb-hero-proof strong { font-size:.62rem; }
  .nb-hero-content { opacity:var(--nb-copy-opacity,1); transform:translateY(calc(var(--nb-mobile-lift,0px) * .23)); }
  .nb-focus-product .nb-hero-content { pointer-events:none; }
  .nb-stage { min-height:400px; margin-top:-4px; transform:translateY(var(--nb-mobile-lift,0px)); }
  .nb-product-frame { width:111%; top:38%; }
  .nb-frame--closed { transform:translateY(-12%); }
  .nb-stage-footnote { display:none; }
  .nb-stage-label { top:1%; right:0; font-size:.46rem; }
  .nb-status { bottom:0; font-size:.44rem; }
  .nb-screen-brand small { font-size:.39rem; }
  .nb-scroll-cue { display:none; }
  .nb-section { padding:72px 0; }
  .nb-heading { gap:15px; margin-bottom:28px; }
  .nb-heading h2,.nb-section h2 { font-size:clamp(2.1rem,10vw,3rem); }
  .nb-grid-3,.nb-choice,.nb-combo { grid-template-columns:1fr; }
  .nb-card { min-height:215px; }
  .nb-card h3 { margin-top:35px; }
  .nb-spec-visual { min-height:320px; }
  .nb-spec-copy { padding:25px 20px; }
  .nb-spec-list div { grid-template-columns:100px 1fr; gap:10px; padding:12px; }
  .nb-spec-list dt,.nb-spec-list dd { font-size:.67rem; }
  .nb-process-list article { grid-template-columns:48px 1fr; gap:10px; }
  .nb-choice article { padding:25px 21px; }
  .nb-combo { padding:27px 21px; gap:18px; }
  .nb-combo-visual { min-height:250px; }
  .nb-performance-link-art { min-height:250px; }
  .nb-combo-page .nb-stage { min-height:300px; }
  .nb-combo-page .nb-product-frame { left:48%; top:38%; width:100%; }
  .nb-combo-page .nb-combo-printer { right:-4%; bottom:3%; width:50%; }
  .nb-proposal-grid { gap:27px; }
  .nb-form { padding:22px 18px; }
  .nb-form-row { grid-template-columns:1fr; }
  .nb-float { right:12px; bottom:12px; }
  .nb-float-proposal { min-height:45px; padding:0 13px; font-size:.67rem; }
  .nb-float-wa { width:45px; min-height:45px!important; }
}
@media(prefers-reduced-motion:reduce){
  .nb-frame--closed,.nb-frame--middle { opacity:0!important; }
  .nb-frame--open,.nb-display-brand { opacity:1!important; }
  .nb-combo-printer { opacity:1!important; transform:none!important; }
  .nb-hero-content { opacity:1!important; transform:none!important; pointer-events:auto!important; }
  .nb-stage { transform:none!important; }
  .nb-status i::after { width:100%!important; }
  .nb-reveal { opacity:1; transform:none; }
}
