/* ==========================================================================
   TESTING CENTRE HIRE — venue-hire / enquiry-conversion page
   ========================================================================== */

/* ------------------------------- Hero ------------------------------------ */
.tch-hero{
  background:var(--navy-900); color:#fff;
  padding-top:calc(var(--section-pad-y) + 4rem);
  padding-bottom:var(--space-8);
}
.tch-hero-inner{
  display:grid; grid-template-columns:1.05fr .95fr; gap:var(--space-8);
  align-items:center;
}
.tch-hero-copy h1{ font-size:var(--fs-hero); max-width:16ch; margin-top:1.25rem; }
.tch-hero-copy p{ margin-top:1.75rem; color:rgba(255,255,255,.65); font-size:var(--fs-body-lg); max-width:48ch; }
.tch-hero-ctas{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:2.25rem; }
.tch-hero-photo{ position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/5; }
.tch-hero-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
@media (max-width:900px){ .tch-hero-inner{ grid-template-columns:1fr; } }

.tch-hero-strip{
  margin-top:var(--space-8);
  padding-top:var(--space-6);
  border-top:1px solid var(--line-on-dark);
  display:flex; flex-wrap:wrap; gap:.6rem 2.2rem;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
.tch-hero-strip span{ display:flex; align-items:center; gap:.6rem; }
.tch-hero-strip span::before{ content:''; width:5px; height:5px; border-radius:50%; background:var(--sky-500); }

/* --------------------------- Positioning band ----------------------------- */
.tch-position{
  background:var(--navy-700); color:#fff;
  padding-block:var(--space-9);
  text-align:center; position:relative; overflow:hidden;
}
.tch-position blockquote{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.6rem, 2.6vw + .9rem, 2.9rem);
  max-width:26ch; margin-inline:auto; line-height:1.32;
}
.tch-position blockquote em{ font-style:italic; color:var(--sky-400); }
.tch-position .tch-position-tag{
  display:block; margin-top:2rem; font-family:var(--font-mono); font-size:.75rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--sky-400);
}

/* --------------------------------- Tags ----------------------------------- */
.tch-tags-head{ max-width:56ch; margin-bottom:var(--space-7); }
.tch-tags-head h2{ font-family:var(--font-display); font-size:var(--fs-display-lg); margin-top:1.1rem; max-width:17ch; }
.tch-tags{ display:flex; flex-wrap:wrap; gap:.7rem; }
.tch-tags .pill{ font-size:.78rem; padding:.7rem 1.15rem; }

/* ------------------------------- Facilities -------------------------------- */
.tch-facilities-wrap{ display:grid; grid-template-columns:.95fr 1.05fr; gap:var(--space-9); align-items:start; }
.tch-facilities-copy h2{ font-family:var(--font-display); font-size:var(--fs-display-lg); max-width:15ch; margin:1.25rem 0 2rem; }
.tch-checklist{ display:grid; grid-template-columns:1fr 1fr; gap:1rem 1.5rem; }
.tch-check-item{ display:flex; align-items:flex-start; gap:.75rem; padding-block:.35rem; }
.tch-check-item .check-ico{ flex:none; margin-top:.2rem; color:var(--sky-600); }
.tch-check-item span{ font-size:.95rem; color:var(--ink-soft); }
@media (max-width:560px){ .tch-checklist{ grid-template-columns:1fr; } }

.tch-photo-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.tch-photo-grid figure{ position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3; margin:0; }
.tch-photo-grid figure img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.tch-photo-grid figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:.85rem 1rem;
  background:linear-gradient(to top, rgba(8,11,26,.85), transparent);
  color:#fff; font-family:var(--font-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase;
}
@media (max-width:900px){ .tch-facilities-wrap{ grid-template-columns:1fr; } }

/* ---------------------------- Hire options strip --------------------------- */
.tch-hire{ background:var(--navy-800); color:#fff; }
.tch-hire-head{ max-width:54ch; margin-bottom:var(--space-7); }
.tch-hire-head h2{ font-family:var(--font-display); font-size:var(--fs-display-lg); margin-top:1.1rem; max-width:16ch; }
.tch-hire-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-on-dark-soft); border:1px solid var(--line-on-dark-soft); }
.tch-hire-option{ background:var(--navy-800); padding:1.85rem 1.75rem; transition:background .35s var(--ease-out); }
.tch-hire-option:hover{ background:var(--navy-700); }
.tch-hire-option .n{ font-family:var(--font-mono); font-size:.72rem; color:var(--sky-400); display:block; margin-bottom:.85rem; }
.tch-hire-option h3{ font-family:var(--font-display); font-size:1.15rem; }
@media (max-width:760px){ .tch-hire-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){ .tch-hire-grid{ grid-template-columns:1fr; } }

