/* Garissa University short courses — public site */
:root{
  --g9:#0b2e20; --g:#14432c; --g6:#1f6b45; --g1:#e7f1eb;
  --gold:#c9a227; --gold6:#a8821a; --gold1:#fbf3dc;
  --bg:#f4f6f3; --paper:#fff; --ink:#17231c; --muted:#5c6b62; --line:#dfe6e0;
  --r:14px; --shadow:0 1px 2px rgba(11,46,32,.06),0 8px 24px rgba(11,46,32,.06);
  --head:'Barlow Semi Condensed','Arial Narrow',Arial,sans-serif; --body:'Source Sans 3','Segoe UI',Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--g6)} a:hover{color:var(--g)}
h1,h2,h3{font-family:var(--head);line-height:1.1;margin:0 0 .5rem;letter-spacing:.005em}
h1{font-size:clamp(2rem,4.2vw,3.1rem);font-weight:800;text-wrap:balance}
h2{font-size:1.55rem;font-weight:700;margin-top:2rem}
h3{font-size:1.2rem;font-weight:700}
p{margin:0 0 .9rem}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.narrow{max-width:720px}
.small{font-size:.88rem} .muted{color:var(--muted)} .center{text-align:center} .mono{font-family:ui-monospace,Consolas,monospace;font-size:.92em}
.hidden{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--ink);padding:.5rem 1rem;z-index:99}.skip:focus{left:0}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.eyebrow{font:700 .78rem/1.2 var(--head);letter-spacing:.14em;text-transform:uppercase;color:var(--gold6);margin:0 0 .4rem}
.eyebrow.light{color:var(--gold)}

/* buttons, pills, notices */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:2px solid transparent;border-radius:10px;padding:.62rem 1.1rem;font:700 .98rem/1.1 var(--body);cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.btn-gold{background:var(--gold);color:var(--g9)} .btn-gold:hover{background:#d8b136;color:var(--g9)}
.btn-line{background:transparent;border-color:var(--line);color:var(--g)} .btn-line:hover{border-color:var(--g6);color:var(--g)}
.btn-sm{padding:.42rem .8rem;font-size:.88rem} .btn-block{width:100%}
.btn:disabled{opacity:.55;cursor:not-allowed}
.pill{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.18rem .65rem;font:700 .76rem/1.4 var(--body);text-decoration:none;white-space:nowrap}
.pill.ok{background:var(--g1);color:var(--g)} .pill.warn{background:var(--gold1);color:#7a5d00} .pill.info{background:#e7eef8;color:#1f4f86}
.pill.bad{background:#fbe9e9;color:#9b1c1c} .pill.mute{background:#eef1ef;color:var(--muted)}
.notice{display:flex;gap:.75rem;align-items:flex-start;border-radius:12px;padding:.85rem 1rem;margin:0 0 1rem;border:1px solid}
.notice i{margin-top:.2rem}
.notice.ok{background:#eef7f1;border-color:#cfe5d7;color:#164b2f}.notice.bad{background:#fdf0f0;border-color:#f2cfcf;color:#7f1d1d}
.notice.info{background:#eef3fa;border-color:#d4e1f2;color:#1e3f66}.notice.warn{background:var(--gold1);border-color:#efdca6;color:#6b5100}

/* header */
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--line)}
.top-row{display:flex;align-items:center;gap:1rem;min-height:68px}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--ink);min-width:0}
.brand img{border-radius:50%;flex:none}
.brand b{display:block;font:800 1.08rem/1.1 var(--head);color:var(--g)}
.brand small{display:block;font-size:.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav{margin-left:auto;display:flex;align-items:center;gap:.25rem}
.nav a{padding:.5rem .7rem;border-radius:8px;color:var(--ink);text-decoration:none;font-weight:600;font-size:.95rem}
.nav a:not(.btn):hover,.nav a.on{background:var(--g1);color:var(--g)}
.nav a.btn{margin-left:.35rem;padding:.5rem .9rem}
.nav-toggle{display:none;margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:8px;width:42px;height:42px;font-size:1.1rem;color:var(--g)}
@media (max-width:900px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;left:0;right:0;top:68px;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:.5rem 20px 1rem;box-shadow:var(--shadow)}
  .nav.open{display:flex} .nav a.btn{margin:.4rem 0 0}
}

/* hero */
.hero{position:relative;background:var(--g9);color:#f2f6f3;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:
  radial-gradient(circle at 85% 20%,rgba(201,162,39,.22),transparent 40%),
  repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 2px,transparent 2px 22px)}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--gold)}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:3rem;align-items:center;padding-top:4.2rem;padding-bottom:4.2rem}
