@font-face{font-family:Inter;src:url(/assets/fonts/Inter-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Inter;src:url(/assets/fonts/Inter-ExtraBold.woff2) format("woff2");font-style:normal;font-weight:800;font-display:swap}@font-face{font-family:Provicali;src:url(/assets/fonts/Provicali.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}:root{--orange:#f6862b;--orange-bright:#f6862b;--black:#000;--charcoal:#242424;--white:#faf9f7;--text:#292929;--content-max:1000px;--content-gutter:24px}*{box-sizing:border-box}html{scroll-behavior:smooth;min-width:315px}body{background:var(--black);min-width:315px;color:var(--white);font-synthesis:none;text-rendering:optimizelegibility;margin:0;font-family:Inter,Arial,Helvetica,sans-serif}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{border:0}a{color:inherit}img{max-width:100%;display:block}.hero{background:var(--black);grid-template-columns:48% 52%;width:100%;height:clamp(640px,52vw,760px);min-height:640px;display:grid;position:relative;overflow:hidden}html:not([data-campaign-ready]) .hero-content,html:not([data-campaign-ready]) .hero-media{visibility:hidden}.hero-content{z-index:4;padding:64px 36px 64px max(var(--content-gutter), calc((100vw - var(--content-max)) / 2));flex-direction:column;grid-area:1/1;justify-content:center;display:flex;position:relative}.hero-content h1{color:var(--white);letter-spacing:.005em;margin:0;font-family:Provicali,Inter,sans-serif;font-size:clamp(64px,5.7vw,86px);font-weight:400;line-height:.98}.hero-description{width:min(100%,400px);color:var(--orange);margin:28px 0 0;font-size:clamp(14px,1.15vw,17px);line-height:1.38}.google-rating{border-radius:6px;width:min(100%,270px);margin-top:20px;display:block}.google-rating img{width:100%;height:auto}.hero-actions{align-items:center;gap:20px;margin-top:40px;display:flex}.button{cursor:pointer;letter-spacing:0;text-align:center;white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;min-height:52px;padding:14px 24px;font-family:Provicali,Inter,sans-serif;font-size:20px;font-weight:400;line-height:1;text-decoration:none;transition:transform .18s,filter .18s,box-shadow .18s;display:inline-flex}.button:hover{filter:brightness(1.06);transform:translateY(-2px)}.button:focus-visible,.dot:focus-visible,.quote-form input:focus-visible,.quote-form select:focus-visible,.submit-button:focus-visible,.social-links a:focus-visible,.hero-text-link:focus-visible,.form-text-link:focus-visible,.google-rating:focus-visible{outline:3px solid var(--white);outline-offset:4px}.button-orange{background:var(--orange);color:var(--white)}.button-white{background:var(--white);color:var(--black)}.button-dark{background:var(--charcoal);color:var(--white)}.hero-text-link{border-radius:4px;width:236px;margin-top:24px;display:block}.hero-text-link img{width:100%;height:auto}.hero-media{z-index:1;background:#080808;grid-area:1/2;position:relative;overflow:hidden}.hero-media:before{z-index:2;content:"";pointer-events:none;background:linear-gradient(90deg,#000 0%,#000000c2 9%,#0000003d 23%,#0000 42%);position:absolute;inset:0}.hero-photo{object-fit:cover;object-position:50.5% 44.5%;width:100%;max-width:none;height:100%;animation:.9s ease-out both hero-photo-in;position:absolute;inset:0}.hero-frame{z-index:3;width:clamp(330px,29vw,420px);height:auto;animation:.65s cubic-bezier(.22,1,.36,1) .3s both hero-frame-in;position:absolute;top:50%;left:51%;transform:translate(-50%,-38%)}.hero-shade{z-index:2;pointer-events:none;background:linear-gradient(#0000,#00000057);height:18%;position:absolute;inset:auto 0 0}.section-inner{width:min(calc(100% - (var(--content-gutter) * 2)), var(--content-max));margin:0 auto}.services-section .section-inner{width:min(calc(100% - (var(--content-gutter) * 2)), 806px)}.reviews-section .section-inner{width:min(calc(100% - (var(--content-gutter) * 2)), 852px)}.section-heading h2{letter-spacing:-.025em;margin:0;font-size:clamp(34px,3.8vw,44px);font-weight:800;line-height:1.08}.section-heading p{margin:10px 0 0;font-size:clamp(17px,1.75vw,20px);font-weight:500;line-height:1.4}.services-section{background:var(--orange);color:var(--white);padding:84px 0 104px}.services-track{grid-template-columns:repeat(3,minmax(0,1fr));justify-content:center;gap:40px 46px;width:min(100%,806px);margin:52px 0 0;display:grid}.service-card{min-width:0}.carousel-clone{display:none}.service-card img{width:100%;height:auto}.carousel-dots{display:none}.reviews-section{background:var(--white);color:var(--text);padding:84px 0 100px}.dark-heading a{color:var(--orange-bright);margin-top:12px;font-size:13px;font-weight:800;text-decoration:none;display:inline-block}.dark-heading a:hover{text-decoration:underline}.reviews-track{grid-template-columns:repeat(3,minmax(0,1fr));justify-content:center;gap:36px;width:min(100%,852px);margin:58px 0 0;display:grid}.review-card img{width:100%;height:auto}.booking-section{background:var(--charcoal);color:var(--orange);padding:78px 0 84px}.booking-inner{width:min(calc(100% - (var(--content-gutter) * 2)), 874px)}.orange-heading p{color:var(--orange)}.booking-body{grid-template-columns:minmax(220px,270px) minmax(0,1fr);align-items:start;gap:42px;width:100%;margin-top:48px;display:grid}.booking-steps{flex-direction:column;gap:20px;display:flex}.booking-steps picture,.booking-steps img{width:100%;height:auto;display:block}.quote-form-wrap{min-width:0;position:relative}.form-bubble{aspect-ratio:493.812/251.351;width:100%;position:relative}.form-bubble-art{z-index:0;width:100%;height:100%;position:absolute;inset:0}.form-bubble-art img{width:100%;height:100%}.quote-form{z-index:1;flex-direction:column;display:flex;position:absolute;inset:8.5% 7% 9%}.quote-form h3{color:var(--text);letter-spacing:-.02em;margin:0 0 12px;font-size:clamp(21px,1.9vw,26px);font-weight:800;line-height:1}.form-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 9px;display:grid}.quote-form label{width:100%;min-width:0;display:block}.quote-form label span{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.quote-form input,.quote-form select{box-sizing:border-box;color:#2f2f2f;width:100%;min-width:0;max-width:100%;height:34px;box-shadow:none;background:padding-box padding-box;border:1.5px solid #303030;border-radius:999px;outline:none;padding:0 13px;font-size:12px;display:block}.quote-form select{appearance:none;padding-right:44px;border-radius:999px!important}.quote-form select::-ms-expand{display:none}.quote-form input::placeholder{color:#b9b9b9;opacity:1}.quote-form input[type=date]{appearance:none;-webkit-min-logical-width:0;color:#b9b9b9;text-align:left;inline-size:100%;min-inline-size:0;padding-right:44px;position:relative}.quote-form input[type=date]::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer;width:24px;height:24px;position:absolute;right:12px}.quote-form input[type=date]::-webkit-date-and-time-value{text-align:left;min-height:1.2em;margin:0;padding-top:2px}.date-field{position:relative}.date-field .date-placeholder{clip:auto;color:#b9b9b9;opacity:1;pointer-events:none;border:0;width:auto;height:auto;padding:0;font-size:12px;line-height:1;transition:opacity .12s;position:absolute;top:50%;left:13px;overflow:visible;transform:translateY(-50%)}.date-field input:valid+.date-placeholder{opacity:0}.quote-form input[type=date]:not(:valid){color:#0000;-webkit-text-fill-color:transparent}.quote-form input[type=date]:valid{color:#2f2f2f;-webkit-text-fill-color:#2f2f2f}.date-icon{pointer-events:none;fill:none;stroke:#303030;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px;position:absolute;top:50%;right:15px;transform:translateY(-50%)}.select-field{position:relative}.select-icon{pointer-events:none;fill:none;stroke:#303030;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px;display:block;position:absolute;top:50%;right:15px;transform:translateY(-50%)}.quote-form select:invalid{color:#b9b9b9}.quote-form option{color:#252525}.submit-button{background:var(--orange);width:100%;min-height:38px;color:var(--white);cursor:pointer;letter-spacing:0;border-radius:999px;justify-content:center;align-items:center;margin-top:9px;padding:10px 18px;font-family:Provicali,Inter,sans-serif;font-size:clamp(19px,1.75vw,22px);font-weight:400;line-height:1;transition:filter .18s,transform .18s;display:flex}.submit-button:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)}.submit-button:disabled{cursor:wait;opacity:.72}.honey{opacity:0!important;width:1px!important;height:1px!important;position:absolute!important;left:-10000px!important}.delivery-frame{clip-path:inset(50%);opacity:0;pointer-events:none;border:0;width:1px;height:1px;position:absolute}.form-status{color:#333;min-height:14px;margin:4px 4px 0;font-size:10px;line-height:1.2}.form-status.error{color:#a52c21}.form-status.sent{color:#236b38}.form-text-link{border-radius:4px;width:min(245px,46%);margin:-1px 13% 0 auto;display:block}.form-text-link img{width:100%;height:auto}.site-footer{background:var(--white);color:var(--text);padding:64px 0 30px}.footer-inner{width:min(calc(100% - (var(--content-gutter) * 2)), var(--content-max));grid-template-columns:1.2fr .85fr 1.1fr;gap:54px;margin:0 auto;display:grid}.footer-logo{width:190px;height:auto}.footer-brand p,.footer-services p,.footer-contact address{margin:20px 0 0;font-size:13px;font-style:normal;line-height:1.75}.social-links{flex-wrap:nowrap;align-items:center;gap:10px;margin-top:26px;display:flex}.social-links a{border-radius:50%;transition:transform .18s;display:block}.social-links a:hover{transform:translateY(-2px)}.social-links img{width:42px;height:42px}.footer-inner h2{color:var(--orange);margin:0;font-size:22px;font-weight:800}.footer-contact address{flex-direction:column;gap:12px;display:flex}.footer-contact address a{text-decoration:none}.footer-contact address a:hover{text-decoration:underline}.footer-actions{flex-direction:column;align-items:flex-start;gap:12px;margin-top:26px;display:flex}.footer-actions .button{min-width:190px}@media (width>=601px){.footer-brand,.footer-contact{flex-direction:column;display:flex}.social-links,.footer-actions{margin-top:auto;padding-top:26px}.social-links img,.footer-actions .button{height:36.252px}.social-links img{width:36.252px}.footer-actions .button{min-height:36.252px;padding:0 18px;font-size:18px}}.footer-bottom{width:min(calc(100% - (var(--content-gutter) * 2)), var(--content-max));color:#737373;border-top:1px solid #ccc;justify-content:center;align-items:flex-start;gap:8px;margin:52px auto 0;padding-top:24px;font-size:11px;line-height:1.5;display:flex}.footer-bottom p{margin:0}.footer-bottom details{position:relative}.footer-bottom summary{cursor:pointer}.footer-bottom details p{background:var(--white);color:#444;border:1px solid #ddd;border-radius:14px;width:320px;padding:16px;position:absolute;bottom:28px;right:0;box-shadow:0 12px 30px #0000001f}.reveal{opacity:0;transition:opacity .62s,transform .62s cubic-bezier(.22,1,.36,1);transform:translateY(22px)}.reveal.is-visible{opacity:1;transform:translateY(0)}@keyframes hero-photo-in{0%{opacity:0;filter:brightness(.55);transform:scale(1.035)}to{opacity:1;filter:brightness();transform:scale(1)}}@keyframes hero-photo-mobile-in{0%{opacity:0;filter:brightness(.55);transform:scale(1.085)}to{opacity:1;filter:brightness();transform:scale(1.045)}}@keyframes hero-frame-in{0%{opacity:0;transform:translate(-50%,-38%)scale(.88)}to{opacity:1;transform:translate(-50%,-38%)scale(1)}}@media (width<=1180px) and (width>=900px){:root{--content-gutter:32px}.hero{grid-template-columns:47% 53%}.hero-content{padding-left:max(var(--content-gutter), calc((100vw - var(--content-max)) / 2))}.hero-content h1{font-size:clamp(63px,7vw,76px)}.hero-frame{width:clamp(320px,36vw,385px);left:54%}}@media (width<=899px){.hero{flex-direction:column;height:auto;min-height:0;display:flex}.hero-media{flex:none;order:1;width:100%;height:clamp(420px,70vw,580px)}.hero-media:before{background:linear-gradient(#0000 58%,#0000003d 78%,#000 100%)}.hero-frame{width:clamp(330px,54vw,430px);top:49%;left:50%;transform:translate(-50%,-38%)}.hero-content{order:2;width:min(100%,484px);margin:0 auto;padding:32px 42px 76px}.hero-content h1{font-size:clamp(58px,10vw,78px);line-height:1.02}.hero-description{max-width:460px;font-size:16px}.services-section{padding:72px 0 90px}.services-section .section-heading,.services-viewport{width:min(100%,568px);margin-inline:auto}.services-track{grid-template-columns:repeat(2,minmax(0,250px));gap:48px 68px;width:min(100%,568px)}.reviews-section .section-heading,.reviews-viewport{width:min(100%,716px);margin-inline:auto}.reviews-track{grid-template-columns:repeat(3,minmax(0,220px));gap:28px;width:min(100%,716px)}.booking-body{display:block}.booking-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.quote-form-wrap{width:min(100%,680px);margin:54px auto 0}.footer-inner{gap:32px}}@media (width<=720px) and (width>=601px){.services-section .section-heading,.services-viewport{width:min(100%,496px)}.services-track{grid-template-columns:repeat(2,minmax(0,225px));gap:42px 46px;width:min(100%,496px)}.reviews-section .section-heading,.reviews-viewport{width:min(100%,606px)}.reviews-track{grid-template-columns:repeat(3,minmax(0,190px));gap:18px;width:min(100%,606px)}.footer-inner{grid-template-columns:1.1fr .9fr 1fr;gap:24px}.footer-logo{width:165px}}@media (width<=618px){.hero-media{height:clamp(320px,73vw,405px)}.hero-photo{object-position:50.5% 44.5%;animation-name:hero-photo-mobile-in}.hero-frame{width:clamp(240px,59vw,320px)}.hero-content{width:min(100%,500px);padding:30px clamp(30px,12vw,62px) 54px}.hero-content h1{font-size:clamp(49px,13vw,64px);line-height:1.02}.hero-description{margin-top:26px;font-size:14px;line-height:1.42}.google-rating{width:min(100%,265px);margin-top:18px}.hero-actions{flex-direction:column;gap:15px;width:100%;margin-top:40px}.hero-actions .button{width:100%;min-height:58px;font-size:22px}.hero-text-link{width:min(100%,250px);margin:24px auto 0}.section-inner,.booking-inner{width:min(100% - 56px,468px)}.section-heading h2{font-size:clamp(34px,9vw,46px);line-height:1.08}.section-heading p{margin-top:16px;font-size:clamp(18px,4.8vw,24px);line-height:1.35}.services-section{padding:56px 0 70px}.services-viewport,.reviews-viewport{touch-action:pan-y;-webkit-user-select:none;user-select:none;overflow:hidden}.services-track{width:100%;transform:translateX(calc(var(--service-position) * -100%));justify-content:flex-start;gap:0;margin-top:48px;transition:transform .5s cubic-bezier(.22,1,.36,1);display:flex}.service-card{justify-content:center;min-width:100%;display:flex}.service-card img{width:min(100%,430px)}.services-track.no-transition,.reviews-track.no-transition{transition:none}.carousel-dots{justify-content:center;align-items:center;gap:14px;margin-top:20px;display:flex}.dot{cursor:pointer;background:#ffffff75;border-radius:50%;flex:none;width:16px;height:16px;padding:0;transition:background .18s,transform .18s}.dot.is-active{background:var(--white);transform:scale(1.07)}.reviews-section{padding:64px 0 74px}.dark-heading a{margin-top:18px;font-size:14px}.reviews-track{width:100%;transform:translateX(calc(var(--review-position) * -100%));justify-content:flex-start;gap:0;margin-top:48px;transition:transform .5s cubic-bezier(.22,1,.36,1);display:flex}.review-card{justify-content:center;min-width:100%;display:flex}.review-card img{width:min(100%,420px)}.reviews-section .dot{background:#f6862b6b}.reviews-section .dot.is-active{background:var(--orange)}.booking-section{padding:64px 0 76px}.booking-steps{flex-direction:column;gap:30px;width:100%;display:flex}.booking-steps picture{width:100%}.booking-body{margin-top:52px}.quote-form-wrap{width:100%;margin-top:74px}.form-bubble{aspect-ratio:309.536/473.565}.quote-form{inset:9% 11.5%}.quote-form h3{white-space:nowrap;margin-bottom:22px;font-size:clamp(23px,6.2vw,30px)}.form-fields{flex-direction:column;gap:11px;display:flex}.quote-form input,.quote-form select{height:clamp(44px,10.5vw,50px);padding:0 15px;font-size:15px}.quote-form input[type=date]::-webkit-date-and-time-value{padding-top:5px}.date-field .date-placeholder{font-size:15px;left:15px}.submit-button{min-height:clamp(50px,11vw,56px);margin-top:16px;font-size:clamp(21px,5.4vw,26px)}.form-status{margin-top:9px;font-size:11px}.form-text-link{z-index:2;width:58.9%;margin:0;position:absolute;bottom:2.2%;left:5.4%;transform:translateY(2px)}.site-footer{padding-top:62px}.footer-inner{flex-direction:column;gap:46px;width:min(100% - 56px,468px);display:flex}.footer-logo{width:min(100%,300px)}.footer-brand p,.footer-services p,.footer-contact address{font-size:18px;line-height:1.7}.social-links{justify-content:flex-start;gap:clamp(7px,2.25vw,11px);width:fit-content;max-width:100%;margin-top:30px}.social-links img{width:clamp(48px,10.7vw,52px);height:clamp(48px,10.7vw,52px)}.footer-inner h2{font-size:31px}.footer-contact{display:contents}.footer-contact address{order:2;margin-top:-36px}.footer-services{order:3}.footer-services p{margin-top:12px}.footer-actions{order:4;align-items:stretch;gap:16px;width:100%;margin-top:0}.footer-actions .button{width:100%;min-height:60px;font-size:22px}.footer-bottom{text-align:center;flex-wrap:wrap;width:min(100% - 56px,468px);margin-top:52px}.footer-bottom details p{width:min(320px,80vw);right:50%;transform:translate(50%)}}@media (width<=380px){.hero-media{height:285px}.hero-frame{width:230px}.hero-content{padding-inline:28px}.hero-content h1{font-size:47px}.section-inner,.booking-inner{width:calc(100% - 36px)}.section-heading h2{font-size:31px}.section-heading p{font-size:17px}.quote-form h3{margin-bottom:12px;font-size:22px}.form-fields{gap:7px}.quote-form{inset:7.5% 11.5% 8%}.quote-form input,.quote-form select{height:38px;font-size:13px}.submit-button{min-height:44px;margin-top:8px;font-size:20px}.form-status{font-size:9px}.footer-inner,.footer-bottom{width:calc(100% - 36px)}.footer-brand p,.footer-services p,.footer-contact address{font-size:16px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.reveal{opacity:1;transform:none}}
/* Every campaign uses the same hero layout. Only its image and headline change. */
#hero-title span{display:block;white-space:nowrap}




/* View keeps stronger contrast on desktop. On mobile its contrast comes from
   the bottom, while every service SVG keeps its original artboard and ratio. */
.hero-media--view:before{background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.96) 13%,rgba(0,0,0,.66) 30%,rgba(0,0,0,.24) 47%,transparent 56%);}
@media (width<=899px){
  .hero-media--view:before{background:linear-gradient(to bottom,transparent 56%,rgba(0,0,0,.24) 70%,rgba(0,0,0,.72) 86%,#000 100%);}
}

/* Mobile hero social proof row: exact same outer width as the text-message artwork,
   but with larger icons and tighter gaps. */
.hero-social-links{display:none}
@media (width<=618px){
  .hero-content{
    --hero-message-row-width:min(100%,250px);
    --hero-social-icon-size:45px;
    --hero-social-gap:calc((var(--hero-message-row-width) - (var(--hero-social-icon-size) * 5)) / 4);
  }
  .hero-text-link{
    width:var(--hero-message-row-width);
    margin:24px auto 0;
  }
  .social-links.hero-social-links{
    display:flex !important;
    width:var(--hero-message-row-width) !important;
    max-width:var(--hero-message-row-width) !important;
    margin:28px auto 0 !important;
    padding:0 !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:var(--hero-social-gap) !important;
  }
  .social-links.hero-social-links a{
    flex:0 0 var(--hero-social-icon-size) !important;
    width:var(--hero-social-icon-size) !important;
    height:var(--hero-social-icon-size) !important;
    margin:0 !important;
  }
  .social-links.hero-social-links img{
    display:block !important;
    width:var(--hero-social-icon-size) !important;
    height:var(--hero-social-icon-size) !important;
    max-width:none !important;
  }
}


/* Final campaign overrides */
/* Campaign hero: keep the text area clean and let the photo sit slightly
   farther right, matching the approved campaign layout. */
@media (min-width:900px){
  html[data-campaign="school"] .hero{grid-template-columns:50% 50%}
  html[data-campaign="school"] .hero-media{margin-left:0;width:100%}
  html[data-campaign="school"] .hero-media:before{background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.98) 5%,rgba(0,0,0,.82) 13%,rgba(0,0,0,.58) 22%,rgba(0,0,0,.34) 32%,rgba(0,0,0,.14) 43%,rgba(0,0,0,.03) 55%,transparent 64%)}
  html[data-campaign="school"] .hero-photo{left:24px;right:auto;width:calc(100% - 24px)}
}

/* Portrait tablet initial pass: image-to-content hero and denser service grid.
   Scoped to the full 601–899px tablet range to avoid the broken mid breakpoint. */
@media (min-width:601px) and (max-width:899px){
  html[data-campaign="school"] .hero{
    display:flex;
    flex-direction:column;
    position:relative;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-media{
    order:1;
    position:relative;
    z-index:1;
    height:clamp(560px,86vw,680px);
    min-height:560px;
  }
  html[data-campaign="school"] .hero-media:before{
    z-index:2;
    background:linear-gradient(
      to bottom,
      transparent 38%,
      rgba(0,0,0,.04) 48%,
      rgba(0,0,0,.22) 60%,
      rgba(0,0,0,.58) 75%,
      rgba(0,0,0,.88) 90%,
      #000 100%
    );
  }
  html[data-campaign="school"] .hero-shade{display:none}
  html[data-campaign="school"] .hero-picture,
  html[data-campaign="school"] .hero-picture .hero-photo{
    width:100%;
    height:100%;
  }
  html[data-campaign="school"] .hero-picture .hero-photo{
    object-fit:cover;
    object-position:50% 0%;
    transform:scale(1.02);
    transform-origin:50% 0%;
  }
  html[data-campaign="school"] .hero-content{
    order:2;
    position:relative;
    z-index:4;
    width:min(calc(100% - 48px),560px);
    max-width:560px;
    margin:-190px auto 0;
    padding:150px 0 72px;
    background:transparent;
    align-items:flex-start;
  }
  html[data-campaign="school"] .hero-content > *{
    width:100%;
    max-width:none;
  }
  html[data-campaign="school"] .hero-content h1{
    text-align:left;
  }

  html[data-campaign="school"] .services-section{
    padding:56px 0 64px;
  }
  html[data-campaign="school"] .services-section .section-inner{
    width:min(calc(100% - 32px),744px);
    max-width:744px;
    padding-left:0;
    padding-right:0;
  }
  html[data-campaign="school"] .services-section .section-heading,
  html[data-campaign="school"] .services-section .services-viewport{
    width:100%;
    max-width:none;
  }
  html[data-campaign="school"] .services-section .section-heading h2{
    font-size:clamp(30px,4.6vw,38px);
    line-height:1.1;
    white-space:nowrap;
  }
  html[data-campaign="school"] .services-track{
    width:calc(100% - 24px);
    max-width:none;
    margin-left:auto;
    margin-right:auto;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 24px;
  }
  html[data-campaign="school"] .service-card{
    width:100%;
  }
}

html[data-campaign="school"] .hero-picture{display:block;position:absolute;inset:0}

@media (max-width:899px){
  html[data-campaign="school"] .hero-picture{width:100%;height:100%}
  html[data-campaign="school"] .hero-picture .hero-photo{object-position:50% 50%}
}

@media (min-width:900px){
  html[data-campaign="school"] .services-track{gap:20px 23px}
}

/* Quote form reference geometry. The two reference frames are scaled from
   their own container width, so the proportions stay identical at every
   supported viewport size. */
html[data-campaign="school"] .form-bubble{container-type:inline-size}
html[data-campaign="school"] .quote-form-wrap{container-type:inline-size}

@media (min-width:601px){
  html[data-campaign="school"] .form-bubble{aspect-ratio:1841/936}
  html[data-campaign="school"] .quote-form{
    inset:11.45% 5.3% 12% 5.85%;
    width:auto;
  }
  html[data-campaign="school"] .quote-form h3{
    width:calc((100% - 1.63cqw)/2);
    margin:0 0 2.25cqw;
    font-size:4.5cqw;
    line-height:1;
    white-space:nowrap;
  }
  html[data-campaign="school"] .form-fields{gap:1.58cqw 1.63cqw}
  html[data-campaign="school"] .quote-form input,
  html[data-campaign="school"] .quote-form select{
    height:5.1cqw;
    color:#272727;
    border:1.5px solid #272727;
    padding-left:1.65cqw;
    padding-right:1.65cqw;
    font-size:1.7cqw;
  }
  html[data-campaign="school"] .quote-form select{padding-right:5cqw}
  html[data-campaign="school"] .quote-form input[type="date"]{padding-right:5cqw}
  html[data-campaign="school"] .date-icon,
  html[data-campaign="school"] .select-icon{
    width:2.45cqw;
    height:2.45cqw;
    right:1.85cqw;
  }
  html[data-campaign="school"] .promo-code-field{align-self:center}
  html[data-campaign="school"] .promo-code-field input,
  html[data-campaign="school"] .form-fields .submit-button{
    height:7.8cqw;
    min-height:7.8cqw;
  }
  html[data-campaign="school"] .promo-code-field input{padding-left:2.05cqw;padding-right:2.05cqw}
  html[data-campaign="school"] .form-fields .submit-button{
    align-self:center;
    margin-top:0;
    padding-left:1cqw;
    padding-right:1cqw;
    font-size:3.1cqw;
    letter-spacing:0;
    white-space:nowrap;
  }
  html[data-campaign="school"] .form-text-link{
    width:35.2cqw;
    margin:1cqw 13% 0 auto;
  }
}

@media (max-width:618px){
  html[data-campaign="school"] .booking-inner{width:min(calc(100% - 56px),354px)}
  html[data-campaign="school"] .quote-form-wrap{width:100%;margin-top:74px}
  html[data-campaign="school"] .form-bubble{aspect-ratio:309.536/473.565}
  html[data-campaign="school"] .quote-form{
    inset:6.1% 8.4% 10.9% 8.4%;
    width:auto;
  }
  html[data-campaign="school"] .quote-form h3{
    width:100%;
    margin:0 0 5.1cqw;
    font-size:6.5cqw;
    line-height:1;
    white-space:nowrap;
  }
  html[data-campaign="school"] .form-fields{gap:3.3cqw}
  html[data-campaign="school"] .quote-form input,
  html[data-campaign="school"] .quote-form select{
    height:9.75cqw;
    color:#272727;
    border:1.5px solid #272727;
    padding-left:3.3cqw;
    padding-right:3.3cqw;
    font-size:3.5cqw;
  }
  html[data-campaign="school"] .quote-form select{padding-right:8cqw}
  html[data-campaign="school"] .quote-form input[type="date"]{padding-right:8cqw}
  html[data-campaign="school"] .date-field .date-placeholder{
    left:3.3cqw;
    font-size:3.5cqw;
  }
  html[data-campaign="school"] .date-icon,
  html[data-campaign="school"] .select-icon{
    width:4.7cqw;
    height:4.7cqw;
    right:3.7cqw;
  }
  html[data-campaign="school"] .promo-code-field input{height:10.5cqw;border-color:var(--orange);padding-left:3.3cqw;padding-right:3.3cqw}
  html[data-campaign="school"] .promo-code-field input::placeholder{color:var(--orange);opacity:1}
  html[data-campaign="school"] .form-fields .submit-button{
    min-height:12.6cqw;
    margin-top:3cqw;
    padding-left:1.5cqw;
    padding-right:1.5cqw;
    font-size:5.2cqw;
    letter-spacing:.025em;
  }
  html[data-campaign="school"] .form-text-link{
    position:absolute;
    left:8.6%;
    bottom:1.7%;
    width:58.9%;
    margin:0;
    transform:none;
  }
}

/* Keep the approved text treatment identical in desktop and mobile. */
html[data-campaign="school"] .quote-form input::placeholder{
  color:#b9b9b9;
  opacity:1;
}
html[data-campaign="school"] .quote-form select:invalid{
  color:#b9b9b9;
  opacity:1;
}
html[data-campaign="school"] .promo-code-field input{
  border-color:var(--orange);
  color:var(--orange);
}
html[data-campaign="school"] .promo-code-field input::placeholder{
  color:var(--orange);
  opacity:1;
}
html[data-campaign="school"] .form-status.idle{display:none}

/* Safari and Chrome center the native date value consistently. */
html[data-campaign="school"] .quote-form input[type="date"]{
  -webkit-appearance:none;
  appearance:none;
  display:flex;
  align-items:center;
  line-height:normal;
  padding-top:0;
  padding-bottom:0;
}
html[data-campaign="school"] .quote-form input[type="date"]::-webkit-datetime-edit,
html[data-campaign="school"] .quote-form input[type="date"]::-webkit-datetime-edit-fields-wrapper,
html[data-campaign="school"] .quote-form input[type="date"]::-webkit-date-and-time-value{
  display:flex;
  align-items:center;
  width:100%;
  height:100%;
  min-height:0;
  line-height:normal;
  margin:0;
  padding-top:0;
  padding-bottom:0;
}

/* The smallest phones use the same reference frame, only scaled down. */
@media (max-width:380px){
  html[data-campaign="school"] .booking-inner{width:calc(100% - 56px)}
  html[data-campaign="school"] .form-bubble{aspect-ratio:309.536/473.565}
  html[data-campaign="school"] .quote-form{inset:6.1% 8.4% 10.9% 8.4%;width:auto}
  html[data-campaign="school"] .quote-form h3{margin:0 0 5.1cqw;font-size:6.5cqw}
  html[data-campaign="school"] .form-fields{gap:3.3cqw}
  html[data-campaign="school"] .quote-form input,
  html[data-campaign="school"] .quote-form select{height:9.75cqw;font-size:3.5cqw}
  html[data-campaign="school"] .promo-code-field input{height:10.5cqw}
  html[data-campaign="school"] .form-fields .submit-button{min-height:12.6cqw;margin-top:3cqw;font-size:5.2cqw}
}

/* School hero and page alignment reference. The face is the focal point.
   A is the desktop and landscape source. B is the portrait source. */
html[data-campaign="school"]{
  --school-content-max:874px;
  --school-desktop-focus-y:22%;
}

/* 1. Keep the main content sections on one shared left and right axis. */
@media (min-width:601px){
  html[data-campaign="school"] .hero-content,
  html[data-campaign="school"] .services-section .section-inner,
  html[data-campaign="school"] .reviews-section .section-inner,
  html[data-campaign="school"] .booking-inner{
    width:min(calc(100% - (var(--content-gutter) * 2)),var(--school-content-max));
  }
  html[data-campaign="school"] .hero-content{
    margin:0 auto;
    padding-left:0;
    padding-right:0;
  }
  html[data-campaign="school"] .services-section .section-inner,
  html[data-campaign="school"] .reviews-section .section-inner{
    max-width:var(--school-content-max);
  }
}

/* 1b. One shared content axis for the non-hero sections.
   Section backgrounds stay full-bleed; only their inner content is aligned. */
@media (min-width:601px){
  html[data-campaign="school"] .services-section .section-inner,
  html[data-campaign="school"] .reviews-section .section-inner,
  html[data-campaign="school"] .booking-inner,
  html[data-campaign="school"] .footer-inner,
  html[data-campaign="school"] .footer-bottom{
    width:min(calc(100% - (var(--content-gutter) * 2)),var(--school-content-max));
    max-width:var(--school-content-max);
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .services-track,
  html[data-campaign="school"] .reviews-track{
    width:100%;
    max-width:none;
  }
}

/* 2. Let the desktop hero image stay attached to the viewport right edge. */
@media (min-width:900px){
  html[data-campaign="school"] .hero{
    display:block;
    height:clamp(640px,52vw,760px);
    min-height:640px;
    position:relative;
  }
  html[data-campaign="school"] .hero-content{
    height:100%;
    position:relative;
  }
  html[data-campaign="school"] .hero-media{
    position:absolute;
    inset:0;
    width:100%;
    margin:0;
  }
  html[data-campaign="school"] .hero-picture{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
  }

  /* 3. Follow the face coordinate, not the geometric center of the photo. */
  html[data-campaign="school"] .hero-photo{
    inset:0;
    left:0;
    right:0;
    width:100%;
    max-width:none;
    height:100%;
    object-position:clamp(62%,calc(50% + 14vw),72%) var(--school-desktop-focus-y);
    transform:none;
  }
  html[data-campaign="school"] .hero-media:before{
    background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.98) 7%,rgba(0,0,0,.84) 18%,rgba(0,0,0,.58) 30%,rgba(0,0,0,.28) 43%,rgba(0,0,0,.08) 56%,transparent 67%);
  }
  html[data-campaign="school"] .hero-shade{display:none}
}

/* 4. Portrait hero uses B and preserves the top of the head. */
@media (max-width:899px){
  html[data-campaign="school"] .hero-media{
    height:clamp(430px,110vw,680px);
  }
  html[data-campaign="school"] .hero-picture,
  html[data-campaign="school"] .hero-picture .hero-photo{
    width:100%;
    height:100%;
  }

  /* 5. Keep the face at the top reference point and crop the lower body. */
  html[data-campaign="school"] .hero-picture .hero-photo{
    object-position:50% 0%;
    object-fit:cover;
    transform:scale(1.045);
    transform-origin:50% 0%;
  }

  /* 6. Use one soft bottom fade instead of a separate black image layer. */
  html[data-campaign="school"] .hero-media:before{
    background:linear-gradient(to bottom,transparent 44%,rgba(0,0,0,.08) 57%,rgba(0,0,0,.42) 72%,rgba(0,0,0,.82) 88%,#000 100%);
  }
  html[data-campaign="school"] .hero-shade{display:none}
  html[data-campaign="school"] .hero-content{
    z-index:4;
    margin-top:-58px;
    position:relative;
    background:#000;
  }
}

/* 7. At the narrowest widths the image keeps its scale, so the sides crop
   while the head remains visible. */
@media (max-width:618px){
  html[data-campaign="school"] .hero-picture .hero-photo{
    transform:scale(1.1);
    transform-origin:50% 0%;
  }
  html[data-campaign="school"] .hero-content{margin-top:-72px}
}

/* Desktop A: keep the rectangular source anchored to the right edge.
   When the viewport narrows, only the left side moves under the fade; the
   subject stays at the source's right-side focal coordinate. */
@media (min-width:900px){
  html[data-campaign="school"] .hero-media{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    margin:0;
    background:#000;
    overflow:hidden;
  }
  html[data-campaign="school"] .hero-picture{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:auto;
    width:clamp(1044px,84.96vw,1241px);
    height:100%;
    display:block;
    z-index:1;
    overflow:hidden;
  }
  html[data-campaign="school"] .hero-picture .hero-photo{
    position:relative;
    inset:auto;
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:50% 50%;
    transform:none;
  }
  html[data-campaign="school"] .hero-media:before{
    z-index:2;
    background:linear-gradient(
      90deg,
      #000 0%,
      #000 20%,
      rgba(0,0,0,.96) 28%,
      rgba(0,0,0,.76) 38%,
      rgba(0,0,0,.46) 49%,
      rgba(0,0,0,.18) 61%,
      rgba(0,0,0,.04) 69%,
      transparent 75%
    );
  }
}

/* Final tablet hero reference: the full 601–899px range shares one image scale.
   Tablet shows the full portrait width. Mobile keeps that scale and crops
   only the left and right sides. The fade is vertical and continuous. */
@media (min-width:601px) and (max-width:899px){
  html[data-campaign="school"] .hero{
    display:flex;
    flex-direction:column;
    min-height:0;
    height:auto;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-media{
    order:1;
    position:relative;
    width:100%;
    height:640px;
    min-height:0;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-picture{
    position:absolute;
    top:0;
    left:0;
    right:auto;
    bottom:auto;
    width:100%;
    height:auto;
    aspect-ratio:2048 / 1994;
    overflow:visible;
    transform:none;
  }
  html[data-campaign="school"] .hero-picture .hero-photo{
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:50% 0;
    transform:none;
    animation:none;
  }
  html[data-campaign="school"] .hero-media:before{
    z-index:2;
    background:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 43%,
      rgba(0,0,0,.04) 51%,
      rgba(0,0,0,.16) 60%,
      rgba(0,0,0,.40) 70%,
      rgba(0,0,0,.72) 81%,
      rgba(0,0,0,.94) 92%,
      #000 100%
    );
  }
  html[data-campaign="school"] .hero-shade{display:none}
  html[data-campaign="school"] .hero-content{
    order:2;
    z-index:4;
    position:relative;
    width:min(calc(100% - 64px),470px);
    max-width:470px;
    margin:-220px auto 0;
    padding:92px 0 68px;
    background:transparent;
    align-items:flex-start;
  }
  html[data-campaign="school"] .hero-content > *{
    width:100%;
    max-width:none;
  }
  html[data-campaign="school"] .hero-content h1{
    text-align:left;
  }
}

@media (max-width:618px){
  html[data-campaign="school"] .hero{
    display:flex;
    flex-direction:column;
    min-height:0;
    height:auto;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-media{
    order:1;
    position:relative;
    width:100%;
    height:640px;
    min-height:0;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-picture{
    position:absolute;
    top:0;
    left:50%;
    right:auto;
    bottom:auto;
    width:780px;
    height:760px;
    overflow:visible;
    transform:translateX(-50%);
  }
  html[data-campaign="school"] .hero-picture .hero-photo{
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:50% 0;
    transform:none;
    animation:none;
  }
  html[data-campaign="school"] .hero-media:before{
    z-index:2;
    background:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 43%,
      rgba(0,0,0,.04) 51%,
      rgba(0,0,0,.16) 60%,
      rgba(0,0,0,.40) 70%,
      rgba(0,0,0,.72) 81%,
      rgba(0,0,0,.94) 92%,
      #000 100%
    );
  }
  html[data-campaign="school"] .hero-shade{display:none}
  html[data-campaign="school"] .hero-content{
    order:2;
    z-index:4;
    position:relative;
    width:min(calc(100% - 112px),360px);
    max-width:360px;
    margin:-220px auto 0;
    padding:92px 0 58px;
    background:transparent;
    align-items:flex-start;
  }
  html[data-campaign="school"] .hero-content > *{
    width:100%;
    max-width:none;
  }
  html[data-campaign="school"] .hero-content h1{
    text-align:left;
  }
}

/* 900 to 916 px refinement: compact, centered landscape tablet layout.
   This range is isolated so 899 and below and 917 and above stay unchanged. */


/* V6 final tablet refinement, 619px through 914px.
   Uses classic media query syntax for Safari compatibility. */
@media screen and (min-width:619px) and (max-width:914px){
  /* Hero proof row: keep headline sizing untouched, align supporting rows to
     the headline left edge, and make both CTA buttons equal the rating width. */
  html[data-campaign="school"] .hero-content{
    --school-hero-proof-width:min(100%,470px);
  }
  html[data-campaign="school"] .google-rating{
    display:block;
    width:var(--school-hero-proof-width);
    max-width:none;
    margin-left:-5px;
    margin-right:auto;
  }
  html[data-campaign="school"] .google-rating img{
    width:100%;
    height:auto;
  }
  html[data-campaign="school"] .hero-actions{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
    gap:18px;
    width:var(--school-hero-proof-width);
    max-width:none;
    margin-left:0;
    margin-right:auto;
  }
  html[data-campaign="school"] .hero-actions .button{
    width:100%;
    min-width:0;
    padding-left:18px;
    padding-right:18px;
  }
  html[data-campaign="school"] .hero-text-link{
    display:block;
    width:313px;
    max-width:66.667%;
    margin-left:0;
    margin-right:auto;
  }

  /* Services: shrink the six SVG cards to about half the former visual size.
     Keep a review-card-like gap, with slightly more air between service cards. */
  html[data-campaign="school"] .services-section .section-inner{
    width:100%;
    max-width:none;
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    padding-right:0;
  }
  html[data-campaign="school"] .services-section .services-viewport{
    width:460px;
    max-width:calc(100% - 96px);
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .services-track{
    display:grid;
    width:100%;
    max-width:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:60px;
    row-gap:56px;
    margin:48px auto 0;
  }
  html[data-campaign="school"] .service-card{
    width:100%;
    min-width:0;
  }
  html[data-campaign="school"] .service-card img{
    display:block;
    width:100%;
    max-width:none;
    height:auto;
  }
  html[data-campaign="school"] .services-section .section-heading{
    width:calc(100% - ((100% - 460px) / 2));
    max-width:none;
    margin-left:calc((100% - 460px) / 2);
    margin-right:0;
  }
  html[data-campaign="school"] .services-section .section-heading h2{
    font-size:clamp(30px,4vw,36px);
    white-space:nowrap;
  }
}


/* V7 reference rebuild, 619px through 914px.
   This block intentionally owns the entire tablet layout in this range. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"]{
    --ref-content: min(calc(100% - 28%), 650px);
    --ref-services: min(calc(100% - 35%), 590px);
    --ref-form: min(calc(100% - 35%), 590px);
    --ref-proof: min(100%, 420px);
  }

  /* HERO: retain approved portrait image/fade. Build the supporting rows from
     the same left edge as the headline. Buttons are deliberately thicker. */
  html[data-campaign="school"] .hero-content{
    width:min(calc(100% - 64px),470px);
    max-width:470px;
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .google-rating{
    width:var(--ref-proof);
    max-width:none;
    margin-left:0;
    margin-right:auto;
  }
  html[data-campaign="school"] .hero-actions{
    display:grid;
    grid-template-columns:1.58fr 1fr;
    gap:16px;
    width:var(--ref-proof);
    max-width:none;
    margin:32px 0 0;
  }
  html[data-campaign="school"] .hero-actions .button{
    width:100%;
    min-width:0;
    min-height:58px;
    padding:16px 18px;
    font-size:20px;
  }
  html[data-campaign="school"] .hero-text-link{
    width:min(100%,360px);
    max-width:none;
    margin:22px 0 0;
  }

  /* SERVICES: reference uses a centered group, but its text is left aligned.
     Two small columns with visible outer breathing room and large row gaps. */
  html[data-campaign="school"] .services-section{
    padding:66px 0 66px;
  }
  html[data-campaign="school"] .services-section .section-inner{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }
  html[data-campaign="school"] .services-section .section-heading{
    width:var(--ref-content);
    max-width:none;
    margin:0 auto;
  }
  html[data-campaign="school"] .services-section .section-heading h2{
    font-size:clamp(30px,4.2vw,38px);
    line-height:1.08;
    white-space:nowrap;
  }
  html[data-campaign="school"] .services-section .section-heading p{
    margin-top:10px;
    font-size:clamp(15px,2vw,18px);
  }
  html[data-campaign="school"] .services-section .services-viewport{
    width:var(--ref-services);
    max-width:none;
    margin:52px auto 0;
    overflow:visible;
  }
  html[data-campaign="school"] .services-track{
    display:grid;
    width:100%;
    max-width:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:42px;
    row-gap:58px;
    margin:0;
    transform:none !important;
  }
  html[data-campaign="school"] .service-card{
    width:100%;
    min-width:0;
    display:block;
  }
  html[data-campaign="school"] .service-card img{
    display:block;
    width:100%;
    max-width:none;
    height:auto;
  }
  html[data-campaign="school"] .services-section .carousel-dots{
    display:none;
  }

  /* REVIEWS: reference is a left text block plus one active slider card on the
     right. The existing mobile carousel is reused instead of inventing markup. */
  html[data-campaign="school"] .reviews-section{
    padding:66px 0 58px;
  }
  html[data-campaign="school"] .reviews-section .section-inner{
    width:var(--ref-content);
    max-width:none;
    margin:0 auto;
    display:grid;
    grid-template-columns:minmax(0,1.12fr) minmax(225px,.88fr);
    column-gap:24px;
    align-items:center;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    width:100%;
    max-width:none;
    margin:0;
  }
  html[data-campaign="school"] .reviews-section .section-heading h2{
    font-size:clamp(28px,4vw,36px);
    line-height:1.08;
    white-space:nowrap;
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    max-width:330px;
    margin-top:10px;
    font-size:clamp(15px,1.9vw,17px);
    line-height:1.35;
  }
  html[data-campaign="school"] .reviews-section .dark-heading a{
    margin-top:12px;
    font-size:12px;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    width:min(100%,300px);
    max-width:none;
    margin:0 0 0 auto;
    overflow:hidden;
    touch-action:pan-y;
    user-select:none;
  }
  html[data-campaign="school"] .reviews-track{
    display:flex;
    justify-content:flex-start;
    width:100%;
    max-width:none;
    gap:0;
    margin:0;
    transform:translateX(calc(var(--review-position) * -100%));
    transition:transform .5s cubic-bezier(.22,1,.36,1);
  }
  html[data-campaign="school"] .review-card{
    display:flex;
    justify-content:center;
    min-width:100%;
    width:100%;
  }
  html[data-campaign="school"] .review-card img{
    width:100%;
    max-width:none;
    height:auto;
  }
  html[data-campaign="school"] .reviews-section .carousel-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin-top:12px;
  }
  html[data-campaign="school"] .reviews-section .dot{
    width:9px;
    height:9px;
    background:#f6862b6b;
  }
  html[data-campaign="school"] .reviews-section .dot.is-active{
    background:var(--orange);
  }

  /* BOOKING: heading, three step cards and form are one centered reference
     system. Horizontal step art is used throughout this breakpoint. */
  html[data-campaign="school"] .booking-section{
    padding:62px 0 66px;
  }
  html[data-campaign="school"] .booking-inner{
    width:var(--ref-content);
    max-width:none;
    margin:0 auto;
  }
  html[data-campaign="school"] .booking-section .section-heading{
    width:100%;
    max-width:none;
    margin:0;
  }
  html[data-campaign="school"] .booking-section .section-heading h2{
    font-size:clamp(28px,4vw,34px);
  }
  html[data-campaign="school"] .booking-section .section-heading p{
    margin-top:10px;
    font-size:clamp(15px,1.9vw,17px);
  }
  html[data-campaign="school"] .booking-body{
    display:block;
    width:100%;
    margin-top:42px;
  }
  html[data-campaign="school"] .booking-steps{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    width:100%;
    max-width:none;
    margin:0;
  }
  html[data-campaign="school"] .booking-steps picture,
  html[data-campaign="school"] .booking-steps img{
    display:block;
    width:100%;
    height:auto;
  }
  html[data-campaign="school"] .quote-form-wrap{
    width:var(--ref-form);
    max-width:none;
    margin:44px auto 0;
  }
  html[data-campaign="school"] .promo-code-field{
    display:none;
  }
  html[data-campaign="school"] .form-fields .submit-button{
    grid-column:1 / -1;
    width:100%;
    min-height:6.7cqw;
    height:6.7cqw;
    margin-top:2px;
    font-size:2.65cqw;
  }
  html[data-campaign="school"] .form-text-link{
    width:30cqw;
    margin:.7cqw 10% 0 auto;
  }

  /* FOOTER: exactly the same three-column axis as the booking steps. */
  html[data-campaign="school"] .site-footer{
    padding:54px 0 24px;
  }
  html[data-campaign="school"] .footer-inner,
  html[data-campaign="school"] .footer-bottom{
    width:var(--ref-content);
    max-width:none;
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .footer-inner{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    align-items:start;
  }
  html[data-campaign="school"] .footer-logo{
    width:min(100%,160px);
  }
  html[data-campaign="school"] .footer-brand p,
  html[data-campaign="school"] .footer-services p,
  html[data-campaign="school"] .footer-contact address{
    margin-top:14px;
    font-size:11px;
    line-height:1.55;
  }
  html[data-campaign="school"] .footer-inner h2{
    font-size:18px;
  }
  html[data-campaign="school"] .social-links{
    gap:7px;
    margin-top:18px;
  }
  html[data-campaign="school"] .social-links img{
    width:32px;
    height:32px;
  }
  html[data-campaign="school"] .footer-brand .social-links a:nth-child(n+4){
    display:none;
  }
  html[data-campaign="school"] .footer-actions{
    margin-top:18px;
  }
  html[data-campaign="school"] .footer-actions .button{
    width:100%;
    min-height:38px;
    padding:10px 12px;
    font-size:15px;
  }
  html[data-campaign="school"] .footer-bottom{
    margin-top:34px;
    padding-top:18px;
    font-size:10px;
  }
}

/* V7.1 corrections discovered during breakpoint verification. */
@media screen and (min-width:619px) and (max-width:914px){
  /* Force the portrait hero architecture across the ENTIRE requested range,
     including 900–914 where the desktop hero rules would otherwise win. */
  html[data-campaign="school"] .hero{
    display:flex;
    flex-direction:column;
    position:relative;
    width:100%;
    height:auto;
    min-height:0;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-media{
    order:1;
    position:relative;
    inset:auto;
    width:100%;
    height:640px;
    min-height:0;
    margin:0;
    overflow:hidden;
    background:#000;
  }
  html[data-campaign="school"] .hero-picture{
    position:absolute;
    top:0;
    left:0;
    right:auto;
    bottom:auto;
    width:100%;
    height:auto;
    aspect-ratio:2048 / 1994;
    overflow:visible;
    transform:none;
  }
  html[data-campaign="school"] .hero-picture .hero-photo{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:50% 0;
    transform:none;
    animation:none;
  }
  html[data-campaign="school"] .hero-media:before{
    z-index:2;
    background:linear-gradient(to bottom,rgba(0,0,0,0) 43%,rgba(0,0,0,.04) 51%,rgba(0,0,0,.16) 60%,rgba(0,0,0,.40) 70%,rgba(0,0,0,.72) 81%,rgba(0,0,0,.94) 92%,#000 100%);
  }
  html[data-campaign="school"] .hero-shade{display:none}
  html[data-campaign="school"] .hero-content{
    order:2;
    z-index:4;
    position:relative;
    width:min(calc(100% - 64px),470px);
    max-width:470px;
    margin:-220px auto 0;
    padding:92px 0 68px;
    background:transparent;
    align-items:flex-start;
    height:auto;
  }
  html[data-campaign="school"] .hero-content > *{max-width:none}
  html[data-campaign="school"] .hero-content h1{
    width:100%;
    text-align:left;
    font-size:clamp(58px,8.2vw,72px);
    line-height:1.02;
  }
  html[data-campaign="school"] .hero-description{
    width:100%;
    max-width:none;
    margin-top:26px;
    font-size:15px;
    line-height:1.4;
  }

  /* Reviews should read as one composition: full-width copy on the left axis,
     then the active card tucked to the right, as in the supplied reference. */
  html[data-campaign="school"] .reviews-section .section-inner{
    display:block;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    width:100%;
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    max-width:360px;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    width:min(50%,300px);
    margin:-22px 0 0 auto;
  }
}
@media screen and (min-width:619px) and (max-width:700px){
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    margin-top:18px;
  }
}

/* V7.2 final verification fixes. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .services-track .service-card.carousel-clone{
    display:none;
  }
  html[data-campaign="school"] .quote-form-wrap{
    width:min(100%,590px);
  }
}

/* V8 corrections requested after reference review.
   Content is preserved. Only layout and breakpoint behavior are adjusted. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"]{
    --ref-content: min(calc(100% - 28%), 650px);
    --ref-services: min(calc(100% - 30%), 630px);
    --ref-form: var(--ref-content);
  }

  /* SERVICES: slightly larger than V7, while retaining open spacing. */
  html[data-campaign="school"] .services-section .services-viewport{
    width:var(--ref-services);
    margin:52px auto 0;
  }
  html[data-campaign="school"] .services-track{
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:50px;
    row-gap:60px;
  }
  html[data-campaign="school"] .service-card img{
    width:100%;
    height:auto;
  }

  /* REVIEWS: one-card infinite carousel with three dots. */
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    width:min(46%,300px);
    margin:-22px 0 0 auto;
    overflow:hidden;
    touch-action:pan-y;
  }
  html[data-campaign="school"] .reviews-section .carousel-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:14px;
  }
  html[data-campaign="school"] .reviews-section .dot{
    display:block;
    width:9px;
    height:9px;
  }

  /* BOOKING: restore the original form fields and scale the full form to
     exactly the same overall width as the three booking steps. */
  html[data-campaign="school"] .quote-form-wrap{
    width:var(--ref-form);
    max-width:none;
    margin:44px auto 0;
  }
  html[data-campaign="school"] .promo-code-field{
    display:block;
    align-self:center;
  }
  html[data-campaign="school"] .form-fields .submit-button{
    grid-column:auto;
    width:100%;
    height:7.8cqw;
    min-height:7.8cqw;
    margin-top:0;
    font-size:3.1cqw;
  }
  html[data-campaign="school"] .form-text-link{
    width:35.2cqw;
    margin:1cqw 13% 0 auto;
  }

  /* FOOTER: use the exact same three-column grid as Booking and restore all
     five social icons. */
  html[data-campaign="school"] .footer-inner{
    width:var(--ref-content);
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .footer-brand .social-links a:nth-child(n+4){
    display:block;
  }
  html[data-campaign="school"] .social-links{
    display:flex;
    flex-wrap:nowrap;
    gap:7px;
  }
}

@media screen and (min-width:619px) and (max-width:700px){
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    margin-top:18px;
  }
}

/* V9 reviews correction, 619px through 914px.
   The review composition uses exactly the same horizontal frame as the three
   Booking steps. Carousel clones are enabled so looping is real, not visual. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .reviews-section{
    padding:66px 0 64px;
  }
  html[data-campaign="school"] .reviews-section .section-inner{
    display:block;
    width:var(--ref-content);
    max-width:none;
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    width:100%;
    max-width:none;
    margin:0;
  }
  html[data-campaign="school"] .reviews-section .section-heading h2{
    white-space:normal;
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    max-width:none;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    width:100%;
    max-width:none;
    margin:42px 0 0;
    overflow:hidden;
    touch-action:pan-y;
    -webkit-user-select:none;
    user-select:none;
  }
  html[data-campaign="school"] .reviews-section .reviews-track{
    display:flex;
    width:100%;
    max-width:none;
    gap:0;
    margin:0;
    justify-content:flex-start;
    transform:translateX(calc(var(--review-position) * -100%));
    transition:transform .65s cubic-bezier(.22,1,.36,1);
  }
  html[data-campaign="school"] .reviews-section .review-card,
  html[data-campaign="school"] .reviews-section .review-card.carousel-clone{
    display:flex;
    flex:0 0 100%;
    min-width:100%;
    width:100%;
    justify-content:center;
  }
  html[data-campaign="school"] .reviews-section .review-card img{
    display:block;
    width:100%;
    max-width:none;
    height:auto;
  }
  html[data-campaign="school"] .reviews-section .carousel-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-top:18px;
  }
  html[data-campaign="school"] .reviews-section .dot{
    display:block;
    flex:0 0 auto;
    width:12px;
    height:12px;
    padding:0;
    border:0;
    border-radius:50%;
    cursor:pointer;
    background:rgba(246,134,43,.38);
    transition:background .18s,transform .18s;
  }
  html[data-campaign="school"] .reviews-section .dot.is-active{
    background:var(--orange);
    transform:scale(1.06);
  }
}


/* V10 verified tablet layout, 619px through 914px.
   Content stays unchanged. This block only owns geometry and interaction surfaces. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"]{
    --v10-content:min(calc(100% - 28%),650px);
    --v10-services:min(72vw,646px);
    --v10-service-gap:36px;
    --v10-service-card:calc((min(72vw,646px) - var(--v10-service-gap))/2);
    --v10-hero-proof:min(100%,420px);
    --v10-hero-message:min(100%,360px);
  }

  /* 1. HERO supporting rows */
  html[data-campaign="school"] .google-rating{
    width:var(--v10-hero-proof);
    max-width:none;
    margin-left:0;
    margin-right:auto;
  }
  html[data-campaign="school"] .hero-actions{
    display:grid;
    grid-template-columns:minmax(0,1.58fr) minmax(0,1fr);
    gap:16px;
    width:var(--v10-hero-proof);
    max-width:none;
    margin:32px 0 0;
  }
  html[data-campaign="school"] .hero-actions .button{
    width:100%;
    min-width:0;
    min-height:58px;
    padding:16px 18px;
    font-size:20px;
  }
  html[data-campaign="school"] .hero-text-link{
    width:var(--v10-hero-message);
    max-width:none;
    margin:22px 0 0;
  }
  html[data-campaign="school"] .social-links.hero-social-links{
    display:grid !important;
    grid-template-columns:repeat(5,46px);
    justify-content:space-between;
    align-items:center;
    width:var(--v10-hero-message) !important;
    max-width:none !important;
    margin:22px 0 0 !important;
    padding:0 !important;
    gap:0 !important;
  }
  html[data-campaign="school"] .social-links.hero-social-links a,
  html[data-campaign="school"] .social-links.hero-social-links img{
    display:block !important;
    width:46px !important;
    height:46px !important;
    max-width:none !important;
    margin:0 !important;
  }

  /* 4. SERVICES, current content retained */
  html[data-campaign="school"] .services-section .section-inner{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }
  html[data-campaign="school"] .services-section .section-heading{
    width:var(--v10-services);
    max-width:none;
    margin:0 auto;
  }
  html[data-campaign="school"] .services-section .services-viewport{
    width:var(--v10-services);
    max-width:none;
    margin:48px auto 0;
    overflow:visible;
  }
  html[data-campaign="school"] .services-track{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:var(--v10-service-gap);
    row-gap:44px;
    width:100%;
    max-width:none;
    margin:0;
    transform:none !important;
  }
  html[data-campaign="school"] .services-track .service-card,
  html[data-campaign="school"] .services-track .service-card img{
    display:block;
    width:100%;
    max-width:none;
    height:auto;
  }
  html[data-campaign="school"] .services-track .service-card.carousel-clone{
    display:none;
  }
  html[data-campaign="school"] .services-section .carousel-dots{
    display:none;
  }

  /* 2 and 3. REVIEWS, reference composition plus real one-card carousel */
  html[data-campaign="school"] .reviews-section{
    padding:66px 0 68px;
  }
  html[data-campaign="school"] .reviews-section .section-inner{
    width:var(--v10-content);
    max-width:none;
    margin:0 auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--v10-service-card);
    column-gap:38px;
    align-items:start;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    width:100%;
    max-width:none;
    margin:0;
    align-self:start;
  }
  html[data-campaign="school"] .reviews-section .section-heading h2{
    margin:0;
    max-width:100%;
    white-space:normal;
    font-size:clamp(28px,3.5vw,32px);
    line-height:1.08;
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    max-width:300px;
    margin-top:12px;
    font-size:15px;
    line-height:1.42;
  }
  html[data-campaign="school"] .reviews-section .dark-heading a{
    margin-top:16px;
    font-size:12px;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    width:var(--v10-service-card);
    max-width:none;
    margin:38px 0 0 auto;
    overflow:hidden;
    touch-action:pan-y;
    -webkit-user-select:none;
    user-select:none;
  }
  html[data-campaign="school"] .reviews-section .reviews-track{
    display:flex;
    width:100%;
    max-width:none;
    gap:0;
    margin:0;
    justify-content:flex-start;
    transform:translateX(calc(var(--review-position) * -100%));
    transition:transform .65s cubic-bezier(.22,1,.36,1);
  }
  html[data-campaign="school"] .reviews-section .reviews-track.no-transition{
    transition:none !important;
  }
  html[data-campaign="school"] .reviews-section .review-card,
  html[data-campaign="school"] .reviews-section .review-card.carousel-clone{
    display:flex;
    flex:0 0 100%;
    min-width:100%;
    width:100%;
    justify-content:center;
  }
  html[data-campaign="school"] .reviews-section .review-card img{
    display:block;
    width:100%;
    max-width:none;
    height:auto;
  }
  html[data-campaign="school"] .reviews-section .carousel-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-top:14px;
  }
  html[data-campaign="school"] .reviews-section .dot{
    display:block;
    flex:0 0 10px;
    width:10px;
    height:10px;
    padding:0;
    border:0;
    border-radius:50%;
    cursor:pointer;
    background:rgba(246,134,43,.38);
  }
  html[data-campaign="school"] .reviews-section .dot.is-active{
    background:var(--orange);
    transform:scale(1.06);
  }

  /* 5. BOOKING, white frame equals all three steps */
  html[data-campaign="school"] .booking-inner{
    width:var(--v10-content);
    max-width:none;
    margin:0 auto;
  }
  html[data-campaign="school"] .booking-steps{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    width:100%;
    max-width:none;
  }
  html[data-campaign="school"] .booking-steps picture,
  html[data-campaign="school"] .booking-steps img{
    display:block;
    width:100%;
    height:auto;
  }
  html[data-campaign="school"] .quote-form-wrap{
    width:100%;
    max-width:none;
    margin:44px auto 0;
  }
  html[data-campaign="school"] .form-bubble{
    width:100%;
  }
  html[data-campaign="school"] .promo-code-field{
    display:block;
  }
  html[data-campaign="school"] .form-fields .submit-button{
    grid-column:auto;
    width:100%;
  }

  /* 6. FOOTER, same three-column axis as steps */
  html[data-campaign="school"] .footer-inner,
  html[data-campaign="school"] .footer-bottom{
    width:var(--v10-content);
    max-width:none;
    margin-left:auto;
    margin-right:auto;
  }
  html[data-campaign="school"] .footer-inner{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    align-items:start;
  }
  html[data-campaign="school"] .footer-brand{
    justify-self:start;
    width:100%;
  }
  html[data-campaign="school"] .footer-services{
    justify-self:center;
    width:max-content;
    text-align:left;
  }
  html[data-campaign="school"] .footer-contact{
    justify-self:start;
    width:100%;
  }
  html[data-campaign="school"] .footer-brand .social-links a:nth-child(n+4){
    display:block;
  }
  html[data-campaign="school"] .footer-brand .social-links{
    display:flex;
    flex-wrap:nowrap;
  }
}


