/*
Theme Name: SGS Cafe
Theme URI: https://sgscafe.in
Author: SGS Cafe
Author URI: https://sgscafe.in
Description: A cozy modern cafe theme for SGS Cafe — coffee, bakes and all-day breakfast, with WooCommerce-powered online ordering (Razorpay ready) and built-in reservations, team, testimonials and newsletter management.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: sgs-cafe
Tags: food-and-drink, e-commerce, custom-colors, custom-menu, featured-images, translation-ready
*/

/* Design tokens ------------------------------------------------------- */
:root {
	--background: 36 45% 96%;
	--foreground: 24 40% 14%;
	--card: 0 0% 100%;
	--card-foreground: 24 40% 14%;
	--primary: 22 85% 46%;
	--primary-foreground: 36 60% 97%;
	--secondary: 30 42% 90%;
	--secondary-foreground: 24 45% 20%;
	--muted: 32 32% 91%;
	--muted-foreground: 26 16% 40%;
	--accent: 28 75% 92%;
	--accent-foreground: 22 80% 36%;
	--border: 28 28% 85%;
	--input: 28 28% 80%;
	--ring: 22 85% 46%;
	--radius: 1rem;

	/* Dark "brew" panels (hours, offer, reservation aside, footer) */
	--brew-950: 20 55% 3%;
	--brew-900: 20 55% 11%;
	--brew-800: 20 50% 16%;
	--brew-700: 23 46% 21%;
	--cream: 38 62% 90%;
	--tan: 30 40% 65%;
	--amber: 27 76% 65%;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: "Archivo", ui-sans-serif, system-ui, sans-serif;
	background: hsl(var(--background));
	color: hsl(var(--foreground));
	overflow-x: clip;
	line-height: 1.55;
}

img { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }

.sgs-display, h1, h2, h3 {
	font-family: "Bitter", Georgia, serif;
	margin: 0;
}

.sgs-container {
	max-width: 72rem;
	margin: 0 auto;
	padding: 0 1rem;
}
@media (min-width: 640px) { .sgs-container { padding: 0 1.5rem; } }

.sgs-eyebrow {
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	color: hsl(var(--primary));
}

.sgs-section-head { text-align: center; max-width: 40rem; margin: 0 auto; }
.sgs-section-head h2 { font-size: 1.875rem; font-weight: 700; margin-top: 0.75rem; }
@media (min-width: 640px) { .sgs-section-head h2 { font-size: 2.25rem; } }
.sgs-section-head p { margin-top: 1rem; color: hsl(var(--muted-foreground)); }

.sgs-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	height: 3rem;
	padding: 0 2rem;
	border-radius: 999px;
	font-weight: 600;
	font-size: 1rem;
	background: hsl(var(--primary));
	color: hsl(var(--primary-foreground));
	border: 1px solid transparent;
	cursor: pointer;
	transition: opacity .15s ease, transform .15s ease;
}
.sgs-btn:hover { opacity: .92; }
.sgs-btn--outline {
	background: transparent;
	color: hsl(var(--foreground));
	border-color: hsl(var(--border));
}
.sgs-btn--sm { height: 2.5rem; padding: 0 1.25rem; font-size: .875rem; }
.sgs-btn--dark { background: hsl(var(--brew-950)); color: hsl(var(--cream)); }
.sgs-btn[disabled] { opacity: .55; cursor: not-allowed; }

.sgs-card {
	background: hsl(var(--card));
	border: 1px solid hsl(var(--border));
	border-radius: 1.5rem;
	box-shadow: 0 1px 2px rgb(0 0 0 / 0.04);
}

