:root {
  --paper:#f8f2e5;
  --ink:#562432;
  --wine:#762b38;
  --red:#a73735;
  --yellow:#f5c547;
  --aqua:#a7c9c0;
  --text:#3d3336;
  --line:#d9cbbb;
  --display:'Barlow Condensed',Impact,sans-serif;
  --body:'DM Sans',Arial,sans-serif;
  --serif:'Playfair Display',Georgia,serif
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:105px
}

body {
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:var(--body);
  font-size:16px;
  line-height:1.65
}

button,input,textarea,select {
  font:inherit
}

button,a {
  -webkit-tap-highlight-color:transparent
}

button {
  cursor:pointer
}

a {
  color:inherit;
  text-decoration:none
}

button {
  color:inherit
}

img {
  display:block;
  max-width:100%
}

button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.gallery:focus-visible {
  outline:3px solid #227369;
  outline-offset:5px
}

button:disabled {
  opacity:.4;
  cursor:default
}

::selection {
  background:var(--yellow);
  color:var(--ink)
}

.wrap {
  width:min(1200px,calc(100% - 100px));
  margin-inline:auto
}

.section {
  padding-top:105px;
  padding-bottom:105px
}

.skip-link {
  position:fixed;
  top:-80px;
  left:20px;
  z-index:100;
  padding:12px 20px;
  background:var(--yellow)
}

.skip-link:focus {
  top:10px
}

.topline {
  padding:7px 50px;
  background:var(--wine);
  color:var(--paper);
  display:flex;
  justify-content:space-between;
  font-size:10px;
  letter-spacing:1.9px;
  font-weight:600
}

.topline b {
  margin-left:15px;
  color:var(--yellow)
}

.header {
  height:94px;
  padding:0 50px;
  background:var(--paper);
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:30;
  transition:box-shadow .2s
}

.header.scrolled {
  box-shadow:0 4px 18px #5624320a
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--wine)
}

.brand img {
  height:54px;
  width:54px;
  border-radius:50%;
  object-fit:contain
}

.brand>span {
  font-family:var(--serif);
  font-style:italic;
  font-size:30px;
  letter-spacing:-1.4px;
  line-height:1.1;
  font-weight:700
}

.brand small {
  display:block;
  font:600 8px var(--body);
  letter-spacing:1.6px;
  margin-top:6px
}

.header nav {
  display:flex;
  align-items:center;
  gap:28px;
  font-size:13px;
  font-weight:600
}

.header nav>a:not(.nav-cta) {
  position:relative
}

.header nav>a:not(.nav-cta)::after {
  content:'';
  position:absolute;
  bottom:-5px;
  height:2px;
  background:var(--wine);
  left:0;
  right:100%;
  transition:right .2s
}

.header nav>a:hover::after {
  right:0
}

.nav-cta {
  border:1px solid var(--wine);
  border-radius:3px;
  padding:10px 18px;
  color:var(--wine)
}

.nav-cta span {
  margin-left:18px
}

.nav-cta:hover {
  background:var(--wine);
  color:var(--paper)
}

.menu-toggle {
  display:none
}

.hero {
  display:grid;
  grid-template-columns:1.07fr 1fr;
  gap:45px;
  position:relative;
  padding-top:42px;
  padding-bottom:62px;
  align-items:center
}

.eyebrow {
  font-size:10px;
  letter-spacing:2px;
  font-weight:700;
  line-height:1.5;
  color:var(--wine);
  margin:0 0 22px
}

.hero .eyebrow {
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 20px
}

.line {
  width:24px;
  height:2px;
  background:var(--red)
}

h1,h2,h3,p {
  margin-top:0
}

h1 {
  font-family:var(--display);
  font-weight:800;
  color:var(--wine);
  font-size:clamp(78px,7.7vw,113px);
  line-height:.85;
  letter-spacing:-1.5px;
  margin:0 0 22px
}

h1>span:not(.period) {
  color:var(--red)
}

