/* Contact page: clear channels, warm editorial imagery, a calm enquiry workspace. */
.contact-page main{container:contact-content / inline-size}
.contact-page .breadcrumbs{padding-block:18px}
.contact-hero{background:#ede9df;border-block:1px solid #d6d9cd;padding-block:clamp(36px,4.5vw,68px)}
.contact-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5.2vw,80px);align-items:center}
.contact-hero-grid>*{min-width:0}
.contact-hero-copy .eyebrow{color:#70533c;font-size:.9375rem;letter-spacing:.075em;max-width:32em;margin-bottom:23px}
.contact-hero h1{font-size:clamp(2.7rem,4.7vw,5rem);font-weight:600;line-height:1.08;letter-spacing:-.05em;max-width:12ch;margin-bottom:26px;text-wrap:initial}
.contact-hero-copy>p{font-size:1.1875rem;line-height:1.85;max-width:43ch;color:#4a615f;margin-bottom:28px}
.contact-hero-action{background:var(--navy-deep);color:#fff;gap:24px;min-height:56px}
.contact-hero-action svg{width:22px;height:22px;flex:0 0 22px}
.contact-hero-photo{border-radius:5px;overflow:hidden;background:var(--navy-deep)}
.contact-hero-photo>img{display:block;width:100%;height:clamp(230px,22vw,340px);object-fit:cover;object-position:center}
.contact-hero-photo figcaption{padding:24px 28px;color:#fff}
.contact-hero-photo figcaption span{display:block;font-size:.875rem;line-height:1.6;letter-spacing:.09em;font-weight:650;color:#b4d9ce;margin-bottom:7px}
.contact-hero-photo figcaption strong{display:block;font-size:1.25rem;line-height:1.6;font-weight:500}
.contact-page .contact-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,4.5vw,68px);padding-block:clamp(56px,6vw,92px);align-items:start}
.contact-information-heading{margin-bottom:32px}
.contact-information>*{min-width:0;max-width:100%}
.contact-information-heading>.eyebrow{color:var(--accent);font-size:.9375rem;margin-bottom:12px}
.contact-information-heading h2{font-size:clamp(2.1rem,3.1vw,3rem);line-height:1.2;margin:0}
.contact-method{padding:clamp(24px,2.8vw,38px);border-radius:5px;margin-bottom:20px}
.contact-method-heading{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.contact-method-heading svg{width:25px;height:25px;flex:0 0 25px}
.contact-method-heading h3{min-width:0;font-size:.875rem;font-weight:700;letter-spacing:.06em;line-height:1.8;margin:0;padding-top:1px}
.contact-method-phone{background:var(--navy-deep);color:#fff}
.contact-method-phone .contact-method-heading{color:#b5dfd4}
.contact-phone-link{display:block;width:fit-content;max-width:100%;font-size:clamp(1.75rem,2.8vw,2.7rem);font-weight:550;letter-spacing:-.035em;line-height:1.5;color:#fff;margin-bottom:14px;text-decoration-thickness:1px;text-underline-offset:6px}
.contact-method-phone p{color:#d0dfda}
.contact-method-whatsapp{background:#e2ece4;border:1px solid #c4d5c8;color:var(--navy-deep)}
.contact-method-email{grid-column:1/-1;background:#f1eadf;border:1px solid #d9d0c2;color:var(--navy-deep)}
.contact-email-link{display:block;width:fit-content;max-width:100%;min-height:44px;padding-block:7px;margin-bottom:10px;font-size:clamp(1rem,1.25vw,1.125rem);font-weight:600;line-height:1.65;color:var(--teal);text-decoration:underline;text-underline-offset:5px}
.contact-channel-link{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:clamp(1.35rem,1.8vw,1.8rem);font-weight:600;line-height:1.5;letter-spacing:-.025em;margin-bottom:14px}
.contact-channel-link svg,.contact-map-link svg{width:23px;height:23px;flex:0 0 23px}
.contact-method p{font-size:1.0625rem;line-height:1.8;margin:0;max-width:34ch}
.contact-location{padding:clamp(24px,2.8vw,38px);border:1px solid var(--line);border-radius:5px;background:#fff}
.contact-location .contact-method-heading{color:#4c6862;margin-bottom:20px}
.contact-location address{font-style:normal;font-size:1.125rem;line-height:1.85;margin-bottom:18px}
.contact-location address strong{display:block;font-size:1.1875rem;font-weight:600;color:var(--navy)}
.contact-location address span{display:block;color:var(--body)}
.contact-map-link{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:48px;font-weight:600;font-size:1rem;color:var(--teal);padding-block:8px;text-decoration:underline;text-underline-offset:5px}
.contact-page .contact-form{margin:0;width:100%;max-width:none;padding:clamp(24px,3.4vw,50px);border:1px solid #c4d2c9;border-top:4px solid #507e6b;box-shadow:0 12px 42px #173b4308;border-radius:5px;background:#fff}
.contact-page .contact-form>.eyebrow{color:#4c6862;font-size:.9375rem;letter-spacing:.07em;margin-bottom:14px}
.contact-page .contact-form h2{font-size:clamp(2rem,2.7vw,2.8rem);font-weight:600;line-height:1.2;margin-bottom:18px}
.contact-page .contact-form>p{font-size:1.0625rem;line-height:1.8;margin-bottom:28px}
.contact-page #project-form{border-top:1px solid #dce4dd;padding-top:24px}
.contact-page .form-required{font-size:.9375rem;margin-bottom:24px;color:#52665e}
.contact-page .form-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.contact-page .field{margin-bottom:24px;gap:9px}
.contact-page .field label{font-size:1rem;color:var(--navy);font-weight:650;line-height:1.7}
.contact-page .field input,.contact-page .field select,.contact-page .field textarea{background:#f7f9f5;border:1px solid #afc1b5;border-radius:4px;min-height:58px;font-size:1.0625rem;padding:14px 16px;line-height:1.75;box-shadow:none}
.contact-page .field input:focus,.contact-page .field select:focus,.contact-page .field textarea:focus{background:#fff;border-color:#35694f;outline:3px solid #bfdaca;outline-offset:2px}
.contact-page .field textarea{min-height:180px}
.contact-page .field-hint{align-self:flex-end;font-size:.875rem;color:#52665e}
.contact-page .form-note{font-size:.9375rem;line-height:1.85;color:#52665e;margin-bottom:26px}
.contact-page #project-form>button[type=submit]{width:100%;justify-content:center;font-size:1.0625rem;min-height:58px;background:var(--navy-deep);color:#fff}
.contact-page .message-preview{background:#edf4ed;border:1px solid #b9d1be;padding:clamp(18px,2.5vw,32px);margin-top:24px}
.contact-page .faq-layout{padding-block:64px;border-top:1px solid #c7d4ca;gap:clamp(32px,6vw,90px)}
.contact-page .faq-layout h2{font-size:clamp(2.1rem,3vw,3rem)}
.contact-page .faq-layout details:first-child{border-top:1px solid #b3c2bb}
.contact-method-phone a:focus-visible{outline-color:#c3eed7}
@media(hover:hover){.contact-phone-link:hover{color:#c3eed7;text-decoration:underline}.contact-channel-link:hover{color:#006453;text-decoration:underline;text-underline-offset:6px}.contact-page #project-form>button[type=submit]:hover{background:#215b52}}
@media(max-width:1200px){.contact-page .form-row{grid-template-columns:1fr;gap:0}}
@media(max-width:900px){
 .contact-hero-grid{grid-template-columns:1fr;gap:30px}
 .contact-hero h1{max-width:18ch;font-size:clamp(2.7rem,6.8vw,4.2rem)}
 .contact-hero-copy>p{max-width:55ch}
 .contact-hero-photo{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:stretch}
 .contact-hero-photo>img{height:100%;min-height:190px;max-height:270px}
 .contact-hero-photo figcaption{align-content:center;padding:24px}
 .contact-page .contact-layout{grid-template-columns:1fr;gap:40px}
 .contact-information{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
 .contact-information-heading{grid-column:1/-1;margin-bottom:8px}
 .contact-method{margin:0}
 .contact-location{grid-column:1/-1}
 .contact-page .form-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
}
@media(max-width:600px){
 .contact-hero{padding-block:34px}
 .contact-hero-copy .eyebrow{font-size:.875rem;letter-spacing:.055em;max-width:25em}
 .contact-hero h1{font-size:clamp(2.6rem,10vw,3.6rem);max-width:13ch;margin-bottom:22px}
 .contact-hero-copy>p{font-size:1.125rem;line-height:1.8}
 .contact-hero-action{width:100%;justify-content:space-between;font-size:1rem;padding:16px 20px}
 .contact-hero-photo{display:block}
 .contact-hero-photo>img{height:auto;aspect-ratio:1.75;min-height:0;max-height:none}
 .contact-hero-photo figcaption{padding:19px 22px}
 .contact-hero-photo figcaption strong{font-size:1.125rem}
 .contact-page .contact-layout{padding-block:48px;gap:32px}
 .contact-information{grid-template-columns:minmax(0,1fr);gap:16px}
 .contact-information-heading{margin-bottom:12px}
 .contact-information-heading h2{font-size:2.15rem}
 .contact-method,.contact-location{padding:24px}
 .contact-phone-link{font-size:clamp(1.8rem,7.8vw,2.5rem)}
 .contact-channel-link{font-size:1.5rem}
 .contact-location{display:block}
 .contact-page .contact-form{padding:28px 22px}
 .contact-page .contact-form h2{font-size:2rem}
 .contact-page .form-row{grid-template-columns:1fr;gap:0}
 .contact-page .field input,.contact-page .field select,.contact-page .field textarea{padding-inline:12px}
 .contact-page .faq-layout{padding-block:44px}
}
@media(max-width:350px){.contact-method,.contact-location{padding:22px 20px}.contact-page .contact-form{padding:26px 18px}.contact-channel-link{font-size:1.4rem;gap:12px}}
/* Adapt columns to the reader's text size as well as the viewport width.
   Rem-based container queries also respond to enlarged root text; the pixel
   media queries above remain a fallback for browsers without this feature. */
@container contact-content (max-width:56.25rem){
 .contact-page .contact-layout{grid-template-columns:minmax(0,1fr);gap:40px}
 .contact-hero-grid{grid-template-columns:minmax(0,1fr);gap:30px}
 .contact-information{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:20px}
 .contact-information-heading{grid-column:1/-1;margin-bottom:8px}
 .contact-method{margin:0}
 .contact-location{grid-column:1/-1}
 .contact-page .form-row{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))}
}
@container contact-content (max-width:37.5rem){
 .contact-hero-photo{display:block}
 .contact-hero-photo>img{height:auto;aspect-ratio:1.75;min-height:0;max-height:none}
 .contact-information{grid-template-columns:minmax(0,1fr);gap:16px}
 .contact-location{display:block}
 .contact-page .form-row{grid-template-columns:minmax(0,1fr);gap:0}
}