.hero h1{color:#fff;max-width:16ch}
.hero .lead{font-size:1.15rem;color:#cfdcd4;max-width:52ch}
.search{position:relative;margin:1.6rem 0 1rem;max-width:560px}
.search i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--muted)}
.search input{width:100%;border:0;border-radius:12px;padding:1rem 1rem 1rem 2.8rem;font:1.05rem var(--body);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.06);color:#eef4f0;border-radius:999px;padding:.4rem .85rem;font:600 .9rem var(--body);cursor:pointer}
.chip:hover,.chip.on{background:var(--gold);border-color:var(--gold);color:var(--g9)}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:0;background:rgba(255,255,255,.14);border-radius:var(--r);overflow:hidden;border:1px solid rgba(255,255,255,.14)}
.hero-stats div{background:rgba(11,46,32,.55);padding:1.3rem 1.2rem}
.hero-stats dt{font:800 2.4rem/1 var(--head);color:var(--gold);font-variant-numeric:tabular-nums}
.hero-stats dd{margin:.35rem 0 0;color:#cfdcd4;font-size:.92rem}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr;gap:2rem;padding-top:2.6rem;padding-bottom:3rem}}

/* bands, filters, grid */
.band{padding:3rem 0}
.band.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-title{margin-top:0}
.filters{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1.5rem}
.seg{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:10px;padding:3px}
.seg button{border:0;background:transparent;border-radius:8px;padding:.45rem .8rem;font:600 .9rem var(--body);color:var(--muted);cursor:pointer}
.seg button.on{background:var(--g);color:#fff}
.sel select{border:1px solid var(--line);background:#fff;border-radius:10px;padding:.55rem .7rem;font:600 .9rem var(--body);color:var(--ink)}
.count{margin-left:auto;color:var(--muted);font-size:.9rem;font-variant-numeric:tabular-nums}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.25rem}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.course{display:flex;flex-direction:column;overflow:hidden;transition:transform .15s,box-shadow .15s}
.course:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(11,46,32,.08),0 16px 34px rgba(11,46,32,.12)}
.cover{position:relative;display:block;aspect-ratio:16/9;background:var(--g);overflow:hidden}
.cover img{width:100%;height:100%;object-fit:cover}
.cover-mark{position:absolute;right:-.05em;bottom:-.28em;font:800 7.5rem/1 var(--head);color:rgba(255,255,255,.16)}
.tag{position:absolute;left:.75rem;top:.75rem;border-radius:999px;padding:.25rem .65rem;font:700 .75rem var(--body);display:inline-flex;gap:.35rem;align-items:center}
.tag-cert{background:var(--gold);color:var(--g9)} .tag-short{background:#fff;color:var(--g)}
.course-body{display:flex;flex-direction:column;flex:1;padding:1rem 1.1rem 1.1rem}
.course-body h3{font-size:1.25rem;margin:0 0 .3rem}
.course-body h3 a{color:var(--ink);text-decoration:none} .course-body h3 a:hover{color:var(--g6)}
.course-body .sub{color:var(--muted);font-size:.93rem;margin:0 0 .6rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.meta{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-wrap:wrap;gap:.25rem .9rem;font-size:.85rem;color:var(--muted)}
.meta li+li:before{content:"·";margin:0 .45rem 0 -.5rem}
.course-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.5rem;border-top:1px solid var(--line);padding-top:.85rem}
.price{font:800 1.25rem var(--head);color:var(--g);font-variant-numeric:tabular-nums}
.price.free{color:var(--g6);background:var(--g1);border-radius:8px;padding:.1rem .55rem;font-size:1.05rem}
.empty{text-align:center;padding:3rem 1rem;color:var(--muted)}
.empty i{font-size:2rem;color:var(--gold6);display:block;margin-bottom:.6rem}.empty b{display:block;color:var(--ink);font-size:1.15rem;margin-bottom:.3rem}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;counter-reset:s}
.steps li{position:relative;padding:1.1rem 1.1rem 1rem;border-top:3px solid var(--gold);background:var(--bg);border-radius:0 0 12px 12px}
.steps .n{font:800 2rem/1 var(--head);color:var(--gold6);display:block;margin-bottom:.4rem}
.steps b{font:700 1.15rem var(--head);display:block;margin-bottom:.3rem}
.steps p{color:var(--muted);font-size:.93rem;margin:0}
@media (max-width:860px){.steps{grid-template-columns:1fr 1fr}}@media (max-width:520px){.steps{grid-template-columns:1fr}}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}@media (max-width:760px){.two{grid-template-columns:1fr}}
.explain{padding:1.5rem}.explain i{font-size:1.5rem;color:var(--gold6);margin-bottom:.6rem}.explain p{color:var(--muted);margin:0}

