/* Why Germany page */

.why-hero { display: flex; align-items: center; width: 100%; min-height: 50vh; background: var(--deep); margin-top: 65px; position: relative; overflow: hidden; }
.why-hero-grid { position: absolute; inset: 0; opacity: .04; background-image: linear-gradient(var(--gold) 1px, transparent 1px), linear-gradient(90deg, var(--gold) 1px, transparent 1px); background-size: 60px 60px; }
.why-hero-glow { position: absolute; inset: 0; background: radial-gradient(ellipse 70% 80% at 30% 50%, rgba(201, 168, 76, .09) 0%, transparent 65%); }
.why-hero-left { position: relative; z-index: 2; width: 25%; padding: 3rem; display: flex; flex-direction: column; justify-content: center; }
.why-hero-brand { font-family: var(--fd); font-size: clamp(1.2rem, 2vw, 1.8rem); font-weight: 600; color: var(--white); letter-spacing: .06em; margin-bottom: .6rem; display: block; }
.why-hero-tag { font-family: var(--fm); font-size: .85rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); display: block; }
.why-hero-img { width: 75%; position: relative; overflow: hidden; align-self: stretch; }
.why-hero-img img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }

.wi { background: var(--off); }
.wi-inner { max-width: 900px; margin: 0 auto; padding: 5rem 4rem; }
.wi-inner p { font-size: 1rem; font-weight: 300; color: #4a4740; line-height: 1.85; margin-top: 1.25rem; }

.rg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: rgba(201, 168, 76, .1); margin-top: 2rem; }
.rc { background: var(--deep); padding: 3rem 2.5rem; transition: background .25s; }
.rc:hover { background: var(--ink); }
.rc-n { font-family: var(--fd); font-size: 3.5rem; font-weight: 300; color: rgba(201, 168, 76, .25); line-height: 1; margin-bottom: 1rem; display: block; }
.rc h3 { font-family: var(--fd); font-size: 1.55rem; font-weight: 600; color: var(--gl); margin-bottom: .75rem; }
.rc p { font-size: .84rem; font-weight: 300; color: rgba(250, 249, 246, .6); line-height: 1.75; }

.why-q { background: var(--gold); padding: 5rem 4rem; text-align: center; }
.why-q blockquote { font-family: var(--fd); font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 400; font-style: italic; color: var(--deep); max-width: 800px; margin: 0 auto; line-height: 1.3; }

@media (max-width: 960px) {
  .why-hero { display: grid; grid-template-columns: 1fr; min-height: auto; }
  .why-hero-left { width: 100%; padding: 3rem 1.5rem; }
  .why-hero-img { width: 100%; height: 40vw; }
  .wi-inner { padding: 3rem 1.5rem; }
  .rg { grid-template-columns: 1fr; }
  .why-q { padding: 3rem 1.5rem; }
}
