/* Contact page v2. ct- prefix; loaded after the shared page CSS. */
.ct-sec{padding:clamp(2.2rem,4.5vw,3.6rem) 0;scroll-margin-top:6rem}
.ct-sec--panel{background:var(--panel)}
.ct-head{max-width:46rem;margin:0 0 1.4rem}
.ct-head h2{margin-bottom:.5rem}
.ct-head p{margin:0 0 .6rem;color:#2a2d31}
.ct-head p:last-child{margin-bottom:0}
.ct-note{font-size:.88rem;color:var(--slate);margin:.9rem 0 0}

/* hero */
.ct-hero .lede{margin-bottom:.7rem}
.ct-facts{display:flex;flex-wrap:wrap;gap:.4rem 0;margin:.3rem 0 1.1rem;padding:.55rem 0;border-top:1px solid rgba(255,255,255,.35);border-bottom:1px solid rgba(255,255,255,.35);color:#fff;font-weight:700}
.ct-facts span+span::before{content:"|";margin:0 .6em;opacity:.7}
.ct-facts a{color:inherit;text-decoration:none}
.ct-facts a:hover,.ct-facts a:focus-visible{text-decoration:underline;text-underline-offset:.2em}
.ct-facts a+a::before,.ct-facts a+span::before{content:"|";margin:0 .6em;opacity:.7}

/* form */
.ct-form-sec{padding:clamp(1.8rem,4vw,3rem) 0;background:var(--panel);scroll-margin-top:5.5rem}
.ct-card{background:#fff;border:1px solid var(--line);border-top:4px solid var(--red);padding:clamp(1.2rem,3.2vw,2.2rem)}
.ct-card__head{max-width:46rem;margin-bottom:1.2rem}
.ct-card__head p{margin:0 0 .6rem;color:#2a2d31}
.ct-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem 1.2rem}
.ct-field{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.ct-field--full{grid-column:1/-1}
.ct-form label,.ct-form legend{font-weight:700;font-size:.9rem}
.ct-req{color:var(--red)}
.ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.ct-form select{width:100%;min-height:2.9rem;padding:.6rem .8rem;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid #b9bdc4;border-radius:0}
.ct-form input:focus-visible,.ct-form select:focus-visible,.ct-form button:focus-visible{outline:3px solid #1a5fd0;outline-offset:2px}
.ct-form .phone-field{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:.5rem}
.ct-form .cc{margin-bottom:0}
.ct-form .honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ct-method{margin:0;padding:0;border:0;min-width:0}
.ct-method__opts{display:flex;flex-wrap:wrap;gap:.5rem}
.ct-method label{display:inline-flex;align-items:center;gap:.5rem;min-height:2.9rem;padding:.4rem .9rem;border:1px solid #b9bdc4;font-weight:600;text-transform:none;letter-spacing:0;font-size:.95rem;cursor:pointer;background:#fff}
.ct-method input{accent-color:var(--red);width:1.1rem;height:1.1rem}
.ct-method label:has(input:checked){border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.ct-form .btn{justify-content:center;min-height:3.1rem;width:100%}
.ct-form .form-privacy{margin:0;font-size:.85rem;color:var(--slate)}
.ct-form .form-marketing{display:flex;gap:.6rem;align-items:flex-start;font-family:inherit;font-size:.85rem;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.45}
.ct-form .form-marketing input{margin-top:.2rem;flex:none}
.ct-error{margin:0 0 1rem;padding:.8rem 1rem;border:1px solid var(--red);background:#fff4f5;color:var(--red-dark)}

/* contact details */
.ct-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(1.4rem,4vw,3rem);align-items:start}
.ct-details{margin:0;display:grid;gap:.8rem}
.ct-details div{border:1px solid var(--line);background:#fff;padding:.8rem 1rem}
.ct-details dt{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--red);font-weight:700;margin-bottom:.2rem}
.ct-details dd{margin:0;font-weight:600}
.ct-details a{color:var(--ink)}
.ct-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.ct-btns .btn{justify-content:center;min-height:3rem}

/* map */
.ct-map{position:relative;aspect-ratio:16/9;min-height:18rem;background:var(--panel);border:1px solid var(--line);overflow:hidden}
.ct-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ct-map__ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;padding:1.2rem;text-align:center;background:repeating-linear-gradient(45deg,#f2f3f5,#f2f3f5 14px,#eceef1 14px,#eceef1 28px)}
.ct-map__ph svg{width:2.4rem;height:2.4rem;color:var(--red)}
.ct-map__ph p{margin:0;max-width:30rem;font-weight:600}
.ct-map__row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}

/* cards */
.ct-grid4,.ct-courses{display:grid;gap:1rem;margin:0;padding:0;list-style:none}
.ct-grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ct-courses{grid-template-columns:repeat(6,minmax(0,1fr))}
.ct-courses>li{grid-column:span 2}
.ct-courses>li:nth-child(n+4){grid-column:span 3}
.ct-tile{height:100%;border:1px solid var(--line);border-top:3px solid var(--red);background:#fff;padding:1.1rem;display:flex;flex-direction:column}
.ct-tile h3{font-size:1.05rem;line-height:1.3;margin-bottom:.45rem}
.ct-tile p{margin:0 0 .6rem;font-size:.95rem}
.ct-tile ul{margin:0 0 .7rem;padding-left:1.1rem;font-size:.95rem}
.ct-tile .btn{margin-top:auto;justify-content:center;min-height:2.75rem}

/* trust */
.ct-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:0 0 1.2rem;padding:0;list-style:none}
.ct-stats li{border:1px solid var(--line);background:#fff;padding:1rem;text-align:center}
.ct-stats b{display:block;font-size:1.7rem;line-height:1.1}
.ct-stats span{font-size:.85rem;color:var(--slate);text-transform:uppercase;letter-spacing:.06em}
.ct-stars{color:#f5b301;letter-spacing:.05em}

/* final cta */
.ct-final{background:var(--ink);color:#fff;padding:clamp(2.2rem,5vw,3.6rem) 0}
.ct-final h2{color:#fff}
.ct-final p{color:#d5d7db;max-width:44rem}
.ct-final .btn.light{border-color:rgba(255,255,255,.7)}

@media (max-width:1000px){
  .ct-grid4,.ct-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ct-courses{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ct-courses>li,.ct-courses>li:nth-child(n+4){grid-column:auto}
  .ct-split{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .ct-form{grid-template-columns:minmax(0,1fr)}
  .ct-form .phone-field{grid-template-columns:6rem minmax(0,1fr)}
  .ct-grid4,.ct-courses{grid-template-columns:minmax(0,1fr)}
  .ct-btns{grid-template-columns:minmax(0,1fr)}
  .ct-map{aspect-ratio:4/3;min-height:16rem}
  .ct-hero h1{font-size:clamp(1.8rem,8vw,2.3rem)}
  .ct-hero .lede{font-size:.97rem;line-height:1.45;margin-bottom:.55rem}
  .ct-facts{gap:.4rem;padding:0;border:0;margin:.5rem 0 1rem}
  .ct-facts span{padding:.4rem .7rem;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:.8rem;line-height:1.2}
  .ct-facts span+span::before{content:none}
  .ct-facts a{padding:.4rem .7rem;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:.8rem;line-height:1.2;text-decoration:none}
  .ct-facts a+a::before,.ct-facts a+span::before{content:none}
  .ct-facts a:hover,.ct-facts a:focus-visible{background:rgba(255,255,255,.26);text-decoration:none}
  .ct-method__opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
  .ct-method label{justify-content:center;padding:.4rem .2rem;gap:.3rem;font-size:.82rem;white-space:nowrap}
  .ct-method input{width:1rem;height:1rem}
  .ct-hero .actions{flex-direction:column;align-items:stretch}
  .ct-hero .actions .btn{justify-content:center}
  /* keep content clear of the fixed Call / WhatsApp / Enquire bar */
  .footer{padding-bottom:calc(4.6rem + env(safe-area-inset-bottom,0px))}
}

.ct-photo{margin:0 0 1.2rem;max-width:56rem}
.ct-photo img{width:100%;height:auto;display:block;background:#eceef1}

/* Phones: keep the whole form on one screen (fields start under the sticky header when Enquire is tapped). */
@media (max-width:760px){
  .ct-card{padding:1rem .9rem}
  .ct-form{gap:.5rem}
  .ct-field{gap:.16rem}
  .ct-form label,.ct-form legend{font-size:.76rem}
  .ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.ct-form select{min-height:2.5rem;padding:.35rem .7rem}
  .ct-form .btn{min-height:2.85rem}
  .ct-form .form-privacy{font-size:.74rem;line-height:1.35}
  .ct-form .form-marketing{font-size:.78rem;line-height:1.35;gap:.5rem}
  .ct-form .form-marketing input{margin-top:.1rem}
}
@media (max-width:760px) and (max-height:700px){
  .ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.ct-form select{min-height:2.2rem}
  .ct-form{gap:.4rem}
  .ct-form .ct-field:has(input[readonly]){display:none}
  .ct-form .form-privacy{font-size:.7rem}
  .ct-form .btn{min-height:2.6rem}
  .ct-form{gap:.3rem}
  .ct-field{gap:.08rem}
  .ct-form label,.ct-form legend{font-size:.72rem}
  .ct-form .form-marketing{font-size:.74rem;line-height:1.3}
  .ct-form .form-privacy{font-size:.68rem;line-height:1.3}
  .ct-card{padding-top:.8rem;padding-bottom:.8rem}
}

/* Desktop: hero and enquiry form sit side by side, like the homepage. */
@media (min-width:1000px){
  main:has(> .ct-hero + .ct-form-sec){display:grid;grid-template-columns:minmax(0,1fr) 28rem;align-items:stretch}
  main:has(> .ct-hero + .ct-form-sec)::before{content:"";grid-column:1/-1;grid-row:1}
  main:has(> .ct-hero + .ct-form-sec) > *{grid-column:1/-1}
  main:has(> .ct-hero + .ct-form-sec) > .ct-error{grid-row:1}
  main:has(> .ct-hero + .ct-form-sec) > .ct-hero{grid-column:1;grid-row:2;min-height:0}
  main:has(> .ct-hero + .ct-form-sec) > .ct-form-sec{grid-column:2;grid-row:2;display:flex;align-items:center;padding:1.4rem 1.6rem;background:#fff;border-left:1px solid var(--line)}
  main:has(> .ct-hero + .ct-form-sec) > .ct-form-sec > .wrap{width:100%;max-width:none;padding:0}
  main:has(> .ct-hero + .ct-form-sec) .ct-card{border:0;border-top:0;padding:0;box-shadow:none}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head h2{font-size:clamp(1.5rem,2vw,1.85rem);line-height:1.12}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head{margin-bottom:.9rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head p{font-size:.92rem;line-height:1.45}
  main:has(> .ct-hero + .ct-form-sec) .ct-form{grid-template-columns:minmax(0,1fr);gap:.4rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-field{gap:.15rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form label{font-size:.72rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  main:has(> .ct-hero + .ct-form-sec) .ct-form select{min-height:2.6rem;padding-top:.35rem;padding-bottom:.35rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head{margin-bottom:.6rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head p{font-size:.85rem;line-height:1.4;margin-bottom:0}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .btn{min-height:2.9rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .form-privacy{font-size:.74rem;line-height:1.35}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .form-marketing{font-size:.78rem;line-height:1.35}
}

/* Desktop split layout: the whole form fits the screen height. */
@media (min-width:1000px) and (max-height:900px){
  main:has(> .ct-hero + .ct-form-sec) > .ct-form-sec{align-items:flex-start;padding-top:1rem;padding-bottom:.6rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head p{display:none}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head h2{font-size:1.45rem;margin-bottom:.4rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head{margin-bottom:.4rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form{gap:.3rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  main:has(> .ct-hero + .ct-form-sec) .ct-form select{min-height:2.35rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .btn{min-height:2.6rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .form-privacy{font-size:.7rem;line-height:1.3}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .form-marketing{font-size:.74rem;line-height:1.3}
}
@media (min-width:1000px) and (max-height:800px){
  main:has(> .ct-hero + .ct-form-sec) .ct-form .ct-field:has(input[readonly]){display:none}
  main:has(> .ct-hero + .ct-form-sec) .ct-form fieldset,main:has(> .ct-hero + .ct-form-sec) .ct-form .ct-field--radios{display:none}
}
@media (min-width:1000px) and (max-height:760px){
  main:has(> .ct-hero + .ct-form-sec) .ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  main:has(> .ct-hero + .ct-form-sec) .ct-form select{min-height:2.2rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form label{font-size:.68rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form{gap:.2rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-card__head h2{font-size:1.3rem}
}

/* Text-heavy page heroes: the photo is atmosphere, never competing with the copy.
   A near-solid band sits behind the text, and a soft blur keeps signage (office sign, banners) from reading through. */
.ct-hero .photo-hero__media img{filter:saturate(.7) blur(2px);transform:scale(1.05)}
.ct-hero .photo-hero__scrim{background:linear-gradient(100deg,rgba(8,9,11,.94) 0%,rgba(8,9,11,.86) 42%,rgba(8,9,11,.6) 75%,rgba(8,9,11,.45) 100%),linear-gradient(180deg,rgba(8,9,11,.2) 0%,rgba(8,9,11,.55) 100%)}
@media (max-width:760px){
  .ct-hero .photo-hero__scrim{background:linear-gradient(180deg,rgba(8,9,11,.8) 0%,rgba(8,9,11,.9) 60%,rgba(8,9,11,.94) 100%)}
}
@media (prefers-reduced-motion:reduce){.ct-hero .photo-hero__media img{transform:scale(1.05)}}
/* This page only: the enquiry form is a right-hand column that stays in view while the page scrolls. */
@media (min-width:1000px){
  main:has(> .ct-hero + .ct-form-sec) > *{grid-column:1}
  main:has(> .ct-hero + .ct-form-sec) > .ct-form-sec{grid-column:2;grid-row:2 / span 30;align-items:flex-start;padding:0;background:#fff;border-left:1px solid var(--line)}
  main:has(> .ct-hero + .ct-form-sec) > .ct-form-sec > .wrap{position:sticky;top:5.6rem;max-height:calc(100vh - 5.6rem);overflow-y:auto;padding:1.4rem 1.6rem 1.2rem;scrollbar-width:thin}
  main:has(> .ct-hero + .ct-form-sec) > .ct-form-sec .ct-card__head p{display:block}
  main:has(> .ct-hero + .ct-form-sec) .ct-form{gap:.65rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-field{gap:.3rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form label{font-size:.72rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
  main:has(> .ct-hero + .ct-form-sec) .ct-form select{min-height:2.7rem}
  /* phone code matches the other fields */
  .ct-form .phone-field{grid-template-columns:5.6rem minmax(0,1fr)}
  .ct-form .phone-field__code{appearance:none;-webkit-appearance:none;padding:.35rem 1.6rem .35rem .8rem !important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%234a4f57' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right .5rem center / 1rem !important;border:1px solid #cdd1d7;border-radius:4px;font-weight:600}
  /* the course is fixed, so it looks fixed */
  .ct-form input[name=course][readonly]{background-color:#f4f5f7;color:#2a2d31;font-weight:600;cursor:default}
  /* legal text and checkbox */
  main:has(> .ct-hero + .ct-form-sec) .ct-form .btn{min-height:3rem;margin-top:.3rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .form-privacy{font-size:.76rem;line-height:1.45;color:#4a4f57;margin-top:.1rem}
  main:has(> .ct-hero + .ct-form-sec) .ct-form .form-marketing{font-size:.78rem;line-height:1.4;color:#4a4f57;align-items:flex-start;gap:.6rem}
  .ct-form .form-marketing input{width:1.05rem;height:1.05rem;min-height:0;margin:.12rem 0 0;padding:0;accent-color:var(--red);flex:none}
}