/* Kapriizi roosa lavailm: hele fotoava, roosad pinnad ja mustad aktsendid.
   See viimane kujunduskiht säilitab olemasolevate juhtnuppude ja liikumise hook'id. */
:root {
  --paper: #fff8fb;
  --ink: #281522;
  --muted: #79596a;
  --line: #dfc3cf;
  --lilac: #ecd9f2;
  --pink: #ed76ab;
  --coral: #ed76ab;
  --purple: #784b8d;
  --white: #fff8fb;
  --night: #261421;
  --rose: #f4bed4;
  --rose-light: #fce8f0;
}
body { background: var(--paper); color: var(--ink); }
::selection { background: #ad3165; color: #fff; }
h2 { font-weight: 650; letter-spacing: -2.5px; }
.section-pad { padding: 100px 0; }
.section-heading-aside { color: var(--muted); }
.section-heading-aside .text-link { color: var(--ink); }
.section-number { color: #a72b61; }
.eyebrow { color: #815063; }
.text-link:hover { color: #a3285d; }
:focus-visible, .booking-form :focus-visible { outline-color: #873251; outline-offset: 5px; }
.button { border-radius: 100px; font-weight: 650; }
.button-coral { background: #291520; color: #fff7fb; box-shadow: none; }
.button-coral:hover { background: #60324d; color: #fff; box-shadow: 0 8px 25px #5c234b20; }
.button-dark { background: #281522; color: #fff7fb; border: 1px solid #281522; }
.button-dark:hover { background: #60324d; border-color: #60324d; }
.button-outline { color: #64374c; border-color: #9b6c82; }
.button-outline:hover { background: #f5dce8; }

/* The logo and the duo are the visual anchors of the opening frame. */
.site-header { height: 112px; border-bottom: 0; }
.brand-link { width: 146px; height: 98px; }
.site-header nav > a { color: var(--ink); font-size: 12px; font-weight: 600; }
.site-header nav .button { color: var(--ink); border: 1px solid #5d2b4155; background: #fff8fb70; }
.site-header nav .button:hover { background: #fff8fb; }
.nav-socials > a { color: var(--ink); border-color: #75405960; }
.nav-socials > a:hover { color: #97214e; background: #fff7fb; border-color: #97214e; }
.cinematic-hero {
  min-height: 875px;
  background: radial-gradient(ellipse at 82% 42%, #fff0f6 0%, #f7c7dc 40%, transparent 69%), #f4bed4;
}
.cinematic-hero .hero-inner { padding-top: 207px; min-height: 697px; padding-bottom: 74px; }
.hero-copy { max-width: 625px; }
.hero-copy .eyebrow { color: #724159; font-size: 10px; letter-spacing: 2.2px; }
.live-dot { background: #9f2d63; box-shadow: 0 0 0 5px #a7286110; }
.hero h1 { font-size: clamp(60px, 5.6vw, 81px); font-weight: 650; letter-spacing: -4px; line-height: 1.12; }
.hero-accent {
  color: #a52d63;
  font-family: Georgia, 'Times New Roman', serif;
  font-style: italic;
  font-weight: 400;
  font-size: 1.37em;
  line-height: 1.07;
  letter-spacing: -.075em;
  margin-left: -4px;
}
.hero-description { color: #623e51; margin-top: 28px; font-size: 15px; line-height: 1.95; }
.hero-description > span { color: #85566e; font-size: 12px; }
.hero-actions { margin-top: 29px; }
.hero-actions .button { padding-inline: 25px; }
.listen-link { color: #452435; font-weight: 600; }
.mini-play { border-color: #78465c80; background: #ffffff30; }
.hero-footnote { color: #85566e; margin-top: 30px; }
.wave-icon i { background: #a83469; }
.hero-scene { width: 56%; right: 1.8%; top: 155px; bottom: 108px; }
.hero-scene img { opacity: 1; filter: none; }
.hero-orbit {
  position: absolute;
  width: min(57vw, 770px);
  height: 580px;
  top: 175px;
  right: 2.4%;
  border-radius: 50%;
  z-index: -6;
  border: 1px solid #fff9;
  background: linear-gradient(135deg, #fbe4ef7a, #c971a044 80%);
  box-shadow: 0 0 0 26px #fff3, 0 0 0 27px #fff5;
  transform: rotate(-14deg);
  pointer-events: none;
}
.hero-vignette {
  background: linear-gradient(0deg, #f4bed4 0%, #f4bed496 8%, transparent 27%), linear-gradient(90deg, #f4bed4 0%, #f4bed4e0 22%, #f4bed430 45%, transparent 63%);
}
.hero-light { z-index: -7; background: radial-gradient(ellipse 40% 50% at var(--hero-mouse-x,65%) var(--hero-mouse-y,45%), #ffffff50, transparent 80%); }
.film-grain { opacity: .025; mix-blend-mode: multiply; }
.hero-photo-caption { right: 11%; bottom: 38px; padding: 10px 20px; border: 1px solid #fff9; border-radius: 100px; background: #fff7fb70; text-align: center; backdrop-filter: blur(10px); }
.hero-photo-caption > span { color: #673c53; letter-spacing: 2px; }
.hero-photo-caption > p { color: #3a1d2e; font-size: 15px; }
.hero-bottom { padding-bottom: 31px; }
.scroll-link { color: #76425d; letter-spacing: 1.8px; }
.scroll-link > span:last-child { color: #a32e64; }
.hero-socials { width: 610px; gap: 14px; }
.hero-social-card { border: 1px solid #fff9; border-radius: 100px; background: #fff4f980; padding: 18px 22px; box-shadow: 0 7px 28px #7a2f5310; }
.hero-social-card small { color: #845069; font-size: 7px; }
.hero-social-card strong { color: #3a1c2c; font-size: 12px; font-weight: 600; }
.hero-social-card > .icon, .hero-social-card .social-arrow { color: #a82d65; }
.hero-social-card:hover { background: #fff8fb; border-color: #fff; }
.kapriiz-ribbon { display: flex; align-items: center; justify-content: space-around; gap: 30px; padding: 22px 35px; background: #a32e63; color: #ffeaf3; font: 650 12px var(--heading); letter-spacing: 2px; overflow: hidden; white-space: nowrap; }
.ribbon-star { color: #fac1d9; font-size: 26px; line-height: 1; }

/* Light record sleeves make the music section feel different from a venue listing. */
.music { background: #fff8fb; }
.music .section-heading { align-items: center; }
.music h2 { font-size: clamp(48px, 4.6vw, 67px); line-height: 1.08; }
.filter-tabs button { border-color: #ddbdcd; color: #765269; border-radius: 100px; padding: 10px 19px; }
.filter-tabs button.is-active { background: #a32e63; color: #fff; border-color: #a32e63; }
.filter-tabs button:not(.is-active):hover { background: #fbe2ed; }
.song-search { border-color: #d2aabe; color: #a24c77; }
.song-search input { color: #432336; }
.song-search input::placeholder { color: #8b6579; }
.songs-grid { gap: 26px; }
.song-card { border-color: #ebd4df; background: #fff; border-radius: 18px; box-shadow: 0 7px 23px #75354f06; }
.song-image { border-radius: 0; }
.song-image img { filter: none; }
.song-play { background: #fff8fb; color: #a12860; border-radius: 50%; }
.song-body { padding: 19px 21px 23px; }
.song-meta { color: #925571; }
.song-title { color: #432237; font-weight: 650; }
.music-bottom p { color: #866175; }
.youtube-banner { background: #f6d5e4; color: #54293f; border: 0; border-radius: 22px; padding: 34px; }
.youtube-banner-icon { color: #fff; background: #a52d64; border-radius: 12px; }
.youtube-banner h3 { font-weight: 650; }
.youtube-banner p { color: #83526b; }
.banner-star { fill: #d880a945; }
.spotify-mark { background: #784b8d; color: #fff; }

/* A darker stage between the light sections retains the cinematic atmosphere. */
.mood-section { background: radial-gradient(ellipse at 90% 0%, #79365a50, transparent 65%), #291520; border: 0; color: #fff4f9; }
.mood-section .eyebrow, .mood-section .section-number { color: #ed9abc; }
.mood-section .section-heading-aside { color: #d6afc3; }
.mood-section .text-link { color: #f4c2d8; }
.mood-card > button, .mood-photo-link { border-radius: 100px 100px 18px 18px; }
.mood-card:nth-child(even) { padding-top: 35px; }
.mood-card img { filter: none; }
.mood-copy small { color: #f1c6dc; }
.mood-source { color: #d1a2bb; }
.social-follow { border-color: #d988aa38; }
.social-follow > p { color: #f2bad2; }
.social-follow > a { border: 1px solid #ed9bb960; border-radius: 100px; padding: 12px 19px; color: #f9d1e3; }
.social-follow > a:hover { color: #291520; background: #f4bed4; }

/* The calendar remains clearly marked as a private-safe demonstration. */
.calendar-section { background: #f9e4ee; border: 0; }
.calendar-section .section-number { color: #a32e63; }
#kalender { --event-private: #7c6975; --event-outdoor: #a32e63; --event-pub: #764291; --event-club: #b22c72; }
#kalender .event-filters button { background: #ffffff60; color: #78475f; border-color: #ce9eb5; }
#kalender .event-filters button:hover { background: #fff8fb; border-color: #a32e63; }
#kalender .event-filters button.is-active, #kalender .event-filters button[aria-pressed="true"] { background: #a32e63; color: #fff; border-color: #a32e63; }
#kalender .event-filters button[aria-pressed="true"] .event-filter-dot { color: #fff; border-color: #fff; }
#kalender .calendar-privacy-note { color: #84586f; }
.calendar-card { background: #fff9fc; color: #4d2a3d; border: 0; border-radius: 24px; box-shadow: 0 14px 50px #7739550b; padding: 35px; }
.calendar-card h3 { font-weight: 650; }
.calendar-controls button { color: #9d3b69; }
.calendar-controls button:hover { background: #f6d4e4; }
.weekdays { color: #967186; }
.calendar-grid button { color: #765467; border-radius: 10px; }
.calendar-grid button:hover { background: #f6d4e4; }
.calendar-grid button.is-today { color: #a32e63; border-color: #b8678c; }
#kalender .calendar-grid button.has-event { background: #f0d8e5; color: #854465; border-color: #e2abc4; }
#kalender .calendar-grid button.has-event.category-private { background: #eee5ea; color: #73626b; border-color: #cdbfc7; }
#kalender .calendar-grid button.has-event.category-club { background: #f8d0e4; color: #a62e66; border-color: #e79cbf; }
#kalender .calendar-grid button.is-selected, #kalender .calendar-grid button.has-event.is-selected { background: #a32e63; color: #fff; border-color: #a32e63; }
#kalender .calendar-grid button.has-event.is-selected:after { background: #fff; }
.calendar-hint, #kalender .calendar-demo-row { color: #8b5f77; }
#kalender #calendar-mode { color: #8d3d62; background: #f5deea; border-color: #d39ab5; border-radius: 100px; padding-inline: 10px; }
.calendar-side-heading, #kalender .event-card { border-color: #d6afc2; }
#kalender .status-pill { color: #86435f; background: #eed0de; border-color: #c789a7; border-radius: 100px; }
#kalender .event-date { color: #884269; background: #f1c8dc; border-radius: 12px; }
#kalender .event-description h4 { color: #4c263a; font-weight: 650; }
#kalender .event-description p { color: #8a5a72; }
#kalender .event-category { color: #8e3e65; background: #ffffff60; border-color: #c18ca7; border-radius: 100px; }
#kalender .event-card[data-category="private"] .event-category { color: #78616d; border-color: #bba7b2; }
#kalender .event-footer { color: #8c637a; background: #ffffff60; }
#kalender .event-select { color: #8e3e65; background: #fff8fb; border-color: #bd7d9d; border-radius: 100px; }
#kalender .event-select:hover { background: #f0c7db; }
.calendar-note, .availability-note { color: #81556e; }
.calendar-cta { color: #fff3f8; background: #a32e63; border: 0; border-radius: 16px; }
.calendar-cta span { color: #f4c4d9; }
.calendar-cta > .icon { color: #ffe3ef; }

.organizer { background: #fff9fc; }
.material-row { color: #4a2739; border-color: #e7cedb; }
.material-row h3 { font-weight: 650; }
.material-row p, .materials-note { color: #8e677b; }
.material-icon, .material-icon-logo { color: #a32e63; background: #f8dce9; border-radius: 12px; }
.material-icon-logo img { filter: brightness(.52) saturate(1.3); }
.materials-pack { background: #a32e63; color: #fff; }
.materials-pack:hover { background: #7f244d; }
.cutout-download { color: #925273; }
.poster-card { background: #f5d5e5; border: 0; border-radius: 90px 22px 22px 22px; padding-top: 45px; }
.poster-inner { background: #ee90b8; box-shadow: 7px 10px 0 #d7a4bc; border-radius: 3px; }
.poster-label { color: #8b4c6a; }
.photo-library { border-color: #e5c9d7; }
.photo-library-heading .eyebrow { color: #9f577b; }
.photo-library-heading h3 { font-weight: 650; }
.press-photo-card > button { border-radius: 18px; }
.press-photo-card img { filter: none; }
.press-photo-card h4 { color: #6b3a53; font-weight: 650; }
.press-photo-card a { color: #a32e63; border-color: #d9afc3; }
.press-photo-card a:hover { background: #f7d6e5; }

.contact { background: radial-gradient(ellipse at 0% 70%, #ffcde55c, transparent 64%), #ed9ec0; color: #442236; border: 0; }
.contact-copy h2 { color: #442236; font-size: 70px; font-weight: 650; line-height: 1.07; }
.contact-copy h2 span { font-family: Georgia, 'Times New Roman', serif; font-style: italic; font-weight: 400; color: #a32e63; }
.contact .section-number { color: #933055; }
.contact-intro { color: #76405c; }
.contact-details > a, .contact-details > a:first-child { border-color: #a8567945; }
.contact-details small { color: #85516a; }
.contact-details .icon { color: #963562; }
.contact-doodle { color: #a33465; }
.booking-form { background: #fff7fb; border: 0; border-radius: 24px; padding: 36px; box-shadow: 0 14px 50px #843c6514; }
.booking-form input:not([type=checkbox]), .booking-form select, .booking-form textarea { background: #fff; border-color: #e6cbd9; border-radius: 9px; }
.booking-form .button-coral { background: #a32e63; color: #fff; }
.booking-form .button-coral:hover { background: #7f244d; }
.form-star { color: #cb5b90; }
.faq-section { background: #fff8fb; }
.faq-list summary { color: #653b51; font-weight: 650; }
.faq-list summary > span { color: #a32e63; }
.faq-list details > p { color: #8a6377; }
.faq-list details { border-color: #e3c5d4; }
.site-footer { background: #291520; border: 0; }
.footer-top > p { color: #e4adc8; }
.footer-social { color: #f5c8de; }
.footer-social .icon { color: #e98ab7; }
.footer-bottom { color: #ca9db5; border-color: #d488ab35; }
.video-dialog, .material-dialog, .photo-dialog, .instagram-dialog { background: #291520; border-color: #8b4d6d; border-radius: 20px; }
.dialog-close { border-radius: 50%; background: #66324e; }
.dialog-heading h2 { color: #fff4f9; }
.material-dialog .button-coral { background: #f4bed4; color: #291520; }
.photo-dialog .button-dark { border-color: #ed9ebd80; color: #fff7fb; }
.cursor-glow { background: radial-gradient(circle, #ed84b423 0%, #b468bc10 35%, transparent 70%); mix-blend-mode: multiply; }

@media (max-width: 1150px) {
  .site-header nav { gap: 19px; }
  .hero h1 { font-size: 65px; }
  .hero-copy { max-width: 545px; }
  .hero-scene { width: 58%; right: 0; top: 186px; bottom: 122px; }
  .hero-orbit { top: 225px; height: 480px; }
  .hero-description { font-size: 14px; }
  .hero-socials { width: 550px; }
  .hero-social-card { padding: 16px 19px; }
  .hero-social-card strong { font-size: 11px; }
}
@media (max-width: 900px) {
  .site-header nav { gap: 13px; }
  .site-header nav > a { font-size: 10px; }
  .brand-link { width: 115px; }
  .cinematic-hero { min-height: 795px; }
  .cinematic-hero .hero-inner { padding-top: 184px; min-height: 628px; }
  .hero h1 { font-size: 57px; letter-spacing: -3px; }
  .hero-copy { max-width: 460px; }
  .hero-description { max-width: 400px; font-size: 13px; }
  .hero-scene { width: 66%; right: -10%; top: 193px; bottom: 156px; }
  .hero-orbit { right: -12%; top: 235px; height: 410px; width: 67%; }
  .hero-vignette { background: linear-gradient(0deg, #f4bed4, transparent 25%), linear-gradient(90deg, #f4bed4 0%, #f4bed4ee 25%, #f4bed475 49%, transparent 80%); }
  .hero-photo-caption { right: 0; bottom: 29px; }
  .hero-socials { width: 495px; }
  .hero-social-card strong { font-size: 10px; }
  .section-pad { padding: 78px 0; }
  .songs-grid { gap: 20px; }
  .song-body { padding: 15px 15px 19px; }
  .song-title { font-size: 20px; }
  .kapriiz-ribbon { justify-content: flex-start; font-size: 10px; padding: 20px; gap: 25px; }
  .contact-copy h2 { font-size: 57px; }
}
@media (max-width: 700px) {
  .site-header { height: 95px; }
  .site-header .brand-link { width: 123px; height: 87px; }
  .menu-toggle span { background: #573047; }
  #site-nav { top: 95px; background: #fce4ee; border-color: #d795b4; box-shadow: 0 20px 30px #71345315; }
  #site-nav > a:not(.button) { color: #65374f; border-color: #dfacc3; }
  #site-nav .nav-socials { padding: 14px 8px 7px; gap: 12px; }
  #site-nav .nav-socials > a { width: 34px; height: 34px; }
  .cinematic-hero { min-height: 0; background: radial-gradient(ellipse at 50% 64%, #fff0f6, transparent 60%), #f4bed4; }
  .cinematic-hero .hero-inner { padding: 141px 0 24px; min-height: 0; width: calc(100% - 40px); }
  .hero-copy { max-width: none; }
  .hero-copy .eyebrow { font-size: 9px; letter-spacing: 1.5px; margin-bottom: 24px; }
  .hero h1 { font-size: clamp(43px, 10.8vw, 68px); letter-spacing: -2.5px; line-height: 1.12; }
  .hero-accent { font-size: 1.37em; margin-left: -2px; }
  .hero-description { font-size: 13px; max-width: 370px; margin-top: 23px; }
  .hero-description > span { font-size: 11px; }
  .hero-actions { gap: 15px; margin-top: 25px; }
  .hero-actions .button { font-size: 11px; padding-inline: 19px; gap: 15px; }
  .listen-link { font-size: 9px; gap: 7px; }
  .hero-footnote { color: #85566e; margin-top: 23px; font-size: 8px; }
  .hero-scene { order: 2; position: relative; inset: auto; width: 100%; height: 375px; margin: 0; z-index: 0; opacity: 1; }
  .hero-scene img { object-position: center bottom; opacity: 1; }
  .hero-orbit { top: auto; bottom: 234px; right: 4%; width: 92%; height: 340px; border-width: 1px; box-shadow: 0 0 0 14px #fff2, 0 0 0 15px #fff5; z-index: -1; }
  .hero-vignette { z-index: 1; background: linear-gradient(0deg, #f4bed4 0%, transparent 17%); }
  .hero-photo-caption { display: none; }
  .hero-bottom { order: 3; padding: 7px 0 30px; margin-top: 0; }
  .hero-socials { width: 100%; gap: 12px; }
  .hero-social-card { border-radius: 100px; background: #fff4f980; padding: 16px 20px; }
  .hero-social-card strong { font-size: 12px; }
  .hero-social-card small { font-size: 7px; }
  .kapriiz-ribbon { gap: 22px; padding: 19px 20px; font-size: 10px; letter-spacing: 1.4px; }
  .ribbon-star { font-size: 23px; }
  .section-pad { padding: 63px 0; }
  h2, .music h2 { font-size: 44px; letter-spacing: -2px; }
  .music .section-heading { align-items: flex-start; }
  .filter-tabs button { padding: 9px 13px; font-size: 10px; }
  .songs-grid { gap: 21px 14px; }
  .song-card { border-radius: 13px; }
  .song-body { padding: 13px 12px 17px; }
  .song-title { font-size: 18px; }
  .youtube-banner { border-radius: 18px; padding: 24px; }
  .youtube-banner h3 { font-size: 21px; }
  .mood-card > button, .mood-photo-link { border-radius: 70px 70px 12px 12px; }
  .mood-card:nth-child(even) { padding-top: 24px; }
  .mood-copy strong { font-size: 20px; }
  .mood-source { font-size: 8px; }
  .social-follow { gap: 12px; flex-wrap: wrap; }
  .social-follow > p { width: 100%; margin-bottom: 4px; }
  .social-follow > a { padding: 10px 14px; font-size: 11px; }
  .calendar-card { padding: 23px; border-radius: 20px; }
  .poster-card { border-radius: 70px 20px 20px 20px; padding-top: 39px; }
  .press-photo-card > button { border-radius: 13px; }
  .contact-copy h2 { font-size: 64px; }
  .contact-details > a { font-size: 16px; }
  .booking-form { border-radius: 20px; padding: 27px 22px; }
  .footer-social { color: #f5c8de; }
}
@media (max-width: 365px) {
  .cinematic-hero .hero-inner { width: calc(100% - 32px); }
  .hero h1 { font-size: 41px; }
  .hero-description { font-size: 12px; }
  .hero-actions { gap: 12px; }
  .hero-actions .button { font-size: 10px; padding-inline: 16px; gap: 12px; }
  .listen-link { font-size: 8px; }
  .hero-social-card strong { font-size: 11px; }
  .hero-scene { height: 325px; }
  .hero-orbit { height: 290px; bottom: 245px; }
  .song-title { font-size: 16px; }
  .contact-details > a { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-orbit { transform: none; }
}

/* The original thick, tilted oval contains the lower portrait. The upper
   mask opening lets the heads break its top edge. Ring and mask share the
   same SVG coordinates, so the curve stays aligned at every screen size. */
.hero-portrait {
  --portrait-diameter: min(49vw, 615px);
  position: absolute;
  top: 145px;
  right: 5%;
  width: var(--portrait-diameter);
  height: calc(var(--portrait-diameter) * 710 / 660);
  z-index: -4;
}
.hero-portrait .hero-orbit {
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  transform: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 660 710'%3E%3Cdefs%3E%3ClinearGradient id='p' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop stop-color='%23fff1f8'/%3E%3Cstop offset='1' stop-color='%23e29abd'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cellipse cx='330' cy='426' rx='295' ry='231' transform='rotate(-14 330 426)' fill='url(%23p)' stroke='%23fff2f8' stroke-opacity='.75' stroke-width='26'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  border: 0;
  box-shadow: none;
  z-index: 0;
}
.hero-photo-window {
  position: absolute;
  inset: 0;
  z-index: 1;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 660 710'%3E%3Crect width='660' height='426' fill='white'/%3E%3Cellipse cx='330' cy='426' rx='295' ry='231' transform='rotate(-14 330 426)' fill='white'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 660 710'%3E%3Crect width='660' height='426' fill='white'/%3E%3Cellipse cx='330' cy='426' rx='295' ry='231' transform='rotate(-14 330 426)' fill='white'/%3E%3C/svg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.hero-portrait .hero-scene {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 1;
  z-index: 1;
  -webkit-mask-image: none;
  mask-image: none;
}
.hero-portrait .hero-scene img {
  position: absolute;
  left: 1.5%;
  bottom: 0;
  width: 97%;
  max-width: none;
  height: auto;
  opacity: 1;
  filter: none;
}
.hero-vignette { background: none; }
.hero-photo-caption { display: none; }
.hero-description > span, .hero-footnote { color: #704353; }
.mood-section :focus-visible, .site-footer :focus-visible, dialog :focus-visible { outline-color: #f5bad5; }
@media (min-width: 701px) and (max-width: 1150px) {
  .hero-portrait { --portrait-diameter: 47vw; right: 2%; top: 172px; }
  .hero-copy { max-width: 50%; }
  .hero h1 { font-size: clamp(49px, 5.6vw, 65px); }
  .hero-description { font-size: 13px; max-width: 380px; }
  .hero-actions { flex-wrap: wrap; gap: 18px; }
  .hero-actions .button { font-size: 11px; gap: 15px; padding-inline: 20px; }
  .listen-link { font-size: 10px; }
}
@media (min-width: 701px) and (max-width: 900px) {
  .hero-portrait { --portrait-diameter: 46vw; top: 214px; right: 2%; }
  .cinematic-hero { min-height: 780px; }
  .hero h1 { font-size: 46px; }
  .hero-description { max-width: 310px; font-size: 12px; }
  .hero-description > span { font-size: 10px; }
  .hero-actions { flex-direction: column; align-items: flex-start; gap: 18px; }
}
@media (max-width: 700px) {
  .hero-portrait {
    --portrait-diameter: min(94vw, 470px);
    position: relative;
    top: auto;
    right: auto;
    order: 2;
    flex-shrink: 0;
    margin: 5px auto 24px;
    z-index: 2;
  }
  .hero-portrait .hero-scene { order: initial; }
  .hero-bottom { padding-top: 7px; }
  .hero-vignette { background: none; }
  .hero-footnote { color: #704353; }
}