/* course page */
.course-hero{background:var(--g9);color:#e9f0ec;position:relative}
.course-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--gold)}
.course-hero-grid{padding-top:2.4rem;padding-bottom:2.6rem;max-width:1180px}
.course-hero h1{color:#fff;max-width:24ch;font-size:clamp(1.9rem,3.6vw,2.7rem)}
.course-hero .lead{color:#cfdcd4;max-width:62ch;font-size:1.1rem}
.crumbs{font-size:.85rem;color:#a9bdb1;margin-bottom:1rem}.crumbs a{color:#d9e5de}.crumbs i{font-size:.65rem;margin:0 .35rem}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;padding:0;margin:1rem 0 0;color:#d9e5de;font-size:.93rem}.facts i{color:var(--gold);margin-right:.35rem}
.course-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:2.5rem;align-items:start}
.course-main>h2:first-child{margin-top:0}
.prose{max-width:68ch}.prose ul,.prose ol{padding-left:1.3rem}.prose h3{margin-top:1.2rem}
.ticks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1.4rem}
.ticks li{display:flex;gap:.6rem}.ticks i{color:var(--g6);margin-top:.3rem}
@media (max-width:620px){.ticks{grid-template-columns:1fr}}
.dots{padding-left:1.2rem}
.curriculum{display:flex;flex-direction:column;gap:.6rem}
.curriculum details{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.curriculum summary{display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;cursor:pointer;list-style:none}
.curriculum summary::-webkit-details-marker{display:none}
.curriculum summary .small{margin-left:auto}
.mod-n{width:1.8rem;height:1.8rem;flex:none;border-radius:50%;background:var(--g1);color:var(--g);display:flex;align-items:center;justify-content:center;font:800 .95rem var(--head)}
.curriculum ul{list-style:none;margin:0;padding:0 1rem .6rem 3.5rem}
.curriculum li{display:flex;align-items:center;gap:.6rem;padding:.45rem 0;border-top:1px solid var(--line);font-size:.95rem}
.curriculum li i{color:var(--muted);width:1rem}.curriculum li span:first-of-type{flex:1}
.instructor{display:flex;gap:1rem;padding:1.2rem;align-items:flex-start}
.avatar{width:56px;height:56px;flex:none;border-radius:50%;background:var(--g);color:var(--gold);display:flex;align-items:center;justify-content:center;font:800 1.5rem var(--head)}
.enrol-card{position:sticky;top:88px;overflow:hidden;margin-top:-6rem}
.enrol-cover{position:relative;aspect-ratio:16/9;background:var(--g)}.enrol-cover img{width:100%;height:100%;object-fit:cover}
.enrol-body{padding:1.2rem}
.enrol-price{font:800 2rem var(--head);color:var(--g);margin-bottom:.8rem}.enrol-price.free{color:var(--g6)}
.enrol-facts{list-style:none;padding:0;margin:1rem 0 0;border-top:1px solid var(--line)}
.enrol-facts li{display:flex;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--line)}.enrol-facts i{color:var(--gold6);width:1rem;margin-top:.2rem}
.bar{height:8px;background:var(--g1);border-radius:999px;overflow:hidden;margin:.7rem 0 .3rem}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--g6),var(--gold));border-radius:999px;transition:width .4s}
@media (max-width:960px){.course-layout{grid-template-columns:1fr}.enrol-card{position:static;margin-top:0;order:-1}}

