:root {
  --experience-blue: #285f8f;
  --experience-green: #2f6f57;
  --experience-amber: #8a5a00;
  --experience-red: #a33a45;
}

body.smyrna-experience-theme {
  margin: 0;
  background: var(--shell-paper);
  color: var(--shell-ink);
  font-family: Inter, system-ui, sans-serif;
}

.experience-main { padding-top: 80px; }
.experience-container { width: min(100% - 3rem, 1080px); margin-inline: auto; }
.experience-kicker { margin: 0 0 1rem; color: var(--shell-violet-dark); font-size: .72rem; font-weight: 600; letter-spacing: .19em; text-transform: uppercase; }
.experience-intro { padding: 3.75rem 0 2.75rem; border-bottom: 1px solid var(--shell-line); }
.experience-intro-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(17rem, .65fr); gap: 4rem; align-items: end; }
.experience-title { max-width: 680px; margin: 0; font: 500 clamp(2.65rem, 5vw, 4.6rem)/.98 Newsreader, Georgia, serif; letter-spacing: -.04em; }
.experience-lede { max-width: 620px; margin: 1.25rem 0 0; color: var(--shell-muted); font-size: .98rem; line-height: 1.68; }
.experience-note { padding: 1.4rem 0 0 1.4rem; border-left: 2px solid var(--shell-violet); }
.experience-note h2 { margin: 0 0 .55rem; font-size: .73rem; letter-spacing: .14em; text-transform: uppercase; }
.experience-note p { margin: 0; color: var(--shell-muted); font-size: .82rem; line-height: 1.65; }

.sector-index { border-bottom: 1px solid var(--shell-line); background: var(--shell-whitepaper); }
.sector-index-grid { display: grid; grid-template-columns: repeat(6, 1fr); }
.sector-filter { display: block; min-width: 0; padding: 1.25rem .9rem; border: 0; border-left: 1px solid var(--shell-line); border-radius: 0; background: transparent; color: var(--shell-muted); font: inherit; font-size: .72rem; line-height: 1.45; text-align: left; text-decoration: none; cursor: pointer; transition: background-color 160ms ease, color 160ms ease; }
.sector-filter:last-child { border-right: 1px solid var(--shell-line); }
.sector-filter strong { display: block; margin-bottom: .25rem; color: var(--shell-ink); font-size: .92rem; }
.sector-filter:hover, .sector-filter:focus-visible, .sector-filter.is-active { background: #eee8fa; color: var(--shell-violet-dark); }
.sector-filter.is-active strong { color: var(--shell-violet-dark); }
.sector-section[hidden] { display: none; }

.experience-evidence { padding: 3.5rem 0; border-bottom: 1px solid var(--shell-line); }
.evidence-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 4rem; }
.evidence-grid h2 { max-width: 400px; margin: 0; font: 500 clamp(2rem, 3vw, 3rem)/1.05 Newsreader, Georgia, serif; letter-spacing: -.03em; }
.evidence-steps { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem 2.5rem; }
.evidence-step { padding-top: 1rem; border-top: 2px solid var(--shell-line); }
.evidence-step:nth-child(1) { border-color: var(--experience-blue); }
.evidence-step:nth-child(2) { border-color: var(--experience-green); }
.evidence-step:nth-child(3) { border-color: var(--experience-amber); }
.evidence-step:nth-child(4) { border-color: var(--shell-violet); }
.evidence-step h3 { margin: 0 0 .45rem; font-size: .86rem; }
.evidence-step p { margin: 0; color: var(--shell-muted); font-size: .8rem; line-height: 1.55; }

