:root {
  --brand: #087579;
  --brand-deep: #07565a;
  --brand-ink: #102a31;
  --brand-tint: #e8fbf8;
  --accent: #f4b860;
  --page: #f5f7f4;
  --surface: rgba(255, 255, 255, .82);
  --text: #18343a;
  --muted: #668087;
  --line: rgba(16, 42, 49, .08);
  --space-6: clamp(20px, 3vw, 42px);
  --space-8: clamp(30px, 5vw, 76px);
  --font-body: "Avenir Next", "Segoe UI", sans-serif;
  --font-heading: "Georgia", "Times New Roman", serif;
}

html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 8% 8%, rgba(14, 165, 168, .11), transparent 26rem),
    radial-gradient(circle at 92% 20%, rgba(244, 184, 96, .12), transparent 24rem),
    var(--page) !important;
  color: var(--text) !important;
  font-family: var(--font-body) !important;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  opacity: .28;
  pointer-events: none;
  background-image: radial-gradient(rgba(16, 42, 49, .12) .7px, transparent .7px);
  background-size: 18px 18px;
  mask-image: linear-gradient(to bottom, #000, transparent 70%);
}

*, *::before, *::after { box-sizing: border-box; }
*:focus-visible { outline: 3px solid rgba(244, 184, 96, .9) !important; outline-offset: 4px; }
a { color: var(--brand-deep) !important; text-underline-offset: 4px; transition: color .25s ease, opacity .25s ease; }
a:hover { color: var(--brand) !important; }
.ink a, footer a { color: rgba(242, 251, 249, .78) !important; }
.ink a:hover, footer a:hover { color: #fff !important; }
.skip-link { position: fixed; left: 16px; top: 12px; z-index: 200; padding: 12px 16px; border-radius: 999px; background: var(--accent); color: var(--brand-ink) !important; font-weight: 700; transform: translateY(-180%); transition: transform .2s ease; }
.skip-link:focus { transform: translateY(0); }

/* Keep the desktop composition intentionally narrower than the viewport. */
x-dc, #dc-root {
  display: block;
  width: 100%;
  max-width: none;
  margin-inline: auto;
  box-shadow: none;
}
#dc-root > .sc-host { width: 100%; }
section > div[style*="max-width:1400px"], footer > div[style*="max-width:1400px"] {
  width: min(80%, 1400px);
}