/* --------------------------------- Process --------------------------------- */
.tch-process{ background:var(--navy-900); color:#fff; }
.tch-process-head{ margin-bottom:var(--space-8); max-width:60ch; }
.tch-process-head h2{ font-family:var(--font-display); font-size:var(--fs-display-lg); margin-top:1.1rem; max-width:18ch; }
.tch-process-list{ position:relative; max-width:760px; }
.tch-process-list::before{
  content:''; position:absolute; left:23px; top:10px; bottom:10px; width:1px;
  background:var(--line-on-dark);
}
.tch-process-step{ position:relative; padding:0 0 var(--space-7) 4.25rem; }
.tch-process-step:last-child{ padding-bottom:0; }
.tch-process-step::before{
  content:attr(data-step); position:absolute; left:0; top:0; width:48px; height:48px;
  border-radius:50%; border:1px solid var(--line-on-dark); background:var(--navy-800);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:.8rem; color:var(--sky-400);
  transition:border-color .35s var(--ease-out), background .35s var(--ease-out);
}
.tch-process-step:hover::before{ border-color:var(--sky-500); background:var(--navy-700); }
.tch-process-step h3{ font-family:var(--font-display); font-size:1.25rem; margin-bottom:.55rem; }
.tch-process-step p{ color:rgba(255,255,255,.6); font-size:.94rem; max-width:44ch; }
@media (max-width:600px){
  .tch-process-list::before{ left:19px; }
  .tch-process-step{ padding-left:3.5rem; }
  .tch-process-step::before{ width:40px; height:40px; font-size:.72rem; }
}

/* ----------------------------------- Why ------------------------------------ */
/* Bento composition — a single generic 3x2 icon-card grid reads as filler this deep
   into the page, so one reason is promoted to a feature tile and the closing reason
   becomes a full-width banner, breaking the "third grid on the page" monotony. */
.tch-why-head{ max-width:56ch; margin-bottom:var(--space-7); }
.tch-why-head h2{ font-family:var(--font-display); font-size:var(--fs-display-lg); margin-top:1.1rem; max-width:18ch; }
.tch-why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-5); }
.tch-why-card{ padding:var(--space-7); transition:border-color .4s var(--ease-out), background .4s var(--ease-out); }
.tch-why-card:hover{ border-color:var(--sky-500); }
.tch-why-card .n{ display:block; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; color:var(--sky-600); margin-bottom:1.4rem; }
.tch-why-card .check-ico{ color:var(--sky-600); margin-bottom:1.1rem; width:22px; height:22px; }
.tch-why-card h3{ font-family:var(--font-display); font-size:1.15rem; }

.tch-why-card--feature{
  grid-column:span 2;
  background:linear-gradient(155deg, var(--navy-800), var(--navy-700));
  border-color:var(--navy-700); color:#fff;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.tch-why-card--feature .n{ color:var(--sky-400); }
.tch-why-card--feature .check-ico{ color:var(--sky-400); width:30px; height:30px; }
.tch-why-card--feature h3{ font-size:clamp(1.5rem, 1.3vw + 1rem, 2rem); max-width:14ch; }
.tch-why-card--feature:hover{ border-color:var(--sky-400); }

.tch-why-card--full{
  grid-column:1 / -1;
  background:var(--sky-100); border-color:transparent;
  display:flex; align-items:center; gap:1.75rem;
}
.tch-why-card--full .check-ico{ margin-bottom:0; flex:none; width:28px; height:28px; }
.tch-why-card--full .n{ margin-bottom:0; flex:none; }
.tch-why-card--full h3{ font-size:1.3rem; }
.tch-why-card--full:hover{ border-color:var(--sky-500); background:var(--sky-100); }

@media (max-width:900px){
  .tch-why-grid{ grid-template-columns:1fr 1fr; }
  .tch-why-card--feature{ grid-column:span 2; }
}
@media (max-width:560px){
  .tch-why-grid{ grid-template-columns:1fr; }
  .tch-why-card--feature, .tch-why-card--full{ grid-column:1; }
  .tch-why-card--full{ flex-direction:column; align-items:flex-start; text-align:left; }
}

/* -------------------------------- Enquiry ----------------------------------- */
.tch-enquiry{ background:var(--navy-900); color:#fff; padding-block:var(--section-pad-y-lg); position:relative; overflow:hidden; }
.tch-enquiry-wrap{ position:relative; z-index:2; display:grid; grid-template-columns:.85fr 1.15fr; gap:var(--space-9); align-items:start; }
.tch-enquiry-copy h2{ font-family:var(--font-display); font-size:var(--fs-display-lg); margin:1.25rem 0 1.75rem; max-width:13ch; }
.tch-enquiry-copy p{ color:rgba(255,255,255,.62); font-size:var(--fs-body-lg); max-width:40ch; margin-bottom:2rem; }
.tch-enquiry-direct{ font-size:.92rem; color:rgba(255,255,255,.75); display:flex; flex-direction:column; gap:.5rem; }
.tch-enquiry-direct a{ color:var(--sky-400); }
.tch-enquiry-form{ background:var(--surface-on-dark); border:1px solid var(--line-on-dark); border-radius:var(--radius-lg); padding:var(--space-7); backdrop-filter:blur(6px); }
.tch-enquiry-form .field label{ color:rgba(255,255,255,.55); }
.form-status{ margin-top:1.25rem; font-size:.88rem; color:var(--sky-400); min-height:1.2em; }
@media (max-width:900px){ .tch-enquiry-wrap{ grid-template-columns:1fr; } }