.sector-section { padding: 3.5rem 0; border-bottom: 1px solid var(--shell-line); scroll-margin-top: 78px; }
.sector-section:nth-of-type(even) { background: var(--shell-whitepaper); }
.sector-heading { display: grid; grid-template-columns: .62fr 1.38fr; gap: 3rem; margin-bottom: 2rem; align-items: end; }
.sector-heading h2 { margin: 0; font: 500 clamp(1.9rem, 3.3vw, 3rem)/1 Newsreader, Georgia, serif; letter-spacing: -.03em; }
.sector-heading p:last-child { max-width: 670px; margin: 0; color: var(--shell-muted); line-height: 1.65; }
.case-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--shell-line); border-left: 1px solid var(--shell-line); }
.case-card { display: flex; flex-direction: column; min-width: 0; padding: 2rem; border-right: 1px solid var(--shell-line); border-bottom: 1px solid var(--shell-line); background: rgba(252,251,248,.7); }
.case-card:hover { background: var(--shell-whitepaper); }
.case-card-wide { grid-column: 1 / -1; }
.case-meta { display: flex; justify-content: space-between; gap: 1rem; color: var(--shell-muted); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.case-tag { color: var(--shell-violet-dark); font-weight: 600; }
.case-card h3 { margin: .85rem 0 1.15rem; font: 500 1.5rem/1.1 Newsreader, Georgia, serif; letter-spacing: -.02em; }
.case-body { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.case-block h4 { margin: 0 0 .45rem; font-size: .67rem; letter-spacing: .13em; text-transform: uppercase; }
.case-block p { margin: 0; color: var(--shell-muted); font-size: .82rem; line-height: 1.62; }
.case-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; margin-top: auto; padding-top: 1.5rem; }
.case-metric { min-width: 0; padding-top: .8rem; border-top: 1px solid var(--shell-line); }
.case-metric strong { display: block; color: var(--shell-ink); font: 600 1.28rem/1 Newsreader, Georgia, serif; }
.case-metric span { display: block; margin-top: .4rem; color: var(--shell-muted); font-size: .65rem; line-height: 1.35; }
.case-evidence { margin: 1.25rem 0 0; color: var(--shell-muted); font-size: .7rem; line-height: 1.5; }
.case-evidence strong { color: var(--shell-ink); }
.case-card[data-sector="medical"] { box-shadow: inset 0 3px 0 var(--experience-blue); }
.case-card[data-sector="pharma"] { box-shadow: inset 0 3px 0 var(--shell-violet); }
.case-card[data-sector="chemical"] { box-shadow: inset 0 3px 0 var(--experience-amber); }
.case-card[data-sector="consumer"] { box-shadow: inset 0 3px 0 var(--experience-green); }
.case-card[data-sector="industrial"] { box-shadow: inset 0 3px 0 var(--experience-red); }

.experience-profile { padding: 4rem 0; border-bottom: 1px solid var(--shell-line); background: var(--shell-whitepaper); }
.profile-heading { display: grid; grid-template-columns: .82fr 1.18fr; margin-bottom: 2rem; align-items: end; gap: 4rem; }
.profile-heading h2 { max-width: 520px; margin: 0; font: 500 clamp(2.15rem,3.7vw,3.5rem)/.98 Newsreader,Georgia,serif; letter-spacing: -.04em; }
.profile-heading > p { max-width: 640px; margin: 0; color: var(--shell-muted); font-size: .82rem; line-height: 1.65; }
.profile-fit { display: grid; border-top: 1px solid var(--shell-ink); border-bottom: 1px solid var(--shell-line); grid-template-columns: .72fr 1.28fr; }
.profile-scale { padding: 1.5rem 2rem 1.5rem 0; border-right: 1px solid var(--shell-line); }
.profile-scale span { display: block; color: var(--shell-violet-dark); font-size: .64rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.profile-scale strong { display: block; margin: 1.5rem 0 .65rem; font: 500 clamp(2.7rem,5vw,4.5rem)/.9 Newsreader,Georgia,serif; letter-spacing: -.045em; }
.profile-scale p { max-width: 300px; margin: 0; color: var(--shell-muted); font-size: .7rem; line-height: 1.55; }
.profile-fit ul { display: grid; margin: 0; padding: 0; list-style: none; }
.profile-fit li { display: grid; padding: 1rem 0 1rem 1.5rem; border-bottom: 1px solid var(--shell-line); grid-template-columns: minmax(12rem,.72fr) 1.28fr; gap: 1.5rem; }
.profile-fit li:last-child { border-bottom: 0; }
.profile-fit li strong { font: 500 1.05rem/1.1 Newsreader,Georgia,serif; }
.profile-fit li span { color: var(--shell-muted); font-size: .7rem; line-height: 1.5; }
.experience-scale { display: grid; margin: 1.5rem 0 0; border-top: 1px solid var(--shell-line); border-left: 1px solid var(--shell-line); grid-template-columns: repeat(4,1fr); }
.experience-scale div { min-height: 8.5rem; padding: 1rem; border-right: 1px solid var(--shell-line); border-bottom: 1px solid var(--shell-line); }
.experience-scale dt { font: 500 1.45rem/1 Newsreader,Georgia,serif; }
.experience-scale dd { margin: 1.7rem 0 0; color: var(--shell-muted); font-size: .66rem; line-height: 1.5; }
.experience-claim-note { max-width: 880px; margin: .85rem 0 0; color: var(--shell-muted); font-size: .62rem; line-height: 1.55; }
.experience-claim-note strong { color: var(--shell-ink); }
.engagement-models { display: grid; margin-top: 3rem; grid-template-columns: minmax(14rem,.48fr) 1.52fr; gap: 2.5rem; }
.engagement-models header h3 { max-width: 360px; margin: 0; font: 500 clamp(1.8rem,3vw,2.7rem)/1 Newsreader,Georgia,serif; letter-spacing: -.03em; }
.engagement-models ol { display: grid; margin: 0; padding: 0; border-top: 1px solid var(--shell-ink); grid-template-columns: repeat(4,1fr); list-style: none; }
.engagement-models li { position: relative; min-height: 12.5rem; padding: 1rem; border-right: 1px solid var(--shell-line); }
.engagement-models li:last-child { border-right: 0; }
.engagement-models li:not(:last-child)::after { content: "→"; position: absolute; top: 1rem; right: -.55rem; z-index: 1; display: grid; width: 1.1rem; height: 1.1rem; border-radius: 50%; place-items: center; background: var(--shell-violet); color: #fff; font-size: .55rem; }
.engagement-models li > span { display: block; color: var(--shell-violet-dark); font-size: .6rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.engagement-models li strong { display: block; margin: 2rem 0 .65rem; font: 500 1.05rem/1.08 Newsreader,Georgia,serif; }
.engagement-models li p { margin: 0; color: var(--shell-muted); font-size: .67rem; line-height: 1.5; }

.experience-dossiers { padding: 5rem 0; border-bottom: 1px solid var(--shell-line); background: var(--shell-ink); color: #fff; }
.dossiers-heading { display: grid; grid-template-columns: .8fr 1.2fr; gap: 4rem; margin-bottom: 2.5rem; align-items: end; }
.dossiers-heading h2 { max-width: 600px; margin: 0; font: 500 clamp(2.5rem, 4vw, 4.2rem)/.98 Newsreader, Georgia, serif; letter-spacing: -.04em; }
.dossiers-heading > p { max-width: 650px; margin: 0; color: rgba(255,255,255,.55); line-height: 1.7; }
.dossier-list { border-top: 1px solid rgba(255,255,255,.18); }
.experience-dossier { border-bottom: 1px solid rgba(255,255,255,.18); }
.experience-dossier summary { display: flex; min-height: 6.5rem; padding: 1.4rem 0; align-items: center; justify-content: space-between; gap: 2rem; cursor: pointer; list-style: none; }
.experience-dossier summary::-webkit-details-marker { display: none; }
.experience-dossier summary span { font: 500 clamp(1.35rem, 2.3vw, 2.15rem)/1.1 Newsreader, Georgia, serif; }
.experience-dossier summary small { display: block; margin-bottom: .55rem; color: var(--shell-violet-light); font: 600 .67rem/1.2 Inter, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; }
.experience-dossier summary > strong { color: var(--shell-violet-light); font-size: 1.8rem; font-weight: 400; transition: transform 180ms ease; }
.experience-dossier[open] summary > strong { transform: rotate(45deg); }
.dossier-content { display: grid; grid-template-columns: repeat(3, 1fr) .78fr; gap: 2rem; padding: .5rem 0 2.5rem; }
.dossier-content section, .dossier-content aside { padding-top: 1.1rem; border-top: 1px solid rgba(255,255,255,.15); }
.dossier-content h3, .dossier-content aside > span { display: block; margin: 0 0 .9rem; color: rgba(255,255,255,.46); font-size: .66rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.dossier-content ul { margin: 0; padding: 0; list-style: none; }
.dossier-content li { margin-top: .65rem; color: rgba(255,255,255,.68); font-size: .78rem; line-height: 1.5; }
.artifact-list { display: flex; flex-wrap: wrap; gap: .45rem; }
.artifact-list span { padding: .55rem .65rem; border: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.68); font-size: .69rem; }
.dossier-content aside strong { display: block; color: #fff; font: 500 2.3rem/1 Newsreader, Georgia, serif; }
.dossier-content aside p { margin: .65rem 0 0; color: rgba(255,255,255,.52); font-size: .75rem; line-height: 1.5; }

.sector-dossier { margin-top: 1.25rem; border-top: 1px solid var(--shell-line); border-bottom: 1px solid var(--shell-line); background: transparent; color: var(--shell-ink); }
.sector-dossier summary { min-height: 4.75rem; padding: .9rem 0; }
.sector-dossier summary span { color: var(--shell-ink); font-size: clamp(1.15rem, 2vw, 1.55rem); }
.sector-dossier summary small { display: inline; margin-right: .4rem; color: var(--shell-violet-dark); }
.sector-dossier summary > strong { color: var(--shell-violet); font-size: 1.4rem; }
.sector-dossier .dossier-content { padding: .5rem 0 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.sector-dossier .dossier-content section,
.sector-dossier .dossier-content aside { border-color: var(--shell-line); }
.sector-dossier .dossier-content h3,
.sector-dossier .dossier-content aside > span { color: var(--shell-muted); }
.sector-dossier .dossier-content li { color: var(--shell-muted); }
.sector-dossier .artifact-list span { border-color: var(--shell-line); color: var(--shell-muted); }
.sector-dossier .dossier-content aside strong { color: var(--shell-ink); font-size: 1.8rem; }
.sector-dossier .dossier-content aside p { color: var(--shell-muted); }

.experience-patterns { padding: 4rem 0; background: var(--shell-whitepaper); }
.patterns-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 4rem; }
.patterns-grid header { position: sticky; top: 7rem; align-self: start; }
.patterns-grid h2 { margin: 0; font: 500 clamp(2rem, 3.4vw, 3.2rem)/1 Newsreader, Georgia, serif; letter-spacing: -.035em; }
.patterns-grid header > p:last-child { max-width: 440px; margin: 1.25rem 0 0; color: var(--shell-muted); line-height: 1.65; }
.pattern-cards { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--shell-line); border-left: 1px solid var(--shell-line); }
.pattern-cards article { min-height: 14rem; padding: 1.6rem; border-right: 1px solid var(--shell-line); border-bottom: 1px solid var(--shell-line); transition: background-color 180ms ease, transform 180ms ease; }
.pattern-cards article:hover { background: var(--shell-paper); transform: translateY(-3px); }
.pattern-cards span { color: var(--shell-violet); font-size: .68rem; font-weight: 600; letter-spacing: .14em; }
.pattern-cards h3 { margin: 2.5rem 0 .75rem; font: 500 1.55rem/1.08 Newsreader, Georgia, serif; }
.pattern-cards p { margin: 0; color: var(--shell-muted); font-size: .8rem; line-height: 1.6; }

.experience-close { padding: 4.5rem 0; background: var(--shell-ink); color: #fff; }
.experience-close-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4rem; align-items: center; }
.experience-close h2 { max-width: 650px; margin: 0; color: #fff; font: 500 clamp(2rem, 3.4vw, 3.2rem)/1 Newsreader, Georgia, serif; letter-spacing: -.03em; }
.experience-close p { margin: 0 0 1.5rem; color: rgba(255,255,255,.6); line-height: 1.65; }
.experience-cta { display: inline-flex; padding: .95rem 1.2rem; background: var(--shell-violet); color: #fff; font-size: .85rem; font-weight: 600; text-decoration: none; }
.experience-cta:hover { background: var(--shell-violet-dark); }

.experience-main :focus-visible { outline: 3px solid var(--shell-violet-light); outline-offset: 4px; }

@media (max-width: 900px) {
  .experience-intro-grid, .profile-heading, .evidence-grid, .sector-heading, .dossiers-heading, .patterns-grid, .experience-close-grid { grid-template-columns: 1fr; gap: 2rem; }
  .engagement-models { grid-template-columns: 1fr; gap: 1.5rem; }
  .experience-scale, .engagement-models ol { grid-template-columns: repeat(2,1fr); }
  .engagement-models li:nth-child(2) { border-right: 0; }
  .engagement-models li { border-bottom: 1px solid var(--shell-line); }
  .engagement-models li:nth-child(2)::after { display: none; }
  .dossier-content, .sector-dossier .dossier-content { grid-template-columns: 1fr 1fr; }
  .patterns-grid header { position: static; }
  .sector-index-grid { display: flex; width: 100%; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; }
  .sector-filter { min-width: 10.5rem; border-bottom: 1px solid var(--shell-line); scroll-snap-align: start; }
  .sector-filter:last-child { border-right: 1px solid var(--shell-line); }
  .case-grid { grid-template-columns: 1fr; }
  .case-card-wide { grid-column: auto; }
}

@media (max-width: 620px) {
  .experience-main { padding-top: 68px; }
  .experience-container { width: min(100% - 2rem, 1180px); }
  .experience-intro { padding: 3.25rem 0 2.75rem; }
  .experience-title { font-size: 3rem; }
  .experience-profile, .experience-evidence, .sector-section, .experience-close { padding: 3.25rem 0; }
  .profile-fit, .evidence-steps, .case-body, .dossier-content, .sector-dossier .dossier-content, .pattern-cards { grid-template-columns: 1fr; }
  .profile-scale { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--shell-line); }
  .profile-fit li { padding-left: 0; grid-template-columns: 1fr; gap: .45rem; }
  .experience-scale, .engagement-models ol { grid-template-columns: 1fr; }
  .experience-scale div, .engagement-models li { min-height: 0; border-right: 0; }
  .experience-scale dd { margin-top: .6rem; }
  .engagement-models li:not(:last-child)::after { content: "↓"; top: auto; right: 1rem; bottom: -.55rem; display: grid; }
  .experience-dossier summary { min-height: 5.5rem; gap: 1rem; }
  .experience-dossier summary span { font-size: 1.3rem; }
  .pattern-cards article { min-height: 11rem; }
  .case-card { padding: 1.4rem; }
  .case-card h3 { font-size: 1.55rem; }
  .case-metrics { grid-template-columns: 1fr; }
  .case-metric { display: grid; grid-template-columns: 6rem 1fr; gap: .8rem; align-items: baseline; }
  .case-metric span { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
