/* PASO 4B premium iteration. Desktop only; baseline/mobile remain intact.
   Scene policy: heroes, Home oficio and XV family are height-aware scenes.
   Services, open packages, timeline and FAQ may continue naturally with scroll.
   No generated copy, no business changes and no accordion state changes. */
@media (min-width: 851px) {
  :root {
    --premium-space: clamp(42px, 4vw, 76px);
    --premium-title: clamp(34px, 2.65vw, 50px);
    --premium-rule: #b9b3aa;
  }

  /* New Novias original: face/veil on the right; light negative space left.
     Top anchoring retains the face in short desktop windows without a wash
     over the whole photograph. Header keeps its audited light-photo variant. */
  .bride-hero { height: min(44vw, calc(100svh - 68px)); min-height: 420px; }
  .bride-hero > picture img { object-fit: cover; object-position: 50% 0; }
  .bride-hero.hero .hero-shade { background: none !important; }
  .bride-hero .hero-copy { left: clamp(58px, 7vw, 136px); right: auto; top: 34%; bottom: auto; max-width: 43%; color: var(--ink); text-shadow: none; }
  .bride-hero .hero-copy .label { font-size: 12px; letter-spacing: .11em; margin-bottom: 17px; }
  .bride-hero .hero-copy h1 { font-family: Poppins, Arial, sans-serif; font-size: clamp(60px, 5vw, 96px); font-weight: 400; line-height: 1.05; letter-spacing: -.035em; margin-bottom: 29px; }
  .bride-hero .hero-copy .button { padding: 16px 24px; min-height: 54px; font-size: 14px; gap: 24px; background: var(--ink); color: var(--paper); border-color: var(--ink); }

  /* New Sociales original has an uninterrupted light wall to the left.
     Typography is moved above the flowers; no global tint changes the skin. */
  .social-hero { height: min(44vw, calc(100svh - 68px)); min-height: 420px; }
  .social-hero > picture img { object-fit: cover; object-position: 50% 0; }
  .social-hero.hero .hero-shade { background: none !important; }
  .social-hero .hero-copy { left: clamp(58px, 7vw, 136px); right: auto; top: 34%; bottom: auto; max-width: 43%; color: var(--ink); text-shadow: none; }
  .social-hero .hero-copy .label { font-size: 12px; letter-spacing: .11em; margin-bottom: 17px; }
  .social-hero .hero-copy h1 { font-family: Poppins, Arial, sans-serif; font-size: clamp(60px, 5vw, 96px); font-weight: 400; line-height: 1.05; letter-spacing: -.035em; margin-bottom: 29px; }
  .social-hero .hero-copy .button { padding: 16px 24px; min-height: 54px; font-size: 14px; gap: 24px; background: var(--ink); color: var(--paper); border-color: var(--ink); }
  /* The new hair position varies beneath navigation. A light, local header
     veil replaces the fragile white-Servicios exception, not the hero image. */
  body[data-page=sociales] .site-header.over-hero:not(.is-sticky) { background: linear-gradient(90deg, transparent 35%, rgb(250 249 246 / .93) 58%, rgb(250 249 246 / .93)); color: var(--ink); text-shadow: none; }
  body[data-page=sociales] .site-header.over-hero:not(.is-sticky) .nav-dropdown > summary { color: var(--ink); text-shadow: none; }

  /* XV keeps more vertical frame in a short window so the visible hand is not
     sliced at the fingers. Local left/header veils protect type only; the face,
     crown and hair zone on the right is not covered by the left-side veil. */
  .xv-hero { height: min(44vw, calc(100svh - 12px)); min-height: 420px; }
  .xv-hero > picture img { object-fit: cover; object-position: 50% 0; }
  .xv-hero.hero .hero-shade { background: linear-gradient(180deg, rgb(15 16 14 / .56) 0, rgb(15 16 14 / .34) 62px, transparent 120px), linear-gradient(90deg, rgb(16 19 14 / .60) 0%, rgb(16 19 14 / .60) 42%, rgb(16 19 14 / .45) 46%, transparent 60%) !important; }
  .xv-hero .hero-copy { left: clamp(58px, 7vw, 136px); right: auto; top: 34%; bottom: auto; max-width: 44%; color: var(--paper); text-shadow: none; }
  .xv-hero .hero-copy .label { font-size: 12px; letter-spacing: .11em; margin-bottom: 19px; }
  .xv-hero .hero-copy h1 { font-family: Poppins, Arial, sans-serif; font-size: clamp(48px, 4.5vw, 86px); font-weight: 400; line-height: 1.08; letter-spacing: -.035em; margin-bottom: 31px; }
  .xv-hero .hero-copy .button { padding: 16px 24px; min-height: 54px; font-size: 14px; gap: 24px; background: var(--paper); color: var(--ink); border-color: var(--paper); }
  .xv-hero .hero-copy .button:hover { background: #e8e1d7; border-color: #e8e1d7; }

  /* Four equal editorial covers. The XV photo is deliberately side-cropped. */
  .service-index { padding-block: clamp(34px, 4svh, 48px) clamp(38px, 4svh, 54px); }
  .service-index .section-line { align-items: end; margin-bottom: 26px; }
  .service-index .section-line h2 { font-size: var(--premium-title); line-height: 1.12; }
  .service-index .section-line > p { font-size: 14px; line-height: 1.65; }
  .service-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 1.55vw, 30px); }
  .service-cover figure,
  .service-cover:nth-child(2) figure { width: 100%; aspect-ratio: 2 / 3; height: auto; }
  .service-cover img { display: block; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 50% 50%; }
  .service-cover:nth-child(2) img { object-position: 65% 50%; }
  .service-cover:nth-child(4) img { transform: scale(1.055); transform-origin: 62% 42%; }
  .service-cover h3 { min-height: 58px; padding-top: 17px; font-size: clamp(25px, 1.9vw, 34px); line-height: 1.2; border-bottom: 1px solid var(--line); padding-bottom: 14px; }
  .service-cover h3 .icon { width: 21px; height: 21px; }
  .service-cover:hover img { transform: none; filter: brightness(1.035); }
  .service-cover:nth-child(4):hover img { transform: scale(1.055); }
  .service-cover:focus-visible { outline: 2px solid var(--focus); outline-offset: 7px; }

  /* 43/57 oficio scene: intrinsic 4:3 image no longer dictates row height.
     The photograph fills the scene, while copy can still grow without clipping. */
  .at-home-layout { grid-template-columns: minmax(0, .43fr) minmax(0, .57fr); min-height: min(42.75vw, calc(100svh - 68px)); align-items: stretch; }
  .at-home-copy { align-self: center; padding: clamp(28px, 4svh, 60px) clamp(36px, 4.5vw, 86px); }
  .at-home-copy h2 { font-family: IbarraRealNova, Georgia, serif; font-size: clamp(42px, 3.4vw, 64px); line-height: 1.07; font-weight: 400; max-width: 510px; margin-bottom: 24px; }
  .at-home-copy .label { color: #d3c5b8; letter-spacing: .1em; margin-bottom: 18px; font-size: 11px; }
  .at-home-copy p { max-width: 485px; font-size: 16px; line-height: 1.75; margin-bottom: 17px; color: #e3dfd8; }
  .at-home-copy .text-link { margin-top: 9px; color: var(--paper); }
  .at-home-layout > figure { position: relative; align-self: stretch; height: auto; min-width: 0; min-height: 0; overflow: hidden; background: #fff; }
  .at-home-layout > figure img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 62%; }

  /* The second and only additional serif moment: historical service opening. */
  .service-introduction { padding-block: clamp(38px, 4.5svh, 58px) clamp(42px, 4.5svh, 62px); }
  .service-introduction h2 { font-family: IbarraRealNova, Georgia, serif; font-size: clamp(38px, 3.1vw, 57px); line-height: 1.13; max-width: 1020px; margin-bottom: 19px; font-weight: 400; }
  .service-introduction > p { max-width: 820px; font-size: 16px; line-height: 1.8; }
  .service-introduction > p + p { margin-top: 9px; }

  /* The photo column tracks the rendered portrait, not half an unlimited grid.
     It grows on tall displays and stays sticky within a short window. */
  .bridal-selector {
    --bridal-photo-height: min(44.5vw, 852px, calc(100svh - 164px));
    grid-template-columns: minmax(0, calc(var(--bridal-photo-height) * .666992)) minmax(0, 650px);
    gap: clamp(48px, 6vw, 112px);
    justify-content: center;
    padding: clamp(38px, 4.8svh, 58px) var(--edge);
    align-items: start;
  }
  .bridal-photographs { width: 100%; max-width: none; position: sticky; top: calc(var(--header-height) + 24px); align-self: start; }
  .bridal-photographs figure { width: 100%; }
  .bridal-photographs img { display: block; width: 100%; height: auto; max-height: none; max-width: none; aspect-ratio: 683 / 1024; object-fit: contain; }
  .bridal-choices { max-width: none; padding-block: clamp(16px, 3svh, 34px) 0; }
  .bridal-choices > .label, .xv-copy > .label { font-size: 11px; letter-spacing: .12em; margin-bottom: 15px; color: #6c6257; }
  .bridal-choices h2, .xv-copy h2 { font-size: var(--premium-title); line-height: 1.13; margin-bottom: clamp(30px, 3svh, 42px); max-width: 600px; }
  .bridal-choice { border-top: 1px solid var(--premium-rule); border-bottom: 0; }
  .bridal-choice:last-of-type { border-bottom: 1px solid var(--premium-rule); }
  .bridal-choice summary { font-size: clamp(23px, 1.78vw, 32px); line-height: 1.25; font-weight: 400; min-height: 89px; padding: 25px 4px 25px 0; gap: 22px; transition: color .2s, padding-left .2s; }
  .bridal-choice summary:hover { color: #695346; padding-left: 7px; }
  .bridal-choice summary:focus-visible, .xv-copy .service-detail summary:focus-visible { outline: 2px solid var(--focus); outline-offset: -4px; }
  .bridal-choice summary .icon, .xv-copy .service-detail summary .icon { width: 22px; height: 22px; stroke-width: 1.35; }
  .bridal-choice[open] summary { font-weight: 400; color: #695346; }
  .bridal-choice > div { padding: 3px 34px 30px 0; }
  .package-inclusions { font-size: 15px; line-height: 1.8; padding-left: 18px; margin-bottom: 21px; }
  .package-inclusions li { margin-bottom: 4px; }
  .bridal-choice .package-note { font-size: 14px; line-height: 1.8; }
  .bridal-choice .text-link { margin-top: 5px; }

  /* Family remains an intimate portrait rather than an artificially wide crop. */
  .bridal-family { grid-template-columns: minmax(0, min(36vw, calc(min(800px, 100svh - 148px) * .66675))) minmax(0, 560px); padding: 40px var(--edge); gap: clamp(64px, 8vw, 152px); justify-content: center; }
  .bridal-family > div { padding: 28px 0; max-width: 560px; justify-self: start; }
  .bridal-family h2 { font-size: clamp(38px, 3.1vw, 57px); line-height: 1.11; margin-bottom: 25px; }
  .bridal-family p { max-width: 460px; font-size: 16px; line-height: 1.8; }
  .bridal-family .text-link { margin-top: 7px; }

  /* A3: both boxes use the photographs' native 5:6 ratio. No mismatched
     square mask, no implicit 120% IMG height, no hover crop. */
  .social-services { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: var(--premium-space) max(var(--edge), calc((100% - 1480px) / 2)); gap: clamp(28px, 3.1vw, 60px); align-items: stretch; }
  .social-services article { display: grid; grid-template-rows: auto 78px 1fr auto; align-items: start; }
  .social-services figure { display: block; width: 100%; height: auto; aspect-ratio: 5 / 6; overflow: hidden; background: #e0d9d1; }
  .social-services img { display: block; width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; object-fit: contain; object-position: 50% 50%; transform: none; }
  .social-services figure:hover img { transform: none; }
  .social-services h3 { font-size: clamp(25px, 1.8vw, 34px); line-height: 1.25; min-height: 0; margin: 23px 0 14px; text-wrap: balance; }
  .social-inclusions { font-size: 15px; line-height: 1.85; margin: 12px 0 29px; }
  .social-inclusions li + li { margin-top: 4px; }
  .social-services .text-link { width: 100%; justify-content: space-between; margin-top: 0; padding-block: 7px; }

  /* Two closed XV options deliberately balance a smaller square photograph. */
  .xv-editorial { grid-template-columns: minmax(0, min(33vw, 65svh, 650px)) minmax(0, 600px); padding: var(--premium-space) var(--edge); gap: clamp(64px, 7vw, 134px); align-items: start; justify-content: center; }
  .xv-editorial > figure { width: 100%; align-self: start; position: sticky; top: calc(var(--header-height) + 24px); }
  .xv-editorial > figure img { width: 100%; height: auto; max-height: none; aspect-ratio: 1; object-fit: contain; }
  .xv-copy { width: 100%; max-width: 600px; padding-top: clamp(12px, 3svh, 32px); }
  .xv-copy .service-detail { border-bottom: 1px solid var(--premium-rule); }
  .xv-copy .service-detail:first-of-type { border-top: 1px solid var(--premium-rule); }
  .xv-copy .service-detail summary { min-height: 98px; padding: 25px 4px 25px 0; font-size: clamp(24px, 1.85vw, 34px); line-height: 1.3; transition: color .2s, padding-left .2s; }
  .xv-copy .service-detail summary:hover { color: #695346; padding-left: 7px; }
  .xv-copy .service-detail[open] summary { color: #695346; }
  .xv-copy .service-detail > div { padding: 2px 26px 27px 0; }
  .xv-copy .service-detail p { font-size: 15px; line-height: 1.85; }

  /* Square family photo is preserved; the outer white scene remains wide. */
  .xv-family { padding: 38px var(--edge); }
  .xv-family > .wrap { width: 100%; max-width: 1440px; grid-template-columns: minmax(0, 1fr) minmax(0, min(46vw, 700px, calc(100svh - 148px))); gap: clamp(46px, 6vw, 112px); align-items: center; }
  .xv-family .family-heading { padding: 28px 0; max-width: 510px; justify-self: center; }
  .xv-family h2 { font-size: clamp(38px, 3.1vw, 57px); line-height: 1.11; margin-bottom: 25px; }
  .xv-family p { font-size: 16px; line-height: 1.8; }
  .xv-family figure { display: block; width: 100%; height: auto; aspect-ratio: 1; }
  .xv-family img { width: 100%; height: 100%; max-height: none; object-fit: contain; object-position: center; }

  /* One continuous process spine, not three cards or presentation columns. */
  .bridal-timeline { padding-block: clamp(52px, 6svh, 76px); }
  .bridal-timeline > .wrap { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.65fr); gap: clamp(50px, 7vw, 130px); max-width: 1440px; align-items: start; }
  .bridal-timeline h2 { text-align: left; font-size: clamp(32px, 2.7vw, 50px); line-height: 1.17; max-width: 390px; margin: 0; position: sticky; top: calc(var(--header-height) + 32px); }
  .bridal-timeline ol { display: block; padding-left: 27px; border-left: 1px solid #746c62; }
  .bridal-timeline li { display: grid; grid-template-columns: 83px minmax(0, 1fr); column-gap: 24px; border-top: 0; padding: 0 0 32px; margin: 0 0 27px; }
  .bridal-timeline li:last-child { margin: 0; padding-bottom: 0; }
  .bridal-timeline li::before { top: 6px; left: -32px; width: 9px; height: 9px; background: var(--paper); border: 2px solid var(--ink); box-shadow: 0 0 0 1px #b6a493; }
  .bridal-timeline li:not(:last-child)::after { top: auto; bottom: 0; left: 107px; width: calc(100% - 107px); border-top: 1px solid #46413b; }
  .bridal-timeline .timeline-phase { grid-column: 1; grid-row: 1 / 3; margin: 2px 0 0; font-size: 11px; letter-spacing: .1em; color: #cbb8a6; }
  .bridal-timeline h3 { grid-column: 2; font-size: clamp(23px, 1.9vw, 34px); line-height: 1.25; min-height: 0; margin: 0 0 16px; }
  .bridal-timeline li > p:last-child { grid-column: 2; font-size: 15px; line-height: 1.85; color: #e1dcd5; max-width: 650px; }

  /* Lead testimonial + two clearly visible supporting voices. Text unchanged. */
  .service-reviews { padding-block: clamp(46px, 5.5svh, 72px); }
  .service-reviews > .wrap { max-width: 1440px; }
  .service-reviews h2 { font-size: 12px; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; text-align: left; margin-bottom: 34px; opacity: .72; }
  .service-review-grid { grid-template-columns: minmax(0, 1.38fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0; }
  .service-review-grid figure { padding: 0 clamp(23px, 2.4vw, 43px); }
  .service-review-grid h3 { font-size: clamp(21px, 1.55vw, 29px); line-height: 1.32; min-height: 0; margin-bottom: 18px; }
  .service-review-grid blockquote { font-size: 15px; line-height: 1.85; margin-bottom: 26px; }
  .service-review-grid figure:first-child { padding-right: clamp(34px, 3.6vw, 64px); }
  .service-review-grid figure:first-child h3 { font-size: clamp(28px, 2.5vw, 45px); line-height: 1.14; margin-bottom: 23px; max-width: 440px; }
  .service-review-grid figure:first-child blockquote { font-size: clamp(17px, 1.12vw, 20px); line-height: 1.75; }
  .service-review-grid figcaption { font-size: 14px; }
  .service-review-grid figcaption span { font-size: 11px; letter-spacing: .035em; margin-top: 4px; }

  /* Contained FAQ, stronger affordance, the same + / - behaviour. */
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faq-section { max-width: 960px; padding-block: clamp(48px, 6svh, 74px) 40px; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faq-section h2 { font-size: clamp(32px, 2.4vw, 44px); text-align: left; margin-bottom: 30px; font-weight: 400; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faqs details { border-top: 1px solid #c8c2b9; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faqs details:last-child { border-bottom: 1px solid #c8c2b9; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faqs summary { padding: 24px 16px 24px 0; font-size: 19px; font-weight: 400; line-height: 1.5; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faqs summary:hover { background: #f4f1ed; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faqs summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .faqs details > div { padding: 0 58px 27px 0; font-size: 16px; line-height: 1.85; color: #514c46; max-width: 845px; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .cta-section { padding-block: 40px 46px; background: var(--paper); }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .cta-section > .wrap { max-width: 960px; gap: 36px; align-items: center; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .cta-section h2 { font-size: clamp(32px, 2.45vw, 44px); line-height: 1.15; margin-bottom: 12px; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .cta-section p { max-width: 490px; font-size: 14px; line-height: 1.8; }
  body:is([data-page=novias], [data-page=sociales], [data-page=quinceaneras]) .cta-section .button { padding: 17px 22px; min-height: 55px; font-size: 14px; gap: 22px; }

  /* Experiences stays photo-complete, with the existing JS-driven slot geometry. */
  .experiences { padding-block: 34px 40px; background: #e4dfd7; }
  .experiences .section-line { align-items: end; margin-bottom: 27px; min-height: 46px; }
  .experiences h2 { font-size: clamp(31px, 2.45vw, 46px); line-height: 1.17; }
  .carousel-controls { gap: 9px; }
  .carousel-controls .icon-button { border: 1px solid #b6ada1; width: 42px; height: 42px; }
  .carousel-controls .icon-button:hover { background: #d2c9bc; }
  .carousel-count { margin-left: 9px; font-size: 12px; color: #665e55; }
  .carousel-track figure { background: #ddd6cc; }

  .site-footer { padding-top: 44px; }
  .footer-grid { max-width: 1440px; gap: clamp(32px, 4.5vw, 80px); }
  .footer-bottom { max-width: 1440px; padding-top: 22px; margin-top: 34px; }
}

/* A genuinely short desktop window: copy and breathing room scale together. */
@media (min-width: 851px) and (max-height: 720px) {
  .at-home-copy { padding-block: 27px; }
  .at-home-copy h2 { font-size: clamp(40px, 3.05vw, 52px); margin-bottom: 20px; }
  .at-home-copy p { font-size: 15px; line-height: 1.7; margin-bottom: 15px; }
  .at-home-copy .label { margin-bottom: 15px; }
  .bridal-choices { padding-top: 12px; }
  .bridal-choices h2, .xv-copy h2 { margin-bottom: 26px; }
  .bridal-choice summary { min-height: 79px; padding-block: 20px; }
  .xv-copy { padding-top: 12px; }
  .xv-copy .service-detail summary { min-height: 88px; padding-block: 22px; }
  .experiences { padding-block: 26px 30px; }
  .experiences .section-line { margin-bottom: 22px; }
}

@media (min-width: 851px) and (max-width: 1100px) {
  .at-home-copy { padding-inline: 32px; }
  .at-home-copy h2 { font-size: 40px; }
  .at-home-copy p { font-size: 15px; }
  .service-cover h3 { font-size: 25px; }
  .bridal-selector, .xv-editorial { gap: 40px; }
  .bridal-choice summary { font-size: 23px; }
  .xv-copy .service-detail summary { font-size: 23px; }
  .bridal-timeline > .wrap { grid-template-columns: .65fr 1.65fr; gap: 36px; }
  .bridal-timeline li { grid-template-columns: 58px 1fr; column-gap: 18px; }
  .bridal-timeline li:not(:last-child)::after { left: 76px; width: calc(100% - 76px); }
  .service-review-grid figure { padding-inline: 23px; }
  .service-review-grid figure:first-child { padding-right: 28px; }
  .social-services { gap: 24px; }
  .social-services h3 { font-size: 23px; }
}

@media (min-width: 851px) and (prefers-reduced-motion: reduce) {
  .service-cover:hover img { filter: none; }
  .service-cover:nth-child(4):hover img { transform: scale(1.055); }
  .bridal-choice summary:hover, .xv-copy .service-detail summary:hover { padding-left: 0; }
}