/* V10.1 review reference geometry: title spans the composition, copy left, card right. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .reviews-section .section-inner{
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--v10-service-card);
    grid-template-rows:auto auto auto;
    column-gap:38px;
    align-items:start;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    display:contents;
  }
  html[data-campaign="school"] .reviews-section .section-heading h2{
    grid-column:1 / -1;
    grid-row:1;
    white-space:nowrap;
    font-size:clamp(28px,3.5vw,32px);
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    grid-column:1;
    grid-row:2;
    max-width:300px;
    margin:18px 0 0;
  }
  html[data-campaign="school"] .reviews-section .dark-heading a{
    grid-column:1;
    grid-row:3;
    width:max-content;
    margin:14px 0 0;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    grid-column:2;
    grid-row:2 / span 2;
    align-self:start;
    margin:18px 0 0 auto;
  }
}

/* V10.2 keep review copy stacked while title spans both columns. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .reviews-section .section-inner{
    grid-template-rows:auto;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    display:block;
    grid-column:1;
    grid-row:1;
    width:100%;
  }
  html[data-campaign="school"] .reviews-section .section-heading h2{
    width:var(--v10-content);
    max-width:none;
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    display:block;
    width:300px;
    max-width:100%;
    margin:18px 0 0;
  }
  html[data-campaign="school"] .reviews-section .dark-heading a{
    display:inline-block;
    width:auto;
    margin:14px 0 0;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    grid-column:2;
    grid-row:1;
    margin:60px 0 0 auto;
  }
}

/* V11 targeted tablet refinements, requested after 40. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"]{
    --v11-hero-message:calc(var(--v10-hero-message) * .7);
    --v11-hero-social-size:40px;
    --v11-review-card-height:calc(var(--v10-service-card) * 122.658 / 221.406);
  }

  /* 1. HERO text-message row plus five icons, 30 percent smaller, left aligned */
  html[data-campaign="school"] .hero-text-link{
    width:var(--v11-hero-message);
    max-width:none;
    margin:22px 0 0;
  }
  html[data-campaign="school"] .social-links.hero-social-links{
    width:var(--v11-hero-message) !important;
    grid-template-columns:repeat(5, var(--v11-hero-social-size));
    justify-content:space-between;
    margin:18px 0 0 !important;
    gap:0 !important;
  }
  html[data-campaign="school"] .social-links.hero-social-links a,
  html[data-campaign="school"] .social-links.hero-social-links img{
    width:var(--v11-hero-social-size) !important;
    height:var(--v11-hero-social-size) !important;
  }

  /* 2. REVIEWS, keep the two columns and align top and bottom edges to the black review card */
  html[data-campaign="school"] .reviews-section{
    padding:66px 0 68px;
  }
  html[data-campaign="school"] .reviews-section .section-inner{
    width:var(--v10-content);
    max-width:none;
    margin:0 auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--v10-service-card);
    column-gap:38px;
    align-items:start;
  }
  html[data-campaign="school"] .reviews-section .section-heading{
    grid-column:1;
    grid-row:1;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:var(--v11-review-card-height);
    margin:0;
    align-self:start;
  }
  html[data-campaign="school"] .reviews-section .section-heading h2{
    width:auto;
    max-width:none;
    margin:0;
    font-size:clamp(28px,3.5vw,32px);
    line-height:1.08;
    white-space:normal;
  }
  html[data-campaign="school"] .reviews-section .section-heading p{
    width:300px;
    max-width:100%;
    margin:0;
    font-size:15px;
    line-height:1.42;
  }
  html[data-campaign="school"] .reviews-section .dark-heading a{
    margin:0;
    width:max-content;
    font-size:12px;
  }
  html[data-campaign="school"] .reviews-section .reviews-viewport{
    grid-column:2;
    grid-row:1;
    width:var(--v10-service-card);
    max-width:none;
    margin:0 0 0 auto;
    align-self:start;
  }
  html[data-campaign="school"] .reviews-section .carousel-dots{
    margin-top:14px;
  }

  /* 3. FOOTER, lift the social row and the CTA row, then reduce CTA width */
  html[data-campaign="school"] .site-footer{
    padding-top:54px;
    padding-bottom:24px;
  }
  html[data-campaign="school"] .footer-brand .social-links,
  html[data-campaign="school"] .footer-contact .footer-actions{
    margin-top:18px;
    padding-top:0;
  }
  html[data-campaign="school"] .footer-contact .footer-actions{
    align-items:flex-start;
  }
  html[data-campaign="school"] .footer-actions .button{
    width:260px;
    min-width:0;
    min-height:42px;
    padding:0 18px;
    font-size:18px;
  }
  html[data-campaign="school"] .footer-bottom{
    margin-top:38px;
  }
}

