/* ==========================================================
   JOSEPHINE & KSHITIJ
   Two typefaces. Paper, ink, and rules. No motion.
   ========================================================== */

:root{
  --paper:      #F6F4EF;
  --paper-deep: #EDEAE4;
  --pearl:      #DFDCD5;
  --ink:        #1A1A19;
  --ink-soft:   #55534E;
  --ink-faint:  #8A877F;

  --display: 'Cormorant Garamond', 'Sailing Club', Georgia, serif;
  --body:    'EB Garamond', Georgia, serif;

  --gutter: clamp(1.35rem, 4.5vw, 5.5rem);
  --rule:   1px solid rgba(26,26,25,.42);
  --rule-f: 1px solid rgba(26,26,25,.17);
  --rule-g: 1px solid rgba(26,26,25,.09);
}

*,*::before,*::after{box-sizing:border-box;}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:clamp(1.05rem,1rem + .3vw,1.19rem);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  font-kerning:normal;
  font-feature-settings:"kern" 1,"liga" 1,"onum" 1;
}

img{max-width:100%;display:block;}
a{color:inherit;}
:focus-visible{outline:1px solid var(--ink);outline-offset:3px;}

/* ==========================================================
   TYPE
   Small labels are set in the text face, letterspaced lightly.
   No second sans. Two families do the whole site.
   ========================================================== */
.eyebrow,.caption,.kicker,.role,.tradition,.date,.when,.legend,
.nav-links a,.footer-links,.cover-issue,.cover-line .label,
.field label,.gate-label,.gate-date,.footer .sig,.events time,
.btn,.nav-mark{
  font-family:var(--body);
  text-transform:uppercase;
  letter-spacing:.13em;
  font-weight:400;
}

.eyebrow{
  font-size:.76rem;color:var(--ink-soft);
  margin:0 0 1.4rem;
}

h2.heading{
  font-family:var(--display);
  font-weight:400;
  font-size:clamp(2.1rem,1.4rem + 2.6vw,3.5rem);
  line-height:1.06;
  letter-spacing:-.004em;
  margin:0 0 1.5rem;
}

h3.sub{
  font-family:var(--display);font-weight:500;
  font-size:clamp(1.5rem,1.25rem + 1vw,1.95rem);
  line-height:1.12;margin:0 0 .5rem;
}

.lede{
  max-width:36em;
  font-size:clamp(1.1rem,1.04rem + .34vw,1.28rem);
  line-height:1.52;
  color:var(--ink);
}
.lede.muted,.muted{color:var(--ink-soft);}
.center{text-align:center;}
.center .lede{margin-left:auto;margin-right:auto;}

.dropcap::first-letter{
  font-family:var(--display);
  float:left;
  font-size:3.6em;
  line-height:.82;
  padding:.04em .1em 0 0;
}

.pull{
  margin:clamp(2.5rem,5vw,4rem) 0;
  padding:clamp(1.5rem,2.6vw,2.1rem) 0;
  border-top:var(--rule-f);
  border-bottom:var(--rule-f);
}
.pull p{
  font-family:var(--display);font-weight:400;
  font-style:italic;
  font-size:clamp(1.4rem,1.15rem + 1.3vw,2.1rem);
  line-height:1.24;margin:0;max-width:30ch;
}
.pull .attrib{
  display:block;margin-top:1rem;
  font-family:var(--body);font-size:.74rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink-faint);
}

.caption{
  font-size:.74rem;color:var(--ink-faint);
  line-height:1.7;margin:.85rem 0 0;
}

.link{
  color:var(--ink);text-decoration:none;
  border-bottom:1px solid rgba(26,26,25,.35);
  padding-bottom:1px;
}
.link:hover,.link:focus-visible{border-bottom-color:var(--ink);}

/* ==========================================================
   NAVIGATION
   ========================================================== */
.nav{
  position:sticky;top:0;z-index:60;
  background:var(--paper);
  border-bottom:var(--rule-f);
}
.nav-inner{
  max-width:82rem;margin:0 auto;
  padding:.95rem var(--gutter);
  display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
}
.nav-mark{
  font-family:var(--display);font-size:1.05rem;font-weight:500;
  letter-spacing:.14em;text-decoration:none;color:var(--ink);
  white-space:nowrap;text-transform:uppercase;
}
.nav-links{display:flex;gap:clamp(.9rem,2.2vw,2.2rem);flex-wrap:wrap;}
.nav-links a{
  font-size:.74rem;text-decoration:none;color:var(--ink-soft);
  padding:.2rem 0;border-bottom:1px solid transparent;
}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--ink);}
.nav-links a[aria-current="page"],.nav-links a.on{
  color:var(--ink);border-bottom-color:var(--ink);
}

