:root {
  --s-ground: #E9F9DB;
  --s-ink: #2B1E1B;
  --s-blue: #263E6E;
  --s-wash: #BBDCCF;
  --s-leaf: #91BD9C;
  --s-gutter: clamp(28px, 5.55vw, 96px);
  --s-measure: 1120px;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { scroll-padding-top: 28px; }
body { margin: 0; background: var(--s-ground); color: var(--s-ink); font: 21px/1.55 "Meera Inimai", "Trebuchet MS", sans-serif; }
a { color: var(--s-blue); text-decoration-thickness: 1.5px; text-underline-offset: .18em; transition: text-decoration-color .16s ease, background-color .16s ease; }
a:hover { text-decoration-thickness: 3px; text-decoration-color: var(--s-ink); }
a:focus-visible { outline: 3px solid var(--s-blue); outline-offset: 5px; border-radius: 4px; }
::selection { color: var(--s-ground); background: var(--s-blue); }
img { max-width: 100%; }
i[data-lucide], svg.lucide { display: inline-block; width: 18px; height: 18px; vertical-align: -.14em; flex-shrink: 0; }
.shore-skip { position: absolute; z-index: 8; left: 16px; top: -120px; padding: 8px 14px; color: var(--s-ground); background: var(--s-blue); border-radius: 4px; }
.shore-skip:focus { top: 8px; }
.contour-mast { position: relative; padding: 16px var(--s-gutter) 14px; background: var(--s-ground); border-top: 8px solid var(--s-blue); }
.contour-type { min-height: 116px; max-width: var(--s-measure); margin: auto; font-size: 17px; line-height: 25px; }
.mast-blank { float: left; width: 156px; height: 113px; margin: 0 23px 0 -44px; shape-outside: ellipse(50% 50% at 50% 50%) border-box; shape-margin: 12px; border-radius: 50%; background: var(--s-leaf); box-shadow: -12px 5px 0 var(--s-wash); }
.contour-brand { color: var(--s-ink); font: 700 28px/33px "Inika", Georgia, serif; text-decoration: none; }
.contour-nav { display: inline; }
.contour-nav a { text-decoration: none; border-radius: 4px; padding: 1px 4px 1px 0; }
.contour-nav a:hover { background: var(--s-wash); }
.contour-nav svg, .contour-nav i { height: 15px; width: 15px; margin-right: 8px; }
.contour-nav [aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; }
.shore-stage { position: relative; background: var(--s-wash) url("rope-in-hand.webp") center 57% / cover; padding-bottom: 54px; isolation: isolate; overflow: clip; }
.shore-stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 10px; background: var(--s-blue); }
.shore-paper { position: relative; }
.title-tide { display: flow-root; position: relative; min-height: 390px; padding: 35px var(--s-gutter) 24px; background: radial-gradient(ellipse 550px 230px at 0 162px, transparent calc(100% - 1px), var(--s-ground) 100%); }
.title-tide::after { content: ""; position: absolute; z-index: 0; left: -570px; top: -68px; width: 1140px; height: 460px; border: 12px solid var(--s-leaf); border-radius: 50%; transform: translate(10px, 8px); pointer-events: none; }
.tide-cut { float: left; width: 550px; height: 392px; margin: -35px 22px 0 calc(-1 * var(--s-gutter)); shape-outside: ellipse(550px 230px at 0 162px) border-box; shape-margin: 32px; }
.tide-cut::before { content: ""; display: block; width: 100%; height: 100%; background: var(--s-wash) url("rope-in-hand.webp") 42% 52% / cover; clip-path: ellipse(550px 230px at 0 162px); }
.shore-title { color: var(--s-blue); font: 400 clamp(48px, 4.75vw, 72px)/1.08 "Inika", Georgia, serif; letter-spacing: -.04em; margin: 0 0 21px; }
.shore-lead { font-size: 23px; line-height: 1.4; margin: 0; }
.care-question { position: relative; clear: both; margin: 0; padding: 6px max(var(--s-gutter), calc((100vw - var(--s-measure)) / 2)) 27px; background: var(--s-ground); }
.care-mark { display: block; font: 400 68px/.95 "Inika", Georgia, serif; color: var(--s-blue); margin: -5px 0 7px; }
.care-copy { font-size: 19px; line-height: 1.4; margin: 0; }
.care-context { font-size: 17px; line-height: 1.4; margin: 11px 0 0; }
.care-context strong { font-weight: 400; color: var(--s-blue); }
.phone-tide { display: none; }
.broad-argument { max-width: var(--s-measure); margin: 0 auto; padding: 66px 0 20px; display: flow-root; counter-reset: qualification; }
.broad-argument > p { margin: 0 0 23px; }
h2 { font: 400 clamp(30px, 2.75vw, 41px)/1.22 "Inika", Georgia, serif; letter-spacing: -.03em; margin: 48px 0 23px; }
.broad-argument > h2:first-child { margin-top: 0; }
.broad-argument > h2:first-child::before { content: ""; display: block; width: 64px; height: 7px; background: var(--s-blue); margin-bottom: 22px; }
.broad-argument h3 { font: 700 25px/1.25 "Inika", Georgia, serif; }
.swell-photo { float: left; width: 48%; height: 410px; margin: 8px 35px 25px -80px; position: relative; shape-outside: ellipse(50% 48% at 46% 50%) border-box; shape-margin: 28px; }
.swell-photo::before { content: ""; position: absolute; inset: 18px -22px -14px -8px; background: var(--s-blue); clip-path: ellipse(50% 48% at 46% 50%); }
.swell-photo::after { content: ""; position: absolute; inset: -10px 8px 8px -18px; border: 3px solid var(--s-leaf); border-radius: 50%; transform: rotate(-8deg); pointer-events: none; }
.swell-photo img { display: block; position: relative; width: 100%; height: 100%; object-fit: cover; object-position: 34% 50%; clip-path: ellipse(50% 48% at 46% 50%); background: var(--s-wash); }
.qualification { clear: both; position: relative; padding: 34px 48px 36px; margin: 52px -48px 58px; background: var(--s-wash); border-top: 9px solid var(--s-blue); box-shadow: 12px 12px 0 var(--s-leaf); counter-increment: qualification; }
.qualification h2 { position: relative; margin: 0 0 18px; padding-right: 35px; max-width: 100%; }
.qualification h2::before { content: ""; position: absolute; right: -15px; top: -65px; width: 76px; height: 70px; background: url("open-contour.svg") center / contain no-repeat; transform: rotate(-12deg); }
.qualification p { position: relative; max-width: 980px; margin: 0 0 21px; }
.qualification p:last-child { margin-bottom: 0; }
.qualification ~ .qualification { color: var(--s-ground); background: var(--s-blue); border-top: 0; padding-top: 38px; box-shadow: -12px 12px 0 var(--s-wash); }
.qualification ~ .qualification h2::before { background: var(--s-ground); mask: url("open-contour.svg") center / contain no-repeat; }
.qualification ~ .qualification a { color: var(--s-ground); }
.qualification ~ .qualification a:focus-visible { outline-color: var(--s-ground); }
.inside-heading { position: relative; padding: 25px var(--s-gutter) 40px; max-width: calc(var(--s-measure) + 2 * var(--s-gutter)); margin: auto; }
.inside-heading h1 { color: var(--s-blue); max-width: 1060px; font: 400 clamp(42px, 4.5vw, 66px)/1.13 "Inika", Georgia, serif; letter-spacing: -.035em; margin: 24px 0 22px; }
.path-crumb { font-size: 17px; line-height: 1.4; }
.path-crumb span { padding: 0 10px; }
.inside-heading .shore-lead { max-width: 890px; }
.inside-band { position: relative; height: 205px; margin: 0 0 -45px; overflow: hidden; background: var(--s-wash); border-bottom: 10px solid var(--s-blue); clip-path: polygon(0 0, 100% 0, 100% 76%, 72% 100%, 0 87%); }
.inside-band img { display: block; height: 100%; width: 100%; object-fit: cover; object-position: 50% 42%; }
.inside-main .broad-argument { position: relative; padding-top: 78px; }
.inside-main .lead-photo { height: 355px; margin-top: -78px; }
.shore-foot { clear: both; padding: 50px var(--s-gutter) 36px; margin-top: 48px; color: var(--s-ground); background: var(--s-blue); border-top: 12px solid var(--s-leaf); }
.foot-inner { max-width: var(--s-measure); margin: auto; }
.foot-roads { display: grid; grid-template-columns: repeat(5, 1fr); gap: 17px 22px; font-size: 18px; }
.foot-roads a { color: var(--s-ground); text-decoration: none; border-radius: 4px; }
.foot-roads i, .foot-roads svg { width: 15px; height: 15px; margin-right: 8px; }
.foot-roads a:hover { text-decoration: underline; text-decoration-color: var(--s-ground); background: #344E7E; }
.foot-roads a:focus-visible { outline-color: var(--s-ground); }
.foot-thought { max-width: 960px; font: 400 27px/1.4 "Inika", Georgia, serif; margin: 42px 0 24px; }
.foot-copy { font-size: 16px; margin: 0; }
.lost-path { min-height: 45vh; padding-bottom: 30px; }
@media (min-width: 1600px) {
  .title-tide { padding-right: max(var(--s-gutter), calc((100vw - 1440px) / 2)); }
}
@media (max-width: 1270px) and (min-width: 761px) {
  .title-tide { background: radial-gradient(ellipse 39vw 225px at 0 155px, transparent calc(100% - 1px), var(--s-ground) 100%); }
  .tide-cut { width: 39vw; height: 380px; shape-outside: ellipse(39vw 225px at 0 155px) border-box; }
  .tide-cut::before { clip-path: ellipse(39vw 225px at 0 155px); }
  .title-tide::after { display: none; }
  .shore-title { font-size: 54px; }
}
@media (max-width: 1320px) {
  .broad-argument { margin-left: var(--s-gutter); margin-right: var(--s-gutter); }
  .swell-photo { margin-left: calc(-1 * var(--s-gutter)); }
  .qualification { margin-left: 0; margin-right: 0; padding-left: 32px; padding-right: 32px; }
}
@media (max-width: 760px) {
  :root { --s-gutter: 20px; }
  body { font-size: 18px; line-height: 1.55; }
  .contour-mast { padding: 2px 20px; border-top-width: 3px; }
  .contour-type { min-height: 64px; font-size: 16px; line-height: 16px; }
  .mast-blank { width: 36px; height: 62px; margin: 0 10px 0 -12px; box-shadow: -6px 2px 0 var(--s-wash); }
  .contour-brand { font-size: 16px; line-height: 16px; white-space: nowrap; }
  .contour-nav svg, .contour-nav i { height: 12px; width: 12px; margin-right: 5px; }
  .shore-stage { padding-bottom: 14px; background-position: 35% bottom; background-size: auto 300px; }
  .shore-stage::after { height: 6px; }
  .shore-paper { padding: 0 20px; }
  .title-tide { min-height: 0; margin: 0 -20px; padding: 21px 20px 0; background: var(--s-ground); }
  .title-tide::after, .tide-cut { display: none; }
  .shore-title { font-size: 32px; line-height: 1.12; letter-spacing: -.03em; margin-bottom: 13px; }
  .shore-lead { font-size: 18px; line-height: 1.35; }
  .care-question { margin: 0 -20px; padding: 12px 20px 21px; }
  .care-mark { font-size: 42px; line-height: 1; margin: 0 0 4px; }
  .care-copy { font-size: 16.5px; line-height: 1.34; }
  .care-context { font-size: 16.5px; line-height: 1.34; margin-top: 10px; }
  .phone-tide { display: block; position: relative; width: calc(100% + 40px); max-width: none; height: 100px; margin: 0 0 0 -20px; }
  .phone-tide::before { content: ""; position: absolute; inset: -5px 35% -6px -14px; border-radius: 50%; background: var(--s-leaf); }
  .phone-tide img { display: block; position: relative; width: 100%; height: 100px; object-fit: cover; object-position: 32% 54%; clip-path: ellipse(75% 75% at 35% 75%); }
  .broad-argument { margin-left: 20px; margin-right: 20px; padding-top: 37px; }
  .broad-argument > p { margin-bottom: 21px; }
  h2 { font-size: 29px; line-height: 1.24; margin: 34px 0 18px; }
  .broad-argument > h2:first-child::before { margin-bottom: 17px; height: 5px; width: 44px; }
  .swell-photo, .inside-main .lead-photo { float: none; width: 100%; height: 240px; shape-outside: none; margin: 16px 0 31px; }
  .swell-photo::before { inset: 10px -4px -8px 5px; }
  .swell-photo::after { inset: -5px 6px 4px -5px; border-width: 2px; }
  .qualification { margin: 35px -12px 39px; padding: 27px 20px 29px; border-top-width: 6px; box-shadow: 6px 7px 0 var(--s-leaf); }
  .qualification h2 { padding-right: 0; }
  .qualification h2::before { width: 39px; height: 40px; right: -7px; top: -52px; }
  .qualification ~ .qualification { padding-top: 30px; box-shadow: -6px 7px 0 var(--s-wash); }
  .inside-heading { padding: 23px 20px 28px; }
  .inside-heading h1 { font-size: 34px; line-height: 1.18; margin: 18px 0; }
  .inside-band { height: 150px; margin-bottom: -20px; border-bottom-width: 6px; }
  .inside-band img { object-position: 32% 45%; }
  .inside-main .broad-argument { padding-top: 40px; }
  .inside-main .lead-photo { display: none; }
  .path-crumb { font-size: 16px; }
  .shore-foot { margin-top: 30px; padding: 30px 20px; border-top-width: 8px; }
  .foot-roads { grid-template-columns: repeat(2, 1fr); column-gap: 17px; row-gap: 19px; font-size: 17px; }
  .foot-thought { font-size: 23px; margin-top: 32px; }
}
@media (prefers-reduced-motion: no-preference) {
  .title-tide::after { animation: contour-settle 900ms ease-out both; }
  @keyframes contour-settle { from { transform: translate(-8px, 16px); } to { transform: translate(10px, 8px); } }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}