.period {
  color:var(--wine)
}

.hero-description {
  font-size:18px;
  line-height:1.4;
  font-weight:500;
  color:var(--ink);
  margin-bottom:9px
}

.hero-sub {
  font-size:13px;
  line-height:1.75;
  margin-bottom:24px;
  max-width:400px
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  padding:14px 20px;
  border:0;
  border-radius:3px;
  font-size:12px;
  font-weight:700;
  transition:transform .2s,background .2s
}

.button:hover {
  transform:translateY(-3px)
}

.primary {
  background:var(--wine);
  color:var(--paper)
}

.primary:hover {
  background:var(--red)
}

.text-button {
  border:0;
  background:none;
  padding:4px 0;
  font-size:12px;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:8px
}

.play-icon {
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid var(--ink);
  border-radius:50%;
  font-size:9px;
  padding-left:2px
}

.hero-visual {
  position:relative;
  margin:12px 0 20px;
  padding:0 0 17px 0;
  align-self:stretch;
  min-height:510px;
  display:flex;
  align-items:stretch
}

.hero-arch {
  width:100%;
  overflow:hidden;
  border-radius:250px 250px 5px 5px;
  position:relative;
  background:var(--wine);
  border:7px solid var(--yellow);
  box-shadow:14px 15px 0 #e9ddc9;
  min-height:510px
}

.hero-arch>img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 55%;
  position:absolute
}

.hero-arch::after {
  content:'';
  position:absolute;
  inset:65% 0 0;
  background:linear-gradient(transparent,#250b25b3)
}

.photo-caption {
  position:absolute;
  bottom:18px;
  left:20px;
  right:20px;
  z-index:1;
  display:flex;
  justify-content:space-between;
  gap:12px;
  color:white;
  font-size:8px;
  letter-spacing:1px;
  font-weight:600
}

.hero-star {
  position:absolute;
  width:92px;
  height:92px;
  top:10px;
  right:-34px;
  color:var(--aqua);
  transform:rotate(9deg);
  filter:drop-shadow(0 2px 0 #56243220);
  animation:star-turn 18s linear infinite
}

.hero-stamp {
  position:absolute;
  width:124px;
  height:124px;
  left:-39px;
  bottom:58px;
  border-radius:50%;
  background:var(--yellow);
  color:var(--wine);
  transform:rotate(-12deg);
  border:1px dashed var(--wine);
  outline:6px solid var(--yellow);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:0 5px 14px #0002
}

.hero-stamp>span {
  font:italic 700 28px/1.05 var(--serif)
}

.hero-stamp small {
  font-size:6px;
  letter-spacing:1px;
  margin-top:10px;
  font-weight:700
}

.hero-note {
  position:absolute;
  bottom:-20px;
  right:0;
  font:italic 16px var(--serif);
  color:var(--wine)
}

.scroll-note {
  position:absolute;
  bottom:15px;
  left:0;
  font-size:8px;
  letter-spacing:1.4px;
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:600
}

.scroll-note span {
  font-size:20px
}

.marquee {
  background:var(--aqua);
  color:var(--ink);
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  overflow:hidden;
  transform:rotate(-1.2deg);
  margin:12px 0 0;
  padding:15px 0
}

.marquee>div {
  display:flex;
  width:max-content;
  align-items:center;
  gap:36px;
  animation:marquee 40s linear infinite
}

.marquee span {
  font:700 28px var(--display);
  letter-spacing:.5px
}

.marquee b {
  font-size:25px;
  color:var(--wine)
}

.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:25px;
  margin-bottom:44px
}

.section-heading .eyebrow {
  margin-bottom:15px
}

h2 {
  font:700 clamp(40px,4.4vw,60px)/.96 var(--display);
  letter-spacing:-.5px;
  color:var(--wine);
  margin-bottom:0
}

h2 em {
  font-family:var(--serif);
  font-size:.76em;
  font-weight:600;
  display:inline-block;
  line-height:1.3;
  text-transform:none;
  letter-spacing:-1.7px
}

h3 {
  font:700 32px/1.1 var(--display);
  color:var(--wine);
  margin:15px 0
}

.section-heading>p {
  font-size:13px;
  margin:0;
  line-height:1.8
}

.show-grid {
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:34px
}

.show-card {
  border-bottom:1px solid var(--line)
}

.show-image {
  position:relative;
  height:350px;
  overflow:hidden;
  background:var(--ink);
  border-radius:4px
}

.show-image>img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s
}

