/* ============================================================
   Aleksandra Liashenko — aleksandraliashenko.com
   v3 · "Sisi" — pearl light, translucent veils, champagne gold
   ============================================================ */

:root{
  --pearl:#FAF8F4;
  --paper:#FFFFFF;
  --veil:rgba(252,250,246,.58);
  --veil-strong:rgba(252,250,246,.78);
  --ink:#3B3733;
  --ink-soft:#5C554D;
  --gold:#C0A47C;
  --gold-deep:#9A805A;
  --stone:#8E8578;
  --hairline:#E9E2D7;
  --max:1200px;
  --measure:66ch;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{
  margin:0;
  background:var(--pearl);
  color:var(--ink);
  font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--gold-deep);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

h1,h2,h3{font-family:"Cormorant Garamond",Garamond,"Times New Roman",serif;font-weight:500;line-height:1.15;text-wrap:balance;margin:0;color:var(--ink)}
h3{font-size:1.3rem;letter-spacing:.04em}

.label{
  font-family:"Jost",system-ui,sans-serif;
  font-size:.7rem;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;
  color:var(--gold-deep);
}
.meta{font-family:"Jost",system-ui,sans-serif;font-size:.78rem;letter-spacing:.08em;color:var(--stone)}

/* ---------- masthead (Zakharova-style: centered name + centered nav) ---------- */
.masthead{
  text-align:center;
  padding:2.8rem 1rem 1.2rem;
  background:var(--pearl);
}
.masthead.on-photo{background:transparent;position:relative;z-index:3}
.mast-name{
  font-family:"Cormorant Garamond",serif;font-weight:500;
  font-size:clamp(1.5rem,3.6vw,2.4rem);
  letter-spacing:.42em;text-indent:.42em;
  text-transform:uppercase;color:var(--ink);
  text-decoration:none;display:inline-block;
}
.masthead.on-photo .mast-name{color:#4A443C}
nav.primary{
  display:flex;justify-content:center;gap:2.2rem;flex-wrap:wrap;
  margin-top:1.6rem;padding:0 1rem;
}
nav.primary a{
  font-family:"Cormorant Garamond",serif;font-weight:500;
  font-size:1.12rem;letter-spacing:.1em;
  color:var(--ink-soft);text-decoration:none;
  padding:.25rem .1rem;border:1px solid transparent;
}
nav.primary a:hover{color:var(--gold-deep)}
nav.primary a[aria-current="page"]{border:1px solid var(--gold);padding:.25rem .8rem}
.lang-corner{
  position:absolute;top:1.4rem;right:1.6rem;z-index:5;
  font-family:"Jost",sans-serif;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;
}
.lang-corner a{color:var(--stone);text-decoration:none;border:1px solid var(--hairline);padding:.3rem .65rem;background:var(--veil-strong)}
.lang-corner a:hover{color:var(--ink);border-color:var(--gold)}
.page-wrap{position:relative}

/* ---------- hero (home) ---------- */
.hero{
  position:relative;
  min-height:92vh;
  display:flex;flex-direction:column;
  overflow:hidden;
}
.hero-photo{
  position:absolute;inset:0;
  background-size:cover;background-position:center 72%;
}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(252,250,246,.82) 0%,rgba(252,250,246,.55) 34%,rgba(252,250,246,.18) 75%,rgba(252,250,246,.42) 100%)}
.hero-center{
  position:relative;z-index:2;
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:3rem 1.2rem 4rem;
  animation:rise 1.1s ease-out both;
}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.hero-name{
  font-family:"Cormorant Garamond",serif;font-weight:500;
  font-size:clamp(1.8rem,4.4vw,3.3rem);
  letter-spacing:.3em;text-indent:.3em;
  text-transform:uppercase;color:#453F37;
}
.hero-sub{
  margin-top:1.6rem;
  font-family:"Cormorant Garamond",serif;font-weight:500;font-style:italic;
  font-size:clamp(1.25rem,2.4vw,1.7rem);color:#5C544A;
}
.hero-sub2{
  margin-top:.7rem;
  font-family:"Jost",sans-serif;font-size:.8rem;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold-deep);
}
.hero-credit{position:absolute;right:1rem;bottom:.7rem;z-index:3;font-family:"Jost",sans-serif;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(90,82,70,.55)}

