
:root{--bg:#050914;--panel:#0b1729;--panel2:#11233c;--line:#29415e;--text:#f5f8ff;--muted:#b7c6dc;--blue:#46bbff;--gold:#f4c66c;--max:1160px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% 10%,#102c4d 0,transparent 36%),var(--bg);color:var(--text);font:16px/1.72 system-ui,-apple-system,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}img{max-width:100%;height:auto;display:block}
.wrap{width:min(var(--max),calc(100% - 44px));margin-inline:auto}.site-nav{border-bottom:1px solid #203552;background:#050914dc;backdrop-filter:blur(12px);position:sticky;top:0;z-index:30}
.site-nav .navinner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:1.31rem;font-weight:850;letter-spacing:.04em}.brand span{color:var(--blue)}.navlinks{display:flex;align-items:center;gap:25px;font-size:.9rem;color:#d4deea}.navlinks a:hover{color:var(--gold)}
.eyebrow{font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;color:var(--blue);font-weight:850}.serif{font-family:Georgia,'Times New Roman',serif}.gold{color:var(--gold)}
h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.7rem,6.1vw,5.3rem);line-height:1.09;letter-spacing:-.04em;font-weight:650}h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.2;letter-spacing:-.03em}h3{font-size:1.3rem;line-height:1.3}p{color:var(--muted)}
.btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:9px;padding:13px 21px;border-radius:99px;border:1px solid #4f8ec0;color:#fff;font-weight:750;font-size:.93rem;line-height:1.35;transition:.15s ease}.btn:hover{transform:translateY(-2px);filter:brightness(1.09)}.btn.goldbtn{background:linear-gradient(125deg,#ffdf9a,#d3a047);color:#07111d;border-color:#f5ce75}.btn.bluebtn{background:#102f4e;border-color:#4eb9ff}.btn.ghost{border-color:#45617c;background:#0b1c30}.btn.small{font-size:.83rem;padding:10px 15px}
.section{padding:84px 0;border-bottom:1px solid #1c304b}.sectionhead{max-width:810px;margin-bottom:38px}.sectionhead p{font-size:1.08rem}.books-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.bookcard{display:grid;grid-template-columns:minmax(160px,39%) 1fr;align-items:center;gap:26px;background:linear-gradient(142deg,#102640 0%,#091525 100%);border:1px solid #29425f;border-radius:22px;padding:24px;min-height:410px;box-shadow:0 16px 50px #0005}
.bookcard img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:9px;box-shadow:13px 14px 25px #000a;border:1px solid #b6d8ef33}.bookcard .eyebrow{margin-bottom:9px}.bookcard h3{font-family:Georgia,'Times New Roman',serif;font-size:clamp(1.38rem,2vw,1.85rem);margin-bottom:10px;line-height:1.22}.bookcard .desc{font-size:.94rem;line-height:1.61}.price-line{font-weight:750;color:#f5d794;font-size:.88rem;margin-bottom:0}
.detail-hero{padding:68px 0 78px;background:radial-gradient(circle at 82% 35%,#19467780 0%,transparent 43%)}.crumb{font-size:.84rem;color:#b8c6d9;margin-bottom:28px}.crumb a{color:var(--blue)}.detail-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}.detail-cover{margin:0 auto;max-width:380px;position:relative}.detail-cover:after{content:'';position:absolute;z-index:-1;inset:30px -20px -23px 30px;border-radius:28px;background:linear-gradient(120deg,#2665a2,#cf9f40);filter:blur(34px);opacity:.3}.detail-cover img{width:100%;border-radius:8px;box-shadow:16px 23px 40px #0009}.detail-hero .intro{font-size:1.15rem;max-width:640px}.specs{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}.specs span{font-size:.8rem;border:1px solid #32618a;background:#102440;border-radius:99px;padding:6px 13px;color:#d6e7f8}
.questions{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.qcard{padding:23px 20px;background:linear-gradient(145deg,#102640,#0a1528);border:1px solid #28415c;border-radius:16px}.qcard .num{font-family:Georgia,serif;color:var(--gold);font-size:1.7rem;margin-bottom:10px}.qcard h3{font-size:1.05rem;margin-bottom:0}
.method-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.step{display:flex;gap:17px;background:#0d1e33;border:1px solid #203854;border-radius:13px;padding:17px 19px}.step strong{flex:none;color:var(--gold);font-weight:900;font-size:1rem}.step span{font-size:.96rem;color:#dde8f8}
.cta-band{border:1px solid #476d88;background:linear-gradient(125deg,#122c49,#081626);border-radius:24px;padding:35px 40px;display:flex;align-items:center;justify-content:space-between;gap:20px}.cta-band p{margin-bottom:0}.site-footer{padding:35px 0 50px}.site-footer .wrap{display:flex;justify-content:space-between;gap:20px;color:#9fb5cd;font-size:.86rem}.site-footer a{color:#b8dcff}
.note{color:#a4b5c9;font-size:.84rem;margin-top:13px}.or-line{color:#a7b8cb;font-size:.83rem;margin:13px 0 0}.label-line{display:inline-flex;gap:8px;align-items:center;color:#f5d38d;text-transform:uppercase;letter-spacing:.17em;font-size:.72rem;font-weight:800}
@media (max-width:1050px){.books-grid{grid-template-columns:1fr}.bookcard{grid-template-columns:225px 1fr}.questions{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.detail-grid{grid-template-columns:1fr;gap:39px}.detail-cover{width:min(72vw,370px)}.detail-hero{padding:36px 0 55px}.section{padding:58px 0}.method-grid{grid-template-columns:1fr}.cta-band{display:block;padding:27px}.navlinks{gap:13px;font-size:.78rem}}
@media (max-width:540px){.wrap{width:calc(100% - 32px)}.site-nav .navinner{min-height:68px}.brand{font-size:1rem}.navlinks{gap:8px}.navlinks a:nth-child(2){display:none}.bookcard{grid-template-columns:125px 1fr;gap:16px;padding:15px;min-height:0;border-radius:16px}.bookcard h3{font-size:1.22rem}.bookcard p{font-size:.86rem}.bookcard .desc{font-size:.82rem}.bookcard .btn{font-size:.78rem;padding:9px 12px}.bookcard .eyebrow{font-size:.63rem}.questions{grid-template-columns:1fr 1fr;gap:10px}.qcard{padding:17px}.qcard h3{font-size:.92rem}.detail-hero .intro{font-size:1rem}.btnrow{gap:9px}.btn{width:100%}.site-footer .wrap{flex-direction:column}}