.events-card .show-image>img {
  object-position:center 37%
}

.show-card:hover .show-image>img {
  transform:scale(1.035)
}

.image-tag {
  position:absolute;
  left:18px;
  top:18px;
  background:var(--paper);
  color:var(--wine);
  font-size:8px;
  letter-spacing:1.3px;
  font-weight:700;
  padding:8px 11px;
  border-radius:2px
}

.round-button {
  position:absolute;
  bottom:20px;
  right:20px;
  width:52px;
  height:52px;
  border:0;
  border-radius:50%;
  background:var(--yellow);
  color:var(--wine);
  padding-left:5px
}

.show-copy {
  padding:23px 0 27px
}

.show-label {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:8px;
  letter-spacing:1.1px;
  font-weight:600;
  color:#736367;
  gap:10px
}

.show-copy>p {
  font-size:13px;
  max-width:440px;
  line-height:1.8;
  margin-bottom:20px
}

.text-link {
  font-size:12px;
  font-weight:700;
  padding:0 0 5px;
  border:0;
  border-bottom:1px solid currentColor;
  background:none;
  color:var(--wine);
  display:inline-flex;
  align-items:center;
  gap:26px;
  text-align:left
}

.text-link:hover {
  color:var(--red)
}

.text-link span {
  font-size:19px;
  font-weight:400
}

.about {
  background:#ede7d8
}

.about-grid {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:95px;
  align-items:center
}

.about-photo {
  position:relative;
  margin:15px 0 25px;
  transform:rotate(-3deg);
  background:var(--paper);
  padding:12px 12px 45px;
  box-shadow:0 10px 30px #56243212
}

.about-photo img {
  width:100%;
  aspect-ratio:1.15;
  object-fit:cover
}

.photo-tape {
  width:110px;
  height:34px;
  background:#a7c9c0a8;
  position:absolute;
  top:-13px;
  left:40%;
  transform:rotate(5deg)
}

.handwritten {
  position:absolute;
  bottom:-40px;
  right:-40px;
  color:var(--wine);
  font:italic 25px/1.2 var(--serif);
  transform:rotate(4deg);
  background:var(--yellow);
  padding:15px 22px
}

.about-copy .eyebrow {
  margin-bottom:15px
}

.about-copy h2 {
  margin-bottom:25px
}

.about-copy p:not(.eyebrow):not(.large-copy) {
  font-size:13px;
  line-height:1.9
}

.about-copy .large-copy {
  font-size:20px;
  line-height:1.5;
  color:var(--wine);
  margin-bottom:20px
}

.about-copy .text-link {
  margin-top:10px
}

.gallery-controls {
  display:flex;
  gap:10px
}

.circle-outline {
  border:1px solid var(--wine);
  width:40px;
  height:40px;
  border-radius:50%;
  background:transparent
}

.circle-outline:hover {
  background:var(--wine);
  color:var(--paper)
}

.gallery {
  display:flex;
  gap:20px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  padding:0 2px 10px;
  scroll-behavior:smooth
}

.gallery::-webkit-scrollbar {
  display:none
}

.gallery-item {
  padding:0;
  border:0;
  background:transparent;
  text-align:left;
  flex:0 0 49%;
  scroll-snap-align:start;
  min-width:0
}

.gallery-item.portrait {
  flex-basis:28%
}

