:root { --orange: #ff5d0a; --deep-orange: #c94b1c; --cream: #fbf5f0; }
    * { box-sizing: border-box; }
    body { margin: 0; background: #fff; font-family: Arial, Helvetica, sans-serif; color: #fff; }
    .page { width: 1000px; max-width: 100%; margin: 0 auto; overflow: hidden; background: #fff; }
    .certifications { height: 202px; display: grid; place-items: center; background: #fff; }
    .certifications img { width: 737px; max-width: 80%; height: auto; }
    .benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; padding: 0 43px 30px; }
    .benefit { min-height: 309px; padding: 27px 16px 25px; border-radius: 31px; background: linear-gradient(165deg, #ffd34c, #ff6638 85%); box-shadow: 0 12px 22px #f6cf7a99; }
    .benefit h2 { margin: 0 0 23px; font-size: 36px; line-height: 1.05; letter-spacing: 1.5px; font-weight: 800; }
    .benefit p { border-top: 1px solid #ffd883; margin: 0; padding-top: 11px; font-size: 20px; line-height: 1.12; letter-spacing: 1px; }
    .comparison { position: relative; min-height: 1269px; padding: 145px 24px 62px; background: radial-gradient(ellipse at 53% 96%, #ffe1a4 0, #fbf5f0 32%, var(--cream) 63%); }
    .comparison h1 { margin: 0; color: var(--orange); text-align: center; font-size: 56px; font-weight: 400; letter-spacing: -1.4px; }
    .chevron { width: 21px; height: 21px; margin: 30px auto 58px; border-right: 7px solid var(--orange); border-bottom: 7px solid var(--orange); transform: rotate(45deg); border-radius: 2px; }
    .cards { position: relative; display: grid; grid-template-columns: 538px 408px; align-items: end; gap: 0; }
    .ours { position: relative; z-index: 2; padding: 28px 22px 31px; border-radius: 31px; background: #ff812e; box-shadow: 12px 12px 16px #86654066; }
    .hero { position: relative; height: 302px; overflow: hidden; border-radius: 30px; background: #fff; }
    .hero img { display: block; width: 100%; height: 100%; object-fit: cover; }
    .hero-label { position: absolute; right: 0; bottom: 0; padding: 12px 18px; border-radius: 27px 0 0 0; background: var(--orange); font-size: 29px; font-weight: 800; }
    .feature-list { margin-top: 20px; display: grid; gap: 10px; }
    .feature { min-height: 121px; display: grid; grid-template-columns: 125px 1fr; align-items: center; overflow: hidden; border-radius: 5px; background: linear-gradient(115deg, #fff7ed, #fde1cf); color: #c4532b; font-size: 25px; line-height: 1.25; }
    .feature img { width: 124px; height: 119px; object-fit: cover; }
    .feature span { padding: 12px 14px; }
    .check { color: #18bd28; font-size: 40px; vertical-align: middle; margin-right: 10px; }
    .others { position: relative; z-index: 1; margin-left: -1px; padding: 35px 32px 42px; border-radius: 0 30px 30px 0; background: #dedede; box-shadow: 8px 10px 15px #7b74696e; }
    .other-photo { position: relative; height: 224px; overflow: hidden; border-radius: 11px; background: #fff; }
    .other-photo img { width: 100%; height: 100%; object-fit: cover; }
    .other-label { position: absolute; right: 0; bottom: 0; width: 275px; padding: 10px 0; text-align: center; border-radius: 30px 0 0 0; background: #ddd; color: white; font-size: 28px; font-weight: 700; }
    .other-list { display: grid; gap: 14px; margin-top: 31px; }
    .other-list div { min-height: 98px; display: grid; place-items: center; background: #c9c8c7; color: #6d6d6d; font-size: 26px; text-align: center; }
    .vs { position: absolute; z-index: 3; left: 513px; top: 507px; display: grid; place-items: center; width: 102px; height: 102px; border-radius: 50%; background: linear-gradient(#ff7e2d, #fb3800); color: #fff; font-size: 51px; font-weight: 900; font-style: italic; transform: rotate(-10deg); }
    @media (max-width: 700px) {
      .certifications { height: 20.2vw; }
      .benefits { gap: 1.1vw; padding: 0 4.3vw 3vw; }
      .benefit { min-height: 30.9vw; padding: 2.7vw 1.6vw 2.5vw; border-radius: 3.1vw; box-shadow: 0 1.2vw 2.2vw #f6cf7a99; }
      .benefit h2 { margin-bottom: 2.3vw; font-size: 3.6vw; letter-spacing: .15vw; }
      .benefit p { padding-top: 1.1vw; font-size: 2vw; letter-spacing: .1vw; }
      .comparison { min-height: 126.9vw; padding: 14.5vw 2.4vw 6.2vw; }
      .comparison h1 { font-size: 5.6vw; }
      .chevron { width: 2.1vw; height: 2.1vw; margin: 3vw auto 5.8vw; border-width: .7vw; }
      .cards { grid-template-columns: 53.8vw 40.8vw; }
      .ours { padding: 2.8vw 2.2vw 3.1vw; border-radius: 3.1vw; }
      .hero { height: 30.2vw; border-radius: 3vw; }
      .hero-label { padding: 1.2vw 1.8vw; font-size: 2.9vw; }
      .feature-list { margin-top: 2vw; gap: 1vw; }
      .feature { min-height: 12.1vw; grid-template-columns: 12.5vw 1fr; font-size: 2.5vw; }
      .feature img { width: 12.4vw; height: 11.9vw; }.feature span { padding: 1.2vw 1.4vw; }.check { font-size: 4vw; margin-right: 1vw; }
      .others { padding: 3.5vw 3.2vw 4.2vw; border-radius: 0 3vw 3vw 0; }.other-photo { height: 22.4vw; border-radius: 1.1vw; }.other-label { width: 27.5vw; padding: 1vw 0; font-size: 2.8vw; }.other-list { gap: 1.4vw; margin-top: 3.1vw; }.other-list div { min-height: 9.8vw; font-size: 2.6vw; }.vs { left: 51.3vw; top: 50.7vw; width: 10.2vw; height: 10.2vw; font-size: 5.1vw; }
    }