.veneers-lemon {
  --ink: #17273a;
  --muted: #425767;
  --teal: #225d4c;
  --line: #dbe6dc;
  --pale: #f2f6f1;
  --text: Helvetica, Arial, sans-serif;
  --heading: var(--text);
}

.veneers-lemon .granov-header {
  border-bottom: 1px solid var(--line);
  font-family: var(--text);
}

@media (min-width: 1151px) {
  .veneers-lemon .granov-header .granov-header__row {
    width: min(1304px, calc(100% - 88px));
    padding-block: 12px;
    min-height: 88px;
  }

  .veneers-lemon .granov-header .granov-header__logo {
    width: 245px;
  }

  .veneers-lemon .granov-header .granov-header__menu {
    border: 0;
  }

  .veneers-lemon .granov-header .granov-header__phones a {
    border: 1px solid #91bea9;
    border-radius: 99px;
    background: #edf8f1;
    color: #155940;
    font-family: var(--text);
    font-weight: 700;
  }

  .veneers-lemon .granov-header .granov-header__phones a:first-child {
    background: #e1f3e9;
  }

  .veneers-lemon .granov-header .granov-header__phones a:hover {
    background: #d6eddf;
    color: #114c36;
  }
}

@media (max-width: 1150px) {
  .veneers-lemon .granov-header .granov-header__phones a:first-child,
  .veneers-lemon .granov-header .granov-header__phones a:first-child svg {
    background-color: #1b7258;
  }
}

.veneers-lemon .booking-card input[type="tel"] {
  border-color: #81a998;
}

.lemon-shell {
  width: min(1304px, calc(100% - 88px));
  margin-inline: auto;
}

.lemon-crumbs {
  padding-block: 17px;
}

.lemon-crumbs .breadcrumbs {
  margin: 0;
  font-size: 13px;
}

.lemon-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: center;
  min-height: 515px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #f7f8f4;
}

.lemon-visual {
  position: absolute;
  z-index: -1;
  inset: 0;
  margin: 0;
}

.lemon-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 27%;
}

.lemon-visual::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #f8f9f5 0%, #f8f9f5ed 36%, #f8f9f557 52%, transparent 67%);
  content: "";
}

.lemon-hero-copy {
  width: 54%;
  padding: 42px 24px 42px 48px;
}

.lemon-kicker {
  color: var(--teal);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .095em;
  text-transform: uppercase;
}

.lemon-hero h1 {
  margin: 9px 0 17px;
  color: var(--ink);
  font: 700 clamp(46px, 4.65vw, 71px)/1.055 GranovText, var(--text);
  letter-spacing: -.042em;
  word-spacing: .032em;
}

.lemon-hero h1 span {
  display: block;
  color: #345c4c;
}

.lemon-lead {
  max-width: 49ch;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.58;
}

.lemon-location {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 22px;
  font-size: 14px;
  line-height: 1.45;
}

.lemon-location svg {
  flex: none;
  color: var(--teal);
}

.lemon-location small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
}

.lemon-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 19px;
  margin-top: 22px;
}

.lemon-button {
  min-height: 47px;
  gap: 10px;
  padding: 11px 17px;
  border-radius: 32px;
  font-weight: 700;
}

.lemon-button:hover {
  background: #184536;
}

.lemon-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  color: var(--teal);
  font-size: 15px;
  font-weight: 700;
}

.lemon-link:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.lemon-link svg,
.lemon-button svg {
  flex: none;
  width: 17px;
  height: 17px;
}

.lemon-medical {
  max-width: 48ch;
  margin-top: 15px;
  color: var(--muted);
  font-size: 12px;
}

.lemon-consult {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 35px;
  padding: 29px 20px 23px;
  border-bottom: 1px solid var(--line);
}

.lemon-consult h2 {
  max-width: none;
  margin: 5px 0 9px;
  font-size: clamp(28px, 3vw, 43px);
  line-height: 1.08;
}

.lemon-consult > div > p:last-child {
  max-width: 51ch;
  color: var(--muted);
  font-size: 16px;
}

