@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500&display=swap');
  500;
  600;
  700&family=Playfair+Display:ital,wght@0,500;
  0,600;
  0,700;
  1,500&display=swap');
:root {
  --ink:#35232b;
  --muted:#725c64;
  --paper:#fbf6f1;
  --wine:#762640;
  --wine-deep:#4e1729;
  --gold:#bd8850;
  --line:#e5d3d0;
  --rose:#f4e6e3;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'DM Sans',Arial,sans-serif}
* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.65 var(--sans)}
a {
  color:inherit}
h1,h2,h3,p {
  margin-top:0}
h1,h2 {
  font-family:var(--serif);
  font-weight:600;
  line-height:1.08}
h1 {
  font-size:clamp(3rem,5vw,5.4rem);
  margin-bottom:1.4rem}
h2 {
  font-size:clamp(2.1rem,3.4vw,3.5rem);
  margin-bottom:1.3rem}
h3 {
  font-size:1.1rem;
  line-height:1.35}
.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  max-width:1320px;
  padding:1.25rem 2.5rem;
  margin:auto}
.brand {
  text-decoration:none;
  font:600 1.2rem var(--serif)}
.brand span {
  display:block;
  color:var(--gold);
  text-transform:uppercase;
  font:600 .64rem var(--sans);
  letter-spacing:.16em}
nav {
  display:flex;
  align-items:center;
  gap:1.35rem;
  font-size:.88rem}
nav a {
  text-decoration:none}
.nav-cta {
  border:1px solid var(--wine);
  padding:.48rem .8rem}
.hero {
  max-width:1320px;
  margin:0 auto;
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  background:#f3e3df;
  min-height:660px}
.hero-copy {
  padding:6.8rem max(2.5rem,7vw);
  align-self:center}
.eyebrow {
  margin:0 0 .85rem;
  color:var(--gold);
  font-size:.73rem;
  line-height:1.35;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase}
.lead {
  font:1.32rem/1.5 var(--serif);
  max-width:560px}
.hero-proof,.section-intro>p,.reframe-copy p,.method-grid p,.bio p,.consultation p,.price-note,.faq p {
  color:var(--muted)}
.hero-proof {
  max-width:560px}
.button {
  display:inline-block;
  margin-top:1rem;
  padding:.9rem 1.25rem;
  background:var(--wine);
  color:#fff;
  text-decoration:none;
  font-weight:700}
.hero-quote {
  margin:2rem 0 0;
  max-width:520px;
  color:var(--muted);
  font:italic 1rem/1.55 var(--serif)}
.hero-visual {
  position:relative;
  min-height:660px;
  overflow:hidden}
.basel-main {
  height:100%;
  margin:0}
.basel-main img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center}
.career-miniatures {
  position:absolute;
  right:1.5rem;
  bottom:3.2rem;
  display:flex;
  gap:.5rem}
.career-miniatures img {
  width:74px;
  height:98px;
  object-fit:cover;
  border:3px solid #fff;
  box-shadow:0 12px 26px rgba(54,20,31,.26)}