.gallery-item img {
  width:100%;
  height:340px;
  object-fit:cover;
  border-radius:3px
}

.gallery-item span {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:8px;
  letter-spacing:1.2px;
  padding:12px 0;
  font-weight:700
}

.gallery-item b {
  font-size:18px
}

.gallery-help {
  font-size:11px;
  margin:15px 0 0;
  color:#7d6b6d
}

.festivals {
  background:var(--wine);
  color:var(--paper)
}

.festivals h2,.festivals .eyebrow {
  color:var(--paper)
}

.festivals .section-heading>p {
  color:#e1cbd0
}

.festival-layout {
  display:grid;
  grid-template-columns:.9fr 1.3fr;
  gap:65px;
  align-items:start
}

.tour-poster {
  background:var(--yellow);
  padding:28px 35px;
  color:var(--wine);
  transform:rotate(-2deg);
  border:1px solid var(--ink);
  box-shadow:7px 7px 0 #f8f2e522
}

.tour-year {
  font:700 70px/.9 var(--display);
  display:block;
  letter-spacing:-2px;
  border-bottom:1px solid var(--wine);
  padding-bottom:20px
}

.tour-title {
  font:800 68px/.85 var(--display);
  display:block;
  letter-spacing:-1px;
  padding:28px 0;
  position:relative
}

.tour-title>span {
  font-size:55px;
  position:absolute;
  right:0;
  bottom:8px
}

.tour-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-top:1px solid var(--wine);
  padding-top:20px;
  font-size:10px;
  letter-spacing:1px;
  line-height:1.8;
  font-weight:600
}

.tour-footer svg {
  width:60px;
  height:60px
}

.list-label {
  font-size:9px;
  letter-spacing:1.8px;
  color:#e5cbd0;
  margin:0 0 14px
}

.festival-row {
  display:grid;
  grid-template-columns:35px 1fr auto;
  align-items:center;
  gap:15px;
  border-top:1px solid #f8f2e52e;
  padding:15px 0
}

.festival-row>span:first-child {
  font:500 13px var(--display);
  color:#c69ca5
}

.festival-row h3 {
  font:600 15px var(--body);
  color:var(--paper);
  margin:0 0 2px
}

.festival-row p {
  font-size:11px;
  color:#d9bcc4;
  margin:0
}

.country {
  font-size:9px;
  letter-spacing:.8px;
  border:1px solid #d9bcc4;
  padding:3px 7px;
  border-radius:2px
}

.festivals .text-link {
  color:var(--paper);
  font-weight:500;
  margin-top:18px
}

.press {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:90px;
  align-items:center
}

.press h2 {
  margin-bottom:23px
}

.press p:not(.eyebrow) {
  font-size:13px;
  margin:0
}

.press-links>a {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:23px 0;
  border-top:1px solid var(--line);
  color:var(--wine);
  font-size:21px;
  font-family:var(--display);
  font-weight:600
}

.press-links>a>span:last-child {
  font-size:25px
}

.press-links small {
  display:block;
  font:600 8px var(--body);
  letter-spacing:1.5px;
  margin-bottom:7px;
  color:#8b7779
}

.press-links>a:hover {
  color:var(--red)
}

.dossier-languages {
  border-top:1px solid var(--line);
  padding-top:16px;
  display:flex;
  gap:18px;
  font-size:11px
}

.dossier-languages>span {
  color:#827275
}

.dossier-languages>a {
  color:var(--wine);
  text-decoration:underline;
  text-underline-offset:4px
}

.contact {
  background:var(--aqua);
  border-top:1px solid var(--ink)
}

.contact-grid {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:80px
}

.contact h2 {
  font-size:64px
}

.contact h2 em {
  font-size:45px
}

.contact-copy>p:not(.eyebrow) {
  font-size:13px;
  margin:25px 0
}

.contact-email {
  display:inline-flex;
  gap:25px;
  border-bottom:1px solid var(--wine);
  font-size:17px;
  color:var(--wine);
  padding-bottom:5px
}

