/* Squirrel Tree Care · Contact page. Self-contained to avoid changing the approved homepage. */
:root {
  --pine: #193820;
  --pine-dark: #102b1a;
  --lilac: #db8cdb;
  --cream: #f7f4ee;
  --cream-deep: #efeae1;
  --line: rgba(25, 56, 32, .28);
  --content: 1360px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--pine); background: var(--cream); font-family: 'DM Sans', Arial, sans-serif; }
img { display:block; max-width:100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--lilac); outline-offset: 3px; }

.contact-header {
  min-height: 220px;
  border-bottom: 1px solid var(--lilac);
  background-color: var(--pine);
  background-image: radial-gradient(circle at 22% 18%, rgba(255,255,255,.035), transparent 48%), linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.045));
}
.contact-header-inner { max-width: 1620px; margin:0 auto; padding: 25px clamp(20px,6vw,80px); display:flex; justify-content:space-between; align-items:flex-start; gap: 20px; }
.contact-brand { display:block; flex: 0 0 auto; }
.contact-brand img { width: min(185px, 31vw); height:auto; }
.back-home { align-self:flex-start; display:inline-flex; align-items:center; justify-content:center; gap:14px; margin-top:30px; padding: 15px 22px; border: 1px solid var(--lilac); border-radius:5px; color:var(--cream); text-transform:uppercase; font-size:13px; font-weight:700; letter-spacing:.06em; white-space:nowrap; transition:background .2s,color .2s; }
.back-home:hover, .back-home:focus-visible { background:var(--lilac); color:var(--pine); }
.back-home span { font-size:19px; font-weight:400; }

.contact-main { min-height: 600px; padding: clamp(66px, 7vw, 116px) clamp(20px, 6vw, 90px) 86px; background: var(--cream); }
.contact-container { width:100%; max-width: var(--content); margin:0 auto; }
.contact-intro { max-width:950px; margin-bottom:65px; }
.eyebrow { margin:0 0 22px; color:var(--lilac); text-transform:uppercase; letter-spacing:.19em; font-size:15px; font-weight:700; }
.contact-intro h1 { margin: 22px 0 30px; font-size: clamp(56px, 7.7vw, 118px); line-height:1.04; font-weight:600; letter-spacing:-.055em; }
.contact-intro h1 span { color:var(--lilac); }
.contact-lede { font-size: clamp(17px,1.5vw,24px); line-height:1.55; margin:0; color:#315b46; }

.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap: 34px 40px; }
.field { display:flex; flex-direction:column; min-width:0; gap:11px; }
.field-full { grid-column:1/-1; }
.field label { font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; color:var(--pine); }
.required-marker { color:#9c4e94; }
.field input, .field select, .field textarea { width:100%; min-height:67px; border:1px solid var(--line); border-radius:9px; padding:17px 19px; color:var(--pine); background: rgba(255,255,255,.22); outline:none; transition:border-color .2s, box-shadow .2s; }
.field input:hover, .field select:hover, .field textarea:hover { border-color:#708e76; }
.field input:focus, .field select:focus, .field textarea:focus { border-color:#965395; box-shadow:0 0 0 3px rgba(219,140,219,.2); }
.field select { cursor:pointer; appearance:auto; }
.field textarea { min-height:180px; resize:vertical; line-height:1.6; }
.field textarea::placeholder { color:#74857a; }
.bot-trap { display:none!important; }
.form-footer { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-top:32px; }
.form-footer p { color:#536e5d; font-size:13px; line-height:1.6; max-width:420px; }
.submit-quote { border:1px solid var(--lilac); border-radius:5px; background:var(--pine); color:var(--cream); padding:20px 25px; min-height:60px; display:inline-flex; align-items:center; gap:30px; justify-content:center; font-size:13px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; cursor:pointer; transition:background .2s,color .2s,transform .2s; }
.submit-quote:hover,.submit-quote:focus-visible { background:var(--lilac); color:var(--pine); transform:translateY(-1px); }
.submit-quote span { font-size:19px; font-weight:400; }
.contact-alternatives { margin-top:70px; padding-top:26px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; align-items:center; gap:14px 36px; }
.contact-alternatives p { margin:0; font-weight:600; }
.contact-alternatives a { font-weight:600; text-underline-offset:4px; }
.contact-alternatives a:hover { text-decoration:underline; color:#965395; }
.contact-footer { background: var(--pine); color:var(--cream); }
.contact-footer-inner { max-width:var(--content); margin:auto; padding:23px clamp(20px,6vw,80px); display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.17em; }

/* Confirmation page uses the same brand assets and stylesheet. */
.success-main { min-height: min(68vh,600px); }
.success-copy { max-width:800px; }
.success-copy h1 { font-size:clamp(54px,6.8vw,96px); }
.success-copy p { line-height:1.7; }
.success-back { margin-top:28px; }

@media (max-width:700px) {
  .contact-header { min-height:170px; }
  .contact-header-inner { padding:19px 6vw; align-items:flex-start; }
  .contact-brand img { width:135px; }
  .back-home { margin-top:18px; padding:13px 16px; font-size:11px; }
  .contact-main { padding:58px 6vw 70px; }
  .contact-intro { margin-bottom:40px; }
  .contact-intro h1 { font-size:clamp(48px,10vw,72px); margin:18px 0 22px; }
  .field-grid { grid-template-columns:minmax(0,1fr); gap:25px; }
  .form-footer { align-items:stretch; flex-direction:column; }
  .form-footer p { margin:0; }
  .submit-quote { width:100%; }
  .contact-alternatives { margin-top:50px; flex-direction:column; align-items:flex-start; }
}
@media (max-width:400px) {
  .contact-brand img { width:115px; }
  .back-home { gap:7px; font-size:10px; padding:11px 11px; margin-top:13px; }
  .contact-intro h1 { font-size:clamp(43px,11vw,55px); }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .submit-quote, .back-home { transition:none; }
}
