/* Trang "Quyền và nghĩa vụ của các bên" — bố cục A + mục 4 kiểu P4 (duyệt 10/11/2026). */
:root{
  --ecm-rights-tint:#f3effc;
  --ecm-rights-tint-2:#e3d9f8;
  --ecm-rights-blue:#1f5fd6;
  --ecm-rights-blue-tint:#edf3fe;
  --ecm-rights-on-dark:#c9d4ea;
  --ecm-rights-radius:14px;
  --ecm-rights-radius-sm:12px;
  --ecm-rights-shadow:0 8px 26px rgba(20,41,81,.08);
  --ecm-rights-side-w:280px;
  --ecm-rights-gap:32px;
  --ecm-rights-h1:44px;
  --ecm-rights-h2:22px;
  --ecm-rights-body-line:1.7;
  --ecm-rights-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23704ec5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E");
  --ecm-rights-check-blue:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f5fd6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E");
}
.ecm-rights{color:var(--ecm-ink-2);line-height:var(--ecm-rights-body-line)}
.ecm-rights-ico{width:20px;height:20px;flex:none;display:block}
.ecm-rights :where(a,button,summary):focus-visible{outline:var(--ecm-focus,3px solid #8f6ee0);outline-offset:2px}

/* Đầu trang: ảnh thành phố + lớp phủ navy */
.ecm-rights-hero{position:relative;isolation:isolate;background:var(--ecm-navy-2,#0b1936);color:#fff;overflow:hidden}
.ecm-rights-hero__media{position:absolute;inset:0;z-index:-2}
.ecm-rights-hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block}
.ecm-rights-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,25,54,.92) 0%,rgba(11,25,54,.78) 45%,rgba(11,25,54,.35) 100%)}
.ecm-rights-hero__inner{padding-block:48px 56px}
.ecm-rights-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:18px;font-size:14px;line-height:1.6;color:var(--ecm-rights-on-dark)}
.ecm-rights-crumbs a{color:var(--ecm-rights-on-dark);text-decoration:none}
.ecm-rights-crumbs a:hover{color:#fff;text-decoration:underline}
.ecm-rights-crumbs [aria-current]{color:#fff}
.ecm-rights-hero h1{margin:0;max-width:780px;font-size:var(--ecm-rights-h1);line-height:1.2;font-weight:700;letter-spacing:-.025em;color:#fff;text-wrap:balance}
.ecm-rights-hero p{margin:14px 0 0;max-width:660px;font-size:17px;line-height:1.65;color:var(--ecm-rights-on-dark)}

/* Thân trang */
.ecm-rights-band{background:var(--ecm-bg)}
.ecm-rights-body{display:grid;grid-template-columns:var(--ecm-rights-side-w) minmax(0,1fr);gap:var(--ecm-rights-gap);padding-block:40px 72px}
.ecm-rights-side{position:sticky;top:calc(var(--ecm-header-h,72px) + 20px);align-self:start}
.ecm-rights-side__card{background:var(--ecm-surface,#fff);border:1px solid var(--ecm-line);border-radius:var(--ecm-rights-radius);padding:20px 14px 14px}
.ecm-rights-side h2{margin:0 8px 12px;font-size:17px;line-height:1.4;font-weight:650;color:var(--ecm-ink)}
.ecm-rights-side ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ecm-rights-side a{display:flex;align-items:center;gap:12px;min-height:48px;padding:10px;border-radius:10px;color:var(--ecm-ink-2);text-decoration:none;font-size:14.5px;line-height:1.45}
.ecm-rights-side a:hover{background:var(--ecm-bg);color:var(--ecm-ink)}
.ecm-rights-side a .ecm-rights-ico{width:18px;height:18px;color:var(--ecm-ink-3)}
.ecm-rights-side a.is-current{background:var(--ecm-rights-tint);color:var(--ecm-primary);font-weight:600}
.ecm-rights-side a.is-current .ecm-rights-ico{color:var(--ecm-primary)}
.ecm-rights-chev{margin-left:auto;opacity:0}
.ecm-rights-side a.is-current .ecm-rights-chev{opacity:1}
.ecm-rights-side__mobile{display:none}

.ecm-rights-main{display:grid;gap:22px;min-width:0}
.ecm-rights-sec{background:var(--ecm-surface,#fff);border:1px solid var(--ecm-line);border-radius:var(--ecm-rights-radius);padding:26px 28px;box-shadow:var(--ecm-rights-shadow);scroll-margin-top:calc(var(--ecm-header-h,72px) + 20px)}
.ecm-rights-sec h2{margin:0;font-size:var(--ecm-rights-h2);line-height:1.4;font-weight:650;letter-spacing:-.01em;color:var(--ecm-ink)}
.ecm-rights-sec p{margin:0 0 10px}
.ecm-rights-strong{color:var(--ecm-ink);font-weight:650}
.ecm-rights-sec__head{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.ecm-rights-tile{width:44px;height:44px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--ecm-rights-tint);color:var(--ecm-primary)}
.ecm-rights-tile .ecm-rights-ico{width:22px;height:22px}
.ecm-rights-row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:start}
.ecm-rights-row h2{margin-bottom:6px}

.ecm-rights-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.ecm-rights-card{min-width:0;border:1px solid var(--ecm-line);border-radius:var(--ecm-rights-radius-sm);padding:20px}
.ecm-rights-card h3{display:flex;align-items:center;gap:9px;margin:0 0 6px;font-size:16.5px;line-height:1.4;font-weight:650;color:var(--ecm-primary)}
.ecm-rights-card--blue h3{color:var(--ecm-rights-blue)}
.ecm-rights-card__lead{margin:0 0 14px!important;font-size:14.5px;color:var(--ecm-ink-3)}

.ecm-rights-ticks{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:15px}
.ecm-rights-ticks li{position:relative;padding-left:28px;line-height:1.65}
.ecm-rights-ticks li::before{content:"";position:absolute;left:0;top:.22em;width:18px;height:18px;border-radius:50%;background:var(--ecm-rights-tint) var(--ecm-rights-check) center/12px no-repeat}
.ecm-rights-ticks--blue li::before{background-color:var(--ecm-rights-blue-tint);background-image:var(--ecm-rights-check-blue)}

/* Mục 4 — kiểu P4: sáu thẻ có icon */
.ecm-rights-steps__lead{margin-top:16px!important;margin-bottom:14px!important}
.ecm-rights-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ecm-rights-steps li{min-width:0;display:grid;grid-template-rows:auto 1fr;gap:12px;padding:16px 16px 18px;border:1px solid var(--ecm-line);border-radius:var(--ecm-rights-radius-sm);background:var(--ecm-surface,#fff);transition:border-color .2s ease}
.ecm-rights-steps li:hover{border-color:var(--ecm-rights-tint-2)}
.ecm-rights-steps__top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ecm-rights-steps__icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--ecm-rights-tint);color:var(--ecm-primary)}
.ecm-rights-steps__num{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ecm-ink-3);font-variant-numeric:tabular-nums}
.ecm-rights-steps__text{font-size:15px;line-height:1.6;color:var(--ecm-ink)}

.ecm-rights-contact{margin-top:20px;padding-top:16px;border-top:1px solid var(--ecm-line);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;font-style:normal;font-size:14.5px;line-height:1.6}
.ecm-rights-contact > div{display:flex;gap:10px;min-width:0}
.ecm-rights-contact .ecm-rights-ico{width:18px;height:18px;margin-top:3px;color:var(--ecm-primary)}
.ecm-rights-contact b{display:block;font-size:13px;font-weight:600;color:var(--ecm-ink)}
.ecm-rights-contact a{color:var(--ecm-ink-2);text-decoration:none;overflow-wrap:anywhere}
.ecm-rights-contact a:hover{color:var(--ecm-primary);text-decoration:underline}
.ecm-rights-contact span{overflow-wrap:anywhere}
.ecm-rights-contact__wide{grid-column:1/-1}

.ecm-rights-back{display:inline-flex;align-items:center;gap:6px;min-height:48px;color:var(--ecm-primary);font-size:14.5px;font-weight:550;text-decoration:none}
.ecm-rights-back:hover{text-decoration:underline}

@media (max-width:1100px){:root{--ecm-rights-side-w:240px;--ecm-rights-gap:24px}}
@media (max-width:900px){
  :root{--ecm-rights-h1:32px;--ecm-rights-h2:20px}
  .ecm-rights-hero__inner{padding-block:32px 38px}
  .ecm-rights-hero p{font-size:16px}
  .ecm-rights-body{grid-template-columns:minmax(0,1fr);gap:20px;padding-block:20px 48px}
  .ecm-rights-side{position:static}
  .ecm-rights-side__card{display:none}
  .ecm-rights-side__mobile{display:block;background:var(--ecm-surface,#fff);border:1px solid var(--ecm-line);border-radius:12px}
  .ecm-rights-side__mobile summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:0 16px;font-size:15px;font-weight:600;color:var(--ecm-ink);cursor:pointer}
  .ecm-rights-side__mobile summary::-webkit-details-marker{display:none}
  .ecm-rights-side__mobile summary .ecm-rights-ico{width:18px;height:18px;transition:transform .2s ease}
  .ecm-rights-side__mobile[open] summary .ecm-rights-ico{transform:rotate(180deg)}
  .ecm-rights-side__mobile ul{padding:0 8px 10px}
  .ecm-rights-side__mobile .ecm-rights-chev{display:none}
  .ecm-rights-sec{padding:20px 18px}
  .ecm-rights-pair{grid-template-columns:minmax(0,1fr)}
  .ecm-rights-row{grid-template-columns:minmax(0,1fr)}
  .ecm-rights-row > .ecm-rights-tile{display:none}
  .ecm-rights-steps{grid-template-columns:minmax(0,1fr);gap:10px}
  .ecm-rights-steps li{grid-template-columns:40px minmax(0,1fr);grid-template-rows:none;align-items:center;gap:4px 14px;padding:14px}
  .ecm-rights-steps__top{display:contents}
  .ecm-rights-steps__icon{grid-row:1/3}
  .ecm-rights-steps__num{grid-column:2;grid-row:1}
  .ecm-rights-steps__text{grid-column:2}
  .ecm-rights-contact{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:480px){:root{--ecm-rights-h1:28px}}
@media (prefers-reduced-motion:reduce){.ecm-rights *{transition:none!important}}
