/* Desktop composition. The compact layouts remain in styles.css. */
@media (min-width: 1100px) {
  :root {
    --page-gutter: max(56px, calc((100vw - 1840px) / 2));
  }

  .header {
    height: 122px;
    padding: 28px var(--page-gutter);
  }
  .wordmark > span { font-size: 46px; letter-spacing: 8px; }
  .wordmark small { font-size: 9px; letter-spacing: 5px; }
  .brand-star { font-size: 21px; right: -14px; }
  .header nav { gap: clamp(28px, 2.7vw, 52px); font-size: 13px; }
  .nav-inquire { padding-left: 30px; }
  .nav-inquire span { margin-left: 32px; font-size: 23px; }

  .hero {
    height: clamp(800px, 88svh, 1080px);
    max-height: none;
    min-height: 800px;
  }
  .hero-photo { right: 34%; }
  .hero-detail { left: 66%; border-left: 2px solid #d1bfa2; }
  .hero-photo img { object-position: 48% 48%; }
  .hero-detail img { object-position: 50% 65%; }
  .hero-overlay {
    background: linear-gradient(90deg, #201b196b, #201b191a 65%, transparent 75%),
      linear-gradient(0deg, #211916cc, transparent 70%, #21191640);
  }
  .hero-topline {
    top: 156px;
    left: var(--page-gutter);
    right: var(--page-gutter);
    font-size: 10px;
    letter-spacing: 2px;
  }
  .hero-copy {
    left: calc(var(--page-gutter) + 12px);
    bottom: clamp(116px, 10svh, 154px);
  }
  .hero-copy .eyebrow { font-size: 11px; margin-bottom: 25px; }
  h1 { font-size: clamp(100px, 6.7vw, 152px); line-height: .94; letter-spacing: -4px; }
  .hero-bottom { margin-top: 34px; gap: clamp(40px, 5vw, 96px); }
  .hero-bottom p { font-size: 15px; line-height: 1.8; }
  .light-link { font-size: 13px; padding-bottom: 15px; }
  .light-link span { margin-left: 60px; font-size: 24px; }
  .explore { left: var(--page-gutter); bottom: 32px; font-size: 10px; }
  .hero-caption { right: var(--page-gutter); bottom: 41px; font-size: 10px; }
  .occasion-strip { height: 86px; gap: clamp(30px, 3vw, 68px); font-size: 11px; }

  .work-section { padding: 78px var(--page-gutter) 62px; }
  .section-heading { margin-bottom: 36px; gap: 48px; }
  .section-heading .eyebrow { font-size: 11px; margin-bottom: 20px; }
  .section-heading h2 { font-size: clamp(56px, 3.9vw, 78px); line-height: 1.02; }
  .section-aside { font-size: 14px; line-height: 1.9; max-width: 360px; }

  /* Two generous photographs, then four closer details. */
  .gallery { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 34px 26px; }
  .gallery-item { grid-column: span 3; margin: 0; }
  .gallery-item:nth-child(1) { grid-column: span 5; }
  .gallery-item:nth-child(2) { grid-column: span 7; }
  .gallery-item img,
  .gallery-tall img,
  .gallery-short img { height: clamp(280px, 22vw, 410px); }
  .gallery-item:nth-child(-n+2) img { height: clamp(460px, 33vw, 660px); }
  .gallery-item:nth-child(1) img { object-position: 50% 46%; }
  .gallery-item:nth-child(2) img { object-position: 50% 65%; }
  .gallery-item[data-gallery="2"] img { object-fit: cover; object-position: 50% 47%; }
  .gallery-item[data-gallery="3"] img { object-position: 50% 63%; }
  .gallery-item[data-gallery="4"] img { object-position: 63% 53%; }
  .gallery-item[data-gallery="5"] img { object-position: 50% 54%; }
  .gallery-caption { gap: 13px; padding-top: 20px; font-size: clamp(23px, 1.6vw, 29px); line-height: 1.15; }
  .gallery-caption > span { font-size: 11px; }
  .photo-action { opacity: 1; top: 18px; left: 20px; right: 20px; font-size: 10px; align-items: center; }
  .photo-action b {
    display: flex;
    width: 39px;
    height: 39px;
    align-items: center;
    justify-content: center;
    border: 1px solid #ffffff8c;
    background: #241b1638;
    border-radius: 50%;
    font-size: 23px;
  }
  .work-footnote { font-size: 10px; padding-top: 24px; margin-top: 34px; }

  .spaces-section { padding: 70px var(--page-gutter) 50px; }
  .spaces-section .section-heading { margin-bottom: 40px; }
  .space-columns { gap: clamp(24px, 2vw, 40px); }
  .space-card {
    display: flex;
    flex-direction: column;
    height: auto;
    color: var(--ink);
    background: transparent;
    overflow: visible;
    isolation: auto;
  }
  .space-card:after { display: none; }
  .space-card > img {
    position: relative;
    inset: auto;
    z-index: auto;
    height: clamp(360px, 29vw, 560px);
    flex: none;
  }
  .space-card:hover > img { transform: none; filter: brightness(1.04); }
  .space-card[data-space="restaurant"] > img { object-position: 48% 48%; }
  .space-card[data-space="hotel"] > img { object-position: 50% 60%; }
  .space-card[data-space="set"] > img { object-position: 50% 67%; }
  .space-card-number {
    top: 21px;
    left: 21px;
    padding: 8px 10px;
    background: #29211ee6;
    color: var(--cream);
    font-size: 10px;
    letter-spacing: 1.4px;
  }
  .space-card-copy {
    position: static;
    padding-top: 25px;
    width: 100%;
    flex: 1;
  }
  .space-card-copy > .eyebrow { color: #766554; font-size: 9px; margin-bottom: 15px; }
  .space-card-copy strong { font-size: clamp(39px, 2.7vw, 54px); line-height: 1.04; }
  .space-card-copy strong em { color: #785252; }
  .space-card-description { color: #756d62; font-size: 14px; line-height: 1.85; margin-top: 18px; }
  .space-card-link { border-color: #bcb1a1; margin-top: 24px; padding-top: 17px; font-size: 13px; }
  .space-card-link b { font-size: 26px; }
  .spaces-note { margin-top: 30px; font-size: 11px; align-items: baseline; }
  .spaces-note > span:first-child { font-size: 9px; }

  .occasions {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: clamp(48px, 5vw, 100px);
    margin-top: 0;
    min-height: 0;
    padding: 80px var(--page-gutter);
    align-items: center;
  }
  .occasion-image { overflow: visible; }
  .occasion-image img { position: relative; inset: auto; height: auto; aspect-ratio: 4 / 3; object-fit: contain; background: transparent; }
  .occasion-image:after { display: none; }
  .image-note { position: static; display: block; margin-top: 20px; font-size: 10px; letter-spacing: 1.6px; }
  .occasion-copy { padding: 0; }
  .occasion-copy .eyebrow { font-size: 10px; margin-bottom: 26px; }
  .occasion-copy h2 { font-size: clamp(54px, 3.7vw, 74px); line-height: 1.02; }
  .occasion-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; margin-top: 34px; }
  .occasion-list button { padding: 19px 0; gap: 12px; align-items: flex-start; }
  .occasion-list strong { font-size: clamp(24px, 1.5vw, 29px); line-height: 1.05; }
  .occasion-list small { font-size: 12px; line-height: 1.7; margin-top: 8px; }
  .occasion-list b { font-size: 24px; }

  .approach { padding: 72px var(--page-gutter); grid-template-columns: 1fr 1.5fr; gap: 60px; }
  .approach .eyebrow { font-size: 10px; }
  .approach h2 { font-size: clamp(40px, 2.7vw, 54px); }
  .approach-steps { gap: 30px; }
  .approach-steps span { font-size: 12px; }
  .approach-steps h3 { font-size: clamp(24px, 1.7vw, 32px); margin-top: 20px; white-space: normal; }
  .approach-steps p { font-size: 13px; max-width: 240px; margin-top: 11px; }

  .contact { height: clamp(610px, 42vw, 720px); }
  .contact > img { left: 47%; width: 53%; object-position: 50% 45%; filter: none; }
  .contact-shade { background: linear-gradient(90deg, #302223 0%, #302223 43%, #302223b0 54%, #30222310 77%); }
  .contact-content { padding: 84px var(--page-gutter); }
  .contact-content .eyebrow { font-size: 11px; margin-bottom: 29px; }
  .contact h2 { font-size: clamp(72px, 4.8vw, 102px); }
  .contact-content > p:not(.eyebrow) { font-size: 15px; line-height: 1.85; margin-top: 27px; }
  .cream-button { min-width: 310px; padding: 21px 26px; font-size: 14px; margin-top: 31px; }
  .contact-phone { font-size: 12px; margin-top: 23px; }
  .contact-location { right: var(--page-gutter); bottom: 29px; font-size: 10px; }
  footer { padding: 46px var(--page-gutter) 24px; gap: 36px; }
  .footer-brand > span { font-size: 42px; }
  .footer-brand small { font-size: 8px; letter-spacing: 4.8px; }
  footer > p { font-size: 30px; }
  footer > div:not(.footer-bottom) { font-size: 13px; gap: 12px; }
  .footer-bottom { padding-top: 25px; font-size: 9px; }

  #gallery-dialog figure { width: min(88vw, 1920px); }
  #gallery-full { max-height: calc(100svh - 125px); }
  #gallery-label { font-size: 28px; }
  #gallery-dialog button { width: 52px; height: 52px; font-size: 29px; }
  #space-dialog { width: min(1560px, calc(100vw - 100px)); max-width: 1560px; max-height: calc(100svh - 80px); }
  .space-detail-grid { grid-template-columns: minmax(0, 1.03fr) minmax(0, 1fr); min-height: 0; }
  .space-detail-visual { position: sticky; top: 0; align-self: start; height: min(920px, calc(100svh - 80px)); min-height: 640px; }
  .space-detail-visual > img { padding: 16px 16px 122px; }
  .space-detail-visual > span { left: 28px; bottom: 93px; font-size: 9px; }
  .space-image-options { left: 28px; right: 28px; bottom: 24px; gap: 10px; }
  .space-image-options button { font-size: 11px; padding: 11px 13px; min-height: 40px; }
  .space-detail-content { padding: 42px 44px 35px; }
  .space-switcher { gap: 25px; margin-bottom: 32px; }
  .space-switcher button { font-size: 12px; padding-bottom: 10px; }
  .space-detail-content > .eyebrow { font-size: 10px; }
  #space-title { font-size: clamp(54px, 3.5vw, 70px); }
  .space-intro { font-size: 14px; line-height: 1.85; margin-top: 23px; }
  .space-offerings { margin-top: 26px; }
  .space-offerings > div { padding: 15px 0; }
  .space-offerings h3 { font-size: 28px; }
  .space-offerings p { font-size: 13px; line-height: 1.75; }
  .space-planning { padding: 19px 22px; }
  .space-planning .eyebrow { font-size: 9px; }
  .space-planning > p:last-child { font-size: 12px; }
  #space-inquire { padding: 20px 23px; }
  #space-inquire > span { font-size: 13px; }
  .space-budget { font-size: 10px; }
  .space-close { width: 40px; height: 40px; font-size: 32px; right: 12px; top: 12px; }
  #inquiry-dialog { width: 740px; max-height: calc(100svh - 80px); padding: 42px 48px; }
  #inquiry-dialog h2 { font-size: 72px; }
  .dialog-intro { font-size: 14px; }
  .form-grid { gap: 21px; }
  label { font-size: 12px; }
  input, select, textarea { font-size: 14px; min-height: 46px; }
  .dark-button { font-size: 14px; padding: 20px 23px; }
  .form-note { font-size: 11px; }
}

@media (min-width: 2300px) {
  .hero { height: 1080px; }
  .hero-copy { bottom: 158px; }
  .hero-detail { left: 68%; }
  .hero-photo { right: 32%; }
  .hero-overlay { background: linear-gradient(90deg, #201b1973, #201b1912 68%, transparent 78%), linear-gradient(0deg, #211916d9, transparent 72%, #21191640); }
  .hero-bottom { margin-top: 42px; }
}

@media (min-width: 1100px) and (max-width: 1399px) {
  :root { --page-gutter: 44px; }
  .header nav { gap: 26px; font-size: 12px; }
  h1 { font-size: 100px; }
  .hero { min-height: 790px; }
  .section-heading h2 { font-size: 57px; }
  .gallery-caption { font-size: 22px; }
  .space-card-copy strong { font-size: 39px; }
  .space-card-description { font-size: 13px; }
  .occasion-list { grid-template-columns: 1fr; margin-top: 25px; }
  .occasion-list button { padding: 13px 0; }
  .occasion-list strong { font-size: 25px; }
  .occasion-list small { margin-top: 4px; font-size: 11px; }
  .occasion-copy h2 { font-size: 55px; }
  .approach { gap: 40px; grid-template-columns: 1fr 1.5fr; }
  .approach h2 { font-size: 39px; }
  .approach-steps { gap: 20px; }
  .approach-steps h3 { font-size: 24px; }
  .approach-steps p { font-size: 12px; }
  .space-detail-content { padding: 34px 30px; }
  .space-intro { font-size: 13px; }
  .space-offerings p { font-size: 12px; }
}