.basel-caption {
  position:absolute;
  left:1.5rem;
  bottom:1.25rem;
  margin:0;
  padding:.5rem .7rem;
  background:rgba(78,23,41,.88);
  color:#fff;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase}
.section {
  max-width:1180px;
  margin:0 auto;
  padding:7rem 2.5rem}
.section-intro {
  max-width:820px}
.recognition {
  padding-bottom:5rem}
.problem-switch {
  display:flex;
  gap:.7rem;
  margin:3rem 0 1.5rem}
.problem-tab {
  border:1px solid var(--wine);
  background:transparent;
  color:var(--wine);
  padding:.8rem 1.3rem;
  font:700 .92rem var(--sans);
  cursor:pointer}
.problem-tab.active {
  background:var(--wine);
  color:#fff}
.problem-panel {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:0 4rem}
.problem-panel p {
  position:relative;
  margin:0;
  padding:1rem 0 1rem 1.4rem;
  border-bottom:1px solid var(--line);
  color:var(--muted)}
.problem-panel p:before {
  content:'—';
  position:absolute;
  left:0;
  color:var(--gold)}
.transition {
  max-width:840px;
  margin:3rem 0 0;
  padding:1.25rem 0 0;
  border-top:2px solid var(--gold);
  font:1.15rem/1.55 var(--serif)}
.reframe {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7rem;
  padding:7rem max(2.5rem,calc((100% - 1180px)/2 + 2.5rem));
  background:var(--wine-deep);
  color:#fff}
.reframe .eyebrow {
  color:#edbc83}
.reframe-copy {
  padding-top:.7rem}
.reframe-copy p {
  color:#f4e7e8}
.reframe-strong {
  color:#fff!important;
  font:1.28rem/1.7 var(--serif)}
.method-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:2rem;
  margin-top:3.4rem}
.method-grid article {
  padding-top:1rem;
  border-top:2px solid var(--gold)}
.method-grid span {
  color:var(--gold);
  font:600 1.45rem var(--serif)}
.outcomes {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:3rem;
  max-width:none;
  padding:5rem max(2.5rem,calc((100% - 1180px)/2 + 2.5rem));
  background:#f1e0de}
.outcomes ul {
  columns:2;
  margin:0;
  padding:0;
  list-style:none}
.outcomes li {
  padding:.7rem 0;
  border-bottom:1px solid var(--line);
  font:1.08rem/1.45 var(--serif)}
.outcomes li:before {
  content:'+';
  margin-right:.6rem;
  color:var(--wine)}
.outcomes>p {
  grid-column:2;
  margin:0;
  color:var(--wine);
  font:italic 1.22rem/1.45 var(--serif)}
.bio {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:6rem;
  align-items:center;
  max-width:1180px;
  margin:auto;
  padding:7rem 2.5rem}
.bio figure {
  height:580px;
  margin:0}
.bio figure img {
  width:100%;
  height:100%;
  object-fit:cover}
.bio-quote {
  margin-top:2rem!important;
  padding-left:1.5rem;
  border-left:2px solid var(--gold);
  font:italic 1.17rem/1.55 var(--serif)}
.fit {
  background:#f5e7e3;
  max-width:none;
  padding-left:max(2.5rem,calc((100% - 1180px)/2 + 2.5rem));
  padding-right:max(2.5rem,calc((100% - 1180px)/2 + 2.5rem))}
.fit-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  margin-top:3rem}
.fit-grid>div {
  padding:1.7rem;
  background:#fff6f3}
.fit-grid h3 {
  margin-bottom:1rem;
  color:var(--wine);
  font-family:var(--serif);
  font-size:1.45rem}
.fit ul {
  margin:0;
  padding-left:1.2rem}
.fit li {
  margin:.55rem 0;
  color:var(--muted)}
.fit-close {
  max-width:780px;
  margin:2.5rem 0 0;
  color:var(--wine);
  font:italic 1.16rem/1.5 var(--serif)}
.consultation {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7rem;
  max-width:1180px;
  margin:auto;
  padding:7rem 2.5rem}
.consultation>div:last-child {
  padding-left:2rem;
  border-left:1px solid var(--line)}
.consult-price {
  color:var(--wine)!important;
  font:600 1.15rem var(--serif)}
.prices {
  max-width:none;
  background:#fff;
  padding-left:max(2.5rem,calc((100% - 1180px)/2 + 2.5rem));
  padding-right:max(2.5rem,calc((100% - 1180px)/2 + 2.5rem))}
.price-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:3rem;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line)}
.price-grid article {
  padding:1.7rem;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line)}
.price {
  margin:.8rem 0 .1rem;
  font:600 1.7rem var(--serif);
  color:var(--wine)}
.price-grid p:last-child {
  margin:0;
  color:var(--muted)}
.price-note {
  max-width:660px;
  margin:1.5rem 0 0}
.faq {
  border-top:1px solid var(--line)}
.faq-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:0 4rem;
  margin-top:3rem}
details {
  padding:1rem 0;
  border-top:1px solid var(--line)}
details:last-child {
  border-bottom:1px solid var(--line)}
summary {
  cursor:pointer;
  font-weight:700}
.faq p {
  margin:1rem 0 .2rem}
.contact {
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:6rem;
  padding:6rem max(2.5rem,calc((100% - 1180px)/2 + 2.5rem));
  background:var(--wine);
  color:#fff}
.contact .eyebrow {
  color:#edbc83}
.contact p {
  max-width:640px;
  color:#f0dfe4}
.light {
  background:#fff3ed;
  color:var(--wine)}
address {
  display:flex;
  flex-direction:column;
  align-self:end;
  gap:.75rem;
  font-style:normal}
address a {
  font-size:1.08rem}
address span {
  margin-top:.8rem;
  color:#f1dce2}
footer {
  padding:1.8rem 2rem;
  background:var(--wine-deep);
  color:#f0dfe4;
  text-align:center;
  font-size:.78rem}
@media(max-width:760px) {
  .site-header {
  padding:1.15rem 1.25rem}
nav a:not(.nav-cta) {
  display:none}
.hero,.reframe,.bio,.consultation,.contact {
  grid-template-columns:1fr}
.hero-copy {
  padding:4.5rem 1.5rem}
.hero-visual {
  min-height:540px}
.career-miniatures img {
  width:58px;
  height:78px}
.section,.bio,.consultation {
  padding:4.5rem 1.5rem}
.problem-panel,.method-grid,.fit-grid,.price-grid,.faq-grid {
  grid-template-columns:1fr}
.reframe {
  gap:2rem;
  padding:4.5rem 1.5rem}
.method-grid {
  gap:1.4rem}
.outcomes {
  grid-template-columns:1fr;
  padding:4.5rem 1.5rem}
.outcomes ul {
  columns:1}
.outcomes>p {
  grid-column:auto}
.bio {
  gap:2.5rem}
.bio figure {
  height:450px}
.consultation {
  gap:2.5rem}
.consultation>div:last-child {
  padding:0;
  border:0}
.contact {
  gap:3rem;
  padding:4.5rem 1.5rem}
}

/* Standalone hosting contact form */
.contact-side {
  align-self: start;
}

.contact-form {
  display: grid;
  gap: .45rem;
}

.contact-form label {
  font-weight: 700;
  font-size: .9rem;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: .75rem;
  border: 1px solid #e5d3d0;
  background: #fff;
  color: #35232b;
  font: inherit;
}

.contact-form textarea {
  resize: vertical;
}

.contact-form .button {
  justify-self: start;
  border: 0;
  cursor: pointer;
}

.contact-alternative {
  margin: 1.6rem 0 .5rem;
  color: #f0dfe4 !important;
  font-size: .9rem;
}

.website-field {
  position: absolute !important;
  left: -10000px !important;
}
.hero-main {
  margin:0;
  min-height:660px;
  overflow:hidden}
.hero-main img {
  width:100%;
  height:100%;
  min-height:660px;
  display:block;
  object-fit:cover;
  object-position:center}
.bio-visual {
  position:relative;
  height:580px;
  overflow:hidden}
.bio-visual .basel-main {
  height:100%;
  margin:0}
.bio-visual .basel-main img {
  width:100%;
  height:100%;
  object-fit:cover}
.bio-visual .career-miniatures {
  position:absolute;
  right:1.5rem;
  bottom:3.2rem;
  display:flex;
  gap:.5rem}
.bio-visual .career-miniatures img {
  width:74px;
  height:98px;
  object-fit:cover;
  border:3px solid #fff;
  box-shadow:0 12px 26px rgba(54,20,31,.26)}
.bio-visual .basel-caption {
  position:absolute;
  left:1.5rem;
  bottom:1.25rem;
  margin:0;
  padding:.5rem .7rem;
  background:rgba(78,23,41,.88);
  color:#fff;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase}
@media(max-width:760px) {
  .hero-main,.hero-main img {
  min-height:540px}
.bio-visual {
  height:450px}
.bio-visual .career-miniatures img {
  width:58px;
  height:78px}
}
.hero-main {
  margin:0;
  min-height:660px;
  overflow:hidden}
.hero-main img {
  width:100%;
  height:100%;
  min-height:660px;
  display:block;
  object-fit:cover;
  object-position:center}
.bio-visual {
  position:relative;
  height:580px;
  overflow:visible}
.bio-visual .basel-main {
  height:100%;
  margin:0;
  overflow:hidden}
.bio-visual .basel-main img {
  width:100%;
  height:100%;
  object-fit:cover}
.bio-visual .career-miniatures {
  position:absolute;
  right:-2.5rem;
  bottom:3.2rem;
  display:flex;
  gap:.65rem;
  z-index:1}
.bio-visual .career-miniatures img {
  width:96px;
  height:128px;
  object-fit:cover;
  border:4px solid #fff;
  box-shadow:0 12px 26px rgba(54,20,31,.26)}
.bio-visual .basel-caption {
  position:absolute;
  left:1.5rem;
  bottom:1.25rem;
  margin:0;
  padding:.5rem .7rem;
  background:rgba(78,23,41,.88);
  color:#fff;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase}
.section-intro h2 u {
  text-decoration-color:var(--gold);
  text-decoration-thickness:.12em;
  text-underline-offset:.12em}
@media(max-width:760px) {
  .hero-main,.hero-main img {
  min-height:540px}
.bio-visual {
  height:450px;
  overflow:hidden}
.bio-visual .career-miniatures {
  right:1rem;
  bottom:3rem;
  gap:.45rem}
.bio-visual .career-miniatures img {
  width:66px;
  height:88px}
}