/* Layout: Apple-minimal — white, black/gray, brand gold #EBCB02 from the Sensei Pae logo; rounded cards on light gray bands, faint graph-paper in the hero */
:root{
  color-scheme: light only;
  --bg:#ffffff;
  --band:#f5f5f7;
  --card:#ffffff;
  --ink:#1d1d1f;
  --sub:#6e6e73;
  --hair:#d2d2d7;
  --grid:rgba(29,29,31,.05);
  --btn:#1d1d1f;
  --btn-text:#ffffff;
  --gold:#EBCB02;
  --gold-deep:#C7A900;
  --gold-soft:rgba(235,203,2,.14);
}
/* เว็บนี้เป็นธีมขาว-ดำเดียว ไม่สลับตามโหมดมืดของเครื่อง */
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Prompt',system-ui,sans-serif; font-size:16.5px; line-height:1.75; font-weight:300;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{line-height:1.25; text-wrap:balance; margin:0; font-weight:700}
.mono{font-family:'IBM Plex Mono',monospace}
.wrap{max-width:1000px; margin:0 auto; padding-inline:22px}
a{color:inherit}

/* nav */
nav{position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:color-mix(in srgb,var(--bg) 82%, transparent); backdrop-filter:saturate(1.8) blur(16px); border-bottom:1px solid var(--hair)}
.nav-in{display:flex; align-items:center; gap:8px; padding-block:11px; flex-wrap:wrap}
.brand{font-weight:700; font-size:1rem; text-decoration:none; letter-spacing:-.01em; display:flex; align-items:center; gap:8px}
.brand-logo{width:30px; height:30px; display:block}
.nav-links{display:flex; gap:2px; margin-left:auto; flex-wrap:wrap; align-items:center}
.nav-links a{text-decoration:none; font-size:.82rem; color:var(--sub); padding:6px 12px; border-radius:999px}
.nav-links a:hover{color:var(--ink)}
.nav-cta{background:var(--gold); color:#1d1d1f !important; font-weight:600}
.nav-cta:hover{background:var(--gold-deep)}

/* hero */
header{
  border-bottom:1px solid var(--hair);
  background-image:linear-gradient(var(--grid) 1px, transparent 1px),linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:32px 32px;
}
.hero{padding-block:96px 72px; text-align:center}
.hero-logo{width:96px; height:96px; margin:0 auto 26px; display:block}
.slogan{display:flex; align-items:center; justify-content:center; gap:12px; margin:-8px 0 22px; font-size:1.05rem; font-weight:600; letter-spacing:.06em; color:var(--ink)}
.slogan::before,.slogan::after{content:""; width:22px; height:2px; background:var(--gold); border-radius:2px}
.brand-tag{font-weight:400; font-size:.78rem; color:var(--sub); padding-left:10px; margin-left:2px; border-left:1px solid var(--hair); letter-spacing:.02em}
@media (max-width:640px){.brand-tag{display:none}}
.eyebrow{font-size:.85rem; color:var(--sub); font-weight:500; letter-spacing:.02em; margin-bottom:18px}
.hero h1{font-size:clamp(2.2rem,6vw,4rem); font-weight:800; letter-spacing:-.02em; max-width:18ch; margin-inline:auto}
.hl{background:linear-gradient(transparent 68%, var(--gold) 68%, var(--gold) 94%, transparent 94%)}
.hero p.lead{font-size:clamp(1.02rem,2vw,1.2rem); color:var(--sub); max-width:46ch; margin:24px auto 0}
.hero .name{margin-top:10px; font-weight:600; font-size:.95rem}
.award{margin:6px 0 0; font-size:.82rem; color:var(--sub); display:inline-block; border:1px solid var(--gold); border-radius:999px; padding:4px 16px; background:var(--gold-soft)}
.cta-row{display:flex; gap:14px; margin-top:36px; justify-content:center; flex-wrap:wrap; align-items:center}
.btn{display:inline-block; text-decoration:none; font-weight:600; font-size:.95rem; padding:13px 28px; border-radius:999px; background:var(--gold); color:#1d1d1f}
.btn:hover{background:var(--gold-deep)}
.link-more{font-weight:500; font-size:.95rem; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--hair); padding-bottom:2px}
.link-more:hover{border-color:var(--gold-deep); }
.stats{display:flex; gap:12px; margin:64px auto 0; max-width:860px; flex-wrap:wrap; justify-content:center}
.stat{flex:1 1 170px; min-width:0; background:var(--card); border:1px solid var(--hair); border-radius:18px; padding:22px 16px; text-align:center}
.stat b{display:block; font-size:1.9rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.stat b::after{content:""; display:block; width:28px; height:3px; background:var(--gold); margin:8px auto 2px; border-radius:2px}
.stat span{font-size:.78rem; color:var(--sub)}

/* photos */
.hero-photo{margin-top:52px}
.hero-photo img{width:100%; border-radius:18px; display:block}
.shots{display:grid; grid-template-columns:1.4fr 1fr; gap:16px; margin-bottom:52px}
.shots img{width:100%; height:100%; object-fit:cover; border-radius:18px; display:block; max-width:100%}
@media (max-width:640px){ .shots{grid-template-columns:1fr} }

/* sections */
section{padding-block:88px}
.band{background:var(--band)}
.sec-head{text-align:center; margin-bottom:48px}
.sec-head h2{font-size:clamp(1.6rem,4vw,2.4rem); font-weight:800; letter-spacing:-.02em}
.sec-head p{color:var(--sub); margin:10px auto 0; max-width:50ch}

/* clients */
.clients{display:flex; flex-wrap:wrap; gap:8px 26px; justify-content:center; max-width:860px; margin-inline:auto}
.clients span{font-weight:600; font-size:1rem; color:var(--sub); white-space:nowrap}
.proof{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px; margin-top:52px}
.proof div{background:var(--card); border:1px solid var(--hair); border-top:4px solid var(--gold); border-radius:18px; padding:26px}
.proof b{display:block; margin-bottom:6px; font-size:1.02rem}
.proof small{color:var(--sub); font-size:.88rem; line-height:1.6; display:block}

/* video */
.media{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px}
.vid{display:flex; flex-direction:column; text-decoration:none; background:var(--card); border:1px solid var(--hair); border-radius:18px; padding:28px}
.vid .tag{font-family:'IBM Plex Mono'; font-size:.68rem; color:var(--sub); letter-spacing:.12em; text-transform:uppercase}
.vid h3{font-size:1.08rem; margin:10px 0 8px; font-weight:700}
.vid p{margin:0; color:var(--sub); font-size:.88rem; flex-grow:1}
.vid .go{margin-top:18px; font-weight:600; font-size:.88rem}
.vid .go{border-bottom:2px solid var(--gold)}
.vid:hover .go{border-color:var(--gold-deep)}

/* courses */
.courses{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:16px}
.course{background:var(--card); border:1px solid var(--hair); border-radius:18px; padding:30px; display:flex; flex-direction:column; gap:12px}
.course .idx{font-family:'IBM Plex Mono'; font-size:.68rem; color:var(--sub); letter-spacing:.1em; display:flex; justify-content:space-between}
.course .idx .sig{color:#1d1d1f; font-weight:600; background:var(--gold); border-radius:999px; padding:2px 11px}
.course h3{font-size:1.15rem; font-weight:700; letter-spacing:-.01em}
.course p{margin:0; font-size:.9rem; color:var(--sub); flex-grow:1}
.course .meta{font-size:.78rem; color:var(--sub); border-top:1px solid var(--hair); padding-top:14px}

/* approach */
.way{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:40px; max-width:960px; margin-inline:auto}
.way h3{font-size:1.05rem; margin-bottom:10px; font-weight:700}
.way .n{display:inline-block; font-family:'IBM Plex Mono'; font-size:.72rem; color:#1d1d1f; background:var(--gold); padding:3px 10px; border-radius:999px; margin-bottom:14px; letter-spacing:.12em; font-weight:500}
.way p{margin:0; color:var(--sub); font-size:.92rem}

/* testimonials */
.testi{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; max-width:1020px; margin-inline:auto}
.t-card{background:var(--card); border:1px solid var(--hair); border-radius:18px; padding:30px; display:flex; flex-direction:column}
.t-card .q{font-size:2.2rem; line-height:1; color:var(--gold); font-weight:800; font-family:Georgia,serif}
.t-card p.quote{margin:10px 0 0; font-size:.98rem; line-height:1.8; flex-grow:1}
.t-card .who{margin-top:20px; border-top:1px solid var(--hair); padding-top:14px}
.t-card .who b{display:block; font-size:.9rem}
.t-card .who span{font-size:.78rem; color:var(--sub)}
.t-note{text-align:center; color:var(--sub); font-size:.8rem; margin-top:24px}

/* books */
.bookshelf{display:grid; grid-template-columns:repeat(5,1fr); gap:20px 18px; max-width:960px; margin-inline:auto}
@media(max-width:760px){.bookshelf{grid-template-columns:repeat(3,1fr); gap:16px 12px}}
@media(max-width:480px){.bookshelf{grid-template-columns:repeat(2,1fr)}}
.bk{margin:0}
.bk img{width:100%; display:block; border-radius:10px; border:1px solid var(--hair); box-shadow:0 12px 28px rgba(0,0,0,.09)}
.bk figcaption{text-align:center; font-size:.75rem; color:var(--sub); margin-top:9px; font-family:'IBM Plex Mono',monospace}
@media(min-width:761px){.bk:last-child:nth-child(5n+1){grid-column:3}}
.book-note{margin-top:28px; color:var(--sub); font-size:.88rem; text-align:center}

/* contact */
.contact{text-align:center; max-width:620px; margin-inline:auto}
.contact h2{font-size:clamp(1.7rem,4.5vw,2.6rem); font-weight:800; letter-spacing:-.02em}
.contact>p{color:var(--sub); margin:16px 0 0}
.tel-big{margin-top:36px; display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap}
.tel-big .val{font-size:clamp(1.5rem,5vw,2.2rem); font-weight:800; letter-spacing:.01em; font-variant-numeric:tabular-nums; user-select:all}
.copy{font-size:.78rem; border:1px solid var(--hair); background:none; color:var(--sub); border-radius:999px; padding:7px 16px; cursor:pointer; font-family:inherit; font-weight:500}
.copy:hover{border-color:var(--gold-deep); color:var(--ink); background:var(--gold-soft)}
.ch-links{margin-top:22px; display:flex; gap:28px; justify-content:center; flex-wrap:wrap; font-size:.92rem}
.ch-links a{color:var(--sub); text-decoration:none; border-bottom:1px solid var(--hair); padding-bottom:2px}
.ch-links a:hover{color:var(--ink); border-color:var(--ink)}

footer{border-top:1px solid var(--hair); padding-block:32px}
.foot{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:.78rem; color:var(--sub)}

@media (max-width:640px){
  .hero{padding-block:64px 52px}
  section{padding-block:60px}
}
@media (prefers-reduced-motion:no-preference){
  .vid,.course,.stat{transition:transform .2s ease}
  .vid:hover,.course:hover{transform:translateY(-3px)}
}
:focus-visible{outline:2px solid var(--gold-deep); outline-offset:3px}

/* mobile readability */
@media(max-width:700px){
  html{font-size:18px}
  .way p,.course p,.t-card p.quote,.contact>p{font-size:1rem; line-height:1.85}
  .stat span,.who span,.meta{font-size:.85rem}
}

.course .dl{display:inline-block; margin-top:16px; font-size:.85rem; font-weight:600; color:var(--ink); text-decoration:none; border-bottom:2px solid var(--gold); padding-bottom:2px}
.course .dl:hover{background:var(--gold-soft)}

.runs{color:var(--ink); font-weight:700; background:var(--gold-soft); border:1px solid var(--gold); border-radius:999px; padding:2px 11px; letter-spacing:.02em}
.idx-r{display:flex; gap:6px}

.t-stats{display:flex; gap:40px; justify-content:center; flex-wrap:wrap; margin-top:34px; text-align:center}
.t-stats b{display:block; font-size:1.9rem; font-weight:800; letter-spacing:-.02em}
.t-stats b::after{content:""; display:block; width:26px; height:3px; background:var(--gold); margin:8px auto 0; border-radius:2px}
.t-stats span{display:block; margin-top:8px; font-size:.78rem; color:var(--sub); max-width:180px}

.amen{display:grid; grid-template-columns:repeat(2,max-content); gap:12px 44px; justify-content:center; margin:26px auto 0; text-align:left}
.amen div{font-size:.92rem; display:flex; align-items:baseline; gap:10px}
.amen div::before{content:"✓"; color:var(--gold-deep); font-weight:800}
@media(max-width:600px){.amen{grid-template-columns:1fr; gap:10px}}

.letter{max-width:720px; margin-inline:auto; text-align:center}
.letter p.msg{font-size:clamp(1.05rem,2.6vw,1.3rem); line-height:2; font-weight:300}
.letter p.msg b{font-weight:600}
.letter .sign{margin-top:22px; color:var(--sub); font-size:.9rem}
.letter .sign b{display:block; color:var(--ink); font-size:1rem; font-weight:700; margin-bottom:2px}

.kn{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; max-width:1020px; margin-inline:auto}
.kn a{display:flex; flex-direction:column; gap:10px; background:var(--card); border:1px solid var(--hair); border-radius:14px; padding:22px 24px; text-decoration:none; color:var(--ink)}
.kn a b{font-size:.98rem; font-weight:700; line-height:1.55}
.kn a span{font-size:.82rem; color:var(--gold-deep); font-weight:600}
.kn a:hover{border-color:var(--gold-deep); background:var(--gold-soft)}

.pick{max-width:920px; margin-inline:auto; border:1px solid var(--hair); border-radius:16px; overflow:hidden; background:var(--card)}
.pick .prow{display:grid; grid-template-columns:1fr max-content; gap:18px; align-items:center; padding:16px 24px; border-top:1px solid var(--hair)}
.pick .prow:first-child{border-top:none}
.pick .prow p{margin:0; font-size:.93rem; line-height:1.7}
.pick .prow a{white-space:nowrap; font-size:.8rem; font-weight:700; color:var(--ink); text-decoration:none; background:var(--gold-soft); border:1px solid var(--gold); border-radius:999px; padding:6px 14px}
.pick .prow a:hover{background:var(--gold)}
.pick-note{text-align:center; color:var(--sub); font-size:.85rem; margin-top:22px}
.pick-note a{color:var(--ink); font-weight:600}
@media(max-width:560px){.pick .prow{grid-template-columns:1fr; gap:10px}}

/* HR keywords on course cards + HR FAQ */
.kw{display:flex; flex-wrap:wrap; gap:6px; margin-top:4px}
.kw .kw-l{width:100%; font-size:.72rem; color:var(--sub); letter-spacing:.02em}
.kw .chip{font-size:.76rem; line-height:1.6; color:var(--ink); background:var(--band); border:1px solid var(--hair); border-radius:999px; padding:2px 10px}
.faq{max-width:820px; margin-inline:auto; border:1px solid var(--hair); border-radius:16px; overflow:hidden; background:var(--card)}
.faq details{border-top:1px solid var(--hair)}
.faq details:first-child{border-top:none}
.faq summary{cursor:pointer; list-style:none; padding:18px 60px 18px 24px; font-weight:600; font-size:.98rem; line-height:1.6; position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:22px; top:50%; transform:translateY(-50%); width:26px; height:26px; border-radius:50%; background:var(--gold-soft); border:1px solid var(--gold); display:grid; place-items:center; font-weight:500; line-height:1}
.faq details[open] summary::after{content:"\2013"}
.faq details p{margin:0; padding:0 24px 20px; color:var(--sub); font-size:.93rem}
.faq-note{text-align:center; color:var(--sub); font-size:.85rem; margin-top:22px}
.faq-note a{color:var(--ink); font-weight:600}
#faq{border-bottom:1px solid var(--hair)}
@media(max-width:420px){.clients span{white-space:normal; text-align:center}}

/* ---- course pages ---- */
.c-hero{padding-block:72px 64px; text-align:center}
.crumb{font-size:.8rem; color:var(--sub); margin:0 0 26px}
.crumb a{color:var(--sub); text-decoration:none; border-bottom:1px solid var(--hair)}
.crumb a:hover{color:var(--ink)}
.c-idx{font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--sub); letter-spacing:.1em; display:inline-flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:center}
.c-idx .sig{color:#1d1d1f; font-weight:600; background:var(--gold); border-radius:999px; padding:2px 11px}
.c-hero h1{font-size:clamp(2rem,5.6vw,3.3rem); font-weight:800; letter-spacing:-.02em; max-width:22ch; margin:16px auto 0}
.c-sub{font-weight:500; max-width:56ch; margin:18px auto 0; line-height:1.7}
.c-hero p.lead{font-size:clamp(1rem,1.9vw,1.1rem); color:var(--sub); max-width:58ch; margin:16px auto 0}
.c-meta{display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:24px}
.c-meta span{font-size:.8rem; background:var(--card); border:1px solid var(--hair); border-radius:999px; padding:4px 14px}
.c-kw{display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin-top:14px}
.c-kw span{font-size:.74rem; color:var(--sub); padding:2px 4px}
.c-kw span::before{content:"#"; color:var(--gold-deep); margin-right:2px}
.c-hero .stats{margin-top:46px}
.c-hero .stat b{font-size:1.6rem}
.qt{max-width:760px; margin:0 auto; text-align:center}
.qt blockquote{margin:0; font-size:clamp(1.15rem,2.8vw,1.5rem); font-weight:600; line-height:1.7}
.qt blockquote::before{content:"\201C"; display:block; font-family:Georgia,serif; font-size:3rem; line-height:.6; color:var(--gold); margin-bottom:14px}
.qt cite{display:block; margin-top:14px; font-style:normal; color:var(--sub); font-size:.88rem}
.qt-sec{padding-block:64px}
.pick .prow .tag{justify-self:start; white-space:nowrap; font-size:.8rem; font-weight:700; background:var(--gold-soft); border:1px solid var(--gold); border-radius:999px; padding:6px 14px}
.model-note{max-width:760px; margin:-18px auto 36px; text-align:center; color:var(--sub); font-size:.92rem}
.step{background:var(--card); border:1px solid var(--hair); border-radius:18px; padding:28px; margin:0 auto 16px; max-width:1000px}
.step-h{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.step-n{flex:none; width:40px; height:40px; border-radius:50%; background:var(--gold); color:#1d1d1f; display:grid; place-items:center; font-weight:800; font-size:1.05rem}
.step-h h3{font-size:1.2rem; font-weight:700}
.step-en{font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--sub); letter-spacing:.1em; text-transform:uppercase}
.step-key{margin:16px 0 0; font-size:.9rem; background:var(--gold-soft); border-left:3px solid var(--gold); border-radius:8px; padding:10px 14px}
.subs{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; margin-top:16px}
.sub{background:var(--band); border-radius:12px; padding:16px 18px}
.sub .code{font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--gold-deep); font-weight:600; letter-spacing:.06em}
.sub b{display:block; font-size:.96rem; margin-top:2px; line-height:1.5}
.sub p{margin:6px 0 0; font-size:.86rem; color:var(--sub); line-height:1.7}
.ex{max-width:820px; margin-inline:auto; background:var(--card); border:1px solid var(--hair); border-top:4px solid var(--gold); border-radius:18px; padding:30px}
.ex h3{font-size:1.15rem; font-weight:700}
.ex .ex-note{font-size:.8rem; color:var(--sub); margin:4px 0 0}
.ex ol{list-style:none; margin:18px 0 0; padding:0; display:grid; gap:12px}
.ex li{display:grid; grid-template-columns:150px 1fr; gap:14px; align-items:baseline; font-size:.94rem}
.ex li b{font-size:.84rem; background:var(--band); border-radius:8px; padding:3px 10px; justify-self:start}
@media(max-width:560px){.ex li{grid-template-columns:1fr; gap:4px}}
.sched{max-width:860px; margin-inline:auto; border:1px solid var(--hair); border-radius:16px; overflow:hidden; background:var(--card)}
.slot{display:grid; grid-template-columns:150px 1fr; gap:18px; padding:16px 24px; border-top:1px solid var(--hair); align-items:baseline}
.slot:first-child{border-top:none}
.slot .t{font-family:'IBM Plex Mono',monospace; font-size:.82rem; font-weight:600}
.slot b{font-size:.98rem}
.slot .ws{display:inline-block; margin-left:8px; font-size:.68rem; font-weight:700; background:var(--gold); border-radius:999px; padding:1px 9px; vertical-align:middle}
.slot p{margin:4px 0 0; font-size:.88rem; color:var(--sub)}
@media(max-width:560px){.slot{grid-template-columns:1fr; gap:4px}}
.sched-note{text-align:center; color:var(--sub); font-size:.85rem; margin-top:16px}
.acts{display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:26px}
.acts span{font-size:.85rem; background:var(--card); border:1px solid var(--hair); border-radius:999px; padding:5px 14px}
.fr{max-width:860px; margin:26px auto 0; display:grid; gap:10px}
.fr div{display:grid; grid-template-columns:110px 1fr; gap:14px; font-size:.92rem; align-items:baseline}
.fr div b{font-size:.78rem; background:var(--ink); color:#fff; border-radius:999px; padding:2px 12px; justify-self:start}
@media(max-width:560px){.fr div{grid-template-columns:1fr; gap:4px}}
.bookcard{display:flex; gap:24px; align-items:center; max-width:640px; margin:40px auto 0; background:var(--card); border:1px solid var(--hair); border-radius:18px; padding:22px}
.bookcard img{width:96px; flex:none; border-radius:8px; border:1px solid var(--hair); box-shadow:0 10px 22px rgba(0,0,0,.08)}
.bookcard b{display:block; font-size:1rem; line-height:1.5}
.bookcard span{display:block; font-size:.84rem; color:var(--sub); margin-top:6px}
.testi.one{max-width:640px; grid-template-columns:1fr}
.score{text-align:center; margin-top:30px}
.score b{display:block; font-size:2rem; font-weight:800}
.score span{font-size:.85rem; color:var(--sub)}
.cta-box{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:30px}
.btn-o{display:inline-block; text-decoration:none; font-weight:600; font-size:.95rem; padding:12px 24px; border-radius:999px; border:1px solid var(--ink); color:var(--ink)}
.btn-o:hover{background:var(--band)}
.more{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; max-width:1000px; margin-inline:auto}
.more a{display:flex; flex-direction:column; gap:6px; text-decoration:none; color:var(--ink); background:var(--card); border:1px solid var(--hair); border-radius:14px; padding:20px 22px}
.more a span{font-family:'IBM Plex Mono',monospace; font-size:.68rem; color:var(--sub); letter-spacing:.1em}
.more a b{font-size:.98rem; line-height:1.5}
.more a:hover{border-color:var(--gold-deep); background:var(--gold-soft)}
.foot-courses{display:flex; flex-wrap:wrap; gap:6px 18px; font-size:.78rem; margin-bottom:14px}
.foot-courses a{color:var(--sub); text-decoration:none}
.foot-courses a:hover{color:var(--ink)}
.course .more-link{display:inline-block; font-size:.88rem; font-weight:700; color:var(--ink); text-decoration:none; background:var(--gold-soft); border:1px solid var(--gold); border-radius:999px; padding:6px 16px; align-self:flex-start}
.course .more-link:hover{background:var(--gold)}
.course h3 a{color:inherit; text-decoration:none}
.course h3 a:hover{text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:4px}