/* ---------- section shells ---------- */
.section{max-width:var(--max);margin:0 auto;padding:4.4rem 1.4rem}
.section-title{
  text-align:center;
  font-family:"Cormorant Garamond",serif;font-weight:500;
  font-size:clamp(1.9rem,4.4vw,3.1rem);
  letter-spacing:.28em;text-indent:.28em;text-transform:uppercase;
  color:rgba(154,128,90,.55);
  margin-bottom:2.6rem;
}
.prose{max-width:var(--measure);margin:0 auto}
.prose p{margin:0 0 1.1em}
.prose h3{margin:2.2rem 0 .9rem;letter-spacing:.14em;text-transform:uppercase;font-size:1.05rem;color:var(--gold-deep)}
.lead{font-size:1.2rem;line-height:1.6;color:var(--ink-soft)}
.center{text-align:center}

/* pull quote */
.pull{max-width:940px;margin:0 auto;text-align:center;padding:4.2rem 1.4rem}
.pull blockquote{
  margin:0;
  font-family:"Cormorant Garamond",serif;font-weight:500;font-style:italic;
  font-size:clamp(1.55rem,3.3vw,2.5rem);line-height:1.35;color:var(--ink);
  text-wrap:balance;
}
.pull blockquote::before{content:"“";color:var(--gold)}
.pull blockquote::after{content:"”";color:var(--gold)}
.pull figcaption{margin-top:1.3rem}

/* photo + quote duo (home) */
.duo{
  max-width:var(--max);margin:0 auto;padding:2rem 1.4rem 4.6rem;
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:3rem;align-items:center;
}
@media (max-width:820px){.duo{grid-template-columns:1fr;gap:1.8rem}}
.duo figure{margin:0}
.duo img{width:100%;height:auto}
.duo .q blockquote{
  margin:0;font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;
  font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.4;color:var(--ink);
}
.duo .q blockquote::before{content:"“";color:var(--gold)}
.duo .q blockquote::after{content:"”";color:var(--gold)}
.duo .q figcaption{margin-top:1rem}

/* home quick nav band */
.discover{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);background:var(--paper)}
.discover .inner{max-width:var(--max);margin:0 auto;padding:2rem 1.4rem;display:flex;justify-content:center;gap:2.6rem;flex-wrap:wrap}
.discover a{font-family:"Cormorant Garamond",serif;font-size:1.15rem;letter-spacing:.12em;text-decoration:none;color:var(--ink-soft)}
.discover a:hover{color:var(--gold-deep)}

/* rows (awards) */
.rows{margin:0;padding:0;list-style:none;max-width:var(--measure);margin-inline:auto}
.rows li{display:grid;grid-template-columns:86px 1fr;gap:1.3rem;padding:.8rem 0;border-bottom:1px dotted var(--hairline)}
.rows .yr{font-family:"Jost",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:.1em;font-size:.84rem;color:var(--gold-deep);padding-top:.15rem}
.rows li.plain{display:block}

/* repertoire list — strict source order, single column */
ol.rep,ul.rep{list-style:none;margin:0 auto;padding:0;max-width:760px}
.rep li{padding:.5rem 0;border-bottom:1px dotted var(--hairline)}
.rep .role{font-weight:600}
.rep .work{font-style:italic}
.rep .chor{color:var(--stone)}

