/* Homepage hero */
.hero { background:#102f2b; color:#fff; }
.heroSlider { position:relative; isolation:isolate; overflow:hidden; }
.hero .swiper-slide { height:clamp(620px,84svh,820px); }
.hero .swiper-slide img { width:100%; height:100%; object-fit:cover; }
.hero .swiper-slide::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#101110d9,#10111080 55%,#10111020),linear-gradient(0deg,#101110b8,transparent 45%); }
.hero-content { position:absolute; z-index:2; inset:0; display:flex; flex-direction:column; justify-content:center; max-width:1280px; margin:auto; padding:50px 48px 110px; pointer-events:none; }
.hero-eyebrow { margin:0 0 26px; color:#f1d4af; font-size:11px; font-weight:600; letter-spacing:2.2px; text-transform:uppercase; }
.hero-title { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(44px,5.5vw,78px); font-weight:500; line-height:1.08; letter-spacing:-3px; }
.hero-title span { color:#ddc58f; font-family:Georgia,serif; font-style:italic; font-weight:400; letter-spacing:-2px; }
.hero-description { max-width:480px; margin:26px 0 32px; color:#e6e2dc; font-size:16px; line-height:1.8; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:26px; }
.hero-actions a { pointer-events:auto; display:inline-flex; align-items:center; justify-content:center; gap:28px; min-height:50px; font-size:13px; font-weight:600; text-decoration:none; transition:background .2s,color .2s; }
.hero-primary { padding:14px 23px; background:#ddc58f; color:#102f2b; border:1px solid #ddc58f; border-radius:3px; }
.hero-primary:hover { background:#fff0dc; }
.hero-secondary { color:#fff; border-bottom:1px solid #ffffff65; }
.hero-secondary:hover { color:#ddc58f; }
.hero .swiper-button-next,.hero .swiper-button-prev { top:auto; bottom:30px; margin:0; width:46px; height:46px; border:1px solid #ffffff65; border-radius:50%; background:#ffffff0d; color:white; }
.hero .swiper-button-next { right:48px; }
.hero .swiper-button-prev { left:auto; right:104px; }
.hero .swiper-button-next::after,.hero .swiper-button-prev::after { font-size:14px; }
.hero .swiper-button-next:hover,.hero .swiper-button-prev:hover { background:#ffffff30; }
.hero .swiper-pagination { left:48px; bottom:32px; width:auto; display:flex; gap:8px; }
.hero .swiper-pagination-bullet { position:relative; width:38px; height:44px; background:transparent; border:0; border-radius:0; opacity:1; margin:0 !important; cursor:pointer; }
.hero .swiper-pagination-bullet::after { content:""; position:absolute; left:0; right:0; top:21px; height:2px; background:#ffffff65; }
.hero .swiper-pagination-bullet-active::after { background:#ddc58f; }
.hero-pause { position:absolute; z-index:10; left:200px; bottom:32px; min-width:60px; min-height:44px; color:#fff; background:transparent; border:1px solid #ffffff65; border-radius:3px; font-size:12px; cursor:pointer; }
.hero a:focus-visible,.hero button:focus-visible { outline:2px solid #ddc58f; outline-offset:4px; }
.heroSlider:not(.swiper-initialized) .swiper-slide:not(:first-child),.heroSlider:not(.swiper-initialized) .hero-pause { display:none; }
@media (max-width:767px) {
  .hero .swiper-slide { height:680px; }
  .hero-content { padding:48px 24px 120px; }
  .hero-title { font-size:clamp(40px,9vw,64px); letter-spacing:-1.8px; }
  .hero-title span { letter-spacing:-1px; }
  .hero-eyebrow { max-width:300px; font-size:10px; letter-spacing:1.5px; line-height:1.8; margin-bottom:22px; }
  .hero-description { font-size:14px; margin:22px 0 26px; }
  .hero-actions { gap:16px; }
  .hero .swiper-pagination { left:24px; bottom:24px; gap:6px; }
  .hero .swiper-pagination-bullet { width:24px; }
  .hero .swiper-button-next { right:24px; bottom:24px; }
  .hero .swiper-button-prev { right:78px; bottom:24px; }
  .hero-pause { left:126px; bottom:24px; min-width:52px; }
}
@media (prefers-reduced-motion:reduce) {
  .hero *, .hero *::after { transition:none !important; }
}

/* About section below the homepage hero */
.about-intro { padding:48px 48px 96px; background:#f8f5ef; color:#143d38; border-bottom:1px solid #e3dbcf; }
.about-intro-container { max-width:1184px; margin:0 auto; }
.about-intro-topline { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:24px; margin-bottom:64px; border-bottom:1px solid #cddbd5; }
.about-intro-kicker,.about-intro-since { font-size:11px; line-height:1.6; letter-spacing:1.6px; text-transform:uppercase; }
.about-intro-kicker { display:flex; align-items:center; gap:12px; font-weight:600; }
.about-intro-kicker::before { content:""; width:6px; height:6px; border-radius:50%; background:#327568; flex-shrink:0; }
.about-intro-since { color:#5b7069; }
.about-intro-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(40px,7vw,100px); align-items:center; }
.about-intro-eyebrow { color:#226257; font-size:11px; font-weight:600; letter-spacing:2.4px; text-transform:uppercase; }
.about-intro-title { margin:20px 0 0; font-family:'Space Grotesk',sans-serif; font-size:clamp(36px,3.8vw,54px); font-weight:500; line-height:1.15; letter-spacing:-2px; text-wrap:balance; }
.about-intro-title span { font-family:Georgia,serif; font-style:italic; font-weight:400; color:#226257; letter-spacing:-1.5px; }
.about-intro-rule { width:48px; height:2px; background:#bb946a; margin:28px 0; }
.about-intro-lead { margin:0 0 18px; font-size:17px; line-height:1.85; color:#403b34; }
.about-intro-copy { margin:0 0 16px; font-size:14px; line-height:1.9; color:#5b7069; }
.about-intro-link { display:inline-flex; align-items:center; gap:30px; min-height:48px; margin-top:16px; border-bottom:1px solid #327568; color:#143d38; font-size:13px; font-weight:600; text-decoration:none; transition:color .2s; }
.about-intro-link span { font-size:20px; }
.about-intro-link:hover { color:#226257; }
.about-intro-link:focus-visible { outline:2px solid #226257; outline-offset:6px; }
.about-intro-values { padding:32px; border:1px solid #e1d8cb; border-radius:6px; background:linear-gradient(135deg,#edf3ef,#eee5d8); }
.about-values-label { margin:0 0 8px; font-size:10px; font-weight:600; letter-spacing:1.8px; text-transform:uppercase; color:#5b7069; }
.about-value { display:grid; grid-template-columns:40px minmax(0,1fr); column-gap:16px; padding:30px 0; border-bottom:1px solid #d9cebd; }
.about-value:last-child { border-bottom:0; padding-bottom:8px; }
.about-value-number { grid-column:1; grid-row:1 / span 2; display:flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid #cbb99f; border-radius:50%; color:#226257; font-size:11px; font-variant-numeric:tabular-nums; }
.about-value h3 { grid-column:2; margin:2px 0 10px; font-family:'Space Grotesk',sans-serif; font-size:23px; line-height:1.3; font-weight:500; letter-spacing:-.6px; }
.about-value p { grid-column:2; margin:0; font-size:14px; line-height:1.8; color:#526760; }
@media (max-width:900px) {
  .about-intro { padding:36px 32px 64px; }
  .about-intro-topline { margin-bottom:40px; }
  .about-intro-grid { grid-template-columns:1fr; gap:36px; }
  .about-intro-story { max-width:640px; }
}
@media (max-width:480px) {
  .about-intro { padding:28px 24px 48px; }
  .about-intro-topline { align-items:flex-start; flex-direction:column; gap:8px; margin-bottom:32px; padding-bottom:20px; }
  .about-intro-title { font-size:36px; letter-spacing:-1.5px; }
  .about-intro-lead { font-size:16px; }
  .about-intro-values { padding:24px 20px; }
  .about-value { column-gap:12px; grid-template-columns:36px minmax(0,1fr); padding:24px 0; }
  .about-value h3 { font-size:21px; }
}
@media (prefers-reduced-motion:reduce) {
  .about-intro-link { transition:none; }
}

/* Homepage contact section */
.contact-intro { padding:96px 48px; background:#26251f; color:#f7f2e9; }
.contact-intro-container { max-width:1184px; margin:auto; display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(40px,7vw,96px); align-items:start; }
.contact-kicker { margin:0 0 26px; color:#d4b48d; font-size:10px; letter-spacing:2px; line-height:1.8; text-transform:uppercase; }
.contact-intro h2 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(38px,4.3vw,60px); font-weight:500; line-height:1.12; letter-spacing:-2px; }
.contact-intro h2 span { color:#ddc58f; font-family:Georgia,serif; font-style:italic; font-weight:400; letter-spacing:-1.5px; }
.contact-intro-description { margin:26px 0 36px; max-width:420px; color:#d0cbc2; font-size:15px; line-height:1.9; }
.contact-details { border-top:1px solid #ffffff24; }
.contact-detail { display:flex; align-items:center; gap:20px; padding:23px 0; border-bottom:1px solid #ffffff24; }
.contact-icon { display:grid; place-items:center; width:46px; height:46px; flex-shrink:0; color:#e1bd91; border:1px solid #d4b48d55; border-radius:50%; }
.contact-icon svg { width:21px; height:21px; }
.contact-detail h3 { margin:0 0 6px; font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:1.8px; color:#d4b48d; }
.contact-detail address,.contact-detail a { color:#eee8df; font-size:14px; line-height:1.8; font-style:normal; text-decoration:none; overflow-wrap:anywhere; }
.contact-detail a { display:inline-block; padding:4px 0; }
.contact-detail a span { margin-left:12px; color:#d4b48d; }
.contact-detail a:hover { color:#ddc58f; text-decoration:underline; text-underline-offset:4px; }
.contact-detail a:focus-visible { outline:2px solid #ddc58f; outline-offset:5px; }
.contact-signoff { margin:28px 0 0; font-family:Georgia,serif; font-size:18px; font-style:italic; color:#c9b69c; }
.contact-form-card { min-width:0; padding:40px; background:#f7faf9; border:1px solid #e9dfd0; border-radius:8px; color:#143d38; box-shadow:0 20px 50px #00000015; }
.contact-form-eyebrow { margin:0 0 12px; font-size:10px; color:#226257; letter-spacing:2px; text-transform:uppercase; font-weight:600; }
.contact-form-card h3 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:500; line-height:1.25; letter-spacing:-1px; }
.contact-form-description { margin:12px 0 28px; font-size:13px; line-height:1.7; color:#5b7069; }
.contact-enquiry { display:grid; gap:20px; }
.contact-form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.contact-field { min-width:0; }
.contact-field label { display:block; margin-bottom:8px; font-size:12px; font-weight:500; }
.contact-field label span { color:#5b7069; font-weight:400; font-size:11px; }
.contact-field input,.contact-field select,.contact-field textarea { display:block; box-sizing:border-box; width:100%; min-height:48px; border:1px solid #c7d8d0; border-radius:4px; padding:12px 14px; background:#fffdfa; color:#143d38; font-family:inherit; font-size:14px; line-height:1.5; }
.contact-field textarea { resize:vertical; min-height:120px; }
.contact-field input::placeholder,.contact-field textarea::placeholder { color:#81766a; opacity:1; }
.contact-field input:focus,.contact-field select:focus,.contact-field textarea:focus { outline:2px solid #327568; outline-offset:2px; border-color:#327568; }
.contact-submit { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:50px; padding:14px 20px; background:#37352e; color:#faf5eb; border:0; border-radius:4px; font-size:13px; font-weight:500; }
.contact-submit:disabled { background:#625d52; cursor:not-allowed; }
.contact-submit span { font-size:19px; }
.contact-form-note { margin:0; color:#5b7069; font-size:12px; line-height:1.7; }
@media (max-width:900px) {
  .contact-intro { padding:64px 32px; }
  .contact-intro-container { grid-template-columns:1fr; gap:40px; }
  .contact-intro-story { max-width:640px; }
}
@media (max-width:480px) {
  .contact-intro { padding:48px 24px; }
  .contact-intro h2 { font-size:38px; letter-spacing:-1.5px; }
  .contact-kicker { letter-spacing:1.4px; }
  .contact-form-card { padding:26px 20px; }
  .contact-form-card h3 { font-size:25px; }
  .contact-form-row { grid-template-columns:1fr; gap:20px; }
  .contact-field input,.contact-field select,.contact-field textarea { font-size:16px; }
  .contact-detail { gap:14px; }
}

/* Project film preview; ready for the supplied video. */
.film-section { padding:88px 48px; background:#e8f0ed; color:#143d38; }
.film-container { max-width:1184px; margin:auto; }
.film-heading { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:64px; margin-bottom:36px; }
.film-eyebrow { margin:0 0 20px; color:#226257; font-size:10px; font-weight:600; letter-spacing:2px; line-height:1.8; text-transform:uppercase; }
.film-heading h2 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(36px,4vw,56px); font-weight:500; line-height:1.12; letter-spacing:-2px; }
.film-heading h2 span { font-family:Georgia,serif; font-style:italic; font-weight:400; color:#226257; letter-spacing:-1.5px; }
.film-description { max-width:390px; margin:0 0 4px auto; font-size:15px; line-height:1.9; color:#526760; }
.film-feature { margin:0; }
.film-preview { position:relative; aspect-ratio:16 / 8; overflow:hidden; border-radius:6px; background:#302d26; }
.film-preview img { width:100%; height:100%; object-fit:cover; display:block; }
.film-preview-shade { position:absolute; inset:0; background:linear-gradient(0deg,#171a16d9,transparent 85%),linear-gradient(90deg,#171a164d,transparent 80%); }
.film-preview-copy { position:absolute; left:40px; right:40px; bottom:64px; color:#fff8eb; }
.film-badge { display:inline-block; padding:7px 12px; border:1px solid #ffffff65; border-radius:3px; background:#25251fcc; font-size:10px; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; }
.film-preview-copy p { margin:18px 0 0; font-family:'Space Grotesk',sans-serif; font-size:clamp(28px,3.5vw,46px); line-height:1.2; letter-spacing:-1.2px; }
.film-preview-copy p span { color:#f0d4af; font-family:Georgia,serif; font-style:italic; }
.film-preview-label { position:absolute; left:40px; bottom:24px; color:#f1e7d9; font-size:10px; letter-spacing:1.8px; text-transform:uppercase; }
.film-caption { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 0 0; }
.film-caption-label { color:#226257; font-size:10px; letter-spacing:1.6px; text-transform:uppercase; font-weight:600; }
.film-caption p { margin:8px 0 0; color:#526760; font-size:14px; line-height:1.7; }
.film-caption a { display:inline-flex; align-items:center; gap:24px; min-height:48px; flex-shrink:0; border-bottom:1px solid #327568; color:#143d38; font-size:13px; font-weight:600; text-decoration:none; }
.film-caption a:hover { color:#226257; }
.film-caption a:focus-visible { outline:2px solid #226257; outline-offset:5px; }
@media (max-width:900px) {
  .film-section { padding:64px 32px; }
  .film-heading { grid-template-columns:1fr; gap:24px; }
  .film-description { margin:0; max-width:560px; }
  .film-preview { aspect-ratio:4 / 3; }
}
@media (max-width:480px) {
  .film-section { padding:48px 24px; }
  .film-heading { margin-bottom:28px; }
  .film-eyebrow { letter-spacing:1.3px; }
  .film-heading h2 { font-size:36px; letter-spacing:-1.5px; }
  .film-preview { aspect-ratio:3 / 4; }
  .film-preview-copy { left:24px; right:24px; bottom:64px; }
  .film-preview-copy p { font-size:32px; }
  .film-preview-label { left:24px; font-size:9px; letter-spacing:1.2px; }
  .film-caption { align-items:flex-start; flex-direction:column; gap:14px; }
}

/* YouTube player and client stories */
.film-play { position:absolute; right:40px; top:36px; display:grid; place-items:center; width:76px; height:76px; border:1px solid #ffffffa6; border-radius:50%; background:#143d38cc; color:#fff2df; cursor:pointer; transition:background .2s,transform .2s; }
.film-play[hidden] { display:none; }
.film-play svg { width:30px; height:30px; }
.film-play:hover { background:#226257; transform:scale(1.05); }
.film-play:focus-visible { outline:3px solid #ddc58f; outline-offset:5px; }
.film-preview.is-playing { aspect-ratio:16 / 9; }
.film-preview iframe { display:block; position:absolute; inset:0; width:100%; height:100%; border:0; }
.testimonials { padding:88px 48px; background:#f7faf9; color:#143d38; }
.testimonials-container { max-width:1184px; margin:auto; }
.testimonials-heading { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:64px; margin-bottom:40px; }
.testimonials-eyebrow { margin:0 0 20px; font-size:10px; font-weight:600; letter-spacing:2px; color:#226257; text-transform:uppercase; }
.testimonials-heading h2 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(36px,4vw,54px); line-height:1.13; font-weight:500; letter-spacing:-2px; }
.testimonials-heading h2 span { font-family:Georgia,serif; font-style:italic; font-weight:400; letter-spacing:-1.5px; color:#226257; }
.testimonials-intro { max-width:380px; margin:0 0 4px auto; font-size:14px; line-height:1.9; color:#5b7069; }
.testimonial-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.testimonial-card { display:flex; flex-direction:column; padding:30px 26px; background:#edf3ef; border:1px solid #e1d7c8; border-radius:6px; }
.testimonial-placeholder { align-self:flex-start; font-size:9px; line-height:1.6; font-weight:500; text-transform:uppercase; letter-spacing:1px; color:#78634b; border-bottom:1px solid #cdbcaa; padding-bottom:6px; }
.testimonial-quote { display:block; height:64px; margin-top:20px; font-family:Georgia,serif; color:#a17b4f; font-size:86px; line-height:1; }
.testimonial-card h3 { margin:0 0 14px; font-family:'Space Grotesk',sans-serif; font-size:21px; font-weight:500; line-height:1.4; letter-spacing:-.5px; }
.testimonial-copy { margin:0 0 28px; color:#526760; font-size:14px; line-height:1.9; }
.testimonial-person { display:flex; align-items:center; gap:12px; margin-top:auto; border-top:1px solid #d9cebd; padding-top:22px; }
.testimonial-avatar { display:grid; place-items:center; flex-shrink:0; width:40px; height:40px; border-radius:50%; background:#e6dbc9; color:#226257; font-size:12px; }
.testimonial-person p { margin:0; font-size:12px; font-weight:600; line-height:1.6; }
.testimonial-person div > span { font-size:11px; color:#5b7069; }
.testimonials-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:30px; }
.testimonials-footer p { margin:0; color:#5b7069; font-family:Georgia,serif; font-style:italic; font-size:19px; }
.testimonials-footer a { display:inline-flex; gap:20px; align-items:center; min-height:48px; border-bottom:1px solid #327568; color:#143d38; font-size:13px; font-weight:600; text-decoration:none; }
.testimonials-footer a:hover { color:#226257; }
.testimonials-footer a:focus-visible { outline:2px solid #226257; outline-offset:5px; }
@media (max-width:900px) {
  .testimonials { padding:64px 32px; }
  .testimonials-heading { grid-template-columns:1fr; gap:24px; }
  .testimonials-intro { margin:0; max-width:560px; }
  .testimonial-grid { grid-template-columns:1fr; }
}
@media (max-width:480px) {
  .testimonials { padding:48px 24px; }
  .testimonials-heading h2 { font-size:36px; letter-spacing:-1.5px; }
  .testimonial-card { padding:26px 22px; }
  .testimonials-footer { align-items:flex-start; flex-direction:column; gap:12px; }
  .film-play { right:24px; top:24px; width:60px; height:60px; }
}
@media (prefers-reduced-motion:reduce) { .film-play { transition:none; } }

/* Homepage header and footer */
.site-header { position:sticky; top:0; z-index:40; background:#f7faf9f5; backdrop-filter:blur(16px); border-bottom:1px solid #cddbd5; padding:0 48px; }
.site-header-inner { max-width:1184px; min-height:88px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:28px; }
.site-wordmark { display:inline-block; color:inherit; text-decoration:none; font-family:'Space Grotesk',sans-serif; font-size:32px; font-weight:600; line-height:1.1; letter-spacing:-1.8px; }
.site-wordmark > span { font-family:inherit; }
.brand-dot { color:#327568; }
.site-wordmark small { display:block; margin-top:7px; color:#5b7069; font-size:8px; font-weight:500; line-height:1.4; letter-spacing:1.7px; text-transform:uppercase; }
.site-desktop-links { display:flex; align-items:center; gap:26px; list-style:none; margin:0; padding:0; }
.site-desktop-links a { display:block; padding:16px 0; text-decoration:none; color:#526760; font-size:12px; position:relative; }
.site-desktop-links a[aria-current],.site-desktop-links a:hover { color:#226257; }
.site-desktop-links a[aria-current]::after { content:""; position:absolute; height:2px; bottom:7px; left:0; right:0; background:#327568; }
.site-header-cta,.site-mobile-cta { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:46px; padding:12px 18px; border:1px solid #143d38; background:#143d38; color:#fff4e4; border-radius:3px; font-size:12px; text-decoration:none; }
.site-header-cta:hover,.site-mobile-cta:hover { background:#226257; border-color:#226257; }
.site-menu-toggle { display:none; width:44px; height:44px; padding:10px; border:1px solid #c7d8d0; border-radius:3px; background:transparent; cursor:pointer; }
.site-menu-toggle svg { width:24px; height:24px; }
.site-menu-overlay { position:fixed; inset:0; z-index:45; background:#171a1673; }
.site-mobile-menu { position:fixed; inset:0 0 0 auto; z-index:50; width:min(88vw,380px); height:100dvh; padding:24px; overflow-y:auto; background:#f7faf9; color:#143d38; box-shadow:-16px 0 60px #0000001a; }
.site-mobile-top { display:flex; align-items:center; justify-content:space-between; padding-bottom:24px; border-bottom:1px solid #cddbd5; }
.site-mobile-top button { width:44px; height:44px; border:1px solid #c7d8d0; border-radius:50%; background:transparent; cursor:pointer; }
.site-menu-eyebrow { margin:30px 0 14px; color:#226257; font-size:10px; text-transform:uppercase; letter-spacing:2px; }
.site-mobile-menu ul { margin:0 0 24px; padding:0; list-style:none; }
.site-mobile-menu nav a { display:block; padding:13px 0; border-bottom:1px solid #dce6e1; text-decoration:none; color:#143d38; font-size:19px; }
.site-mobile-menu nav a[aria-current],.site-mobile-menu nav a:hover { color:#226257; }
.site-menu-note { margin:24px 0 0; color:#5b7069; font-family:Georgia,serif; font-style:italic; line-height:1.7; font-size:15px; }
.site-skip { position:fixed; left:16px; top:12px; z-index:60; transform:translateY(-150%); padding:12px 18px; background:#143d38; color:white; }
.site-skip:focus { transform:translateY(0); }
.site-header a:focus-visible,.site-header button:focus-visible,.site-mobile-menu a:focus-visible,.site-mobile-menu button:focus-visible { outline:2px solid #327568; outline-offset:5px; }
#main-content,#film-title,#testimonials-title,#get-in-touch { scroll-margin-top:112px; }
.site-footer { padding:0 48px; background:#102f2b; color:#f7f2e9; border-top:1px solid #ffffff20; }
.site-footer-inner { max-width:1184px; margin:auto; }
.site-footer-top { display:flex; justify-content:space-between; align-items:center; gap:32px; padding:52px 0; border-bottom:1px solid #ffffff24; }
.site-footer-top p { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(28px,3vw,42px); line-height:1.2; letter-spacing:-1px; }
.site-footer-top p span { font-family:Georgia,serif; font-style:italic; color:#ddc58f; }
.site-footer-project { display:flex; align-items:center; gap:32px; min-height:52px; padding:14px 22px; border:1px solid #d4b48d80; border-radius:3px; font-size:13px; text-decoration:none; color:#ddc58f; }
.site-footer-project:hover { background:#ffffff0d; }
.site-footer-grid { display:grid; grid-template-columns:1.45fr .8fr .8fr 1.1fr; gap:40px; padding:48px 0; }
.site-footer .site-wordmark { font-size:40px; }
.site-footer .brand-dot { color:#ddc58f; }
.site-footer-brand p { max-width:280px; margin:20px 0; font-size:13px; color:#bdbcb1; line-height:1.9; }
.site-footer-location { color:#d4b48d; font-size:10px; text-transform:uppercase; letter-spacing:1.8px; }
.site-footer h2 { margin:0 0 18px; color:#ddc58f; font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:2px; }
.site-footer ul { list-style:none; padding:0; margin:0; }
.site-footer nav a,.site-footer-contact > a { display:inline-block; padding:8px 0; color:#cfcdc4; font-size:13px; text-decoration:none; overflow-wrap:anywhere; }
.site-footer nav a:hover,.site-footer-contact > a:hover { color:#ddc58f; }
.site-footer-social { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.site-footer .site-footer-social a { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:1px solid #d4b48d66; border-radius:50%; color:#ddc58f; transition:background-color .2s, border-color .2s; }
.site-footer .site-footer-social a:hover { background:#ffffff0d; border-color:#ddc58f; }
.site-footer-social svg { width:20px; height:20px; }
.site-footer-contact > a { display:block; }
.site-footer address { margin-bottom:14px; font-style:normal; color:#cfcdc4; font-size:13px; line-height:1.9; }
.site-footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px 0; border-top:1px solid #ffffff24; color:#bdbcb1; font-size:11px; line-height:1.8; }
.site-footer-bottom p { margin:0; }
.site-footer-credit a { display:inline-block; padding:10px 0; color:#ddc58f; text-decoration:underline; text-underline-offset:3px; }
.site-footer-credit a:hover { color:#f7f2e9; }
.site-footer-bottom > a { display:inline-flex; align-items:center; gap:16px; min-height:44px; color:#ddc58f; text-decoration:none; }
.site-footer a:focus-visible { outline:2px solid #ddc58f; outline-offset:5px; }
@media (max-width:1023px) {
  .site-header { padding:0 32px; }
  .site-header-inner { min-height:76px; }
  .site-desktop-links,.site-header-cta { display:none; }
  .site-menu-toggle { display:block; }
  .site-footer { padding:0 32px; }
  .site-footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .site-footer-bottom { flex-wrap:wrap; gap:12px 24px; }
}
@media (min-width:1024px) { .site-mobile-menu,.site-menu-overlay { display:none; } }
@media (max-width:480px) {
  .site-header { padding:0 24px; }
  .site-wordmark { font-size:29px; }
  .site-wordmark small { font-size:7px; letter-spacing:1.2px; }
  .site-footer { padding:0 24px; }
  .site-footer-top { flex-direction:column; align-items:flex-start; padding:36px 0; gap:24px; }
  .site-footer-grid { gap:32px 24px; padding:36px 0; }
  .site-footer-brand,.site-footer-contact { grid-column:1 / -1; }
  .site-footer-bottom { flex-direction:column; align-items:flex-start; }
}

/* About page */
.about-page { background:#f7faf9; color:#143d38; }
.about-page-container { width:calc(100% - 96px); max-width:1184px; margin:auto; }
.about-page-hero { padding:32px 0 0; background:#e8f0ed; }
.about-breadcrumb { display:flex; gap:12px; align-items:center; font-size:11px; color:#5b7069; }
.about-breadcrumb a { color:#526760; text-decoration:none; padding:8px 0; }
.about-page-hero-grid { display:grid; grid-template-columns:1.25fr 1fr; align-items:end; gap:64px; padding:48px 0; }
.about-page-kicker { margin:0 0 20px; font-size:10px; font-weight:600; letter-spacing:2px; line-height:1.8; text-transform:uppercase; color:#226257; }
.about-page h1 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(42px,5.2vw,72px); font-weight:500; line-height:1.1; letter-spacing:-2.8px; }
.about-page h1 span,.about-page h2 span { font-family:Georgia,serif; font-style:italic; font-weight:400; color:#226257; letter-spacing:-1.5px; }
.about-hero-summary > p { margin:0; max-width:440px; font-size:15px; line-height:1.9; color:#526760; }
.about-page-link { display:inline-flex; align-items:center; gap:28px; min-height:48px; margin-top:20px; border-bottom:1px solid #327568; color:#143d38; font-size:13px; font-weight:600; text-decoration:none; }
.about-page-link:hover { color:#226257; }
.about-page a:focus-visible { outline:2px solid #327568; outline-offset:5px; }
.about-cover { position:relative; margin:0; background:#143d38; overflow:hidden; border-radius:6px 6px 0 0; }
.about-cover img { display:block; width:100%; height:clamp(300px,35vw,460px); object-fit:cover; }
.about-cover figcaption { position:absolute; inset:auto 0 0; display:flex; justify-content:space-between; gap:20px; padding:60px 28px 24px; background:linear-gradient(transparent,#171a16d9); color:#fff4e4; font-size:11px; line-height:1.8; letter-spacing:.7px; }
.about-story-section { padding:88px 0; scroll-margin-top:110px; }
.about-story-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,7vw,100px); }
.about-page h2 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(32px,3.5vw,46px); font-weight:500; letter-spacing:-1.8px; line-height:1.16; }
.about-story-principle { margin:32px 0 0; padding-left:24px; border-left:2px solid #c5a27c; font-family:Georgia,serif; font-style:italic; color:#226257; font-size:20px; line-height:1.8; }
.about-story-copy > p { margin:0 0 20px; color:#526760; font-size:14px; line-height:1.95; }
.about-story-copy > .about-story-lead { font-size:19px; line-height:1.75; color:#403b34; }
.about-values-section { padding:80px 0; background:#e8f0ed; }
.about-values-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:36px; }
.about-values-heading > p { max-width:340px; margin:0; color:#526760; font-size:14px; line-height:1.9; }
.about-values-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.about-values-grid article { display:flex; flex-direction:column; padding:32px 26px; background:#f7faf9; border:1px solid #cddbd5; border-radius:5px; }
.about-principle-number { display:grid; place-items:center; width:42px; height:42px; border:1px solid #cbb99f; border-radius:50%; color:#226257; font-size:12px; }
.about-values-grid h3 { margin:24px 0 14px; font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:500; letter-spacing:-.7px; }
.about-values-grid article > p { margin:0 0 28px; font-size:14px; color:#526760; line-height:1.9; }
.about-value-tag { margin-top:auto; padding-top:20px; border-top:1px solid #cddbd5; color:#226257; font-size:10px; line-height:1.7; letter-spacing:1px; text-transform:uppercase; }
.about-detail-section { padding:88px 0; }
.about-detail-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:64px; }
.about-detail-grid figure { margin:0; }
.about-detail-grid img { display:block; width:100%; height:380px; object-fit:cover; border-radius:5px; }
.about-detail-grid figcaption { padding-top:14px; font-size:11px; color:#5b7069; letter-spacing:.5px; }
.about-detail-grid div > p:not(.about-page-kicker) { margin:24px 0 0; color:#526760; font-size:14px; line-height:1.9; }
.about-page-cta { padding:56px 0; background:#dce9e2; border-top:1px solid #d8cbb8; }
.about-page-cta > div { display:flex; align-items:center; justify-content:space-between; gap:36px; }
.about-page-cta h2 { font-size:clamp(28px,3vw,38px); }
.about-page-cta p:not(.about-page-kicker) { margin:18px 0 0; color:#526760; font-size:14px; line-height:1.8; }
.about-page-cta a { display:inline-flex; align-items:center; justify-content:space-between; gap:32px; min-height:50px; flex-shrink:0; padding:14px 22px; border-radius:3px; background:#143d38; color:#fff4e4; font-size:13px; text-decoration:none; }
.about-page-cta a:hover { background:#226257; }
@media (max-width:900px) {
  .about-page-container { width:calc(100% - 64px); }
  .about-page-hero-grid,.about-story-grid,.about-detail-grid { grid-template-columns:1fr; gap:32px; }
  .about-page-hero-grid { padding:32px 0; }
  .about-hero-summary > p { max-width:600px; }
  .about-values-heading { flex-direction:column; align-items:flex-start; gap:24px; }
  .about-values-heading > p { max-width:560px; }
  .about-values-grid { grid-template-columns:1fr; }
  .about-story-section,.about-values-section,.about-detail-section { padding:64px 0; }
  .about-page-cta > div { align-items:flex-start; flex-direction:column; gap:24px; }
}
@media (max-width:480px) {
  .about-page-container { width:calc(100% - 48px); }
  .about-page h1 { font-size:42px; letter-spacing:-2px; }
  .about-page h2 { font-size:32px; letter-spacing:-1.3px; }
  .about-cover img { height:340px; }
  .about-cover figcaption { flex-direction:column; gap:4px; padding:60px 20px 20px; }
  .about-story-section,.about-values-section,.about-detail-section { padding:48px 0; }
  .about-detail-grid img { height:300px; }
  .about-values-grid article { padding:26px 22px; }
  .about-page-cta { padding:40px 0; }
}

/* Contact page */
.contact-page { color:#143d38; background:#f7faf9; }
.contact-page-hero { padding:32px 0 56px; background:#e8f0ed; }
.contact-page-heading { display:grid; grid-template-columns:1.3fr 1fr; gap:64px; align-items:end; padding:42px 0 32px; }
.contact-page-heading h1 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(42px,5vw,68px); font-weight:500; line-height:1.1; letter-spacing:-2.5px; }
.contact-page-heading h1 span,.contact-visit h2 span { font-family:Georgia,serif; color:#226257; font-weight:400; font-style:italic; letter-spacing:-1.5px; }
.contact-page-heading > p { max-width:390px; margin:0 0 4px; font-size:15px; line-height:1.9; color:#526760; }
.contact-page-topics { display:flex; flex-wrap:wrap; gap:10px; padding-top:24px; border-top:1px solid #c7d8d0; }
.contact-page-topics span { padding:8px 14px; border:1px solid #c7d8d0; border-radius:30px; font-size:11px; color:#526760; }
.contact-page .contact-intro { padding-top:72px; padding-bottom:72px; }
.contact-page .contact-submit { cursor:pointer; }
.contact-page .contact-submit:hover { background:#226257; }
.contact-page .contact-submit:focus-visible { outline:2px solid #226257; outline-offset:4px; }
.contact-draft-status { margin:0; font-size:12px; line-height:1.8; color:#526760; }
.contact-draft-status:empty { display:none; }
.contact-visit { padding:80px 0; }
.contact-visit-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.contact-visit h2 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(34px,4vw,48px); font-weight:500; line-height:1.13; letter-spacing:-1.8px; }
.contact-visit-grid > div > p:not(.about-page-kicker) { max-width:420px; margin:24px 0; font-size:15px; line-height:1.9; color:#526760; }
.contact-visit address { font-style:normal; font-size:15px; line-height:1.8; }
.contact-preparation { padding:34px; border:1px solid #e1d7c8; background:#edf3ef; border-radius:6px; }
.contact-preparation h3 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:500; line-height:1.25; letter-spacing:-1px; }
.contact-preparation ul { list-style:none; padding:0; margin:24px 0 0; }
.contact-preparation li { display:flex; gap:18px; padding:20px 0; border-top:1px solid #d9cebd; }
.contact-preparation li > span { color:#226257; font-size:11px; padding-top:4px; }
.contact-preparation h4 { margin:0 0 6px; font-size:13px; font-weight:600; }
.contact-preparation li p { margin:0; font-size:13px; line-height:1.8; color:#526760; }
.contact-page a:focus-visible { outline:2px solid #327568; outline-offset:5px; }
@media (min-width:1024px) and (max-width:1150px) { .site-header-inner { gap:20px; } .site-desktop-links { gap:18px; } .site-header-cta { gap:14px; padding:12px 14px; } }
@media (max-width:900px) {
  .contact-page-heading,.contact-visit-grid { grid-template-columns:1fr; gap:28px; }
  .contact-page-heading > p { max-width:560px; }
  .contact-visit { padding:64px 0; }
  .contact-page .contact-intro { padding-top:56px; padding-bottom:56px; }
}
@media (max-width:480px) {
  .contact-page-hero { padding:24px 0 36px; }
  .contact-page-heading { padding:28px 0; }
  .contact-page-heading h1 { font-size:42px; letter-spacing:-1.8px; }
  .contact-page-topics { gap:8px; }
  .contact-page-topics span { font-size:10px; padding:7px 10px; }
  .contact-preparation { padding:26px 22px; }
  .contact-visit { padding:48px 0; }
}

body{
    font-family: 'Inter', sans-serif;
}

.font-serif{
    font-family: 'Cormorant Garamond', serif;
}

:root{
    --ink:#143d38;
    --paper:#f7faf9;
    --line:#cddbd5;
    --accent:#226257;
    --accent-soft:#e8f0ed;
  }
  *{ font-family:'Inter', system-ui, sans-serif; }
  .brand{ font-family:'Space Grotesk', system-ui, sans-serif; }
  body{ background:var(--paper); color:var(--ink); }

  .nav-link{ position:relative; color:var(--ink); padding-bottom:4px; }
  .nav-link::after{
    content:""; position:absolute; left:0; bottom:0;
    height:2px; width:0%; background:var(--accent);
    transition:width .25s ease;
  }
  .nav-link:hover::after, .nav-link[aria-current="page"]::after{ width:100%; }
  .nav-link[aria-current="page"]{ color:var(--accent); font-weight:600; }

  #siteNav{ transition:box-shadow .3s ease; }
  #siteNav.scrolled{ box-shadow:0 4px 20px -8px rgba(20,22,26,0.15); }

  .cta-btn{ background:var(--ink); color:var(--paper); transition:background .2s ease, transform .15s ease; }
  .cta-btn:hover{ background:var(--accent); }
  .cta-btn:active{ transform:scale(0.97); }

  /* ---- desktop dropdowns ---- */
  .dropdown{ position:relative; }
  .dropdown-panel{
    position:absolute; top:calc(100% + 10px); left:50%;
    transform:translate(-50%, 6px);
    min-width:180px;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:.5rem;
    box-shadow:0 12px 30px -12px rgba(20,22,26,.2);
    padding:.5rem;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .18s ease, transform .18s ease, visibility .18s;
    z-index:30;
  }
  .dropdown.open .dropdown-panel{
    opacity:1; visibility:visible; pointer-events:auto;
    transform:translate(-50%, 0);
  }
  .dropdown-panel a{
    display:block; padding:.5rem .75rem; border-radius:.375rem;
    font-size:.875rem; color:var(--ink);
    transition:background .15s ease;
  }
  .dropdown-panel a:hover{ background:var(--accent-soft); }
  .dropdown-trigger svg{ transition:transform .2s ease; }
  .dropdown.open .dropdown-trigger svg{ transform:rotate(180deg); }

  /* ---- mobile drawer ---- */
  #collapseMenu{ transition:transform .35s cubic-bezier(.4,0,.2,1); transform:translateX(100%); }
  #collapseMenu.open{ transform:translateX(0%); }
  #overlay{ opacity:0; pointer-events:none; transition:opacity .3s ease; }
  #overlay.open{ opacity:1; pointer-events:auto; }

  details.mobile-group summary{ list-style:none; cursor:pointer; }
  details.mobile-group summary::-webkit-details-marker{ display:none; }
  details.mobile-group summary svg{ transition:transform .2s ease; }
  details.mobile-group[open] summary svg{ transform:rotate(180deg); }

  @media (prefers-reduced-motion: reduce){
    #collapseMenu, #overlay, .nav-link::after, #siteNav, .cta-btn, .dropdown-panel, .dropdown-trigger svg{ transition:none !important; }
  }

/* Services and project sectors */
.services-section { padding:80px 0; background:var(--paper); }
.services-section h2,.sectors-section h2 { margin:0; font-family:'Space Grotesk',sans-serif; font-size:clamp(30px,3.5vw,46px); line-height:1.2; letter-spacing:-1.3px; }
.services-section h2 span { color:var(--accent); font-family:Georgia,serif; font-style:italic; }
.services-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:38px; }
.service-card { display:flex; flex-direction:column; padding:30px; border:1px solid var(--line); border-radius:5px; background:#fff; }
.service-card:first-child { background:#e8f0ed; border-top:3px solid #327568; }
.service-number { color:var(--accent); font-size:12px; letter-spacing:2px; }
.service-card h3 { margin:24px 0 14px; font-family:'Space Grotesk',sans-serif; font-size:24px; line-height:1.3; }
.service-card p { margin:0 0 24px; color:#526760; font-size:14px; line-height:1.85; }
.service-card a { margin-top:auto; padding-top:16px; border-top:1px solid var(--line); color:var(--accent); font-size:12px; font-weight:600; text-decoration:none; }
.service-card a:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.sectors-section { padding:64px 0; background:#143d38; color:#f7faf9; }
.sectors-section .about-page-kicker { color:#ddc58f; }
.sectors-section p:not(.about-page-kicker) { color:#dce6e1; line-height:1.8; }
.sector-list { display:flex; flex-wrap:wrap; gap:12px; list-style:none; padding:0; margin:28px 0 0; }
.sector-list li { padding:13px 20px; border:1px solid #72958b; border-radius:3px; font-size:14px; }
.offering-heading { padding-top:40px; padding-bottom:64px; }
.offering-heading > p:last-child { max-width:680px; color:#526760; line-height:1.9; margin-top:28px; }
.site-wordmark small { font-size:9px; letter-spacing:1.3px; }
@media(max-width:900px) { .services-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .services-grid { grid-template-columns:1fr; } .services-section { padding:48px 0; } .service-card { padding:26px; } .sectors-section { padding:48px 0; } }
.portfolio-page { background:#f7f8f4; color:#143d38; padding:48px 24px 80px; }
.portfolio-container { max-width:1184px; margin:auto; }
.portfolio-page h1 { font-family:'Space Grotesk',sans-serif; font-size:clamp(42px,6vw,76px); line-height:1.1; margin:24px 0; }
.portfolio-page h1 span { color:#327568; }
.portfolio-intro { display:flex; justify-content:space-between; gap:24px; margin-bottom:36px; color:#526760; }
.portfolio-intro p { max-width:580px; line-height:1.8; }
.portfolio-intro > span { white-space:nowrap; }
.portfolio-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.portfolio-grid { scroll-margin-top:110px; }
.portfolio-card[hidden],.portfolio-pagination[hidden] { display:none; }
.portfolio-pagination { display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:36px; }
.portfolio-pagination button { min-width:44px; min-height:44px; padding:10px 14px; border:1px solid #dce5df; background:white; color:#143d38; font:inherit; cursor:pointer; }
.portfolio-pagination button[aria-current="page"] { background:#143d38; border-color:#143d38; color:white; }
.portfolio-pagination button:hover:not(:disabled) { border-color:#327568; }
.portfolio-pagination button:disabled { opacity:.45; cursor:default; }
.portfolio-pagination button:focus-visible { outline:3px solid #327568; outline-offset:3px; }
.portfolio-card { display:block; background:white; color:#143d38; text-decoration:none; border:1px solid #dce5df; overflow:hidden; transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease; }
.portfolio-card img { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .5s ease; }
.portfolio-card > span { position:relative; display:flex; justify-content:space-between; padding:20px; background:white; transition:background-color .3s ease,color .3s ease; }
.portfolio-card > span > span:last-child { transition:transform .3s ease; }
@media (hover:hover) and (pointer:fine) {
  .portfolio-card:hover { transform:translateY(-6px); border-color:#327568; box-shadow:0 16px 32px rgba(20,61,56,.16); }
  .portfolio-card:hover img { transform:scale(1.045); }
  .portfolio-card:hover > span { background:#143d38; color:white; }
  .portfolio-card:hover > span > span:last-child { transform:translate(3px,-3px); }
}
@media (prefers-reduced-motion:reduce) {
  .portfolio-card,.portfolio-card img,.portfolio-card > span,.portfolio-card > span > span:last-child { transition:none; }
  .portfolio-card:hover,.portfolio-card:hover img,.portfolio-card:hover > span > span:last-child { transform:none; }
}
.portfolio-card:focus-visible,.portfolio-viewer button:focus-visible { outline:3px solid #327568; outline-offset:4px; }
.portfolio-viewer { position:fixed; inset:0; margin:auto; width:min(1100px,94vw); max-width:94vw; max-height:94dvh; padding:56px 20px 16px; border:0; background:#122b27; color:white; }
.portfolio-viewer::backdrop { background:rgba(0,0,0,.85); }
.portfolio-preview { display:block; width:100%; height:70dvh; object-fit:contain; }
.portfolio-viewer button { display:grid; place-items:center; width:44px; height:44px; border:1px solid #779189; background:transparent; color:white; cursor:pointer; font-size:22px; flex-shrink:0; }
.portfolio-close { position:absolute; right:12px; top:8px; }
.portfolio-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:16px; }
.portfolio-controls p { font-size:13px; text-align:center; }
@media (min-width:1024px) and (max-width:1150px) { .site-header-inner .site-desktop-links { gap:12px; } }
@media (max-width:900px) { .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .portfolio-grid { grid-template-columns:1fr; } .portfolio-intro { flex-direction:column; gap:12px; } }
