/* ============================================================
   Commission Disclosure page — page-commission-disclosure.php
   (sub-page of Compliance). Intro + navy model card, fund-category
   and AMC-wise rate tables (cards on mobile), info + contact cards.
   Visual language mirrors pages/compliance.css.
   ============================================================ */

.comm-wrap{max-width:1140px;margin:0 auto}
.comm-sec{padding:80px 48px}
.comm-cats,.comm-bottom{background:#fff}
.comm-amcs{background:var(--bg)}

/* Centred section heading — title, gold bar, short note. */
.comm-head{text-align:center;margin:0 auto 40px}
.comm-head .sec-title{margin-bottom:0}
.comm-head .sec-title span{color:var(--gold)}
.comm-head .gbar{margin:16px auto 0}
.comm-note{font-size:15px;color:#777;line-height:1.7;max-width:760px;margin:18px auto 0}

.comm-card-title{font-family:'Playfair Display',serif;font-size:clamp(22px,2vw,26px);font-weight:800;color:var(--navy);line-height:1.25;margin:0 0 20px}

/* ── INTRO | OUR COMMISSION MODEL ── */
.comm-intro{background:var(--bg);padding:72px 48px}
.comm-intro-grid{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,72px);align-items:center}
.comm-lead{font-family:'Playfair Display',serif;font-size:clamp(22px,2.2vw,28px);font-weight:700;color:var(--navy);line-height:1.45;margin:0}
.comm-lead::before{content:'';display:block;width:40px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--gold),var(--gold-light));margin-bottom:22px}
.comm-model{background:linear-gradient(150deg,#09152A,var(--navy) 55%,var(--navy-light));border:1px solid rgba(201,151,58,.25);border-radius:20px;padding:38px 40px;box-shadow:0 8px 40px rgba(13,27,62,.12);position:relative;overflow:hidden}
.comm-model::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--gold),var(--gold-light))}
.comm-model .comm-card-title{color:#fff;margin-bottom:16px}
.comm-model-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(201,151,58,.14);border:1px solid rgba(201,151,58,.45);color:var(--gold-light);font-size:15px;font-weight:700;letter-spacing:.3px;padding:8px 18px;border-radius:100px;margin:0 0 18px}
.comm-model-text{font-size:16px;line-height:1.8;color:rgba(255,255,255,.75);margin:0}

/* ── TABLES (shared) ──
   `overflow:clip` (not hidden) rounds the corners without creating a
   scroll container, so the sticky header still sticks under the nav. */