.contact-phones {
  display:flex;
  gap:25px;
  flex-wrap:wrap;
  margin-top:24px
}

.contact-phones a {
  font-size:11px;
  color:var(--wine)
}

.contact-phones small {
  display:block;
  font-size:7px;
  letter-spacing:1.1px;
  font-weight:600;
  margin-bottom:5px
}

.inquiry {
  background:var(--paper);
  border:1px solid var(--ink);
  box-shadow:7px 7px 0 #56243215;
  padding:28px;
  border-radius:3px
}

.inquiry label {
  display:block;
  font-size:11px;
  font-weight:600;
  color:var(--wine);
  margin-bottom:15px
}

.inquiry input,.inquiry textarea,.inquiry select {
  display:block;
  width:100%;
  background:#fffaf0;
  border:1px solid #cfbfb0;
  border-radius:2px;
  padding:10px 11px;
  color:var(--text);
  font-size:12px;
  font-weight:400;
  margin-top:6px;
  min-height:41px
}

.inquiry textarea {
  resize:vertical
}

.inquiry input::placeholder,.inquiry textarea::placeholder {
  color:#8a7d7b
}

.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px
}

.yellow {
  background:var(--yellow);
  color:var(--ink);
  width:100%;
  border:1px solid var(--ink)
}

.yellow:hover {
  background:#fbd166
}

.form-note {
  font-size:10px;
  line-height:1.6;
  color:#7d6b6d;
  margin:12px 0 0
}

#formStatus {
  font-size:11px;
  margin-bottom:0
}

footer {
  background:var(--ink);
  color:var(--paper)
}

.footer-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:50px;
  padding-bottom:35px
}

.footer-brand {
  font:italic 600 48px var(--serif);
  letter-spacing:-2px
}

.footer-brand span {
  font:600 8px var(--body);
  letter-spacing:2px;
  display:block;
  margin-top:10px
}

.footer-top>p {
  font:italic 23px/1.4 var(--serif);
  margin:0
}

.back-top {
  font-size:10px;
  border-bottom:1px solid #fff6;
  padding-bottom:4px
}

.footer-bottom {
  padding:22px 0;
  border-top:1px solid #ffffff24;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:8px;
  color:#dac7cb
}

.footer-bottom b {
  color:var(--yellow);
  margin-left:8px
}

.floating-contact {
  position:fixed;
  bottom:24px;
  right:25px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 16px;
  background:var(--wine);
  color:var(--paper);
  box-shadow:0 2px 8px #0002;
  border:1px solid #f8f2e544;
  border-radius:30px;
  font-size:11px;
  z-index:20;
  transition:transform .2s
}

.floating-contact:hover {
  transform:translateY(-4px)
}

.floating-contact>span:first-child {
  font-size:17px
}

dialog {
  border:0;
  border-radius:6px;
  padding:0;
  width:min(760px,calc(100% - 32px));
  max-height:90vh;
  color:var(--text);
  background:var(--paper);
  box-shadow:0 20px 70px #0005
}

dialog::backdrop {
  background:#230a1cdc;
  backdrop-filter:blur(4px)
}

.dialog-close {
  position:sticky;
  top:15px;
  float:right;
  margin:15px 15px -60px 0;
  border:1px solid var(--ink);
  border-radius:50%;
  width:38px;
  height:38px;
  background:var(--paper);
  z-index:3;
  font-size:25px;
  line-height:1
}

.modal-content {
  padding:45px
}

.modal-content>img {
  width:100%;
  height:260px;
  object-fit:cover;
  border-radius:4px;
  margin-bottom:28px
}

.modal-content h2 {
  font-size:48px;
  margin-bottom:20px;
  max-width:95%
}

.modal-content p {
  font-size:14px
}

.technical {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 25px;
  margin:25px 0
}

