/* ==========================================================================
   MARINA CHKHEIDZE — Album & Memorial
   Aesthetic: French Renaissance. Fontainebleau strapwork, engraver's plates,
   Garamond letterforms, parchment and gold leaf, strict symmetry.
   ========================================================================== */

:root{
  /* pigments */
  --vellum:      #efe4cd;   /* page */
  --vellum-deep: #e5d7ba;   /* panels */
  --vellum-lit:  #f7f0e0;   /* plate mounts */
  --ink:         #221a12;   /* iron-gall ink */
  --ink-soft:    #4d3f2f;
  --ink-faint:   #6b5d45;
  --gold:        #a4802c;   /* gold leaf — rules, ornament, gilding on dark */
  --gold-ink:    #7a5c1d;   /* the same leaf, darkened for small text on vellum */
  --gold-lit:    #c8a04a;
  --oxblood:     #6d1f22;   /* sanguine */
  --lapis:       #24406b;   /* bleu de France */
  --verdigris:   #3f6f61;
  --rule:        rgba(34,26,18,.22);
  --rule-strong: rgba(34,26,18,.45);

  --display: "Cormorant Garamond", "EB Garamond", Garamond, serif;
  --text:    "EB Garamond", "Cormorant Garamond", Garamond, serif;
  --small:   "Cormorant Garamond", Garamond, serif;
  --georgian:"Noto Serif Georgian", serif;

  --max: 1180px;
  --plate-shadow: 0 1px 0 rgba(255,252,244,.7), 0 2px 3px rgba(34,26,18,.14), 0 14px 34px rgba(34,26,18,.16);
}

*{margin:0;padding:0;box-sizing:border-box}
/* the gutter is always reserved, so nothing shifts sideways when the
   viewer opens and the page behind it stops scrolling */
html{scroll-behavior:smooth;scrollbar-gutter:stable}

body{
  background-color:var(--vellum);
  color:var(--ink);
  font-family:var(--text);
  font-size:17.5px;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
}

/* foxing + grain, sits above everything but ignores the pointer */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:900;
  opacity:.55;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0.42 0 0 0 0 0.35 0 0 0 0 0.22 0 0 0 0.055 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23f)'/%3E%3C/svg%3E");
}


