/* Motion and the home-page service selector. Content is visible by default. */
:root { --ar-ease: cubic-bezier(.2,.7,.2,1); }

.service-showcase { margin-top: 8px; }
.service-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.service-panel { min-width: 0; background: white; }
.service-panel-photo { overflow: hidden; height: 320px; background: #dfe5ea; }
.service-panel-photo img { width: 100%; height: 100%; object-fit: cover; }
.service-panel-copy { padding: 30px 34px; }
.service-panel-heading { display: flex; align-items: baseline; gap: 18px; }
.service-panel-heading h3 { font-size: 30px; line-height: 1.2; }
.service-panel-number { color: var(--muted); font-size: 12px; letter-spacing: .05em; }
.service-panel-copy > p { margin: 18px 0 22px; font-size: 16px; line-height: 1.8; max-width: 540px; }
.service-panel-copy .service-links { list-style: none; padding: 0; margin: 0; font-size: 15px; }

.service-showcase[data-enhanced] { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); gap: 64px; align-items: start; }
.service-showcase[data-enhanced] .service-panels { display: grid; grid-template-columns: minmax(0,1fr); }
/* Panels share a grid cell: the tallest sets stable height while hidden panels stay inert. */
.service-showcase[data-enhanced] .service-panel { grid-area: 1 / 1; display: flex; flex-direction: column; }
.service-showcase[data-enhanced] .service-panel-photo { flex: none; }
.service-showcase[data-enhanced] .service-panel-copy { display: flex; flex-direction: column; flex: 1; }
.service-showcase[data-enhanced] .service-links { margin-top: auto; }
.service-showcase[data-enhanced] .service-panel[hidden] { display: block !important; visibility: hidden; pointer-events: none; }
.service-showcase[data-enhanced] .service-panel[hidden] * { visibility: hidden; }
.service-showcase[data-enhanced] .service-panel-photo { height: clamp(280px,28vw,390px); }
.service-tabs { border-top: 1px solid #bdc9d5; }
.service-tabs[hidden] { display: none; }
.service-tab { position: relative; isolation: isolate; display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 18px; width: 100%; min-height: 112px; border: 0; border-bottom: 1px solid #bdc9d5; padding: 22px 26px 22px 12px; background: transparent; text-align: left; color: var(--muted); font-size: clamp(20px,1.9vw,27px); line-height: 1.25; letter-spacing: -.025em; }
.service-tab-number { font-size: 12px; letter-spacing: .05em; }
.service-tab::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--blue); opacity: 0; transition: opacity 280ms var(--ar-ease); }
.service-tab[aria-selected=true] { color: white; }
.service-tab[aria-selected=true]::before { opacity: 1; }
.service-tab[aria-selected=true] .service-tab-number { color: #c5d4e3; }
.service-tab-indicator { position: absolute; height: 2px; left: 60px; right: 26px; bottom: 18px; background: currentColor; transform: scaleX(0); transform-origin: left; opacity: .5; transition: transform 430ms var(--ar-ease); }
.service-tab[aria-selected=true] .service-tab-indicator { transform: scaleX(1); }
.service-tab:focus-visible { z-index: 1; outline-offset: -4px; outline-color: #6598d7; }

.button { transition: transform 220ms var(--ar-ease), background-color 220ms ease, border-color 220ms ease; }
.button:active { transform: translateY(1px) scale(.985); }
.text-link { position: relative; }
.text-link::after { content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 320ms var(--ar-ease); }
.text-link:hover::after, .text-link:focus-visible::after { transform: scaleX(1); }
.service-links a { transition: transform 260ms var(--ar-ease); }
.service-card .service-photo img { transition: transform 780ms var(--ar-ease); }
.service-panel-photo img { transition: transform 900ms var(--ar-ease); }
.main-nav a { position: relative; }
.main-nav a:not([aria-current])::after { content: ''; position: absolute; left: 0; right: 0; bottom: -6px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 280ms var(--ar-ease); }
.main-nav a:not([aria-current]):hover { text-decoration: none; }
.main-nav a:not([aria-current]):hover::after, .main-nav a:focus-visible::after { transform: scaleX(1); }

@media (hover: hover) and (pointer: fine) {
  .button:not(:disabled):hover { transform: translateY(-2px); }
  .button:not(:disabled):active { transform: translateY(1px) scale(.985); }
  .service-links a:hover { transform: translateX(4px); }
  .service-card:hover .service-photo img, .service-panel-photo:hover img { transform: scale(1.045); }
  .service-tab:not([aria-selected=true]):hover { color: var(--blue); }
  .service-tab:not([aria-selected=true]):hover::before { opacity: .055; }
}

@keyframes ar-enter { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ar-photo-enter { from { transform: scale(1.045); } to { transform: scale(1); } }
@media (prefers-reduced-motion: no-preference) {
  .hero-copy > .eyebrow { animation: ar-enter 700ms var(--ar-ease) 40ms backwards; }
  .hero-copy > h1 { animation: ar-enter 400ms var(--ar-ease) 120ms backwards; }
  .hero-copy > p { animation: ar-enter 400ms var(--ar-ease) 220ms backwards; }
  .hero-copy > .hero-actions { animation: ar-enter 350ms var(--ar-ease) 180ms backwards; }
  .hero-art img { animation: ar-photo-enter 400ms var(--ar-ease) both; }
  .home-hero .disciplines > div { animation: ar-enter 700ms var(--ar-ease) 420ms backwards; }
  .home-hero .disciplines > div:nth-child(2) { animation-delay: 480ms; }
  .home-hero .disciplines > div:nth-child(3) { animation-delay: 540ms; }
  .home-hero .disciplines > div:nth-child(4) { animation-delay: 600ms; }
  .page-opening > h1 { animation: ar-enter 350ms var(--ar-ease) 70ms backwards; }
  .page-opening > p { animation: ar-enter 350ms var(--ar-ease) 180ms backwards; }
}

@media (max-width: 1100px) {
  .service-showcase[data-enhanced] { grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 32px; }
  .service-tab { padding-right: 20px; gap: 12px; min-height: 106px; }
  .service-panel-copy { padding: 26px; }
  .service-panel-heading h3 { font-size: 27px; }
}
@media (max-width: 700px) {
  .service-panels { grid-template-columns: minmax(0,1fr); gap: 26px; }
  .service-showcase[data-enhanced] { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .service-tabs { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; border: 0; }
  .service-tab { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; justify-content: flex-start; min-height: 110px; padding: 16px 14px 20px; font-size: 16px; line-height: 1.35; border: 1px solid #bdc9d5; letter-spacing: -.02em; }
  .service-tab-number { font-size: 10px; }
  .service-tab-indicator { left: 14px; right: 14px; bottom: 10px; }
  .service-showcase[data-enhanced] .service-panel-photo, .service-panel-photo { height: 240px; }
  .service-panel-copy { padding: 25px 23px; }
  .service-panel-heading { gap: 12px; }
  .service-panel-heading h3 { font-size: 27px; }
  .service-panel-copy > p { font-size: 15px; margin: 17px 0 23px; }
  .service-panel-copy .service-links { font-size: 14px; }
}
@media (max-width: 360px) {
  .service-tab { font-size: 15px; padding-inline: 12px; }
  .service-panel-copy { padding: 22px 18px; }
  .service-panel-heading h3 { font-size: 24px; }
  .service-showcase[data-enhanced] .service-panel-photo, .service-panel-photo { height: 210px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .button:hover, .button:active, .service-links a:hover, .service-card:hover .service-photo img, .service-panel-photo:hover img { transform: none; }
}