.lemon-steps {
  display: grid;
  align-content: center;
  gap: 13px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lemon-steps li {
  display: flex;
  align-items: flex-start;
  gap: 13px;
}

.lemon-steps li + li {
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.lemon-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: var(--pale);
  color: var(--teal);
}

.lemon-step-number {
  color: var(--teal);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .07em;
}

.lemon-steps h3 {
  margin: 1px 0 4px;
  font-size: 18px;
  letter-spacing: -.015em;
}

.lemon-steps p {
  color: var(--muted);
  font-size: 15px;
}

.lemon-cards {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 14px;
  margin-block: 23px 20px;
}

.lemon-doctor,
.lemon-estimate {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 17px;
}

.lemon-doctor {
  display: grid;
  grid-template-columns: minmax(158px, 28%) minmax(0, 1fr);
  background: #fff;
}

.lemon-doctor img {
  width: 100%;
  height: 100%;
  min-height: 205px;
  object-fit: cover;
  object-position: center 35%;
}

.lemon-card-copy,
.lemon-estimate {
  padding: 19px 23px;
}

.lemon-card-copy {
  align-self: center;
}

.lemon-card-copy h2,
.lemon-estimate h2 {
  max-width: none;
  margin: 5px 0 6px;
  font-size: clamp(21px, 2.15vw, 28px);
  line-height: 1.18;
  letter-spacing: -.025em;
}

.lemon-card-copy > p:not(.lemon-kicker),
.lemon-estimate p {
  max-width: 54ch;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.48;
}

.lemon-estimate {
  background: #eef4ec;
}

.lemon-estimate .lemon-icon {
  margin-bottom: 8px;
  background: #fff;
}

.lemon-gallery {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 4px 15px;
  padding: 18px 23px;
  border: 1px solid var(--line);
  border-radius: 17px;
}

.lemon-gallery h2 {
  font-size: 24px;
}

@media (max-width: 1100px) {
  .lemon-shell {
    width: calc(100% - 48px);
  }

  .lemon-hero-copy {
    padding-left: 30px;
  }

  .lemon-visual img {
    object-position: 62% 27%;
  }
}

@media (max-width: 900px) {
  .lemon-cards {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 780px) {
  .lemon-shell {
    width: calc(100% - 28px);
  }

  .lemon-crumbs {
    padding-block: 12px;
  }

  .lemon-hero {
    min-height: 0;
    border-radius: 18px;
  }

  .lemon-visual {
    position: relative;
    z-index: auto;
    height: clamp(175px, 54vw, 330px);
  }

  .lemon-visual img {
    object-position: right 23%;
    object-fit: cover;
  }

  .lemon-visual::after {
    content: none;
  }

  .lemon-hero-copy {
    width: 100%;
    padding: 18px 17px 20px;
  }

  .lemon-hero h1 {
    margin: 6px 0 11px;
    font-size: clamp(32px, 8.4vw, 54px);
  }

  .lemon-lead {
    font-size: 16px;
  }

  .lemon-location,
  .lemon-actions {
    margin-top: 13px;
  }

  .lemon-medical {
    margin-top: 10px;
  }

  .lemon-consult {
    grid-template-columns: minmax(0, 1fr);
    gap: 15px;
    padding: 22px 3px 17px;
  }

  .lemon-cards {
    margin-block: 15px 11px;
  }

  .lemon-doctor {
    grid-template-columns: 37% minmax(0, 1fr);
  }

  .lemon-card-copy,
  .lemon-estimate {
    padding: 14px 13px;
  }

  .lemon-card-copy > p:not(.lemon-kicker) {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .lemon-visual img {
    width: 144%;
    max-width: none;
    margin-left: -44%;
  }
}

@media (max-width: 365px) {
  .lemon-doctor {
    grid-template-columns: minmax(0, 1fr);
  }

  .lemon-doctor img {
    height: 205px;
  }
}

.veneers-lemon .granov-section-nav {
  font-family: var(--text);
}

.lemon-footer {
  padding-block: 23px 27px;
}

.lemon-footer .lemon-footer-phone {
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
}
