:root {
    --paper: #f6f4ef;
    --ink: #121211;
    --mute: #6f6c66;
    --line: #d9d5cc;
    --f-display: "Viaoda Libre", "Times New Roman", serif;
    --f-accent: "Bodoni Moda", "Times New Roman", serif;
    --f-text: "DM Sans", system-ui, sans-serif;
    --wrap: 1280px;
    --gut: clamp(16px, 5vw, 64px);
  }
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    margin: 0; background: var(--paper); color: var(--ink);
    font: 300 17px/1.65 var(--f-text); -webkit-font-smoothing: antialiased;
  }
  img { display: block; max-width: 100%; }
  a { color: inherit; }
  .wrap { max-width: var(--wrap); margin: 0 auto; padding-inline: var(--gut); }

  /* Cabeçalho fino, como página de roteiro */
  .bar {
    display: flex; justify-content: space-between; align-items: baseline; gap: 24px;
    padding-top: clamp(24px, 5vw, 48px); padding-bottom: 14px;
    font-size: 12px; letter-spacing: .22em; text-transform: uppercase;
  }
  .bar b { font: 400 17px/1 var(--f-display); letter-spacing: .14em; white-space: nowrap; }
  .bar nav { display: flex; gap: clamp(16px, 2.4vw, 32px); }
  .bar nav a { text-decoration: none; color: var(--mute); transition: color .2s; }
  .bar nav a:hover, .bar nav a:focus-visible { color: var(--ink); }

  /* Frames: borda fina e grão leve */
  .frame { position: relative; border: 1px solid var(--ink); overflow: hidden; background: #1a1a18; }
  .frame img { width: 100%; height: 100%; object-fit: cover; }
  .frame::after {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .16; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  .hero .frame { aspect-ratio: 2.1 / 1; }
  /* Loops sem som: um plano de cada filme em corte seco; o pôster é o primeiro quadro do plano sorteado */
  .loop > img, .loop > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  /* loops em P&B, como as capas: a cor fica pros filmes quando a pessoa clica */
  .loop > img, .loop > video { filter: grayscale(1) contrast(1.08) brightness(1.02); }
  /* a faixa do meio fica em cor, pra fazer contraste com o resto da página */
  .loop[data-loop="meio"] > img, .loop[data-loop="meio"] > video { filter: none; }
  .loop > video { opacity: 0; }
  .loop > video.on { opacity: 1; }
  .loop-play { all: unset; display: none; position: absolute; z-index: 2; right: 12px; bottom: 12px; width: 44px; height: 44px; border-radius: 50%; background: rgba(18,18,17,.55); color: #fff; font-size: 15px; line-height: 44px; text-align: center; cursor: pointer; }
  .loop.parado .loop-play { display: block; }
  .loop-play:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
  .hero-cap {
    display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap;
    padding-top: 22px;
  }
  .hero h1 {
    margin: 0; font: 400 clamp(40px, 7.2vw, 104px)/.95 var(--f-display);
    text-transform: uppercase; letter-spacing: .01em;
  }
  .hero .para { font: 400 clamp(20px, 2.4vw, 28px)/1.2 var(--f-accent); font-style: italic; text-align: right; }
  .hero .award { margin: 8px 0 0; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--mute); text-align: right; }

  section { padding: clamp(80px, 12vw, 160px) 0 0; }
  .eyebrow { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--mute); margin: 0 0 18px; }
  h2 {
    margin: 0 0 36px; font: 400 clamp(32px, 4.6vw, 56px)/1 var(--f-display); text-transform: uppercase;
  }
  em, .it { font-family: var(--f-accent); font-style: italic; font-weight: 400; }

  /* Frase solta */
  .quote { text-align: center; padding: clamp(110px, 16vw, 200px) var(--gut) 0; }
  .quote p { margin: 0 auto; max-width: 24em; font: 400 clamp(24px, 3.2vw, 38px)/1.3 var(--f-accent); font-style: italic; }
  .quote small { display: block; margin-top: 18px; font: 400 12px/1 var(--f-text); letter-spacing: .22em; text-transform: uppercase; color: var(--mute); }

  /* Filmes: capas em P&B, a cor volta no hover */
  .films { --cols: 4; --gap: clamp(16px, 2vw, 26px); display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); grid-auto-flow: dense; gap: calc(var(--gap) * 1.4) var(--gap); }
  /* filme em destaque: ocupa 2 colunas e 2 linhas, e a grade fecha sem filme sobrando */
  .film.destaque { grid-column: span 2; grid-row: span 2; }
  .film.destaque .cap { flex: 0 0 auto; }
  .film.destaque .frame { flex: 1 1 0; aspect-ratio: auto; min-height: 0; }
  .film.destaque .frame img { position: absolute; inset: 0; }
  .film { all: unset; cursor: pointer; display: flex; flex-direction: column; }
  .film .cap { flex: 1 0 auto; font-size: 15px; margin-bottom: 10px; }
  .film .cap em { display: block; font: 400 14px/1.4 var(--f-text); font-style: normal; color: var(--mute); }
  .film .frame { aspect-ratio: 3 / 4; }
  .film .frame img { filter: grayscale(1) contrast(1.08) brightness(1.02); transition: transform .8s ease, filter .6s ease; }
  .film:hover .frame img, .film:focus-visible .frame img { transform: scale(1.03); filter: none; }
  .film:focus-visible .frame { outline: 2px solid var(--ink); outline-offset: 4px; }
  .play {
    position: absolute; left: 14px; bottom: 14px; z-index: 1;
    font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #fff;
  }
  .note { text-align: center; margin-top: 26px; font: 400 15px/1 var(--f-accent); font-style: italic; color: var(--mute); }

  .wide .frame { aspect-ratio: 2.4 / 1; }
  .festa .frame { aspect-ratio: 2.1 / 1; }

  /* Galeria: a tela de entrega, em miniatura */
  .gal { position: relative; overflow: hidden; aspect-ratio: 2.1 / 1; border: 1px solid var(--ink); background: #0d0d0c; color: #f4f2ee; }
  .gal-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
  .gal::before {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(90deg, rgba(10,10,9,.7) 0%, rgba(10,10,9,.2) 45%, rgba(10,10,9,0) 70%),
                linear-gradient(0deg, rgba(10,10,9,.88) 0%, rgba(10,10,9,0) 48%);
  }
  .gal-head { position: absolute; z-index: 2; left: clamp(20px, 3.4vw, 44px); top: clamp(20px, 4vw, 52px); }
  .gal-by { margin: 0 0 10px; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; opacity: .85; }
  .gal h3 { margin: 0; font: 400 clamp(30px, 3.8vw, 52px)/1 var(--f-display); text-transform: uppercase; }
  .gal-title { margin: 10px 0 0; font: 400 clamp(16px, 1.7vw, 22px)/1.2 var(--f-accent); font-style: italic; opacity: .92; }
  .gal-row {
    position: absolute; z-index: 2; left: clamp(20px, 3.4vw, 44px); right: clamp(20px, 3.4vw, 44px); bottom: clamp(16px, 3vw, 36px);
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(8px, 1.2vw, 16px);
  }
  .gal-card { all: unset; cursor: pointer; position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 6px; background: #222; }
  .gal-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
  .gal-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.72), rgba(0,0,0,0) 62%); }
  .gal-card span { position: absolute; z-index: 1; left: 10px; right: 8px; bottom: 8px; font-size: 11px; line-height: 1.3; color: rgba(244,242,238,.8); }
  .gal-card b { display: block; font-weight: 500; font-size: 13px; color: #f4f2ee; }
  .gal-card:hover img, .gal-card:focus-visible img { transform: scale(1.04); }
  .gal-card:focus-visible { outline: 2px solid #f4f2ee; outline-offset: 3px; }
  .gal-text { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 80px); margin-top: clamp(28px, 4vw, 44px); }
  .gal-text p { margin: 0; max-width: 34em; }

  /* Sobre */
  .about { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
  .about .frame { aspect-ratio: 3 / 4; max-width: 420px; }
  .about .frame img { object-position: 50% 30%; filter: grayscale(1) contrast(1.05); }
  .about p { margin: 0 0 1.1em; max-width: 34em; }
  .about .lead { font-size: clamp(20px, 2vw, 24px); line-height: 1.45; font-weight: 300; }
  .sign { width: 150px; margin-top: 28px; }

  /* Contato */
  .end { text-align: center; padding-bottom: clamp(64px, 9vw, 120px); }
  .end .frame { aspect-ratio: 2.1 / 1; margin-bottom: clamp(48px, 7vw, 88px); }
  .end > p { margin: 0 auto; max-width: 20em; font: 400 clamp(24px, 3vw, 34px)/1.3 var(--f-accent); font-style: italic; }
  .end .sign { margin: 34px auto 28px; width: 128px; }
  .end .ask { margin: 0 auto 30px; max-width: 30em; color: var(--mute); font: 300 16px/1.6 var(--f-text); }
  .cta { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
  .contato { margin: 24px 0 0; font-size: 14px; color: var(--mute); }
  .contato a { color: inherit; text-underline-offset: 3px; text-decoration-thickness: 1px; }
  .contato a:hover, .contato a:focus-visible { color: var(--ink); }
  .btn {
    display: inline-block; padding: 16px 30px; border: 1px solid var(--ink); text-decoration: none;
    font-size: 12px; letter-spacing: .22em; text-transform: uppercase; transition: background .25s, color .25s;
  }
  .btn.solid, .btn:hover { background: var(--ink); color: var(--paper); }
  .btn.solid:hover { background: transparent; color: var(--ink); }
  .foot { margin-top: 64px; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--mute); }

  /* Player */
  dialog { border: 0; padding: 0; background: transparent; max-width: none; max-height: none; width: 100vw; height: 100vh; }
  dialog::backdrop { background: rgba(8, 8, 7, .94); }
  .film-inner { width: 100%; height: 100%; display: grid; place-items: center; padding: 56px var(--gut); }
  .film-inner video { --r: 1.778; width: min(100%, calc((100vh - 112px) * var(--r))); aspect-ratio: var(--r); background: #000; }
  .film-close {
    all: unset; cursor: pointer; position: fixed; top: 18px; right: var(--gut);
    color: #f4f2ee; font-size: 12px; letter-spacing: .22em; text-transform: uppercase;
  }

  @media (max-width: 1100px) {
    .films { --cols: 4; }
  }
  @media (max-width: 860px) {
    .about { grid-template-columns: 1fr; }
    .about .frame { max-width: 300px; }
    .films { --cols: 2; --gap: 12px; }
    /* no celular o destaque ocupa a largura toda numa linha só, com altura própria */
    .film.destaque { grid-row: span 1; }
    .film.destaque .frame { flex: none; aspect-ratio: 4 / 5; }
    .film .cap { font-size: 14px; }
    .film .cap em { font-size: 12px; }
    .play { left: 10px; bottom: 10px; }
    .hero .frame, .end .frame { aspect-ratio: 16 / 9; }   /* loops no celular: 16:9 pra não cortar quem está nas bordas */
    .hero .para, .hero .award { text-align: left; }
    .wide .frame { aspect-ratio: 16 / 9; }
    .festa .frame { aspect-ratio: 16 / 9; }
    .gal { aspect-ratio: auto; }
    .gal-bg { position: relative; inset: auto; height: auto; aspect-ratio: 16 / 10; }
    .gal::before {
      inset: 0 0 auto 0; aspect-ratio: 16 / 10;
      background: linear-gradient(0deg, rgba(13,13,12,1) 0%, rgba(13,13,12,0) 30%);
    }
    .gal-head { position: static; padding: 20px 16px 6px; }
    .gal-row { position: static; grid-template-columns: 1fr 1fr; padding: 12px; }
    .gal-text { grid-template-columns: 1fr; }
  }
  @media (max-width: 600px) {
    .bar nav a:not(:last-child) { display: none; }
  }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .film .frame img, .gal-card img { transition: none; } }

  /* ===== Site .com: línguas e destination ===== */
  .bar .lado { display: flex; align-items: baseline; gap: clamp(16px, 2.4vw, 32px); }
  .langs { display: flex; gap: 10px; }
  .langs a { text-decoration: none; color: var(--mute); }
  .langs a[aria-current="page"] { color: var(--ink); }
  .langs a:hover, .langs a:focus-visible { color: var(--ink); }

  .dest { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
  .dest p { margin: 0 0 1.1em; max-width: 34em; }
  .dest .spain { color: var(--mute); font-size: 15px; }
  .preco { border-top: 1px solid var(--ink); padding-top: 22px; }
  .preco strong { display: block; font: 400 clamp(40px, 5vw, 64px)/1 var(--f-display); }
  .preco > span { display: block; margin-top: 10px; font: 400 18px/1.3 var(--f-accent); font-style: italic; color: var(--mute); }
  .colecoes { list-style: none; padding: 0; margin: 28px 0 30px; }
  .colecoes li { display: flex; justify-content: space-between; gap: 16px; padding: 13px 0; border-top: 1px solid var(--line); font-size: 15px; }
  .colecoes li span { color: var(--mute); text-align: right; }

  @media (max-width: 860px) {
    .dest { grid-template-columns: 1fr; }
  }
  @media (max-width: 600px) {
    .bar { flex-wrap: wrap; }
  }
  /* frase e prêmio do topo sempre encostados à direita, mesmo quando quebram pra linha de baixo */
  .hero-cap > div { margin-left: auto; }
  @media (max-width: 860px) { .hero-cap > div { margin-left: 0; } }

  .marca { text-decoration: none; }
  .bar nav a[aria-current="page"] { color: var(--ink); }
  .acoes { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
  .mais { font-size: 14px; color: var(--mute); text-underline-offset: 4px; text-decoration-thickness: 1px; }
  .mais:hover, .mais:focus-visible { color: var(--ink); }

  /* ===== Investimento (igual à proposta do Brasil, em euro) ===== */
  .inv-topo { padding-top: clamp(48px, 7vw, 96px); }
  h1.pg { margin: 0 0 36px; font: 400 clamp(32px, 4.6vw, 56px)/1 var(--f-display); text-transform: uppercase; }
  .tabs { display: flex; gap: 28px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin-bottom: clamp(36px, 5vw, 56px); }
  .tab {
    all: unset; cursor: pointer; padding: 0 0 14px; margin-bottom: -1px;
    font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--mute);
    border-bottom: 1px solid transparent;
  }
  .tab[aria-selected="true"] { color: var(--ink); border-color: var(--ink); }
  .tab:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
  .pack { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
  .pack[hidden] { display: none; }
  .pack .frame { aspect-ratio: 4 / 5; }
  .pack .frame img { filter: grayscale(1) contrast(1.08) brightness(1.02); }
  .pack h3 { margin: 0; font: 400 clamp(34px, 4.4vw, 52px)/1 var(--f-display); text-transform: uppercase; }
  .pack .tag { margin: 14px 0 34px; max-width: 30em; color: var(--mute); }
  dl.rows { margin: 0; display: grid; grid-template-columns: 150px 1fr; border-top: 1px solid var(--line); }
  dl.rows dt, dl.rows dd { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--line); }
  dl.rows dt { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--mute); padding-top: 18px; }
  dl.rows dd small { color: var(--mute); font-size: 14px; }
  .price { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 30px; }
  .price strong { font: 400 clamp(34px, 4vw, 46px)/1 var(--f-display); }
  .price span { font: 400 17px/1.3 var(--f-accent); font-style: italic; }
  .vat { margin: 8px 0 0; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--mute); }
  .footnote { margin-top: clamp(40px, 5vw, 64px); font-size: 14px; color: var(--mute); max-width: 52em; }
  .list { border-top: 1px solid var(--line); }
  .li { display: grid; grid-template-columns: 1fr auto; gap: 8px 32px; padding: 20px 0; border-bottom: 1px solid var(--line); }
  .li h4 { margin: 0; font-weight: 400; font-size: 18px; }
  .li p { margin: 4px 0 0; grid-column: 1; color: var(--mute); font-size: 15px; max-width: 40em; }
  .li .v { grid-column: 2; grid-row: 1; white-space: nowrap; font-size: 18px; text-align: right; }
  .two { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(48px, 7vw, 112px); }
  .two h2 { font-size: clamp(28px, 3.2vw, 40px); }
  @media (max-width: 860px) {
    .pack, .two { grid-template-columns: 1fr; }
    .pack .frame { aspect-ratio: 16 / 10; }
  }
  @media (max-width: 600px) {
    dl.rows { grid-template-columns: 1fr; }
    dl.rows dt { border-bottom: 0; padding-bottom: 0; }
    dl.rows dd { padding-top: 4px; }
  }

  /* Investimento do .com (direto, pro europeu): as três coleções lado a lado */
  .inv-lead { margin: -12px 0 clamp(36px, 5vw, 56px); color: var(--mute); max-width: 40em; }
  .cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 44px); align-items: start; }
  .col .frame { aspect-ratio: 16 / 10; }
  .col .frame img { filter: grayscale(1) contrast(1.08) brightness(1.02); }
  .col h3 { margin: 24px 0 0; font: 400 clamp(26px, 2.6vw, 34px)/1 var(--f-display); text-transform: uppercase; }
  .col .valor { margin: 10px 0 0; font: 400 clamp(26px, 2.6vw, 34px)/1 var(--f-display); }
  .col ul { list-style: none; margin: 22px 0 0; padding: 0; border-top: 1px solid var(--line); }
  .col li { padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 16px; }
  .inv-acoes { margin-top: clamp(24px, 3vw, 36px); }
  @media (max-width: 860px) { .cols { grid-template-columns: 1fr; gap: 56px; } }

  /* Cards com link pro filme (o nome) e quadro que toca (botão) ou leva pra página (link) */
  .film .cap a { color: inherit; text-decoration: none; }
  .film .cap a:hover, .film .cap a:focus-visible { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
  button.frame, a.frame { display: block; width: 100%; padding: 0; font: inherit; color: inherit; cursor: pointer; text-decoration: none; }
  .film .frame:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }

  /* Página de filme */
  .filme-topo { padding-top: clamp(48px, 7vw, 96px); }
  .filme-topo .pack .frame { aspect-ratio: 3 / 4; }
  .filme-topo .pack .frame img { filter: none; }
  .filme-topo .pack p { max-width: 34em; }
  .filme-topo dl.rows { margin-top: 28px; }
  button.btn { font: inherit; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; cursor: pointer; }
  #more .films { margin-top: 8px; }
  @media (max-width: 860px) { .filme-topo .pack .frame { aspect-ratio: 4 / 5; } }

  /* Páginas de lugar */
  .lugar-topo { padding-top: clamp(48px, 7vw, 96px); }
  .lugar-lead { margin: 0; max-width: 36em; font-size: clamp(19px, 1.9vw, 23px); line-height: 1.5; }
  .lugar-secoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 56px); }
  .lugar-secoes h2 { margin: 0 0 14px; font: 400 clamp(20px, 2vw, 26px)/1.15 var(--f-display); text-transform: uppercase; }
  .lugar-secoes p { margin: 0 0 1em; }
  .faq .li { grid-template-columns: 1fr; }
  .faq h3 { margin: 0; font-weight: 400; font-size: 18px; }
  .lugares { font-size: 15px; }
  .lugares a { color: var(--ink); text-underline-offset: 4px; text-decoration-thickness: 1px; }
  @media (max-width: 860px) { .lugar-secoes { grid-template-columns: 1fr; } }

  /* Central "Casamento na Europa": destinos */
  .destinos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 34px; }
  .destino { display: block; padding: 18px 20px; border: 1px solid var(--ink); text-decoration: none; transition: background .25s, color .25s; }
  .destino b { display: block; font: 400 clamp(24px, 2.6vw, 32px)/1 var(--f-display); text-transform: uppercase; }
  .destino span { display: block; margin-top: 8px; font-size: 14px; color: var(--mute); }
  .destino:hover, .destino:focus-visible { background: var(--ink); color: var(--paper); }
  .destino:hover span, .destino:focus-visible span { color: inherit; }
  .lugar-topo .nota { text-align: left; margin-top: 14px; }
  @media (max-width: 860px) { .destinos { grid-template-columns: 1fr; } }