/* ==========================================================================
   Property landing page, 2026 design (page-property-guide.php with
   meta.design = 'lp-2026'; markup in inc/property-guide/render-lp.php).
   Figma "Property pages" > "Property Page - Dynamic": frames 1440w, 992w,
   768w, 600w and 375w, one per snap point:
     <= 599 | 600 - 767 | 768 - 991 | 992 - 1199 | >= 1200
   Mobile first. Every rule is scoped under .plp so it beats the parent theme
   by scoping, not !important.
   The Israel and Dubai pages ("Property Page - Israel" / "- Dubai") use the
   same bands: their hero and review photos are cropped to the Spain photos'
   geometry, so the percentages below serve every country.
   Two Figma export artefacts are deliberately not copied: the stretched
   cut-out at 992 / 768 and the stretched review photo at 768 / 600 / 375
   (both are drawn undistorted, on the same focal point); and the two-tone
   callback band at 768 (flat navy, as at 1440).
   ========================================================================== */

/* Lato black and italic (style.css only declares 300 / 400 / 700) */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('../fonts/lato-v25-latin-900.woff2') format('woff2');
}
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/lato-v25-latin-italic.woff2') format('woff2');
}

/* --- shell ---------------------------------------------------------------- */
/* anchor jumps, and fields scrolled into view on focus, land clear of the fixed site header */
html:has(body.pg-design-lp-2026) { scroll-padding-top: 96px; }
/* LP mode keeps the site sticky bar off (its markup still prints in footer.php) */
body.pg-lp-mode #ct-sticky-bar { display: none; }
/* the footer sits flush under the navy callback band, as in the Figma frame
   (style.min.css gives section#footer a 32 / 64 / 80px top margin: a white strip here) */
body.pg-design-lp-2026 section#footer { margin-top: 0; }

