:root {
      --bg: #fff7f0;
      --accent: #ff8da1;
      --muted: #6b6b6b;
      --card: #ffffff;
      --radius: 14px;
      --container: 1100px
    }

    * {
      box-sizing: border-box
    }

    body {
      font-family: Inter, system-ui, -apple-system, 'Helvetica Neue', Arial;
      margin: 0;
      background: linear-gradient(180deg, #fff 0%, #fff7f0 100%);
      color: #222
    }

    .wrap {
      max-width: var(--container);
      margin: 0 auto;
      padding: 28px
    }

    header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 0
    }

    .brand {
      display: flex;
      gap: 12px;
      align-items: center
    }

    .logo {
      width: 64px;
      height: 64px;
      border-radius: 12px;
      background: linear-gradient(135deg, var(--accent), #ffd3b6);
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 700;
      color: #fff
    }

    h1 {
      font-size: 30px;
      margin: 6px 0
    }

    p.lead {
      color: var(--muted);
      margin: 6px 0 0
    }

    .hero {
      display: grid;
      grid-template-columns: 1fr 360px;
      gap: 24px;
      align-items: center;
      margin: 18px 0;
      padding: 24px;
      background: var(--card);
      border-radius: 18px;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05)
    }

    .hero .box {
      padding: 6px 6px
    }

    .badge {
      display: inline-block;
      padding: 8px 12px;
      border-radius: 999px;
      background: #fff;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
      font-weight: 600
    }

    .price {
      font-size: 28px;
      font-weight: 700;
      color: #000;
    }

    .cta {
      display: flex;
      flex-direction: column;
      gap: 12px
    }

    .btn {
      display: inline-block;
      padding: 12px 16px;
      border-radius: 12px;
      text-decoration: none;
      font-weight: 700;
      text-align: center
    }

    .btn-primary {
      background: #9DF069;
      color: #000;
    }

    .btn-outline {
      border: 2px solid #9DF069;
      color: #000;
      background: transparent
    }

    .features {
      display: flex;
      gap: 12px;
      margin-top: 12px
    }

    .feature {
      background: #fff;
      padding: 10px;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
      flex: 1;
      text-align: center
    }

    .sections {
      display: grid;
      grid-template-columns: 1fr 270px;
      gap: 24px;
      margin-top: 18px
    }

    .card {
      background: var(--card);
      padding: 18px;
      border-radius: 14px;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.03)
    }

	.sections__card {
      background: var(--card);
      padding: 18px;
      border-radius: 14px;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.03)
    }

    .gallery {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 8px
    }

    .gallery img {
      width: 100%;
      height: 217px;
      object-fit: cover;
      border-radius: 10px;
      border: 1px solid gray;
    }

    ul.checks {
      padding-left: 18px;
      color: var(--muted)
    }

    .faq dt {
      font-weight: 700;
      margin-top: 12px
    }

    .faq dd {
      margin: 6px 0 12px;
      color: var(--muted)
    }

    /* Стили для honeypot — вставь в head или отдельный CSS */
    .hp-field {
      position: absolute !important;
      left: -10000px !important;
      top: auto !important;
      width: 1px !important;
      height: 1px !important;
      overflow: hidden !important;
    }

    footer {
      margin-top: 28px;
      padding: 18px 0;
      color: var(--muted);
      font-size: 14px
    }

    /* responsive */
    @media(max-width:900px) {

      .hero,
      .sections {
        grid-template-columns: 1fr
      }

      .hero {
        padding: 16px
      }

      .gallery img {
        height: 120px
      }

      .wrap {
        padding: 18px
      }
    }
    
    @media(max-width:479px) {
      .section-main__h1arenda {
      	line-height: 33px;
      }
		
      header {
      	display: block;
      }
      
      header div{
		max-width:410px;
      }
      
      .header__top {
		margin-bottom: 15px;
      }
      
      .header__shedule {
		text-align:right;
      }
      
      .shedule__time {
      	margin-bottom:5px;
      }

      .hero,
      .sections {
        grid-template-columns: 1fr
      }

      .hero {
        padding: 16px
      }
      
      .hero__card {
      	justify-self: center;
	  }
      
      .aside__card {
		max-width: 415px;
	  }

      .gallery img {
        height: 120px
      }

      .wrap {
        padding: 18px
      }
    }