/*
Theme Name: OneTogether Solutions
Version: 1.0.0
Text Domain: kit
*/

:root {
  --blue: #075c79;
  --logo-blue: #00566e;
  --green: #4c8165;
  --sage: #a9c3b3;
  --dark: #262832;
  --night: #082f40;
  --sand: #e6e2d9;
  --ink: #1f2a30;
  --hush: rgb(31 42 48 / .72);
  --on-dark: rgb(255 255 255 / .78);
  --line: #e3e6e5;
  --head: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  --body: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
  --wrap: min(1240px, calc(100% - 48px));
  --pattern: url(media/diamond-pattern.png);
  --fx-accent: #a9c3b3;
}

.wp-block-group > .wp-block-group__inner-container { display: contents; }

body { background: #fff; color: var(--ink); font: 400 17px/1.7 var(--body); }
h1, h2, h3, h4 { font-family: var(--head); font-weight: 700; line-height: 1.15; margin: 0 0 .5em; text-wrap: balance; }
h2 { font-size: clamp(30px, 3.2vw, 42px); }
h3 { font-size: 21px; }
a { color: var(--blue); text-underline-offset: 3px; }
a:hover { color: var(--green); }
.eyebrow { display: flex; align-items: center; gap: 14px; font: 500 15px/1.2 var(--body); letter-spacing: .14em; text-transform: uppercase; color: var(--blue); margin-bottom: 12px; }
.eyebrow::before { content: ""; width: 40px; height: 1px; background: currentColor; }
.quiet { color: var(--hush); }
.more a { font: 600 14px var(--body); letter-spacing: .08em; text-transform: uppercase; }

.wp-block-button__link { font: 600 14px/1.2 var(--body); letter-spacing: .08em; text-transform: uppercase; border-radius: 3px; background: var(--blue); color: #fff; padding: 16px 26px; transition: background .25s, transform .25s, box-shadow .25s; }
.wp-block-button__link:hover { background: var(--green); color: #fff; transform: translateY(-2px); box-shadow: 0 12px 24px -12px rgb(0 0 0 / .5); }
.btn-solid { background: var(--blue); color: #fff; border: 0; padding: 16px 28px; border-radius: 3px; font: 600 14px/1.2 var(--body); letter-spacing: .08em; text-transform: uppercase; }
.btn-solid:hover { background: var(--green); }

/* header: their three bars */
.utility { background: var(--green); color: rgb(255 255 255 / .85); font: 500 13px/1 var(--body); letter-spacing: .05em; }
.utility-in { width: var(--wrap); margin: 0 auto; display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; }
.utility a { color: #fff; text-decoration: none; margin-left: 22px; }
.utility a:hover { color: var(--sand); }
.masthead { display: block; }
.logobar { background: var(--logo-blue); position: relative; overflow: hidden; isolation: isolate; }
.logobar::after { content: ""; position: absolute; top: -40%; right: -4%; width: 46%; height: 180%; z-index: -1; background: #fff; opacity: .05; -webkit-mask: var(--pattern) right center / contain no-repeat; mask: var(--pattern) right center / contain no-repeat; }
.masthead-in { width: var(--wrap); margin: 0 auto; min-height: 88px; }
.brand-logo { height: 52px; width: auto; }
.logobar-cta { margin-left: auto; font: 600 13px var(--body); letter-spacing: .08em; text-transform: uppercase; color: #fff; text-decoration: none; border: 1px solid rgb(255 255 255 / .55); padding: 12px 18px; border-radius: 3px; transition: background .25s, color .25s; }
.logobar-cta:hover { background: #fff; color: var(--logo-blue); }
.navbar { background: linear-gradient(90deg, var(--sage), var(--green) 75%); }
.site-nav { width: var(--wrap); margin: 0 auto; min-height: 50px; }
.nav-list { gap: 46px; }
.nav-list a { display: block; font: 600 15px/50px var(--body); color: #fff; text-shadow: 0 1px 2px rgb(0 0 0 / .15); position: relative; }
.nav-list a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 10px; height: 2px; background: #fff; transform: scaleX(0); transform-origin: 0 50%; transition: transform .3s; }
.nav-list a:hover::after, .nav-list .current-menu-item a::after { transform: scaleX(1); }
.nav-list a:hover { color: #fff; }
.nav-toggle { font: 600 14px var(--body); letter-spacing: .08em; text-transform: uppercase; background: none; border: 1px solid rgb(255 255 255 / .6); color: #fff; padding: 0 16px; border-radius: 3px; }
@media (min-width: 1081px) { .nav-toggle { display: none; } .site-nav { display: flex; } }
@media (max-width: 1080px) {
  .logobar-cta { display: none; }
  .navbar { position: relative; }
  .site-nav { position: static; display: none; width: 100%; padding: 6px 24px 18px; background: linear-gradient(180deg, var(--green), #3f6d55); }
  .site-nav.open { display: block; }
  .nav-list a { line-height: 1.2; padding: 15px 0; border-bottom: 1px solid rgb(255 255 255 / .18); }
  .nav-list a::after { display: none; }
}
@media (max-width: 640px) {
  .utility-note { display: none; }
  .utility-in { justify-content: center; }
  .utility a:first-child { margin-left: 0; }
  .brand-logo { height: 42px; }
  .masthead-in { min-height: 74px; }
}

/* hero: their aspen leaves, now moving */
.hero { position: relative; min-height: min(78vh, 760px); display: flex; align-items: center; color: #fff; background: #2d4a2c; overflow: hidden; isolation: isolate; }
.hero-media { position: absolute; inset: -6% 0 0; z-index: -2; }
.hero-media video { width: 100%; height: 110%; object-fit: cover; object-position: 60% 50%; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(10 30 20 / .62) 0%, rgb(10 30 20 / .32) 55%, rgb(10 30 20 / .05) 100%); }
.hero-copy { width: var(--wrap); margin: 0 auto; padding: 90px 0 100px; }
.hero-tag { font: 400 clamp(20px, 2.1vw, 28px)/1.3 var(--body); letter-spacing: .04em; margin-bottom: 18px; }
.hero-title { font-size: clamp(28px, 3.3vw, 42px); line-height: 1.3; max-width: 26ch; margin-bottom: 36px; text-shadow: 0 2px 20px rgb(0 0 0 / .25); }
.hero .wp-block-buttons { gap: 14px; }
@media (max-width: 640px) { .hero { min-height: 82svh; align-items: flex-end; } .hero-copy { padding: 70px 0 60px; } .hero::after { background: linear-gradient(180deg, rgb(10 30 20 / .2), rgb(10 30 20 / .75) 60%); } }

/* who we are */
.who { background: var(--blue); color: #fff; display: grid; grid-template-columns: minmax(220px, 3fr) 6fr; align-items: center; gap: 60px; padding: 90px 0; overflow: hidden; }
.who-mark { aspect-ratio: 3232 / 1950; background: #fff; -webkit-mask: var(--pattern) center / contain no-repeat; mask: var(--pattern) center / contain no-repeat; margin-left: -18%; will-change: translate; }
.js .who-mark { clip-path: inset(0 100% 0 0); transition: clip-path 1.4s cubic-bezier(.7, 0, .2, 1); }
.js .who.open .who-mark { clip-path: inset(0 0 0 0); }
.who-copy { max-width: 760px; padding-right: 24px; }
.who .eyebrow { color: #fff; }
.who h2 { color: #fff; }
.who p { color: rgb(255 255 255 / .88); font-size: 17px; line-height: 1.9; }
.who .wp-block-button__link { background: var(--green); margin-top: 14px; }
.who .wp-block-button__link:hover { background: #fff; color: var(--blue); }
@media (max-width: 860px) { .who { grid-template-columns: 1fr; gap: 20px; padding: 60px 24px; } .who-mark { width: 60%; margin-left: -10%; } }

/* what we do */
.titlebar { margin: 0; padding: 22px 24px; text-align: center; color: #fff; font-size: clamp(26px, 2.8vw, 36px); background: linear-gradient(90deg, var(--sage), var(--green) 80%); }
.cols { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--dark); }
.col { position: relative; min-height: 640px; overflow: hidden; border-right: 1px solid rgb(255 255 255 / .22); isolation: isolate; color: #fff; }
.col:last-child { border-right: 0; }
.col .wp-block-image { position: absolute; inset: 0; z-index: -2; }
.col .wp-block-image img { height: 100%; object-fit: cover; opacity: .32; scale: 1.06; transition: opacity .7s ease, scale 1.2s cubic-bezier(.2, .7, .2, 1); }
.col::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(38 40 50 / .2) 20%, rgb(38 40 50 / .95)); }
.col-copy { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 28px 40px; }
.col-copy h3 { font-size: 26px; line-height: 1.15; color: #fff; }
.col-copy p { font-size: 15px; line-height: 1.6; color: var(--on-dark); max-height: 0; opacity: 0; overflow: hidden; margin: 0; transition: max-height .7s ease, opacity .6s ease .1s; }
.col-copy .more { max-height: none; opacity: 1; margin-top: 18px; }
.col-copy .more a { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid rgb(255 255 255 / .7); border-radius: 3px; font-size: 0; color: #fff; transition: background .3s, border-color .3s; }
.col-copy .more a::before { content: ""; width: 16px; height: 12px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M10 0l6 6-6 6-1.4-1.4L12.2 7H0V5h12.2L8.6 1.4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3E%3Cpath d='M10 0l6 6-6 6-1.4-1.4L12.2 7H0V5h12.2L8.6 1.4z'/%3E%3C/svg%3E") center / contain no-repeat; }
.col:hover .wp-block-image img, .col:focus-within .wp-block-image img { opacity: .85; scale: 1; }
.col:hover .col-copy p, .col:focus-within .col-copy p { max-height: 260px; opacity: 1; }
.col:hover .more a, .col:focus-within .more a { background: var(--green); border-color: var(--green); }
@media (hover: none), (max-width: 1000px) {
  .cols { grid-template-columns: repeat(2, 1fr); }
  .col { min-height: 460px; border-bottom: 1px solid rgb(255 255 255 / .22); }
  .col .wp-block-image img { opacity: .55; }
  .col-copy p { max-height: none; opacity: 1; }
}
@media (max-width: 640px) { .cols { grid-template-columns: 1fr; } .col { border-right: 0; min-height: 420px; } }

/* proven expertise */
.expertise { width: var(--wrap); margin: 0 auto; padding: 100px 0 110px; }
.expertise-top { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; margin-bottom: 56px; }
.expertise h2 { color: var(--green); text-transform: uppercase; letter-spacing: .04em; font-size: clamp(30px, 3vw, 40px); }
.expertise-intro p:last-child { color: var(--hush); max-width: 54ch; }
.expertise-band { border-radius: 10px; overflow: hidden; box-shadow: 0 30px 50px -30px rgb(7 92 121 / .6); }
.band-img img { aspect-ratio: 16 / 5; object-fit: cover; transform: scale(1.15); transition: transform 1.6s cubic-bezier(.2, .7, .2, 1); }
.expertise-band:hover .band-img img { transform: scale(1.05); }
.cells { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.cell { padding: 40px 36px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: background .35s, box-shadow .35s; position: relative; }
.cell:hover { background: #f4f8f6; box-shadow: inset 0 -3px 0 var(--green); }
.cell h3 { font-size: 20px; margin-top: 18px; }
.cell p { color: var(--blue); font-size: 15px; }
.dots { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 0; color: var(--blue); font-size: 15px; }
.dots li::before { content: "\2022"; margin: 0 8px 0 0; color: var(--green); }
.dots li { margin-right: 12px; }
.ico { display: block; width: 40px; height: 40px; background: var(--blue); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; transition: background .3s, transform .4s; }
.cell:hover .ico { background: var(--green); transform: translateY(-3px); }
.ico-award { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='20' cy='15' r='10'/%3E%3Ccircle cx='20' cy='15' r='5.5'/%3E%3Cpath d='M13 23l-4 13 6-3 3 5 2-9M27 23l4 13-6-3-3 5-2-9'/%3E%3C/svg%3E"); }
.ico-build { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M5 36h30M9 36V16l11-8 11 8v20M16 36v-9h8v9M14 19h4M22 19h4'/%3E%3C/svg%3E"); }
.ico-legal { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M20 5v30M10 35h20M8 10h24M8 10l-5 11h10zM32 10l-5 11h10z'/%3E%3C/svg%3E"); }
.ico-ops { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='5' y='6' width='30' height='20' rx='1'/%3E%3Cpath d='M10 21l6-6 5 4 8-8M20 26v8M13 34h14'/%3E%3C/svg%3E"); }
.ico-finance { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='4' y='10' width='28' height='18' rx='2'/%3E%3Crect x='9' y='15' width='28' height='18' rx='2' fill='%23fff'/%3E%3Cpath d='M9 21h28M14 28h6'/%3E%3C/svg%3E"); }
.ico-it { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Crect x='4' y='7' width='32' height='21' rx='1'/%3E%3Cpath d='M14 34h12M20 28v6M11 18h4l2-4 4 8 2-4h6'/%3E%3C/svg%3E"); }
@media (max-width: 900px) { .expertise-top { grid-template-columns: 1fr; gap: 32px; } .cells { grid-template-columns: 1fr 1fr; } .expertise { padding: 70px 0; } }
@media (max-width: 600px) { .cells { grid-template-columns: 1fr; } .cell { padding: 30px 24px; } }

/* managed clinics */
.clinics { background: var(--sage); padding: 80px 0 100px; position: relative; isolation: isolate; overflow: hidden; }
.clinics::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #fff; opacity: .1; -webkit-mask: var(--pattern) center / 460px auto repeat; mask: var(--pattern) center / 460px auto repeat; }
.band-title { text-align: center; color: #fff; text-transform: uppercase; letter-spacing: .06em; font-size: clamp(28px, 3vw, 40px); margin-bottom: 46px; text-shadow: 0 2px 10px rgb(0 0 0 / .12); }
.clinic-row { width: min(1400px, calc(100% - 32px)); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.clinic { position: relative; border: 2px solid var(--green); border-radius: 10px; overflow: hidden; isolation: isolate; box-shadow: 0 24px 40px -26px rgb(0 0 0 / .55); }
.clinic .wp-block-image img { aspect-ratio: 870 / 576; object-fit: cover; transition: scale 1.1s cubic-bezier(.2, .7, .2, 1); }
.clinic:hover .wp-block-image img { scale: 1.06; }
.clinic::after { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, transparent 45%, rgb(8 47 64 / .82)); pointer-events: none; }
.clinic-name, .clinic-place { position: absolute; left: 24px; z-index: 1; margin: 0; color: #fff; }
.clinic-name { bottom: 44px; font: 700 clamp(22px, 2vw, 28px) var(--head); text-transform: uppercase; letter-spacing: .04em; }
.clinic-place { bottom: 18px; font: 600 14px var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--sand); }
@media (max-width: 860px) { .clinic-row { grid-template-columns: 1fr; width: calc(100% - 48px); } }

/* helpful links */
.links { background: var(--blue); color: #fff; padding: 90px max(24px, calc((100% - 1240px) / 2)); display: grid; grid-template-columns: 5fr 6fr; gap: 64px; align-items: center; }
.links h2 { color: #fff; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 28px; }
.links .wp-block-details { margin-bottom: 10px; border-radius: 4px; background: rgb(255 255 255 / .12); border: 1px solid rgb(255 255 255 / .2); transition: background .3s; }
.links .wp-block-details[open] { background: var(--green); border-color: var(--green); }
.links summary { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; font: 600 16px var(--body); }
.links summary::after { content: "\2192"; font-size: 20px; transition: transform .3s; }
.links details[open] summary::after { transform: rotate(-90deg); }
.links details p { padding: 0 18px; color: rgb(255 255 255 / .9); font-size: 16px; }
.links details .more { padding-bottom: 16px; }
.links details a { color: #fff; }
.links-media { border-radius: 10px; overflow: hidden; box-shadow: 0 40px 60px -30px rgb(0 0 0 / .6); }
.links-img img { aspect-ratio: 3 / 2; object-fit: cover; }
@media (max-width: 860px) { .links { grid-template-columns: 1fr; padding: 60px 24px; gap: 36px; } }

/* partner form */
.partner { background: var(--sand); padding: 100px max(24px, calc((100% - 1240px) / 2)); display: grid; grid-template-columns: 7fr 4fr; gap: 72px; align-items: start; }
.partner h2 { color: var(--blue); font-size: clamp(30px, 3vw, 42px); }
.partner-say { color: var(--blue); font-size: clamp(19px, 1.6vw, 22px); line-height: 1.75; max-width: 40ch; }
.partner-call { margin-top: 30px; font: 700 22px/1.6 var(--head); }
.partner-call a { text-decoration: none; }
.partner-form { background: #fff; padding: 34px; border-radius: 6px; box-shadow: 0 30px 50px -36px rgb(7 92 121 / .55); }
.partner-form .kit-form form { gap: 14px; }
.partner-form .btn-solid { justify-self: stretch; }
@media (max-width: 900px) { .partner { grid-template-columns: 1fr; gap: 36px; padding: 64px 24px; } .partner-form { padding: 24px; } }

/* forms */
.kit-form label { font: 600 13px var(--body); letter-spacing: .04em; color: var(--blue); }
.kit-form input, .kit-form select, .kit-form textarea { background: #f7f6f2; border: 1px solid #cfd6d4; border-radius: 3px; padding: 12px 14px; color: var(--ink); font-size: 16px; }
.kit-form input:focus, .kit-form select:focus, .kit-form textarea:focus { outline: 3px solid rgb(76 129 101 / .35); outline-offset: 0; border-color: var(--green); background: #fff; }
.kit-form .touched:invalid { border-color: #b4472f; background: #fff6f3; }
.form-note { padding: 12px 14px; font-size: 15px; border-radius: 3px; }
.form-note.ok { background: #e3efe8; border-left: 3px solid var(--green); }
.form-note.err { background: #fbece7; border-left: 3px solid #b4472f; }

/* footer: their river photo */
.foot { position: relative; isolation: isolate; color: var(--on-dark); padding: 80px 0 0; background: var(--night); }
.foot::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgb(8 47 64 / .9), rgb(8 47 64 / .94)), url(media/footer.webp) center / cover; }
.foot-band { display: none; }
.foot-in { width: var(--wrap); margin: 0 auto; display: grid; grid-template-columns: 4fr 3fr 4fr; gap: 40px; }
.foot-brand img { width: 220px; height: auto; margin-bottom: 18px; }
.foot-line { color: #fff; font-weight: 600; max-width: 30ch; }
.foot-title { font: 700 15px var(--head); letter-spacing: .1em; text-transform: uppercase; color: #fff; margin-bottom: 18px; }
.foot a { color: #fff; text-decoration: none; }
.foot a:hover { color: var(--sage); }
.foot-list { list-style: none; margin: 0; padding: 0; font: 500 16px/2.1 var(--body); }
.foot-phone { font: 700 22px var(--head); }
.foot-quiet { color: var(--on-dark); }
.foot-base { margin: 70px 0 0; padding: 22px 24px; background: var(--blue); text-align: center; font-size: 14px; color: rgb(255 255 255 / .8); }
@media (max-width: 800px) { .foot-in { grid-template-columns: 1fr; } }

/* inner page heads */
.page-head { position: relative; min-height: 46vh; display: flex; align-items: flex-end; color: #fff; background: var(--blue); isolation: isolate; overflow: hidden; }
.page-head .page-banner { position: absolute; inset: 0; z-index: -2; }
.page-head::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(7 92 121 / .9), rgb(7 92 121 / .45)); }
.page-head-in { width: var(--wrap); margin: 0 auto; padding: 120px 0 64px; }
.page-head h1 { font-size: clamp(34px, 4.4vw, 58px); max-width: 22ch; color: #fff; }
.page-head .eyebrow { color: #fff; }
.page-head .lead { color: var(--on-dark); font-size: 19px; max-width: 54ch; }
.page-head--blog { min-height: 36vh; }
.page-head--blog::before { content: ""; position: absolute; top: -30%; right: -5%; width: 50%; height: 160%; z-index: -1; background: #fff; opacity: .07; -webkit-mask: var(--pattern) right center / contain no-repeat; mask: var(--pattern) right center / contain no-repeat; }
.page-head--blog::after { display: none; }

/* blog */
.blog-wrap { width: var(--wrap); margin: 0 auto; padding: 56px 0 110px; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 44px; }
.chips a { font: 600 13px var(--body); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; padding: 10px 16px; border: 1px solid #cfd6d4; color: var(--blue); border-radius: 3px; }
.chips a[aria-current], .chips a:hover { background: var(--green); color: #fff; border-color: var(--green); }
.posts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 44px 40px; }
.post-card--lead { grid-column: 1 / -1; display: grid; grid-template-columns: 7fr 5fr; gap: 40px; align-items: center; }
.post-card img { aspect-ratio: 16 / 10; object-fit: cover; border-radius: 8px; transition: scale .8s cubic-bezier(.2, .7, .2, 1); }
.post-media { display: block; overflow: hidden; border-radius: 8px; margin-bottom: 18px; }
.post-media:hover img { scale: 1.05; }
.post-card--lead .post-media { margin: 0; }
.post-card h2 { font-size: clamp(22px, 2vw, 28px); }
.post-card--lead h2 { font-size: clamp(28px, 3vw, 42px); }
.post-card h2 a { color: var(--ink); text-decoration: none; }
.post-card h2 a:hover { color: var(--blue); }
.post-meta { font: 600 13px var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--green); }
@media (max-width: 800px) { .posts, .post-card--lead { grid-template-columns: 1fr; } }
.single-head { width: min(860px, calc(100% - 48px)); margin: 0 auto; padding: 80px 0 24px; }
.single-head h1 { font-size: clamp(32px, 4vw, 54px); color: var(--blue); }
.seam-h { height: 34px; margin-top: 26px; background: var(--green); -webkit-mask: var(--pattern) left center / auto 34px repeat-x; mask: var(--pattern) left center / auto 34px repeat-x; opacity: .7; }
.single-media { width: min(1200px, calc(100% - 48px)); margin: 20px auto 0; border-radius: 10px; overflow: hidden; }
.single-media img { aspect-ratio: 21 / 9; object-fit: cover; }
.single-body { width: min(720px, calc(100% - 48px)); margin: 0 auto; padding: 50px 0 24px; font-size: 18px; }
.single-body h2 { font-size: 30px; margin-top: 1.2em; color: var(--blue); }
.single-back { width: min(720px, calc(100% - 48px)); margin: 0 auto 110px; font: 600 14px var(--body); letter-spacing: .08em; text-transform: uppercase; }
.sample-note { font-size: 14px !important; background: var(--sand); color: var(--hush); padding: 12px 16px; border-left: 3px solid var(--green); }

@media (prefers-reduced-motion: reduce) {
  .js .who-mark { clip-path: none; }
  .hero-media video { display: none; }
  .hero-media { background: url(media/hero.jpg) 60% 50% / cover; }
}

/* inner pages: their blue pattern header with crumbs */
.page-head { min-height: 0; align-items: center; background: var(--blue); }
.page-head::after { background: linear-gradient(90deg, rgb(7 92 121 / .55), rgb(7 92 121 / .25)); }
.page-head .page-banner img { height: 130%; object-fit: cover; }
.page-head-in { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 30px; padding: 70px 0; }
.page-head h1 { margin: 0; font-size: clamp(32px, 3.6vw, 48px); }
.crumbs { margin: 0; font: 600 12px var(--body); letter-spacing: .1em; text-transform: uppercase; color: rgb(255 255 255 / .75); display: flex; gap: 10px; align-items: center; }
.crumbs a { color: rgb(255 255 255 / .75); text-decoration: none; }
.crumbs a:hover { color: #fff; }
.crumbs span { color: var(--sage); }

.framed img { border-radius: 8px; box-shadow: 0 30px 50px -28px rgb(7 92 121 / .55); }
.split { width: var(--wrap); margin: 0 auto; padding: 90px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.split h2 { color: var(--blue); }
.split-copy p { color: var(--hush); }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; gap: 32px; padding: 60px 0; } }

.footprint { background: var(--sand); padding: 90px max(24px, calc((100% - 1240px) / 2)); display: grid; grid-template-columns: 6fr 5fr; gap: 60px; align-items: center; }
.footprint h2 { color: var(--blue); }
.stats { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.stat { background: #fff; border-radius: 8px; padding: 30px 26px; box-shadow: 0 24px 40px -30px rgb(7 92 121 / .5); border-top: 4px solid var(--green); }
.stat-num { font: 700 clamp(56px, 6vw, 84px)/1 var(--head); color: var(--blue); margin: 0 0 10px; }
.stat-label { margin: 0; font-size: 15px; color: var(--hush); }
@media (max-width: 860px) { .footprint { grid-template-columns: 1fr; padding: 60px 24px; } }

.cta-strip { background: linear-gradient(90deg, var(--sage), var(--green) 80%); color: #fff; text-align: center; padding: 70px 24px; }
.cta-strip h2 { color: #fff; max-width: 24ch; margin: 0 auto 14px; }
.cta-strip p { max-width: 60ch; margin: 0 auto 26px; color: rgb(255 255 255 / .9); }
.cta-strip .wp-block-buttons { justify-content: center; }
.cta-strip .wp-block-button__link { background: var(--blue); }
.cta-strip .wp-block-button__link:hover { background: #fff; color: var(--blue); }

.people { width: var(--wrap); margin: 0 auto; padding: 90px 0 110px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.person { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 12px 12px 22px; transition: transform .4s cubic-bezier(.2, .7, .2, 1), box-shadow .4s; }
.person:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -30px rgb(7 92 121 / .55); }
.person .wp-block-image { overflow: hidden; border-radius: 4px; }
.person img { aspect-ratio: 7 / 10; object-fit: cover; object-position: 50% 20%; transition: scale .9s cubic-bezier(.2, .7, .2, 1); }
.person:hover img { scale: 1.04; }
.person h3 { margin: 18px 6px 4px; font-size: 19px; }
.role { margin: 0 6px; font-size: 14px; color: var(--green); font-weight: 600; }
@media (max-width: 900px) { .people { grid-template-columns: 1fr 1fr; gap: 16px; padding: 56px 0; } }
@media (max-width: 520px) { .people { grid-template-columns: 1fr; } }

.work-intro { width: var(--wrap); margin: 0 auto; padding: 80px 0 30px; max-width: 760px; text-align: center; }
.work-intro .eyebrow { justify-content: center; }
.work-intro h2 { color: var(--blue); }
.work-intro p { color: var(--hush); }
.svc-wrapper { width: var(--wrap); margin: 0 auto; padding: 30px 0 100px; display: grid; grid-template-columns: 250px 1fr; gap: 56px; align-items: start; }
.svc-index { position: sticky; top: 30px; display: grid; gap: 2px; border-left: 2px solid var(--line); }
.svc-index a { padding: 10px 0 10px 18px; margin-left: -2px; border-left: 2px solid transparent; font: 600 15px/1.35 var(--body); color: var(--hush); text-decoration: none; transition: color .25s, border-color .25s; }
.svc-index a:hover, .svc-index a[aria-current] { color: var(--blue); border-color: var(--green); }
.svc { display: grid; grid-template-columns: 5fr 6fr; gap: 44px; align-items: center; padding: 50px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 30px; }
.svc:last-child { border-bottom: 0; }
.svc-flip .svc-media { order: 2; }
.svc h2 { color: var(--blue); font-size: clamp(26px, 2.4vw, 34px); }
.svc-say { font: 500 19px var(--head); color: var(--green); }
.svc-copy p { color: var(--hush); }
.svc .framed img { aspect-ratio: 4 / 3; object-fit: cover; }
.checks, .tags { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.checks li, .tags li { font: 600 13px var(--body); letter-spacing: .03em; color: var(--blue); background: #edf3f0; border: 1px solid #d3e2da; border-radius: 3px; padding: 7px 12px; }
.checks li::before { content: "\2713"; color: var(--green); margin-right: 6px; }
@media (max-width: 1000px) { .svc-wrapper { grid-template-columns: 1fr; } .svc-index { display: none; } .svc { grid-template-columns: 1fr; gap: 24px; } .svc-flip .svc-media { order: 0; } }

.careers-split { background: var(--sand); padding: 90px max(24px, calc((100% - 1240px) / 2)); display: grid; grid-template-columns: 5fr 6fr; gap: 56px; align-items: start; }
.careers-split h2 { color: var(--blue); }
.positions-empty { background: #fff; border-left: 4px solid var(--green); padding: 22px 24px; border-radius: 4px; color: var(--hush); }
.positions { list-style: none; margin: 0; padding: 0; }
.positions li { background: #fff; padding: 18px 22px; border-radius: 4px; margin-bottom: 10px; }
.positions a { font: 700 19px var(--head); display: block; }
.apply-card { background: #fff; padding: 34px; border-radius: 6px; box-shadow: 0 30px 50px -36px rgb(7 92 121 / .55); }
.ot-apply form { display: grid; gap: 14px; }
@media (max-width: 900px) { .careers-split { grid-template-columns: 1fr; padding: 60px 24px; } .apply-card { padding: 24px; } }

.partner--page { padding-top: 90px; }
.contact-lines { margin-top: 30px; }
.contact-lines .eyebrow { margin: 22px 0 4px; }
.contact-big { font: 700 clamp(26px, 2.6vw, 34px)/1.2 var(--head); margin: 0; }
.contact-big a { text-decoration: none; }
.contact-place { color: var(--hush); margin-top: 18px; }

/* paper grain on the sand and sage bands, from their printed-material feel */
.partner, .footprint, .careers-split, .clinics { position: relative; isolation: isolate; }
.partner::after, .footprint::after, .careers-split::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .35; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .5 0 0 0 0 .42 0 0 0 .35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* motion layer: their layout, given depth */
.hero-media video { transition: translate 1s cubic-bezier(.2, .7, .2, 1); }
.hero-title, .hero-tag { translate: var(--mx, 0) var(--my, 0); transition: translate .8s cubic-bezier(.2, .7, .2, 1); }
.hero .wp-block-buttons { translate: calc(var(--mx, 0px) * 1.6) calc(var(--my, 0px) * 1.6); transition: translate .8s cubic-bezier(.2, .7, .2, 1); }

.titlebar { background: linear-gradient(90deg, var(--sage), var(--green) 40%, var(--blue) 75%, var(--green)); background-size: 220% 100%; background-position: var(--gx, 0%) 50%; }

@media (min-width: 1001px) and (hover: hover) {
  .cols { transition: grid-template-columns .8s cubic-bezier(.2, .7, .2, 1); }
  .cols:has(.col:nth-child(1):hover) { grid-template-columns: 1.75fr 1fr 1fr 1fr; }
  .cols:has(.col:nth-child(2):hover) { grid-template-columns: 1fr 1.75fr 1fr 1fr; }
  .cols:has(.col:nth-child(3):hover) { grid-template-columns: 1fr 1fr 1.75fr 1fr; }
  .cols:has(.col:nth-child(4):hover) { grid-template-columns: 1fr 1fr 1fr 1.75fr; }
}
.col .wp-block-image { inset: -14% 0; }
.col .wp-block-image img { will-change: translate; }

.expertise-band { position: relative; }
.band-img img { will-change: translate; }

.framed { overflow: hidden; border-radius: 8px; box-shadow: 0 30px 50px -28px rgb(7 92 121 / .55); }
.framed img { border-radius: 0; box-shadow: none; scale: 1.14; will-change: translate; }
.js .svc .framed { clip-path: inset(0 0 100% 0); transition: clip-path 1.2s cubic-bezier(.7, 0, .2, 1); }
.js .svc.in .framed { clip-path: inset(0 0 0 0); }
.js .svc .svc-copy { opacity: 0; translate: 0 30px; transition: opacity .7s ease .25s, translate .9s cubic-bezier(.2, .7, .2, 1) .25s; }
.js .svc.in .svc-copy { opacity: 1; translate: 0 0; }

.clinic .wp-block-image { overflow: hidden; }
.clinic .wp-block-image img { scale: 1.12; }
.clinic:hover .wp-block-image img { scale: 1.18; }
.clinics::before { -webkit-mask-position: center calc(50% + var(--py, 0px)); mask-position: center calc(50% + var(--py, 0px)); }
.foot::before { background-position: center, center calc(50% + var(--py, 0px)); }

.clinic, .person, .cell { transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s, background .35s; transform-style: preserve-3d; will-change: transform; }
.cell::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .35s; background: radial-gradient(320px circle at var(--lx, 50%) var(--ly, 50%), rgb(169 195 179 / .35), transparent 70%); }
.cell:hover::after { opacity: 1; }
.cell { overflow: hidden; }

.links-media { position: relative; aspect-ratio: 3 / 2; will-change: translate; }
.links-media .links-img { position: absolute; inset: 0; opacity: 0; scale: 1.06; transition: opacity .7s ease, scale 1.4s cubic-bezier(.2, .7, .2, 1); }
.links-media .links-img.on { opacity: 1; scale: 1; }
.links-media .links-img img { height: 100%; aspect-ratio: auto; }

.js .stagger > * { opacity: 0; translate: 0 46px; transition: opacity .7s ease var(--d, 0s), translate 1s cubic-bezier(.2, .7, .2, 1) var(--d, 0s); }
.js .stagger.in > * { opacity: 1; translate: 0 0; }

@media (prefers-reduced-motion: reduce) {
  .js .stagger > *, .js .svc .svc-copy { opacity: 1; translate: none; }
  .js .svc .framed { clip-path: none; }
  .hero-title, .hero-tag, .hero .wp-block-buttons { translate: none; }
}

/* surface: grain, light, layered shadow */
:root {
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --lift: 0 1px 2px rgb(8 47 64 / .08), 0 6px 14px -4px rgb(8 47 64 / .12), 0 26px 48px -20px rgb(8 47 64 / .32);
  --lift-hi: 0 2px 4px rgb(8 47 64 / .1), 0 14px 28px -8px rgb(8 47 64 / .2), 0 44px 70px -26px rgb(8 47 64 / .45);
  --paper: #f7f5ef;
}
body::after { content: ""; position: fixed; inset: 0; z-index: 9000; pointer-events: none; background-image: var(--grain); opacity: .07; mix-blend-mode: multiply; }
body { background: var(--paper); }

.who, .links, .page-head, .foot { position: relative; isolation: isolate; }
.who::before, .links::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(900px 500px at 85% 0%, rgb(169 195 179 / .22), transparent 60%), radial-gradient(700px 600px at 0% 100%, rgb(0 0 0 / .28), transparent 65%); }
.links::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: #fff; opacity: .05; -webkit-mask: var(--pattern) center / 420px auto repeat; mask: var(--pattern) center / 420px auto repeat; }
.who { box-shadow: inset 0 18px 30px -24px rgb(0 0 0 / .5); }

/* stepped edge from their pattern between bands */
.titlebar, .clinics, .partner { position: relative; }
.titlebar::before, .partner::before { content: ""; position: absolute; left: 50%; top: -17px; width: 120px; height: 18px; translate: -50% 0; background: inherit; clip-path: polygon(0 100%, 12% 100%, 12% 66%, 25% 66%, 25% 33%, 38% 33%, 38% 0, 62% 0, 62% 33%, 75% 33%, 75% 66%, 88% 66%, 88% 100%, 100% 100%); }
.partner::before { background: var(--sand); }

.titlebar { box-shadow: 0 14px 28px -18px rgb(0 0 0 / .55); z-index: 2; position: relative; letter-spacing: .01em; text-shadow: 0 2px 10px rgb(0 0 0 / .18); }

/* columns: outline numbers, inner light */
.cols { box-shadow: inset 0 24px 40px -30px rgb(0 0 0 / .8); }
.col-copy::before { content: ""; display: block; width: 86px; height: 52px; margin-bottom: 18px; background: rgb(255 255 255 / .55); -webkit-mask: var(--pattern) center / contain no-repeat; mask: var(--pattern) center / contain no-repeat; transition: background .4s, rotate .8s cubic-bezier(.2, .7, .2, 1), scale .8s cubic-bezier(.2, .7, .2, 1); }
.col:hover .col-copy::before { background: var(--sage); rotate: 90deg; scale: 1.12; }
.col::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background-image: var(--grain); opacity: .18; mix-blend-mode: overlay; }
.col-copy { z-index: 2; }

/* expertise on paper with raised cards */
.expertise { width: 100%; padding: 100px max(24px, calc((100% - 1240px) / 2)) 120px; background: linear-gradient(180deg, var(--paper), #eef2ee); }
.cells { border: 0; gap: 22px; }
.cell { border: 0; background: #fff; border-radius: 10px; box-shadow: var(--lift); }
.cell:hover { background: #fff; box-shadow: var(--lift-hi), inset 0 -3px 0 var(--green); }
.ico { width: 30px; height: 30px; }
.cell > .ico, .cell .ico { box-sizing: content-box; padding: 14px; background-clip: content-box; }
.cell .ico { position: relative; }
.cell h3 { margin-top: 20px; }
.cell::before { content: ""; position: absolute; top: 34px; left: 30px; width: 58px; height: 58px; border-radius: 50%; background: linear-gradient(145deg, #eef4f0, #d7e5dc); box-shadow: inset 0 2px 4px rgb(255 255 255 / .9), inset 0 -3px 6px rgb(76 129 101 / .18), 0 6px 14px -6px rgb(76 129 101 / .5); }
.cell .ico { position: relative; z-index: 1; margin: 0; }
.expertise h2 { position: relative; display: inline-block; }
.expertise h2::after { content: ""; position: absolute; left: 0; bottom: -8px; width: 64px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--green), var(--sage)); }
.expertise-band { box-shadow: var(--lift-hi); outline: 1px solid rgb(255 255 255 / .6); outline-offset: -8px; }

/* clinics: cards hang over the band edge */
.clinics { padding-bottom: 0; overflow: visible; z-index: 3; background: linear-gradient(180deg, #b6ccbe, var(--sage)); }
.clinics::before { overflow: hidden; }
.clinic-row { margin-bottom: -90px; position: relative; z-index: 3; }
.clinic { box-shadow: var(--lift-hi); border: 0; outline: 6px solid #fff; outline-offset: -6px; }
.links { padding-top: 170px; }
@media (max-width: 860px) { .links { padding-top: 140px; } }

/* helpful links: offset frame behind the photo */
.links-media { overflow: visible; }
.links-media::before { content: ""; position: absolute; inset: 22px -22px -22px 22px; border: 2px solid var(--sage); border-radius: 12px; z-index: -1; }
.links-media .links-img { border-radius: 10px; overflow: hidden; box-shadow: var(--lift-hi); }
.links .wp-block-details { box-shadow: 0 8px 18px -12px rgb(0 0 0 / .5); backdrop-filter: blur(4px); }
.links .wp-block-details[open] { box-shadow: 0 18px 30px -16px rgb(0 0 0 / .6); }

/* partner: paper and a lifted form */
.partner { background: var(--sand); box-shadow: inset 0 20px 30px -26px rgb(0 0 0 / .35); }
.partner h2 { position: relative; padding-bottom: 14px; }
.partner h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 64px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--green), var(--sage)); }
.partner-form, .apply-card { box-shadow: var(--lift-hi); border-top: 5px solid var(--green); position: relative; }
.partner-form::after, .apply-card::after { content: ""; position: absolute; inset: auto 18px -14px 18px; height: 14px; border-radius: 0 0 10px 10px; background: rgb(255 255 255 / .55); z-index: -1; box-shadow: 0 10px 20px -10px rgb(0 0 0 / .25); }

/* buttons: weight and sheen */
.wp-block-button__link, .btn-solid, .nav-cta, .logobar-cta { position: relative; overflow: hidden; box-shadow: 0 2px 0 rgb(0 0 0 / .18), 0 10px 20px -10px rgb(0 0 0 / .45); }
.wp-block-button__link::after, .btn-solid::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgb(255 255 255 / .28) 50%, transparent 70%); translate: -120% 0; transition: translate .8s ease; }
.wp-block-button__link:hover::after, .btn-solid:hover::after { translate: 120% 0; }
.btn-solid { position: relative; }

/* header depth */
.logobar { box-shadow: inset 0 -1px 0 rgb(255 255 255 / .08); background: linear-gradient(180deg, #035f78, var(--logo-blue)); }
.navbar { box-shadow: 0 10px 22px -14px rgb(0 0 0 / .45); position: relative; z-index: 5; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background-image: var(--grain); opacity: .12; mix-blend-mode: overlay; }
.hero-copy { position: relative; z-index: 1; }
.hero-title { text-shadow: 0 2px 2px rgb(0 0 0 / .2), 0 10px 40px rgb(0 0 0 / .35); }

/* inner pages */
.page-head { box-shadow: inset 0 -30px 50px -40px rgb(0 0 0 / .6); }
.page-head h1 { text-shadow: 0 4px 24px rgb(0 0 0 / .3); }
.person { border: 0; box-shadow: var(--lift); border-radius: 10px; }
.person:hover { box-shadow: var(--lift-hi); }
.stat { box-shadow: var(--lift-hi); }
.svc { border-bottom: 0; position: relative; }
.svc + .svc::before { content: ""; position: absolute; top: 0; left: 50%; translate: -50% 0; width: 64px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--green), var(--sage)); }
.split-media .framed, .svc-media .framed { position: relative; overflow: visible; box-shadow: none; }
.framed { isolation: isolate; }
.svc-media, .split-media { position: relative; }
.svc-media::before, .split-media::before { content: ""; position: absolute; inset: 18px -18px -18px 18px; border-radius: 12px; background: var(--sage); opacity: .45; z-index: -1; }
.svc-flip .svc-media::before { inset: 18px 18px -18px -18px; }
.framed img { border-radius: 8px; box-shadow: var(--lift-hi); }
.post-card img, .single-media { box-shadow: var(--lift); }
.footprint, .careers-split { box-shadow: inset 0 20px 30px -26px rgb(0 0 0 / .3); }