/* Red treatment is limited to the two approved hero CTAs. */
.hero .button.button-yellow{background-color:#d92535;background-image:none;color:#fff;opacity:1;filter:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;transition:background .22s ease,color .22s ease,box-shadow .22s ease,transform .22s ease}
.hero .button.button-yellow:hover{background:var(--yellow);color:#050608;box-shadow:0 6px 24px #f5c40033;transform:translateY(-2px)}
.hero .button.button-yellow span{display:inline-block;color:var(--yellow);transition:transform .22s ease,color .22s ease}
.hero .button.button-yellow:hover span{color:#050608}
.hero .button.button-yellow:hover span{transform:translate(2px,-2px)}
.hero .button.button-yellow:active{transform:translateY(0);box-shadow:none}
.hero .button.button-yellow:focus-visible{outline:2px solid #fff;outline-offset:4px}
.hero .xpel-endorsement{margin-top:24px}
.hero .xpel-endorsement img{width:140px}
.hero .hero-actions{gap:16px;margin-top:22px}
.hero .hero-actions .hero-booking{margin-top:0}
.hero-call{display:inline-flex;align-items:center;min-height:44px;margin-top:12px;color:var(--yellow)}
.hero .hero-copy{color:#aeb4bd}
.hero h1{margin-bottom:38px}
.hero-conversion{position:relative}
@media(min-width:701px){.hero .hero-content{padding-top:clamp(151px,calc(23svh - 24px),236px)}}
@media(min-width:701px){.hero .hero-media{height:auto;bottom:auto;aspect-ratio:1672/941;background-size:100% 100%;mask-image:linear-gradient(to bottom,#000 0%,#000 76%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 76%,transparent 100%)}.hero .hero-bottom{border-top:0}}
@media(min-width:701px) and (max-height:800px){.hero .hero-content{padding-top:max(100px,calc(18svh - 24px))}}
@media(max-width:700px){.hero h1{margin-bottom:30px}}
.hero .location{display:flex;align-items:center;gap:12px;width:fit-content}
.hero .location::before{content:"";display:block;width:42px;height:2px;background:var(--red);flex-shrink:0}
.hero .location i{margin-left:0;flex-shrink:0}
.hero .hero-side span{color:#d7d9dc;font-size:10px}
@media(max-width:700px){
  .hero{--photo-height:clamp(240px,82vw,340px);padding-top:calc(var(--header-height) + var(--photo-height) + 12px)}
  .hero-media{top:var(--header-height);height:var(--photo-height);background-size:auto var(--photo-height);background-position:right top}
  .hero-glow{top:var(--header-height);height:calc(var(--photo-height) + 8px);background:linear-gradient(0deg,#050608 0%,#05060833 9%,transparent 32%)}
  .hero .location{display:flex;align-items:center;justify-content:center;gap:12px;text-align:center;width:100%}
  .hero .location::before{content:"";display:block;width:42px;height:2px;background:var(--red);flex-shrink:0}
  .hero .location i{margin-left:0;flex-shrink:0}
  .hero .hero-call{display:flex;width:fit-content;margin-inline:0;justify-content:flex-start;text-align:left}
  .hero .xpel-endorsement{margin-top:34px;gap:14px}
  .hero .xpel-endorsement img{width:118px}
  .hero .xpel-endorsement span{padding-left:14px;font-size:11px}
  .hero .hero-actions{gap:12px;margin-top:28px;align-items:flex-start;justify-content:flex-start}
  .hero .hero-actions>.button{margin-inline:0;align-self:flex-start}
  .hero h1>.hero-protection-line{font-size:clamp(16.7px,5.25vw,35px)}
}
@media(min-width:701px){
  .hero h1>.hero-protection-line{font-size:clamp(23px,3.02vw,50px);letter-spacing:-.8px}
  /* Share the exact CTA columns so the XPEL lockup and divider sit over the buttons below. */
  .hero-conversion{--hero-cta-gap:32px;display:grid;grid-template-columns:max-content max-content;column-gap:var(--hero-cta-gap);row-gap:30px;align-items:center;margin-top:44px;width:max-content;max-width:100%}
  .hero .hero-conversion .xpel-endorsement,.hero .hero-conversion .hero-actions{display:contents}
  .hero-conversion .xpel-endorsement img{grid-column:1;grid-row:1;justify-self:start}
  .hero-conversion .xpel-endorsement>span{grid-column:2;grid-row:1;position:relative;border-left:0;padding-left:20px;width:100%;max-width:none;justify-self:stretch;align-self:stretch;display:flex;align-items:center}
  .hero-conversion .xpel-endorsement>span::before{content:"";position:absolute;left:calc(var(--hero-cta-gap) / -2);top:0;bottom:0;width:1px;background:#555b62}
  .hero-conversion .hero-actions>.button:first-child{grid-column:1;grid-row:2}
  .hero-conversion .hero-actions>.button:last-child{grid-column:2;grid-row:2}
  .hero .hero-conversion .hero-actions>.button{width:100%;margin:0;min-height:48px;justify-content:space-between}
  .hero .hero-conversion .hero-call{grid-column:1/-1;grid-row:3;margin-top:0;justify-self:start}
}
@media(prefers-reduced-motion:reduce){
  .hero .button.button-yellow,.hero .button.button-yellow span{transition:none}
  .hero .button.button-yellow:hover,.hero .button.button-yellow:hover span{transform:none}
}