.nav-toggle{
  display:none;background:none;border:none;cursor:pointer;
  font-family:var(--body);font-size:.74rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink-soft);padding:.2rem 0;
}
@media (max-width:900px){
  .nav-toggle{display:block;}
  .nav-links{display:none;width:100%;flex-direction:column;gap:0;padding-bottom:.3rem;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:.75rem 0;border-bottom:var(--rule-g);}
  .nav-inner{flex-wrap:wrap;}
}

/* ==========================================================
   THE COVER
   One still photograph. A plain scrim for legibility. Nothing else.
   ========================================================== */
.hero{
  position:relative;
  min-height:94svh;
  display:grid;
  grid-template-rows:auto 1fr auto;
  padding:clamp(2.25rem,5vw,4rem) var(--gutter) clamp(1.5rem,3vw,2.25rem);
  overflow:hidden;isolation:isolate;
  color:#fff;
}
.hero-photo{
  position:absolute;inset:0;z-index:-2;
  background-color:#A7A49E;
  background-image:url('images/hero.jpg');
  background-size:cover;background-position:center 32%;
  filter:grayscale(100%) contrast(1.04) brightness(.88);
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,
    rgba(18,18,17,.46) 0%,
    rgba(18,18,17,.10) 32%,
    rgba(18,18,17,.10) 58%,
    rgba(18,18,17,.56) 100%);
}

.cover-top{text-align:center;}
.names{
  font-family:var(--display);font-weight:400;
  text-transform:uppercase;
  font-size:clamp(2.5rem,1rem + 8.2vw,7.8rem);
  line-height:.9;
  letter-spacing:-.022em;
  margin:0;
}
.names .amp{
  display:block;
  font-size:.185em;
  line-height:1;
  margin:clamp(.15rem,.5vw,.4rem) 0;
  font-style:italic;
  font-weight:300;
  text-transform:none;
  letter-spacing:0;
  color:rgba(255,255,255,.92);
}
.cover-rule{
  display:flex;align-items:center;gap:1.1rem;
  margin-top:clamp(1.1rem,2.2vw,1.7rem);
}
.cover-rule::before,.cover-rule::after{
  content:"";flex:1;height:1px;background:rgba(255,255,255,.42);
}
.cover-issue{
  font-size:clamp(.66rem,.6rem + .18vw,.76rem);
  letter-spacing:.2em;white-space:nowrap;
}

.cover-lines{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
  gap:clamp(1.1rem,2.6vw,2.25rem);
  padding-top:clamp(1.1rem,2.2vw,1.6rem);
  border-top:1px solid rgba(255,255,255,.38);
}
.cover-line .label{
  display:block;font-size:.7rem;
  color:rgba(255,255,255,.74);margin-bottom:.45rem;
}
.cover-line .value{
  display:block;font-family:var(--display);font-weight:500;
  font-size:clamp(1.08rem,1rem + .45vw,1.4rem);
  line-height:1.16;
}
.cover-line .value small{
  display:block;font-family:var(--body);font-size:.85rem;
  line-height:1.45;color:rgba(255,255,255,.82);margin-top:.3rem;
  letter-spacing:normal;text-transform:none;
}
.cover-scroll{
  grid-column:1/-1;text-align:center;
  font-family:var(--body);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.7);
  margin:clamp(.9rem,2vw,1.5rem) 0 0;
}

/* ==========================================================
   PAGE OPENERS
   ========================================================== */
.pagehead{
  padding:clamp(2.75rem,6vw,5rem) var(--gutter) clamp(1.75rem,3.5vw,2.75rem);
  border-bottom:var(--rule-f);
  max-width:82rem;margin:0 auto;
}
.pagehead .kicker{
  font-size:.76rem;color:var(--ink-soft);
  margin:0 0 clamp(1.1rem,2.4vw,1.9rem);
}
.pagehead h1{
  font-family:var(--display);font-weight:400;
  text-transform:uppercase;
  font-size:clamp(2.2rem,1.2rem + 4.3vw,4.7rem);
  line-height:.98;margin:0;letter-spacing:-.02em;
}
.pagehead .note{
  max-width:34em;margin:clamp(1.35rem,2.6vw,2rem) 0 0;
  font-size:clamp(1.05rem,1rem + .3vw,1.2rem);
  line-height:1.52;color:var(--ink-soft);
}

