.sw-h22 { position: relative; min-height: 100vh; background: #3B0F1A; color: #F3D9CE; font-family: 'Inter', sans-serif; display: grid; grid-template-columns: 1.06fr 0.94fr; grid-template-rows: 1fr auto; overflow: hidden; }
.sw-h22::before { content: ""; position: absolute; inset: 0; background: radial-gradient(820px 480px at 78% 18%, rgba(201,164,92,0.08), rgba(0,0,0,0) 60%); pointer-events: none; }
.sw-h22-content { grid-column: 1; grid-row: 1; padding: 3.6rem clamp(2.2rem, 4vw, 4.4rem) 1.6rem; position: relative; z-index: 1; }
.sw-h22-eyebrow { display: inline-flex; align-items: center; gap: 11px; font-size: 0.68rem; letter-spacing: 4.5px; text-transform: uppercase; font-weight: 500; color: #F3D9CE; margin-bottom: 1.8rem; }
.sw-h22-dot { width: 7px; height: 7px; border-radius: 50%; background: #C9A45C; }
.sw-h22-eyebrow em { font-style: normal; color: #D4A99B; }
.sw-h22-title { font-family: 'Fraunces', Georgia, serif; font-weight: 420; font-size: 76px; line-height: 0.98; letter-spacing: -1.2px; color: #F3D9CE; margin: 0 0 1.1rem; max-width: 14ch; }
.sw-h22-italic { font-style: italic; font-weight: 420; color: #C9A45C; }
.sw-h22-goldrule { display: block; width: 72px; height: 1px; background: linear-gradient(90deg, #C9A45C, rgba(201,164,92,0)); margin: 0 0 1.1rem; }
.sw-h22-sub { font-size: 16px; line-height: 1.65; color: #D4A99B; max-width: 44ch; margin: 0 0 0.6rem; }
.sw-h22-emphasis { font-size: 0.64rem; letter-spacing: 0.26em; text-transform: uppercase; color: rgba(201,164,92,0.85); margin: 0 0 1.6rem; }
.sw-h22-actions { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; }
.sw-h22-cta-primary { display: inline-flex; align-items: center; background: #C9A45C; color: #2B0A12; font-size: 0.84rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 14px 30px; border-radius: 999px; text-decoration: none; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.sw-h22-cta-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 32px -14px rgba(201,164,92,0.5); }
.sw-h22-cta-secondary { display: inline-flex; align-items: center; border: 1px solid rgba(243,217,206,0.4); color: #F3D9CE; font-size: 0.8rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; padding: 13px 26px; border-radius: 999px; text-decoration: none; transition: border-color 0.25s ease, background 0.25s ease; }
.sw-h22-cta-secondary:hover { border-color: rgba(201,164,92,0.7); background: rgba(201,164,92,0.08); }
.sw-h22-flight { display: grid; gap: 2px; margin-top: 1.9rem; max-width: 480px; border-top: 1px solid rgba(201,164,92,0.35); padding-top: 1rem; }
.sw-h22-flight-kicker { font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase; color: #C9A45C; }
.sw-h22-flight-title { font-family: 'Fraunces', Georgia, serif; font-size: 1.2rem; font-weight: 500; color: #F3D9CE; margin-bottom: 4px; }
.sw-h22-wine { display: grid; grid-template-columns: 26px 1fr; grid-template-areas: "num name" "num meta" "num note"; column-gap: 10px; padding: 7px 0; border-bottom: 1px dashed rgba(243,217,206,0.16); }
.sw-h22-wine-num { grid-area: num; font-family: 'Fraunces', Georgia, serif; font-style: italic; font-size: 0.8rem; color: #C9A45C; padding-top: 1px; }
.sw-h22-wine-name { grid-area: name; font-size: 0.88rem; font-weight: 700; color: #F3D9CE; }
.sw-h22-wine-meta { grid-area: meta; font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 0.64rem; letter-spacing: 0.04em; color: #D4A99B; }
.sw-h22-wine-note { grid-area: note; font-size: 0.74rem; font-style: italic; color: #D4A99B; }
.sw-h22-flight-price { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; color: #C9A45C; padding-top: 7px; }
.sw-h22-visual { grid-column: 2; grid-row: 1; position: relative; display: flex; align-items: flex-end; justify-content: center; }
.sw-h22-arches { display: flex; gap: 18px; align-items: flex-end; padding: 0 2.6rem; }
.sw-h22-arch { display: block; width: clamp(150px, 16vw, 205px); height: 62vh; border-radius: 999px 999px 0 0; background-image: linear-gradient(rgba(59,15,26,0.22), rgba(59,15,26,0.02)), url('/studio/components/images/gastro-5-wine-bar.jpg'); background-repeat: no-repeat; background-size: 230% auto; position: relative; box-shadow: 0 36px 80px -38px rgba(0,0,0,0.75); }
.sw-h22-arch::before { content: ""; position: absolute; inset: -10px -10px 0; border: 1px solid rgba(201,164,92,0.45); border-bottom: 0; border-radius: 999px 999px 0 0; pointer-events: none; }
.sw-h22-arch-l { background-position: 18% 42%; }
.sw-h22-arch-r { background-position: 84% 42%; }
.sw-h22-photo-credit { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); font-size: 0.6rem; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(243,217,206,0.75); background: rgba(43,10,18,0.55); padding: 4px 12px; border-radius: 999px; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); white-space: nowrap; }
.sw-h22-footer { grid-column: 1 / -1; grid-row: 2; display: flex; align-items: center; gap: 1.3rem; flex-wrap: wrap; border-top: 1px solid rgba(201,164,92,0.3); background: rgba(26,6,10,0.4); padding: 0.9rem clamp(1.8rem, 4vw, 4.4rem); position: relative; z-index: 1; }
.sw-h22-foot-label { font-size: 0.6rem; letter-spacing: 0.24em; text-transform: uppercase; color: #D4A99B; }
.sw-h22-regions { list-style: none; display: flex; align-items: center; gap: 1.3rem; flex-wrap: wrap; margin: 0; padding: 0; }
.sw-h22-regions li { display: inline-flex; align-items: center; gap: 8px; font-size: 0.8rem; color: rgba(243,217,206,0.88); }
.sw-h22-cork { width: 9px; height: 9px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #D9AC74, #9A6A40); box-shadow: 0 0 0 1px rgba(201,164,92,0.4); }
.sw-h22-foot-stat { display: inline-flex; align-items: baseline; gap: 9px; margin-left: auto; }
.sw-h22-foot-stat strong { font-family: 'Fraunces', Georgia, serif; font-size: 1.25rem; color: #C9A45C; }
.sw-h22-foot-meta { font-size: 0.72rem; color: #D4A99B; }
@media (max-width: 960px) { .sw-h22 { grid-template-columns: 1fr; grid-template-rows: auto auto auto; } .sw-h22-content { grid-column: 1; padding: 2.4rem 1.5rem 1.4rem; } .sw-h22-title { font-size: 48px; } .sw-h22-visual { grid-column: 1; grid-row: 2; padding-top: 1rem; } .sw-h22-arch { height: 38vh; width: 38vw; } .sw-h22-footer { grid-row: 3; gap: 0.9rem; } .sw-h22-foot-stat { margin-left: 0; } }
