/* English localization and lead-form refinements. Loaded after styles.css. */
html[lang="en"] body {
  font-family: Inter, "Helvetica Neue", Arial, sans-serif;
  text-rendering: optimizeLegibility;
}

html[lang="en"] .site-header nav { gap: clamp(18px, 2.5vw, 36px); }
html[lang="en"] .site-header nav a { font-size: 14px; white-space: nowrap; }
html[lang="en"] .button { letter-spacing: -.01em; }
html[lang="en"] .hero-grid { grid-template-columns: .94fr 1.06fr; gap: 52px; }
html[lang="en"] .hero h1 {
  max-width: 700px;
  font-size: clamp(47px, 4.6vw, 68px);
  line-height: 1.04;
  letter-spacing: -.052em;
}
html[lang="en"] .hero h2 { font-size: clamp(22px, 2vw, 27px); }
html[lang="en"] .lead { max-width: 690px; font-size: 18px; line-height: 1.72; }
html[lang="en"] .hero-tags { gap: 16px; font-size: 13px; }
html[lang="en"] .pin span { line-height: 1.2; }
html[lang="en"] .trust-grid article { padding-inline: 20px; }
html[lang="en"] .trust-grid strong { font-size: 17px; line-height: 1.2; }
html[lang="en"] .trust-grid span { max-width: 190px; margin-inline: auto; font-size: 12px; line-height: 1.45; }
html[lang="en"] .coupon-copy h2 { font-size: clamp(35px, 3.6vw, 49px); line-height: 1.12; }
html[lang="en"] .coupon-copy p,
html[lang="en"] .coupon-copy li,
html[lang="en"] .coupon-card aside p { line-height: 1.62; }
html[lang="en"] .section-title { max-width: 980px; }
html[lang="en"] .section-title h2 { font-size: clamp(36px, 3.9vw, 52px); line-height: 1.12; }
html[lang="en"] .section-title > p:last-child { line-height: 1.55; }
html[lang="en"] .value-grid article { min-height: 335px; }
html[lang="en"] .value-grid h3 { margin-top: 38px; font-size: 21px; line-height: 1.18; }
html[lang="en"] .value-grid p { font-size: 15px; line-height: 1.65; }
html[lang="en"] .studio-tabs button span { line-height: 1.2; }
html[lang="en"] .studio-tabs button small { margin-top: 5px; line-height: 1.35; }
html[lang="en"] .solution-detail h3 { font-size: clamp(31px, 3vw, 43px); line-height: 1.12; }
html[lang="en"] .solution-detail > p,
html[lang="en"] .solution-detail li { line-height: 1.65; }
html[lang="en"] .phone-frame article b { line-height: 1.15; }
html[lang="en"] .performance-copy h2,
html[lang="en"] .commerce-copy h2 { font-size: clamp(37px, 3.8vw, 51px); line-height: 1.1; }
html[lang="en"] .performance-copy p,
html[lang="en"] .performance-copy li,
html[lang="en"] .commerce-copy > p { line-height: 1.65; }
html[lang="en"] .budget-core span { max-width: 240px; text-align: center; line-height: 1.35; }
html[lang="en"] .process-flow b { font-size: 16px; line-height: 1.25; }
html[lang="en"] .process-flow span { font-size: 12px; line-height: 1.4; }
html[lang="en"] .metrics article span { min-height: 38px; line-height: 1.25; }

