/* Otter-AV digital palette and logo application */
/* Keep enquiry anchors visible below the sticky navigation. */
#enquiry-form{scroll-margin-top:180px}
.footer-contact{color:var(--mist);font-weight:700;text-underline-offset:4px}
.contact-email{display:inline-block;margin-top:.35rem;color:var(--mist);font-weight:700;text-underline-offset:4px}.direct-email{margin-top:2rem}.direct-email p{margin:0 0:.75rem}.direct-email .text-link{display:block;width:max-content;max-width:100%;margin:.7rem 0;font-size:.92rem;line-height:1.45;overflow-wrap:anywhere}.direct-email .email-label{color:var(--blue)}
.contact{flex-direction:column;align-items:center;text-align:center;gap:2rem}.contact h2,.contact p:not(.eyebrow){margin-left:auto;margin-right:auto}.contact .button{margin-top:0}.contact.contact-email-action{gap:3rem}
@media(min-width:781px){.services .section-heading{display:block;text-align:center}.services .section-heading h2{margin-left:auto;margin-right:auto}}
@media(max-width:780px){.contact.contact-email-action .button{margin-top:2.5rem}}
@media(max-width:390px){.direct-email .text-link{width:auto}}
.footer-legal{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;max-width:34rem}.footer-legal a{color:#bdc9d1;text-underline-offset:4px}.footer-legal .legal,.footer-legal .company-details{margin:0;text-align:right}.footer-legal .company-details{color:#84919b;font-size:.72rem;line-height:1.5}
:root{--ink:#151b24;--ink-soft:#202a35;--mist:#f6fafc;--blue:#00c2ff;--white:#fff;--line:rgba(246,250,252,.18)}
.site-header{background:rgba(21,27,36,.94)}
.hero-art{background-color:var(--blue);background-image:radial-gradient(rgba(21,27,36,.38) 1.2px,transparent 1.5px);background-size:22px 22px}
.hero-art::before,.about::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,transparent 31%,rgba(21,27,36,.25) 31.1%,transparent 31.3%),linear-gradient(45deg,transparent 66%,rgba(21,27,36,.18) 66.1%,transparent 66.3%);opacity:.75}
.hero-art>*{z-index:1}.hero-art img{filter:drop-shadow(22px 25px 0 rgba(21,27,36,.16))}
.about{position:relative;overflow:hidden;background-color:var(--blue);background-image:radial-gradient(rgba(21,27,36,.34) 1.2px,transparent 1.5px);background-size:22px 22px}
.about::after{content:"";position:absolute;width:740px;height:740px;border:1px solid rgba(21,27,36,.24);border-radius:50%;left:-220px;top:50%;transform:translateY(-50%);pointer-events:none}
.about>*{position:relative;z-index:1}.about-mark{position:relative;align-self:stretch;min-height:360px;overflow:hidden}.about-mark::before{content:"";position:absolute;inset:0;background:var(--ink);opacity:.19;-webkit-mask-image:url("otter-mark-negative.png");mask-image:url("otter-mark-negative.png");-webkit-mask-repeat:repeat;mask-repeat:repeat;-webkit-mask-size:128px;mask-size:128px;-webkit-mask-position:14px 12px;mask-position:14px 12px}.about-mark::after{content:"";position:absolute;inset:8% 4%;border:1px solid rgba(21,27,36,.25);background:linear-gradient(135deg,transparent 49.7%,rgba(21,27,36,.22) 49.9%,rgba(21,27,36,.22) 50.1%,transparent 50.3%),linear-gradient(45deg,transparent 49.7%,rgba(21,27,36,.16) 49.9%,rgba(21,27,36,.16) 50.1%,transparent 50.3%);pointer-events:none}
@media (max-width:780px){.about-mark{min-height:240px;order:2}.about-mark::before{-webkit-mask-size:104px;mask-size:104px}}
/* Full-width About composition: the Otter pattern is a quiet background system, not a panel. */
.about{display:block;padding:clamp(5rem,10vw,10rem) clamp(1.25rem,10vw,12rem)}
.about-mark{position:absolute!important;inset:0!important;z-index:0!important;min-height:0!important;pointer-events:none}
.about-mark::before{inset:0;opacity:.15;-webkit-mask-size:86px;mask-size:86px;-webkit-mask-position:22px 18px;mask-position:22px 18px}
.about-mark::after{display:none}
.about>div:last-child{position:relative;z-index:1;width:min(52%,720px);margin-left:auto}
@media (max-width:780px){.about>div:last-child{width:100%;margin-left:0}.about-mark::before{opacity:.11;-webkit-mask-size:72px;mask-size:72px}.about::after{width:520px;height:520px;left:-280px}}
/* Approved sparse drafting composition. */
.about{isolation:isolate;display:flex;align-items:center;min-height:720px;padding:100px 7.2% 100px 48%;background:var(--blue)}
.about::before,.about::after{display:none}
.about>div:last-child{width:100%;max-width:760px;margin:0}
.about h2{max-width:16ch;font-size:clamp(2.8rem,4.8vw,5rem);line-height:1.04;margin-bottom:2rem}
.about div>p:not(.eyebrow){font-size:clamp(1rem,1.15vw,1.2rem);line-height:1.65;max-width:42rem;color:var(--mist)}
.about-mark{background:url('about-drafting.svg') left center/100% 100% no-repeat;mask-image:linear-gradient(to right,#000 30%,transparent 48%)}
.about-mark::before{opacity:1;background:radial-gradient(rgba(21,27,36,.3) .8px,transparent 1px) 0 0/25px 25px;mask:none;-webkit-mask:none}
.about-mark i{position:absolute;width:clamp(48px,5.1vw,86px);aspect-ratio:1;background:var(--ink);opacity:.23;mask:url('otter-mark-negative.png') center/contain no-repeat;-webkit-mask:url('otter-mark-negative.png') center/contain no-repeat}
.about-mark i:nth-child(1){left:14%;top:11%}.about-mark i:nth-child(2){left:34%;top:31%}.about-mark i:nth-child(3){left:6%;top:54%}.about-mark i:nth-child(4){left:33%;top:77%}.about-mark i:nth-child(5){left:13%;top:88%}
@media(max-width:780px){.about{min-height:0;padding:4.5rem 1.5rem 15rem}.about h2{font-size:clamp(2.5rem,7vw,3.7rem)}.about-mark{background-position:left bottom;background-size:auto 420px;mask-image:linear-gradient(to bottom,transparent 55%,#000 80%)}.about-mark i{width:54px}.about-mark i:nth-child(1){left:12%;top:auto;bottom:8%}.about-mark i:nth-child(2){left:66%;top:auto;bottom:13%}.about-mark i:nth-child(n+3){display:none}}
@media(max-width:780px){.site-header{position:relative;padding:1rem 1.25rem;gap:.85rem}.site-header nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem .75rem;align-items:center}.site-header nav a{display:flex;align-items:center;justify-content:center;min-height:38px;font-size:.74rem;text-align:center;line-height:1.2}.site-header .nav-cta{grid-column:1/-1;min-height:44px;justify-content:center;padding:.5rem .8rem}.hero-copy{padding:4.5rem 1.5rem}.hero h1{font-size:clamp(3rem,15vw,4.5rem)}footer{align-items:start}footer>div p{margin-top:0}}
@media(max-width:780px){.footer-legal{align-items:flex-start}.footer-legal .legal,.footer-legal .company-details{text-align:left}}
@media(max-width:390px){.site-header{padding-inline:1rem}.site-header nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem}.site-header nav a{font-size:.69rem}.hero h1{font-size:2.85rem}.hero-art{min-height:320px}.hero-art img{width:68%}}
