@font-face { font-family: "Onest"; src: url("assets/fonts/onest-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Onest"; src: url("assets/fonts/onest-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
:root { --cream:#fff6ec; --rust:#6c151e; --lime:#f5dabf; --lavender:#d9b9a4; --peach:#e9c9ae; --ink:#4b0e15; --white:#fffaf4; --testimonial-brown:#dfb991; --forest:#0f3d3a; --lime-hover:#edc9a6; --lime-pressed:#e4ba91; --rust-hover:#7c1b26; --rust-pressed:#520f17; --ease-out:cubic-bezier(.22,1,.36,1); --ease-in-out:cubic-bezier(.76,0,.24,1); --t-press:140ms; --t-hover:190ms; --t-ui:340ms; --gutter:clamp(1.25rem,4vw,4rem); }
* { box-sizing:border-box; }
html { background:var(--cream); }
body { margin:0; color:var(--ink); background:var(--cream); font-family:"Onest",Arial,sans-serif; font-size:clamp(1rem,.95rem + .2vw,1.125rem); }
a { color:inherit; text-decoration:none; }
.doctor-header { position:absolute; z-index:3; top:0; left:0; width:100%; display:grid; grid-template-columns:1fr 1fr; align-items:start; padding:1.8rem var(--gutter); border:0; color:var(--white); text-shadow:0 1px 14px rgba(39,5,11,.35); }
.doctor-header::before,.doctor-header::after,.doctor-logo::before,.doctor-logo::after { content:none; display:none; }
.doctor-logo { font-size:2rem; font-weight:500; letter-spacing:-.08em; }
.doctor-nav { justify-self:end; display:flex; flex-direction:column; align-items:flex-end; gap:.25rem; font-size:.8125rem; line-height:1.35; text-transform:uppercase; }
.doctor-nav a { display:inline-flex; min-width:6.5rem; min-height:2.75rem; align-items:center; justify-content:flex-end; margin-right:-.85rem; padding:.65rem .85rem; transition:color 180ms ease,transform 180ms ease; }
.doctor-nav a:hover { color:var(--lime); transform:translateX(-.3rem); }
.menu-toggle,.mobile-menu { display:none; }

@media (pointer:coarse) { .doctor-nav { gap:.4rem; } .doctor-nav a { min-width:7.5rem; min-height:3.25rem; padding:.85rem 1rem; } }
.doctor-header-book { display:none; }
.doctor-hero { position:relative; min-height:48rem; height:100svh; overflow:hidden; background:var(--cream); }
.doctor-hero::after { display:none; }
.doctor-portrait { position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:0; background-image:var(--doctor-image),url("assets/images/clinic-interior.webp"); background-repeat:no-repeat,no-repeat; background-size:auto 100%,cover; background-position:center bottom,center; filter:brightness(.76) saturate(.94); }
.doctor-intro { position:absolute; z-index:2; inset:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(18rem,24vw); grid-template-rows:auto auto; column-gap:clamp(3rem,8vw,9rem); align-content:end; width:auto; padding:0 var(--gutter) 7.5%; color:var(--white); text-shadow:0 2px 24px rgba(39,5,11,.55); }
.doctor-intro > p:first-child { grid-column:1; grid-row:1; margin-bottom:1rem; }
.doctor-intro h1 { grid-column:1; grid-row:2; align-self:end; margin:0; font-size:clamp(4rem,8.3vw,9.5rem); letter-spacing:-.075em; }
.doctor-intro > p:not(:first-child) { grid-column:2; grid-row:2; align-self:end; max-width:24rem; margin:0; font-size:1.125rem; line-height:1.3; }
.doctor-intro .doctor-button { display:none; }
h1,h2 { margin-top:0; font-weight:400; letter-spacing:-.06em; line-height:.95; }
h1 { max-width:8ch; margin-bottom:2rem; font-size:clamp(4rem,8vw,9rem); }
.doctor-button { display:inline-flex; min-height:3.2rem; align-items:center; padding:.8rem 1.3rem; border-radius:999px; background:var(--lime); color:var(--ink); transition:transform var(--t-press) var(--ease-out),background-color var(--t-hover) ease,color var(--t-hover) ease; }
@media (hover:hover) and (pointer:fine) { .doctor-button:hover { transform:translateY(-2px); background:var(--lime-hover); } }
.doctor-button:active { transform:scale(.97); background:var(--lime-pressed); }
.doctor-details { display:grid; grid-template-columns:.8fr 1.2fr; gap:4rem; padding:clamp(6rem,10vw,11rem) var(--gutter); }
.doctor-details h2,.doctor-contact h2 { font-size:clamp(3.5rem,7vw,7.5rem); }
.doctor-details > p { max-width:45rem; font-size:clamp(1.4rem,2.3vw,2.3rem); line-height:1.25; }
.doctor-focus { grid-column:2; display:flex; flex-wrap:wrap; gap:.7rem; }
.doctor-focus span { padding:.7rem 1rem; border:1.5px solid currentColor; border-radius:999px; }
.doctor-background { display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(3rem,8vw,9rem); padding:clamp(6rem,10vw,11rem) var(--gutter); background:var(--rust); color:var(--white); }
.doctor-background-heading > p,.doctor-testimonials-heading > div > p { margin:0 0 1rem; font-size:.8rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; }
.doctor-background h2,.doctor-testimonials h2 { max-width:9ch; margin:0; font-size:clamp(3.5rem,7vw,7.5rem); }
.doctor-background-copy > p:first-child { max-width:45rem; margin-bottom:2rem; font-size:clamp(1.35rem,2vw,2rem); line-height:1.3; }
.credential-list { border-bottom:1.5px solid currentColor; }
.credential-item { display:grid; grid-template-columns:2.5rem 1fr; gap:1rem; padding:1.35rem 0; border-top:1.5px solid currentColor; }
.credential-item span { font-size:.78rem; letter-spacing:.1em; }
.credential-item p { margin:0; }
.doctor-testimonials { padding:clamp(6rem,9vw,9rem) var(--gutter); background:var(--cream); }
.doctor-testimonials-heading { display:grid; grid-template-columns:1fr minmax(18rem,30rem); gap:3rem; align-items:end; margin-bottom:4rem; }
.doctor-testimonials-heading > p { margin:0; }
.doctor-review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.doctor-review-card { min-height:24rem; display:flex; flex-direction:column; justify-content:space-between; padding:2rem; border-radius:1.4rem; background:var(--testimonial-brown); }
.doctor-review-card:nth-child(2),.doctor-review-card:nth-child(3) { background:var(--testimonial-brown); }
.doctor-review-card blockquote { margin:0; font-size:clamp(1.45rem,2vw,1.9rem); line-height:1.2; letter-spacing:-.035em; }
.doctor-review-card footer { display:flex; justify-content:space-between; gap:1rem; align-items:end; margin-top:3rem; font-size:.82rem; }
.doctor-review-card cite { font-style:normal; }
.doctor-review-card b { font-weight:400; letter-spacing:.08em; }
.doctor-contact { display:flex; justify-content:space-between; align-items:end; gap:3rem; padding:7rem var(--gutter); background:var(--rust); color:var(--white); }
.doctor-contact h2 { max-width:10ch; margin:0; }
.doctor-button.dark { background:var(--lime); color:var(--ink); }
@media (hover:hover) and (pointer:fine) { .doctor-button.dark:hover { background:var(--lime-hover); } }
.doctor-button.dark:active { background:var(--lime-pressed); }
.doctor-legal { display:flex; flex-wrap:wrap; gap:1rem 2rem; padding:2rem var(--gutter); background:var(--rust); color:var(--white); font-size:.82rem; }
.doctor-legal a { text-decoration:underline; text-underline-offset:.2rem; }
@media (max-width:900px) {
  body.nav-open { overflow:hidden; }
  .doctor-header { grid-template-columns:1fr auto; align-items:center; background:transparent; }
  .doctor-header::before { display:none; }
  .doctor-nav { display:none; }
  .doctor-header.nav-active { position:fixed; z-index:1000; color:var(--ink); text-shadow:none; }
  .doctor-header.nav-active .doctor-logo { position:relative; z-index:102; }
  .menu-toggle { position:relative; z-index:102; display:block; justify-self:end; width:3.25rem; height:3.25rem; padding:0; border:0; border-radius:50%; background:var(--lime); color:var(--ink); cursor:pointer; transition:transform var(--t-press) var(--ease-out),background-color var(--t-hover) ease,color var(--t-hover) ease; }
  .menu-toggle::before,.menu-toggle::after { content:""; position:absolute; left:50%; width:1.35rem; height:2px; background:currentColor; transform:translate(-50%,-4px); transition:transform var(--t-ui) var(--ease-in-out); }
  .menu-toggle::after { transform:translate(-50%,4px); }
  .menu-toggle[aria-expanded="true"] { background:var(--rust); color:var(--white); }
  .menu-toggle[aria-expanded="true"]::before { transform:translate(-50%,0) rotate(45deg); }
  .menu-toggle[aria-expanded="true"]::after { transform:translate(-50%,0) rotate(-45deg); }
  .menu-toggle:active { transform:scale(.94); background:var(--lime-pressed); }
  .menu-toggle[aria-expanded="true"]:active { background:var(--rust-pressed); }
  @media (hover:hover) and (pointer:fine) { .menu-toggle:hover { background:var(--lime-hover); } .menu-toggle[aria-expanded="true"]:hover { background:var(--rust-hover); } }
  .mobile-menu { position:fixed; z-index:100; inset:0; width:100%; min-height:100svh; height:100dvh; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:.2rem; padding:7rem var(--gutter) 3rem; background:var(--cream); color:var(--ink); opacity:0; transform:translateY(-1rem); pointer-events:none; text-shadow:none; transition:opacity 260ms ease,transform var(--t-ui) var(--ease-out); }
  .mobile-menu[hidden] { display:none; }
  .mobile-menu.is-open { opacity:1; transform:none; pointer-events:auto; }
  .mobile-menu a { display:flex; width:100%; min-height:4rem; align-items:center; padding:.55rem 0; font-size:clamp(2.9rem,9vw,5.5rem); font-weight:500; line-height:1.02; letter-spacing:-.055em; transition:color var(--t-hover) ease,transform var(--t-ui) var(--ease-out); }
  .mobile-menu a:active { color:var(--rust-hover); transform:translateX(.35rem); }
  .mobile-menu .mobile-menu-book { margin-top:1.6rem; font-size:clamp(1.2rem,3.5vw,1.7rem); letter-spacing:-.02em; text-decoration:underline; text-underline-offset:.3em; }
  .doctor-background { grid-template-columns:1fr; }
  .doctor-testimonials-heading { grid-template-columns:1fr; }
  .doctor-review-grid { grid-template-columns:1fr 1fr; }
  .doctor-review-card:last-child { grid-column:1/-1; }
}
@media (max-width:700px) { .doctor-header { padding-top:1.2rem; } .doctor-logo { font-size:1.8rem; } .doctor-hero { min-height:44rem; } .doctor-intro { display:flex; flex-direction:column; justify-content:flex-end; padding:8rem var(--gutter) 3rem; } .doctor-intro > p:first-child { margin-bottom:.8rem; } .doctor-intro h1 { max-width:11ch; margin-bottom:1.25rem; font-size:clamp(3.7rem,15vw,5.5rem); } .doctor-intro > p:not(:first-child) { max-width:28rem; margin:0; font-size:1rem; } .doctor-details { grid-template-columns:1fr; gap:2rem; } .doctor-focus { grid-column:1; } .doctor-background h2,.doctor-testimonials h2 { font-size:14vw; } .doctor-review-grid { grid-template-columns:1fr; } .doctor-review-card:last-child { grid-column:auto; } .doctor-contact { align-items:flex-start; flex-direction:column; } }

.doctor-header { position:fixed; z-index:1000; top:1rem; left:50%; width:min(calc(100% - 2rem),62rem); min-height:4rem; grid-template-columns:auto 1fr; align-items:center; gap:2rem; padding:.4rem .55rem .4rem 1.2rem; border-radius:999px; background:rgba(255,246,236,.82); color:var(--ink); box-shadow:0 .75rem 2rem rgba(75,14,21,.12); text-shadow:none; transform:translateX(-50%); -webkit-backdrop-filter:blur(18px) saturate(135%); backdrop-filter:blur(18px) saturate(135%); transition:background-color var(--t-ui) ease,box-shadow var(--t-ui) ease; }
.doctor-header.is-past-hero { background:#fff; box-shadow:0 .8rem 2.4rem rgba(75,14,21,.2); }
.doctor-nav { justify-self:end; flex-direction:row; align-items:center; gap:.15rem; font-size:.84rem; text-transform:none; }
.doctor-nav a { min-width:0; min-height:3.2rem; justify-content:center; margin:0; padding:.75rem 1.05rem; border-radius:999px; transition:background-color var(--t-hover) ease,color var(--t-hover) ease,transform var(--t-press) var(--ease-out); }
.doctor-nav a:hover { background:var(--lime); color:var(--ink); transform:none; }
.doctor-nav a:active { background:var(--lime-pressed); transform:scale(.97); }
.doctor-nav .nav-book { padding-inline:1.35rem; background:var(--rust); color:var(--white); }
.doctor-nav .nav-book:hover { background:var(--rust-hover); color:var(--white); }
.doctor-nav .nav-book:active { background:var(--rust-pressed); }
.doctor-header:not(.is-past-hero) { background:rgba(255,250,244,.66); }
.doctor-header.nav-active { background:transparent; }
@media (max-width:900px) { .doctor-header,.doctor-header.nav-active { top:.5rem; left:.5rem; width:calc(100% - 1rem); min-height:4rem; padding:.4rem .4rem .4rem 1rem; transform:none; } .doctor-header.nav-active { position:fixed; background:transparent; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; } .doctor-nav { display:none; } }
