/* Harpenden Taxis — Contact page. Scoped to page-contact.php. */
.ht-contact-page {
  --ht-cp-navy: #171c42;
  --ht-cp-blue: #2c3077;
  --ht-cp-red: #be2039;
  --ht-cp-muted: #606a7d;
  --ht-cp-cream: #ffffff;
  font-family: "IBM Plex Sans", sans-serif;
  color: var(--ht-cp-navy);
}
.ht-contact-page *, .ht-contact-page *::before, .ht-contact-page *::after { box-sizing: border-box; }
.ht-contact-page__container { width: min(calc(100% - 48px), var(--ht-container-width,1580px)); margin: 0 auto; }
.ht-contact-page__hero { position: relative; isolation:isolate; overflow: hidden; padding: clamp(66px,5.5vw,100px) 0 clamp(68px,6vw,104px); color:#fff; background:#151a39 url('../../images/home/harpenden-road.webp') center 50% / cover no-repeat; }
.ht-contact-page__hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(12,18,42,.96),rgba(15,21,45,.83) 65%,rgba(15,21,45,.60)); pointer-events:none; }
.ht-contact-page__hero::after { content:""; position:absolute; height:5px;inset:auto 0 0; background:linear-gradient(90deg,#2c3077,#be2039); }
.ht-contact-page__hero-inner { position:relative;z-index:1; }
.ht-contact-page__breadcrumbs {display:flex;align-items:center;gap:11px; margin-bottom:25px; font-size:13px; font-weight:600; color:#c5cbe2;}
.ht-contact-page__breadcrumbs a {color:#f2f4ff;text-decoration:none;}
.ht-contact-page__breadcrumbs a:hover {text-decoration:underline;}
.ht-contact-page__eyebrow { display:flex;align-items:center;gap:12px; font-size:11px;font-weight:800;letter-spacing:.16em;line-height:1.4;color:#ffa3b7;margin:0 0 14px; }
.ht-contact-page__eyebrow > span {height:2px;width:30px;background:#eb5270;display:inline-block;flex:0 0 30px;}
.ht-contact-page h1,.ht-contact-page h2 { font-family:Manrope,"IBM Plex Sans",sans-serif;letter-spacing:-.048em; }
.ht-contact-page__hero h1 {font-size:clamp(37px,4.5vw,66px);line-height:1.13;font-weight:800;color:#fff;margin:0;}
.ht-contact-page__hero h1 span {color:#f18da4;}
.ht-contact-page__hero-subtitle {font-size:clamp(15px,1.1vw,18px);max-width:720px;line-height:1.7;color:#e1e5f3;margin:19px 0 0;}
.ht-contact-page__main {background:var(--ht-cp-cream);padding:clamp(65px,6vw,106px) 0;}
.ht-contact-page__grid {display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr); gap:clamp(38px,5.5vw,100px); align-items:start;}
.ht-contact-page__details {padding:28px 0 0;min-width:0;}
.ht-contact-page__eyebrow--dark {color:var(--ht-cp-blue);margin-bottom:18px;}
.ht-contact-page__section-heading h2 {font-size:clamp(32px,3vw,46px);font-weight:800;line-height:1.18;margin:0 0 15px;}
.ht-contact-page__section-heading h2 span {color:var(--ht-cp-red);}
.ht-contact-page__section-heading p:last-child {max-width:540px;color:var(--ht-cp-muted);font-size:15px;line-height:1.85;margin:0;}
.ht-contact-page__details-list {display:grid; gap:12px;margin:32px 0 26px;}
.ht-contact-page__detail {display:flex; align-items:flex-start;gap:17px;padding:19px 20px;border:1px solid #dfe4ee;background:#fff;border-radius:14px; box-shadow:0 5px 16px rgba(23,28,66,.035);}
.ht-contact-page__detail-icon {flex:0 0 47px;width:47px;height:47px;display:grid;place-items:center;background:#fff0f3;color:var(--ht-cp-red);border:1px solid #efd0d7;border-radius:12px;}
.ht-contact-page__detail > div {min-width:0;padding-top:2px;}
.ht-contact-page__detail-label {display:block;margin-bottom:8px;color:#6a7190;font-size:11px;font-weight:800;letter-spacing:.105em;}
.ht-contact-page__detail a:not(.ht-contact-page__directions) {text-decoration:none;color:var(--ht-cp-navy);font-weight:750;font-size:clamp(14px,1.05vw,17px);overflow-wrap:anywhere;}
.ht-contact-page__detail a:hover {color:var(--ht-cp-red);}
.ht-contact-page__detail address {font-size:14px;font-style:normal;line-height:1.6;color:#313a58;}
.ht-contact-page__directions {display:inline-block;margin-top:7px;font-size:12px;font-weight:800;color:var(--ht-cp-red);text-decoration:none;}
.ht-contact-page__qr {display:flex;gap:18px;align-items:center;padding:16px;background:#fff;border:1px solid #dfe4ee;border-radius:14px;box-shadow:0 5px 16px rgba(23,28,66,.03);}
.ht-contact-page__qr-image {width:170px;height:170px;flex:0 0 170px;display:grid;place-items:center;border:1px solid #dce2ee;border-radius:10px;background:#fff;}
.ht-contact-page__qr-image img {width:160px;height:160px;object-fit:contain;}
.ht-contact-page__qr strong {font-size:17px;font-weight:800;}
.ht-contact-page__qr > div {min-width:0;flex:1 1 125px;}
.ht-contact-page__qr p {margin:7px 0 0;line-height:1.6;color:var(--ht-cp-muted);font-size:13px;max-width:260px;}
.ht-contact-page__form-panel {background:#fff;border:1px solid #dfe4ee;border-radius:19px;box-shadow:0 18px 52px rgba(23,28,66,.08);padding:clamp(26px,3.4vw,54px);min-width:0;}
.ht-contact-page__form-badge {display:inline-block;font-size:11px;letter-spacing:.115em;color:var(--ht-cp-blue);font-weight:800;margin-bottom:10px;}
.ht-contact-page__form-heading h2 {font-size:clamp(29px,2.6vw,41px);font-weight:800;margin:0 0 9px;line-height:1.25;}
.ht-contact-page__form-heading p {color:var(--ht-cp-muted);font-size:14px;line-height:1.7;margin:0 0 28px;}
/* Existing CF7 form ID 385 uses .row > .col-md-6/.col-md-12 field wrappers. */
.ht-contact-page__form-content .wpcf7 form {margin:0;}
.ht-contact-page__form-content .wpcf7 .row {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 18px;margin:0;padding:0;}
.ht-contact-page__form-content .wpcf7 .row > .col-md-6,
.ht-contact-page__form-content .wpcf7 .row > .col-md-12 {max-width:none;width:auto;float:none;padding:0;margin:0;}
.ht-contact-page__form-content .wpcf7 .row > .col-md-12 {grid-column:1/-1;}
.ht-contact-page__form-content .wpcf7 label {display:block;font-size:13px;font-weight:700;color:#303751;line-height:1.45;margin-bottom:9px;}
.ht-contact-page__form-content .wpcf7 .wpcf7-form-control-wrap {display:block;width:100%;}
.ht-contact-page__form-content .wpcf7 input:not([type="submit"]):not([type="hidden"]),
.ht-contact-page__form-content .wpcf7 textarea {
 width:100%;max-width:100%;height:auto;min-height:52px;padding:13px 15px;background:#fbfcff;border:1px solid #d6ddeb;border-radius:9px;color:var(--ht-cp-navy);font:500 14px/1.5 "IBM Plex Sans",sans-serif;box-shadow:none;outline:none;transition:border-color .2s ease,box-shadow .2s ease;
}
.ht-contact-page__form-content .wpcf7 textarea {min-height:150px;max-height:350px;resize:vertical;}
.ht-contact-page__form-content .wpcf7 input:focus,
.ht-contact-page__form-content .wpcf7 textarea:focus {border-color:#889bd6;box-shadow:0 0 0 3px rgba(44,48,119,.10);}
.ht-contact-page__form-content .wpcf7 input.wpcf7-not-valid,
.ht-contact-page__form-content .wpcf7 textarea.wpcf7-not-valid {border-color:#ba2744;}
.ht-contact-page__form-content .wpcf7 .wpcf7-not-valid-tip {display:block;margin-top:6px;font-size:12px;color:#a81c34;}
/* Mathematical quiz from the existing live form is left intact. */
.ht-contact-page__form-content .wpcf7 .wpcf7-form-control-wrap:has(.wpcf7-quiz) {display:block;max-width:260px;margin:8px 0 16px;}
.ht-contact-page__form-content .wpcf7 input.wpcf7-quiz {max-width:260px;}
.ht-contact-page__form-content .wpcf7 input[type="submit"] {appearance:none;display:inline-flex;align-items:center;justify-content:center;min-height:51px;padding:14px 24px;background:var(--ht-cp-red);color:#fff;border:1px solid var(--ht-cp-red);border-radius:9px;cursor:pointer;font:800 14px/1.3 "IBM Plex Sans",sans-serif;margin-top:14px;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;box-shadow:0 7px 20px rgba(190,32,57,.17);}
.ht-contact-page__form-content .wpcf7 input[type="submit"]:hover {background:#95192e;transform:translateY(-2px);box-shadow:0 10px 24px rgba(190,32,57,.22);}
.ht-contact-page__form-content .wpcf7 input[type="submit"]:focus-visible,.ht-contact-page a:focus-visible {outline:3px solid #748ce7;outline-offset:3px;}
.ht-contact-page__form-content .wpcf7 .wpcf7-spinner {vertical-align:middle;margin:0 0 0 12px;}
.ht-contact-page__form-content .wpcf7 form .wpcf7-response-output {border-radius:10px;padding:14px;margin:16px 0 0;line-height:1.5;}
.ht-contact-page__form-unavailable {padding:18px;background:#fff7f8;border:1px solid #efd0d7;border-radius:9px;}
.ht-contact-page__cta {background:#e9ecf5;padding:clamp(42px,4vw,68px) 0;}
.ht-contact-page__cta-inner {display:flex;justify-content:space-between;align-items:center;gap:30px;}
.ht-contact-page__cta-eyebrow {display:block;color:var(--ht-cp-blue);font-size:11px;font-weight:800;letter-spacing:.12em;margin-bottom:9px;}
.ht-contact-page__cta h2 {font-size:clamp(25px,2.4vw,38px);line-height:1.25;font-weight:800;margin:0 0 8px;}
.ht-contact-page__cta p {font-size:15px;color:#5c6480;line-height:1.6;margin:0;}
.ht-contact-page__cta-actions {display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.ht-contact-page__button {min-height:50px;padding:13px 23px;display:inline-flex;align-items:center;justify-content:center;gap:14px;border:1px solid var(--ht-cp-navy);border-radius:9px;white-space:nowrap;font-size:14px;font-weight:800;text-decoration:none;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;}
.ht-contact-page__button--red {background:var(--ht-cp-red);border-color:var(--ht-cp-red);color:#fff!important;box-shadow:0 8px 18px rgba(190,32,57,.12);}
.ht-contact-page__button--red:hover {background:#981b32;transform:translateY(-2px);}
.ht-contact-page__button--outline {background:#fff;color:var(--ht-cp-navy)!important;}
.ht-contact-page__button--outline:hover {background:#f4f5fb;transform:translateY(-2px);}
@media (max-width:1050px) {
 .ht-contact-page__grid {grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px;}
 .ht-contact-page__form-panel {padding:26px;}
}
@media (max-width:850px) {
 .ht-contact-page__grid {grid-template-columns:1fr;gap:35px;}
 .ht-contact-page__details {padding-top:0;}
 .ht-contact-page__details-list {grid-template-columns:repeat(2,minmax(0,1fr));}
 .ht-contact-page__detail:last-child {grid-column:1/-1;}
 .ht-contact-page__qr {max-width:100%;}
 .ht-contact-page__cta-inner {align-items:flex-start;flex-direction:column;}
}
@media (max-width:600px) {
 .ht-contact-page__container {width:min(calc(100% - 32px),1580px);}
 .ht-contact-page__hero {padding:55px 0 65px;}
 .ht-contact-page__hero h1 {font-size:clamp(31px,9.5vw,45px);}
 .ht-contact-page__hero-subtitle {font-size:14px;}
 .ht-contact-page__main {padding:53px 0 66px;}
 .ht-contact-page__details-list {grid-template-columns:1fr;gap:10px;}
 .ht-contact-page__detail:last-child {grid-column:auto;}
 .ht-contact-page__detail {padding:15px;}
 .ht-contact-page__form-panel {padding:24px 17px;border-radius:14px;}
 .ht-contact-page__form-content .wpcf7 .row {grid-template-columns:1fr;gap:14px;}
 .ht-contact-page__form-content .wpcf7 .row > .col-md-12 {grid-column:auto;}
 .ht-contact-page__form-content .wpcf7 input[type="submit"] {width:100%;}
 .ht-contact-page__cta-actions {width:100%;}
 .ht-contact-page__button {flex:1;}
}
@media (max-width:370px) {
 .ht-contact-page__qr {gap:10px;flex-wrap:wrap;}
 .ht-contact-page__qr strong {font-size:15px;}
 .ht-contact-page__button {padding-inline:12px;font-size:13px;}
}
@media (prefers-reduced-motion:reduce) {
 .ht-contact-page *, .ht-contact-page *::before,.ht-contact-page *::after {transition:none!important;animation:none!important;}
}

.ht-contact-page .ht-contact-page__validation:not([hidden]) { color:#78162b; background:#fff0f3; border:1px solid #be2039; border-radius:8px; padding:14px; margin:0 0 20px; font-size:14px; line-height:1.6; }
.ht-contact-page .wpcf7-form [aria-invalid='true'] { border-color:#be2039; }