.ink {
  background: linear-gradient(135deg, #102a31 0%, #17444b 58%, #0f3138 100%) !important;
  color: #f2fbf9 !important;
  position: relative;
  isolation: isolate;
}
.ink::after {
  content: "";
  position: absolute;
  width: 26rem;
  height: 26rem;
  right: -12rem;
  bottom: -16rem;
  border-radius: 50%;
  background: rgba(14, 165, 168, .26);
  filter: blur(10px);
  z-index: -1;
  animation: floatOrb 12s ease-in-out infinite alternate;
}
.gridlines { opacity: .14; background: linear-gradient(120deg, transparent 0 48%, rgba(255,255,255,.2) 49%, transparent 50%) !important; background-size: 34px 34px !important; }

header.ink { background: rgba(16, 42, 49, .88) !important; backdrop-filter: blur(18px); }
header.ink > div:first-child { background: var(--accent) !important; }
header.site-header {
  background: rgba(255,255,255,.96) !important;
  color: var(--brand-ink) !important;
  border-bottom: 1px solid rgba(16,42,49,.12) !important;
  box-shadow: 0 8px 24px rgba(16,42,49,.08);
  backdrop-filter: blur(18px);
}
header.site-header > div:first-child { background: var(--brand) !important; height: 2px !important; }
header.site-header > div:nth-child(2) { width: min(80%, 1440px); max-width: 1440px !important; min-height: 76px; padding: 10px 0 !important; }
header.site-header .logochip { box-shadow: none; border-radius: 0; padding: 4px !important; }
header.site-header .navmenu { align-items: center; gap: clamp(18px, 2vw, 32px) !important; }
header.site-header .navlink { color: var(--brand-ink) !important; font-size: 14px; letter-spacing: .015em; text-transform: none; font-weight: 600; }
header.site-header .navlink::after { display: none; }
header.site-header .navlink:hover, header.site-header .navlink[data-active="1"] { color: var(--brand) !important; }
header.site-header .navchevron { display: inline-block; margin-left: 4px; font-size: 16px; line-height: 0; transition: transform .25s ease; }
header.site-header .navitem { position: relative; }
header.site-header .navitem:hover .navchevron, header.site-header .navitem:focus-within .navchevron { transform: rotate(180deg); }
header.site-header .navdropdown {
  position: absolute;
  top: calc(100% + 22px);
  left: 50%;
  width: min(720px, 72vw);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 8px;
  padding: 18px;
  background: rgba(255,255,255,.98);
  border: 1px solid rgba(16,42,49,.16);
  border-radius: 4px;
  box-shadow: 0 18px 34px rgba(16,42,49,.2);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -8px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}
header.site-header .navdropdown::before { content: ""; position: absolute; top: -8px; left: 50%; width: 15px; height: 15px; background: #fff; border-left: 1px solid rgba(16,42,49,.16); border-top: 1px solid rgba(16,42,49,.16); transform: translateX(-50%) rotate(45deg); }
header.site-header .navitem:hover .navdropdown, header.site-header .navitem:focus-within .navdropdown { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
header.site-header .navdropdown a { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 10px 8px; color: var(--brand-ink) !important; text-decoration: none; font-size: 13px; font-weight: 600; letter-spacing: .01em; border-radius: 3px; }
header.site-header .navdropdown a:hover, header.site-header .navdropdown a:focus-visible { background: var(--brand-tint); color: var(--brand-deep) !important; outline: none !important; }
.studio-dropdown { width: 240px !important; grid-template-columns: 1fr !important; padding: 12px !important; }
.studio-dropdown a { min-height: 42px !important; }
.navicon { display: inline-grid; place-items: center; width: 22px; color: var(--brand-deep); font-size: 18px; }
header.site-header .navcta { background: var(--brand) !important; color: #fff !important; border-radius: 5px; padding: 13px 20px !important; text-transform: none; font-size: 14px; letter-spacing: .01em; box-shadow: none; }
header.site-header .navcta:hover { background: var(--brand-deep) !important; color: #fff !important; }
header.site-header .navtoggle { background: rgba(8,117,121,.08) !important; }
header.site-header .navtoggle span { background: var(--brand-ink); }
.logochip { background: rgba(255,255,255,.96) !important; border-radius: 14px; padding: 7px 10px !important; box-shadow: 0 10px 26px rgba(0, 0, 0, .16); }
.navmenu { gap: 26px !important; }
.navlink { color: rgba(242, 251, 249, .78) !important; letter-spacing: .08em; }
.navlink::after { background: var(--accent) !important; height: 3px !important; border-radius: 99px; }
.navlink:hover, .navlink[data-active="1"] { color: #fff !important; }
.navcta {
  background: var(--accent) !important;
  color: #18343a !important;
  border-radius: 999px;
  padding: 13px 20px !important;
  box-shadow: 0 10px 24px rgba(244, 184, 96, .2);
}
.navcta:hover { background: #fff !important; color: var(--brand-deep) !important; transform: translateY(-2px); }
.navtoggle { border: 0 !important; border-radius: 12px; background: rgba(255,255,255,.1) !important; }

section:not(.ink), footer:not(.ink) { position: relative; }
section[style*="border"], footer[style*="border"] { border: 0 !important; }
section[style*="background:var(--color-surface)"], section[style*="background:#fff"] { background: transparent !important; }
section[style*="background:#2aa3dc"] { background: linear-gradient(135deg, var(--brand), #087579) !important; }
section[style*="background:#2aa3dc"] h2, section[style*="background:#2aa3dc"] p { color: #fff !important; }
footer[style*="background:#14212b"], footer.ink {
  background: #fff !important;
  color: var(--text) !important;
  border-top: 0 !important;
  padding: 54px var(--space-6) 0 !important;
}
footer[style*="background:#14212b"] > div:first-child, footer.ink > div:first-child {
  max-width: 1400px !important;
  grid-template-columns: 1.25fr 1.15fr 1fr 1.35fr !important;
  gap: clamp(28px, 5vw, 80px) !important;
  padding-bottom: 44px;
}
footer[style*="background:#14212b"] > div:first-child > div:first-child,
footer.ink > div:first-child > div:first-child { display: block; }
footer[style*="background:#14212b"] h4, footer.ink h4 { color: var(--brand-ink) !important; font-size: 17px !important; letter-spacing: 0 !important; text-transform: none !important; margin-bottom: 20px !important; }
footer[style*="background:#14212b"] .flink, footer.ink .flink { color: #5d6870 !important; font-size: 15px !important; padding: 6px 0 !important; }
footer[style*="background:#14212b"] .flink:hover, footer.ink .flink:hover { color: var(--brand) !important; padding-left: 0 !important; }
footer[style*="background:#14212b"] p, footer.ink p { color: #5d6870 !important; }
footer[style*="background:#14212b"] > div:last-child, footer.ink > div:last-child {
  max-width: none !important;
  width: auto !important;
  margin: 0 calc(var(--space-6) * -1) !important;
  padding: 14px var(--space-6) !important;
  background: var(--brand) !important;
  border: 0 !important;
  color: #fff !important;
}
footer[style*="background:#14212b"] > div:last-child .flink, footer.ink > div:last-child .flink { color: #fff !important; }

h1, h2, h3, h4 { font-family: var(--font-heading) !important; color: inherit; }
h1 { text-wrap: balance; }
p { color: inherit; }
.rv { transition-timing-function: cubic-bezier(.16, 1, .3, 1) !important; }
.js-anim .rv { transform: translateY(24px) scale(.985); }
.js-anim .rv.in { transform: none; }

.srow, .step, .pcard, .soft, .hovcard, .wcard {
  border: 0 !important;
  border-radius: 22px;
}
.srow, .step { margin: 12px 0; background: rgba(255,255,255,.62); padding: clamp(24px, 4vw, 52px) !important; box-shadow: 0 14px 40px rgba(16,42,49,.06); }
.srow:hover, .step:hover { background: linear-gradient(110deg, #087579, #07565a) !important; transform: translateY(-4px); box-shadow: 0 22px 48px rgba(8,117,121,.2); }
.srow .idx, .num { color: var(--brand) !important; }
.srow:hover .idx, .step:hover .num { color: var(--accent) !important; }
.tagline, .chip { border: 0 !important; border-radius: 999px; background: rgba(14,165,168,.1) !important; color: var(--brand-deep) !important; }
.srow:hover .tagline { background: rgba(255,255,255,.16) !important; border: 0 !important; }
.wfig, .fig { border: 0 !important; border-radius: 22px; box-shadow: 0 16px 38px rgba(16,42,49,.1); }
.wcard:hover .wfig, .pcard:hover .fig, .fig:hover { transform: translateY(-4px); box-shadow: 0 24px 48px rgba(16,42,49,.16); }
.pcard, .soft, .hovcard { background: var(--surface) !important; box-shadow: 0 14px 38px rgba(16,42,49,.08) !important; backdrop-filter: blur(14px); }
.pcard:hover, .soft:hover, .hovcard:hover { box-shadow: 0 24px 52px rgba(16,42,49,.15) !important; }
.fbtn { border: 0 !important; border-radius: 999px; background: rgba(16,42,49,.07) !important; }
.fbtn[aria-pressed="true"], .fbtn:hover { background: var(--brand) !important; color: #fff !important; }

.f input, .f textarea, .f select { border: 0 !important; border-radius: 14px !important; background: rgba(255,255,255,.72) !important; padding: 18px !important; box-shadow: inset 0 0 0 1px rgba(16,42,49,.06); }
.f { padding-top: 0 !important; }
.f label { left: 18px !important; top: 18px !important; }
.f input:focus ~ label, .f textarea:focus ~ label, .f input:not(:placeholder-shown) ~ label, .f textarea:not(:placeholder-shown) ~ label, .f.sel label { transform: translateY(-9px) scale(.72) !important; background: #fff; padding: 0 6px; border-radius: 6px; }
.f::after { display: none; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cbx a { position: relative; z-index: 1; }
.send { border: 0 !important; border-radius: 999px; background: var(--brand) !important; box-shadow: 0 15px 30px rgba(14,165,168,.22); }
.send::before { background: var(--brand-deep) !important; }
.scroll-top {
  position: fixed;
  right: clamp(18px, 3vw, 38px);
  bottom: clamp(18px, 3vw, 38px);
  z-index: 100;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--brand-ink);
  color: #fff;
  font: 700 24px/1 var(--font-body);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px) scale(.85);
  box-shadow: 0 14px 32px rgba(16,42,49,.22);
  transition: opacity .3s ease, visibility .3s ease, transform .3s cubic-bezier(.16,1,.3,1), background .25s ease;
}
.scroll-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.scroll-top:hover { background: var(--brand) !important; color: #fff !important; transform: translateY(-4px) scale(1.04); }
.scroll-top:active { transform: translateY(-1px) scale(.98); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.visual-placeholder { position: absolute; inset: 0; display: block; background: radial-gradient(circle at 22% 24%, rgba(244,184,96,.7), transparent 24%), linear-gradient(135deg, #087579, #102a31 68%, #f4b860); }

@keyframes floatOrb { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(-30px, -22px, 0) scale(1.12); } }
@keyframes riseIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media (max-width: 900px) {
  section > div[style*="max-width:1400px"], footer > div[style*="max-width:1400px"] { width: min(92%, 1400px); }
  header.site-header > div:nth-child(2) { width: 92%; min-height: 68px; padding: 10px 0 !important; }
  header.site-header .navmenu { background: #fff !important; border: 0 !important; border-radius: 0 0 14px 14px; box-shadow: 0 18px 30px rgba(16,42,49,.14); }
  header.site-header .navmenu .navitem { width: 100%; }
  header.site-header .navdropdown { position: static; width: 100%; display: none; grid-template-columns: 1fr; padding: 8px; margin: 4px 0 8px; border: 0; border-radius: 8px; box-shadow: none; background: var(--brand-tint); transform: none; }
  header.site-header .navdropdown::before { display: none; }
  header.site-header .navitem:hover .navdropdown, header.site-header .navitem:focus-within .navdropdown { display: grid; transform: none; }
  header.site-header .navdropdown a { min-height: 42px; }
  .navmenu.open { padding-bottom: 22px !important; }
  .navmenu > * { padding: 12px 0 !important; }
  .srow, .step { border-radius: 18px; }
  footer[style*="background:#14212b"] > div:first-child, footer.ink > div:first-child { grid-template-columns: 1fr 1fr !important; }
}