.rec-page{--rec-ink:#2b2430;--rec-muted:#6f6874;--rec-purple:#7651b5;--rec-purple-dark:#52337f;--rec-line:#e7e1e9;--rec-soft:#f7f4f8;--rec-paper:#fff;min-height:72vh;background:#fbfafc;color:var(--rec-ink);font-family:'Anuphan',sans-serif}.rec-hero{padding:44px 0 38px;background:#fff;border-bottom:1px solid var(--rec-line)}.rec-breadcrumb{display:flex;align-items:center;gap:9px;margin-bottom:30px;color:#8c8590;font-size:.76rem}.rec-breadcrumb a{color:#756d7b;text-decoration:none}.rec-breadcrumb i{font-size:.52rem;color:#b8b0bb}.rec-hero-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.55fr);gap:54px;align-items:end}.rec-overline{margin-bottom:11px;color:var(--rec-purple);font-size:.71rem;font-weight:700;letter-spacing:.11em}.rec-hero h1{max-width:850px;margin:0;color:#29212f;font-size:clamp(2rem,4.5vw,3.45rem);font-weight:700;line-height:1.14;letter-spacing:-.035em}.rec-hero h1 span{color:var(--rec-purple-dark)}.rec-hero-copy>p{max-width:800px;margin:18px 0 0;color:var(--rec-muted);font-size:.98rem;line-height:1.85}.rec-hero-summary{display:grid;grid-template-columns:auto 1fr;gap:15px;align-items:center;padding:18px 0 4px;border-top:1px solid var(--rec-line)}.rec-summary-number{color:var(--rec-purple-dark);font-size:2rem;font-weight:700;line-height:1}.rec-hero-summary strong,.rec-hero-summary span{display:block}.rec-hero-summary strong{font-size:.83rem;color:#433a49}.rec-hero-summary span{margin-top:3px;color:#8a828e;font-size:.71rem;line-height:1.5}.rec-body{padding:42px 0 78px}.rec-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:38px;align-items:start}.rec-directory{position:relative}.rec-directory-inner{position:sticky;top:92px;padding:4px 0 0}.rec-directory-title{padding:0 0 11px;border-bottom:1px solid var(--rec-line);color:#39303f;font-size:.77rem;font-weight:700}.rec-directory nav{display:grid;margin-top:4px}.rec-directory nav a{display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;padding:11px 2px;border-bottom:1px solid #eee9f0;color:#615968;text-decoration:none}.rec-directory nav a span{padding-top:1px;color:#a69eaa;font-size:.65rem;font-weight:700}.rec-directory nav a strong{font-size:.72rem;font-weight:550;line-height:1.5}.rec-directory nav a:hover strong{color:var(--rec-purple)}.rec-directory-all{display:flex;align-items:center;justify-content:space-between;margin-top:14px;color:var(--rec-purple);font-size:.72rem;font-weight:650;text-decoration:none}.rec-feed{min-width:0}.rec-feature{scroll-margin-top:105px;padding:0 0 64px}.rec-feature+.rec-feature{padding-top:54px;border-top:1px solid var(--rec-line)}.rec-feature-heading{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:start;margin-bottom:18px}.rec-feature-no{padding-top:4px;color:#aaa2ad;font-size:.73rem;font-weight:700;letter-spacing:.09em}.rec-feature-label{margin-bottom:4px;color:var(--rec-purple);font-size:.66rem;font-weight:700;letter-spacing:.09em}.rec-feature-heading h2{max-width:800px;margin:0;color:#302737;font-size:clamp(1.35rem,2.5vw,1.9rem);font-weight:700;line-height:1.4}.rec-course-panel{display:grid;grid-template-columns:minmax(270px,36%) minmax(0,1fr);overflow:hidden;background:#fff;border:1px solid var(--rec-line);border-radius:13px}.rec-course-cover{position:relative;display:block;min-height:315px;background:#eee9f1;overflow:hidden}.rec-course-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.rec-course-cover:hover img{transform:scale(1.018)}.rec-discount{position:absolute;top:13px;left:13px;padding:6px 9px;border-radius:7px;background:#fff;color:#a63a55;border:1px solid #efccd4;font-size:.69rem;font-weight:700}.rec-course-detail{display:flex;flex-direction:column;min-width:0;padding:27px 30px}.rec-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.rec-tags span{padding:5px 8px;border:1px solid #e5dfe7;border-radius:6px;background:#faf9fb;color:#685f6d;font-size:.67rem;font-weight:550}.rec-course-detail h3{margin:0;color:#2c2431;font-size:1.26rem;font-weight:700;line-height:1.5}.rec-course-desc{margin:10px 0 0;color:#726a77;font-size:.84rem;line-height:1.75}.rec-course-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:20px 0 0;border-top:1px solid #eee9f0;border-bottom:1px solid #eee9f0}.rec-course-facts>div{padding:11px 0}.rec-course-facts>div+div{padding-left:18px;border-left:1px solid #eee9f0}.rec-course-facts dt{margin:0;color:#938b97;font-size:.65rem;font-weight:500}.rec-course-facts dd{margin:3px 0 0;color:#463c4d;font-size:.78rem;font-weight:650}.rec-course-purchase{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-top:auto;padding-top:21px}.rec-price-block>span{display:block;margin-bottom:3px;color:#928a96;font-size:.65rem}.rec-price-block>div{display:flex;align-items:baseline;gap:8px}.rec-price-block del{color:#a69ea9;font-size:.74rem}.rec-price-block strong{color:var(--rec-purple-dark);font-size:1.34rem}.rec-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:43px;padding:0 15px;border-radius:8px;text-decoration:none;font-size:.77rem;font-weight:650;transition:background .15s ease,border-color .15s ease,color .15s ease}.rec-button-primary{background:var(--rec-purple);border:1px solid var(--rec-purple);color:#fff}.rec-button-primary:hover{background:var(--rec-purple-dark);border-color:var(--rec-purple-dark);color:#fff}.rec-editorial-block{display:grid;grid-template-columns:190px minmax(0,1fr);gap:32px;margin-top:28px;padding:25px 2px 0;border-top:1px solid var(--rec-line)}.rec-editorial-heading span,.rec-media-title span{display:block;margin-bottom:5px;color:#9b90a0;font-size:.61rem;font-weight:700;letter-spacing:.1em}.rec-editorial-heading h3{margin:0;color:#423848;font-size:.84rem;font-weight:650;line-height:1.5}.rec-editorial{min-width:0;color:#504856;font-size:.92rem;line-height:1.9}.rec-editorial>*:first-child{margin-top:0}.rec-editorial>*:last-child{margin-bottom:0}.rec-editorial h2,.rec-editorial h3,.rec-editorial h4{color:#302737;line-height:1.5}.rec-editorial img{max-width:100%;height:auto}.rec-media-section{margin-top:28px;padding-top:22px;border-top:1px solid var(--rec-line)}.rec-media-title{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-bottom:12px}.rec-media-title strong{color:#4a414f;font-size:.78rem;font-weight:600}.rec-media-grid{display:grid;gap:14px}.rec-media-grid.is-split{grid-template-columns:1fr 1fr}.rec-media-grid.is-single{grid-template-columns:1fr}.rec-media-card{margin:0;overflow:hidden;background:#f1edf3;border:1px solid var(--rec-line);border-radius:10px}.rec-image-card a{position:relative;display:block}.rec-image-card img{display:block;width:100%;max-height:580px;object-fit:cover}.rec-image-card span{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:7px;background:rgba(255,255,255,.94);color:#514758;font-size:.66rem;font-weight:600}.rec-video-ratio{position:relative;aspect-ratio:16/9;background:#111}.rec-video-ratio iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.rec-empty{max-width:650px;margin:28px auto;padding:52px 30px;text-align:center;background:#fff;border:1px solid var(--rec-line);border-radius:12px}.rec-empty>i{font-size:1.8rem;color:#8e74ad}.rec-empty h2{margin:15px 0 7px;font-size:1.3rem}.rec-empty p{margin-bottom:18px;color:var(--rec-muted)}
@media(max-width:1100px){.rec-layout{grid-template-columns:190px minmax(0,1fr);gap:28px}.rec-course-panel{grid-template-columns:250px minmax(0,1fr)}.rec-course-cover{min-height:290px}.rec-course-detail{padding:23px}}
@media(max-width:900px){.rec-hero-layout{grid-template-columns:1fr;gap:24px}.rec-hero-summary{max-width:430px}.rec-layout{grid-template-columns:1fr}.rec-directory{display:none}.rec-editorial-block{grid-template-columns:1fr;gap:10px}.rec-media-grid.is-split{grid-template-columns:1fr}}
@media(max-width:680px){.rec-hero{padding:28px 0 27px}.rec-breadcrumb{margin-bottom:21px}.rec-hero h1{font-size:2rem}.rec-hero-copy>p{font-size:.86rem;line-height:1.75}.rec-hero-summary{padding-top:14px}.rec-body{padding:24px 0 54px}.rec-feature{padding-bottom:44px}.rec-feature+.rec-feature{padding-top:38px}.rec-feature-heading{grid-template-columns:34px minmax(0,1fr);gap:7px;margin-bottom:13px}.rec-feature-no{font-size:.65rem}.rec-feature-heading h2{font-size:1.28rem}.rec-course-panel{grid-template-columns:1fr;border-radius:10px}.rec-course-cover{min-height:0;aspect-ratio:16/10}.rec-course-detail{padding:19px 17px 18px}.rec-course-detail h3{font-size:1.08rem}.rec-course-desc{font-size:.79rem}.rec-course-facts{margin-top:16px}.rec-course-purchase{align-items:center;gap:12px;padding-top:17px}.rec-button{padding:0 12px;font-size:.72rem}.rec-price-block strong{font-size:1.2rem}.rec-editorial-block{margin-top:22px;padding-top:19px}.rec-editorial{font-size:.86rem;line-height:1.85}.rec-media-section{margin-top:22px;padding-top:18px}.rec-media-title{display:block}.rec-media-title strong{display:block;margin-top:2px}.rec-media-card{border-radius:9px}.rec-image-card img{max-height:480px;object-fit:contain;background:#f4f1f5}}
@media(max-width:420px){.rec-course-purchase{display:block}.rec-price-block{margin-bottom:12px}.rec-button{width:100%}.rec-course-facts{grid-template-columns:1fr}.rec-course-facts>div+div{padding-left:0;border-left:0;border-top:1px solid #eee9f0}}
