/* Logo-inspired contour arches, drawn entirely with CSS gradients. No image assets. */
.pattern-section{
 position:relative;isolation:isolate;
 --pattern-colour:#c8ff0026;
 --pattern-width:55%;--pattern-height:100%;--pattern-top:0;
 --pattern-left:auto;--pattern-right:0;
 --pattern-size:144px 72px;
 --pattern-fade:radial-gradient(ellipse at 100% 30%,#000 0%,#0009 38%,transparent 76%);
 --pattern-drawing:repeating-radial-gradient(circle at 50% 100%,transparent 0 16px,var(--pattern-colour) 17px 18px,transparent 19px 32px);
}
.pattern-section:before{
 content:'';position:absolute;z-index:-1;pointer-events:none;
 top:var(--pattern-top);left:var(--pattern-left);right:var(--pattern-right);
 width:var(--pattern-width);height:var(--pattern-height);
 background-image:var(--pattern-drawing);background-size:var(--pattern-size);
 background-position:left top;mask-image:var(--pattern-fade);
}
/* Quiet upper-right texture: the agency copy and imagery stay prominent. */
.about.pattern-section{
 --pattern-colour:#c8ff0024;--pattern-width:58%;--pattern-height:65%;
 --pattern-size:176px 88px;
 --pattern-fade:radial-gradient(ellipse at 100% 0%,#000c 0%,#0005 35%,transparent 72%);
}
/* The strongest field: larger arcs occupy only the right half of Our Story. */
.history.pattern-section{
 --pattern-colour:#c8ff0052;--pattern-width:48%;--pattern-height:78%;
 --pattern-size:208px 104px;
 --pattern-fade:radial-gradient(ellipse at 100% 0%,#000 0%,#000b 34%,transparent 76%);
}
/* Light sections use sage and graphite instead of bright lime. */
.purpose.pattern-section{
 background-color:#e9ede1;
 --pattern-colour:#52690024;--pattern-left:0;--pattern-right:auto;
 --pattern-width:38%;--pattern-size:18px 18px;
 --pattern-drawing:radial-gradient(circle,var(--pattern-colour) 1px,transparent 1.6px);
 --pattern-fade:linear-gradient(90deg,#000b,transparent 100%);
}
.services.pattern-section{
 background-color:#f8f9f3;
 background-image:linear-gradient(110deg,#fafaf7 0%,#f5f7ef 65%,#eef2e5 100%);
 --pattern-colour:#52690035;--pattern-width:62%;--pattern-height:580px;
 --pattern-size:160px 80px;
 --pattern-fade:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 30%,transparent 76%);
}
/* Contact's bottom-left pattern balances the solid form on the right. */
.contact.pattern-section{
 --pattern-colour:#c8ff002e;--pattern-left:0;--pattern-right:auto;
 --pattern-width:54%;--pattern-size:176px 88px;
 --pattern-fade:radial-gradient(ellipse at 0% 100%,#000 0%,#0008 42%,transparent 78%);
}
/* Dedicated service pages continue the same varied visual rhythm. */
.service-hero.pattern-section{
 --pattern-colour:#c8ff001b;--pattern-width:45%;--pattern-left:0;--pattern-right:auto;
 --pattern-size:160px 80px;
 --pattern-fade:radial-gradient(ellipse at 0% 0%,#000 0%,transparent 72%);
}
.service-intro.pattern-section{
 --pattern-colour:#ffffff1c;--pattern-width:40%;--pattern-size:20px 20px;
 --pattern-drawing:radial-gradient(circle,var(--pattern-colour) 1px,transparent 1.7px);
 --pattern-fade:radial-gradient(ellipse at 100% 100%,#000,transparent 76%);
}
.service-formats.pattern-section{
 background-color:#f6f8ef;
 background-image:linear-gradient(110deg,#fafaf7 0%,#f5f7ef 65%,#edf2e3 100%);
 --pattern-colour:#52690033;--pattern-width:60%;--pattern-height:560px;
 --pattern-size:160px 80px;
 --pattern-fade:radial-gradient(ellipse at 100% 0%,#000 0%,#0008 30%,transparent 76%);
}
.service-benefit.pattern-section{
 --pattern-colour:#c8ff0029;--pattern-width:48%;--pattern-left:0;--pattern-right:auto;
 --pattern-size:192px 96px;
 --pattern-fade:radial-gradient(ellipse at 0% 100%,#000 0%,transparent 78%);
}
.service-request.pattern-section{
 --pattern-colour:#c8ff004d;--pattern-width:52%;--pattern-size:208px 104px;
 --pattern-fade:radial-gradient(ellipse at 100% 100%,#000 0%,#0008 36%,transparent 78%);
}
@media(max-width:760px){
 .pattern-section{--pattern-size:112px 56px}
 .about.pattern-section{--pattern-width:75%;--pattern-height:42%;--pattern-size:136px 68px;--pattern-colour:#c8ff001e}
 .history.pattern-section{--pattern-width:68%;--pattern-height:66%;--pattern-size:144px 72px;--pattern-colour:#c8ff003d}
 .purpose.pattern-section{--pattern-width:55%;--pattern-size:18px 18px}
 .services.pattern-section,.service-formats.pattern-section{--pattern-width:74%;--pattern-height:450px;--pattern-size:128px 64px;--pattern-colour:#52690029}
 .contact.pattern-section{--pattern-width:80%;--pattern-height:48%;--pattern-top:0;--pattern-size:136px 68px;--pattern-colour:#c8ff0029;--pattern-fade:radial-gradient(ellipse at 0% 50%,#000 0%,transparent 78%)}
 .service-hero.pattern-section{--pattern-width:70%;--pattern-height:50%;--pattern-size:128px 64px}
 .service-benefit.pattern-section{--pattern-width:65%;--pattern-size:136px 68px}
 .service-request.pattern-section{--pattern-width:68%;--pattern-size:144px 72px;--pattern-colour:#c8ff0033}
}
@media print{.pattern-section:before{display:none}}

/* An opaque contact panel keeps every detail clear above the section texture. */
.contact .contact-details{
 background:#f6f8ef;color:#1e2022;border:1px solid #dce3ce;
 border-top:3px solid #c8ff00;padding:28px;gap:26px 24px;
 box-shadow:0 12px 32px #00000018;
}
.contact .contact-details small{color:#526900;font-size:10px;font-weight:800}
.contact .contact-details a,.contact .contact-details p{color:#1e2022;font-size:14px;line-height:1.8}
.contact .contact-details a:hover{color:#526900;text-decoration:underline;text-underline-offset:4px}
.contact .contact-details a:focus-visible{outline:2px solid #526900;outline-offset:4px}
@media(max-width:760px){
 .contact .contact-details{padding:24px;gap:24px;grid-template-columns:1fr}
}