/* ==========================================================================
   Grooveneck Core – package cards and quote form
   Uses the Grooveneck theme's design tokens (theme.json presets) with
   fallbacks, so it matches the theme and still works without it.
   ========================================================================== */

.gnc-packages,
.gnq {
	--gnc-base: var(--wp--preset--color--base, #071321);
	--gnc-surface: var(--wp--preset--color--surface, #10263C);
	--gnc-raised: var(--wp--preset--color--surface-raised, #16324F);
	--gnc-border: var(--wp--preset--color--border, #24476A);
	--gnc-accent: var(--wp--preset--color--accent, #168BEB);
	--gnc-hi: var(--wp--preset--color--highlight, #59BCFF);
	--gnc-text: var(--wp--preset--color--contrast, #F4F8FC);
	--gnc-muted: var(--wp--preset--color--muted, #C3D2E1);
	--gnc-ok: var(--wp--preset--color--success, #4FD18B);
	--gnc-err: var(--wp--preset--color--error, #FF7A7A);
	--gnc-hair: color-mix(in srgb, var(--gnc-border) 70%, transparent);
	--gnc-ease: cubic-bezier(.2, .7, .2, 1);
	color: var(--gnc-text);
}

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.gnc-notice {
	padding: 1rem 1.25rem;
	border: 1px dashed var(--wp--preset--color--border, #24476A);
	border-radius: 12px;
	color: var(--wp--preset--color--muted, #C3D2E1);
}

/* --------------------------------------------------------------------------
   Package cards
   -------------------------------------------------------------------------- */
.gnc-packages-block { margin-block-start: var(--wp--preset--spacing--50, 3rem); }

.gnc-packages__grid {
	--gnc-gap: clamp(1rem, 1.8vw, 1.5rem);
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--gnc-gap);
}
.gnc-package {
	margin: 0;
	display: flex;
	flex: 0 1 calc((100% - 3 * var(--gnc-gap)) / 4);
	min-width: 0;
}
.gnc-packages[data-cols="3"] .gnc-package { flex-basis: calc((100% - 2 * var(--gnc-gap)) / 3); }
.gnc-packages[data-cols="2"] .gnc-package { flex-basis: calc((100% - var(--gnc-gap)) / 2); }
.gnc-packages[data-cols="1"] .gnc-package { flex-basis: min(100%, 26rem); }

@media (max-width: 1180px) {
	.gnc-packages[data-cols="4"] .gnc-package { flex-basis: calc((100% - var(--gnc-gap)) / 2); }
}
@media (max-width: 960px) {
	.gnc-packages[data-cols="3"] .gnc-package { flex-basis: calc((100% - var(--gnc-gap)) / 2); }
}
@media (max-width: 640px) {
	.gnc-packages .gnc-package { flex-basis: 100% !important; }
}

.gnc-package__inner {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: clamp(1.5rem, 2.2vw, 2rem);
	background: var(--gnc-surface);
	border: 1px solid var(--gnc-hair);
	border-radius: 20px;
	transition: transform .35s var(--gnc-ease), border-color .35s ease, box-shadow .35s ease;
}
.gnc-package__inner > * { margin: 0; }
.gnc-package:hover .gnc-package__inner {
	transform: translateY(-4px);
	border-color: color-mix(in srgb, var(--gnc-hi) 45%, transparent);
	box-shadow: 0 24px 50px -26px rgba(0, 0, 0, .75);
}
.gnc-package:focus-within .gnc-package__inner { border-color: var(--gnc-hi); }

/* Recommended: one clear accent, no scaling, so cards keep equal rhythm. */
.gnc-package.is-recommended .gnc-package__inner {
	background:
		linear-gradient(180deg, color-mix(in srgb, var(--gnc-hi) 9%, transparent) 0%, transparent 42%),
		var(--gnc-surface);
	border: 1.5px solid color-mix(in srgb, var(--gnc-hi) 75%, transparent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--gnc-hi) 8%, transparent), 0 24px 60px -30px color-mix(in srgb, var(--gnc-accent) 60%, transparent);
}
.gnc-package__badge {
	position: absolute;
	top: -0.8rem;
	left: clamp(1.5rem, 2.2vw, 2rem);
	padding: .3rem .8rem;
	border-radius: 999px;
	background: var(--gnc-hi);
	color: var(--gnc-base);
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	line-height: 1.3;
}

.gnc-package__label {
	align-self: flex-start;
	margin-bottom: .9rem !important;
	padding: .25rem .65rem;
	border-radius: 999px;
	border: 1px solid var(--gnc-border);
	color: var(--gnc-muted);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .04em;
}

.gnc-package__name {
	font-size: 1.3125rem !important;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--gnc-text);
}

.gnc-package__price {
	margin-top: .9rem !important;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .1rem .45rem;
	line-height: 1.05;
}
.gnc-package__prefix {
	font-size: .9375rem;
	font-weight: 600;
	color: var(--gnc-muted);
}
.gnc-package__amount {
	font-size: clamp(2rem, 1.6rem + 1vw, 2.5rem);
	font-weight: 800;
	letter-spacing: -0.03em;
	white-space: nowrap;
	color: var(--gnc-text);
}
.gnc-package__amount.is-text {
	font-size: clamp(1.375rem, 1.2rem + .5vw, 1.625rem);
	letter-spacing: -0.015em;
	white-space: normal;
	color: var(--gnc-hi);
}
.gnc-package__vat { margin-top: .35rem !important; font-size: .8125rem; color: var(--gnc-muted); }

.gnc-package__desc {
	margin-top: 1rem !important;
	color: var(--gnc-muted);
	font-size: .975rem;
	line-height: 1.6;
}

.gnc-package__list-title {
	margin-top: 1.25rem !important;
	padding-top: 1.1rem;
	border-top: 1px solid var(--gnc-hair);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gnc-muted);
}
.gnc-package__extras + .gnc-package__list-title,
.gnc-package__features + .gnc-package__list-title { border-top: 0; padding-top: 0; }

.gnc-package__features,
.gnc-package__extras {
	list-style: none;
	margin: .75rem 0 0 !important;
	padding: 0;
	display: grid;
	gap: .55rem;
	font-size: .9375rem;
	line-height: 1.45;
}
.gnc-package__features li,
.gnc-package__extras li { position: relative; padding-left: 1.75rem; margin: 0; }
.gnc-package__features li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .08em;
	width: 1.125rem;
	height: 1.125rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--gnc-hi) 16%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gnc-hi) 45%, transparent);
}
.gnc-package__features li::after {
	content: "";
	position: absolute;
	left: .38rem;
	top: calc(.08em + .24rem);
	width: .34rem;
	height: .56rem;
	border: solid var(--gnc-hi);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
.gnc-package__extras { color: var(--gnc-muted); }
.gnc-package__extras li::before {
	content: "+";
	position: absolute;
	left: .3rem;
	top: -.05em;
	font-weight: 800;
	color: var(--gnc-hi);
}

.gnc-package__action { margin-top: auto !important; padding-top: 1.75rem; display: block; width: 100%; }
.gnc-package__button { width: 100%; justify-content: center; box-sizing: border-box; }

.gnc-packages__notes {
	max-width: 52rem;
	margin: clamp(1.75rem, 3vw, 2.5rem) auto 0;
	display: grid;
	gap: .5rem;
	text-align: center;
}
.gnc-packages__note { margin: 0; font-size: .9375rem; line-height: 1.6; color: var(--gnc-muted); }
.gnc-packages__note:first-child { color: var(--gnc-text); font-weight: 600; }

/* --------------------------------------------------------------------------
   Quote form
   -------------------------------------------------------------------------- */
.gnq { scroll-margin-top: 100px; }
.gnq-form { display: grid; gap: clamp(1.75rem, 3vw, 2.5rem); }
.gnq-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.gnq-legend {
	padding: 0;
	margin-bottom: 1rem;
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--gnc-text);
}
.gnq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 1.25rem; }
@media (max-width: 680px) { .gnq-grid { grid-template-columns: 1fr; } }

.gnq-field { display: grid; gap: .45rem; align-content: start; min-width: 0; }
.gnq-field > label:first-child,
.gnq-label { font-weight: 600; font-size: .9375rem; color: var(--gnc-text); }
.gnq-req { color: var(--gnc-hi); }
.gnq-opt { font-weight: 400; color: var(--gnc-muted); font-size: .875rem; }
.gnq-hint { margin: -.35rem 0 1rem; font-size: .9375rem; color: var(--gnc-muted); }
.gnq-hint--price { margin: 1rem 0 0; font-size: .875rem; }

.gnq input[type="text"],
.gnq input[type="email"],
.gnq input[type="tel"],
.gnq input[type="date"],
.gnq input[type="time"],
.gnq select,
.gnq textarea {
	width: 100%;
	box-sizing: border-box;
	min-height: 52px;
	padding: .8rem 1rem;
	border: 1px solid var(--gnc-border);
	border-radius: 12px;
	background: var(--gnc-surface);
	color: var(--gnc-text);
	font: inherit;
	font-size: 1rem; /* 16px prevents iOS zoom */
	line-height: 1.4;
	color-scheme: dark;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.gnq textarea { min-height: 140px; resize: vertical; }
.gnq ::placeholder { color: color-mix(in srgb, var(--gnc-muted) 70%, transparent); }
.gnq select {
	appearance: none;
	padding-right: 2.75rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2359BCFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 1.1rem;
}
.gnq input:hover, .gnq select:hover, .gnq textarea:hover { border-color: color-mix(in srgb, var(--gnc-hi) 45%, var(--gnc-border)); }
.gnq input:focus-visible, .gnq select:focus-visible, .gnq textarea:focus-visible {
	outline: none;
	border-color: var(--gnc-hi);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--gnc-hi) 30%, transparent);
}
.gnq input:disabled { opacity: .45; }
.gnq [aria-invalid="true"] { border-color: var(--gnc-err) !important; }

.gnq-times { display: flex; align-items: center; gap: .6rem; }
.gnq-times input { flex: 1; min-width: 0; }
.gnq-times > span { color: var(--gnc-muted); }

/* Checkboxes */
.gnq-check { display: flex; align-items: flex-start; gap: .7rem; cursor: pointer; line-height: 1.4; }
.gnq-check input {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	margin: .1rem 0 0;
	accent-color: var(--gnc-hi);
	cursor: pointer;
}
.gnq-check--inline { margin-top: .25rem; font-size: .9375rem; color: var(--gnc-muted); }

.gnq-services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
@media (max-width: 680px) { .gnq-services { grid-template-columns: 1fr; } }
.gnq-service {
	padding: 1rem 1.1rem;
	border: 1px solid var(--gnc-border);
	border-radius: 14px;
	background: color-mix(in srgb, var(--gnc-surface) 70%, transparent);
	transition: border-color .2s ease, background-color .2s ease;
	align-self: start;
}
.gnq-service.is-open { border-color: color-mix(in srgb, var(--gnc-hi) 60%, transparent); background: var(--gnc-surface); }
.gnq-check--service { font-weight: 700; font-size: 1.0625rem; min-height: 28px; align-items: center; }
.gnq-check--service input { margin-top: 0; }
.gnq-service__packages {
	display: grid;
	gap: .6rem;
	margin-top: .9rem;
	padding-top: .9rem;
	border-top: 1px solid var(--gnc-hair);
}
.gnq-form.is-enhanced .gnq-service:not(.is-open) .gnq-service__packages { display: none; }
.gnq-sub { margin: 0; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gnc-muted); }
.gnq-check--package { font-size: .9375rem; }
.gnq-price { display: block; font-size: .8125rem; color: var(--gnc-muted); }

/* Messages */
.gnq-error { margin: 0; font-size: .875rem; font-weight: 600; color: var(--gnc-err); display: flex; gap: .4rem; }
.gnq-error::before { content: "!"; display: inline-grid; place-items: center; flex-shrink: 0; width: 1.1rem; height: 1.1rem; border-radius: 999px; background: var(--gnc-err); color: var(--gnc-base); font-size: .75rem; font-weight: 800; margin-top: .1rem; }
.gnq-fieldset > .gnq-error { margin-bottom: 1rem; }

.gnq-summary, .gnq-success, .gnq-selected {
	margin-bottom: 1.75rem;
	padding: 1.25rem 1.4rem;
	border-radius: 16px;
	border: 1px solid;
}
.gnq-summary { border-color: var(--gnc-err); background: color-mix(in srgb, var(--gnc-err) 8%, transparent); }
.gnq-summary__title, .gnq-success__title, .gnq-selected__title { margin: 0 0 .5rem; font-weight: 800; font-size: 1.0625rem; }
.gnq-summary ul, .gnq-selected ul { margin: 0; padding-left: 1.2rem; display: grid; gap: .3rem; }
.gnq-summary a { color: var(--gnc-text); }
.gnq-success { border-color: var(--gnc-ok); background: color-mix(in srgb, var(--gnc-ok) 8%, transparent); }
.gnq-success p { margin: 0 0 .5rem; }
.gnq-success p:last-child { margin: 0; }
.gnq-success__title { color: var(--gnc-ok); font-size: 1.25rem; }
.gnq-selected { border-color: color-mix(in srgb, var(--gnc-hi) 60%, transparent); background: color-mix(in srgb, var(--gnc-hi) 7%, transparent); }
.gnq-selected li span { color: var(--gnc-muted); }
.gnq-selected__hint { margin: .6rem 0 0; font-size: .9375rem; color: var(--gnc-muted); }
.gnq-summary:focus, .gnq-success:focus { outline: 2px solid var(--gnc-hi); outline-offset: 3px; }

.gnq-privacy { margin: 0; font-size: .875rem; color: var(--gnc-muted); max-width: 44rem; }
.gnq-privacy a { color: var(--gnc-hi); }
.gnq-submit { margin: 0; }
.gnq-submit .wp-block-button__link { font-size: 1.0625rem; padding: 1rem 2rem; }
.gnq-submit [aria-disabled="true"] { opacity: .7; pointer-events: none; }
@media (max-width: 600px) { .gnq-submit, .gnq-submit .wp-block-button__link { width: 100%; } }
.gnq-required-note { margin: -1.25rem 0 0; font-size: .8125rem; color: var(--gnc-muted); }

/* Honeypot: hidden from people, visible to naive bots */
.gnq-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
	.gnc-package__inner, .gnq-service { transition: none; }
	.gnc-package:hover .gnc-package__inner { transform: none; }
}
.gnq-summary, .gnq-success { scroll-margin-top: 110px; }

/* Legal texts above the submit button */
.gnq-legal { display: grid; gap: .5rem; max-width: 44rem; }
.gnq-legal p { margin: 0; font-size: .875rem; line-height: 1.6; color: var(--gnc-muted); }
.gnq-legal a { color: var(--gnc-hi); font-weight: 600; }
.gnq-terms { padding-left: .85rem; border-left: 2px solid color-mix(in srgb, var(--gnc-hi) 55%, transparent); }
.gnq-success a { color: var(--gnc-hi); }