/* ==========================================================
   LAYOUT
   ========================================================== */
section{padding:clamp(2.75rem,5.5vw,5rem) var(--gutter);}
.wrap{max-width:82rem;margin:0 auto;}
.wrap-narrow{max-width:41rem;margin:0 auto;}
.band{background:var(--paper-deep);}
.divider{height:1px;background:rgba(26,26,25,.17);max-width:82rem;margin:0 auto;}

.spread{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(1.75rem,4vw,4.25rem);
  align-items:start;
}
.spread.flip{grid-template-columns:minmax(0,7fr) minmax(0,5fr);}
.spread .sticky{position:sticky;top:5.5rem;}
@media (max-width:820px){
  .spread,.spread.flip{grid-template-columns:1fr;}
  .spread .sticky{position:static;}
}

.columns{
  column-count:2;
  column-gap:clamp(1.75rem,3.5vw,2.75rem);
}
.columns p{margin:0 0 1.05rem;}
.columns p:last-child{margin-bottom:0;}
@media (max-width:720px){.columns{column-count:1;}}

/* ==========================================================
   CARDS
   Rules above and below. No boxes, no numbering.
   ========================================================== */
.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(225px,1fr));
  gap:0 clamp(1.75rem,3.5vw,3rem);
  margin-top:clamp(1.75rem,3.5vw,2.75rem);
  border-top:var(--rule-f);
}
.card{
  padding:clamp(1.5rem,2.4vw,2rem) 0 clamp(1.75rem,2.8vw,2.25rem);
  border-bottom:var(--rule-g);
}
.card h3{
  font-family:var(--display);font-weight:500;
  font-size:clamp(1.28rem,1.15rem + .5vw,1.55rem);
  line-height:1.12;letter-spacing:normal;text-transform:none;
  margin:0 0 .85rem;
}
.card p{margin:0 0 .75rem;font-size:1rem;line-height:1.55;}
.card p:last-child{margin-bottom:0;}
.card address{
  font-style:normal;color:var(--ink-soft);
  font-size:.97rem;line-height:1.55;margin-bottom:.75rem;display:block;
}

/* ==========================================================
   CEREMONY PANELS
   ========================================================== */
.panels{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));
  gap:0 clamp(1.75rem,3.5vw,3rem);
  margin-top:clamp(1.75rem,3.5vw,2.75rem);
  border-top:var(--rule-f);border-bottom:var(--rule-f);
}
.panel{padding:clamp(1.75rem,3vw,2.5rem) 0;}
.panel .tradition{
  font-size:.74rem;color:var(--ink-soft);
  margin:0 0 1rem;
}
.panel .native{
  font-size:.95rem;font-style:italic;color:var(--ink-soft);
  margin:.2rem 0 1.2rem;
}
.panel p{margin:0 0 .95rem;font-size:1rem;line-height:1.55;}
.panel p:last-child{margin-bottom:0;}

/* ==========================================================
   SCHEDULE
   ========================================================== */
.day{
  display:grid;grid-template-columns:minmax(9rem,15rem) 1fr;
  gap:clamp(1.25rem,3.5vw,3.5rem);
  padding:clamp(1.75rem,3.2vw,2.75rem) 0;border-top:var(--rule-f);
}
.day:last-of-type{border-bottom:var(--rule-f);}
.day-label h2{
  font-family:var(--display);font-weight:400;
  text-transform:uppercase;letter-spacing:-.012em;
  font-size:clamp(1.7rem,1.35rem + 1.6vw,2.6rem);
  line-height:1;margin:0 0 .5rem;
}
.day-label .date{font-size:.74rem;color:var(--ink-soft);line-height:1.7;}
.events{list-style:none;margin:0;padding:0;}
.events li{
  display:grid;grid-template-columns:minmax(7rem,9rem) 1fr;
  gap:clamp(1rem,2vw,2rem);padding:.85rem 0;
}
.events li + li{border-top:var(--rule-g);}
.events time{
  font-size:.74rem;color:var(--ink-soft);padding-top:.3rem;line-height:1.6;
}
.events .what{font-size:1.06rem;line-height:1.42;}
.events .what address{
  display:block;font-family:var(--body);font-style:normal;
  font-size:.95rem;color:var(--ink-soft);line-height:1.5;margin-top:.22rem;
}
.events .what a{
  font-family:var(--body);font-size:.74rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink);text-decoration:none;
  border-bottom:1px solid rgba(26,26,25,.35);
  display:inline-block;margin-top:.55rem;
}