.technical>div {
  border-top:1px solid var(--line);
  padding:12px 0;
  font-size:13px
}

.technical dt {
  font-size:9px;
  letter-spacing:1px;
  font-weight:600;
  color:var(--wine)
}

.technical dd {
  margin:5px 0 0
}

.modal-actions {
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap
}

.video-frame {
  width:100%;
  aspect-ratio:16/9;
  border:0;
  margin-top:60px;
  background:#000;
  display:block
}

.video-caption {
  padding:15px 22px;
  font-size:12px;
  margin:0
}

.lightbox-image {
  width:100%;
  max-height:74vh;
  object-fit:contain;
  background:#27101e;
  margin-top:55px
}

.lightbox-caption {
  padding:14px 22px;
  margin:0;
  font-size:12px
}

.reveal {
  opacity:1;
  transform:none
}

@keyframes marquee {
  to {
    transform:translateX(-50%)
  }
}

@keyframes star-turn {
  to {
    transform:rotate(369deg)
  }
}

@media(min-width:1450px) {
  .hero {
    padding-top:65px;
    padding-bottom:80px
  }
  .hero-arch {
    min-height:570px
  }
  .hero-visual {
    min-height:570px
  }
  .hero-note {
    bottom:-25px
  }
}

@media(max-width:1100px) {
  .wrap {
    width:calc(100% - 64px)
  }
  .header {
    padding:0 32px
  }
  .topline {
    padding-inline:32px
  }
  .header nav {
    gap:20px;
    font-size:12px
  }
  .hero {
    gap:28px
  }
  h1 {
    font-size:89px
  }
  .hero-actions {
    gap:15px
  }
  .hero-arch,.hero-visual {
    min-height:510px
  }
  .hero-star {
    right:-22px;
    width:70px
  }
  .hero-stamp {
    left:-25px;
    width:105px;
    height:105px
  }
  .hero-stamp>span {
    font-size:24px
  }
  .photo-caption {
    font-size:7px
  }
  .show-image {
    height:290px
  }
  .about-grid {
    gap:65px
  }
  .festival-layout {
    gap:45px
  }
  .tour-title {
    font-size:58px
  }
  .press {
    gap:45px
  }
  .contact-grid {
    gap:45px
  }
  .contact h2 {
    font-size:54px
  }
  .contact h2 em {
    font-size:39px
  }
}

