/* Open contact composition with tactile channel cards. */
.contact{padding:65px 0 48px}
.contact .contact-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;align-items:center}
.contact h2{font-size:clamp(36px,4.2vw,58px);line-height:1.12}
.contact h2 span{color:var(--blue)}
.contact-copy>p{margin-top:26px;max-width:430px;color:var(--muted);font-size:16px}
.contact .contact-layout>div:last-child{padding:12px 7px 16px}
.contact-channels{display:grid;grid-template-columns:1fr 1fr;gap:25px 18px;align-items:start}
.channel-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0;padding:25px 23px 32px;background:var(--action);color:var(--action-ink);border:1px solid var(--line);border-radius:4px;box-shadow:6px 8px 0 var(--shadow);transform:rotate(-2deg);transition:transform .2s,box-shadow .2s;text-align:left}
.channel-action{font-size:13px}
.channel-card strong{font-family:Lora,Georgia,serif;font-weight:500;font-size:clamp(25px,2.5vw,34px);letter-spacing:-.035em}
.channel-arrow{position:absolute;right:17px;top:17px;font-size:23px}
.channel-card:hover:not(:disabled){transform:translateY(-4px) rotate(1deg);box-shadow:8px 12px 0 var(--shadow)}
.channel-max{margin-top:30px;background:var(--card);color:var(--ink);transform:rotate(2deg);opacity:1}
.channel-card:disabled{cursor:default}
.contact-phone{grid-column:1/-1;justify-self:end;margin-top:10px;font-size:16px;text-underline-offset:5px}
.contact-phone:hover{text-decoration:underline}
.footer{justify-content:flex-start;padding-block:20px 30px;font-size:12px;color:var(--muted)}
.header{gap:25px}
.header nav{gap:22px;align-items:center}
.header nav .header-messenger{padding:8px 11px;border:1px solid var(--line);border-radius:3px;background:var(--card);box-shadow:3px 3px 0 var(--mint);white-space:nowrap}
.header-messenger span{margin-left:7px}
.header .theme-toggle{border-radius:4px;box-shadow:3px 3px 0 var(--shadow);border:1px solid var(--line)}
.header .theme-toggle::before{border-radius:2px}
@media(max-width:1050px){.header nav{gap:16px}.header{gap:16px}}
@media(max-width:900px){.contact .contact-layout{gap:35px}.contact-channels{gap:20px 12px}.channel-card{padding:24px 16px}.channel-arrow{right:12px;font-size:18px}}
@media(max-width:750px){.header nav{gap:0 15px}.header nav .header-messenger{padding:3px 7px;min-height:30px;font-size:11px}.contact{padding:40px 0 32px}.contact .contact-layout{grid-template-columns:1fr;gap:24px}.contact h2{font-size:36px}.contact-copy>p{font-size:15px;margin-top:22px}.contact-channels{gap:20px 15px}.channel-card{padding:23px 17px 27px}.channel-card strong{font-size:28px}.channel-max{margin-top:18px}.contact-phone{font-size:15px;margin-top:3px}.footer{padding-block:15px 25px}}
@media(prefers-reduced-motion:reduce){.channel-card{transition:none}}

/* Quiet header icon and an offset, upright-label primary action. */
.header nav .header-messenger{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:8px;background:transparent;border:0;box-shadow:none;color:var(--blue)}
.header-messenger svg{width:24px;height:24px}
.header nav .header-messenger:hover{background:var(--mint)}
.contact-phone{font-size:clamp(21px,2.3vw,28px);font-weight:500;letter-spacing:-.035em;color:var(--ink);padding-block:8px}
.button.layered-cta{position:relative;isolation:isolate;background:transparent;color:var(--action-ink);border:0;border-radius:3px;box-shadow:none;transform:none;padding:18px 28px}
.layered-cta::before,.layered-cta::after{content:"";position:absolute;inset:0;border-radius:3px;pointer-events:none;transition:transform .2s}
.layered-cta::before{z-index:-2;background:var(--mint);border:1px solid var(--line);transform:translate(6px,7px) rotate(1deg)}
.layered-cta::after{z-index:-1;background:var(--action);transform:rotate(-1.5deg)}
.button.layered-cta:hover{box-shadow:none;transform:none}
.layered-cta:hover::before{transform:translate(3px,4px)}
.layered-cta:hover::after{transform:rotate(0deg)}
.channel-max:hover{transform:translateY(-4px) rotate(-1deg)}
@media(max-width:750px){.header nav{column-gap:13px}.header nav .header-messenger{width:36px;height:36px}.button.layered-cta{padding:15px 22px}.contact-phone{font-size:23px}}
@media(prefers-reduced-motion:reduce){.layered-cta::before,.layered-cta::after{transition:none}}

/* Counter the support strip with a clockwise CTA face. */
.solution-bridge .layered-cta::after{transform:rotate(1.5deg)}
.solution-bridge .layered-cta::before{transform:translate(6px,7px) rotate(-1deg)}
.solution-bridge .layered-cta:hover::after{transform:rotate(0deg)}
.solution-bridge .layered-cta:hover::before{transform:translate(3px,4px)}

/* Paired messenger tiles echo the nameplate, with opposing angles. */
.header-socials{display:flex;gap:12px;align-items:center}
.header nav .header-messenger{position:relative;isolation:isolate;width:42px;height:42px;padding:8px;flex:none}
.header-messenger::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--card);border:1px solid var(--line);border-radius:3px;box-shadow:3px 4px 0 var(--mint);transform:rotate(-4deg);transition:transform .2s}
.header-messenger.messenger-max::before{transform:rotate(4deg)}
.header nav .header-messenger:hover{background:transparent}
.header-messenger:hover::before{transform:rotate(0deg)}
.header-messenger img{display:block;width:26px;height:26px}
@media(max-width:750px){.header nav{justify-content:space-between;column-gap:8px;row-gap:10px}.header-socials{gap:9px}.header nav .header-messenger{width:36px;height:36px;padding:5px}.header nav>a{font-size:11px}}
@media(prefers-reduced-motion:reduce){.header-messenger::before{transition:none}}

/* A single angled ribbon groups section navigation; labels remain upright. */
.nav-strip{position:relative;isolation:isolate;display:flex;align-items:center;gap:4px;padding:4px 10px}
.nav-strip::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--card);transform:skewY(1.5deg);border:1px solid var(--line);box-shadow:4px 5px 0 var(--shadow);transition:transform .22s ease,box-shadow .22s ease}
.nav-strip a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 9px;white-space:nowrap;border-radius:2px;transition:background .18s,color .18s}
.nav-strip a:hover{background:var(--card);color:var(--blue)}
@media(max-width:1050px){.nav-strip{padding-inline:5px;gap:0}.nav-strip a{padding-inline:7px}}
@media(max-width:750px){.header nav{flex-wrap:wrap}.nav-strip{flex:1;justify-content:space-between;padding:0 4px}.nav-strip a{font-size:11px;padding-inline:5px;min-height:40px}.header-socials{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.nav-strip a{transition:none}}

.nav-strip:hover::before,.nav-strip:focus-within::before{transform:skewY(0deg) translateY(-1px);box-shadow:3px 6px 0 var(--shadow)}
@media(prefers-reduced-motion:reduce){.nav-strip::before{transition:none}.nav-strip:hover::before,.nav-strip:focus-within::before{transform:skewY(1.5deg)}}
