:root {
  --ink:#1b1715;
  --muted:#6d655f;
  --cream:#f4efe7;
  --paper:#fbf8f2;
  --wine:#4a111f;
  --wine2:#22070d;
  --gold:#c59a52;
  --line:rgba(27,23,21,.14);
  --max:1240px
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.65 "DM Sans",sans-serif;
  overflow-x:hidden
}
a {
  color:inherit
}
button {
  font:inherit
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2,h3,.serif {
  font-family:"Italiana",Georgia,serif;
  font-weight:400
}
.wrap {
  width:min(var(--max),calc(100% - 48px));
  margin:auto
}
.kicker {
  text-transform:uppercase;
  letter-spacing:.2em;
  font-size:.72rem;
  font-weight:600;
  color:var(--gold)
}
nav {
  position:fixed;
  z-index:50;
  top:0;
  left:0;
  right:0;
  height:100px;
  display:flex;
  align-items:center;
  transition:.35s;
  color:#fff
}
nav.scrolled {
  height:84px;
  background:rgba(34,7,13,.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.1)
}
.navin {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
/* The approved logo is shown in full in the profile section.
   The navigation crops only its SZ emblem at display time; the PNG is unchanged. */
.logo {
  display:flex;
  align-items:center;
  gap:14px;
  flex-shrink:0;
  min-width:0;
  text-decoration:none
}
.brand-symbol {
  position:relative;
  display:block;
  flex:0 0 56px;
  width:56px;
  height:56px;
  overflow:hidden;
  background:#fff;
  border-radius:3px
}
.brand-symbol img {
  position:absolute;
  width:280%;
  max-width:none;
  height:auto;
  left:50%;
  top:-20%;
  transform:translateX(-50%)
}
.brand-copy {
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0
}
.brand-name {
  color:#fff;
  font:1.4rem/1.15 "Italiana",Georgia,serif;
  letter-spacing:.025em
}
.brand-title {
  color:var(--gold);
  font-size:.875rem;
  font-weight:600;
  line-height:1.3;
  letter-spacing:.06em;
  text-transform:uppercase
}
.links {
  display:flex;
  align-items:center;
  gap:30px
}
.links a {
  text-decoration:none;
  font-size:.875rem;
  opacity:.8
}
.links a:hover {
  opacity:1
}
.lang {
  border:1px solid rgba(255,255,255,.25);
  background:transparent;
  color:#fff;
  border-radius:999px;
  padding:7px 11px;
  cursor:pointer
}
.menu {
  display:none;
  background:none;
  border:0;
  color:#fff;
  font-size:1.4rem;
  flex:0 0 44px;
  width:44px;
  height:44px;
  cursor:pointer
}
.hero {
  min-height:clamp(760px,100svh,1040px);
  position:relative;
  display:flex;
  align-items:center;
  isolation:isolate;
  overflow:hidden;
  color:#fff;
  background:var(--wine2)
}
/* Preserve the original portrait; art-direct its framing in the layout. */
.hero-media {
  position:absolute;
  inset:0 0 0 auto;
  width:min(66%,1180px)
}
.hero-photo {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 90%
}
.hero:after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,#22070d 0%,rgba(34,7,13,.99) 27%,rgba(34,7,13,.88) 40%,rgba(34,7,13,.35) 54%,rgba(34,7,13,0) 73%),linear-gradient(180deg,rgba(12,5,8,.82),transparent 26%),linear-gradient(0deg,rgba(34,7,13,.85),transparent 25%)
}
.hero-content {
  position:relative;
  z-index:2;
  min-height:inherit;
  padding:172px 0 136px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start
}
.hero-copy {
  width:52%;
  max-width:650px
}
.hero h1 {
  font-size:clamp(3.8rem,6.7vw,7rem);
  line-height:1.03;
  letter-spacing:-.035em;
  margin:24px 0
}
.hero h1 em {
  display:block;
  color:var(--gold);
  font-style:normal
}
.hero .kicker {
  display:flex;
  align-items:center;
  gap:16px;
  font-size:.9375rem;
  line-height:1.6;
  letter-spacing:.17em;
  color:#ddbd85
}
.hero .kicker:before {
  content:"";
  width:34px;
  height:1px;
  flex:0 0 34px;
  background:currentColor
}
.hero-specialties {
  color:#eadfce;
  font-size:.9375rem;
  line-height:1.8;
  letter-spacing:.045em;
  max-width:480px;
  margin:0 0 28px
}
.hero .lead {
  font-family:"Italiana",serif;
  font-size:clamp(1.25rem,1.65vw,1.6rem);
  line-height:1.5;
  max-width:440px;
  color:#ded2c7
}
.hero .btn {
  border-radius:2px;
  min-height:54px;
  font-size:.875rem;
  letter-spacing:.055em
}
.actions {
  display:flex;
  gap:12px;
  margin-top:34px;
  flex-wrap:wrap
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:50px;
  padding:0 22px;
  border-radius:999px;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.72rem;
  font-weight:600;
  border:1px solid rgba(255,255,255,.3);
  transition:.25s
}
.btn.primary {
  background:var(--gold);
  border-color:var(--gold);
  color:var(--wine2)
}
.btn:hover {
  transform:translateY(-2px);
  filter:brightness(1.06)
}
.hero-side {
  position:absolute;
  bottom:34px;
  left:0;
  border-top:1px solid rgba(221,189,133,.3);
  padding-top:16px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.75rem;
  color:#cfbba8
}
section {
  padding:120px 0
}
.intro {
  background:var(--paper)
}
.intro-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:7vw;
  align-items:center
}
.brand-signature {
  margin:0;
  background:#fff;
  border:1px solid var(--line);
  padding:16px
}
.brand-signature img {
  display:block;
  width:100%;
  height:auto
}
.statement {
  font-size:clamp(2.3rem,4.3vw,4rem);
  line-height:1.08;
  letter-spacing:-.025em
}
.bodycopy {
  font-size:1.08rem;
  color:var(--muted);
  max-width:680px
}
.metrics {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  margin-top:74px
}
.metric {
  background:var(--paper);
  padding:34px
}
.metric strong {
  display:block;
  font:3rem "Italiana",serif;
  color:var(--wine)
}
.metric span {
  font-size:.875rem;
  color:var(--muted)
}
.expertise {
  background:var(--wine2);
  color:#fff
}
.sectionhead {
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:end;
  margin-bottom:58px
}
.sectionhead h2 {
  font-size:clamp(3rem,6vw,5.6rem);
  line-height:.95;
  margin:10px 0 0
}
.sectionhead p {
  max-width:420px;
  color:#bcaeaa;
  margin-bottom:5px
}
.services {
  border-top:1px solid rgba(255,255,255,.15)
}
.service {
  display:grid;
  grid-template-columns:80px 1fr 1fr;
  gap:32px;
  align-items:center;
  padding:28px 0;
  border-bottom:1px solid rgba(255,255,255,.15)
}
.service .num {
  color:var(--gold);
  font-size:.78rem
}
.service h3 {
  font-size:clamp(1.55rem,2.5vw,2.5rem);
  margin:0
}
.service p {
  color:#bcaeaa;
  margin:0;
  max-width:540px
}
.experience {
  background:var(--cream)
}
.experience .sectionhead p {
  color:var(--muted)
}
.timeline {
  position:relative
}
.role {
  display:grid;
  grid-template-columns:240px 1fr;
  gap:56px;
  padding:34px 0;
  border-top:1px solid var(--line)
}
.role:last-child {
  border-bottom:1px solid var(--line)
}
.place {
  font:2rem "Italiana",serif;
  color:var(--wine)
}
.place small {
  display:block;
  font:600 .68rem "DM Sans",sans-serif;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:var(--gold);
  margin-top:9px
}
.role p {
  max-width:760px;
  color:var(--muted);
  margin:0
}
.quote {
  background:var(--wine);
  color:#fff;
  padding:105px 0
}
.quote blockquote {
  font:clamp(2.1rem,4.3vw,4.4rem)/1.15 "Italiana",serif;
  max-width:1000px;
  margin:0
}
.quote blockquote:before {
  content:"“";
  display:block;
  color:var(--gold);
  font-size:7rem;
  line-height:.4;
  margin-bottom:30px
}
.training {
  background:var(--paper)
}
.training-grid {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:8vw
}
.sticky {
  position:sticky;
  top:110px;
  align-self:start
}
.sticky h2 {
  font-size:clamp(3rem,6vw,5.4rem);
  line-height:.95;
  margin:14px 0 24px
}
.topics {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}
.topic {
  padding:21px 18px;
  border:1px solid var(--line);
  display:flex;
  gap:13px;
  align-items:center;
  background:#fff;
  transition:.25s
}
.topic:hover {
  border-color:var(--gold);
  transform:translateY(-2px)
}
.topic:before {
  content:"✦";
  color:var(--gold)
}
/* A native scrolling gallery: touch, trackpad, keyboard and mouse controls. */
.gallery {
  --gallery-gutter:max(24px,calc((100vw - var(--max))/2));
  background:var(--wine2);
  color:#fff;
  scroll-margin-top:90px
}
.gallery-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:32px;
  margin-bottom:40px
}
.gallery .kicker {
  font-size:.875rem
}
.gallery-heading h2 {
  max-width:790px;
  margin:14px 0 20px;
  font-size:clamp(2.8rem,5.4vw,5rem);
  line-height:1.06;
  text-wrap:balance
}
.gallery-heading p {
  color:#d0c0b8;
  max-width:560px;
  margin:0;
  font-size:1rem
}
.gallery-controls {
  display:flex;
  flex:0 0 auto;
  gap:12px
}
.gallery-arrow {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 50px;
  width:50px;
  height:50px;
  padding:0;
  border:1px solid rgba(221,189,133,.5);
  border-radius:50%;
  background:transparent;
  color:#edd9b4;
  font:400 1.6rem/1 "DM Sans",sans-serif;
  cursor:pointer;
  transition:background .2s,color .2s,opacity .2s
}
.gallery-arrow:hover:not(:disabled) {
  background:var(--gold);
  color:var(--wine2)
}
.gallery-arrow:disabled {
  opacity:.3;
  cursor:default
}
.gallery-track {
  position:relative;
  display:flex;
  gap:24px;
  padding:6px var(--gallery-gutter) 22px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:var(--gallery-gutter);
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--gold) rgba(255,255,255,.08)
}
.gallery-track::-webkit-scrollbar {
  height:6px
}
.gallery-track::-webkit-scrollbar-track {
  background:rgba(255,255,255,.08)
}
.gallery-track::-webkit-scrollbar-thumb {
  background:var(--gold);
  border-radius:6px
}
.gallery-track.is-dragging {
  scroll-snap-type:none;
  user-select:none
}
.gallery-item {
  flex:0 0 clamp(250px,27vw,350px);
  min-width:0;
  margin:0;
  scroll-snap-align:start
}
.gallery-item--wide {
  flex-basis:clamp(340px,44vw,580px)
}
.gallery-open {
  display:block;
  height:clamp(350px,36vw,460px);
  position:relative;
  overflow:hidden;
  background:#140409;
  border-radius:2px;
  cursor:zoom-in
}
.gallery-open img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 50%;
  transition:transform .6s cubic-bezier(.2,.7,.2,1)
}
.gallery-item--wide img {
  object-position:38% 50%
}
.gallery-open--framed img {
  transform:scale(1.05)
}
.gallery-expand {
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  right:16px;
  bottom:16px;
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.6);
  border-radius:50%;
  background:rgba(20,4,9,.7);
  color:#fff;
  font:400 1.6rem/1 "DM Sans",sans-serif;
  pointer-events:none
}
.gallery-item figcaption {
  display:flex;
  align-items:baseline;
  gap:14px;
  padding-top:18px;
  color:#eee1d2;
  font-size:1rem;
  line-height:1.5
}
.gallery-number {
  color:var(--gold);
  font-size:.75rem;
  flex:0 0 22px;
  font-variant-numeric:tabular-nums
}
.gallery-footer {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:20px;
  padding-top:20px;
  color:#cbb8ad;
  font-size:.875rem
}
.gallery-footer p {
  margin:0
}
.gallery-footer output {
  color:#e0c191;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
  letter-spacing:.08em
}
.gallery-dialog {
  width:min(1280px,calc(100% - 48px));
  height:min(92svh,1000px);
  max-width:none;
  max-height:calc(100svh - 24px);
  padding:20px 24px;
  margin:auto;
  border:1px solid rgba(197,154,82,.4);
  border-radius:6px;
  background:#18070c;
  color:#fff;
  overflow:auto
}
.gallery-dialog[open] {
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:12px;
  animation:gallery-dialog-in .18s ease-out
}
.gallery-dialog::backdrop {
  background:rgba(8,3,5,.92)
}
.gallery-dialog-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  color:#e0c191;
  font-size:.875rem;
  font-variant-numeric:tabular-nums
}
.gallery-close {
  font-size:2rem
}
.gallery-dialog-stage {
  position:relative;
  display:grid;
  grid-template-columns:50px minmax(0,1fr) 50px;
  align-items:center;
  gap:20px;
  min-height:0
}
.gallery-dialog-figure {
  margin:0;
  height:100%;
  min-height:0;
  display:grid;
  place-items:center;
  touch-action:pan-y pinch-zoom
}
.gallery-dialog-figure img {
  width:100%;
  height:100%;
  min-height:0;
  object-fit:contain
}
.gallery-dialog-figure [hidden] {
  display:none
}
#gallery-image-error {
  padding:24px;
  text-align:center;
  color:#e2cdbc
}
#gallery-dialog-caption {
  margin:0;
  text-align:center;
  font:400 1.5rem/1.35 "Italiana",Georgia,serif;
  color:#efe1ce
}
@keyframes gallery-dialog-in {
  from { opacity:0; transform:translateY(8px) }
  to { opacity:1; transform:none }
}
@media(hover:hover) and (pointer:fine) {
  .gallery-open:hover img {
    transform:scale(1.035)
  }
  .gallery-open--framed:hover img {
    transform:scale(1.08)
  }
  .gallery-track.is-dragging,.gallery-track.is-dragging .gallery-open {
    cursor:grabbing
  }
}
@media(max-width:760px) {
  .gallery {
    --gallery-gutter:24px
  }
  .gallery-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:24px;
    margin-bottom:28px
  }
  .gallery-track {
    gap:16px
  }
  .gallery-item {
    flex-basis:76vw
  }
  .gallery-item--wide {
    flex-basis:88vw
  }
  .gallery-open {
    height:clamp(320px,90vw,500px)
  }
  .gallery-dialog {
    width:calc(100% - 20px);
    height:calc(100svh - 20px);
    padding:12px
  }
  .gallery-dialog-stage {
    display:block
  }
  .gallery-dialog-figure {
    padding-bottom:62px
  }
  .gallery-dialog-prev,.gallery-dialog-next {
    position:absolute;
    bottom:0;
    background:#22070d;
    z-index:1
  }
  .gallery-dialog-prev {
    left:0
  }
  .gallery-dialog-next {
    right:0
  }
}
@media(max-width:520px) {
  .gallery {
    --gallery-gutter:15px
  }
  .gallery-footer {
    align-items:flex-start
  }
  .gallery-footer p {
    max-width:240px
  }
}
@media(prefers-reduced-motion:reduce) {
  .gallery-open img,.gallery-arrow {
    transition:none
  }
  .gallery-dialog[open] {
    animation:none
  }
}
.heritage {
  padding:100px 0;
  background:#17120f;
  color:#fff
}
.heritage-grid {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:60px;
  align-items:center
}
.roman {
  font:clamp(6rem,14vw,12rem)/.8 "Italiana",serif;
  color:var(--gold)
}
.heritage h2 {
  font-size:clamp(2.2rem,4vw,4rem);
  margin-bottom:14px
}
.heritage p {
  color:#bdb3ae;
  max-width:620px
}
.contact {
  background:var(--wine2);
  color:#fff
}
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9vw
}
.contact h2 {
  font-size:clamp(3.2rem,7vw,6.3rem);
  line-height:.95;
  margin:14px 0 28px
}
.contact p {
  color:#c8bbba
}
.contact-list {
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:34px
}
.contact-list a {
  text-decoration:none;
  color:var(--gold);
  overflow-wrap:anywhere
}
form {
  display:grid;
  gap:18px
}
label {
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:var(--gold)
}
input,textarea {
  width:100%;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.25);
  background:transparent;
  color:#fff;
  padding:11px 0;
  font:inherit;
  border-radius:0
}
input:focus,textarea:focus {
  outline:0;
  border-color:var(--gold)
}
form .btn {
  width:max-content;
  cursor:pointer;
  background:var(--gold);
  color:var(--wine2);
  border-color:var(--gold)
}
.status {
  min-height:24px;
  color:#dcc28f;
  font-size:.85rem
}
footer {
  background:var(--wine2);
  color:#9f9390;
  border-top:1px solid rgba(255,255,255,.1);
  padding:28px 0
}
.footerin {
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  font-size:.875rem
}
.reveal {
  opacity:0;
  transform:translateY(25px);
  transition:.8s cubic-bezier(.2,.8,.2,1)
}
.reveal.show {
  opacity:1;
  transform:none
}
:focus-visible {
  outline:2px solid var(--gold);
  outline-offset:4px
}
@media(max-width:980px) {
  .links {
    position:absolute;
    top:100%;
    left:0;
    right:0;
    display:none;
    flex-direction:column;
    align-items:flex-start;
    padding:22px 24px;
    background:var(--wine2)
  }
  .links.open {
    display:flex
  }
  .menu {
    display:block
  }
  .hero-side {
    display:none
  }
  .hero-copy {
    width:50%
  }
  .hero .kicker {
    font-size:.875rem;
    letter-spacing:.1em;
    gap:10px
  }
  .hero .kicker:before {
    width:24px;
    flex-basis:24px
  }
  .intro-grid,.training-grid,.contact-grid {
    grid-template-columns:1fr
  }
  .sectionhead {
    display:block
  }
  .metrics {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .service {
    grid-template-columns:50px 1fr
  }
  .service p {
    grid-column:2
  }
  .role {
    grid-template-columns:1fr;
    gap:12px
  }
  .sticky {
    position:static
  }
  .heritage-grid {
    grid-template-columns:1fr;
    gap:30px
  }
  .topics {
    grid-template-columns:1fr
  }
  section {
    padding:84px 0
  }
}
@media(max-width:760px) {
  .hero {
    --portrait-height:clamp(440px,70svh,640px);
    min-height:100svh;
    display:block
  }
  .hero-media {
    width:100%;
    height:var(--portrait-height);
    inset:0 0 auto
  }
  .hero-photo {
    object-position:50% 100%
  }
  .hero:after {
    height:var(--portrait-height);
    background:linear-gradient(180deg,rgba(12,5,8,.86),rgba(12,5,8,.08) 25%,transparent 55%,rgba(34,7,13,.18) 68%,#22070d 100%)
  }
  .hero-content {
    display:block;
    padding:calc(var(--portrait-height) - 56px) 0 58px
  }
  .hero-copy {
    width:100%;
    max-width:560px
  }
  .hero h1 {
    font-size:clamp(3.35rem,11vw,5.6rem);
    margin:20px 0;
    line-height:1.03
  }
  .hero .kicker {
    font-size:.875rem;
    letter-spacing:.12em
  }
  .hero-specialties {
    max-width:100%;
    margin-bottom:22px
  }
  .hero .lead {
    font-size:1.375rem;
    max-width:480px
  }
  .hero .actions {
    margin-top:28px
  }
}
@media(max-width:520px) {
  .metrics {
    grid-template-columns:1fr
  }
  nav {
    height:92px
  }
  nav.scrolled {
    height:80px
  }
  .navin {
    gap:12px
  }
  .logo {
    gap:9px;
    flex-shrink:1
  }
  .brand-symbol {
    flex-basis:44px;
    width:44px;
    height:44px
  }
  .brand-name {
    font-size:1.08rem
  }
  .brand-title {
    letter-spacing:.025em
  }
  .brand-signature {
    padding:10px
  }
  .wrap {
    width:min(var(--max),calc(100% - 30px))
  }
  .actions {
    flex-direction:column;
    align-items:stretch
  }
  .btn {
    width:100%
  }
  .footerin {
    flex-direction:column
  }
  .service {
    grid-template-columns:36px 1fr
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .reveal {
    opacity:1;
    transform:none;
    transition:none
  }
}