/* Overseas enquiry form */
html[lang="en"] .contact-card {
  grid-template-columns: .82fr 1.18fr;
  gap: 48px;
  align-items: center;
}
html[lang="en"] .contact-copy h2 {
  font-size: clamp(38px, 3.7vw, 51px);
  letter-spacing: -.04em;
}
html[lang="en"] .contact-copy > p { font-size: 16px; line-height: 1.65; }
html[lang="en"] .contact-copy li { font-size: 15px; line-height: 1.45; }
.lead-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 17px 18px;
  padding: 32px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 27px;
  background: rgba(255,255,255,.98);
  color: var(--ink);
  box-shadow: 0 24px 60px rgba(31,0,7,.24);
}
.form-head,
.lead-form .wide { grid-column: 1 / -1; }
.form-head span {
  color: var(--red);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
}
.form-head h3 { margin: 5px 0 3px; font-size: 28px; line-height: 1.15; }
.form-head p { margin: 0; color: var(--muted); font-size: 13px; }
.field { min-width: 0; }
.field label {
  display: block;
  margin: 0 0 7px;
  color: #3b3032;
  font-size: 13px;
  font-weight: 800;
}
.field label em { color: var(--red); font-style: normal; }
.field input,
.field select,
.field textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #e0d5d7;
  border-radius: 12px;
  background: #fffafa;
  color: var(--ink);
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  outline: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.field input,
.field select { height: 50px; padding: 0 14px; }
.field textarea { min-height: 102px; padding: 13px 14px; resize: vertical; }
.field input::placeholder,
.field textarea::placeholder { color: #9b8f92; }
.field input:focus,
.field select:focus,
.field textarea:focus {
  border-color: var(--red);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(230,0,35,.09);
}
.field input:invalid:not(:placeholder-shown),
.field select:invalid:focus { border-color: #c33; }
.consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: #74686a;
  font-size: 12px;
  line-height: 1.45;
}
.consent input { flex: 0 0 auto; width: 17px; height: 17px; margin-top: 1px; accent-color: var(--red); }
.form-submit {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 20px 0 23px;
  border: 0;
  border-radius: 14px;
  background: var(--red);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 900;
  transition: transform .2s, box-shadow .2s, background .2s;
}
.form-submit i {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: var(--red);
  font-style: normal;
}
.form-submit:hover { transform: translateY(-2px); background: #c9001e; box-shadow: 0 12px 30px rgba(230,0,35,.24); }
.form-submit:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.form-note { margin: -4px 0 0; color: #8d8184; text-align: center; font-size: 11px; line-height: 1.4; }
.form-trap { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }

html[lang="en"] .footer-grid p,
html[lang="en"] .footer-grid a,
html[lang="en"] .footer-grid span,
html[lang="en"] .sources { line-height: 1.55; }

@media (max-width: 1100px) {
  html[lang="en"] .site-header nav.open { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html[lang="en"] .hero-grid { grid-template-columns: .92fr 1.08fr; gap: 24px; }
  html[lang="en"] .hero h1 { font-size: 48px; }
  html[lang="en"] .contact-card { grid-template-columns: .78fr 1.22fr; gap: 28px; }
  .lead-form { padding: 25px; gap: 15px; }
}

@media (max-width: 820px) {
  html[lang="en"] .hero-grid,
  html[lang="en"] .contact-card { grid-template-columns: 1fr; }
  html[lang="en"] .hero h1 { font-size: clamp(42px, 9.7vw, 59px); }
  html[lang="en"] .contact-copy { max-width: 720px; }
  .lead-form { padding: 28px; }
}

@media (max-width: 560px) {
  html[lang="en"] .site-header nav.open { grid-template-columns: 1fr; }
  html[lang="en"] .hero h1 { font-size: 39px; line-height: 1.05; }
  html[lang="en"] .hero h1 br { display: none; }
  html[lang="en"] .lead { font-size: 16px; }
  html[lang="en"] .trust-grid strong { font-size: 15px; }
  html[lang="en"] .coupon-copy h2,
  html[lang="en"] .section-title h2 { font-size: 32px; }
  html[lang="en"] .value-grid article { min-height: 0; }
  html[lang="en"] .contact-copy h2 { font-size: 34px; }
  .lead-form { grid-template-columns: 1fr; padding: 20px; gap: 15px; }
  .form-head,
  .lead-form .wide { grid-column: auto; }
  .form-head h3 { font-size: 25px; }
  .field input,
  .field select { height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
  .form-submit { transition: none; }
}
