/* Pakumiehet — shared stylesheet (matches original pakumiehet.fi design) */

:root {
  --header-h: 76px;
  --color-brand: #8b4720;
  --color-golden: #f5b921;
}

* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body { background: #fff; color: #150d09; font-family: 'Inter', ui-sans-serif, system-ui, sans-serif; margin: 0; text-rendering: optimizeLegibility; }
h1, h2, h3, h4 { font-family: '"Space Grotesk"', Inter, ui-sans-serif, system-ui, sans-serif; margin: 0; }
p { margin: 0; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
::selection { background: var(--color-brand); color: #fff; }

.container-px { margin-left: auto; margin-right: auto; width: 100%; max-width: 88rem; padding-left: 1.25rem; padding-right: 1.25rem; }
@media (min-width: 640px) { .container-px { padding-left: 2rem; padding-right: 2rem; } }
@media (min-width: 1024px) { .container-px { padding-left: 3rem; padding-right: 3rem; } }

.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 9999px; padding: 0.875rem 1.75rem; font-size: 0.875rem; font-weight: 700; letter-spacing: -0.01em; transition: all 0.3s; cursor: pointer; border: none; animation: btn-pulse-glow 2.4s ease-in-out infinite; }
.btn:hover { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .btn { animation: none; } }
.btn-primary { background: #6b3010; color: #fff; font-weight: 700; box-shadow: 0 10px 30px -12px rgba(107,48,16,0.55); }
.btn-primary:hover { background: #8b4720; transform: translateY(-2px); box-shadow: 0 18px 40px -12px rgba(139,71,32,0.65); }
.btn-secondary { background: #fff; color: #150d09; box-shadow: inset 0 0 0 1px #d9cfc8; }
.btn-secondary:hover { box-shadow: inset 0 0 0 1px #3d2e25; transform: translateY(-2px); }
.btn-golden { background: #f5b921; color: #150d09; box-shadow: 0 10px 30px -12px rgba(224,154,0,0.55); }
.btn-golden:hover { background: #ffd14d; transform: translateY(-2px); }

.eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.2em; color: #8b4720; }
.card { border-radius: 1rem; background: #fff; box-shadow: inset 0 0 0 1px #ede8e4; transition: all 0.5s; }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity 0.8s cubic-bezier(.22,1,.36,1), transform 0.8s cubic-bezier(.22,1,.36,1); will-change: opacity, transform; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: .08s; } .reveal-delay-2 { transition-delay: .16s; }
.reveal-delay-3 { transition-delay: .24s; } .reveal-delay-4 { transition-delay: .32s; } .reveal-delay-5 { transition-delay: .4s; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1 !important; transform: none !important; transition: none !important; } html { scroll-behavior: auto; } }

.text-balance { text-wrap: balance; }
.bg-grid { background-image: linear-gradient(to right, rgba(12,12,14,.04) 1px, transparent 1px), linear-gradient(to bottom, rgba(12,12,14,.04) 1px, transparent 1px); background-size: 56px 56px; }

.text-display-xl { font-size: clamp(2.75rem, 6vw, 5.5rem); line-height: 1.02; letter-spacing: -0.03em; }
.text-display-lg { font-size: clamp(2.25rem, 4.5vw, 4rem); line-height: 1.05; letter-spacing: -0.025em; }
.text-display-md { font-size: clamp(1.75rem, 3vw, 2.75rem); line-height: 1.1; letter-spacing: -0.02em; }

.booking-input { width: 100%; border-radius: 0.75rem; border: 1px solid #e5e7eb; background: rgba(249,250,251,.5); padding: 0.75rem 1rem; font-size: 15px; color: #111827; transition: all 0.2s; }
.booking-input:focus { border-color: #72512B; background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(114,81,43,.1); }
.booking-label { margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.375rem; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #6b7280; }

.mobile-nav { display: none; }
.mobile-nav.open { display: block; }

/* Pulsing "Pyydä tarjous" CTA buttons */
@keyframes btn-pulse-glow {
  0%, 100% { box-shadow: 0 10px 30px -12px rgba(107,48,16,0.55), 0 0 0 0 rgba(245,185,33,0.5); }
  50% { box-shadow: 0 10px 30px -12px rgba(107,48,16,0.55), 0 0 0 8px rgba(245,185,33,0); }
}
.btn-pulse { animation: btn-pulse-glow 2.2s ease-in-out infinite; }
.btn-pulse:hover { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .btn-pulse { animation: none; } }