/* press quotes */
.press-quote{border-top:1px solid var(--hairline);padding:2.4rem 0;max-width:820px;margin:0 auto}
.press-quote:first-of-type{border-top:0}
.press-quote blockquote{
  margin:0;font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;
  font-size:clamp(1.35rem,2.4vw,1.8rem);line-height:1.4;color:var(--ink);
}
.press-quote blockquote::before{content:"“";color:var(--gold)}
.press-quote blockquote::after{content:"”";color:var(--gold)}
.press-quote figcaption{margin-top:.9rem}
.linklist{list-style:none;margin:0 auto;padding:0;max-width:760px}
.linklist li{padding:.42rem 0;border-bottom:1px dotted var(--hairline);overflow-wrap:anywhere}

/* gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.8rem 1.4rem;align-items:start;max-width:var(--max);margin:0 auto}
.gallery-grid figure{margin:0}
.gallery-grid figure.wide{grid-column:1/-1}
.gallery-grid img{width:100%;height:auto}
.credit{font-size:.78rem;color:var(--stone);margin-top:.5rem;font-family:"Jost",sans-serif;letter-spacing:.06em;text-align:center}

/* about portrait */
.about-portrait{float:right;width:min(300px,38%);margin:0 0 1.2rem 2rem}
.about-portrait img{width:100%;height:auto}
@media (max-width:640px){.about-portrait{float:none;width:100%;margin:0 0 1.4rem}}

/* contact — translucent form over photo (Zakharova style) */
.contact-stage{position:relative;overflow:hidden;padding:5rem 1.2rem;background:var(--pearl)}
.contact-photo{position:absolute;inset:0;background-size:cover;background-position:center 30%;opacity:.55}
.contact-stage .veil{position:absolute;inset:0;background:rgba(252,250,246,.35)}
.contact-inner{position:relative;z-index:2;max-width:900px;margin:0 auto}
form.contact{display:grid;gap:2px;margin-top:2.2rem}
form.contact .row2{display:grid;grid-template-columns:1fr 1fr;gap:2px}
@media (max-width:640px){form.contact .row2{grid-template-columns:1fr}}
form.contact input,form.contact textarea{
  font-family:"Jost",sans-serif;font-size:.9rem;letter-spacing:.1em;color:var(--ink);
  background:rgba(214,199,178,.55);border:0;padding:1.15rem 1.2rem;width:100%;
}
form.contact textarea{background:rgba(255,255,255,.62);min-height:180px;resize:vertical}
form.contact input::placeholder,form.contact textarea::placeholder{color:#7d746a;text-transform:uppercase;letter-spacing:.18em;font-size:.74rem}
form.contact button{
  font-family:"Jost",sans-serif;font-size:.8rem;letter-spacing:.32em;text-transform:uppercase;
  border:0;background:rgba(192,164,124,.75);color:#fff;padding:1.1rem;cursor:pointer;transition:background .2s;
}
form.contact button:hover{background:var(--gold-deep)}
.hp{position:absolute;left:-9999px;opacity:0}
.contact-mail{text-align:center;margin-top:2rem}
.contact-mail a{font-family:"Cormorant Garamond",serif;font-size:1.4rem;color:var(--ink)}

/* footer — light */
footer.site{border-top:1px solid var(--hairline);background:var(--paper);color:var(--stone)}
footer.site .inner{
  max-width:var(--max);margin:0 auto;padding:2.4rem 1.4rem;
  display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center;
  font-family:"Jost",sans-serif;font-size:.76rem;letter-spacing:.12em;
}
footer.site .foot-name{font-family:"Cormorant Garamond",serif;font-size:1rem;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;color:var(--ink)}
footer.site nav{display:flex;gap:1.6rem;flex-wrap:wrap;justify-content:center}
footer.site a{color:var(--gold-deep);text-decoration:none;text-transform:uppercase;letter-spacing:.14em}
footer.site a:hover{color:var(--ink);text-decoration:underline}

hr.thin{border:0;height:1px;background:var(--hairline);margin:3rem auto;max-width:var(--measure)}
.note{font-size:.88rem;color:var(--stone)}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--pearl);padding:.6rem 1rem;z-index:100}
.skip:focus{left:0}
::selection{background:rgba(192,164,124,.3)}
