body { background:#080808; color:var(--light); }
.product-header { border-bottom:1px solid var(--line); background:#000; }
.product-header-inner { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:15px; }
.product-header img,.product-footer img { width:170px; height:auto; }
.product-header span { color:var(--orange); font-size:.6rem; font-weight:800; letter-spacing:.15em; white-space:nowrap; }
.eyebrow { margin:0; color:var(--orange); font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow span { color:#fff; }
h1,h2,h3,p { margin-top:0; }
.hero { min-height:0; padding-top:0; overflow:hidden; background:radial-gradient(circle at 70% 30%,#ff56001e,transparent 45%),#000; }
.hero-grid { display:flex; flex-direction:column; align-items:stretch; gap:8px; min-height:0; padding-block:25px 31px; }
.hero h1 { max-width:700px; margin:12px 0; font-size:clamp(2.1rem,8.3vw,4.8rem); line-height:1.03; letter-spacing:-.055em; }
.hero h1 em,.path h2 em,.close h2 em,.contrast-end em { color:var(--orange); font-style:normal; }
.hero-lead { max-width:620px; margin:0 0 9px; font-size:.95rem; line-height:1.38; font-weight:600; }
.hero-detail { max-width:580px; margin:0; color:#a9a9a9; font-size:.8rem; line-height:1.42; }
.hero-offer { display:flex; align-items:center; gap:12px; width:max-content; max-width:100%; margin:15px 0 10px; padding:8px 14px; border:1px solid #ffffff55; border-radius:12px; }
.hero-offer span { font-size:.58rem; font-weight:800; letter-spacing:.09em; }
.hero-offer strong { color:var(--orange); font-family:var(--font-display); font-size:1.05rem; }
.hero-offer strong.price-pending { color:#ccc; font-size:.78rem; }
.cta { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:48px; padding:10px 13px; text-align:center; font-size:.72rem; line-height:1.2; }
.checkout-message { margin:8px 0 0; font-size:.78rem; }
.hero-art { display:grid; place-items:center; height:220px; margin:0 auto; overflow:hidden; width:100%; }
.hero-art img { width:230px; height:220px; object-fit:contain; }
@media (max-width:699px) { .hero-copy { display:contents; } .hero .eyebrow { order:1; } .hero h1 { order:2; } .hero-lead { order:3; } .hero-detail { order:4; } .hero-art { order:5; } .hero-offer { order:6; margin-top:0; } .hero .cta { order:7; } .hero .checkout-message { order:8; } }
.section { padding:56px 0; }
.section h2 { max-width:790px; margin:8px 0 23px; font-size:clamp(2rem,7.8vw,4.4rem); line-height:1.08; letter-spacing:-.05em; }
.contrast { background:var(--light); color:var(--ink); }
.contrast-grid { display:grid; gap:12px; }
.contrast-card { min-height:200px; padding:19px; border-radius:var(--radius); background:#fff; }
.contrast-card span { color:var(--orange); font-size:.7rem; font-weight:800; letter-spacing:.1em; }
.contrast-card strong { display:block; margin:16px 0 12px; font-family:var(--font-display); font-size:1.55rem; line-height:1.12; }
.contrast-card p { margin:0; font-size:.9rem; }
.contrast-active { background:#080808; color:#fff; }
.contrast-active strong { margin:28px 0; font-size:clamp(1.25rem,4.8vw,2.4rem); white-space:nowrap; }
.contrast-active i { color:var(--orange); font-style:normal; }
.contrast-end { max-width:800px; margin:25px 0 0; font-family:var(--font-display); font-size:clamp(1.3rem,3vw,2.2rem); font-weight:800; line-height:1.2; letter-spacing:-.04em; }
.path { background:#ff5600; color:#080808; }
.path .eyebrow { color:#080808; }
.path h2 em { color:#fff; }
.path-grid { display:grid; gap:20px; }
.path p { max-width:650px; }
.path-arrows { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:20px; }
.path-arrows span { padding:12px; border:1px solid #08080866; border-radius:12px; font-family:var(--font-display); font-weight:800; text-align:center; }
.path-note { display:grid; grid-template-columns:28px 1fr; gap:8px 12px; align-content:center; padding:20px; border-radius:var(--radius); background:#080808; color:#fff; }
.path-note span { color:var(--orange); font-weight:800; }
.path-note p { margin:0; }
.learn { background:#0b0b0b; }
.learn-grid { display:grid; gap:10px; }
.learn article { padding:18px; border:1px solid #303030; border-radius:var(--radius); background:#161616; }
.learn article span { color:var(--orange); font-size:.7rem; font-weight:800; }
.learn h3 { margin:12px 0 5px; font-size:1.17rem; }
.learn article p { margin:0; color:#aaa; font-size:.86rem; }
.learn-note { max-width:730px; margin:24px 0 0; color:#b5b5b5; }
.product { background:var(--light); color:var(--ink); }
.product-grid { display:grid; gap:20px; }
.product-art { display:grid; place-items:center; min-height:270px; border-radius:var(--radius); background:#e5e6e7; }
.product-art img { width:min(100%,420px); }
.product p:not(.eyebrow) { color:#555; }
.product-list { margin:17px 0; padding:0; list-style:none; }
.product-list li { position:relative; padding:7px 0 7px 23px; border-bottom:1px solid #ccc; font-size:.9rem; }
.product-list li::before { content:'✓'; position:absolute; left:0; color:var(--orange); font-weight:800; }
.product .product-format { color:#080808!important; font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.teacher { background:#111; }
.teacher-grid { display:grid; gap:20px; }
.teacher img { width:100%; height:230px; object-fit:cover; object-position:55% center; border-radius:var(--radius); }
.teacher p:not(.eyebrow) { max-width:630px; color:#aaa; }
.close { background:var(--orange); color:#080808; }
.close .eyebrow { color:#080808; }
.close h2 em { color:#fff; }
.close-grid { display:grid; gap:25px; }
.offer-card { padding:24px; border-radius:24px; background:var(--light); }
.offer-card>span { color:var(--orange); font-size:.7rem; font-weight:800; letter-spacing:.1em; }
.offer-card h3 { margin:8px 0 5px; font-size:1.25rem; }
.offer-card>strong { display:block; margin:3px 0 13px; font-family:var(--font-display); font-size:clamp(2.4rem,8vw,4.5rem); font-weight:800; letter-spacing:-.06em; }
.offer-card>strong.price-pending { color:#555; font-size:1.1rem; letter-spacing:0; }
.offer-card ul { margin:0 0 18px; padding:15px 0 0; border-top:1px solid #ccc; list-style:none; }
.offer-card li { padding:4px 0; font-size:.86rem; }
.offer-card li::before { content:'✓'; color:var(--orange); margin-right:8px; font-weight:800; }
.community { padding:37px 0; border-top:1px solid #333; background:#080808; }
.community-inner { display:grid; gap:15px; }
.community h2 { margin:5px 0 8px; font-size:clamp(1.5rem,4vw,2.2rem); }
.community p:not(.eyebrow) { max-width:570px; margin:0; color:#aaa; font-size:.87rem; }
.button-outline { width:max-content; max-width:100%; padding:12px 18px; border:1px solid var(--orange); border-radius:99px; color:var(--orange); font-size:.75rem; font-weight:800; }
.product-footer { padding:30px 0; border-top:1px solid #262626; background:#080808; }
.product-footer .container { display:flex; flex-wrap:wrap; align-items:center; gap:12px 23px; }
.product-footer p { margin:0 auto 0 0; color:#999; font-size:.8rem; }
.product-footer a { color:#bbb; font-size:.8rem; }
@media (min-width:700px) { .product-header-inner { min-height:68px; } .product-header img { width:190px; } .hero-grid { display:grid; grid-template-columns:1.08fr .92fr; align-items:center; gap:20px; min-height:620px; padding-block:42px; } .hero-art { order:0; height:auto; margin:0; } .hero-art img { width:min(100%,590px); height:auto; } .hero h1 { margin:16px 0; } .hero-lead { font-size:1.1rem; } .hero-detail { font-size:.94rem; } .hero-offer { margin:24px 0 15px; } .cta { width:max-content; padding:14px 21px; } .section { padding:82px 0; } .contrast-grid { grid-template-columns:1fr 1fr; } .contrast-card { min-height:280px; padding:28px; } .path-grid { grid-template-columns:1.25fr .75fr; gap:50px; } .learn-grid { grid-template-columns:repeat(5,1fr); } .learn article { min-height:200px; } .product-grid { grid-template-columns:.85fr 1.15fr; align-items:center; gap:50px; } .product-art { min-height:420px; } .teacher-grid { grid-template-columns:.9fr 1.1fr; align-items:center; gap:45px; } .teacher img { height:330px; } .close-grid { grid-template-columns:1.1fr .9fr; align-items:center; gap:55px; } .offer-card { padding:35px; } .community-inner { grid-template-columns:1fr auto; align-items:center; } }
@media (max-width:370px) { .product-header span { display:none; } .hero-art { height:190px; } .hero-art img { width:200px; height:190px; } .hero h1 { font-size:2rem; } .cta { font-size:.66rem; } }