/* =========================================================
   Laukaan Ravintola - main stylesheet
   ========================================================= */

:root{
	--forest: #12362a;
	--forest-dark: #0b241b;
	--forest-light: #1e4d3b;
	--gold: #e8b23c;
	--gold-light: #f3cd6f;
	--red: #c8232a;
	--cream: #faf6ec;
	--cream-dark: #f0e9d6;
	--ink: #1c1c1a;
	--ink-soft: #55554e;
	--white: #ffffff;
	--radius: 14px;
	--radius-sm: 8px;
	--shadow: 0 10px 30px rgba(18,54,42,.12);
	--shadow-sm: 0 4px 14px rgba(18,54,42,.08);
	--font-head: 'Playfair Display', Georgia, serif;
	--font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--container: 1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
	margin:0;
	font-family:var(--font-body);
	color:var(--ink);
	background:var(--cream);
	line-height:1.6;
	-webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,h5{ font-family:var(--font-head); margin:0 0 .5em; color:var(--forest-dark); line-height:1.15; }
p{ margin:0 0 1em; }
.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); overflow:hidden; height:1px; width:1px; }

/* ---------- Buttons ---------- */
.btn{
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	padding:14px 28px; border-radius:100px; font-weight:700; font-size:.95rem;
	letter-spacing:.02em; transition:all .2s ease; cursor:pointer; border:2px solid transparent;
	white-space:nowrap;
}
.btn--primary{ background:var(--gold); color:var(--forest-dark); }
.btn--primary:hover{ background:var(--gold-light); transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.btn--outline{ border-color:rgba(255,255,255,.7); color:#fff; }
.btn--outline:hover{ background:rgba(255,255,255,.12); transform:translateY(-2px); }
.btn--whatsapp{ background:#25d366; color:#fff; }
.btn--whatsapp:hover{ background:#22c15e; transform:translateY(-2px); box-shadow:var(--shadow-sm); }

/* Force GloriaFood's own plugin-rendered buttons (which come with their own
   fixed styling) into the same pill shape, height and font as our .btn
   buttons, so the whole CTA row reads as one consistent set. GloriaFood
   renders a link/button as the sole (or first) element inside the wrapper. */
.gf-button-wrap--pill{ display:inline-flex; }
.gf-button-wrap--pill > a,
.gf-button-wrap--pill > button,
.gf-button-wrap--pill iframe{
	border-radius:100px !important;
	padding:14px 28px !important;
	font-size:.95rem !important;
	font-weight:700 !important;
	font-family:var(--font-body) !important;
	line-height:1.1 !important;
	letter-spacing:.02em !important;
	box-shadow:none !important;
	border:2px solid transparent !important;
	display:inline-flex !important;
	align-items:center !important;
	white-space:nowrap !important;
}
.gf-button-wrap--pill > a:hover,
.gf-button-wrap--pill > button:hover{
	transform:translateY(-2px);
	box-shadow:0 4px 14px rgba(0,0,0,.08) !important;
}
.btn--whatsapp svg{ width:18px; height:18px; flex-shrink:0; }

.whatsapp-float{
	position:fixed; left:22px; bottom:22px; z-index:150; width:58px; height:58px; border-radius:50%;
	background:#25d366; color:#fff; display:flex; align-items:center; justify-content:center;
	box-shadow:0 10px 26px rgba(0,0,0,.3); transition:transform .2s ease; overflow:hidden; flex-shrink:0;
}
.whatsapp-float svg{ width:28px; height:28px; flex-shrink:0; }
.whatsapp-float:hover{ transform:scale(1.08); }
@media (max-width: 980px){
	.whatsapp-float{ left:16px; bottom:76px; width:52px; height:52px; }
	.whatsapp-float svg{ width:24px; height:24px; }
}

.eyebrow{
	display:inline-block; text-transform:uppercase; letter-spacing:.14em; font-size:.78rem;
	font-weight:700; color:var(--red); margin-bottom:10px;
}

/* ---------- Top bar ---------- */
.top-bar{ background:var(--forest-dark); color:#e9e6da; font-size:.82rem; }
.top-bar__inner{ display:flex; justify-content:space-between; align-items:center; padding:8px 24px; flex-wrap:wrap; gap:6px; }
.top-bar__info{ display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.top-bar__info a{ display:inline-flex; align-items:center; gap:6px; color:var(--gold-light); font-weight:600; }
.top-bar__social{ display:flex; gap:14px; }
.top-bar__social a{ color:#e9e6da; font-weight:700; letter-spacing:.05em; }

/* ---------- Header ---------- */
.site-header{ background:var(--white); position:sticky; top:0; z-index:100; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.site-header__inner{ display:flex; align-items:center; gap:24px; padding:12px 24px; }
.site-branding{ display:flex; align-items:center; gap:10px; margin-right:auto; }
.site-logo, .custom-logo{ height:64px; width:auto; }
.site-title{ font-family:var(--font-head); font-weight:700; font-size:1.3rem; color:var(--forest-dark); }
.main-navigation{ display:flex; }
.nav-menu, .footer-menu{ display:flex; gap:28px; align-items:center; }
.nav-menu a{ font-weight:600; font-size:.95rem; color:var(--ink); position:relative; padding:6px 0; }
.nav-menu a:hover{ color:var(--red); }
.nav-menu li > ul{ display:none; }
.header-cta{ display:flex; align-items:center; }
.header-cta .btn{ padding:11px 22px; font-size:.88rem; }
.header-cta .gf-button-wrap--pill > a,
.header-cta .gf-button-wrap--pill > button{ padding:11px 22px !important; font-size:.88rem !important; }
.gf-button-wrap{ display:inline-flex; align-items:center; scroll-margin-top:140px; }
.gf-admin-hint{
	display:inline-block; background:#fff3cd; color:#7a5b00; border:1px solid #ffe08a;
	font-size:.72rem; font-weight:600; padding:6px 10px; border-radius:6px; margin-left:8px; max-width:280px;
}
.menu-toggle{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; }
.menu-toggle span{ width:24px; height:2px; background:var(--forest-dark); display:block; }

/* ---------- Hero ---------- */
.hero{ position:relative; padding:130px 0 150px; overflow:hidden; text-align:center; color:#fff; min-height:640px; display:flex; align-items:center; }
.hero__bg{
	position:absolute; inset:0; z-index:0; background-size:200% 200%;
	background-image: radial-gradient(circle at 20% 15%, rgba(232,178,60,.22), transparent 45%),
	            radial-gradient(circle at 85% 80%, rgba(200,35,42,.18), transparent 50%),
	            linear-gradient(160deg, var(--forest) 0%, var(--forest-dark) 65%, #081a13 100%);
	animation: heroDrift 18s ease-in-out infinite alternate;
}
@keyframes heroDrift{
	0%{ background-position: 0% 0%, 100% 100%, 0 0; }
	100%{ background-position: 20% 15%, 80% 85%, 0 0; }
}
.hero__glow{ position:absolute; inset:0; z-index:0; pointer-events:none;
	background:radial-gradient(circle at 50% 30%, rgba(232,178,60,.16), transparent 55%); }
.hero__inner{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; }
.hero__logo{ width:150px; height:150px; margin-bottom:22px; filter:drop-shadow(0 10px 24px rgba(0,0,0,.35));
	animation: heroLogoFloat 5s ease-in-out infinite; }
@keyframes heroLogoFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-10px);} }
.hero__title{ color:#fff; font-size:clamp(2.4rem,5vw,3.6rem); margin-bottom:.3em; }
.hero__subtitle{ color:#e9e6da; max-width:560px; font-size:1.08rem; margin-bottom:2em; }
.hero__cta{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }

/* Floating dish photo collage */
.hero__collage{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.hero__dish{
	position:absolute; border-radius:50%; overflow:hidden; border:4px solid rgba(255,255,255,.9);
	box-shadow:0 18px 40px rgba(0,0,0,.35); animation-name:heroFloat; animation-iteration-count:infinite;
	animation-timing-function:ease-in-out;
}
.hero__dish img{ width:100%; height:100%; object-fit:cover; }
.hero__dish--1{ width:118px; height:118px; top:12%; left:6%; animation-duration:7s; }
.hero__dish--2{ width:96px; height:96px; top:62%; left:11%; animation-duration:8.5s; animation-delay:.6s; }
.hero__dish--3{ width:128px; height:128px; top:16%; right:7%; animation-duration:7.8s; animation-delay:.3s; }
.hero__dish--4{ width:100px; height:100px; top:64%; right:10%; animation-duration:6.5s; animation-delay:1s; }
@keyframes heroFloat{ 0%,100%{ transform:translateY(0) rotate(0deg);} 50%{ transform:translateY(-18px) rotate(3deg);} }

@media (max-width: 780px){
	.hero{ min-height:auto; padding:100px 0 90px; }
	.hero__dish--1,.hero__dish--2{ left:2%; }
	.hero__dish--3,.hero__dish--4{ right:2%; }
	.hero__dish--1,.hero__dish--3{ width:80px; height:80px; }
	.hero__dish--2,.hero__dish--4{ width:64px; height:64px; }
}
@media (max-width: 560px){
	.hero__collage{ display:none; }
}

/* ---------- Sections ---------- */
.section{ padding:88px 0; }
.section--story{ background:var(--white); }
.section-head{ text-align:center; max-width:640px; margin:0 auto 48px; }
.section-head p{ color:var(--ink-soft); }

.story__grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.story__text p{ color:var(--ink-soft); }
.story__badges{ display:flex; gap:34px; margin-top:28px; }
.story__badge strong{ display:block; font-family:var(--font-head); font-size:1.9rem; color:var(--red); }
.story__badge span{ font-size:.82rem; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em; }
.story__image img{ border-radius:var(--radius); box-shadow:var(--shadow); }

/* ---------- Ruokalista: graafinen, korttipohjainen ulkoasu ---------- */
.section--menu-highlights{ background:var(--cream-dark); }

.menu-tabs{
	display:flex; flex-wrap:wrap; gap:9px; justify-content:center; margin-bottom:40px;
	position:sticky; top:88px; z-index:80; background:var(--cream-dark); padding:14px 10px;
	border-bottom:1px solid #e5dcc0;
}
.menu-tab{
	background:var(--white); border:2px solid transparent; padding:10px 20px; border-radius:100px;
	font-weight:700; font-size:.88rem; cursor:pointer; color:var(--forest-dark); font-family:var(--font-body);
	transition:all .2s ease; white-space:nowrap;
}
.menu-tab:hover{ border-color:var(--gold); transform:translateY(-1px); }
.menu-tab.active{ background:var(--forest-dark); color:#fff; box-shadow:0 6px 16px rgba(18,54,42,.25); }

/* On mobile the floating nav (bottom bar) already provides quick category
   jumping, so the tab row doesn't need to stay pinned while scrolling -
   that ate up too much of the small screen. It just scrolls normally. */
@media (max-width: 780px){
	.menu-tabs{ position:static; top:auto; }
}

/* Each category is a full-width "menu page" card; dishes inside sit in a
   2-column grid, echoing the layout of the original printed menu sheets. */
.menu-grid{ display:flex; flex-direction:column; gap:38px; }

.menu-category{
	background:var(--white); border-radius:var(--radius); padding:34px 36px 38px;
	box-shadow:var(--shadow-sm); scroll-margin-top:160px; border:1px solid #f0e9d2;
	position:relative; overflow:hidden;
}
.menu-category::before{
	content:""; position:absolute; top:0; left:0; right:0; height:5px;
	background:linear-gradient(90deg, var(--gold) 0%, var(--red) 55%, var(--gold) 100%);
}
.menu-category__head{ display:flex; align-items:center; gap:18px; margin-bottom:26px; flex-wrap:wrap; }
.menu-category__head-text{ flex:1; min-width:180px; }
.menu-category__icon{
	width:56px; height:56px; flex-shrink:0; border-radius:50%; background:var(--cream-dark);
	display:flex; align-items:center; justify-content:center; font-size:1.7rem;
	box-shadow:inset 0 0 0 2px var(--gold);
}
.menu-category__title{ font-size:1.6rem; margin-bottom:2px; }
.menu-category__subtitle{ color:var(--ink-soft); font-size:.86rem; margin:0; }

/* Structured price info (pizza header): 3 clearly separated, styled rows
   instead of one long unformatted line. */
.price-info{ margin-top:4px; }
.price-info__row{ margin:0 0 4px; }
.price-info__row:last-child{ margin-bottom:0; }
.price-info__row--sizes{ display:flex; flex-wrap:wrap; gap:8px; }
.price-info__tag{
	display:inline-flex; align-items:baseline; gap:4px; background:var(--forest-dark); color:#fff;
	border-radius:100px; padding:5px 13px; font-size:.82rem; font-weight:700;
}
.price-info__tag em{ font-style:normal; color:var(--gold-light); font-size:.7rem; text-transform:uppercase; letter-spacing:.03em; }
.price-info__row--topping{ color:var(--ink-soft); font-size:.86rem; }
.price-info__row--topping strong{ color:var(--red); font-weight:800; }
.price-info__row--options{ color:var(--ink-soft); font-size:.8rem; }
.price-info__row--options strong{ color:var(--forest-dark); font-weight:700; }
.info-box__title-price{ color:var(--red); font-weight:800; font-family:var(--font-body); font-size:1rem; }
.menu-category__image{ margin:0 0 26px; border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); }

.dish-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px 22px; }

.dish-card{
	background:var(--cream); border:1px solid #eee3c8; border-left:4px solid var(--gold);
	border-radius:10px; padding:16px 18px; transition:transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .2s ease, border-color .2s ease, opacity .45s ease;
	opacity:0; transform:translateY(14px);
}
.dish-card.is-inview{ opacity:1; transform:translateY(0); transition-delay:0s; }
.dish-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-sm); border-left-color:var(--red); }
.dish-grid .dish-card:nth-child(1){ transition-delay:.03s; }
.dish-grid .dish-card:nth-child(2){ transition-delay:.08s; }
.dish-grid .dish-card:nth-child(3){ transition-delay:.13s; }
.dish-grid .dish-card:nth-child(4){ transition-delay:.18s; }
.dish-grid .dish-card:nth-child(5){ transition-delay:.23s; }
.dish-grid .dish-card:nth-child(6){ transition-delay:.28s; }

.dish-card__head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.dish-card__num{
	background:radial-gradient(circle at 32% 28%, var(--forest-light), var(--forest-dark) 70%);
	color:var(--gold-light); font-size:.85rem; font-weight:800; font-family:var(--font-body);
	border-radius:50%; width:32px; height:32px; padding:0; display:inline-flex; align-items:center;
	justify-content:center; flex-shrink:0; box-shadow:0 2px 6px rgba(18,54,42,.35), inset 0 0 0 2px rgba(232,178,60,.6);
}
.dish-card__type-icon{ font-size:1.05rem; flex-shrink:0; line-height:1; filter:saturate(1.1); }
.dish-card__name{ font-family:var(--font-body); font-weight:700; color:var(--ink); font-size:1.02rem; margin:0; line-height:1.3; white-space:nowrap; }
.dish-card__badge{ background:var(--red); color:#fff; font-size:.6rem; font-weight:800; padding:3px 9px; border-radius:100px; letter-spacing:.04em; white-space:nowrap; }
.dish-card__dots{ flex:1; min-width:12px; border-bottom:2px dotted #d2c8a3; align-self:center; margin:0 2px; }
.dish-card__price{ display:flex; align-items:baseline; gap:5px; flex-shrink:0; white-space:nowrap; font-size:.92rem; }
.dish-card__price strong{ color:var(--red); font-weight:800; }
.dish-card__price strong.is-discount{ font-size:1.02rem; }
.dish-card__price s{ color:var(--ink-soft); opacity:.65; font-size:.8rem; font-weight:400; }
.dish-card__sep{ color:#d2c39a; font-weight:400; }
.dish-card__desc{ color:var(--ink-soft); font-size:.83rem; font-style:italic; margin:0; line-height:1.45; padding-left:42px; }

@media (max-width: 480px){
	.dish-card__head{ flex-wrap:wrap; }
	.dish-card__dots{ display:none; }
	.dish-card__price{ flex-basis:100%; padding-left:42px; margin-top:2px; }
}

.menu-empty{ color:var(--ink-soft); font-style:italic; grid-column:1/-1; }

@media (max-width: 780px){
	.menu-category{ padding:26px 20px 30px; }
	.dish-grid{ grid-template-columns:1fr; }
	.menu-category__icon{ width:46px; height:46px; font-size:1.4rem; }
	.menu-category__title{ font-size:1.35rem; }
}

/* ---------- Floating quick-nav ---------- */
.floating-nav{
	position:fixed; right:22px; top:50%; transform:translateY(-50%); z-index:150;
	background:rgba(18,54,42,.94); backdrop-filter:blur(6px); border-radius:20px;
	padding:16px 8px; box-shadow:0 12px 34px rgba(0,0,0,.25); border:1px solid rgba(232,178,60,.25);
	opacity:1; pointer-events:auto; animation:floatingNavIn .5s ease .2s both;
}
@keyframes floatingNavIn{
	from{ opacity:0; }
	to{ opacity:1; }
}
.floating-nav__label{ display:block; text-align:center; color:var(--gold-light); font-size:.62rem; text-transform:uppercase;
	letter-spacing:.1em; font-weight:800; margin-bottom:10px; }
.floating-nav ul{ display:flex; flex-direction:column; gap:4px; }
.floating-nav__link{
	display:flex; flex-direction:column; align-items:center; gap:2px; width:60px; padding:8px 4px;
	border-radius:12px; color:#e9e6da; transition:background .2s ease, color .2s ease;
}
.floating-nav__emoji{ font-size:1.15rem; line-height:1; }
.floating-nav__text{ font-size:.6rem; font-weight:700; text-align:center; line-height:1.15; }
.floating-nav__link:hover{ background:rgba(255,255,255,.08); }
.floating-nav__link.is-active{ background:var(--gold); color:var(--forest-dark); }
.floating-nav__link.is-active .floating-nav__text{ color:var(--forest-dark); }

@media (max-width: 980px){
	.floating-nav{
		right:0; left:0; top:auto; bottom:0; transform:none; border-radius:0;
		padding:8px 6px; display:flex; justify-content:center; border:0; border-top:1px solid rgba(232,178,60,.25);
	}
	.floating-nav__label{ display:none; }
	.floating-nav ul{ flex-direction:row; overflow-x:auto; gap:2px; max-width:100%; scrollbar-width:none; }
	.floating-nav ul::-webkit-scrollbar{ display:none; }
	.floating-nav__link{ width:auto; min-width:64px; padding:6px 10px; flex-shrink:0; }
}

/* Small icon-only order buttons shown in every category header */
.cta-icons{ display:inline-flex; align-items:center; gap:8px; flex-shrink:0; }
.cta-icon{
	width:36px; height:36px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
	background:var(--cream-dark); color:var(--forest-dark); border:1px solid #ecdfb8; flex-shrink:0;
	transition:background .2s ease, transform .2s ease, box-shadow .2s ease; position:relative;
}
.cta-icon:hover{ transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.cta-icon--primary{ background:var(--gold); color:var(--forest-dark); border-color:var(--gold); }
.cta-icon--primary:hover{ background:var(--gold-light); }
.cta-icon--whatsapp{ background:#25d366; color:#fff; border-color:#25d366; }
.cta-icon--whatsapp:hover{ background:#22c15e; }

/* The bag icon has the REAL GloriaFood order button invisibly stretched to
   fill it, so clicking it genuinely opens GloriaFood's ordering widget -
   we only mask its default visual style, never its actual functionality. */
.cta-icon--gf{ overflow:hidden; }
.cta-icon--gf > svg{ position:relative; z-index:1; pointer-events:none; }
.cta-icon__gf-btn{ position:absolute; inset:0; }
.cta-icon__gf-btn a,
.cta-icon__gf-btn button,
.cta-icon__gf-btn iframe{
	position:absolute !important; inset:0 !important; width:100% !important; height:100% !important;
	padding:0 !important; margin:0 !important; border:0 !important; opacity:0 !important; cursor:pointer;
}

/* Step boxes (used for the "Oma Kebab-Annokset" build-your-own flow):
   each of the 3 steps gets its own bordered panel, echoing the same visual
   language as the individual dish cards inside it. */
.step-box{
	background:var(--cream); border:1px solid #eee3c8; border-left:5px solid var(--red);
	border-radius:12px; padding:22px 24px 26px; margin:0 0 22px;
}
.step-box:last-child{ margin-bottom:0; }
.step-box__head{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.step-box__num{
	background:var(--red); color:#fff; width:34px; height:34px; border-radius:50%; flex-shrink:0;
	display:inline-flex; align-items:center; justify-content:center; font-size:1rem; font-weight:800;
	font-family:var(--font-body); box-shadow:0 2px 6px rgba(200,35,42,.35);
}
.step-box__title{ font-family:var(--font-head); font-size:1.2rem; color:var(--forest-dark); margin:0; }
.step-box .dish-grid{ margin:0; }
.step-box .dish-card{ background:var(--white); }
.step-box .chip-grid{ margin:0; }
.step-box .chip{ background:var(--cream-dark); }

/* Info box: used for non-sequential reference lists (e.g. pizza topping
   groups) - same bordered-panel language as step-box, but with a plain
   icon+title head instead of a numbered step. */
.info-box{
	background:var(--cream); border:1px solid #eee3c8; border-left:5px solid var(--gold);
	border-radius:12px; padding:22px 24px 26px; margin-top:8px;
}
.info-box__head{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.info-box__icon{ font-size:1.3rem; line-height:1; }
.info-box__title{ font-family:var(--font-head); font-size:1.1rem; color:var(--forest-dark); margin:0; }
.info-box__group{ margin-bottom:18px; }
.info-box__group:last-child{ margin-bottom:0; }
.info-box .chip{ background:var(--white); }

/* Chip grid: lisukkeet / kastikkeet / pizza-täytteet shown as tappable-looking tags */
.chip-group__title{ font-family:var(--font-body); text-transform:uppercase; letter-spacing:.06em; font-size:.78rem; color:var(--red); margin:22px 0 10px; }
.chip-grid{ display:flex; flex-wrap:wrap; gap:9px; margin-bottom:8px; }
.chip{
	display:inline-flex; align-items:baseline; gap:5px; background:var(--white); border:1px solid #ecdfb8;
	border-radius:8px; padding:8px 14px; font-size:.86rem; font-weight:600; color:var(--ink);
	transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.chip:hover{ border-color:var(--gold); transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.chip__extra{ font-style:normal; color:var(--red); font-weight:800; font-size:.78rem; }

@media (max-width: 480px){
	.menu-category__head{ gap:12px; }
	.cta-icon{ width:32px; height:32px; }
	.step-box{ padding:18px 16px 22px; }
}

/* ---------- Gallery ---------- */
.section--gallery{ background:var(--cream-dark); }
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.gallery-item{ border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); display:block; }
.gallery-item img{ transition:transform .35s ease; aspect-ratio:16/10; object-fit:cover; width:100%; }
.gallery-item:hover img{ transform:scale(1.06); }

/* ---------- Contact ---------- */
.section--contact{ background:var(--forest-dark); color:#f1efe4; scroll-margin-top:90px; }
.section--contact .eyebrow{ color:var(--gold-light); }
.section--contact h2{ color:#fff; }
.contact__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; }
.contact-list{ margin-bottom:26px; }
.contact-list li{ padding:8px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.contact-list a{ color:var(--gold-light); font-weight:600; }
.hours-list li{ display:flex; justify-content:space-between; padding:6px 0; font-size:.92rem; border-bottom:1px dashed rgba(255,255,255,.12); }
.hours-list--contact{ margin-bottom:28px; }
.contact__map{ display:flex; width:100%; }
.contact__cta-row{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:10px; }
.map-embed{
	width:100%; background:var(--forest); border-radius:var(--radius); overflow:hidden;
	border:1px solid rgba(255,255,255,.15); box-shadow:var(--shadow);
}
.map-embed__address{
	display:flex; align-items:center; gap:10px; padding:16px 20px; color:var(--gold-light);
	font-weight:700; font-size:1rem; background:var(--forest-dark);
}
.map-embed iframe{ display:block; width:100%; filter:grayscale(.15) contrast(1.05); }
.map-embed__link{
	display:block; text-align:center; padding:14px; color:var(--gold-light); font-weight:700;
	background:var(--forest); transition:background .2s ease;
}
.map-embed__link:hover{ background:var(--forest-light); }

/* ---------- Footer ---------- */
.site-footer{ background:var(--forest-dark); color:#cfcabb; }
.footer__inner{ display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:40px; padding:64px 24px 40px; }
.footer__brand p{ margin-top:14px; font-size:.9rem; color:#a9a290; }
.footer__col h4{ color:#fff; font-family:var(--font-body); text-transform:uppercase; letter-spacing:.06em; font-size:.85rem; margin-bottom:16px; }
.footer__col p, .footer__col a{ font-size:.9rem; color:#cfcabb; }
.footer__col a:hover{ color:var(--gold-light); }
.footer-menu{ flex-direction:column; align-items:flex-start; gap:10px; margin-bottom:16px; }
.footer__social{ display:flex; gap:16px; }
.footer__social a{ font-weight:700; }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.08); padding:18px 24px; text-align:center; font-size:.8rem; color:#8d876f; }

/* ---------- Generic page/blog ---------- */
.page-hero{ background:var(--forest-dark); color:#fff; padding:70px 0 46px; text-align:center; }
.page-hero h1{ color:#fff; margin:0; }
.content-narrow{ max-width:800px; margin:0 auto; }
.page-thumb{ margin-bottom:30px; border-radius:var(--radius); overflow:hidden; }
.blog-card{ margin-bottom:50px; padding-bottom:50px; border-bottom:1px solid #e7e0c9; }
.blog-card__thumb{ display:block; margin-bottom:16px; border-radius:var(--radius-sm); overflow:hidden; }
.section--404{ text-align:center; padding:120px 0; }

/* ---------- Responsive ---------- */
@media (max-width: 980px){
	.main-navigation{ position:fixed; inset:0 0 0 auto; width:min(320px,85%); background:#fff; padding:100px 30px 30px;
		transform:translateX(100%); transition:transform .3s ease; box-shadow:-10px 0 40px rgba(0,0,0,.15); z-index:99; }
	.main-navigation.is-open{ transform:translateX(0); }
	.nav-menu{ flex-direction:column; align-items:flex-start; gap:22px; }
	.menu-toggle{ display:flex; }
	.header-cta{ display:none; }
	.story__grid, .contact__grid{ grid-template-columns:1fr; }
	.story__image{ order:-1; }
	.gallery-grid{ grid-template-columns:repeat(2,1fr); }
	.footer__inner{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 640px){
	.top-bar__inner{ font-size:.72rem; }
	.hero{ padding:80px 0 60px; }
	.section{ padding:60px 0; }
	.footer__inner{ grid-template-columns:1fr; text-align:left; }
	.gallery-grid{ grid-template-columns:1fr 1fr; }
}