@media(max-width:800px) {
  .topline {
    font-size:8px;
    letter-spacing:1px
  }
  .header {
    height:78px
  }
  .brand img {
    width:44px;
    height:44px
  }
  .brand>span {
    font-size:25px
  }
  .brand small {
    font-size:7px
  }
  .menu-toggle {
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    width:40px;
    height:40px;
    border:1px solid var(--line);
    background:none;
    border-radius:3px
  }
  .menu-toggle span {
    display:block;
    margin:0 auto;
    height:1px;
    background:var(--wine);
    width:18px
  }
  .header nav {
    display:none;
    position:absolute;
    top:78px;
    left:0;
    right:0;
    padding:20px 32px;
    background:var(--paper);
    box-shadow:0 12px 18px #0001;
    border-bottom:1px solid var(--line);
    align-items:stretch
  }
  .header nav.open {
    display:flex;
    flex-direction:column;
    gap:19px
  }
  .nav-cta {
    max-width:160px
  }
  .hero {
    gap:20px;
    padding-top:35px;
    padding-bottom:50px
  }
  h1 {
    font-size:74px
  }
  .hero .eyebrow {
    font-size:8px;
    letter-spacing:1.5px
  }
  .hero-sub {
    font-size:12px
  }
  .hero-description {
    font-size:16px
  }
  .hero-arch,.hero-visual {
    min-height:450px
  }
  .hero-note {
    font-size:13px
  }
  .hero-actions {
    flex-direction:column;
    align-items:flex-start
  }
  .hero-stamp {
    width:90px;
    height:90px;
    left:-15px;
    bottom:70px
  }
  .hero-stamp>span {
    font-size:21px
  }
  .hero-stamp small {
    font-size:5px
  }
  .photo-caption {
    flex-direction:column;
    gap:4px
  }
  .section {
    padding-top:75px;
    padding-bottom:75px
  }
  .section-heading>p {
    font-size:12px
  }
  .show-grid {
    gap:25px
  }
  .show-image {
    height:260px
  }
  .show-label {
    font-size:7px
  }
  .show-copy h3 {
    font-size:28px
  }
  .about-grid {
    gap:40px
  }
  .handwritten {
    font-size:19px;
    padding:12px;
    right:-10px
  }
  .about-copy .large-copy {
    font-size:17px
  }
  .gallery-item img {
    height:290px
  }
  .festival-layout {
    gap:30px;
    grid-template-columns:.8fr 1.2fr
  }
  .tour-poster {
    padding:25px
  }
  .tour-title {
    font-size:50px
  }
  .tour-year {
    font-size:60px
  }
  .tour-footer {
    font-size:8px
  }
  .tour-footer svg {
    width:40px
  }
  .festival-row {
    gap:8px;
    grid-template-columns:23px 1fr auto
  }
  .festival-row h3 {
    font-size:12px
  }
  .press {
    gap:30px
  }
  .contact-grid {
    gap:30px
  }
  .contact h2 {
    font-size:45px
  }
  .contact h2 em {
    font-size:33px
  }
  .inquiry {
    padding:20px
  }
  .form-row {
    gap:10px
  }
  .contact-email {
    font-size:14px;
    gap:14px
  }
  .footer-bottom {
    flex-wrap:wrap
  }
}