/* forms */
.page-head{background:#fff;border-bottom:1px solid var(--line);padding:2.2rem 0 1.6rem}.page-head h1{font-size:clamp(1.8rem,3.2vw,2.4rem)}.page-head p{color:var(--muted);margin:0}
.form{padding:1.5rem}.form h1,.form h2{margin-top:0}
.f{display:block;margin-bottom:1rem;font-weight:600;font-size:.92rem}
.f small{display:block;font-weight:400;color:var(--muted);font-size:.82rem}
.f input,.f select,.f textarea{display:block;width:100%;margin-top:.35rem;border:1px solid #cdd8d0;border-radius:10px;padding:.7rem .8rem;font:1rem var(--body);background:#fff;color:var(--ink)}
.f input:focus,.f select:focus,.f textarea:focus{outline:3px solid rgba(201,162,39,.45);border-color:var(--gold6)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}@media (max-width:600px){.f2{grid-template-columns:1fr}}
.check{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;margin:0 0 1rem}.check input{margin-top:.25rem}
.auth{background:linear-gradient(180deg,#fff 0,var(--bg) 60%)}
.auth-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:3rem;align-items:start}
.auth-side{padding-top:1rem}.auth-side .lead{color:var(--muted);font-size:1.1rem}.auth-side .ticks{grid-template-columns:1fr;margin-top:1.4rem}
@media (max-width:860px){.auth-grid{grid-template-columns:1fr;gap:1.2rem}}

/* payment */
.summary{padding:1.2rem 1.3rem;margin-bottom:1rem}
.sum-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.sum-head small{display:block;color:var(--muted);font-size:.8rem}.amt-big{font:800 2rem var(--head);color:var(--g)}
.summary dl{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 1rem;margin:1rem 0 0}.summary dt{font-size:.8rem;color:var(--muted)}.summary dd{margin:0;font-weight:600}
.pay{padding:1.3rem;margin-bottom:1rem;border:2px solid var(--gold)}
.pay-head{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.pay-head img{border-radius:50%}.pay-head small{display:block;color:var(--muted)}.pay-head .amt{margin-left:auto;font:800 1.35rem var(--head);color:var(--g)}
.hint{color:#9b1c1c;font-size:.9rem;min-height:1.2em}
.waiting{display:flex;gap:.8rem;align-items:center;margin-top:1rem;background:var(--gold1);padding:.9rem;border-radius:10px}.waiting small{display:block;color:#6b5100}
.spin{width:22px;height:22px;flex:none;border:3px solid rgba(168,130,26,.3);border-top-color:var(--gold6);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.pay-slow{margin-top:.8rem}
.done{display:flex;gap:1rem;padding:1.3rem;margin-bottom:1rem;border:2px solid #9fd1b2;background:#f2faf5}.done>i{font-size:2rem;color:var(--g6)}.done h2{margin:0 0 .3rem}

/* my courses */
.mylist{display:flex;flex-direction:column;gap:1rem}
.mycourse{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:1.2rem;align-items:center;padding:.8rem;overflow:hidden}
.mythumb{position:relative;display:block;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:var(--g)}.mythumb img{width:100%;height:100%;object-fit:cover}.mythumb .cover-mark{font-size:5rem}
.mybody h3{margin:.1rem 0 .4rem}.mybody h3 a{color:var(--ink);text-decoration:none}
.myacts{display:flex;flex-direction:column;gap:.5rem;padding-right:.4rem}
@media (max-width:760px){.mycourse{grid-template-columns:1fr}.myacts{flex-direction:row;flex-wrap:wrap;padding:0}}

/* player */
body.learn .foot{display:none}
.player{display:grid;grid-template-columns:320px minmax(0,1fr);min-height:calc(100vh - 69px)}
.player-nav{background:#fff;border-right:1px solid var(--line);padding:1.2rem;overflow-y:auto;max-height:calc(100vh - 69px);position:sticky;top:69px}
.player-nav h2{font-size:1.25rem;margin:.8rem 0 .2rem}
.pn-mod{margin-top:1.1rem}.pn-mod>b{font:700 .95rem var(--head);color:var(--g);letter-spacing:.02em}
.pn-mod ul{list-style:none;margin:.4rem 0 0;padding:0}
.pn-mod li a,.pn-mod li .locked{display:flex;gap:.55rem;align-items:baseline;padding:.45rem .55rem;border-radius:8px;color:var(--ink);text-decoration:none;font-size:.93rem}
.pn-mod li a:hover{background:var(--bg)}.pn-mod li.on a{background:var(--g1);color:var(--g);font-weight:700}
.pn-mod li.done a i{color:var(--g6)}.pn-mod li a i{color:var(--muted);width:1rem}.locked{color:var(--muted)!important}
.player-main{padding:2rem clamp(1rem,4vw,3.5rem) 3rem;max-width:900px}
.player-main h1{font-size:clamp(1.7rem,3vw,2.3rem)}
.video{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;margin:1rem 0 1.4rem}.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-file{width:100%;border-radius:12px;background:#000;margin:1rem 0 1.4rem}
.lesson{font-size:1.05rem}
.filebox{display:flex;gap:.9rem;align-items:center;max-width:520px;padding:.9rem 1rem;border:1px solid var(--line);border-radius:12px;background:#fff;text-decoration:none;color:var(--ink);margin:1rem 0}
.filebox i{font-size:1.6rem;color:var(--gold6)}.filebox small{display:block;color:var(--muted)}.filebox:hover{border-color:var(--gold6)}
.player-actions{display:flex;justify-content:space-between;gap:1rem;margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid var(--line)}
@media (max-width:900px){.player{grid-template-columns:1fr}.player-nav{position:static;max-height:none;border-right:0;border-bottom:1px solid var(--line)}}

/* verify */
.verify{display:flex;gap:1rem;padding:1.4rem;margin-bottom:1rem}.verify>i{font-size:2.2rem}.verify.ok{border:2px solid #9fd1b2}.verify.ok>i{color:var(--g6)}.verify.bad{border:2px solid #f0b4b4}.verify.bad>i{color:#b91c1c}
.verify h2{margin:0 0 .5rem}.verify dl{display:grid;grid-template-columns:1fr 1fr;gap:.5rem 1rem;margin:0 0 .8rem}.verify dt{font-size:.8rem;color:var(--muted)}.verify dd{margin:0;font-weight:600}

/* footer */
.foot{background:var(--g9);color:#b8c9bf;padding:2.5rem 0 1.2rem;margin-top:2rem}
.foot a{color:#e1ebe5}.foot b{color:#fff}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}.foot-brand b{color:#fff}.foot-brand small{color:#9fb3a7}
.foot-base{border-top:1px solid rgba(255,255,255,.1);margin-top:1.6rem;padding-top:1rem}
@media (max-width:700px){.foot-grid{grid-template-columns:1fr}}

/* certificate */
.cert-page{background:#e9ece9}
.cert-bar{display:flex;justify-content:space-between;align-items:center;max-width:297mm;margin:1rem auto;padding:0 8px}
.cert-bar button{background:var(--g);color:#fff;border:0;border-radius:8px;padding:.6rem 1rem;font:700 .95rem var(--body);cursor:pointer}
.cert{width:297mm;height:210mm;margin:0 auto 2rem;background:#fffdf7;padding:9mm;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.cert-in{height:100%;border:2.5mm solid var(--g);outline:.6mm solid var(--gold);outline-offset:-4.5mm;padding:10mm 18mm;text-align:center;display:flex;flex-direction:column;align-items:center}
.cert-logo{width:26mm;height:26mm;border-radius:50%}
.cert-uni{font:800 9mm/1.1 var(--head);color:var(--g);letter-spacing:.06em;text-transform:uppercase;margin-top:2mm}
.cert-org{font-size:4mm;color:var(--muted)}
.cert-kind{font:700 6mm var(--head);color:var(--gold6);letter-spacing:.2em;text-transform:uppercase;margin:6mm 0 4mm}
.cert-this{font-size:4.2mm;color:var(--muted)}
.cert-name{font:italic 600 14mm/1.15 'Cormorant Garamond',Georgia,serif;color:var(--ink);margin:2mm 0 3mm;border-bottom:.4mm solid var(--gold);padding:0 10mm 1mm}
.cert-course{font:800 8mm/1.15 var(--head);color:var(--g);margin:2mm 0 1mm;max-width:220mm}
.cert-meta{font-size:3.8mm;color:var(--muted)}
.cert-foot{margin-top:auto;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:10mm}
.cert-sign{text-align:left}.cert-sign .line{display:block;width:60mm;border-bottom:.4mm solid var(--ink);margin-bottom:2mm;height:12mm}
.cert-sign b{display:block;font-size:4mm}.cert-sign small,.cert-no small{display:block;font-size:3.2mm;color:var(--muted)}
.cert-qr{text-align:center}.cert-qr #qr{background:#fff;padding:2mm;display:inline-block}.cert-qr small{display:block;font-size:3mm;color:var(--muted)}
.cert-no{text-align:right}.cert-no b{display:block;font:700 4.5mm ui-monospace,Consolas,monospace;color:var(--ink)}
@media print{@page{size:A4 landscape;margin:0}.cert-page{background:#fff}.cert-bar{display:none}.cert{margin:0;box-shadow:none}}
@media screen and (max-width:1150px){.cert{transform-origin:top left;transform:scale(calc((100vw - 16px)/1123));margin-bottom:calc(-794px * (1 - (100vw - 16px)/1123))}}
.spin.sm{width:16px;height:16px;border-width:2px;border-color:rgba(11,46,32,.25);border-top-color:var(--g9);display:inline-block;vertical-align:-3px}

.other-pay{padding:0}.other-pay>summary{cursor:pointer;padding:1rem 1.25rem;font-weight:600;color:var(--g);list-style:none}
.other-pay>summary::-webkit-details-marker{display:none}.other-pay>summary:before{content:"+ ";color:var(--gold6)}
.other-pay[open]>summary:before{content:"− "}.other-pay>form{padding:0 1.25rem 1.25rem}