.commerce-section { max-width:1200px;margin:0 auto;padding:36px 20px; }
.commerce-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px; }
.commerce-card { background:#fff;border:1px solid #deded8;padding:24px; }
.commerce-card img { width:100%;aspect-ratio:4/3;object-fit:cover; }
.commerce-card h3 { font-size:24px;margin:18px 0; }
.commerce-card p { line-height:1.8;margin:12px 0; }
.commerce-description { white-space:pre-line; }
.commerce-form { display:grid;gap:14px;margin-top:20px; }
.commerce-form label { display:grid;gap:8px;font-size:14px; }
.commerce-form input,.commerce-form select,.commerce-form textarea { padding:12px;border:1px solid #d6d7d0;width:100%;font:inherit;background:#fff; }
.commerce-button { display:inline-block;cursor:pointer;background:#183e2a;color:white;padding:13px 20px;border:0;text-align:center;font:inherit; }
.commerce-button:disabled { opacity:.5;cursor:default; }
.commerce-outline { background:#fff;color:#183e2a;border:1px solid #183e2a; }
.commerce-status { margin:20px 0;font-size:18px;line-height:1.6; }
.commerce-actions { display:flex;flex-wrap:wrap;gap:12px; }
.commerce-qr { padding:16px;display:inline-block;background:#fff; }
.commerce-message { color:#a13d30;line-height:1.8;min-height:1.8em; }
.commerce-muted { color:#74796d;font-size:14px; }
@media(min-width:900px){.commerce-payment {max-width:760px;padding-top:60px;padding-bottom:100px;}}

.commerce-section [hidden], [data-course-catalog][hidden] { display:none !important; }

.commerce-course-section { max-width:1480px;padding:24px 22px 46px; }
.commerce-course-grid { grid-template-columns:repeat(auto-fill,minmax(520px,1fr));align-items:stretch;gap:16px; }
.commerce-course-card { padding:0;overflow:hidden;display:grid;grid-template-columns:minmax(200px,38%) minmax(0,1fr);min-height:240px;border-color:#e7e4dc;box-shadow:0 8px 24px rgba(32,35,29,.045); }
.commerce-course-card img.commerce-course-cover,.commerce-course-cover { display:block;width:calc(100% - 28px);height:auto;min-height:0;max-height:none;aspect-ratio:16/10;align-self:center;margin:0 14px;object-fit:cover;background:#f1eee8; }
.commerce-course-cover--empty { display:grid;place-items:center;box-sizing:border-box;overflow:hidden;padding:8px;color:#a99d83;letter-spacing:.12em;text-align:center;overflow-wrap:anywhere;font-family:Georgia,serif;font-size:13px; }
.commerce-course-content { min-width:0;padding:17px 19px 18px;display:flex;flex-direction:column; }
.commerce-course-kicker { margin:0 0 5px !important;color:#a78b49;font-size:10px;letter-spacing:.14em;text-transform:uppercase; }
.commerce-course-card h3 { font-size:19px;line-height:1.35;margin:0 0 5px; }
.commerce-course-subtitle { color:#686b64;line-height:1.45 !important;margin:0 0 8px !important;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:13px; }
.commerce-course-meta { display:grid;gap:4px;margin:5px 0 8px; }
.commerce-course-meta p { display:grid;grid-template-columns:38px minmax(0,1fr);gap:7px;margin:0;font-size:12px;line-height:1.45;overflow-wrap:anywhere; }
.commerce-course-meta span { color:#82847c; }
.commerce-course-details { margin:0 0 7px;border-top:1px solid #eceae5;padding-top:7px; }
.commerce-course-details summary { cursor:pointer;color:#596455;font-size:12px; }
.commerce-course-details p { white-space:pre-line;font-size:13px;line-height:1.55;margin:7px 0 0; }
.commerce-course-bottom { margin-top:auto;padding:8px 0 4px;display:flex;align-items:baseline;justify-content:space-between;gap:10px; }
.commerce-course-bottom strong { font-size:18px;color:#20221f; }
.commerce-course-bottom small { font-size:12px;font-weight:400;color:#77796f; }
.commerce-course-bottom span { color:#77796f;font-size:12px;white-space:nowrap; }
.commerce-course-countdown { margin:0 0 9px;color:#8b7544;font-size:12px;line-height:1.4;font-variant-numeric:tabular-nums; }
.commerce-course-countdown.is-expired { color:#a13d30; }
.commerce-course-register { width:auto;align-self:flex-start;min-height:38px;padding:9px 17px;font-size:13px; }
.commerce-course-register:disabled { opacity:1;cursor:not-allowed;background:#f2f3ef;color:#70786f;border:1px solid #dfe2dc;box-shadow:none; }
.commerce-course-notice { min-height:0;margin:12px 0 0;padding:9px 12px;border-left:2px solid #b69b5b;background:#f7f5ef;color:#756744;font-size:13px;line-height:1.5; }
.commerce-course-notice:empty { display:none; }
.commerce-course-modal[hidden] { display:none !important; }
.commerce-course-modal { position:fixed;inset:0;z-index:10000;background:rgba(19,24,20,.56);display:grid;place-items:center;padding:24px; }
.commerce-course-dialog { position:relative;width:min(100%,600px);max-height:min(88vh,760px);overflow:auto;background:#fff;padding:30px 32px 28px;box-shadow:0 24px 70px rgba(0,0,0,.22); }
.commerce-course-dialog h3 { margin:0 44px 6px 0;font-size:23px;line-height:1.4; }
.commerce-course-close { position:absolute;right:18px;top:14px;border:0;background:transparent;color:#5b5c56;font-size:30px;line-height:1;cursor:pointer;padding:8px; }
.commerce-course-price { margin:8px 0 18px;color:#77796f;font-size:14px; }
.commerce-course-price strong { color:#183e2a;font-size:21px; }
.commerce-course-form { grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;margin-top:0; }
.commerce-course-form label { gap:6px;font-size:13px;color:#55584f; }
.commerce-course-form input,.commerce-course-form textarea { box-sizing:border-box;border-radius:3px;min-height:44px; }
.commerce-course-form .commerce-course-note,.commerce-course-form-message,.commerce-course-submit { grid-column:1 / -1; }
.commerce-course-form textarea { resize:vertical; }
.commerce-course-form-message { min-height:0;margin:0; }
.commerce-course-submit { width:100%;min-height:48px; }
.commerce-course-modal-open { overflow:hidden; }
@media(max-width:640px) {
  .commerce-course-section { padding:24px 14px 42px; }
  .commerce-course-grid { grid-template-columns:1fr;gap:16px; }
  .commerce-course-card { grid-template-columns:96px minmax(0,1fr);min-height:0; }
  .commerce-course-card img.commerce-course-cover,.commerce-course-cover { width:calc(100% - 12px);height:auto;min-height:0;aspect-ratio:3/4;margin:0 6px; }
  .commerce-course-cover--empty {font-size:9px;letter-spacing:.04em;}
  .commerce-course-content { padding:13px 13px 14px; }
  .commerce-course-card h3 { font-size:16px;line-height:1.35; }
  .commerce-course-subtitle { font-size:12px; }
  .commerce-course-meta p { grid-template-columns:32px minmax(0,1fr);gap:5px;font-size:11px; }
  .commerce-course-bottom strong { font-size:16px; }
  .commerce-course-bottom span { font-size:10px; }
  .commerce-course-countdown { font-size:11px; }
  .commerce-course-register { min-height:34px;padding:7px 12px;font-size:12px; }
  .commerce-course-notice { font-size:12px; }
  .commerce-course-modal { align-items:end;padding:10px 10px max(10px,env(safe-area-inset-bottom)); }
  .commerce-course-dialog { width:100%;max-height:88dvh;padding:26px 20px 20px;border-radius:14px 14px 8px 8px; }
  .commerce-course-dialog h3 { font-size:20px; }
  .commerce-course-form { grid-template-columns:1fr;gap:11px; }
  .commerce-course-form .commerce-course-note,.commerce-course-form-message,.commerce-course-submit { grid-column:1; }
}
