:root {
  color-scheme: light;
  --ink: #171715;
  --paper: #fff;
  --gold: #a38d45;
  --muted: #6a6964;
  --content-width: 1160px;
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Georgia, 'Times New Roman', serif; }
body:not(.landing-page) { background-color: var(--paper); background-image: url('../images/vineyard-pattern.png'); background-repeat: repeat; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; clip-path: inset(50%); }
a { color: inherit; text-decoration: none; }
img, video { display: block; max-width: 100%; }

.welcome { position: relative; display: grid; width: 100%; min-height: 100vh; min-height: 100svh; place-items: center; overflow: hidden; background: #050505; }
.welcome-photo, .photo-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.welcome-photo { object-fit: cover; object-position: center; opacity: 0; transition: opacity .8s ease; }
.welcome-photo.is-active { z-index: 1; opacity: 1; }
.photo-shade { background: rgb(0 0 0 / 18%); }
.welcome-brand { position: relative; z-index: 2; display: grid; width: min(617px, 76vw); place-items: center; margin-top: -30px; animation: appear .8s .08s ease-out both; }
.welcome-brand::before { position: absolute; z-index: -1; inset: -18% -16%; background: radial-gradient(ellipse, rgb(0 0 0 / 32%), rgb(0 0 0 / 14%) 48%, transparent 74%); content: ""; pointer-events: none; }
.welcome-brand img { width: 100%; height: auto; mix-blend-mode: screen; }
.instagram-icon { display: block; width: 23px; height: 23px; }
.language-links { position: absolute; z-index: 3; bottom: clamp(24px, 5vh, 60px); left: 50%; display: grid; width: min(320px, calc(100% - 40px)); grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid rgb(211 180 65 / 70%); background: rgb(211 180 65 / 48%); box-shadow: 0 6px 24px rgb(0 0 0 / 24%); backdrop-filter: blur(6px); transform: translateX(-50%); }
.language-links a { display: grid; min-height: 58px; place-items: center; color: #e2c34c; background: rgb(17 17 15 / 72%); font-size: 16px; font-weight: 600; transition: background-color .18s ease, color .18s ease; }
.language-links a:hover, .language-links a:focus-visible { color: var(--ink); background: #d3b441; }
.language-links .language-instagram:hover, .language-links .language-instagram:focus-visible { color: #e2c34c; background: rgb(17 17 15 / 72%); }
.language-links a:focus-visible, .site-footer a:focus-visible, .site-nav a:focus-visible, .menu-toggle:focus-visible, .slide-arrow:focus-visible, .slide-dots button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.slide-arrow { position: absolute; z-index: 3; top: 50%; display: grid; width: 48px; height: 56px; place-items: center; border: 0; color: #fff; background: rgb(0 0 0 / 30%); font: 40px/1 Georgia, serif; cursor: pointer; transform: translateY(-50%); transition: background-color .18s ease; }
.slide-arrow:hover { background: rgb(0 0 0 / 65%); }
.slide-arrow-previous { left: 20px; }
.slide-arrow-next { right: 20px; }
.slide-dots { position: absolute; z-index: 3; right: 24px; bottom: 20px; display: flex; gap: 10px; }
.slide-dots button { width: 12px; height: 12px; padding: 0; border: 1px solid #fff; border-radius: 50%; background: rgb(255 255 255 / 48%); cursor: pointer; }
.slide-dots button[aria-current="true"] { background: #fff; }

.site-header { position: relative; z-index: 2; background: transparent; }
.site-nav { display: flex; width: min(var(--content-width), calc(100% - 48px)); min-height: 86px; align-items: center; justify-content: space-between; gap: 32px; margin: 0 auto; }
.site-logo { flex: 0 0 144px; }
.site-logo img { width: 144px; height: auto; }
.nav-links { display: flex; align-items: center; gap: clamp(16px, 3vw, 38px); margin: 0; padding: 0; list-style: none; font-family: Arial, sans-serif; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }
.nav-links a { padding: 12px 0; }
.nav-links a[aria-current="page"] { color: var(--gold); }
.language-switch { padding-left: 20px; border-left: 1px solid #d8d6d0; color: var(--gold); }
.menu-toggle { display: none; border: 0; padding: 10px; color: var(--ink); background: transparent; font: inherit; cursor: pointer; }

.page-hero { display: grid; min-height: clamp(360px, 55vw, 600px); place-items: center; padding: 48px 24px; color: #fff; text-align: center; background: linear-gradient(rgb(0 0 0 / 28%), rgb(0 0 0 / 40%)), url('../images/philosophy-hero.jpg') center 48% / cover; }
.page-hero h1 { max-width: 900px; margin: 0; font-size: clamp(36px, 6vw, 66px); font-weight: 400; line-height: 1.12; }
.page-content { width: min(var(--content-width), calc(100% - 48px)); margin: 0 auto; }
.film-section { padding: 72px 0 42px; }
.video-player { position: relative; width: min(820px, 100%); margin: 0 auto; background: #111; }
.video-player video { width: 100%; max-height: 520px; }
.video-play { position: absolute; z-index: 1; top: 50%; left: 50%; display: grid; width: 88px; height: 88px; place-items: center; padding: 0; border: 2px solid rgb(255 255 255 / 88%); border-radius: 50%; color: #fff; background: rgb(0 0 0 / 44%); cursor: pointer; transform: translate(-50%, -50%); transition: background-color .18s ease; }
.video-play:hover, .video-play:focus-visible { background: rgb(0 0 0 / 78%); }
.play-icon { width: 0; height: 0; margin-left: 6px; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-left: 22px solid #fff; }
.video-play[hidden] { display: none; }
.story-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 54px); padding: 38px 0 86px; }
.story-columns p { margin: 0; font-size: 18px; line-height: 1.75; }
.site-footer { padding: 32px 24px; border-top: 1px solid #e8e5d8; color: #484638; background: #f5f4eb; font-family: Arial, sans-serif; font-size: 13px; }
.footer-inner { display: flex; width: min(var(--content-width), 100%); flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; margin: 0 auto; }
.site-footer a { color: #6f6239; transition: color .18s ease, background-color .18s ease; }
.site-footer a:hover, .site-footer a:focus-visible { color: #302f26; }
.instagram-footer-link { display: grid; flex: 0 0 44px; width: 44px; height: 44px; place-items: center; border: 1px solid #ddd9c8; }
.instagram-footer-link:hover, .instagram-footer-link:focus-visible { background: #eceadd; }
.page-copy { max-width: 760px; margin: 0 auto; padding: 64px 0; font-size: 19px; line-height: 1.8; }
.page-copy p { margin: 0 0 24px; }
.map-image { width: 100%; height: auto; margin: 0 auto 34px; }
.vineyard-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; padding: 0 0 72px; }
.document-link { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 12px 18px; border: 1px solid rgb(211 180 65 / 70%); color: #e2c34c; background: rgb(17 17 15 / 72%); font-family: Arial, sans-serif; font-size: 15px; font-weight: 600; transition: background-color .18s ease, color .18s ease; }
.document-link:hover, .document-link:focus-visible { border-color: #d3b441; color: var(--ink); background: #d3b441; }
.wine-list { display: grid; gap: 72px; padding: 72px 0; }
.wine-item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 6vw, 84px); }
.wine-item:nth-child(even) .wine-carousel { order: 2; }
.wine-copy h2, .profile h2, .press-group h2 { margin: 0 0 12px; font-size: 29px; font-weight: 400; }
.wine-copy .wine-logo { display: flex; min-height: 84px; align-items: center; justify-content: flex-start; }
.wine-logo img { width: auto; max-width: min(100%, 340px); height: 84px; object-fit: contain; object-position: left center; mix-blend-mode: multiply; }
.wine-logo--poggio img { height: 36px; }
.wine-logo--ser-primo img { height: 59px; }
.wine-logo--primula img { height: 54px; }
.press-group .wine-logo { display: flex; min-height: 64px; align-items: center; justify-content: center; margin: 0; }
.press-group .wine-logo img { object-position: center; }
.wine-type { color: var(--gold); font-family: Arial, sans-serif; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.wine-copy p { font-size: 18px; line-height: 1.75; }
.image-carousel { position: relative; overflow: hidden; background: #f0efe9; }
.image-carousel img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.image-carousel img[src$="/Primula.jpg"] { aspect-ratio: 3 / 2; object-fit: cover; object-position: center bottom; }
.carousel-controls { position: absolute; inset: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 12px; pointer-events: none; }
.carousel-controls button { min-width: 44px; min-height: 44px; border: 0; border-radius: 50%; color: #fff; background: rgb(0 0 0 / 14%); font-size: 20px; opacity: .42; text-shadow: 0 1px 3px rgb(0 0 0 / 70%); cursor: pointer; pointer-events: auto; transition: opacity .18s ease, background-color .18s ease; }
.carousel-controls button:hover, .carousel-controls button:focus-visible { background: rgb(0 0 0 / 48%); opacity: .9; }
.gallery-dialog button { min-width: 44px; min-height: 44px; border: 1px solid #c9c4b4; color: var(--ink); background: #fff; font-size: 20px; cursor: pointer; }
.gallery-dialog button:hover { color: #fff; background: var(--ink); }
.profile-intro { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; padding: 62px 0; }
.profile-intro p { margin: 0; font-size: 18px; line-height: 1.75; }
.team-photo { width: 100%; max-height: 420px; object-fit: cover; }
.profiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px; padding: 56px 0 78px; }
.profile p { font-size: 17px; line-height: 1.75; }
.press-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 38px; padding: 65px 0 82px; }
.press-group { display: grid; align-content: start; gap: 14px; }
.press-item { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 16px; padding: 12px 0; border-top: 1px solid #e6e3da; }
.press-item img { width: 110px; height: 86px; object-fit: cover; }
.press-item a { color: var(--gold); font-family: Arial, sans-serif; font-size: 13px; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 64px 0 80px; }
.gallery-grid button { overflow: hidden; border: 0; padding: 0; background: #e8e5de; cursor: zoom-in; }
.gallery-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .3s ease; }
.gallery-grid button:hover img { transform: scale(1.04); }
.gallery-dialog { width: min(1120px, calc(100% - 32px)); max-width: none; max-height: 92vh; border: 0; padding: 16px; color: #fff; background: #151513; }
.gallery-dialog::backdrop { background: rgb(0 0 0 / 88%); }
.gallery-dialog img { max-width: 100%; max-height: calc(92vh - 76px); margin: 0 auto; object-fit: contain; }
.dialog-controls { display: flex; justify-content: space-between; gap: 16px; padding-top: 12px; }
.dialog-controls button { color: #fff; border-color: #777; background: #222; }
.brand-home { min-height: 100vh; min-height: 100svh; }

@keyframes appear { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 1000px) {
  .welcome-photo { object-position: 54% center; }
  .welcome-brand { width: min(440px, 84vw); margin-top: -48px; }
  .language-links { bottom: 24px; width: min(320px, calc(100% - 32px)); }
  .language-links a { min-height: 56px; font-size: 15px; }
  .slide-arrow { width: 40px; height: 48px; font-size: 34px; }
  .slide-arrow-previous { left: 8px; }
  .slide-arrow-next { right: 8px; }
  .slide-dots { right: 50%; bottom: 100px; gap: 8px; transform: translateX(50%); }
  .slide-dots button { width: 10px; height: 10px; }
  .site-nav { width: calc(100% - 32px); min-height: 72px; flex-wrap: wrap; gap: 0; }
  .site-logo { flex-basis: 124px; }
  .site-logo img { width: 124px; }
  .menu-toggle { display: block; }
  .nav-links { display: none; width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding: 4px 0 18px; }
  .nav-links.is-open { display: flex; }
  .nav-links li { border-top: 1px solid #e8e6e0; }
  .nav-links a { display: block; padding: 13px 2px; }
  .language-switch { padding-left: 2px; border: 0; }
  .page-hero { min-height: 390px; }
  .page-content { width: calc(100% - 36px); }
  .film-section { padding-top: 42px; }
  .video-play { width: 72px; height: 72px; }
  .play-icon { border-top-width: 13px; border-bottom-width: 13px; border-left-width: 19px; }
  .story-columns { grid-template-columns: 1fr; gap: 22px; padding: 24px 0 54px; }
  .story-columns p { font-size: 17px; }
  .page-copy { padding: 42px 0; font-size: 17px; }
  .wine-list { gap: 52px; padding: 44px 0; }
  .wine-item { grid-template-columns: 1fr; gap: 22px; }
  .wine-item:nth-child(even) .wine-carousel { order: initial; }
  .wine-copy h2, .profile h2, .press-group h2 { font-size: 25px; }
  .profile-intro { grid-template-columns: 1fr; gap: 20px; padding: 42px 0; }
  .profile-intro p { font-size: 17px; }
  .profiles { grid-template-columns: 1fr; gap: 22px; padding: 40px 0 58px; }
  .press-grid { grid-template-columns: 1fr; gap: 34px; padding: 42px 0 56px; }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 42px 0 56px; }
}
@media (min-width: 761px) and (max-width: 1000px) {
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .press-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}.map-wrap { position: relative; margin: 0 auto 72px; }
.map-wrap .map-image { display: block; margin: 0; }
.map-wrap svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-wrap polygon { fill: transparent; cursor: pointer; transition: fill .18s ease; }
.map-wrap a:hover polygon, .map-wrap a:focus-visible polygon { fill: rgb(255 255 255 / 35%); }
.press-icons { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin: 0; padding: 0; list-style: none; }
.press-icons a { display: block; padding: 4px; }
.press-icons img { width: 104px; height: 78px; object-fit: contain; mix-blend-mode: multiply; }
.press-icons a:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.press-icons .press-gambero { display: grid; min-width: 112px; min-height: 86px; justify-items: center; align-content: center; gap: 5px; }
.press-icons .press-gambero img { width: 104px; height: auto; mix-blend-mode: normal; }
.press-gambero-score { display: flex; align-items: center; gap: 5px; color: #a9383c; font-family: Arial, sans-serif; line-height: 1; }
.press-gambero-score svg { width: 25px; height: 21px; }
.press-gambero-score strong { font-size: 15px; }
.review-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 260px); align-items: start; gap: clamp(32px, 6vw, 76px); padding: 64px 0 82px; }
.review-copy { max-width: 720px; }
.review-kicker { margin: 0 0 12px; color: var(--gold); font-family: Arial, sans-serif; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.review-copy h2 { margin: 0 0 24px; font-size: 34px; font-weight: 400; }
.review-copy blockquote { margin: 0; padding-left: 24px; border-left: 2px solid #a9383c; font-size: 22px; line-height: 1.65; }
.review-score { display: flex; align-items: center; gap: 12px; margin: 30px 0; color: #a9383c; font-family: Arial, sans-serif; }
.review-glasses { display: flex; align-items: center; gap: 3px; }
.review-glasses svg { width: 23px; height: 38px; fill: currentColor; }
.review-score strong { font-size: 19px; }
.review-source { color: var(--muted); font-family: Arial, sans-serif; font-size: 13px; }
.review-logo { width: min(100%, 260px); height: auto; margin: 8px auto 0; object-fit: contain; }
.review-back { display: inline-block; margin-top: 30px; color: var(--gold); font-family: Arial, sans-serif; font-size: 14px; text-decoration: underline; text-underline-offset: 4px; }
.review-back:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width: 760px) {
  .review-layout { grid-template-columns: 1fr; gap: 30px; padding: 42px 0 56px; }
  .review-copy h2 { font-size: 28px; }
  .review-copy blockquote { padding-left: 18px; font-size: 19px; }
  .review-logo { width: min(260px, 80%); margin: 0 auto; }
}