.comm-table-card{background:#fff;border-radius:20px;border:1px solid rgba(13,27,62,.08);box-shadow:0 8px 40px rgba(13,27,62,.08);overflow:clip}
.comm-table{width:100%;border-collapse:collapse;font-size:15px}
.comm-table thead th{position:sticky;top:var(--nav-h);z-index:2;background:var(--navy);color:rgba(255,255,255,.85);font-size:11.5px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;text-align:left;padding:16px 20px;white-space:nowrap}
.comm-table tbody th,.comm-table tbody td{padding:16px 20px;border-top:1px solid rgba(13,27,62,.07);text-align:left;vertical-align:middle;color:#444;font-weight:400}
.comm-table tbody tr:first-child th,.comm-table tbody tr:first-child td{border-top:0}
.comm-table tbody tr{transition:background .15s}
.comm-table tbody tr:hover{background:rgba(201,151,58,.06)}
.comm-rate{font-weight:700!important;color:var(--navy)!important;white-space:nowrap;font-variant-numeric:tabular-nums}

/* Fund-category table. */
.comm-cat-cell{display:flex;align-items:center;gap:14px;min-width:280px}
.comm-cat-icon{width:44px;height:44px;flex-shrink:0;border-radius:12px;background:rgba(201,151,58,.1);border:1px solid rgba(201,151,58,.25);display:flex;align-items:center;justify-content:center;font-size:20px}
.comm-cat-text{display:flex;flex-direction:column;gap:3px}
.comm-cat-name{font-family:'Playfair Display',serif;font-size:17px;font-weight:800;color:var(--navy)}
.comm-cat-subs{font-size:13px;color:#888;line-height:1.5}
.comm-risk{display:inline-block;padding:5px 12px;border-radius:100px;font-size:12px;font-weight:700;white-space:nowrap;background:rgba(13,27,62,.06);color:var(--navy)}
.comm-risk--high-risk{background:rgba(239,68,68,.1);color:#C53030}
.comm-risk--moderate-high-risk{background:rgba(237,137,54,.13);color:#B45309}
.comm-risk--low-moderate-risk{background:rgba(201,151,58,.15);color:#8A6418}
.comm-risk--low-risk{background:rgba(59,140,90,.12);color:var(--green)}
.comm-type{display:inline-block;padding:4px 11px;border-radius:100px;border:1px solid rgba(59,140,90,.4);color:var(--green);font-size:12px;font-weight:700;white-space:nowrap}

/* AMC-wise table — zebra rows for the long list. */
.comm-amc-table tbody tr:nth-child(even){background:rgba(240,237,230,.45)}
.comm-amc-table tbody tr:nth-child(even):hover{background:rgba(201,151,58,.08)}
.comm-amc-table tbody th,.comm-amc-table tbody td{padding-top:13px;padding-bottom:13px}
.comm-amc-num{width:64px;color:#aaa!important;font-variant-numeric:tabular-nums}
.comm-amc-name{font-weight:600!important;color:var(--navy)!important}

/* ── IMPORTANT INFORMATION | CONTACT ── */
.comm-bottom-grid{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1.25fr 1fr;gap:32px;align-items:stretch}
.comm-card{border-radius:20px;padding:38px 40px;position:relative;overflow:hidden}
.comm-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--gold),var(--gold-light))}
.comm-info{background:#fff;border:1px solid rgba(13,27,62,.07);box-shadow:0 8px 40px rgba(13,27,62,.08)}
.comm-info-body p{font-size:16px;line-height:1.8;color:#444;margin:0 0 1em}
.comm-info-body > :last-child{margin-bottom:0}
.comm-info-body strong{color:var(--navy)}
.comm-info-body a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(201,151,58,.5)}
.comm-contact{background:linear-gradient(150deg,#09152A,var(--navy) 55%,var(--navy-light));border:1px solid rgba(201,151,58,.25)}
.comm-contact .comm-card-title{color:#fff}
.comm-dl{margin:0}
.comm-dl-row{display:grid;grid-template-columns:100px 1fr;gap:16px;padding:14px 0;border-top:1px solid rgba(255,255,255,.1)}
.comm-dl-row:last-child{padding-bottom:0}
.comm-dl dt{font-size:11.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold);padding-top:4px}
.comm-dl dd{margin:0;font-size:16px;font-weight:600;color:#fff;line-height:1.6;overflow-wrap:anywhere}
.comm-dl dd a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(201,151,58,.5);transition:color .15s,border-color .15s}
.comm-dl dd a:hover{color:var(--gold-light);border-bottom-color:var(--gold-light)}

/* ── RESPONSIVE ── */
@media(max-width:1000px){
  .comm-intro-grid,.comm-bottom-grid{grid-template-columns:1fr}
  .comm-cat-cell{min-width:220px}
}
@media(max-width:768px){
  .comm-sec{padding:52px 20px}
  .comm-intro{padding:44px 20px}
  .comm-head{margin-bottom:28px}
  .comm-model,.comm-card{padding:30px 22px;border-radius:16px}
  .comm-bottom-grid{gap:20px}

  /* Tables → stacked cards. Header row hidden; each cell carries its
     own label via data-label. */
  .comm-table-card{border-radius:16px}
  .comm-table thead{display:none}
  .comm-table,.comm-table tbody,.comm-table tr{display:block;width:100%}
  .comm-table tbody tr{padding:18px;border-top:1px solid rgba(13,27,62,.08)}
  .comm-table tbody tr:first-child{border-top:0}
  .comm-table tbody th,.comm-table tbody td{display:block;padding:0;border-top:0}

  .comm-cat-table tbody th{margin-bottom:12px}
  .comm-cat-cell{min-width:0}
  .comm-cat-table tbody td{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px dashed rgba(13,27,62,.1)}
  .comm-cat-table tbody td::before{content:attr(data-label);font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#999}

  .comm-amc-table tbody{counter-reset:amc}
  .comm-amc-table tbody tr{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;counter-increment:amc}
  .comm-amc-table .comm-amc-num{display:none}
  .comm-amc-table .comm-amc-name{grid-column:1 / -1;margin-bottom:2px}
  .comm-amc-table .comm-amc-name::before{content:counter(amc) '. ';color:#aaa;font-weight:500}
  .comm-amc-table tbody td{background:rgba(13,27,62,.04);border-radius:8px;padding:8px 10px;font-size:13.5px}
  .comm-amc-table tbody td::before{content:attr(data-label);display:block;font-size:10.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#999;margin-bottom:2px}

  .comm-dl-row{grid-template-columns:1fr;gap:4px;padding:13px 0}
  .comm-dl dt{padding-top:0}
}
@media(max-width:400px){
  .comm-amc-table tbody td{padding:7px 8px;font-size:12.5px}
}