/* 43 footer correction, 619px through 914px only. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .footer-inner{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    align-items:stretch;
  }

  html[data-campaign="school"] .footer-brand,
  html[data-campaign="school"] .footer-contact{
    height:100%;
    align-self:stretch;
  }

  /* Keep the right edge of the contact column on the shared content frame. */
  html[data-campaign="school"] .footer-contact{
    justify-self:end;
    width:max-content;
    max-width:100%;
  }

  /* The middle column sits geometrically between the left and right columns. */
  html[data-campaign="school"] .footer-services{
    justify-self:center;
    align-self:start;
    width:max-content;
    text-align:left;
  }

  /* Social icons and footer CTA share the same horizontal row. */
  html[data-campaign="school"] .footer-brand .social-links,
  html[data-campaign="school"] .footer-contact .footer-actions{
    margin-top:auto;
    padding-top:18px;
  }

  html[data-campaign="school"] .footer-contact .footer-actions{
    width:100%;
    align-items:stretch;
  }

  /* CTA stays compact. Its intrinsic width is smaller than the email,
     so the contact column width is defined by the email line and the
     button expands only to that width. */
  html[data-campaign="school"] .footer-actions .button{
    width:100%;
    min-width:0;
    height:36.252px;
    min-height:36.252px;
    padding:0 10px;
    font-size:15px;
    line-height:1;
  }
}