@media(max-width:600px) {
  html {
    scroll-padding-top:88px
  }
  .wrap {
    width:calc(100% - 40px)
  }
  .header {
    padding:0 20px
  }
  .topline {
    padding:7px 20px
  }
  .topline>span:last-child {
    display:none
  }
  .topline>span:first-child {
    margin:auto
  }
  .hero {
    grid-template-columns:1fr;
    padding-top:30px;
    gap:32px;
    padding-bottom:55px
  }
  .hero-copy {
    position:relative;
    z-index:2
  }
  h1 {
    font-size:clamp(76px,21vw,108px);
    letter-spacing:-1px;
    line-height:.84
  }
  .hero-description {
    font-size:17px;
    margin-top:23px
  }
  .hero-sub {
    font-size:12px;
    max-width:325px
  }
  .hero-actions {
    flex-direction:row;
    align-items:center;
    gap:18px
  }
  .hero-actions .button {
    font-size:11px;
    padding:13px 14px;
    gap:14px
  }
  .text-button {
    font-size:11px
  }
  .hero-visual {
    min-height:440px;
    margin:0 14px 32px 6px
  }
  .hero-arch {
    min-height:440px;
    border-width:6px;
    box-shadow:10px 12px 0 #e9ddc9;
    border-radius:220px 220px 3px 3px
  }
  .hero-arch>img {
    object-position:center 53%
  }
  .hero-star {
    width:75px;
    right:-24px;
    top:12px
  }
  .hero-stamp {
    left:-18px;
    bottom:55px;
    width:105px;
    height:105px
  }
  .hero-stamp>span {
    font-size:25px
  }
  .hero-stamp small {
    font-size:6px
  }
  .hero-note {
    font-size:14px;
    bottom:-22px
  }
  .photo-caption {
    left:18px;
    right:12px;
    font-size:7px;
    align-items:flex-end
  }
  .scroll-note {
    bottom:17px
  }
  .marquee {
    padding:12px 0;
    transform:rotate(-2deg)
  }
  .marquee>div {
    gap:25px
  }
  .marquee span {
    font-size:24px
  }
  .section {
    padding-top:65px;
    padding-bottom:65px
  }
  .section-heading {
    display:block;
    margin-bottom:30px
  }
  .section-heading>p {
    margin-top:20px
  }
  .eyebrow {
    font-size:9px
  }
  h2 {
    font-size:45px
  }
  .section-heading .eyebrow {
    margin-bottom:12px
  }
  h2 em {
    font-size:.78em;
    letter-spacing:-1px
  }
  .show-grid {
    grid-template-columns:1fr;
    gap:34px
  }
  .show-image {
    height:300px
  }
  .show-copy h3 {
    font-size:33px
  }
  .show-label {
    font-size:8px
  }
  .show-copy>p {
    font-size:13px
  }
  .show-copy {
    padding:19px 0 23px
  }
  .about-grid {
    grid-template-columns:1fr;
    gap:60px
  }
  .about-photo {
    width:calc(100% - 18px);
    margin-left:7px
  }
  .about-photo img {
    aspect-ratio:1.25
  }
  .handwritten {
    font-size:24px;
    right:-16px;
    bottom:-35px;
    padding:15px 20px
  }
  .about-copy .large-copy {
    font-size:20px
  }
  .about-copy h2 {
    margin-bottom:20px
  }
  .gallery-section .section-heading {
    display:flex;
    align-items:flex-end;
    gap:12px
  }
  .gallery-section h2 {
    font-size:35px
  }
  .gallery-controls {
    gap:6px
  }
  .circle-outline {
    width:33px;
    height:33px
  }
  .gallery-item {
    flex-basis:86%
  }
  .gallery-item.portrait {
    flex-basis:70%
  }
  .gallery-item img {
    height:280px
  }
  .gallery-item span {
    font-size:7px
  }
  .festival-layout {
    grid-template-columns:1fr;
    gap:45px
  }
  .tour-poster {
    width:calc(100% - 25px);
    padding:30px;
    margin:0 auto
  }
  .tour-title {
    font-size:67px
  }
  .tour-year {
    font-size:72px
  }
  .tour-footer {
    font-size:10px
  }
  .tour-footer svg {
    width:60px
  }
  .festival-row {
    grid-template-columns:27px 1fr auto;
    gap:12px;
    padding:16px 0
  }
  .festival-row h3 {
    font-size:13px
  }
  .press {
    grid-template-columns:1fr;
    gap:30px
  }
  .press-links>a {
    font-size:23px
  }
  .contact-grid {
    grid-template-columns:1fr;
    gap:35px
  }
  .contact h2 {
    font-size:53px
  }
  .contact h2 em {
    font-size:40px
  }
  .contact-copy>p:not(.eyebrow) {
    font-size:13px;
    margin:20px 0
  }
  .contact-email {
    font-size:17px
  }
  .contact-phones {
    gap:26px
  }
  .inquiry {
    padding:22px;
    box-shadow:5px 5px 0 #56243215
  }
  .inquiry input,.inquiry select,.inquiry textarea {
    font-size:16px;
    padding:9px
  }
  .form-row {
    grid-template-columns:1fr;
    gap:0
  }
  .inquiry label {
    font-size:11px
  }
  .footer-top {
    padding-top:35px;
    padding-bottom:30px;
    flex-wrap:wrap;
    gap:30px
  }
  .footer-brand {
    font-size:39px
  }
  .footer-top>p {
    font-size:18px
  }
  .back-top {
    width:100%;
    text-align:left;
    border-bottom:0
  }
  .footer-bottom {
    display:flex;
    flex-direction:column;
    gap:8px;
    font-size:9px;
    padding-bottom:65px
  }
  .floating-contact {
    right:15px;
    bottom:15px;
    font-size:10px;
    padding:8px 12px
  }
  .modal-content {
    padding:65px 22px 25px
  }
  .modal-content h2 {
    font-size:38px
  }
  .modal-content>img {
    height:210px
  }
  .technical {
    grid-template-columns:1fr
  }
  .desktop-break {
    display:none
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
  .gallery {
    scroll-behavior:auto
  }
}