/* ==========================================================
   TIMELINE
   ========================================================== */
.timeline{list-style:none;margin:clamp(1.75rem,3.5vw,2.5rem) 0 0;padding:0;}
.timeline li{
  display:grid;grid-template-columns:minmax(7rem,10rem) 1fr;
  gap:clamp(1.25rem,3vw,2.75rem);
  padding:clamp(1.4rem,2.6vw,2.1rem) 0;border-top:var(--rule-g);
}
.timeline li:first-child{border-top:var(--rule-f);}
.timeline li:last-child{border-bottom:var(--rule-f);}
.timeline .when{
  font-size:.74rem;color:var(--ink-soft);padding-top:.4rem;line-height:1.7;
}
.timeline h3{
  font-family:var(--display);font-weight:500;
  font-size:clamp(1.4rem,1.2rem + .8vw,1.8rem);
  line-height:1.12;margin:0 0 .5rem;
}
.timeline p{margin:0;font-size:1.03rem;line-height:1.55;}

/* ==========================================================
   PEOPLE & PHOTOGRAPHS
   Consistently toned. Nothing changes when touched.
   ========================================================== */
.people{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));
  gap:clamp(1.5rem,3vw,2.5rem);margin-top:clamp(1.75rem,3.5vw,2.5rem);
}
.person .portrait{
  aspect-ratio:3/4;background:var(--pearl) center/cover no-repeat;
  filter:grayscale(100%);margin-bottom:.9rem;
}
.person h3{
  font-family:var(--display);font-weight:500;
  font-size:1.38rem;line-height:1.12;margin:0 0 .25rem;
}
.person .role{font-size:.72rem;color:var(--ink-soft);margin:0 0 .6rem;}
.person p{margin:0;font-size:.95rem;color:var(--ink-soft);line-height:1.5;}

.gallery{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:.6rem;margin-top:clamp(1.75rem,3.5vw,2.5rem);
}
.gallery .shot{
  aspect-ratio:4/5;background:var(--pearl) center/cover no-repeat;
  filter:grayscale(100%);
}
.gallery .shot.wide{grid-column:span 2;aspect-ratio:8/5;}
@media (max-width:520px){.gallery .shot.wide{grid-column:span 1;aspect-ratio:4/5;}}

/* ==========================================================
   QUESTIONS
   ========================================================== */
.faq{margin-top:clamp(1.4rem,2.8vw,2.25rem);}
.faq details{border-bottom:var(--rule-g);}
.faq details:first-child{border-top:var(--rule-f);}
.faq summary{
  cursor:pointer;list-style:none;position:relative;
  padding:1.3rem 2.5rem 1.3rem 0;
  font-family:var(--display);font-weight:500;
  font-size:clamp(1.2rem,1.08rem + .45vw,1.45rem);
  line-height:1.26;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"";position:absolute;right:.5rem;top:50%;
  width:8px;height:8px;
  border-right:1px solid var(--ink-soft);border-bottom:1px solid var(--ink-soft);
  transform:translateY(-70%) rotate(45deg);
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg);}
.faq .answer{padding:0 2.5rem 1.6rem 0;color:var(--ink-soft);font-size:1.01rem;line-height:1.58;}
.faq .answer p{margin:0 0 .8rem;}
.faq .answer p:last-child{margin-bottom:0;}

/* ==========================================================
   FORMS
   ========================================================== */