/* 45 fixes */
@media screen and (min-width:619px) and (max-width:660px){
  html[data-campaign="school"] .services-section .section-heading h2{
    max-width:420px;
    margin-left:auto;
    margin-right:auto;
    font-size:clamp(24px,5.6vw,28px);
    line-height:1.12;
    text-align:center;
    white-space:normal;
    overflow-wrap:break-word;
  }
  html[data-campaign="school"] .services-section .section-heading p{
    max-width:420px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }
}

/* 46: lock the services heading inside the two-card visual width. */
@media screen and (min-width:619px) and (max-width:660px){
  html[data-campaign="school"] .services-section .section-heading h2{
    width:390px;
    max-width:100%;
    margin:0;
    font-size:28px;
    line-height:1.12;
    text-align:left;
    white-space:normal !important;
    overflow-wrap:normal;
  }
  html[data-campaign="school"] .services-section .section-heading p{
    width:390px;
    max-width:100%;
    margin:12px 0 0;
    text-align:left;
  }
}

/* 47 footer CTA refinement, tablet range only. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .footer-contact .footer-actions{
    width:auto;
    align-items:flex-start;
  }
  html[data-campaign="school"] .footer-actions .button{
    width:auto;
    min-width:0;
    min-height:34px;
    height:34px;
    padding:0 12px;
    font-size:13px;
    line-height:1;
    white-space:nowrap;
  }
}


/* 48 footer CTA to icon balance, plus looser tablet title wrap. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .footer-brand .social-links{
    gap:6px;
  }
  html[data-campaign="school"] .footer-brand .social-links a,
  html[data-campaign="school"] .footer-brand .social-links img,
  html[data-campaign="school"] .footer-actions .button{
    height:38px !important;
    min-height:38px !important;
  }
  html[data-campaign="school"] .footer-brand .social-links a,
  html[data-campaign="school"] .footer-brand .social-links img{
    width:38px !important;
    min-width:38px;
    max-width:38px;
    flex:0 0 38px;
  }
  html[data-campaign="school"] .footer-contact .footer-actions{
    padding-top:16px;
  }
  html[data-campaign="school"] .footer-actions .button{
    width:auto;
    padding:0 16px !important;
    font-size:14px !important;
    line-height:1 !important;
    white-space:nowrap;
  }
}

@media screen and (min-width:619px) and (max-width:660px){
  html[data-campaign="school"] .services-section .section-heading{
    width:min(100%,420px) !important;
  }
  html[data-campaign="school"] .services-section .section-heading h2{
    width:min(100%,420px) !important;
    max-width:100%;
    margin:0 auto;
    font-size:26px !important;
    line-height:1.12 !important;
    text-align:left;
    white-space:normal !important;
    overflow-wrap:normal;
    text-wrap:balance;
  }
  html[data-campaign="school"] .services-section .section-heading p{
    width:min(100%,420px) !important;
    max-width:100%;
    margin:12px auto 0;
    text-align:left;
  }
}


/* 49 hero rating scale down and tighter hero social spacing. */
@media screen and (min-width:619px) and (max-width:914px){
  html[data-campaign="school"] .google-rating{
    width:calc(var(--school-hero-proof-width) * 0.6667) !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:auto !important;
  }
  html[data-campaign="school"] .google-rating img{
    width:100% !important;
    height:auto !important;
  }
  html[data-campaign="school"] .social-links.hero-social-links{
    width:auto !important;
    max-width:none !important;
    grid-template-columns:repeat(5, var(--v11-hero-social-size)) !important;
    justify-content:start !important;
    column-gap:10px !important;
    row-gap:0 !important;
    gap:10px !important;
    margin:18px 0 0 !important;
  }
}

/* Event Planner 2: keep the mobile hero subject scale continuous at the
   tablet to mobile transition. Below 618 CSS px the image no longer zooms.
   Its reference width stays fixed and narrower viewports crop only the sides. */
@media screen and (max-width:618px){
  html[data-campaign="school"] .hero-picture{
    position:absolute;
    top:0;
    left:50%;
    right:auto;
    bottom:auto;
    width:625px;
    height:auto;
    aspect-ratio:2048 / 1994;
    overflow:visible;
    transform:translateX(-50%);
  }
  html[data-campaign="school"] .hero-picture .hero-photo{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:50% 0;
    transform:none;
    animation:none;
  }
}
