/* The interior compositions follow the supplied 1482 × 1061 artboards.
   Artwork is ornamental; all content and controls remain live HTML. */
.team { --interior-art: url('assets/team-plate.png'); }
.about { --interior-art: url('assets/about-plate.png'); }
.contact { --interior-art: url('assets/contact-plate.png'); }
.faqs { --interior-art: url('assets/faqs-plate.png'); }
.locations { --interior-art: url('assets/locations-plate.png'); }

.role { display: flex; border-bottom: 1px solid #98a97b; }
.role:last-child { border-bottom: 0; }
.role-number { display: grid; place-items: center; flex-shrink: 0; border-radius: 50%; background: #fffadc; }
.role > div, .field-row > div, .location > div { min-width: 0; }
.apply { display: flex; align-items: center; }
.cream { background: #fcf6e7; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; }
.contact-form label { display: block; }
.contact-form input, .contact-form textarea {
  display: block;
  width: 100%;
  min-width: 0;
  color: inherit;
  border: 1px solid #d5d6c1;
  background: transparent;
}
.contact-form input::placeholder { color: #999b8d; opacity: 1; }
.contact-form textarea { resize: vertical; }
.contact-form .button span { display: none; }
.email-label a { font-weight: 700; overflow-wrap: anywhere; }
.form-note, .form-status { color: #626b50; }
.form-status:empty { display: none; }
.faq-list details { background: #f8f4e3; }
.faq-list summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  cursor: pointer;
}
.faq-list summary::-webkit-details-marker { display: none; }
.plus { display: block; position: relative; flex-shrink: 0; }
.plus::before, .plus::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
  background: currentColor;
}
.plus::after { transform: rotate(90deg); transition: transform 160ms ease; }
details[open] .plus::after { transform: rotate(0); }
.location { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #b6bba6; }
.location:last-child { border-bottom: 0; }
.location address { font-style: normal; }
.location .button { flex-shrink: 0; }
.hours { color: #626b50; }
.desktop-order-notice { display: none; }
.order-notice {
  padding: 18px 0;
  border-bottom: 1px solid #b6bba6;
  font-size: clamp(14px, 1.1vw, 17px);
  line-height: 1.5;
}

@media (min-width: 1000px) {
  .locations .intro .desktop-order-notice {
    display: block;
    margin-top: 24px;
    padding: 18px 22px;
    border: 0;
    border-radius: 14px;
    background: #fcf6e7;
    font-size: clamp(16px, 1.3vw, 22px);
    line-height: 1.5;
  }
  .location-list > .order-notice { display: none; }
  body:not(.home) {
    --u: calc(100vw / 1482);
    position: relative;
    --art-offset: max(0px, calc(var(--header-height) - 73 * var(--u)));
    --art-height: max(calc(1061 * var(--u)), calc(100dvh - var(--art-offset)));
    min-height: calc(var(--art-height) + var(--art-offset));
    background: #e6efc9;
  }
  body:not(.home) .header { position: absolute; left: 4.2%; width: 91.6%; margin: 0; }
  body:not(.home) main { position: relative; min-height: calc(var(--art-height) + var(--art-offset)); padding-top: var(--art-offset); }
  /* These reading surfaces can grow beyond the original artwork when used. */
  body:not(.home) { isolation: isolate; }
  body:not(.home)::before {
    content: '';
    position: absolute;
    inset: var(--art-offset) 0 0;
    z-index: -1;
    background: var(--interior-art) center top / cover no-repeat;
  }
  body.faqs::before { position: fixed; bottom: auto; height: var(--art-height); }
  body:not(.home) h1, body:not(.home) h2 { text-wrap: initial; }
  .team-layout, .split-layout, .about-story { position: relative; }
  .scene, .leaves > img { display: none; }
  :where(body:not(.home)) .button {
    min-height: calc(52 * var(--u));
    padding: calc(14 * var(--u)) calc(30 * var(--u));
    gap: calc(25 * var(--u));
    border-radius: calc(40 * var(--u));
    font-size: calc(18 * var(--u));
    line-height: 1.25;
  }
  :where(body:not(.home)) .button span { font-size: calc(21 * var(--u)); }

  .team-layout { min-height: var(--art-height); padding: calc(140 * var(--u)) 0 calc(100 * var(--u)) calc(64 * var(--u)); }
  .team-copy { position: relative; z-index: 1; width: calc(590 * var(--u)); }
  .team-copy h1 { font-size: calc(89 * var(--u)); line-height: .995; letter-spacing: -.04em; white-space: nowrap; }
  .team-copy > .lead {
    width: calc(610 * var(--u));
    margin-top: calc(11 * var(--u));
    font-size: calc(24 * var(--u));
    line-height: 1.3;
    letter-spacing: -.025em;
  }
  .roles { margin-top: calc(12 * var(--u)); }
  .role { min-height: calc(134 * var(--u)); gap: calc(34 * var(--u)); align-items: center; }
  .role-number { width: calc(90 * var(--u)); height: calc(90 * var(--u)); }
  .role-number svg { width: calc(48 * var(--u)); height: calc(48 * var(--u)); }
  .role h2 { font-size: calc(28 * var(--u)); line-height: 1.15; letter-spacing: -.035em; }
  .role p { margin-top: calc(5 * var(--u)); font-size: calc(18 * var(--u)); line-height: 1.3; }
  .care { margin-top: calc(28 * var(--u)); }
  .care h2 { font-size: calc(36 * var(--u)); line-height: 1.15; letter-spacing: -.035em; }
  .care p { max-width: calc(500 * var(--u)); margin-top: calc(5 * var(--u)); font-size: calc(18 * var(--u)); line-height: 1.35; }
  .apply { margin-top: calc(20 * var(--u)); gap: calc(27 * var(--u)); font-size: calc(18 * var(--u)); }
  .apply .button { width: calc(213 * var(--u)); padding-inline: calc(20 * var(--u)); gap: calc(17 * var(--u)); }

  .about-story { min-height: calc(var(--art-height) * 623 / 1061); padding: calc(135 * var(--u)) 0 calc(60 * var(--u)) calc(63 * var(--u)); }
  .story-copy { width: calc(590 * var(--u)); }
  .story-copy h1 { font-size: calc(46 * var(--u)); line-height: 1.15; letter-spacing: -.04em; white-space: nowrap; }
  .story-copy p { margin-top: calc(23 * var(--u)); font-size: calc(18 * var(--u)); line-height: 1.34; }
  .leaves { min-height: calc(var(--art-height) * 438 / 1061); padding: calc(80 * var(--u)) 0 calc(70 * var(--u)) calc(879 * var(--u)); }
  .leaves > div { width: calc(550 * var(--u)); }
  .leaves h2 { font-size: calc(46 * var(--u)); line-height: 1.15; letter-spacing: -.04em; }
  .leaves p { margin-top: calc(27 * var(--u)); font-size: calc(18 * var(--u)); line-height: 1.3; }
  .leaves .lead { margin-top: calc(16 * var(--u)); font-size: calc(23 * var(--u)); line-height: 1.35; }

  .contact .split-layout { min-height: var(--art-height); padding: calc(129 * var(--u)) 0 calc(100 * var(--u)); }
  .contact .intro { position: absolute; left: calc(100 * var(--u)); top: calc(130 * var(--u)); width: calc(490 * var(--u)); }
  .contact h1 { margin-left: calc(-6 * var(--u)); font-size: calc(90 * var(--u)); line-height: .85; letter-spacing: -.035em; }
  .contact .intro > .lead { margin-top: calc(16 * var(--u)); font-size: calc(22 * var(--u)); line-height: 1.35; letter-spacing: -.016em; }
  .email-label { margin-top: calc(20 * var(--u)); font-size: calc(26 * var(--u)); line-height: 1.35; }
  .email-label a { font-size: calc(28 * var(--u)); }
  .cream { border-radius: calc(24 * var(--u)); }
  .contact-form {
    position: relative;
    z-index: 1;
    width: calc(729 * var(--u));
    min-height: calc(694 * var(--u));
    margin-left: calc(685 * var(--u));
    padding: calc(60 * var(--u)) calc(49 * var(--u)) calc(20 * var(--u));
  }
  .field-row { grid-template-columns: .985fr 1.015fr; gap: calc(24 * var(--u)); }
  .contact-form label { margin-bottom: calc(9 * var(--u)); font-size: calc(19 * var(--u)); line-height: 1.2; }
  .contact-form input, .contact-form textarea { padding: calc(18 * var(--u)) calc(22 * var(--u)); border-radius: calc(8 * var(--u)); font-size: calc(18 * var(--u)); }
  .contact-form input { height: calc(62 * var(--u)); }
  .contact-form > label { margin-top: calc(34 * var(--u)); }
  .contact-form > label[for='message'] { margin-bottom: calc(12 * var(--u)); }
  .contact-form textarea { height: calc(211 * var(--u)); min-height: calc(211 * var(--u)); }
  .contact-form .button { width: calc(204 * var(--u)); margin-top: calc(34 * var(--u)); min-height: calc(54 * var(--u)); padding-inline: calc(24 * var(--u)); font-size: calc(20 * var(--u)); }
  .form-note { margin-top: calc(12 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.4; }
  .form-status { margin-top: calc(12 * var(--u)); font-size: calc(15 * var(--u)); line-height: 1.4; }

  .faq-layout { min-height: var(--art-height); padding: calc(133 * var(--u)) 0 calc(120 * var(--u)); }
  .faq-layout .intro { position: absolute; left: calc(64 * var(--u)); top: calc(125 * var(--u)); width: calc(480 * var(--u)); }
  .faq-layout h1 { font-size: calc(60 * var(--u)); line-height: 1.03; letter-spacing: -.04em; }
  .faq-layout .lead { max-width: calc(440 * var(--u)); margin-top: calc(24 * var(--u)); font-size: calc(23 * var(--u)); line-height: 1.3; }
  .faq-list { position: relative; z-index: 1; width: calc(858 * var(--u)); margin-left: calc(563 * var(--u)); }
  .faq-list details { margin-bottom: calc(2 * var(--u)); padding: 0 calc(31 * var(--u)); border-radius: calc(11 * var(--u)); }
  .faq-list summary { min-height: calc(69 * var(--u)); padding: calc(17 * var(--u)) 0; gap: calc(24 * var(--u)); font-size: calc(21 * var(--u)); line-height: 1.25; letter-spacing: -.035em; }
  .faq-list details:nth-child(7) summary { font-size: calc(20 * var(--u)); }
  .plus { width: calc(18 * var(--u)); height: calc(18 * var(--u)); }
  .answer { padding: 0 0 calc(26 * var(--u)); }
  .answer p { margin-top: calc(4 * var(--u)); font-size: calc(18 * var(--u)); line-height: 1.4; }
  .answer p + p { margin-top: calc(15 * var(--u)); }

  .locations-layout { min-height: var(--art-height); padding: calc(114 * var(--u)) 0 calc(100 * var(--u)); }
  .locations .intro { position: absolute; left: calc(75 * var(--u)); top: calc(134 * var(--u)); width: calc(635 * var(--u)); text-align: center; }
  .locations h1 { font-size: calc(87 * var(--u)); line-height: 1.06; letter-spacing: -.055em; white-space: nowrap; }
  .locations .lead { margin-top: calc(14 * var(--u)); font-size: calc(25 * var(--u)); line-height: 1.3; }
  .location-list { position: relative; z-index: 1; width: calc(666 * var(--u)); min-height: calc(786 * var(--u)); margin-left: calc(769 * var(--u)); padding: calc(16 * var(--u)) calc(29 * var(--u)); }
  .location { min-height: calc(185 * var(--u)); gap: calc(18 * var(--u)); padding: calc(20 * var(--u)) calc(13 * var(--u)); }
  .location h2 { font-size: calc(32 * var(--u)); line-height: 1.1; letter-spacing: -.035em; }
  .location address { margin-top: calc(8 * var(--u)); font-size: calc(21 * var(--u)); line-height: 1.3; }
  .hours { margin-top: calc(12 * var(--u)); font-size: calc(19 * var(--u)); line-height: 1.3; }
  .location .button { width: calc(186 * var(--u)); min-height: calc(58 * var(--u)); padding: calc(14 * var(--u)) calc(22 * var(--u)); gap: calc(18 * var(--u)); font-size: calc(21 * var(--u)); }
}

/* The reference foreground aligns only when the full artboard fits by width. */
@media (min-width: 1000px) and (max-aspect-ratio: 1.396) {
  .contact::after { display: none; }
}

/* Tablet: retain each render's column order and put the artwork beside the copy. */
@media (min-width: 600px) and (max-width: 999px) {
  body:not(.home) { position: relative; background: #e7f1cd; }
  body:not(.home) main { position: relative; min-height: calc(100dvh - var(--header-height)); }
  body:not(.home) h1 { font-size: clamp(30px, 4.8vw, 48px); line-height: 1.05; letter-spacing: -.04em; }
  body:not(.home) .lead { margin-top: 14px; font-size: 15px; line-height: 1.4; }
  body:not(.home) .button { min-height: 44px; padding: 11px 20px; gap: 10px; font-size: 14px; }
  body:not(.home) .header { margin-inline: 4.2%; }
  .team-layout, .about-story, .split-layout, .leaves { position: relative; }
  .team-layout { min-height: calc(100dvh - var(--header-height)); padding: 36px 0 48px 4.2%; }
  .team-copy { position: relative; z-index: 1; width: 44%; }
  .team-copy > .lead { font-size: 14px; }
  .roles { margin-top: 20px; }
  .role { gap: 13px; align-items: center; padding: 19px 0; }
  .role-number { width: 42px; height: 42px; }
  .role-number svg { width: 27px; height: 27px; }
  .role h2 { font-size: 21px; line-height: 1.15; }
  .role p { margin-top: 7px; font-size: 13px; line-height: 1.4; }
  .care { margin-top: 28px; }
  .care h2 { font-size: 27px; }
  .care p { margin-top: 10px; font-size: 14px; line-height: 1.4; }
  .apply { margin-top: 20px; flex-wrap: wrap; gap: 13px; font-size: 13px; }
  .team-layout > .scene {
    display: block; position: absolute; inset: 0 0 0 auto; width: 53%;
    background: var(--interior-art) 76% bottom / auto 100% no-repeat;
    mask-image: linear-gradient(to right, transparent, #000 12%);
  }
  .team-layout > .scene::after {
    content: ''; position: absolute; inset: 0;
    background: url('assets/team-reference-v4.png') 76% bottom / auto 100% no-repeat;
    clip-path: inset(7.2% 0 0 50%);
  }
  .about-story { display: grid; grid-template-columns: 48% 52%; padding: 36px 0 35px 4.2%; }
  .story-copy { position: relative; z-index: 1; padding-right: 18px; }
  .story-copy h1 { font-size: clamp(28px, 4vw, 40px); }
  .story-copy p { margin-top: 20px; font-size: 14px; line-height: 1.45; }
  .about-story > .scene {
    display: block; position: absolute; inset: 0 0 0 auto; width: 52%;
    background: var(--interior-art) 80% top / auto 170.3% no-repeat;
    mask-image: linear-gradient(to right, transparent, #000 14%);
  }
  .leaves { min-height: 420px; padding: 36px 4.2% 46px 54%; }
  .leaves::before {
    content: ''; position: absolute; inset: 0 auto 0 0; width: 55%;
    background: var(--interior-art) 15% bottom / auto 242.2% no-repeat;
    mask-image: linear-gradient(to right, #000 78%, transparent);
  }
  .leaves > div { position: relative; }
  .leaves h2 { font-size: clamp(28px, 4vw, 40px); }
  .leaves p { margin-top: 20px; font-size: 14px; line-height: 1.45; }
  .leaves .lead { font-size: 17px; }
  .split-layout { display: grid; align-items: start; grid-template-columns: 40% minmax(0, 60%); min-height: calc(100dvh - var(--header-height)); padding: 36px 4.2% 80px; gap: 0; }
  .split-layout > .intro { position: relative; align-self: stretch; padding-right: 22px; }
  .contact .intro .lead { font-size: 14px; }
  .email-label { margin-top: 22px; font-size: 17px; line-height: 1.5; }
  .email-label a { font-size: 16px; }
  .contact-form { position: relative; z-index: 1; padding: 25px 22px; border-radius: 17px; }
  .field-row { grid-template-columns: 1fr 1fr; gap: 12px; }
  .contact-form label { margin-bottom: 8px; font-size: 14px; }
  .contact-form input, .contact-form textarea { min-height: 44px; padding: 12px; font-size: 16px; }
  .contact-form > label { margin-top: 22px; }
  .contact-form textarea { min-height: 220px; }
  .contact-form .button { margin-top: 24px; }
  .contact .split-layout::before, .faqs .split-layout::before, .locations .split-layout::before {
    content: ''; position: absolute; inset: 0 0 0 0; pointer-events: none;
    background: var(--interior-art) 15% bottom / auto 120% no-repeat;
    clip-path: inset(0 0 0 0);
  }
  .contact .intro, .faqs .intro, .locations .intro { z-index: 1; }
  .faq-layout { grid-template-columns: 35% minmax(0, 65%); }
  .faq-layout h1 { font-size: clamp(29px, 4vw, 40px); }
  .faq-layout .intro .lead { font-size: 14px; }
  .faq-list { position: relative; z-index: 1; }
  .faq-list details { margin-bottom: 3px; padding: 0 18px; border-radius: 9px; }
  .faq-list summary { min-height: 66px; padding: 18px 0; font-size: 15px; line-height: 1.35; gap: 14px; }
  .plus { width: 15px; height: 15px; }
  .answer { padding-bottom: 19px; }
  .answer p { font-size: 14px; line-height: 1.4; }
  .answer p + p { margin-top: 12px; }
  .locations-layout { grid-template-columns: 43% minmax(0, 57%); padding-bottom: 80px; }
  .locations .intro h1 { font-size: clamp(32px, 4.9vw, 48px); }
  .location-list { position: relative; z-index: 1; padding: 0 22px; border-radius: 17px; }
  .location { flex-direction: column; align-items: flex-start; gap: 15px; padding: 22px 0; }
  .location h2 { font-size: 24px; }
  .location address { margin-top: 8px; font-size: 15px; line-height: 1.4; }
  .hours { margin-top: 10px; font-size: 14px; }
}

/* Narrow screens use a reading flow, with the garden alongside the content
   as dedicated image regions rather than foliage behind text. */
@media (max-width: 599px) {
  body:not(.home) { background-color: #e6efc9; background-image: none; }
  body:not(.home) main { min-width: 0; min-height: calc(100dvh - var(--header-height)); display: flex; flex-direction: column; }
  .team-layout, .split-layout, .about-story { padding: 34px 6% 0; }
  .team-layout, .split-layout { display: flex; flex-direction: column; flex: 1; }
  .team-copy, .story-copy, .intro, .contact-form, .faq-list, .location-list, .leaves > div { width: 100%; max-width: 680px; margin-inline: auto; }
  body:not(.home) h1 { font-size: clamp(39px, 8.7vw, 64px); line-height: 1.06; letter-spacing: -.045em; }
  body:not(.home) h2 { letter-spacing: -.035em; }
  .lead { margin-top: 18px; font-size: 18px; line-height: 1.5; }
  .team-copy h1 { white-space: normal; }
  .roles { margin-top: 26px; }
  .role { align-items: center; gap: 18px; padding: 22px 0; }
  .role-number { width: 64px; height: 64px; }
  .role-number svg { width: 36px; height: 36px; }
  .role h2 { font-size: 25px; line-height: 1.15; }
  .role p { margin-top: 7px; font-size: 16px; line-height: 1.5; }
  .care { margin-top: 28px; }
  .care h2 { font-size: 32px; line-height: 1.15; }
  .care p { margin-top: 12px; font-size: 16px; line-height: 1.5; }
  .apply { flex-wrap: wrap; gap: 18px 22px; margin-top: 23px; font-size: 16px; }
  .apply > a { max-width: 100%; overflow-wrap: anywhere; }
  .scene img, .leaves > img { display: none; }
  .team-layout > .scene, .about-story > .scene {
    display: block;
    height: min(89vw, 470px);
    min-height: min(89vw, 470px);
    flex: 1;
    margin: 30px -6.82% 0;
    background-image: var(--interior-art);
    background-repeat: no-repeat;
    background-size: 180% auto;
    background-position: right 25%;
    mask-image: linear-gradient(to bottom, transparent, #000 9%, #000 93%, transparent);
  }
  .about-story h1 { font-size: clamp(36px, 8.6vw, 56px); }
  .story-copy p { margin-top: 22px; font-size: 16px; line-height: 1.6; }
  .about-story > .scene { height: min(65vw, 350px); min-height: min(65vw, 350px); background-size: 180% auto; background-position: right 8%; }
  .leaves { display: flex; flex-direction: column; flex: 1; padding: 22px 6% 44px; }
  .leaves h2 { font-size: 36px; line-height: 1.15; }
  .leaves p { margin-top: 22px; font-size: 16px; line-height: 1.6; }
  .leaves .lead { margin-top: 16px; font-size: 20px; line-height: 1.45; }
  .leaves::after {
    content: '';
    display: block;
    height: min(62vw, 360px);
    min-height: min(62vw, 360px);
    flex: 1;
    margin: 24px -6.82% -44px;
    background: var(--interior-art) left bottom / 180% auto no-repeat;
    mask-image: linear-gradient(to bottom, transparent, #000 9%, #000);
  }
  .contact .intro h1 { font-size: clamp(47px, 11vw, 64px); line-height: .98; }
  .email-label { margin-top: 24px; font-size: 21px; line-height: 1.4; }
  .email-label a { font-size: 23px; }
  .contact-form { margin-top: 30px; padding: 28px 24px; border-radius: 22px; }
  .field-row { grid-template-columns: 1fr; gap: 22px; }
  .contact-form label { margin-bottom: 9px; font-size: 16px; line-height: 1.35; }
  .contact-form input, .contact-form textarea { min-height: 52px; padding: 14px; border-radius: 8px; font-size: 16px; }
  .contact-form > label { margin-top: 26px; }
  .contact-form textarea { min-height: 180px; }
  .contact-form .button { margin-top: 26px; }
  .form-note, .form-status { margin-top: 13px; font-size: 13px; line-height: 1.5; }
  .faq-layout h1 { font-size: clamp(38px, 8.9vw, 60px); }
  .faq-list { margin-top: 28px; }
  .faq-list details { margin-bottom: 4px; padding: 0 20px; border-radius: 10px; }
  .faq-list summary { min-height: 66px; gap: 18px; padding: 20px 0; font-size: 17px; line-height: 1.4; }
  .plus { width: 17px; height: 17px; }
  .answer { padding: 0 0 22px; }
  .answer p { margin-top: 4px; font-size: 16px; line-height: 1.6; }
  .answer p + p { margin-top: 16px; }
  .locations .intro h1 { font-size: clamp(44px, 10vw, 64px); }
  .location-list { margin-top: 30px; padding: 4px 24px; border-radius: 22px; }
  .location { align-items: flex-start; flex-wrap: wrap; gap: 19px; padding: 25px 0; }
  .location h2 { font-size: 28px; line-height: 1.15; }
  .location address { margin-top: 9px; font-size: 17px; line-height: 1.5; }
  .hours { margin-top: 10px; font-size: 16px; line-height: 1.4; }
  .location .button { min-height: 48px; font-size: 16px; }
  .contact .split-layout::after, .faqs .split-layout::after, .locations .split-layout::after {
    content: '';
    display: block;
    height: min(67vw, 390px);
    min-height: min(67vw, 390px);
    flex: 1;
    margin: 20px -6.82% 0;
    background-image: var(--interior-art);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 175% auto;
    mask-image: linear-gradient(to bottom, transparent, #000 12%, #000);
  }
  .locations .split-layout::after { height: min(82vw, 430px); min-height: min(82vw, 430px); background-size: 170% auto; background-position: left 70%; }
}

@media (min-width: 450px) and (max-width: 599px) {
  .team-layout, .split-layout, .about-story, .leaves { padding-inline: 10%; }
  .field-row { grid-template-columns: 1fr 1fr; }
  .team-layout > .scene, .about-story > .scene, .leaves::after,
  .contact .split-layout::after, .faqs .split-layout::after, .locations .split-layout::after { margin-inline: -12.5%; background-size: 130% auto; }
  .team-layout > .scene { background-position: right 27%; }
  .about-story > .scene { background-position: right top; }
  .locations .split-layout::after { background-position: left 73%; }
}

@media (prefers-reduced-motion: reduce) {
  .plus::after { transition: none; }
}