.form{margin-top:clamp(1.75rem,3.5vw,2.5rem);text-align:left;}
.field{margin-bottom:1.6rem;}
.field label,.legend{
  display:block;font-size:.74rem;color:var(--ink-soft);margin-bottom:.6rem;
}
.field input[type=text],
.field input[type=email],
.field input[type=tel],
.field textarea{
  width:100%;padding:.85rem .1rem;
  font-family:var(--body);font-size:1.06rem;color:var(--ink);
  background:transparent;border:none;border-radius:0;
  border-bottom:var(--rule-f);
}
.field input:focus,.field textarea:focus{outline:none;border-bottom:var(--rule);}
.field textarea{resize:vertical;min-height:5.5rem;}
.field .hint{
  display:block;font-family:var(--body);font-size:.85rem;
  letter-spacing:normal;text-transform:none;
  color:var(--ink-faint);margin:.5rem 0 0;
}

.btn{
  display:inline-block;padding:.95rem 2.75rem;
  font-size:.74rem;color:var(--paper);background:var(--ink);
  border:1px solid var(--ink);border-radius:0;cursor:pointer;text-decoration:none;
}
.btn:hover,.btn:focus-visible{background:transparent;color:var(--ink);}
.btn-light{color:#fff;background:transparent;border-color:rgba(255,255,255,.7);}
.btn-light:hover,.btn-light:focus-visible{background:#fff;color:var(--ink);border-color:#fff;}

/* ==========================================================
   PASSWORD
   ========================================================== */
html.locked body > *:not(.gate){visibility:hidden;}
html.locked{overflow:hidden;}
.gate{
  position:fixed;inset:0;z-index:999;display:grid;place-items:center;
  padding:2rem var(--gutter);background:var(--paper);overflow:auto;
}
.gate-inner{width:100%;max-width:25rem;text-align:center;}
.gate-eyebrow{
  font-family:var(--display);font-weight:400;
  text-transform:uppercase;
  font-size:clamp(1.6rem,1.25rem + 1.6vw,2.3rem);
  line-height:1.04;letter-spacing:-.018em;margin:0 0 1rem;
}
.gate-date{
  font-size:.7rem;color:var(--ink-soft);
  margin:0 0 2.25rem;padding-bottom:1.75rem;border-bottom:var(--rule-g);
}
.gate-note{font-size:1.06rem;margin:0 0 1.75rem;}
.gate-row{margin-bottom:.5rem;}
.gate-label{
  display:block;font-size:.72rem;color:var(--ink-soft);margin-bottom:.7rem;
}
.gate input{
  width:100%;padding:.85rem .1rem;text-align:center;
  font-family:var(--body);font-size:1.15rem;letter-spacing:.1em;
  color:var(--ink);background:transparent;border:none;border-radius:0;
  border-bottom:var(--rule-f);
}
.gate input:focus{outline:none;border-bottom:var(--rule);}
.gate-error{
  min-height:1.5rem;margin:.75rem 0 1.5rem;
  font-family:var(--body);font-size:.88rem;color:var(--ink-faint);
}

/* ==========================================================
   FOOTER
   ========================================================== */
.footer{
  padding:clamp(2.5rem,5vw,4.25rem) var(--gutter);
  text-align:center;border-top:var(--rule-f);
}
.footer .mark{
  font-family:var(--display);font-weight:500;
  text-transform:uppercase;
  font-size:clamp(1.4rem,1.25rem + .85vw,1.9rem);
  line-height:1;margin:0 0 .85rem;letter-spacing:.12em;
}
.footer .sig{
  font-size:.7rem;color:var(--ink-soft);
  margin:0 0 1.5rem;padding-bottom:1.5rem;border-bottom:var(--rule-g);
}
.footer .footer-links{
  display:flex;justify-content:center;gap:clamp(.9rem,2.4vw,1.9rem);
  flex-wrap:wrap;font-size:.72rem;
}
.footer .footer-links a{color:var(--ink-soft);text-decoration:none;}
.footer .footer-links a:hover{color:var(--ink);}

/* ==========================================================
   No scroll animation. Content is present when the page is.
   ========================================================== */
.reveal{opacity:1;transform:none;}

@media (max-width:640px){
  .day{grid-template-columns:1fr;gap:1rem;}
  .events li{grid-template-columns:1fr;gap:.2rem;}
  .events time{padding-top:0;}
  .timeline li{grid-template-columns:1fr;gap:.45rem;}
  .timeline .when{padding-top:0;}
  .dropcap::first-letter{font-size:3em;}
}


/* ==========================================================
   ADDITIONS — countdown, form states, select, mobile hero
   ========================================================== */
.cover-count{
  margin:.9rem 0 0;
  font-family:var(--body);font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.85);
  font-variant-numeric:tabular-nums;
  min-height:1em;
}
.field select{
  width:100%;padding:.85rem .1rem;
  font-family:var(--body);font-size:1.06rem;color:var(--ink);
  background:transparent;border:none;border-radius:0;
  border-bottom:var(--rule-f);
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%231a1a19' stroke-width='1.2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .2rem center;
}
.field select:focus{outline:none;border-bottom:var(--rule);}
.field select:invalid{color:var(--ink-soft);}
.field .opt{color:var(--ink-soft);font-weight:normal;}
.field-check label{
  display:flex;gap:.65rem;align-items:baseline;
  font-size:.95rem;letter-spacing:normal;text-transform:none;
}
.field-check input{accent-color:var(--ink);}
.botcheck{display:none !important;}
.form-status{
  margin:.9rem 0 0;font-size:.9rem;color:var(--ink-soft);
  min-height:1.3em;letter-spacing:normal;text-transform:none;
}
.form-status.is-error{color:#8a3b2e;}
.form.is-sending .btn{opacity:.55;pointer-events:none;}
@media (max-width:640px){
  .hero-photo{
    background-image:url('images/hero-mobile.jpg');
    background-position:center;
  }
}


/* ==========================================================
   ENTRY — ribbon and seal, shown once on first visit
   ========================================================== */
.entry{position:fixed;inset:0;z-index:999;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.entry-panel{position:absolute;top:0;bottom:0;width:50.5%;background:#F4F5F0;transition:transform .95s cubic-bezier(.77,0,.18,1);}
.entry-left{left:0;box-shadow:inset -1px 0 0 rgba(26,26,25,.05);}
.entry-right{right:0;box-shadow:inset 1px 0 0 rgba(26,26,25,.07);}
.entry-ribbon-h{position:absolute;left:0;right:0;top:50%;height:9px;margin-top:-4.5px;background:var(--ink);transition:transform .5s ease .12s;}
.entry-ribbon-v{position:absolute;top:0;bottom:0;left:50%;width:9px;margin-left:-4.5px;background:var(--ink);transition:transform .5s ease .12s;}
.entry-seal{position:absolute;left:50%;top:50%;width:122px;height:122px;margin:-61px 0 0 -61px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center;transition:transform .75s cubic-bezier(.55,0,.8,.45),opacity .75s ease;}
.entry-seal::after{content:"";position:absolute;inset:5px;border:1px solid #FFFFFF;border-radius:50%;}
.entry-seal img{width:62%;display:block;}
.entry-hint{position:absolute;left:50%;top:calc(50% + 96px);transform:translateX(-50%);margin:0;padding:.65rem 1.2rem;background:var(--ink);color:#FFFFFF;outline:1px solid #FFFFFF;outline-offset:-5px;font-family:var(--body);font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;white-space:nowrap;}
.entry.is-open .entry-seal{transform:translateY(48vh) rotate(-12deg);opacity:0;}
.entry.is-open .entry-ribbon-h{transform:scaleX(0);}
.entry.is-open .entry-ribbon-v{transform:scaleY(0);}
.entry.is-open .entry-left{transform:translateX(-102%);transition-delay:.5s;}
.entry.is-open .entry-right{transform:translateX(102%);transition-delay:.5s;}
.entry-std{position:absolute;left:0;right:0;top:12%;text-align:center;}
.entry-std-title{display:inline-block;margin:0;padding:.14em .5em .16em;background:#F4F5F0;font-family:var(--display);font-weight:400;font-size:clamp(2.7rem,1.8rem + 4.5vw,5rem);letter-spacing:.05em;text-transform:uppercase;color:var(--ink);line-height:1.05;}
.entry.is-open .entry-hint,.entry.is-open .entry-std{opacity:0;transition:opacity .3s;}
.entry.is-open{cursor:default;pointer-events:none;}

.mark-img{height:34px;width:auto;display:block;}
.footer .mark-img-lg{height:48px;margin:0 auto;}
.footer .mark{line-height:0;}

.photo-band{
  margin-bottom:clamp(1.5rem,3vw,2.25rem);
  background:var(--pearl) center/cover no-repeat;
  filter:grayscale(100%);
}