/* Header ---------------------------------------------------------------- */
.sgs-header {
	position: sticky; top: 0; z-index: 40;
	background: hsl(var(--background) / 0.92);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid hsl(var(--border) / 0.7);
}
.sgs-header__row {
	max-width: 72rem; margin: 0 auto; padding: 0 1rem;
	height: 4rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
@media (min-width: 640px) { .sgs-header__row { padding: 0 1.5rem; } }

.sgs-logo { display: flex; align-items: center; gap: .65rem; }
.sgs-logo__mark {
	display: flex; align-items: center; justify-content: center;
	width: 2.5rem; height: 2.5rem; border-radius: 1rem;
	background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
	font-family: "Bitter", serif; font-weight: 700; font-size: 1.1rem;
}
.sgs-logo__name { font-family: "Bitter", serif; font-weight: 700; font-size: 1.25rem; line-height: 1; display: block; }
.sgs-logo__tag { font-size: .625rem; font-weight: 600; text-transform: uppercase; letter-spacing: .22em; color: hsl(var(--muted-foreground)); display: block; margin-top: .2rem; }
.sgs-logo--light .sgs-logo__name { color: hsl(var(--cream)); }
.sgs-logo--light .sgs-logo__tag { color: hsl(var(--tan)); }

.sgs-nav { display: none; align-items: center; gap: 1.5rem; }
@media (min-width: 1024px) { .sgs-nav { display: flex; } }
.sgs-nav a { font-size: .875rem; font-weight: 500; color: hsl(var(--muted-foreground)); }
.sgs-nav a:hover { color: hsl(var(--primary)); }

.sgs-header__actions { display: flex; align-items: center; gap: .5rem; }
.sgs-header__reserve { display: none; }
@media (min-width: 768px) { .sgs-header__reserve { display: inline-flex; } }

.sgs-icon-btn {
	position: relative;
	display: flex; align-items: center; justify-content: center;
	width: 2.75rem; height: 2.75rem; border-radius: 999px;
	border: 1px solid hsl(var(--border)); background: hsl(var(--card));
	cursor: pointer;
}
.sgs-icon-btn:hover { background: hsl(var(--accent)); }
.sgs-cart-count {
	position: absolute; top: -.25rem; right: -.25rem;
	min-width: 1.25rem; height: 1.25rem; padding: 0 .25rem;
	display: flex; align-items: center; justify-content: center;
	border-radius: 999px; background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
	font-size: .6875rem; font-weight: 700;
}
.sgs-mobile-toggle { display: flex; }
@media (min-width: 1024px) { .sgs-mobile-toggle { display: none; } }

.sgs-mobile-nav { display: none; border-top: 1px solid hsl(var(--border)); padding: 1rem; }
.sgs-mobile-nav.is-open { display: block; }
.sgs-mobile-nav a { display: block; padding: .65rem .75rem; border-radius: .75rem; font-weight: 500; }
.sgs-mobile-nav a:hover { background: hsl(var(--accent)); }
.sgs-mobile-nav .sgs-mobile-reserve { margin-top: .5rem; text-align: center; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-weight: 600; }
@media (min-width: 1024px) { .sgs-mobile-nav { display: none !important; } }

/* Hero -------------------------------------------------------------------*/
.sgs-hero { position: relative; overflow: hidden; }
.sgs-hero__glow {
	position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(60% 50% at 50% 0%, hsl(28 80% 90% / .9) 0%, transparent 70%);
}
.sgs-hero__inner { position: relative; max-width: 72rem; margin: 0 auto; padding: 4rem 1rem; text-align: center; }
@media (min-width: 640px) { .sgs-hero__inner { padding: 6rem 1.5rem 4rem; } }
.sgs-badge {
	display: inline-flex; align-items: center; gap: .5rem;
	border: 1px solid hsl(var(--border)); background: hsl(var(--card));
	padding: .4rem 1rem; border-radius: 999px;
	font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .18em; color: hsl(var(--primary));
}
.sgs-hero h1 { max-width: 46rem; margin: 1.5rem auto 0; font-size: 2.75rem; font-weight: 700; line-height: 1.05; }
@media (min-width: 640px) { .sgs-hero h1 { font-size: 3.75rem; } }
@media (min-width: 1024px) { .sgs-hero h1 { font-size: 4.5rem; } }
.sgs-hero h1 span { color: hsl(var(--primary)); }
.sgs-hero__lede { max-width: 34rem; margin: 1.5rem auto 0; font-size: 1.125rem; color: hsl(var(--muted-foreground)); }
.sgs-hero__ctas { margin-top: 2rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; }
@media (min-width: 640px) { .sgs-hero__ctas { flex-direction: row; } }
.sgs-hero__stats { max-width: 32rem; margin: 2.5rem auto 0; display: flex; align-items: center; justify-content: center; gap: 2rem; text-align: center; }
.sgs-hero__stats b { display: block; font-family: "Bitter", serif; font-size: 1.75rem; font-weight: 700; }
.sgs-hero__stats span { display: block; margin-top: .25rem; font-size: .7rem; font-weight: 500; text-transform: uppercase; letter-spacing: .1em; color: hsl(var(--muted-foreground)); }
.sgs-hero__stat-divider { width: 1px; height: 2.5rem; background: hsl(var(--border)); }
.sgs-hero__figure { position: relative; max-width: 56rem; margin: 3.5rem auto 0; }
.sgs-hero__figure img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 2rem; border: 1px solid hsl(var(--border)); box-shadow: 0 25px 50px -12px rgb(120 53 15 / .25); }
.sgs-hero__pin { position: absolute; display: none; border-radius: 1rem; padding: .75rem 1rem; box-shadow: 0 10px 25px -5px rgb(0 0 0 / .2); background: hsl(var(--card)); border: 1px solid hsl(var(--border)); }
@media (min-width: 640px) { .sgs-hero__pin { display: block; } }
.sgs-hero__pin--left { left: -.75rem; top: 2rem; transform: rotate(-4deg); }
.sgs-hero__pin--right { right: -.75rem; bottom: 2rem; transform: rotate(3deg); background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.sgs-hero__pin p { font-size: .75rem; font-weight: 600; margin-top: .25rem; }
.sgs-hero__pin small { display: block; font-size: .625rem; text-transform: uppercase; letter-spacing: .15em; opacity: .8; margin-top: .1rem; }
.sgs-stars { color: hsl(var(--primary)); }
.sgs-hero__pin--right .sgs-stars { color: inherit; }

/* Category browser --------------------------------------------------------*/
.sgs-categories { border-top: 1px solid hsl(var(--border)); border-bottom: 1px solid hsl(var(--border)); background: hsl(var(--card)); padding: 4rem 0; }
.sgs-categories__grid { margin-top: 3rem; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 640px) { .sgs-categories__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .sgs-categories__grid { grid-template-columns: repeat(6, 1fr); } }
.sgs-category {
	display: block; text-align: center; padding: 1rem; border-radius: 1.5rem;
	border: 1px solid hsl(var(--border)); background: hsl(var(--background));
	transition: transform .15s ease, box-shadow .15s ease;
}
.sgs-category:hover { transform: translateY(-4px); box-shadow: 0 10px 25px -5px rgb(120 53 15 / .1); }
.sgs-category__num { font-size: .6875rem; font-weight: 700; letter-spacing: .15em; color: hsl(var(--muted-foreground)); }
.sgs-category img { margin: .5rem auto 0; aspect-ratio: 1/1; width: 100%; object-fit: cover; border-radius: 1rem; }
.sgs-category h3 { margin-top: .75rem; font-size: 1rem; font-weight: 700; }
.sgs-category p { margin-top: .25rem; font-size: .75rem; color: hsl(var(--muted-foreground)); }

/* Menu ---------------------------------------------------------------- */
.sgs-menu { padding: 4rem 0; }
.sgs-menu__grid { margin-top: 3rem; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .sgs-menu__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .sgs-menu__grid { grid-template-columns: repeat(3, 1fr); } }
.sgs-menu-card { overflow: hidden; display: flex; flex-direction: column; }
.sgs-menu-card__media { position: relative; }
.sgs-menu-card__media img { aspect-ratio: 4/3; width: 100%; object-fit: cover; }
.sgs-menu-card__ribbon { position: absolute; left: .75rem; top: .75rem; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; padding: .25rem .65rem; border-radius: 999px; }
.sgs-menu-card__body { padding: 1.25rem; display: flex; flex-direction: column; flex: 1; }
.sgs-menu-card__body h3 { font-size: 1.125rem; font-weight: 700; }
.sgs-menu-card__body p { margin-top: .4rem; font-size: .875rem; color: hsl(var(--muted-foreground)); }
.sgs-menu-card__footer { margin-top: auto; padding-top: .75rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.sgs-menu-card__price { font-family: "Bitter", serif; font-size: 1.25rem; font-weight: 700; color: hsl(var(--primary)); }
.sgs-menu-empty { max-width: 28rem; margin: 3rem auto 0; text-align: center; padding: 3.5rem 2rem; border: 1px dashed hsl(var(--border)); border-radius: 1.5rem; background: hsl(var(--card)); color: hsl(var(--muted-foreground)); }

/* Offer banner ---------------------------------------------------------*/
.sgs-offer { background: hsl(var(--brew-900)); color: hsl(var(--cream)); }
.sgs-offer__grid { max-width: 72rem; margin: 0 auto; padding: 4rem 1rem; display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .sgs-offer__grid { grid-template-columns: 1fr 1fr; padding: 5rem 1.5rem; } }
.sgs-offer__flame { display: inline-flex; align-items: center; gap: .5rem; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .18em; padding: .4rem 1rem; border-radius: 999px; }
.sgs-offer h2 { margin-top: 1.25rem; font-size: 2.25rem; font-weight: 700; line-height: 1.15; }
@media (min-width: 640px) { .sgs-offer h2 { font-size: 3rem; } }
.sgs-offer h2 span { color: hsl(var(--amber)); }
.sgs-offer p { margin-top: 1rem; max-width: 26rem; color: hsl(var(--tan)); }
.sgs-countdown { margin-top: 2rem; display: flex; gap: .75rem; flex-wrap: wrap; }
.sgs-countdown div { width: 4.5rem; padding: .75rem; border-radius: 1rem; border: 1px solid hsl(var(--brew-700)); background: hsl(var(--brew-800)); text-align: center; }
.sgs-countdown b { display: block; font-family: "Bitter", serif; font-size: 1.5rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.sgs-countdown span { display: block; margin-top: .25rem; font-size: .625rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: hsl(var(--tan)); }
.sgs-offer__figure { position: relative; }
.sgs-offer__figure img { aspect-ratio: 3/2; width: 100%; object-fit: cover; border-radius: 2rem; border: 4px solid hsl(var(--brew-700)); transform: rotate(1.5deg); }
.sgs-offer__discount { position: absolute; top: -1rem; right: 1.5rem; transform: rotate(-6deg); background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-family: "Bitter", serif; font-weight: 700; font-size: 1.125rem; padding: .5rem 1.25rem; border-radius: 999px; }

/* Story ----------------------------------------------------------------*/
.sgs-story { padding: 4rem 0; }
.sgs-story__grid { max-width: 72rem; margin: 0 auto; padding: 0 1rem; display: grid; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .sgs-story__grid { grid-template-columns: 1fr 1fr; padding: 0 1.5rem; } }
.sgs-story__media { position: relative; }
.sgs-story__media img { border-radius: 2rem; border: 1px solid hsl(var(--border)); width: 100%; }
.sgs-story__media figcaption { margin-top: .5rem; font-size: .75rem; color: hsl(var(--muted-foreground)); }
.sgs-story__detail { position: absolute; width: 11rem; right: -0.5rem; bottom: -2.5rem; transform: rotate(3deg); display: none; }
@media (min-width: 640px) { .sgs-story__detail { display: block; } }
.sgs-story__detail img { border-radius: 1.5rem; border: 4px solid hsl(var(--background)); }
.sgs-story__body h2 { font-size: 1.875rem; margin-top: .75rem; }
@media (min-width: 640px) { .sgs-story__body h2 { font-size: 2.25rem; } }
.sgs-story__body h2 span { color: hsl(var(--primary)); }
.sgs-story__body p { margin-top: 1rem; color: hsl(var(--muted-foreground)); }
.sgs-story__stats { margin-top: 2rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.sgs-story__stats div { text-align: center; padding: 1rem; }
.sgs-story__stats b { display: block; font-family: "Bitter", serif; font-size: 1.5rem; font-weight: 700; color: hsl(var(--primary)); }
.sgs-story__stats span { display: block; margin-top: .25rem; font-size: .6875rem; font-weight: 500; text-transform: uppercase; letter-spacing: .08em; color: hsl(var(--muted-foreground)); }

/* Team -------------------------------------------------------------------*/
.sgs-team { border-top: 1px solid hsl(var(--border)); border-bottom: 1px solid hsl(var(--border)); background: hsl(var(--card)); padding: 4rem 0; }
.sgs-team__grid { margin-top: 3rem; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .sgs-team__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .sgs-team__grid { grid-template-columns: repeat(3, 1fr); } }
.sgs-team-card { overflow: hidden; border-radius: 1.5rem; border: 1px solid hsl(var(--border)); background: hsl(var(--background)); }
.sgs-team-card img { aspect-ratio: 3/4; width: 100%; object-fit: cover; }
.sgs-team-card__body { padding: 1.25rem; }
.sgs-team-card__body h3 { font-size: 1.125rem; font-weight: 700; }
.sgs-team-card__body .role { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: hsl(var(--primary)); }
.sgs-team-card__body .quote { margin-top: .75rem; font-size: .875rem; font-style: italic; color: hsl(var(--muted-foreground)); }

/* Hours ----------------------------------------------------------------*/
.sgs-hours { background: hsl(var(--brew-900)); color: hsl(var(--cream)); }
.sgs-hours__grid { max-width: 72rem; margin: 0 auto; padding: 3.5rem 1rem; display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .sgs-hours__grid { grid-template-columns: 1.2fr 1fr; padding: 3.5rem 1.5rem; } }
.sgs-hours h2 { margin-top: .75rem; font-size: 1.875rem; }
@media (min-width: 640px) { .sgs-hours h2 { font-size: 2.25rem; } }
.sgs-hours__rows { margin-top: 1.5rem; }
.sgs-hours__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: .75rem; margin-bottom: .75rem; border-bottom: 1px solid hsl(var(--brew-700)); }
.sgs-hours__row span:first-child { font-size: .875rem; color: hsl(var(--tan)); }
.sgs-hours__row span:last-child { font-family: "Bitter", serif; font-size: 1.125rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.sgs-hours__card { border: 1px solid hsl(var(--brew-700)); background: hsl(var(--brew-800)); border-radius: 1.5rem; padding: 2rem; text-align: center; }
.sgs-hours__card p:first-child { font-family: "Bitter", serif; font-size: 1.5rem; font-weight: 700; }
.sgs-hours__card p.desc { margin-top: .75rem; font-size: .875rem; color: hsl(var(--tan)); }
.sgs-hours__card .info { margin-top: 1.25rem; font-size: .875rem; color: hsl(var(--tan)); }

/* Testimonials -----------------------------------------------------------*/
.sgs-reviews { padding: 4rem 0; }
.sgs-reviews__grid { margin-top: 3rem; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .sgs-reviews__grid { grid-template-columns: repeat(3, 1fr); } }
.sgs-review { padding: 1.5rem; display: flex; flex-direction: column; }
.sgs-review blockquote { margin: 1rem 0 0; font-size: .875rem; color: hsl(var(--muted-foreground)); flex: 1; }
.sgs-review footer { margin-top: 1.25rem; display: flex; align-items: center; gap: .75rem; }
.sgs-review .avatar { width: 2.5rem; height: 2.5rem; border-radius: 999px; background: hsl(var(--accent)); color: hsl(var(--primary)); display: flex; align-items: center; justify-content: center; font-family: "Bitter", serif; font-weight: 700; }
.sgs-review .name { font-size: .875rem; font-weight: 600; display: block; }
.sgs-review .context { font-size: .75rem; color: hsl(var(--muted-foreground)); display: block; }

/* Reservation --------------------------------------------------------- */
.sgs-reserve { border-top: 1px solid hsl(var(--border)); border-bottom: 1px solid hsl(var(--border)); background: hsl(var(--card)); }
.sgs-reserve__grid { max-width: 72rem; margin: 0 auto; padding: 4rem 1rem; display: grid; gap: 2.5rem; }
@media (min-width: 1024px) { .sgs-reserve__grid { grid-template-columns: 1fr 1.3fr; padding: 5rem 1.5rem; } }
.sgs-reserve__aside { border-radius: 1.5rem; background: hsl(var(--brew-900)); color: hsl(var(--cream)); padding: 2rem; }
.sgs-reserve__aside h2 { margin-top: .75rem; font-size: 1.875rem; }
.sgs-reserve__aside p { margin-top: 1rem; font-size: .875rem; color: hsl(var(--tan)); }
.sgs-reserve__aside ul { list-style: none; margin: 2rem 0 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; font-size: .875rem; color: hsl(var(--tan)); }
.sgs-reserve__aside li { display: flex; gap: .75rem; align-items: flex-start; }
.sgs-reserve form { border-radius: 1.5rem; border: 1px solid hsl(var(--border)); background: hsl(var(--background)); padding: 1.5rem; }
@media (min-width: 640px) { .sgs-reserve form { padding: 2rem; } }
.sgs-form-grid { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .sgs-form-grid { grid-template-columns: 1fr 1fr; } }
.sgs-form-grid .full { grid-column: 1 / -1; }
.sgs-field label { display: block; font-size: .8125rem; font-weight: 600; margin-bottom: .4rem; }
.sgs-field input, .sgs-field select, .sgs-field textarea {
	width: 100%; height: 2.75rem; border-radius: .75rem; border: 1px solid hsl(var(--input));
	background: hsl(var(--background)); padding: 0 .75rem; font-size: .875rem; font-family: inherit; color: hsl(var(--foreground));
}
.sgs-field textarea { height: auto; padding: .6rem .75rem; }
.sgs-reserve .sgs-btn { margin-top: 1.5rem; width: 100%; }
.sgs-form-msg { margin-top: 1rem; font-size: .875rem; display: none; padding: .75rem 1rem; border-radius: .75rem; }
.sgs-form-msg.is-success { display: block; background: hsl(140 45% 92%); color: hsl(140 45% 25%); }
.sgs-form-msg.is-error { display: block; background: hsl(0 60% 94%); color: hsl(0 60% 35%); }

/* Blog ------------------------------------------------------------------*/
.sgs-blog { padding: 4rem 0; }
.sgs-blog__grid { margin-top: 3rem; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .sgs-blog__grid { grid-template-columns: repeat(3, 1fr); } }
.sgs-blog-card { overflow: hidden; }
.sgs-blog-card img { aspect-ratio: 3/2; width: 100%; object-fit: cover; }
.sgs-blog-card__body { padding: 1.5rem; }
.sgs-blog-card__meta { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: hsl(var(--muted-foreground)); }
.sgs-blog-card h3 { margin-top: .5rem; font-size: 1.125rem; font-weight: 700; line-height: 1.35; }
.sgs-blog-card p { margin-top: .5rem; font-size: .875rem; color: hsl(var(--muted-foreground)); }

/* Newsletter -------------------------------------------------------------*/
.sgs-newsletter { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.sgs-newsletter__inner { max-width: 72rem; margin: 0 auto; padding: 3.5rem 1rem; display: flex; flex-direction: column; align-items: center; text-align: center; }
.sgs-newsletter__icon { width: 3rem; height: 3rem; border-radius: 999px; background: hsl(var(--primary-foreground) / .15); display: flex; align-items: center; justify-content: center; }
.sgs-newsletter h2 { margin-top: 1.25rem; font-size: 1.875rem; }
@media (min-width: 640px) { .sgs-newsletter h2 { font-size: 2.25rem; } }
.sgs-newsletter p { margin-top: .75rem; max-width: 28rem; font-size: .875rem; opacity: .9; }
.sgs-newsletter form { margin-top: 1.75rem; width: 100%; max-width: 28rem; display: flex; flex-direction: column; gap: .75rem; }
@media (min-width: 640px) { .sgs-newsletter form { flex-direction: row; } }
.sgs-newsletter input[type=email] { flex: 1; height: 3rem; border-radius: 999px; border: none; padding: 0 1.25rem; font-size: .875rem; }
.sgs-newsletter .sgs-btn { background: hsl(var(--brew-900)); color: hsl(var(--cream)); }

/* Contact ------------------------------------------------------------- */
.sgs-contact { padding: 4rem 0; }
.sgs-contact__grid { margin-top: 3rem; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 1024px) { .sgs-contact__grid { grid-template-columns: 1fr 1fr; } }
.sgs-contact__cards { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .sgs-contact__cards { grid-template-columns: 1fr 1fr; } }
.sgs-contact-card { padding: 1.5rem; }
.sgs-contact-card .icon { width: 2.75rem; height: 2.75rem; border-radius: 1rem; background: hsl(var(--accent)); display: flex; align-items: center; justify-content: center; color: hsl(var(--primary)); }
.sgs-contact-card h3 { margin-top: 1rem; font-size: 1.125rem; font-weight: 700; }
.sgs-contact-card p { margin-top: .25rem; font-size: .875rem; color: hsl(var(--muted-foreground)); }
.sgs-contact__map { overflow: hidden; border-radius: 1.5rem; border: 1px solid hsl(var(--border)); min-height: 320px; }
.sgs-contact__map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; }

/* Footer -----------------------------------------------------------------*/
.sgs-footer { background: hsl(var(--brew-950)); color: hsl(var(--cream)); }
.sgs-footer__grid { max-width: 72rem; margin: 0 auto; padding: 3.5rem 1rem; display: grid; gap: 2.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .sgs-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .sgs-footer__grid { grid-template-columns: repeat(4, 1fr); } }
.sgs-footer p.desc { margin-top: 1rem; max-width: 20rem; font-size: .875rem; color: hsl(var(--tan)); }
.sgs-footer h3 { font-size: 1.125rem; font-weight: 600; }
.sgs-footer ul { list-style: none; margin: 1rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.sgs-footer ul a, .sgs-footer ul span { font-size: .875rem; color: hsl(var(--tan)); }
.sgs-footer ul a:hover { color: hsl(var(--cream)); }
.sgs-footer ul li { display: flex; align-items: flex-start; gap: .5rem; }
.sgs-footer .hours-time { display: block; color: hsl(var(--cream)); }
.sgs-footer__bottom { border-top: 1px solid hsl(23 46% 15%); }
.sgs-footer__bottom-inner { max-width: 72rem; margin: 0 auto; padding: 1.25rem 1rem; display: flex; flex-direction: column; gap: .5rem; align-items: center; justify-content: space-between; font-size: .75rem; color: hsl(var(--tan)); }
@media (min-width: 640px) { .sgs-footer__bottom-inner { flex-direction: row; padding: 1.25rem 1.5rem; } }

/* Utility ------------------------------------------------------------- */
.screen-reader-text { position: absolute !important; clip: rect(1px,1px,1px,1px); overflow: hidden; height: 1px; width: 1px; }