/* ---------- the ground, fixed behind everything ----------
   Her own paintings, drained of colour and blurred almost to weather, held
   still while the page scrolls over them. A fixed layer rather than
   background-attachment:fixed, which iOS ignores. */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-color:var(--vellum);
  background-image:
    repeating-linear-gradient(112deg, rgba(34,26,18,.026) 0 2px, transparent 2px 11px),
    radial-gradient(ellipse 62% 48% at 50% 8%,  rgba(252,247,236,.62), transparent 72%),
    radial-gradient(ellipse 58% 45% at 50% 96%, rgba(246,238,221,.52), transparent 70%),
    url("../assets/site/ground.jpg"),
    linear-gradient(150deg,#f2e8d3,#e6d7b8 60%,#efe4cd);
  background-size:auto, auto, auto, cover, auto;
  background-position:center, center, center, center center, center;
  background-repeat:repeat, no-repeat, no-repeat, no-repeat, no-repeat;
}
@media (max-width:820px){
  body::before{background-image:
    repeating-linear-gradient(112deg, rgba(34,26,18,.026) 0 2px, transparent 2px 11px),
    radial-gradient(ellipse 62% 48% at 50% 8%,  rgba(252,247,236,.62), transparent 72%),
    radial-gradient(ellipse 58% 45% at 50% 96%, rgba(246,238,221,.52), transparent 70%),
    url("../assets/site/ground-sm.jpg"),
    linear-gradient(150deg,#f2e8d3,#e6d7b8 60%,#efe4cd)}
}

img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
/* a visible mark for whoever moves by keyboard, in the same gold leaf */
:focus-visible{outline:2px solid var(--gold-ink);outline-offset:3px}
.lightbox :focus-visible{outline-color:var(--gold-lit)}
::selection{background:var(--oxblood);color:var(--vellum-lit)}

.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
.narrow{max-width:780px;margin:0 auto;padding:0 28px}

/* ---------- typography ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:500;line-height:1.12}
.display{
  font-size:clamp(46px,7.4vw,104px);font-weight:400;letter-spacing:.015em;
  line-height:1.02;
}
.title{font-size:clamp(30px,4.2vw,50px);font-weight:500}
.subtitle{font-family:var(--display);font-size:clamp(18px,2.1vw,25px);font-style:italic;color:var(--ink-soft)}

/* engraved small caps — the workhorse label of the whole site */
.caps{
  font-family:var(--small);font-size:13px;font-weight:600;
  letter-spacing:.42em;text-transform:uppercase;color:var(--oxblood);
}
.caps.gold{color:var(--gold-ink)}
.caps.pale{color:rgba(239,228,205,.72)}

.lede{
  font-family:var(--display);font-size:clamp(21px,2.4vw,30px);
  line-height:1.45;font-weight:400;color:var(--ink);
}
.lede em{font-style:italic;color:var(--oxblood)}
p{margin-bottom:1.05em;color:var(--ink-soft)}
.muted{color:var(--ink-faint)}

/* drop capital, cut like a woodblock initial */
.initial::first-letter{
  float:left;font-family:var(--display);font-size:5.1em;line-height:.82;
  font-weight:500;color:var(--oxblood);
  margin:.06em .1em -.06em 0;
}

/* ---------- ornaments ---------- */
.orn{display:block;margin:0 auto;color:var(--gold)}
.orn-fleuron{width:150px;height:50px}
.orn-rule{width:min(420px,72%);height:26px;color:var(--gold);opacity:.9}
.divider{padding:46px 0;text-align:center}

/* double rule with a lozenge, drawn in CSS */
.rule-double{
  border:0;height:6px;width:100%;
  border-top:1px solid var(--rule-strong);
  border-bottom:1px solid var(--rule);
  position:relative;margin:0;
}
.rule-double::after{
  content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;
  transform:translate(-50%,-50%) rotate(45deg);
  background:var(--vellum);border:1px solid var(--gold);
}

/* ---------- header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg, rgba(239,228,205,.97), rgba(239,228,205,.92));
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(255,252,244,.6), 0 6px 18px rgba(34,26,18,.06);
}
.site-header .bar{
  max-width:var(--max);margin:0 auto;padding:14px 28px;
  display:flex;align-items:center;gap:26px;
}
.brand{display:flex;flex-direction:column;line-height:1.1;flex:0 0 auto}
.brand .name{
  font-family:var(--display);font-size:23px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;
}
.brand .sub{
  font-family:var(--small);font-size:9.5px;letter-spacing:.34em;
  text-transform:uppercase;color:var(--gold-ink);margin-top:2px;
}
.nav{margin-left:auto;display:flex;gap:30px;align-items:center}
.nav a{
  font-family:var(--small);font-size:12.5px;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-soft);
  padding:6px 0;position:relative;transition:color .25s;
}
.nav a::after{
  content:"";position:absolute;left:50%;right:50%;bottom:0;height:1px;
  background:var(--gold);transition:left .3s,right .3s;
}
.nav a:hover{color:var(--ink)}
.nav a:hover::after,.nav a.active::after{left:0;right:0}
.nav a.active{color:var(--oxblood)}
.menu-toggle{display:none;background:none;border:0;font-size:21px;color:var(--ink);margin-left:auto}

.lang-switch{display:flex;gap:0;border:1px solid var(--rule-strong);flex:0 0 auto}
.lang-switch button{
  background:none;border:0;border-right:1px solid var(--rule);
  padding:6px 11px;font-family:var(--small);font-size:11px;font-weight:600;
  letter-spacing:.14em;color:var(--ink-faint);transition:background .25s,color .25s;
}
.lang-switch button:last-child{border-right:0}
.lang-switch button:hover{color:var(--ink);background:rgba(164,128,44,.1)}
.lang-switch button.on{background:var(--oxblood);color:var(--vellum-lit)}

/* ---------- frontispiece ---------- */
.frontispiece{position:relative;border-bottom:1px solid var(--rule);background:#1a1410;overflow:hidden}
/* the frontispiece painting drifts; the border, the corners and the
   lettering are laid over it and never move */
.frontispiece .bg-strip{
  display:flex;width:max-content;height:min(80vh,760px);
  will-change:transform;
  animation:heroWalk 200s linear infinite;
}
.frontispiece img.bg{
  height:100%;width:auto;max-width:none;flex:0 0 auto;object-fit:cover;opacity:.86;
}
/* every second panel is turned over, so panel meets panel on the same column */
.frontispiece .bg-strip img.bg:nth-child(even){transform:scaleX(-1)}
@keyframes heroWalk{
  from{transform:translate3d(0,0,0)}
  to  {transform:translate3d(-50%,0,0)}
}
@media (prefers-reduced-motion:reduce){
  .frontispiece .bg-strip{animation:none;width:100%}
  .frontispiece .bg-strip img.bg:not(:first-child){display:none}
  .frontispiece img.bg{width:100%;height:100%}
}
.frontispiece .veil{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 50% 62%, rgba(26,20,16,.12) 0%, rgba(26,20,16,.72) 78%),
    linear-gradient(180deg, rgba(26,20,16,.55) 0%, transparent 26%, rgba(26,20,16,.6) 100%);
}
/* engraved border inset into the plate */
.frontispiece .border{
  position:absolute;inset:26px;pointer-events:none;
  border:1px solid rgba(200,160,74,.5);
  box-shadow:inset 0 0 0 5px rgba(26,20,16,.24), inset 0 0 0 6px rgba(200,160,74,.26);
}
.frontispiece .corner{position:absolute;width:52px;height:52px;color:rgba(200,160,74,.72)}
.frontispiece .corner.tl{top:30px;left:30px}
.frontispiece .corner.tr{top:30px;right:30px;transform:scaleX(-1)}
.frontispiece .corner.bl{bottom:30px;left:30px;transform:scaleY(-1)}
.frontispiece .corner.br{bottom:30px;right:30px;transform:scale(-1)}

.frontispiece .content{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:60px 40px;color:var(--vellum-lit);
}
.frontispiece .display{color:#f4ead6;text-shadow:0 2px 26px rgba(0,0,0,.5)}
.frontispiece .geo{
  font-family:var(--georgian);font-size:clamp(15px,1.9vw,21px);
  letter-spacing:.2em;color:rgba(200,160,74,.9);margin-top:14px;
}
.frontispiece .years{
  font-family:var(--display);font-style:italic;font-size:clamp(16px,1.8vw,21px);
  color:rgba(239,228,205,.78);margin-top:6px;
}
.frontispiece .plate-note{
  position:absolute;bottom:44px;left:0;right:0;text-align:center;
  font-family:var(--small);font-size:10.5px;letter-spacing:.3em;
  text-transform:uppercase;color:rgba(239,228,205,.55);
}

/* fade-in on load */
.rise{opacity:0;transform:translateY(14px);animation:rise .95s cubic-bezier(.2,.7,.2,1) forwards}
.rise.d1{animation-delay:.12s}.rise.d2{animation-delay:.26s}.rise.d3{animation-delay:.4s}
@keyframes rise{to{opacity:1;transform:none}}

/* ---------- sections ---------- */
.section{padding:88px 0}
.section-head{text-align:center;margin-bottom:52px}
.section-head .title{margin-top:12px}
.section-head .orn-rule{margin-top:18px}

/* two-column "argument" block, in the manner of a preface */
.preface{display:grid;grid-template-columns:1fr 1fr;gap:62px;align-items:start}
.preface .signature{width:min(280px,72%);margin-top:26px;mix-blend-mode:multiply;opacity:.88}

/* ---------- gallery plates ---------- */
.plates{display:grid;grid-template-columns:repeat(3,1fr);gap:54px 40px}
.plates.two{grid-template-columns:repeat(2,1fr);gap:60px 52px}
.plate{position:relative;display:flex;flex-direction:column;text-align:center}
.plates{align-items:start}

/* --- cassetta: a flat walnut band between two gilt mouldings --- */
:root{
  --cass-rings:
    inset 0 0 0 2px  #6b5224,
    inset 0 0 0 4px  #c9a44f,
    inset 0 0 0 6px  #7d5f28,
    inset 0 0 0 19px #2c2011,
    inset 0 0 0 21px #b8933f,
    inset 0 0 0 23px #6b5224,
    inset 0 0 0 24px rgba(0,0,0,.55);
  --cass-ground:
    repeating-linear-gradient(46deg, rgba(255,240,200,.05) 0 1px, transparent 1px 6px),
    linear-gradient(158deg,#54401f 0%,#3a2b16 38%,#2c2011 62%,#4a3819 100%);
  --cass-sheen:
    linear-gradient(158deg, rgba(255,236,190,.17), transparent 34%,
                            transparent 66%, rgba(0,0,0,.22));
}
.plate .mount{
  display:block;position:relative;
  padding:26px;
  background:var(--cass-ground);
  border:0;
  box-shadow:var(--cass-rings),
             0 2px 4px rgba(34,26,18,.22),
             0 24px 50px rgba(34,26,18,.34);
  transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s;
}
.plate .mount::before{                /* gilding, caught by the light */
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:var(--cass-sheen);
}
/* The frame is cut to the picture, as a framer would cut it: no uniform box,
   no empty cream at the sides. The width and height attributes give the
   proportion before the file arrives, so nothing jumps while it loads.
   height:auto is required — those attributes are presentational hints and
   would otherwise beat the ratio. */
.plate .mount img{
  width:100%;height:auto;display:block;background:var(--vellum-lit);
  position:relative;z-index:1;
}
/* works on paper are laid on a cream mount inside the frame; the frame
   itself still follows the drawing, upright or lying down */
.plate[data-cat="ink"] .mount img{padding:14px}
.plate:hover .mount{transform:translateY(-7px);
  box-shadow:var(--cass-rings),
             0 3px 6px rgba(34,26,18,.24),
             0 32px 64px rgba(34,26,18,.40)}

.plate .legend{padding:20px 6px 0}
.plate .num{
  font-family:var(--small);font-size:10.5px;letter-spacing:.32em;
  text-transform:uppercase;color:var(--gold-ink);
}
.plate .t{font-family:var(--display);font-size:24px;font-weight:500;margin:5px 0 3px}
.plate .m{font-family:var(--display);font-style:italic;font-size:15.5px;color:var(--ink-faint)}

/* album (masonry) variant for the full gallery */
.album{columns:3 320px;column-gap:44px}
.album .plate{break-inside:avoid;margin-bottom:52px;display:block}
.album .mount img{aspect-ratio:auto}

/* ---------- filters ---------- */
.filters{display:flex;gap:0;justify-content:center;flex-wrap:wrap;margin-bottom:52px;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:4px 0}
.filters button{
  background:none;border:0;border-right:1px solid var(--rule);
  padding:11px 26px;font-family:var(--small);font-size:11.5px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint);
  transition:color .25s,background .25s;
}
.filters button:last-child{border-right:0}
.filters button:hover{color:var(--ink);background:rgba(164,128,44,.08)}
.filters button.on{color:var(--oxblood);background:rgba(164,128,44,.14)}

/* ---------- panorama band ---------- */
.panorama{
  background:
    linear-gradient(180deg,#1d1712,#241c14);
  padding:74px 0 58px;color:var(--vellum-lit);
  border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);
}
.panorama .title{color:#f2e7d2}
.panorama .caps{color:var(--gold-lit)}
.panorama .orn{color:var(--gold-lit)}
.pan-scroll{overflow-x:auto;margin-top:38px;padding-bottom:10px;
  scrollbar-width:thin;scrollbar-color:#6b5a3c transparent}
.pan-scroll img{height:360px;max-width:none;border:1px solid rgba(200,160,74,.4);
  box-shadow:0 16px 46px rgba(0,0,0,.55)}
.panorama .hint{
  text-align:center;margin-top:20px;font-family:var(--small);font-size:11px;
  letter-spacing:.26em;text-transform:uppercase;color:rgba(239,228,205,.5);
}

/* ---------- memorial ---------- */
.memorial-head{text-align:center;padding:82px 28px 20px}
.portrait-plate{
  width:min(430px,86%);margin:44px auto 0;background:var(--vellum-lit);
  padding:18px;border:1px solid var(--rule);box-shadow:var(--plate-shadow);position:relative;
}
.portrait-plate::before{content:"";position:absolute;inset:9px;border:1px solid rgba(164,128,44,.45)}
.portrait-plate img{position:relative;z-index:1}

.vellum-panel{
  background:var(--vellum-lit);border:1px solid var(--rule);
  padding:52px 56px;position:relative;box-shadow:var(--plate-shadow);
}
.vellum-panel::before{content:"";position:absolute;inset:10px;border:1px solid rgba(164,128,44,.32);pointer-events:none}
.vellum-panel > *{position:relative}
.placeholder{
  border:1px dashed var(--rule-strong);padding:26px;text-align:center;
  font-family:var(--display);font-style:italic;font-size:18px;color:var(--ink-faint);
  background:rgba(164,128,44,.05);
}

.exhibit{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.exhibit .mount{background:var(--vellum-lit);padding:16px;border:1px solid var(--rule);
  box-shadow:var(--plate-shadow);position:relative}
.exhibit .mount::before{content:"";position:absolute;inset:8px;border:1px solid rgba(164,128,44,.4)}
.exhibit .mount img{position:relative;z-index:1}
.exhibit .cap{font-family:var(--display);font-style:italic;font-size:15.5px;
  color:var(--ink-faint);margin-top:16px;line-height:1.6}
.upcoming{border-left:2px solid var(--gold);padding-left:34px}
.upcoming h3{font-size:clamp(25px,3vw,34px);margin:10px 0 14px}
.upcoming .note{font-size:15.5px;color:var(--ink-faint)}
.upcoming .note a{color:var(--oxblood);border-bottom:1px solid var(--gold)}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;font-family:var(--small);font-size:11.5px;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;
  padding:14px 34px;color:var(--vellum-lit);background:var(--oxblood);
  border:1px solid var(--oxblood);position:relative;transition:background .3s,color .3s;
}
.btn:hover{background:#571619;border-color:#571619}
.btn.ghost{background:none;color:var(--ink);border-color:var(--rule-strong)}
.btn.ghost:hover{background:var(--ink);color:var(--vellum);border-color:var(--ink)}
.btn.gold{background:none;color:var(--gold-ink);border-color:var(--gold)}
.btn.gold:hover{background:var(--gold);color:#1a1410}


/* ---------- memorial photographs ---------- */
/* a wall of photographs: columns, so nothing has to be cropped square */
.photos{columns:3 260px;column-gap:44px;margin-top:8px}
.photo{position:relative;display:block;break-inside:avoid;margin:0 0 44px}
/* the photographs are not paintings, so they are not gilded: a plain
   charcoal edge, a narrow paper mat, the way a print is hung today */
.photo .mount{
  display:block;position:relative;padding:18px;
  background:#faf7f0;
  border:2px solid #2b2723;
  box-shadow:0 1px 2px rgba(34,26,18,.10),0 16px 34px rgba(34,26,18,.18);
  transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s;
}
.photo .mount::after{content:"";position:absolute;inset:0;z-index:4}
.photo .mount img{width:100%;height:auto;display:block;position:relative;z-index:1;
  background:var(--vellum-lit);box-shadow:0 0 0 1px rgba(34,26,18,.22)}
.photo:hover .mount{transform:translateY(-5px);
  box-shadow:0 2px 3px rgba(34,26,18,.12),0 24px 48px rgba(34,26,18,.24)}
.photo .cap{font-family:var(--display);font-style:italic;font-size:15.5px;
  color:var(--ink-faint);margin-top:16px;line-height:1.6;text-align:center}
.photo .cap:empty{display:none}
/* one column below 820px, but held to a width the photographs can fill
   without being enlarged past their own resolution */
@media (max-width:820px){ .photos{columns:2 220px;column-gap:30px}
  .photo{margin-bottom:30px} }
@media (max-width:520px){ .photos{columns:1;max-width:430px;margin-left:auto;margin-right:auto} }

/* ---------- the guest book ---------- */
.gb-wrap{max-width:820px;margin:0 auto}
.gb-form{
  background:linear-gradient(180deg, rgba(247,240,224,.86), rgba(239,228,205,.72));
  border:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(255,252,244,.7), 0 14px 34px rgba(34,26,18,.10);
  padding:34px 34px 28px;margin-bottom:64px;
}
.gb-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.gb-field{display:block;margin-bottom:20px}
.gb-label{
  display:block;font-family:var(--small);font-size:11px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:7px;
}
.gb-label em{font-style:normal;letter-spacing:.12em;color:var(--ink-faint);text-transform:none}
.gb-form input[type=text],.gb-form textarea{
  width:100%;font-family:var(--text);font-size:17px;line-height:1.6;color:var(--ink);
  background:var(--vellum-lit);border:1px solid var(--rule);
  padding:11px 13px;border-radius:0;
  transition:border-color .25s, box-shadow .25s;
}
.gb-form textarea{resize:vertical;min-height:132px}
.gb-form input[type=text]:focus,.gb-form textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(164,128,44,.16)
}
/* the honeypot: off the page, never announced, never seen */
.gb-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.gb-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:4px}
.gb-note{font-family:var(--display);font-style:italic;font-size:16px;color:var(--ink-faint)}
.gb-note.good{color:var(--verdigris)}
.gb-note.bad{color:var(--oxblood)}
.gb-fine{font-size:14px;color:var(--ink-faint);margin:18px 0 0;line-height:1.6}

.gb-entries{display:block}
.gb-entry{
  border-top:1px solid var(--rule);padding:34px 0 30px;margin:0;
}
.gb-entry:first-child{border-top:1px solid var(--rule-strong)}
.gb-words{
  font-family:var(--display);font-size:21px;line-height:1.6;color:var(--ink);
  margin:0 0 14px;position:relative;padding-left:26px;
}
.gb-words::before{
  content:"\201C";position:absolute;left:-2px;top:-6px;
  font-family:var(--display);font-size:52px;line-height:1;color:var(--gold);opacity:.55;
}
.gb-by{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding-left:26px}
.gb-name{font-family:var(--small);font-size:12px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--oxblood)}
.gb-place{font-family:var(--display);font-style:italic;font-size:15.5px;color:var(--ink-faint)}
.gb-when{font-family:var(--small);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-faint);margin-left:auto}
.gb-empty{text-align:center;font-family:var(--display);font-style:italic;
  font-size:18px;color:var(--ink-faint);padding:20px 0 10px}

@media (max-width:640px){
  .gb-form{padding:26px 20px 22px}
  .gb-row{grid-template-columns:1fr;gap:0}
  .gb-when{margin-left:0;width:100%}
}

/* ---------- lightbox ---------- */
.lightbox{
  position:fixed;inset:0;z-index:200;display:none;
  background:rgba(20,15,11,.965);align-items:center;justify-content:center;padding:44px;
}
.lightbox.open{display:flex;animation:lbin .35s ease}
@keyframes lbin{from{opacity:0}to{opacity:1}}
.lightbox figure{max-width:94vw;max-height:90vh;text-align:center}
.lightbox img{
  max-width:88vw;max-height:70vh;object-fit:contain;margin:0 auto;
  background:var(--vellum-lit);
}
.lightbox figure[data-cat="ink"] img{padding:14px}
.lb-shield{
  padding:24px;background:var(--cass-ground);
  box-shadow:var(--cass-rings), 0 34px 90px rgba(0,0,0,.72);
}
.lb-shield::before{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:var(--cass-sheen);
}
/* a photograph keeps its modern mat when it opens full size */
.lightbox figure[data-cat="photo"] .lb-shield{
  padding:18px;background:#faf7f0;
  box-shadow:0 0 0 2px #16120e, 0 34px 90px rgba(0,0,0,.7);
}
.lightbox figure[data-cat="photo"] .lb-shield::before{display:none}
.lightbox figure[data-cat="photo"] img{box-shadow:0 0 0 1px rgba(34,26,18,.22)}
.lightbox figcaption{margin-top:22px}
.lightbox .lb-num{font-family:var(--small);font-size:10.5px;letter-spacing:.32em;
  text-transform:uppercase;color:var(--gold-lit)}
.lightbox .lb-title{font-family:var(--display);font-size:26px;color:#f2e7d2;margin-top:6px}
.lightbox .lb-sub{font-family:var(--display);font-style:italic;font-size:16px;color:rgba(239,228,205,.6);margin-top:2px}
.lb-btn{position:absolute;background:none;border:0;color:rgba(239,228,205,.7);
  font-family:var(--display);font-size:40px;line-height:1;padding:12px 20px;transition:color .25s}
.lb-btn:hover{color:var(--gold-lit)}
.lb-close{top:20px;right:24px;font-size:34px}
.lb-prev{left:10px;top:50%;transform:translateY(-50%)}
.lb-next{right:10px;top:50%;transform:translateY(-50%)}

/* ---------- footer ---------- */
.site-footer{
  border-top:1px solid var(--rule-strong);margin-top:96px;
  background:linear-gradient(180deg, rgba(229,215,186,.5), rgba(229,215,186,.85));
}
.site-footer .inner{padding:58px 0 34px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px}
.site-footer h4{font-family:var(--display);font-size:22px;font-weight:600;letter-spacing:.06em;margin-bottom:10px}
.site-footer .geo{font-family:var(--georgian);font-size:13.5px;color:var(--ink-faint)}
.site-footer p,.site-footer a{font-size:15px;color:var(--ink-soft)}
.site-footer ul{list-style:none}
.site-footer li{margin-bottom:9px}
.site-footer a:hover{color:var(--oxblood)}
.site-footer .sig{width:170px;margin-top:16px;mix-blend-mode:multiply;opacity:.7}
.site-footer .legal{font-size:13.5px;color:var(--ink-faint);line-height:1.62;
  max-width:800px;margin:0 auto;text-align:center;padding:0 28px}
.site-footer .bottom{
  border-top:1px solid var(--rule);margin-top:26px;padding:18px 0 30px;
  display:flex;gap:22px;justify-content:center;flex-wrap:wrap;
  font-family:var(--small);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);
}
.site-footer .bottom a{font-size:11px;letter-spacing:.2em;color:var(--ink-faint);border-bottom:1px solid var(--rule)}

/* ---------- legal page ---------- */
.legal-page{max-width:790px;margin:0 auto;padding:74px 28px 40px}
.legal-page h1{font-size:clamp(34px,4.6vw,56px);text-align:center}
.legal-page h2{font-size:25px;margin:38px 0 10px;color:var(--ink)}
.legal-page .intro{font-family:var(--display);font-size:20px;font-style:italic;color:var(--ink-soft);text-align:center;margin-top:12px}

/* ---------- cookie bar ---------- */
.cookie-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:150;
  background:linear-gradient(180deg,#241c14,#1c150f);color:rgba(239,228,205,.9);
  border-top:2px solid var(--gold);
  transform:translateY(100%);transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.cookie-bar.show{transform:none}
.cookie-inner{max-width:var(--max);margin:0 auto;padding:20px 28px;display:flex;gap:30px;align-items:center}
.cookie-inner p{margin:0;font-size:15px;line-height:1.6;color:rgba(239,228,205,.78)}
.cookie-inner strong{font-family:var(--small);font-size:11.5px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold-lit);margin-right:8px}
.cookie-inner a{color:var(--gold-lit);border-bottom:1px solid rgba(200,160,74,.5);white-space:nowrap}
.cookie-actions{margin-left:auto;display:flex;gap:12px;flex-shrink:0}
.ck-btn{
  font-family:var(--small);font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;padding:12px 24px;white-space:nowrap;
  background:var(--gold);color:#1a1410;border:1px solid var(--gold);transition:background .25s
}
.ck-btn:hover{background:var(--gold-lit)}
.ck-btn.ghost{background:none;color:rgba(239,228,205,.75);border-color:rgba(239,228,205,.35)}
.ck-btn.ghost:hover{background:rgba(239,228,205,.12);color:#f2e7d2}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal.no-anim{transition:none}

/* ---------- script-specific tuning ---------- */
html[lang="ka"] body{font-family:var(--georgian)}
html[lang="ka"] h1,html[lang="ka"] h2,html[lang="ka"] h3,html[lang="ka"] .lede,
html[lang="ka"] .plate .t,html[lang="ka"] .brand .name{font-family:var(--georgian);font-weight:500}
html[lang="ka"] .display{font-size:clamp(32px,5.2vw,68px);line-height:1.16}
html[lang="ka"] .title{font-size:clamp(24px,3.3vw,40px);line-height:1.24}
html[lang="ka"] .caps,html[lang="ka"] .nav a,html[lang="ka"] .filters button,
html[lang="ka"] .btn,html[lang="ka"] .plate .num{letter-spacing:.08em;text-transform:none}
html[lang="ka"] .initial::first-letter{font-size:3.4em;line-height:.95}
html[lang="ru"] .display{font-size:clamp(38px,6vw,84px)}
html[lang="ru"] .caps,html[lang="ru"] .nav a{letter-spacing:.2em}
html[lang="ru"] .initial::first-letter{font-size:4.4em}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .plates{grid-template-columns:repeat(2,1fr);gap:44px 32px}
  .plate .mount{padding:20px}
  .preface,.exhibit{grid-template-columns:1fr;gap:40px}
  .site-footer .inner{grid-template-columns:1fr;gap:32px;text-align:center}
  .site-footer .sig{margin-left:auto;margin-right:auto}
  .upcoming{border-left:0;border-top:2px solid var(--gold);padding-left:0;padding-top:28px}
  .album{columns:2 260px;column-gap:32px}
}
@media (max-width:860px){
  .site-header .bar{gap:12px;padding:12px 18px}
  .nav{position:fixed;inset:60px 0 auto 0;flex-direction:column;gap:0;display:none;
    background:var(--vellum);border-bottom:1px solid var(--rule-strong);padding:8px 0;z-index:70;
    box-shadow:0 18px 40px rgba(34,26,18,.18)}
  .nav.open{display:flex}
  .nav a{width:100%;padding:15px 24px;text-align:center;border-bottom:1px solid var(--rule)}
  .nav a::after{display:none}
  .menu-toggle{display:block}
  .brand .name{font-size:18px;letter-spacing:.06em}
  .brand .sub{font-size:8.5px;letter-spacing:.24em}
  .lang-switch button{padding:5px 8px;font-size:10px;letter-spacing:.06em}
  .frontispiece .bg-strip{height:64vh}
  .frontispiece .border{inset:16px}
  .frontispiece .corner{width:38px;height:38px}
  .frontispiece .corner.tl{top:19px;left:19px}.frontispiece .corner.tr{top:19px;right:19px}
  .frontispiece .corner.bl{bottom:19px;left:19px}.frontispiece .corner.br{bottom:19px;right:19px}
  .vellum-panel{padding:34px 26px}
  .cookie-inner{flex-direction:column;align-items:stretch;gap:16px;padding:18px 22px}
  .cookie-actions{margin-left:0}
  .ck-btn{flex:1;padding:12px 10px}
}
@media (max-width:620px){
  body{font-size:16.5px}
  .plates,.plates.two{grid-template-columns:1fr;gap:40px}
  .plate .mount{padding:16px}
  .lb-shield{padding:14px}
  .album{columns:1}
  .section{padding:60px 0}
  .divider{padding:34px 0}
  .pan-scroll img{height:240px}
  .filters button{padding:10px 16px;font-size:10.5px;letter-spacing:.16em}
  .memorial-head{padding:54px 22px 12px}
}
@media (max-width:420px){
  .site-header .bar{flex-wrap:wrap;row-gap:10px}
  .brand{order:1}.menu-toggle{order:2;margin-left:auto}
  .lang-switch{order:3;width:100%;justify-content:center}
  .lang-switch button{flex:1;padding:7px 4px}
  .nav{top:96px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .rise{opacity:1;transform:none}
  .reveal{opacity:1;transform:none}
}

/* ============================================================
   PICTURE GUARD
   Discourages saving, dragging and copying of the plates.
   A transparent shield sits over every picture so that a
   right-click or a long press lands on the mount, not the image.
   ============================================================ */
img{
  -webkit-user-drag:none; -khtml-user-drag:none; -moz-user-drag:none; user-drag:none;
  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;
  -webkit-touch-callout:none;
}
.plate .mount img,
.exhibit .mount img,
.portrait-plate img,
.photo .mount img,
.pan-scroll img,
.frontispiece img.bg,
.lightbox img,
.site-footer .sig{ pointer-events:none; }

.portrait-plate{position:relative;padding:22px;background:var(--cass-ground);
  box-shadow:var(--cass-rings), 0 2px 4px rgba(34,26,18,.22), 0 24px 50px rgba(34,26,18,.34)}
.portrait-plate::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:var(--cass-sheen)}
.portrait-plate img{position:relative;z-index:1;background:var(--vellum-lit)}
.plate .mount::after,
.exhibit .mount::after,
.portrait-plate::after,
.pan-shield::after,
.lb-shield::after{
  content:"";position:absolute;inset:0;z-index:4;
  background:transparent;
}
.pan-shield,.lb-shield{position:relative;display:inline-block;line-height:0}
.pan-shield{max-width:none}
.lb-shield{max-width:100%;margin:0 auto}

/* the brief notice shown when someone tries to take a picture */
.guard-note{
  position:fixed;left:50%;bottom:34px;transform:translate(-50%,26px);
  z-index:400;max-width:min(520px,88vw);
  background:var(--vellum-lit);color:var(--ink);
  border:1px solid var(--gold);
  box-shadow:0 2px 4px rgba(34,26,18,.14),0 22px 54px rgba(34,26,18,.34);
  padding:15px 26px;text-align:center;
  font-family:var(--display);font-style:italic;font-size:17px;line-height:1.5;
  opacity:0;pointer-events:none;transition:opacity .4s ease,transform .4s ease;
}
.guard-note.show{opacity:1;transform:translate(-50%,0)}
.guard-note::before{
  content:"";position:absolute;inset:5px;border:1px solid rgba(164,128,44,.4);pointer-events:none;
}

.print-only{display:none}

@media print{
  .plate .mount img,.exhibit .mount img,.portrait-plate img,.photo .mount img,
  .pan-scroll img,.frontispiece img.bg,.lightbox img,.site-footer .sig,
  .signature{display:none !important}
  .plate .mount,.exhibit .mount,.portrait-plate{
    min-height:150px;border:1px dashed #999 !important;box-shadow:none !important;
  }
  .lightbox{display:none !important}
  .cookie-bar,.guard-note,.lang-switch,.filters,.menu-toggle{display:none !important}
  .print-only{display:block;margin-top:18px;font-style:italic}
}

/* ============================================================
   SCREEN-CAPTURE VEIL
   The plates are covered whenever this window is no longer the
   one in front — which is what most screen-clipping tools do
   before they take their picture. It cannot stop a screenshot
   outright; nothing on the web can. It removes the easy ones.
   ============================================================ */
.capture-veil{
  position:fixed;inset:0;z-index:600;display:none;
  background:var(--vellum);
  align-items:center;justify-content:center;
  text-align:center;padding:44px;
}
.capture-veil.on{display:flex}
.capture-veil .inner{max-width:560px;position:relative;padding:44px 40px}
.capture-veil .inner::before{
  content:"";position:absolute;inset:0;
  border:1px solid rgba(164,128,44,.5);
  box-shadow:inset 0 0 0 4px rgba(239,228,205,.6), inset 0 0 0 5px rgba(164,128,44,.22);
  pointer-events:none;
}
.capture-veil .orn{color:var(--gold);width:150px;height:auto;display:block;margin:0 auto 14px}
.capture-veil .caps{
  font-family:var(--small);font-size:10.5px;letter-spacing:.32em;
  text-transform:uppercase;color:var(--gold);
}
.capture-veil .msg{
  font-family:var(--display);font-style:italic;
  font-size:clamp(19px,2.4vw,26px);line-height:1.5;
  color:var(--ink);margin-top:14px;
}
.capture-veil .sub{
  font-family:var(--text);font-size:14.5px;color:var(--ink-faint);margin-top:16px;
}
html[lang="ka"] .capture-veil .msg{font-family:var(--georgian);font-style:normal;font-size:clamp(17px,2.1vw,22px)}
@media print{ .capture-veil{display:none !important} }

/* ============================================================
   THE GUEST BOOK, AS A BOOK
   Two leaves, a sewn spine, and a page that actually turns.
   ============================================================ */
.gb-book{margin:40px auto 0;max-width:940px}
.gb-book[hidden]{display:none}

.gb-book-inner{
  position:relative;display:flex;perspective:2400px;
  border-radius:3px 6px 6px 3px;
  box-shadow:0 2px 3px rgba(34,26,18,.20), 0 30px 60px rgba(34,26,18,.30);
}
.gb-leaf{
  position:relative;flex:1 1 50%;min-height:360px;overflow:hidden;
  background:
    repeating-linear-gradient(0deg, transparent 0 33px, rgba(34,26,18,.045) 33px 34px),
    linear-gradient(180deg,#fbf6e9,#f5edda);
}
.gb-leaf-l{border-radius:3px 0 0 3px;
  box-shadow:inset -22px 0 26px -22px rgba(34,26,18,.45), inset 1px 1px 0 rgba(255,255,255,.6)}
.gb-leaf-r{border-radius:0 3px 3px 0;
  box-shadow:inset 22px 0 26px -22px rgba(34,26,18,.45), inset -1px 1px 0 rgba(255,255,255,.6)}
/* the edges of all the other pages */
.gb-leaf-l::after,.gb-leaf-r::after{
  content:"";position:absolute;top:5px;bottom:5px;width:7px;pointer-events:none;
  background:repeating-linear-gradient(90deg,#e6dcc2 0 1px,#f7f1e2 1px 3px);
}
.gb-leaf-l::after{left:-7px;border-radius:2px 0 0 2px}
.gb-leaf-r::after{right:-7px;border-radius:0 2px 2px 0}

.gb-spine{
  flex:0 0 12px;align-self:stretch;
  background:linear-gradient(90deg,
    rgba(34,26,18,.30), rgba(34,26,18,.10) 32%, rgba(255,250,238,.55) 50%,
    rgba(34,26,18,.10) 68%, rgba(34,26,18,.30));
}

.gb-page{
  padding:44px 46px;height:100%;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;text-align:center;
}
.gb-page .gb-words{
  font-family:var(--display);font-size:20px;line-height:1.75;color:var(--ink);
  margin:0 0 20px;font-style:italic;
}
.gb-page .gb-by{font-family:var(--small);font-size:10.5px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold-ink)}
.gb-page .gb-place{display:block;margin-top:5px;color:var(--ink-faint);letter-spacing:.18em}
.gb-page .gb-when{display:block;margin-top:7px;color:var(--ink-faint);
  font-family:var(--display);font-style:italic;font-size:14px;
  letter-spacing:0;text-transform:none}
.gb-page.is-blank{opacity:.42}
.gb-page.is-blank .gb-words{font-size:16px}
.gb-folio-mark{
  position:absolute;bottom:16px;left:0;right:0;text-align:center;
  font-family:var(--small);font-size:9.5px;letter-spacing:.24em;color:var(--ink-faint);
}

/* the leaf in motion */
.gb-flip{
  position:absolute;top:0;right:0;width:calc(50% - 6px);height:100%;
  transform-style:preserve-3d;transform-origin:left center;
  transform:rotateY(0);pointer-events:none;z-index:5;
}
.gb-flip[hidden]{display:none}
.gb-flip.turning{transition:transform .95s cubic-bezier(.42,.02,.28,1)}
.gb-face{
  position:absolute;inset:0;backface-visibility:hidden;overflow:hidden;
  background:
    repeating-linear-gradient(0deg, transparent 0 33px, rgba(34,26,18,.045) 33px 34px),
    linear-gradient(180deg,#fbf6e9,#f5edda);
}
.gb-front{border-radius:0 3px 3px 0;
  box-shadow:inset 22px 0 26px -22px rgba(34,26,18,.45)}
.gb-back {transform:rotateY(180deg);border-radius:3px 0 0 3px;
  box-shadow:inset -22px 0 26px -22px rgba(34,26,18,.45)}

.gb-nav{display:flex;align-items:center;justify-content:center;gap:26px;margin-top:24px}
.gb-turn{
  font:inherit;font-size:22px;line-height:1;cursor:pointer;
  width:44px;height:44px;border-radius:50%;
  background:none;border:1px solid var(--rule-strong);color:var(--ink);
  transition:background .3s,color .3s,border-color .3s;
}
.gb-turn:hover:not(:disabled){background:var(--ink);color:var(--vellum);border-color:var(--ink)}
.gb-turn:disabled{opacity:.30;cursor:default}
.gb-folio{font-family:var(--small);font-size:10.5px;letter-spacing:.24em;color:var(--ink-faint)}

@media (max-width:760px){
  /* one page at a time on a telephone */
  .gb-leaf-l,.gb-spine,.gb-leaf-l::after{display:none}
  .gb-leaf-r{border-radius:3px;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
  .gb-flip{width:100%}
  .gb-page{padding:34px 26px}
  .gb-page .gb-words{font-size:18px}
  .gb-leaf{min-height:300px}
}
@media (prefers-reduced-motion:reduce){ .gb-flip.turning{transition:none} }