:root{
    --navy-950:#101a33;
    --navy-900:#152246;
    --blue-700:#1f3d8f;
    --blue-600:#2a52c9;
    --ink:#1b2437;
    --muted:#5b6478;
    --bg-top:#eef1fb;
    --bg-bottom:#f7f8fc;
    --card-bg:#ffffff;
    --line:#e6e9f4;
    --radius-lg:18px;
    --radius-md:14px;
    --radius-sm:10px;
    --shadow-card:0 4px 18px rgba(20,30,70,0.06);
    --shadow-icon:0 6px 16px rgba(20,30,70,0.12);
  }

  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;}
  body{
    margin:0;
    font-family:'Manrope', sans-serif;
    color:var(--ink);
    line-height:1.55;
    background:#ffffff;
  }

  .wrap{
    max-width:1920px;
    margin:0 auto;
    padding:36px 60px 80px;
  }

  /* ---------- Header — fixed 1920px ---------- */
  .dc-header{
    max-width:1520px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px;
    padding:50px 0 60px;
  }

  .dc-header-copy{
    flex:1;
    max-width:700px;
  }

  .dc-header-copy h1{
    font-size:52px;
    line-height:1.05;
    margin:0 0 18px;
    color:var(--blue-700);
    font-weight:800;
    letter-spacing:-0.01em;
  }

  .date-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:#eef1fb;
    color:#080808;
    font-size:14px;
    font-weight:700;
    padding:9px 16px;
    border-radius:999px;
    margin-bottom:26px;
  }
  .date-badge i{font-size:18px;}

  .dc-header-copy p{
    font-size:22px;
    margin:0 0 14px;
    color:var(--ink);
    max-width:600px;
  }

  .dc-header-copy a{
    color:var(--blue-600);
    font-weight:700;
    text-decoration:none;
  }
  .dc-header-copy a:hover{text-decoration:underline;}

  .dc-hero{
    flex:none;
    width:420px;
  }
  .dc-hero img{
    width:100%;
    height:auto;
    display:block;
  }

  /* ---------- Content section — fixed 1320px ---------- */
  .dc-content{
    max-width:1320px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:20px;
  }

  /* Generic icon circle, sized precisely */
  .dc-icon-circle{
    width:48px;
    height:48px;
    min-width:48px;
    border-radius:50%;
    background:var(--blue-700);
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:var(--shadow-icon);
  }
  .dc-icon-circle i{
    font-size:19px;
    line-height:1;
  }

  .dc-icon-lg{
    width:64px;
    height:64px;
    min-width:64px;
    background:var(--bg-top);
    color:var(--blue-700);
  }
  .dc-icon-lg i{font-size:24px;}

  /* Single-line info bars */
  .dc-bar{
    display:flex;
    align-items:center;
    gap:22px;
    background:var(--card-bg);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    padding:22px 28px;
    box-shadow:var(--shadow-card);
  }
  .dc-bar p{
    margin:0;
    font-size:22px;
    color:var(--ink);
  }

  /* Liability block */
  .dc-liability{
    background:var(--card-bg);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    padding:30px 30px 34px;
    box-shadow:var(--shadow-card);
  }

  .dc-liability-banner{
    background: #eef1fb;
    color:#000000;
    font-size:22px;
    font-weight:700;
    line-height:1.4;
    text-align:center;
    padding:18px 34px;
    border-radius:999px;
    max-width:900px;
    margin:0 auto 30px;
  }

  .dc-liability-row{
    display:flex;
    align-items:flex-start;
    justify-content:center;
    gap:0;
  }

  .dc-liability-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;
    width:150px;
    text-align:center;
  }
  .dc-liability-item span{
    font-size: 23px;
    font-weight:700;
    color:var(--navy-950);
    line-height:1.35;
  }

  .dc-dots{
    flex:1;
    height:2px;
    margin-top:32px;
    background-image:repeating-linear-gradient(to right, var(--line) 0 6px, transparent 6px 12px);
    min-width:24px;
  }

  /* Important notice */
  .dc-notice{
    display:flex;
    align-items:center;
    gap:26px;
    background:var(--bg-top);
    border-radius:var(--radius-lg);
    padding:26px 34px;
  }
  .dc-notice-copy{flex:1;}
  .dc-notice-copy h3{
    margin:0 0 8px;
    font-size:27px;
    color:var(--blue-700);
    font-weight:800;
  }
  .dc-notice-copy p{
    margin:0;
    font-size:22px;
    color:var(--muted);
  }
  .dc-notice-img{
    flex:none;
    width:110px;
  }
  .dc-notice-img img{
    width:100%;
    height:auto;
    display:block;
  }
  .dc-notice-scale{width:110px;}

  /* ============ RESPONSIVE BREAKPOINTS ============ */

  /* Mobile Small: 320px – 480px */
  @media (max-width:480px){
    .wrap{padding:20px 16px 44px;}

    .dc-header{
      flex-direction:column-reverse;
      gap:24px;
      padding:26px 0 34px;
      text-align:left;
    }
    .dc-header-copy{max-width:100%;}
    .dc-header-copy h1{font-size:26px;}
    .dc-header-copy p{font-size:15px;}
    .date-badge{font-size:12px; padding:7px 12px; margin-bottom:16px;}
    .date-badge i{font-size:13px;}
    .dc-hero{width:100%; max-width:220px;}

    .dc-content{gap:14px;}
    .dc-bar{
      flex-direction:column;
      align-items:flex-start;
      gap:12px;
      padding:18px;
    }
    .dc-bar p{font-size:14.5px;}

    .dc-liability{padding:20px 18px 24px;}
    .dc-liability-banner{font-size:14px; padding:14px 18px; border-radius:16px;}

    .dc-liability-row{
      flex-direction:column;
      align-items:center;
      gap:20px;
    }
    .dc-liability-item{width:100%;}
    .dc-liability-item span{font-size:14px;}
    .dc-icon-lg{width:52px; height:52px; min-width:52px;}
    .dc-icon-lg i{font-size:20px;}
    .dc-dots{display:none;}

    .dc-notice{
      flex-direction:column;
      text-align:center;
      padding:22px 20px;
      gap:16px;
    }
    .dc-notice-img{width:64px;}
    .dc-notice-scale{width:64px;}
    .dc-notice-copy h3{font-size:18px;}
    .dc-notice-copy p{font-size:14px;}
  }

  /* Mobile Large: 481px – 767px */
  @media (min-width:481px) and (max-width:767px){
    .wrap{padding:26px 20px 50px;}

    .dc-header{
      flex-direction:column-reverse;
      gap:28px;
      padding:32px 0 40px;
      text-align:left;
    }
    .dc-header-copy{max-width:100%;}
    .dc-header-copy h1{font-size:32px;}
    .dc-header-copy p{font-size:16px;}
    .date-badge{font-size:13px;}
    .date-badge i{font-size:14px;}
    .dc-hero{width:100%; max-width:280px;}

    .dc-bar{padding:20px 22px;}
    .dc-bar p{font-size:16px;}

    .dc-liability-banner{font-size:16px; max-width:100%;}
    .dc-liability-row{
      flex-wrap:wrap;
      justify-content:center;
      row-gap:22px;
    }
    .dc-liability-item{width:33%;}
    .dc-liability-item span{font-size:15px;}
    .dc-dots{display:none;}

    .dc-notice{
      flex-direction:column;
      text-align:center;
      gap:18px;
    }
    .dc-notice-img{width:80px;}
    .dc-notice-scale{width:80px;}
    .dc-notice-copy h3{font-size:20px;}
    .dc-notice-copy p{font-size:15px;}
  }

  /* Tablet: 768px – 991px */
  @media (min-width:768px) and (max-width:991px){
    .dc-header{max-width:100%; gap:40px; padding:40px 0 46px;}
    .dc-header-copy{max-width:420px;}
    .dc-header-copy h1{font-size:38px;}
    .dc-header-copy p{font-size:18px;}
    .date-badge{font-size:13.5px;}
    .date-badge i{font-size:16px;}
    .dc-hero{width:300px;}

    .dc-content{max-width:100%; padding:0 4px;}
    .dc-bar p{font-size:17px;}

    .dc-liability-banner{font-size:18px; max-width:700px;}
    .dc-liability-row{flex-wrap:wrap; row-gap:24px;}
    .dc-liability-item{width:31%;}
    .dc-liability-item span{font-size:16px;}
    .dc-dots{display:none;}

    .dc-notice{gap:20px;}
    .dc-notice-img{width:90px;}
    .dc-notice-scale{width:90px;}
    .dc-notice-copy h3{font-size:22px;}
    .dc-notice-copy p{font-size:16px;}
  }

  /* Small Laptop: 992px – 1199px */
  @media (min-width:992px) and (max-width:1199px){
    .dc-header{max-width:100%; gap:50px;}
    .dc-header-copy{max-width:520px;}
    .dc-header-copy h1{font-size:44px;}
    .dc-header-copy p{font-size:19px;}
    .date-badge{font-size:14px;}
    .date-badge i{font-size:17px;}
    .dc-hero{width:360px;}

    .dc-content{max-width:100%; padding:0 8px;}
    .dc-bar p{font-size:18px;}

    .dc-liability-banner{font-size:19px; max-width:800px;}
    .dc-liability-item{width:140px;}
    .dc-liability-item span{font-size:18px;}

    .dc-notice-copy h3{font-size:23px;}
    .dc-notice-copy p{font-size:18px;}
  }

  /* Desktop: 1200px – 1439px (base rules already cover this range) */
  @media (min-width:1200px) and (max-width:1439px){
    .dc-header{max-width:1320px;}
    .dc-header-copy h1{font-size:48px;}
    .dc-header-copy p{font-size:20px;}
    .dc-bar p{font-size:20px;}
    .dc-liability-banner{font-size:20px;}
    .dc-liability-item span{font-size:20px;}
    .dc-notice-copy h3{font-size:25px;}
    .dc-notice-copy p{font-size:20px;}
  }

  /* Large Desktop: 1440px and above */
  @media (min-width:1440px){
    .wrap{padding-top:44px;}
    .dc-header{max-width:1520px;}
    .dc-content{max-width:1320px;}
    .dc-header-copy h1{font-size:56px;}
    .dc-hero{width:440px;}
  }