.plp {
  --plp-navy: #0d364a;
  --plp-blue: #1595ca;
  --plp-blue-dark: #117aa8;
  --plp-brand: #195c7d;
  --plp-ink: #0f1f3d;
  --plp-text: #445667;
  --plp-muted: #5c6f7e;
  --plp-tone: #556d82;
  --plp-rule: #d4dce3;
  --plp-pale: #e8f4fa;
  --plp-placeholder: #8a99a6;
  --plp-a: #99abbc;
  --plp-sky: #014d9a;
  --plp-chat: #21cd5b;
  --plp-error: #b42318;
  display: block;
  font-family: "Lato", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: var(--plp-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* --- resets against the parent theme's element rules ----------------------- */
.plp *, .plp *::before, .plp *::after { box-sizing: border-box; }
.plp h1, .plp h2, .plp h3, .plp p, .plp ul, .plp ol, .plp li,
.plp dl, .plp dt, .plp dd, .plp figure, .plp blockquote, .plp figcaption { margin: 0; padding: 0; border: 0; }
.plp ul, .plp ol { list-style: none; }
.plp h1, .plp h2, .plp h3 { font-family: inherit; font-style: normal; text-transform: none; }
.plp p { font-size: inherit; text-wrap: pretty; }
.plp a { text-decoration: none; }
.plp img { display: block; max-width: 100%; height: auto; border: 0; }
.plp picture { display: contents; }
.plp blockquote { background: none; font-style: normal; quotes: none; }
.plp blockquote::before, .plp blockquote::after { content: none; display: none; }
.plp button { font-family: inherit; }

.plp-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 32px; }
.plp-notes { padding-top: 16px; padding-bottom: 16px; }
.plp .pg-editor-note { margin: 12px 0; padding: 12px 16px; border: 1px solid #f0c36d; border-radius: 8px; background: #fff8e5; color: #5b4a1a; font-size: 14px; line-height: 1.5; }
.plp .pg-editor-note code { font-size: 13px; }

/* --- shared parts ------------------------------------------------------------ */
.plp .plp-pill {
  display: inline-flex;
  align-self: flex-start;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(21, 149, 202, .2);
  color: var(--plp-blue);
  font-size: 13px;
  line-height: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  white-space: nowrap;
}
.plp .plp-pill--light { background: rgba(255, 255, 255, .2); color: #fff; }

.plp .plp-h2 { font-size: 32px; line-height: 36px; font-weight: 700; letter-spacing: 0; color: var(--plp-navy); }
.plp .plp-lead { font-size: 22px; line-height: 30.8px; color: var(--plp-text); }

/* buttons: labels are sentence case in the markup, capitals here */
.plp .plp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  margin: 0;
  padding: 0 28px;
  border: 2px solid transparent;
  border-radius: 8px;
  background: none;
  font-family: "Lato", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .1s ease;
}
.plp .plp-btn:active { transform: translateY(1px); }
/* Dante sets a { outline: 0 !important } and input:focus { box-shadow: none !important },
   so the focus rings here have to be !important to show at all */
.plp .plp-btn:focus-visible { outline: 3px solid var(--plp-blue) !important; outline-offset: 3px; }
.plp .plp-btn--light { background: #fff; border-color: #fff; color: var(--plp-navy); }
.plp .plp-btn--light:hover, .plp .plp-btn--light:focus { background: var(--plp-pale); border-color: var(--plp-pale); color: var(--plp-navy); }
.plp .plp-btn--outline-light { height: 52px; border-color: rgba(255, 255, 255, .65); color: #fff; }
.plp .plp-btn--outline-light:hover, .plp .plp-btn--outline-light:focus { background: rgba(255, 255, 255, .1); border-color: #fff; color: #fff; }
.plp .plp-btn--light:focus-visible, .plp .plp-btn--outline-light:focus-visible { outline-color: #fff !important; }
.plp .plp-btn--ink { border-color: var(--plp-ink); border-radius: 15px; background: var(--plp-ink); color: #fff; }
.plp .plp-btn--ink:hover, .plp .plp-btn--ink:focus { border-color: #22375f; background: #22375f; color: #fff; }
.plp .plp-btn--compact { padding: 0 32px; font-size: 14px; letter-spacing: .6px; }
.plp .plp-btn--primary { height: 58px; border: 0; border-radius: 15px; background: var(--plp-blue); color: #fff; letter-spacing: .6px; }
.plp .plp-btn--primary:hover, .plp .plp-btn--primary:focus { background: var(--plp-blue-dark); color: #fff; }
.plp .plp-btn--navy { border-color: var(--plp-navy); background: var(--plp-navy); color: #fff; }
.plp .plp-btn--navy:hover, .plp .plp-btn--navy:focus { border-color: #164a63; background: #164a63; color: #fff; }
/* WhatsApp "Start a chat" (only when the page's person has a WhatsApp number) */
.plp .plp-btn--chat { gap: 8px; padding: 0 28px 0 11px; border-color: rgba(33, 205, 91, .65); background: var(--plp-chat); color: #fff; }
.plp .plp-btn--chat:hover, .plp .plp-btn--chat:focus { border-color: #1ab24e; background: #1ab24e; color: #fff; }
.plp .plp-btn--chat:focus-visible { outline-color: #fff !important; }
.plp .plp-btn__icon { flex: 0 0 auto; width: 26px; height: 26px; margin: 3px; }

/* named person: round photo, name, phone, email */
.plp-person { display: flex; align-items: center; gap: 18px; min-width: 0; }
.plp-person__photo { position: relative; flex: 0 0 auto; width: 61.333px; height: 61.333px; overflow: hidden; border-radius: 50%; }
.plp .plp-person__photo img { position: absolute; left: -4px; top: 0; width: 74.667px; height: 74.667px; max-width: none; object-fit: cover; }
.plp-person__text { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.plp .plp-person__name { font-size: 20px; line-height: 20.8px; font-weight: 700; color: var(--plp-blue); }
.plp .plp-person__lines { display: flex; flex-direction: column; align-items: flex-start; }
.plp .plp-person__phone { font-size: 18px; line-height: 22px; font-weight: 700; letter-spacing: -.16px; color: #fff; }
.plp .plp-person__email { font-size: 16px; line-height: 20px; color: #fff; overflow-wrap: anywhere; }
.plp .plp-person__phone, .plp .plp-person__email { display: inline-flex; align-items: center; min-height: 24px; } /* WCAG 2.5.8 target size */
.plp .plp-person__phone:hover, .plp .plp-person__email:hover { color: #fff; text-decoration: underline; }
.plp .plp-person a:focus-visible { outline: 2px solid #fff !important; outline-offset: 2px; }

/* Trustpilot line (hero) */
.plp .plp-tp { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 14px; line-height: 22.4px; color: #fff; }
.plp .plp-tp:hover span { text-decoration: underline; }
.plp .plp-tp:focus-visible { outline: 2px solid #fff !important; outline-offset: 3px; }
.plp .plp-tp__stars { flex: 0 0 auto; width: 106px; height: 20.05px; }

/* ==========================================================================
   1. Hero
   ========================================================================== */
.plp-hero { position: relative; overflow: hidden; background: var(--plp-navy); color: #fff; }
.plp-hero__row { display: flex; flex-direction: column; gap: 48px; padding-top: 56px; padding-bottom: 32px; }
.plp-hero__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; min-width: 0; }
.plp-hero__head { display: flex; flex-direction: column; gap: 32px; max-width: 680.65px; }
.plp .plp-hero__title { font-size: 42px; line-height: 52px; font-weight: 400; letter-spacing: 0; color: #fff; text-align: left; }
.plp-hero__line { display: block; }
.plp-hero__line--strong { font-weight: 900; }
.plp .plp-hero__text p { font-size: 18px; line-height: 26px; color: rgba(255, 255, 255, .86); }
.plp .plp-hero__text p + p { margin-top: 26px; }
.plp-hero__cta { width: 100%; padding-top: 6px; }
.plp-hero__cta .plp-btn { width: 100%; }
.plp .plp-hero__trust { font-size: 14px; line-height: 22.4px; color: rgba(255, 255, 255, .72); }

/* The photo: .plp-hero__media is the rounded frame's box. The cut-out is the
   same photo with the sky removed, drawn under the frame and on to the right
   edge of the screen (the hero clips it), so the villa breaks out of the
   frame. Its box is the photo canvas right of 52.6%, placed in % of the
   frame: at <= 767 and >= 1200 the frame is 40.67% of the canvas, at
   768 - 1199 it is a narrower slice (28.15%). */
.plp-hero__media { position: relative; flex: 0 0 auto; width: min(301.674px, 97%); aspect-ratio: 495.782 / 803; margin: 3.04px 0; }
.plp-hero__frame { position: absolute; inset: 0; z-index: 1; overflow: hidden; border-radius: 13.71px; background: #6fb9e8; }
.plp .plp-hero__photo { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 50%; }
.plp .plp-hero__cutout { position: absolute; z-index: 0; left: 87.740%; top: -.6227%; width: 116.584%; height: 101.245%; max-width: none; }

/* named-person band under the hero */
.plp-hero__band { border-top: 1px solid rgba(255, 255, 255, .14); }
.plp-hero__band-row.plp-wrap { display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding: 24px 17px 36px; }
.plp-hero__band .plp-btn { width: 100%; }
/* callback + chat: stacked below 600 and at 768 - 991, side by side otherwise */
.plp-hero__actions { display: flex; flex-direction: column; gap: 16px; }

/* ==========================================================================
   2. Guide download
   ========================================================================== */
.plp-guide { padding: 64px 0; background: var(--plp-pale); }
.plp-guide .plp-wrap { padding: 0; }
.plp .plp-guide__title { max-width: 500px; margin: 0 auto 24px; padding: 0 16px; font-size: 32px; line-height: 40px; font-weight: 900; color: var(--plp-brand); text-wrap: balance; }
.plp-guide__row { display: flex; flex-direction: column; align-items: stretch; gap: 32px; padding: 0 16px; }
.plp-guide__intro { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.plp-guide__cover { overflow: hidden; aspect-ratio: 500 / 249.583; border-bottom: 2px solid var(--plp-blue); }
.plp .plp-guide__img { width: 100%; height: auto; }
.plp .plp-guide__text { font-size: 20px; line-height: 31px; color: var(--plp-brand); }
.plp-guide__side { display: flex; flex-direction: column; gap: 22px; min-width: 0; padding-top: 19px; }
.plp-card--guide { padding: 32px 24px; border-radius: 15px; background: #fff; box-shadow: 0 10px 15px rgba(0, 51, 102, .18); }
.plp .plp-guide__note { font-size: 14px; line-height: 22.4px; color: var(--plp-brand); text-align: center; }

/* ==========================================================================
   3. Why buyers / How it works / What's available / Before you buy
   ========================================================================== */
.plp-block .plp-wrap { padding: 0 24px; }
.plp-block + .plp-block { margin-top: 48px; }
.plp-block__head { display: flex; flex-direction: column; gap: 9.4px; }

/* 3a Why buyers */
.plp-why .plp-block__inner { display: flex; flex-direction: column; gap: 48px; padding: 64px 0 32px; }
.plp-why__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px 64px; }
.plp-why__item { display: flex; align-items: flex-start; gap: 14px; }
.plp .plp-why__icon { flex: 0 0 56px; width: 56px; height: 56px; border-radius: 14px; }
.plp-why__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.plp-why__item:nth-child(n+3) .plp-why__body { gap: 8px; }
.plp .plp-why__title { font-size: 18px; line-height: 20.16px; font-weight: 700; letter-spacing: -.18px; color: var(--plp-navy); }
.plp .plp-why__body p { font-size: 16px; line-height: 24px; color: var(--plp-muted); }
.plp-why__foot { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-top: 24px; border-top: 1px solid var(--plp-rule); }
.plp .plp-why__foot p { order: -1; font-size: 18px; line-height: 24px; color: var(--plp-muted); }
.plp .plp-why__foot .plp-btn { width: 100%; max-width: 320px; }

/* 3b How it works: a vertical line of numbered steps, a row from 768 */
.plp-steps__inner { display: flex; flex-direction: column; gap: 32px; padding-top: 64px; }
.plp .plp-steps .plp-h2 { line-height: 35.84px; }
.plp-steps__list { display: flex; flex-direction: column; }
.plp-steps__item { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 16px; align-items: start; }
.plp-steps__item:not(:last-child)::after { content: ''; position: absolute; left: 22px; top: 48px; bottom: 0; width: 4px; border-radius: 2px; background: var(--plp-blue); }
.plp-steps__num { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--plp-blue); color: #fff; font-size: 22.5px; line-height: 22.5px; font-weight: 900; }
.plp-steps__body { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding-bottom: 64px; }
.plp-steps__item:last-child .plp-steps__body { padding-bottom: 48px; }
.plp .plp-steps__title { font-size: 24px; line-height: 28.8px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; color: var(--plp-navy); }
.plp .plp-steps__body p { font-size: 16px; line-height: 25.6px; color: var(--plp-text); }

/* 3c What's available */
.plp-products .plp-block__inner { display: flex; flex-direction: column; gap: 24px; padding: 64px 0 32px; }
.plp .plp-products__list { display: flex; flex-direction: column; gap: 32px; padding: 0 8px; }
.plp-products__item { display: flex; flex-direction: column; }
.plp .plp-products__art { flex: 0 0 auto; width: 250px; height: 211.111px; }
.plp-products__body { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 24px 0; border-radius: 20px; }
.plp .plp-products__body .plp-pill { margin-bottom: 14px; }
.plp .plp-products__title { font-size: 22px; line-height: 24.64px; font-weight: 700; letter-spacing: 0; color: var(--plp-navy); }
.plp .plp-products__text { padding-bottom: 8px; font-size: 16px; line-height: 25.6px; color: var(--plp-text); }
.plp-products__cta { display: flex; justify-content: center; margin-top: 8px; padding: 0 8px; }
.plp .plp-products__cta .plp-btn { width: 100%; }

/* 3d Before you buy */
.plp-qa__inner { padding-bottom: 32px; }
.plp .plp-qa__title { padding-bottom: 12px; border-bottom: 1px solid var(--plp-rule); }
.plp-qa__item { display: flex; flex-direction: column; gap: 12px; padding: 24px 8px; border-bottom: 1px solid var(--plp-rule); }
.plp-qa__item:last-child { border-bottom: 0; }
.plp .plp-qa__q, .plp .plp-qa__a { display: flex; gap: 12px; }
.plp .plp-qa__q { align-items: center; }
.plp .plp-qa__a { align-items: flex-start; }
.plp-qa__item:not(.is-open) .plp-qa__a { display: none; }
.plp-qa__mark { display: flex; flex: 0 0 45px; align-items: center; justify-content: center; width: 45px; height: 45px; border-radius: 50%; background: #1695ca; color: #fff; font-size: 26px; line-height: 22px; font-weight: 700; }
.plp-qa__mark--a { background: var(--plp-a); }
.plp .plp-qa__toggle { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; border: 0; background: none; font-size: 20px; line-height: 26px; font-weight: 400; text-align: left; color: #1695ca; cursor: pointer; }
.plp .plp-qa__toggle:hover { color: var(--plp-blue-dark); }
.plp .plp-qa__toggle:focus-visible { outline: 2px solid var(--plp-blue) !important; outline-offset: 4px; border-radius: 2px; }
.plp .plp-qa__text { flex: 1 1 auto; min-width: 0; padding-top: 1px; font-size: 16px; line-height: 22px; color: var(--plp-text); }

/* ==========================================================================
   4. Client review
   ========================================================================== */
.plp-review { position: relative; isolation: isolate; overflow: hidden; padding: 32px 0 144px; background: var(--plp-sky); }
.plp-review__bg { position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; height: 60.95%; }
.plp .plp-review__img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 81% 100%; }
.plp-review__inner { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.plp .plp-review__card { display: flex; flex-direction: column; gap: 24px; width: 100%; padding: 32px 32px 24px; border-radius: 16px; background: rgba(255, 255, 255, .8); }
.plp .plp-review__quote p { padding-left: 8px; font-size: 20px; line-height: 26px; font-style: italic; letter-spacing: 1px; color: var(--plp-tone); }
.plp .plp-review__by { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding-top: 24px; border-top: 1px solid var(--plp-tone); }
.plp-review__avatar { display: flex; flex: 0 0 56px; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 28px; background: var(--plp-blue); color: #fff; font-size: 20px; line-height: 20px; font-weight: 900; letter-spacing: .4px; }
.plp-review__who { display: flex; flex: 1 1 0; flex-direction: column; gap: 6px; min-width: 0; }
.plp-review__name { font-size: 20px; line-height: 19.6px; font-weight: 700; color: var(--plp-blue); }
.plp-review__sub { font-size: 16px; line-height: 18px; font-weight: 700; letter-spacing: -.28px; color: var(--plp-ink); }
.plp .plp-review__rating { display: none; align-items: center; gap: 0 7px; color: #191919; white-space: nowrap; }
.plp .plp-review__rating:hover { color: #191919; }
.plp .plp-review__rating:focus-visible { outline: 2px solid var(--plp-blue) !important; outline-offset: 3px; }
.plp-review__label { font-size: 23px; line-height: 35px; }
.plp-review__score { font-size: 20px; line-height: 35px; color: #3a3a3a; }
.plp-review__score strong { font-weight: 700; color: #191919; }
.plp .plp-review__tp { width: 126px; height: 41px; margin-left: -5px; }
.plp-review__stats { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.plp .plp-stat { display: inline-flex; align-items: center; gap: 16px; padding: 4px 32px 4px 4px; border-radius: 43px; background: rgba(255, 255, 255, .8); white-space: nowrap; }
.plp-stat__value { display: inline-flex; align-items: center; gap: 4.04px; padding: 4.04px 16.16px; border-radius: 999px; background: var(--plp-navy); color: #fff; font-size: 20px; line-height: 1.2; font-weight: 900; letter-spacing: 2.4px; }
.plp-stat__plus { font-size: 25px; letter-spacing: 3px; }
.plp-stat__label { font-size: 18px; line-height: 1.2; font-weight: 700; text-transform: uppercase; color: var(--plp-ink); }

/* ==========================================================================
   5. Callback
   ========================================================================== */
.plp-callback { padding: 30px 0 80px; background: var(--plp-navy); color: #fff; }
.plp-callback__row { display: flex; flex-direction: column; gap: 32px; }
.plp-callback__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 21.4px; min-width: 0; padding-top: 20px; }
.plp .plp-callback__title { font-size: 32px; line-height: 36px; font-weight: 700; letter-spacing: 0; color: #fff; }
.plp .plp-callback__text { font-size: 18px; line-height: 27.9px; color: rgba(255, 255, 255, .82); }
.plp-person--callback { flex-direction: column; align-items: flex-start; width: 100%; max-width: 420px; padding: 24px 8px 0; border-top: 1px solid rgba(255, 255, 255, .2); }
/* with the chat button, the group takes the person's rule and padding: chat full width below 600,
   left under the person at 600 - 767, beside it at 768 - 991, under it again from 992 */
.plp-callback__contact { display: flex; flex-direction: column; align-items: stretch; gap: 16px; width: 100%; padding: 24px 8px 0; border-top: 1px solid rgba(255, 255, 255, .2); }
.plp .plp-callback__contact .plp-person--callback { width: auto; max-width: none; margin: 0; padding: 0; border: 0; }
.plp-card--callback { min-width: 0; padding: 24px; border-radius: 12px; background: #fff; box-shadow: 0 20px 30px rgba(0, 0, 0, .25); color: var(--plp-navy); }
.plp .plp-card__title { margin-bottom: 18px; font-size: 26px; line-height: 32px; font-weight: 900; color: var(--plp-navy); }

/* ==========================================================================
   Forms (guide download and callback)
   ========================================================================== */
.plp-form { position: relative; }
.plp-form__fields { display: flex; flex-direction: column; gap: 16px; }
.plp-form__fields--grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.plp-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.plp .plp-field__label { display: block; margin: 0; font-size: 13px; line-height: 15.6px; font-weight: 700; letter-spacing: .26px; color: var(--plp-navy); }
.plp .plp-field__control {
  display: block;
  width: 100%;
  height: auto;
  min-height: 48px;
  margin: 0;
  padding: 13.25px 14px;
  border: 1px solid var(--plp-rule);
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
  color: var(--plp-navy);
  font-family: "Lato", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 19.5px;
  font-weight: 400;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.plp .plp-field__control::placeholder { color: var(--plp-placeholder); opacity: 1; }
.plp .plp-field__control:focus { outline: none; border-color: var(--plp-blue) !important; box-shadow: 0 0 0 3px rgba(21, 149, 202, .25) !important; }
.plp-field__select { position: relative; display: block; }
.plp-field__select::after { content: ''; position: absolute; top: 50%; right: 16px; width: 14px; height: 9px; margin-top: -4.5px; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%230D364A' stroke-width='2'/%3E%3C/svg%3E") no-repeat; }
.plp .plp-field--select .plp-field__control { padding-right: 38px; cursor: pointer; }
.plp .plp-field.is-invalid .plp-field__control { border-color: var(--plp-error) !important; }
.plp .plp-field.is-invalid .plp-field__control:focus { box-shadow: 0 0 0 3px rgba(180, 35, 24, .2) !important; }
.plp .plp-field__error { font-size: 13px; line-height: 18px; font-weight: 700; color: var(--plp-error); }
.plp .plp-form__submit { width: 100%; }
/* sending in the background: the label says so; colours stay (white on blue is already at its contrast limit) */
.plp .plp-form.is-sending .plp-form__submit { cursor: progress; }
.plp .plp-form.is-sending .plp-form__submit:active { transform: none; }
.plp .plp-form__status { margin-top: 16px; padding: 12px 14px; border-radius: 8px; font-size: 14px; line-height: 1.5; }
/* the live region is always in the page (so it is announced); empty, it takes no space */
.plp .plp-form__status:empty { margin: 0; padding: 0; }
.plp .plp-form__status--success { background: #e7f6ec; color: #14532d; }
.plp .plp-form__status--error { background: #fdecea; color: #7a1d14; }
.plp .plp-form__note { font-size: 13px; line-height: 19.5px; color: var(--plp-muted); }
.plp .plp-form__note a { color: var(--plp-brand); text-decoration: underline; text-underline-position: from-font; }
.plp .plp-form__note a:focus-visible { outline: 2px solid var(--plp-blue) !important; outline-offset: 2px; }
.plp-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* guide form: inset labels, rounder inputs, taller button */
.plp-form--guide .plp-field { padding-top: 4px; }
.plp-form--guide .plp-field:first-child { padding-top: 12px; }
.plp .plp-form--guide .plp-field__label { padding: 0 8px; line-height: 16.9px; letter-spacing: 0; }
.plp .plp-form--guide .plp-field__control { min-height: 46px; padding: 12.25px 14px; border-radius: 12px; }
.plp .plp-form--guide .plp-form__submit { margin-top: 32px; }

/* callback form: one column below 600, button and note 24 apart */
.plp .plp-form--callback .plp-form__submit { margin-top: 28px; }
.plp .plp-form--callback .plp-form__note { margin-top: 24px; }

/* ==========================================================================
   600 - 767
   ========================================================================== */
@media (min-width: 600px) {
  .plp .plp-hero__title { font-size: 74px; line-height: 75px; }
  /* "transfer, sorted." is ~538px at 74px against a 536px column at 600: keep
     the designed four lines (it overhangs into the 32px gutter by a few px) */
  .plp-hero__line { white-space: nowrap; }
  .plp .plp-hero__text p { font-size: 20px; line-height: 31px; }
  .plp .plp-hero__text p + p { margin-top: 31px; }
  .plp-hero__cta, .plp-hero__cta .plp-btn { width: auto; }
  /* 301.674 as designed; wider than 648 the photo grows just enough for the
     cut-out (2.0432 x the frame, from the 32px gutter) to reach the screen edge */
  .plp-hero__media { width: max(301.674px, calc((100vw - 32px) / 2.0432)); }
  .plp-hero__band-row.plp-wrap { align-items: flex-start; padding: 24px 32px; }
  .plp-hero__band .plp-btn { width: auto; }
  .plp-hero__actions { flex-direction: row; }

  .plp .plp-guide__title { padding: 0; font-size: 43px; line-height: 52px; text-wrap: wrap; }
  .plp-guide__row { align-items: center; }
  .plp-guide__intro, .plp-guide__side { width: 500px; }

  .plp .plp-why__foot .plp-btn { width: auto; }
  .plp .plp-products__list { padding: 0; }
  .plp-products__body { padding: 24px; }
  .plp-products__cta { padding: 0; }
  .plp .plp-products__cta .plp-btn { max-width: 320px; }

  .plp .plp-review__quote p { font-size: 30px; line-height: 40px; }
  .plp .plp-review__rating { display: inline-flex; flex: 0 0 100%; }
  .plp-review__stats { flex-direction: row; flex-wrap: wrap; }
  .plp .plp-review__img { object-position: 90% 100%; }

  .plp .plp-callback__title { font-size: 44px; line-height: 48px; }
  .plp-person--callback { flex-direction: row; align-items: center; padding: 24px 8px; }
  .plp-callback__contact { align-items: flex-start; }
  .plp-card--callback { padding: 36px; }
  .plp-form__fields--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plp-field--full { grid-column: 1 / -1; }
  .plp .plp-form--callback .plp-form__submit { margin-top: 20px; }
  /* the two-column form has an empty last grid row in Figma: 36.8px more white under the note */
  .plp .plp-form--callback .plp-form__note { margin: 16px 0 36.8px; }
}

/* ==========================================================================
   768 - 991
   ========================================================================== */
@media (min-width: 768px) {
  /* hero: copy 450 + photo slice side by side; at 768 the photo runs off
     the right edge, from about 851 its corners and the cut-out show */
  .plp-hero__row { flex-direction: row; align-items: flex-start; padding-bottom: 56px; }
  .plp-hero__copy { flex: 0 0 450px; width: 450px; }
  .plp .plp-hero__title { font-size: 55px; line-height: 64px; }
  .plp .plp-hero__text p { font-size: 18px; line-height: 28px; }
  .plp .plp-hero__text p + p { margin-top: 28px; }
  .plp-hero__media { width: 320.742px; aspect-ratio: 320.742 / 750.382; margin: 4.67px 0; }
  .plp-hero__frame { border-radius: 16px; }
  .plp .plp-hero__photo { object-position: 81.4% 50%; }
  .plp .plp-hero__cutout { left: 90.56%; top: -.6224%; width: 168.45%; height: 101.246%; }
  .plp-hero__band { padding: 0 32px; }
  .plp-hero__band-row.plp-wrap { flex-direction: row; align-items: center; justify-content: space-between; gap: 6px; }
  .plp-hero__actions { flex-direction: column; }

  .plp-guide { padding: 64px 32px; }
  .plp-guide .plp-wrap { max-width: 600px; }
  .plp .plp-guide__title { max-width: none; }
  .plp-guide__row { align-items: stretch; padding: 0 32px 0 0; }
  .plp-guide__intro, .plp-guide__side { width: auto; }

  .plp-block .plp-wrap { padding: 0 32px; }
  .plp .plp-why .plp-h2 { line-height: 35.84px; letter-spacing: -.64px; }
  .plp-why__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plp-why__foot { flex-direction: row; align-items: center; }
  .plp .plp-why__foot p { order: 0; flex: 1 1 0; max-width: 585px; }
  .plp .plp-why__foot .plp-btn { flex: 0 0 auto; }

  .plp-steps__inner { border-bottom: 1px solid var(--plp-rule); }
  .plp-steps__list { flex-direction: row; }
  .plp-steps__item { display: flex; flex: 1 1 0; flex-direction: column; gap: 16px; min-width: 0; }
  .plp-steps__item:not(:last-child)::after { left: 46px; right: -2px; top: 22px; bottom: auto; width: auto; height: 4px; }
  .plp-steps__body { padding: 0 32px 64px 0; }
  .plp-steps__item:last-child .plp-steps__body { padding-bottom: 64px; }

  .plp .plp-products__list { gap: 24px; }
  .plp-products__item { flex-direction: row; align-items: flex-start; gap: 18px; }
  .plp-products__body { flex: 1 1 auto; }
  .plp .plp-products__title { line-height: 26px; }
  .plp .plp-products__text { max-width: 560px; }
  .plp-products__cta { margin-top: 0; }

  .plp-review { min-height: 753px; }
  .plp-review__bg { height: 88.92%; }
  .plp .plp-review__img { object-position: 87% 100%; }
  .plp .plp-review__rating { flex: 0 0 auto; margin-left: auto; }

  .plp-callback { padding: 48px 0 80px; }
  .plp-callback .plp-wrap { max-width: 664px; }
  .plp .plp-callback__title { text-wrap: balance; }
  .plp-person--callback { max-width: none; margin-top: 32.59px; }
  .plp-callback__contact { flex-direction: row; align-items: flex-end; margin-top: 32.59px; }
  .plp .plp-callback__contact .plp-person--callback { flex: 1 1 auto; }
}

/* ==========================================================================
   992 - 1199
   ========================================================================== */
@media (min-width: 992px) {
  .plp-hero__actions { flex-direction: row; }

  .plp-guide .plp-wrap { max-width: 1200px; }
  .plp-guide__row { flex-direction: row; align-items: flex-start; }
  .plp-guide__intro, .plp-guide__side { flex: 1 1 0; }

  .plp .plp-products .plp-h2, .plp .plp-qa .plp-h2 { line-height: 35.84px; letter-spacing: -.64px; }
  .plp .plp-products__title { line-height: 24.64px; }

  .plp-review { min-height: 0; padding: 32px 0 196px; }
  .plp-review__bg { top: 0; height: auto; }
  .plp .plp-review__img { object-position: 89.5% 50%; }
  .plp .plp-review__card { width: auto; max-width: 773.55px; }
  .plp .plp-review__quote p { max-width: 709.55px; }

  .plp-callback .plp-wrap { max-width: 1200px; }
  .plp-callback__row { flex-direction: row; align-items: flex-start; }
  .plp-callback__copy { flex: 0 0 420px; width: 420px; }
  .plp-callback__contact { flex-direction: column; align-items: flex-start; padding-bottom: 24px; }
  .plp .plp-callback__title { text-wrap: wrap; }
  .plp-card--callback { flex: 1 1 0; }
  .plp-form__fields--grid { grid-template-columns: minmax(0, 1fr); }
  .plp-field--full { grid-column: auto; }
  .plp .plp-form--callback .plp-form__submit { margin-top: 28px; }
  .plp .plp-form--callback .plp-form__note { margin: 24px 0 0; }
}

/* ==========================================================================
   >= 1200
   ========================================================================== */
@media (min-width: 1200px) {
  .plp-hero__copy { flex-basis: 603px; width: 603px; }
  .plp .plp-hero__title { font-size: 74px; line-height: 75px; }
  .plp .plp-hero__text p { font-size: 20px; line-height: 31px; }
  .plp .plp-hero__text p + p { margin-top: 31px; }
  .plp-hero__media { width: 495.782px; aspect-ratio: 495.782 / 803; margin: 5px 0; }
  .plp .plp-hero__photo { object-position: 50% 50%; }
  /* on screens past ~2400px the photo's own right edge comes into view: fade it out */
  .plp .plp-hero__cutout { left: 87.740%; top: -.6227%; width: 116.584%; height: 101.245%; -webkit-mask-image: linear-gradient(90deg, #000 80%, transparent); mask-image: linear-gradient(90deg, #000 80%, transparent); }
  .plp-hero__band { padding: 0; }

  .plp-guide { padding: 64px 0; }
  .plp .plp-guide__title { padding: 0 52px; }
  .plp-guide__row { justify-content: center; padding-right: 32px; }
  .plp-guide__intro, .plp-guide__side { flex: 0 0 500px; width: 500px; }

  .plp-block .plp-wrap { padding: 0 20px; }
  .plp-why .plp-block__inner, .plp-products .plp-block__inner { max-width: 996px; margin: 0 auto; }
  .plp .plp-products__head, .plp .plp-products__list { width: 892px; margin: 0 auto; }
  .plp .plp-products__list { gap: 18px; }
  .plp-products__cta { margin-top: -6px; }
  .plp .plp-products__title { letter-spacing: -.22px; }
  .plp-qa__inner { max-width: 790px; margin: 0 auto; }
  /* answers run the full 790 column (Israel / Dubai frames); balanced so short ones don't end on a stub */
  .plp .plp-qa__text { text-wrap: balance; }

  .plp-review { padding: 104px 0 164px; }
  .plp-review .plp-wrap { padding: 0; }
  .plp .plp-review__img { object-position: 50% 50%; }

  .plp-callback { padding: 80px 0; }
  .plp-callback__row { display: grid; grid-template-columns: minmax(0, 477fr) minmax(0, 549fr); gap: 110px; }
  .plp-callback__copy { width: auto; }
  .plp .plp-callback__title { max-width: 527px; letter-spacing: -.88px; line-height: 47.52px; }
  .plp .plp-callback__text { max-width: 459.36px; }
  .plp-form__fields--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plp-field--full { grid-column: 1 / -1; }
  .plp .plp-form--callback .plp-form__submit { margin-top: 20px; }
  .plp .plp-form--callback .plp-form__note { margin: 16px 0 36.8px; }
}

@media (prefers-reduced-motion: reduce) {
  .plp .plp-btn, .plp .plp-field__control { transition: none; }
  .plp .plp-btn:active { transform: none; }
}
