/*
 * _base.css — Global design tokens, element defaults, page shell, and tiny utilities.
 * ALWAYS included in every page.
 *
 * Provides:
 *   :root variables (light + dark), box-sizing, html/body,
 *   element defaults (button, input, select, textarea, label, fieldset, legend,
 *   a, hr, img, h1-h4, p, ul/ol/li, blockquote, table/th/td, details/summary,
 *   pre/code), main / .notion-shell, utility classes, .notion-footer,
 *   reduced-motion and responsive breakpoints for base elements.
 */

:root {
	color-scheme: light dark;
	--notion-bg: #ffffff;
	--notion-bg-soft: #f9f9f8;
	--notion-surface: #ffffff;
	--notion-surface-hover: #f6f5f4;
	--notion-text: #191918;
	--notion-text-soft: rgba(0, 0, 0, 0.54);
	--notion-text-faint: rgba(0, 0, 0, 0.3);
	--notion-border: rgba(0, 0, 0, 0.1);
	--notion-border-soft: rgba(0, 0, 0, 0.05);
	--notion-shadow:
		0px 0.7px 1.462px rgba(0, 0, 0, 0.015), 0px 3px 9px rgba(0, 0, 0, 0.03);
	--notion-blue: #2783de;
	--notion-orange: #d5803b;
	--notion-red: #e56458;
	--notion-blue-bg: #f3f9fd;
	--notion-yellow-bg: #fcfaef;
	--notion-orange-bg: #fcf7f4;
	--notion-green-bg: #f6f9f7;
	--notion-red-bg: #fdf6f6;
	--notion-gray-bg: #f9f8f7;
	--notion-radius: 8px;
	--notion-page-width: 900px;
	--notion-chart-1: #5e9fe8;
	--notion-chart-2: #eac26b;
	--notion-chart-3: #72bc8f;
	--notion-chart-4: #bf8eda;
	--notion-chart-5: #de9255;
	--notion-chart-6: #df84a8;
	--notion-chart-7: #4fb9c9;
	--notion-chart-8: #e97366;
	--diff-add: #47c1b6;
	--diff-del: #f07070;
	--pr-approved: #2b8a3e;
}

@media (prefers-color-scheme: dark) {
	:root {
		--notion-bg: #000000;
		--notion-bg-soft: #191918;
		--notion-surface: #191918;
		--notion-surface-hover: #31302e;
		--notion-text: #ffffff;
		--notion-text-soft: rgba(255, 255, 255, 0.5);
		--notion-text-faint: rgba(255, 255, 255, 0.3);
		--notion-border: rgba(255, 255, 255, 0.2);
		--notion-border-soft: rgba(255, 255, 255, 0.1);
		--notion-shadow:
			0px 0.7px 1.462px rgba(0, 0, 0, 0.06), 0px 3px 9px rgba(0, 0, 0, 0.12);
		--notion-blue: #5e9fe8;
		--notion-orange: #de9255;
		--notion-red: #e97366;
		--notion-blue-bg: rgba(41, 139, 253, 0.061);
		--notion-yellow-bg: rgba(203, 145, 47, 0.08);
		--notion-orange-bg: rgba(246, 126, 35, 0.08);
		--notion-green-bg: rgba(42, 157, 118, 0.08);
		--notion-red-bg: rgba(246, 73, 50, 0.08);
		--notion-gray-bg: #31302e;
		--diff-add: #5dd8cb;
		--diff-del: #ff8a80;
		--pr-approved: #69db7c;
	}
}

* {
	box-sizing: border-box;
}
html {
	scroll-behavior: smooth;
}
body {
	margin: 0;
	background: var(--notion-bg);
	color: var(--notion-text);
	font-family:
		ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica,
		"Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 16px;
	line-height: 1.5;
	transition:
		background 180ms ease,
		color 180ms ease;
}

/* -- Base element defaults -------------------------------- */
button,
[type="button"],
[type="submit"],
[type="reset"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 8px 16px;
	font: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	color: #ffffff;
	background: var(--notion-blue);
	border: 1px solid transparent;
	border-radius: 8px;
	cursor: pointer;
	transition: background 150ms;
	white-space: nowrap;
}
button:hover,
[type="button"]:hover,
[type="submit"]:hover,
[type="reset"]:hover {
	background: color-mix(in srgb, var(--notion-blue) 82%, black);
}
button:focus-visible,
[type="button"]:focus-visible,
[type="submit"]:focus-visible,
[type="reset"]:focus-visible {
	outline: 2px solid var(--notion-blue);
	outline-offset: 2px;
}

input,
select,
textarea {
	font: inherit;
	font-size: 14px;
	line-height: 1.4;
	color: var(--notion-text);
	background: var(--notion-surface);
	border: 1px solid var(--notion-border);
	border-radius: 8px;
	padding: 8px 12px;
	transition: border-color 150ms;
}
input:focus,
select:focus,
textarea:focus {
	outline: none;
	border-color: var(--notion-blue);
	box-shadow: 0 0 0 2px rgba(9, 127, 232, 0.15);
}
input::,
textarea:: {
	color: var(--notion-text-faint);
}
select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' fill='none' stroke='%23999' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	padding-right: 30px;
}
textarea {
	resize: vertical;
	min-height: 80px;
}
input[type="range"] {
	border: none;
	padding: 0;
	background: transparent;
	accent-color: var(--notion-blue);
	height: 18px;
	cursor: pointer;
	box-shadow: none;
}
input[type="range"]:focus {
	box-shadow: none;
}
input[type="checkbox"],
input[type="radio"] {
	width: 16px;
	height: 16px;
	accent-color: var(--notion-blue);
	border: 1px solid var(--notion-border);
	padding: 0;
	cursor: pointer;
}
label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--notion-text);
	margin-bottom: 6px;
}
fieldset {
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	padding: 16px;
	margin: 0;
}
legend {
	font-weight: 600;
	padding: 0 4px;
}

a {
	color: var(--notion-text);
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-color: var(--notion-border);
}
a:hover {
	text-decoration-color: var(--notion-text);
}

hr {
	height: 1px;
	margin: 34px 0;
	border: none;
	background: var(--notion-border-soft);
}

img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

h1,
h2,
h3,
h4 {
	text-wrap: balance;
}
h1 {
	margin: 0 0 14px;
	font-size: clamp(42px, 7vw, 72px);
	line-height: 1.1;
	letter-spacing: -0.035em;
	font-weight: 700;
}
h2 {
	margin: 44px 0 10px;
	font-size: 32px;
	line-height: 1.25;
	letter-spacing: -0.025em;
}
h3 {
	margin: 0 0 6px;
	font-size: 18px;
	line-height: 1.556;
	letter-spacing: -0.007em;
}
p {
	margin: 0 0 10px;
}

ul,
ol {
	margin: 8px 0 16px;
	padding-left: 24px;
}
li {
	margin-bottom: 4px;
}
li::marker {
	color: var(--notion-text-faint);
}

blockquote {
	border-left: 3px solid var(--notion-text);
	padding: 4px 0 4px 16px;
	margin: 24px 0;
}
blockquote p {
	font-size: 18px;
	line-height: 1.5;
	margin: 0;
}

table {
	width: 100%;
	margin: 14px 0;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	overflow: hidden;
	background: var(--notion-surface);
	font-size: 14px;
}
th,
td {
	padding: 12px 14px;
	vertical-align: top;
	text-align: left;
	border-right: 1px solid var(--notion-border-soft);
	border-bottom: 1px solid var(--notion-border-soft);
}
th:last-child,
td:last-child {
	border-right: 0;
}
tr:last-child td {
	border-bottom: 0;
}
th {
	background: var(--notion-bg-soft);
	color: var(--notion-text-soft);
	font-weight: 600;
}

details {
	margin: 16px 0;
	border-radius: var(--notion-radius);
}
summary {
	padding: 8px 10px;
	border-radius: var(--notion-radius);
	cursor: pointer;
	font-weight: 600;
}
summary:hover {
	background: var(--notion-surface-hover);
}
details p {
	margin: 8px 10px 0 28px;
	color: var(--notion-text-soft);
}

pre,
code {
	font-family: ui-monospace, "iA Writer Mono", Nitti, Menlo, Courier, monospace;
}
pre {
	margin: 16px 0;
	padding: 14px 16px;
	overflow-x: auto;
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	background: var(--notion-gray-bg);
	font-size: 13px;
	line-height: 1.55;
}
code {
	font-size: 0.9em;
	padding: 2px 5px;
	border-radius: 4px;
	background: var(--notion-gray-bg);
}
pre code {
	font-size: inherit;
	padding: 0;
	border-radius: 0;
	background: none;
}

main {
	max-width: var(--notion-page-width);
	margin: 0 auto;
	padding: 76px 24px 88px;
}

section {
	margin-top: 44px;
}
section:first-child {
	margin-top: 0;
}

/* -- Page shell ------------------------------------------- */
.notion-shell {
	max-width: var(--notion-page-width);
	margin: 0 auto;
	padding: 76px 24px 88px;
}

/* -- Tiny utilities --------------------------------------- */
.notion-lede {
	max-width: 720px;
	margin: 0 0 24px;
	color: var(--notion-text-soft);
	font-size: 20px;
}
.notion-muted {
	color: var(--notion-text-soft);
}
.notion-faint {
	color: var(--notion-text-faint);
}
.notion-divider {
	height: 1px;
	margin: 34px 0;
	background: var(--notion-border-soft);
}
.notion-eyebrow {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.0078125rem;
	text-transform: uppercase;
	color: var(--notion-blue);
}

/* -- Footer ----------------------------------------------- */
.notion-footer {
	margin-top: 52px;
	padding-top: 18px;
	border-top: 1px solid var(--notion-border-soft);
	color: var(--notion-text-faint);
	font-size: 13px;
}

/* -- Accessibility & motion ------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* -- Responsive: 560px (base elements) -------------------- */
@media (max-width: 560px) {
	main,
	.notion-shell {
		padding-inline: 16px;
	}
	table {
		display: block;
		overflow-x: auto;
	}
}


/*
 * hero — Full-width hero section with title, subtitle, and optional eyebrow.
 *
 * HTML:
 * <section class="notion-hero">
 *   <span class="notion-eyebrow">Category</span>
 *   <h1>Page Title</h1>
 *   <p>A brief description that supports the title with additional context.</p>
 *   <div class="notion-button-group">
 *     <a class="notion-button" data-variant="primary" href="#">Get started</a>
 *     <a class="notion-button" data-variant="secondary" href="#">Learn more</a>
 *   </div>
 * </section>
 */

.notion-hero {
	padding: 48px 0 40px;
	max-width: var(--notion-page-width);
}
.notion-hero h1 {
	font-size: clamp(42px, 7vw, 72px);
	font-weight: 700;
	letter-spacing: -0.04em;
	line-height: 1.05;
	margin: 0;
	text-wrap: balance;
}
.notion-hero p {
	font-size: 20px;
	line-height: 1.5;
	color: var(--notion-text-soft);
	margin: 16px 0 0;
	max-width: 640px;
}
.notion-hero .notion-eyebrow {
	margin-bottom: 12px;
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-hero {
		padding: 32px 0 24px;
	}
	.notion-hero h1 {
		font-size: clamp(32px, 8vw, 48px);
	}
}


/*
 * button — Styled link/button with variant and size options.
 * Options: data-variant="primary"|"secondary"|"tertiary"
 *          data-size="small"|"large"
 *
 * HTML:
 * <a class="notion-button" data-variant="primary" href="#">Primary</a>
 */

.notion-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 8px 16px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	border-radius: 8px;
	border: 1px solid transparent;
	cursor: pointer;
	transition:
		background 150ms,
		box-shadow 150ms,
		border-color 150ms;
	text-decoration: none;
	font-family: inherit;
	white-space: nowrap;
}
.notion-button:focus-visible {
	outline: 2px solid var(--notion-blue);
	outline-offset: 2px;
}
/* Primary */
.notion-button[data-variant="primary"],
.notion-button:not([data-variant]) {
	background: var(--notion-blue);
	color: #ffffff;
	border-color: transparent;
}
.notion-button[data-variant="primary"]:hover,
.notion-button:not([data-variant]):hover {
	background: color-mix(in srgb, var(--notion-blue) 82%, black);
}
/* Secondary */
.notion-button[data-variant="secondary"] {
	background: var(--notion-blue-bg);
	color: var(--notion-blue);
	border-color: transparent;
}
.notion-button[data-variant="secondary"]:hover {
	background: color-mix(in srgb, var(--notion-blue-bg) 70%, var(--notion-blue));
}
/* Tertiary */
.notion-button[data-variant="tertiary"] {
	background: transparent;
	color: var(--notion-text);
	border-color: transparent;
}
.notion-button[data-variant="tertiary"]:hover {
	background: var(--notion-surface-hover);
}
/* Small modifier */
.notion-button[data-size="small"] {
	padding: 4px 12px;
	font-size: 12px;
}
/* Large modifier */
.notion-button[data-size="large"] {
	padding: 12px 24px;
	font-size: 16px;
}
.notion-button-group {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 24px;
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-button-group {
		flex-direction: column;
	}
	.notion-button-group .notion-button {
		width: 100%;
	}
}


/*
 * card-grid — Grid of clickable cards with icon, title, and description.
 *
 * HTML:
 * <section class="notion-card-grid">
 *   <article class="notion-card">
 *     <div class="notion-card-icon">%</div>
 *     <h3>Card</h3>
 *     <p>Card text.</p>
 *   </article>
 * </section>
 */

.notion-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 20px 0 6px;
}
.notion-card {
	padding: 16px;
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	background: var(--notion-surface);
	box-shadow: var(--notion-shadow);
	transition:
		transform 140ms ease,
		background 140ms ease,
		border-color 140ms ease;
}
.notion-card:hover {
	transform: translateY(-1px);
	background: var(--notion-surface-hover);
	border-color: var(--notion-border);
}
.notion-card-icon {
	width: 34px;
	height: 34px;
	display: grid;
	place-items: center;
	margin-bottom: 12px;
	border-radius: 8px;
	background: var(--notion-gray-bg);
	font-size: 20px;
}
.notion-card p {
	color: var(--notion-text-soft);
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-card-grid {
		grid-template-columns: 1fr;
	}
}


/*
 * stat-grid — Grid of stat cards with label, big number, caption, and trend.
 *
 * HTML:
 * <section class="notion-stat-grid">
 *   <div class="notion-stat">
 *     <p class="notion-stat-label">Metric</p>
 *     <p class="notion-stat-value">42%</p>
 *     <p class="notion-stat-caption">Short explanation.</p>
 *     <span class="notion-stat-trend">&#x2197; trend</span>
 *   </div>
 * </section>
 */

.notion-stat-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 20px 0 6px;
}
.notion-stat {
	padding: 16px;
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	background: var(--notion-surface);
	box-shadow: var(--notion-shadow);
}
.notion-stat-label {
	margin: 0 0 6px;
	color: var(--notion-text-soft);
	font-size: 13px;
	font-weight: 600;
}
.notion-stat-value {
	margin: 0;
	font-size: 32px;
	line-height: 1.05;
	letter-spacing: -0.04em;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.notion-stat-caption {
	margin: 8px 0 0;
	color: var(--notion-text-soft);
	font-size: 13px;
}
.notion-stat-trend {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 10px;
	padding: 3px 7px;
	border-radius: 999px;
	background: var(--notion-blue-bg);
	color: var(--notion-blue);
	font-size: 12px;
	font-weight: 650;
}

/* -- Responsive: 1080px ----------------------------------- */
@media (max-width: 1080px) {
	.notion-stat-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-stat-grid {
		grid-template-columns: 1fr;
	}
}


/*
 * callout — Highlighted info box with icon and text.
 * Options: data-tone="blue" | "green" | "orange" | "red" (default: yellow)
 *
 * HTML:
 * <div class="notion-callout" data-tone="blue">
 *   <div>💡</div>
 *   <div><strong>Note</strong><p>Helpful context.</p></div>
 * </div>
 */

.notion-callout {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 14px;
	margin: 18px 0;
	padding: 16px 18px;
	border-radius: var(--notion-radius);
	background: var(--notion-yellow-bg);
	box-shadow: inset 0 0 0 1px var(--notion-border-soft);
}
.notion-callout[data-tone="blue"] {
	background: var(--notion-blue-bg);
}
.notion-callout[data-tone="green"] {
	background: var(--notion-green-bg);
}
.notion-callout[data-tone="orange"] {
	background: var(--notion-orange-bg);
}
.notion-callout[data-tone="red"] {
	background: var(--notion-red-bg);
}
.notion-callout strong {
	display: block;
	margin-bottom: 3px;
}
.notion-callout p {
	margin: 0;
	color: var(--notion-text-soft);
}


/*
 * table — Alias for the base <table> element.
 * No additional styles beyond _base.css defaults.
 *
 * HTML:
 * <table class="notion-table">
 *   <thead><tr><th>Item</th><th>Meaning</th></tr></thead>
 *   <tbody><tr><td><strong>Example</strong></td><td>Details</td></tr></tbody>
 * </table>
 */

/* .notion-table is now an alias -- bare <table> is styled identically */


/*
 * timeline — Vertical list of phase/date entries.
 *
 * HTML:
 * <div class="notion-timeline">
 *   <div class="notion-timeline-item">
 *     <strong>Phase</strong>
 *     <p>What happens.</p>
 *   </div>
 * </div>
 */

.notion-timeline {
	display: grid;
	gap: 8px;
	margin-top: 14px;
}
.notion-timeline-item {
	display: grid;
	grid-template-columns: 170px 1fr;
	gap: 16px;
	padding: 12px 14px;
	border-radius: var(--notion-radius);
	background: transparent;
}
.notion-timeline-item:hover {
	background: var(--notion-surface-hover);
}
.notion-timeline-item strong {
	color: var(--notion-blue);
}
.notion-timeline-item p {
	color: var(--notion-text-soft);
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-timeline-item {
		grid-template-columns: 1fr;
		gap: 4px;
	}
}


/*
 * flow — Horizontal step-by-step process with arrow connectors.
 *
 * HTML:
 * <div class="notion-flow">
 *   <div class="notion-flow-step">
 *     <strong>Step</strong>
 *     <span>Detail</span>
 *   </div>
 *   <div class="notion-flow-step">
 *     <strong>Next</strong>
 *     <span>Detail</span>
 *   </div>
 * </div>
 */

.notion-flow {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin: 18px 0;
}
.notion-flow-step {
	position: relative;
	padding: 14px;
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	background: var(--notion-surface);
}
.notion-flow-step:not(:last-child)::after {
	content: "\2192";
	position: absolute;
	right: -15px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
	color: var(--notion-text-faint);
	font-weight: 700;
}
.notion-flow-step span {
	display: block;
	margin-top: 4px;
	color: var(--notion-text-soft);
	font-size: 14px;
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-flow {
		grid-template-columns: 1fr;
	}
	.notion-flow-step:not(:last-child)::after {
		content: "\2193";
		right: 50%;
		top: auto;
		bottom: -19px;
		transform: translateX(50%);
	}
}


/*
 * comparison — Side-by-side panels with optional badge labels.
 * Options: .notion-badge data-variant="primary" | "secondary" | "blue"
 *
 * HTML:
 * <div class="notion-comparison">
 *   <div class="notion-panel">
 *     <h3>Option A</h3>
 *     <p>Description.</p>
 *     <span class="notion-badge">Best for...</span>
 *   </div>
 *   <div class="notion-panel">
 *     <h3>Option B</h3>
 *     <p>Description.</p>
 *   </div>
 * </div>
 */

.notion-comparison {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 14px;
}
.notion-panel {
	padding: 16px;
	border-radius: 10px;
	border: 1px solid var(--notion-border-soft);
	background: var(--notion-surface);
}
.notion-panel p {
	color: var(--notion-text-soft);
}
.notion-badge {
	display: inline-flex;
	margin-top: 12px;
	padding: 4px 8px;
	border-radius: 999px;
	background: var(--notion-green-bg);
	color: var(--notion-text);
	font-size: 12px;
	font-weight: 600;
}
.notion-badge[data-variant="primary"] {
	background: var(--notion-blue);
	color: #ffffff;
}
.notion-badge[data-variant="secondary"] {
	background: var(--notion-gray-bg);
	color: var(--notion-text);
}
.notion-badge[data-variant="blue"] {
	background: var(--notion-blue-bg);
	color: var(--notion-blue);
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-comparison {
		grid-template-columns: 1fr;
	}
}


/*
 * checklist — To-do style list with check icons.
 *
 * HTML:
 * <ul class="notion-checklist">
 *   <li>
 *     <span class="notion-check">&#x2713;</span>
 *     <span>Compare offers using the same loan amount, term, and points.</span>
 *   </li>
 * </ul>
 */

.notion-checklist {
	display: grid;
	gap: 8px;
	margin-top: 14px;
	padding: 0;
	list-style: none;
}
.notion-checklist li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 10px;
	align-items: start;
	padding: 9px 10px;
	border-radius: var(--notion-radius);
}
.notion-checklist li:hover {
	background: var(--notion-surface-hover);
}
.notion-checklist > div {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 10px;
	align-items: start;
	padding: 9px 10px;
	border-radius: var(--notion-radius);
}
.notion-checklist > div:hover {
	background: var(--notion-surface-hover);
}
.notion-check {
	width: 18px;
	height: 18px;
	display: grid;
	place-items: center;
	margin-top: 2px;
	border-radius: 5px;
	background: var(--notion-blue-bg);
	color: var(--notion-blue);
	font-size: 12px;
	font-weight: 700;
}


/*
 * tabs — CSS-only tabbed interface using radio inputs.
 * Options: data-style="line" | "pills" (default: pill-in-tray)
 *
 * HTML:
 * <div class="notion-tabs">
 *   <input checked type="radio" name="tabs-demo" id="tab-1">
 *   <input type="radio" name="tabs-demo" id="tab-2">
 *   <div class="notion-tab-list">
 *     <label class="notion-tab-label" for="tab-1">Simple</label>
 *     <label class="notion-tab-label" for="tab-2">Detailed</label>
 *   </div>
 *   <div class="notion-tab-panel" data-tab-panel="1"><p>Simple view.</p></div>
 *   <div class="notion-tab-panel" data-tab-panel="2"><p>Detailed view.</p></div>
 * </div>
 */

.notion-tabs {
	margin: 18px 0;
}
.notion-tabs input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.notion-tab-list {
	display: flex;
	flex-wrap: wrap;
	width: fit-content;
	gap: 6px;
	padding: 4px;
	border-radius: 10px;
	background: var(--notion-gray-bg);
}
.notion-tab-label {
	padding: 6px 10px;
	border-radius: 8px;
	color: var(--notion-text-soft);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
.notion-tab-label:hover {
	background: var(--notion-surface-hover);
	color: var(--notion-text);
}
.notion-tab-panel {
	display: none;
	padding: 16px 0 0;
}
.notion-tabs:has(#tab-1:checked) label[for="tab-1"],
.notion-tabs:has(#tab-2:checked) label[for="tab-2"],
.notion-tabs:has(#tab-3:checked) label[for="tab-3"],
.notion-tabs:has(#tab-4:checked) label[for="tab-4"] {
	background: var(--notion-surface);
	color: var(--notion-text);
	box-shadow: 0 1px 2px rgba(15, 15, 15, 0.06);
}

/* Line-style tabs */
.notion-tabs[data-style="line"] .notion-tab-list {
	width: auto;
	background: none;
	padding: 0;
	gap: 0;
	border-radius: 0;
	border-bottom: 1px solid var(--notion-border-soft);
}
.notion-tabs[data-style="line"] .notion-tab-label {
	padding: 8px 14px;
	border-radius: 0;
	font-weight: 500;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
}
.notion-tabs[data-style="line"] .notion-tab-label:hover {
	background: none;
	color: var(--notion-text);
}
.notion-tabs[data-style="line"] .notion-tab-panel {
	padding-top: 0;
}
.notion-tabs[data-style="line"] .notion-tab-panel > :first-child {
	margin-top: 0;
	border-top: none;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.notion-tabs[data-style="line"]:has(#tab-1:checked) label[for="tab-1"],
.notion-tabs[data-style="line"]:has(#tab-2:checked) label[for="tab-2"],
.notion-tabs[data-style="line"]:has(#tab-3:checked) label[for="tab-3"],
.notion-tabs[data-style="line"]:has(#tab-4:checked) label[for="tab-4"] {
	background: none;
	box-shadow: none;
	color: var(--notion-text);
	font-weight: 600;
	border-bottom-color: var(--notion-text);
}

/* Pill-style tabs */
.notion-tabs[data-style="pills"] .notion-tab-list {
	width: auto;
	background: none;
	padding: 0;
	gap: 8px;
	border-radius: 0;
}
.notion-tabs[data-style="pills"] .notion-tab-label {
	padding: 6px 16px;
	border-radius: 999px;
	border: 1px solid var(--notion-border);
	font-weight: 500;
	font-size: 14px;
	color: var(--notion-text-soft);
	background: var(--notion-surface);
}
.notion-tabs[data-style="pills"] .notion-tab-label:hover {
	background: var(--notion-surface-hover);
	border-color: var(--notion-text-faint);
	color: var(--notion-text);
}
.notion-tabs[data-style="pills"]:has(#tab-1:checked) label[for="tab-1"],
.notion-tabs[data-style="pills"]:has(#tab-2:checked) label[for="tab-2"],
.notion-tabs[data-style="pills"]:has(#tab-3:checked) label[for="tab-3"],
.notion-tabs[data-style="pills"]:has(#tab-4:checked) label[for="tab-4"] {
	background: var(--notion-text);
	border-color: var(--notion-text);
	color: var(--notion-bg);
	box-shadow: none;
	font-weight: 600;
}
.notion-tabs[data-style="pills"] .notion-tab-panel {
	padding-top: 16px;
}

/* Panel visibility */
.notion-tabs:has(#tab-1:checked) [data-tab-panel="1"],
.notion-tabs:has(#tab-2:checked) [data-tab-panel="2"],
.notion-tabs:has(#tab-3:checked) [data-tab-panel="3"],
.notion-tabs:has(#tab-4:checked) [data-tab-panel="4"] {
	display: block;
}


/*
 * meter — Single progress bar with label and percentage.
 * Options: data-tone="green" | "orange" | "red" (default: blue)
 *
 * HTML:
 * <div class="notion-meter" style="--value: 72%">
 *   <div class="notion-meter-row">
 *     <span>Progress</span>
 *     <span>72%</span>
 *   </div>
 *   <div class="notion-meter-track">
 *     <div class="notion-meter-fill"></div>
 *   </div>
 * </div>
 */

.notion-meter {
	--value: 50%;
	--meter-color: var(--notion-blue);
	display: grid;
	gap: 7px;
	margin: 12px 0;
}
.notion-meter-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	color: var(--notion-text-soft);
	font-size: 13px;
	font-weight: 600;
}
.notion-meter-track {
	height: 9px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--notion-gray-bg);
	box-shadow: inset 0 0 0 1px var(--notion-border-soft);
}
.notion-meter-fill {
	height: 100%;
	width: var(--value);
	border-radius: 999px;
	background: var(--meter-color);
}
.notion-meter[data-tone="green"] {
	--meter-color: var(--notion-chart-3);
}
.notion-meter[data-tone="orange"] {
	--meter-color: var(--notion-chart-5);
}
.notion-meter[data-tone="red"] {
	--meter-color: var(--notion-chart-8);
}


/*
 * quote — Styled blockquote with attribution (avatar, name, meta).
 *
 * HTML:
 * <blockquote class="notion-quote">
 *   <p>Design is not just what it looks like and feels like.
 *      Design is how it works.</p>
 *   <div class="notion-attribution">
 *     <img src="avatar.jpg" alt="">
 *     <div>
 *       <span class="notion-attribution-name">Steve Jobs</span>
 *       <span class="notion-attribution-meta">Apple, 2003</span>
 *     </div>
 *   </div>
 * </blockquote>
 */

.notion-quote {
	border-left: 3px solid var(--notion-text);
	padding: 4px 0 4px 16px;
	margin: 24px 0;
}
.notion-quote p {
	font-size: 18px;
	line-height: 1.5;
	color: var(--notion-text);
	margin: 0;
}
.notion-attribution {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 16px;
}
.notion-attribution img {
	width: 40px;
	height: 40px;
	border-radius: 9999px;
	object-fit: cover;
}
.notion-attribution-name {
	font-size: 14px;
	font-weight: 600;
	color: var(--notion-text);
}
.notion-attribution-meta {
	font-size: 13px;
	color: var(--notion-text-faint);
}


/*
 * list — Numbered list with index badges and descriptions.
 *
 * HTML:
 * <div class="notion-list">
 *   <div class="notion-list-item">
 *     <div class="notion-index">1</div>
 *     <div>
 *       <h3>Item</h3>
 *       <p>Item details.</p>
 *     </div>
 *   </div>
 * </div>
 */

.notion-list {
	display: grid;
	gap: 8px;
	margin-top: 14px;
}
.notion-list-item {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 12px;
	padding: 12px 14px;
	border-radius: var(--notion-radius);
	background: transparent;
	transition: background 120ms ease;
}
.notion-list-item:hover {
	background: var(--notion-surface-hover);
}
.notion-index {
	width: 28px;
	height: 28px;
	display: grid;
	place-items: center;
	border-radius: 6px;
	background: var(--notion-blue-bg);
	color: var(--notion-blue);
	font-weight: 700;
	font-size: 14px;
}
.notion-list-item p {
	color: var(--notion-text-soft);
}


/*
 * toggle — Alias for the base <details> element.
 * No additional styles beyond _base.css defaults.
 *
 * HTML:
 * <details class="notion-toggle">
 *   <summary>More detail</summary>
 *   <p>Hidden content.</p>
 * </details>
 */

/* .notion-toggle is now an alias -- bare <details> is styled identically */


/*
 * bar-chart — Horizontal bar chart with labels and values.
 * Options: data-muted (dims a bar), data-tone="green" | "orange" | "red"
 *
 * HTML:
 * <div class="notion-bar-chart">
 *   <div class="notion-bar" style="--value: 80%">
 *     <span class="notion-bar-label">A350-900ULR</span>
 *     <div class="notion-bar-track">
 *       <div class="notion-bar-fill"></div>
 *     </div>
 *     <span class="notion-bar-value">9,700 nm</span>
 *   </div>
 * </div>
 */

.notion-bar-chart {
	display: grid;
	gap: 12px;
	margin-top: 16px;
	padding: 16px;
	border: 1px solid var(--notion-border-soft);
	border-radius: 10px;
	background: var(--notion-surface);
}
.notion-bar {
	--value: 50%;
	display: grid;
	grid-template-columns: minmax(90px, 0.4fr) 2fr auto;
	align-items: center;
	gap: 10px;
	font-size: 14px;
}
.notion-bar-label {
	font-weight: 600;
}
.notion-bar[data-muted] {
	opacity: 0.35;
}
.notion-bar[data-muted] .notion-bar-fill {
	display: none;
}
.notion-bar[data-muted] .notion-bar-value {
	visibility: hidden;
}
.notion-bar-track {
	height: 10px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--notion-gray-bg);
	box-shadow: inset 0 0 0 1px var(--notion-border-soft);
}
.notion-bar-fill {
	height: 100%;
	width: var(--value);
	border-radius: 999px;
	background: var(--notion-blue);
}
.notion-bar-value {
	color: var(--notion-text-soft);
	font-variant-numeric: tabular-nums;
	font-size: 13px;
}
.notion-bar[data-tone="green"] .notion-bar-fill {
	background: var(--notion-chart-3);
}
.notion-bar[data-tone="orange"] .notion-bar-fill {
	background: var(--notion-chart-5);
}
.notion-bar[data-tone="red"] .notion-bar-fill {
	background: var(--notion-chart-8);
}

/* -- Responsive: 820px ------------------------------------ */
@media (max-width: 820px) {
	.notion-bar {
		grid-template-columns: 1fr;
		gap: 6px;
	}
}


:root{
  --ink:#1f2937;--ink-2:#2a3744;--copper:#c97b3f;--copper-2:#8b5a2b;--cream:#f5f1ea;--sand:#ede7dc;--card:#fffaf2;--line:#c9c0b0;--muted:#6b7280;--green:#2f7d59;--blueprint:#233447;
  --notion-bg:var(--cream);--notion-bg-soft:var(--sand);--notion-surface:rgba(255,250,242,.92);--notion-text:var(--ink);--notion-text-soft:var(--muted);--notion-border:rgba(31,41,55,.16);--notion-border-soft:rgba(31,41,55,.08);--notion-blue:var(--copper);--notion-orange:var(--copper);--notion-orange-bg:#f4e4d3;--notion-yellow-bg:#fff4dc;--notion-green-bg:#e7f2ec;--notion-blue-bg:#eef2f6;--notion-chart-1:var(--copper);--notion-chart-2:var(--green);--notion-chart-3:#536476;--notion-chart-4:#e6b87a;--notion-page-width:1180px;
}
*{box-sizing:border-box}html{scroll-padding-top:92px}body{background:var(--cream);font-family:Inter,Manrope,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 8% 2%,rgba(201,123,63,.20),transparent 28rem),radial-gradient(circle at 96% 20%,rgba(31,41,55,.12),transparent 34rem),linear-gradient(90deg,rgba(31,41,55,.035) 1px,transparent 1px),linear-gradient(180deg,rgba(31,41,55,.035) 1px,transparent 1px);background-size:auto,auto,64px 64px,64px 64px;z-index:-2}.notion-shell{max-width:1180px;padding:0 22px}.site-header{position:sticky;top:0;z-index:50;background:rgba(245,241,234,.78);backdrop-filter:blur(22px);border-bottom:1px solid rgba(31,41,55,.10)}.site-nav{max-width:1220px;margin:auto;padding:12px 22px;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center}.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:900;letter-spacing:-.04em;font-size:22px}.logo-mark{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--ink),#0e151d 55%,var(--copper));box-shadow:0 12px 26px rgba(31,41,55,.22), inset 0 0 0 1px rgba(255,255,255,.12);position:relative;overflow:hidden}.logo-mark:after{content:"";position:absolute;width:34px;height:34px;border:3px solid rgba(255,255,255,.55);border-left-color:transparent;border-radius:50%;animation:spin 7s linear infinite}.nav-links{display:flex;justify-content:center;gap:20px;font-size:14px;font-weight:750}.nav-links a{text-decoration:none;color:rgba(31,41,55,.68);position:relative}.nav-links a:after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:2px;background:var(--copper);transition:.22s}.nav-links a:hover{color:var(--ink)}.nav-links a:hover:after{width:100%}.header-contact{text-align:right;line-height:1.15}.header-address{display:block;font-size:12px;color:var(--muted);font-weight:650;margin-bottom:4px}.header-phone{display:block;font-size:19px;font-weight:950;letter-spacing:-.02em;color:var(--ink);text-decoration:none}.header-phone:hover{color:var(--copper)}
.section{position:relative;margin:34px 0;padding:66px 0}.section-band{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%)}.section-cream{background:linear-gradient(180deg,rgba(255,250,242,.58),rgba(245,241,234,.92))}.section-sand{background:linear-gradient(180deg,var(--sand),#f8f2e8)}.section-dark{color:#fff;background:radial-gradient(circle at 18% 5%,rgba(201,123,63,.33),transparent 28rem),linear-gradient(135deg,#16202b,#263746 62%,#1e2730)}.section-dark .section-kicker,.section-dark h2,.section-dark h3,.section-dark p,.section-dark .notion-footer{color:#fff}.section-dark p{color:rgba(255,255,255,.75)}.section-dark .notion-card,.section-dark .notion-panel,.section-dark .notion-stat{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.14);color:#fff}.section-dark .notion-card p,.section-dark .notion-stat-caption,.section-dark .notion-stat-label{color:rgba(255,255,255,.72)}.section-split-top:before{content:"";position:absolute;top:-1px;left:0;right:0;height:54px;background:linear-gradient(176deg,var(--cream) 0 49%,transparent 50%)}.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.52fr);gap:34px;align-items:end;margin-bottom:26px}.section-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--copper-2);font-size:12px;font-weight:950;letter-spacing:.16em;text-transform:uppercase}.section-kicker:before{content:"";width:32px;height:2px;background:var(--copper)}h1,h2,h3{font-family:Manrope,Inter,ui-sans-serif,sans-serif}h2{font-size:clamp(30px,4vw,48px);line-height:1.07;letter-spacing:-.045em;margin:0 0 12px}p{line-height:1.62}.lead{font-size:clamp(17px,2vw,21px);color:rgba(255,255,255,.78)}.notion-button{text-decoration:none;border-radius:14px;font-weight:850;letter-spacing:-.01em;box-shadow:0 12px 26px rgba(201,123,63,.18);border:1px solid rgba(31,41,55,.12)}.notion-button[data-variant="primary"]{background:linear-gradient(135deg,var(--copper),#e0a160);color:#fff}.notion-button[data-variant="secondary"]{background:rgba(255,255,255,.09);color:var(--ink);border-color:rgba(31,41,55,.18);box-shadow:none}.section-dark .notion-button[data-variant="secondary"]{color:#fff;border-color:rgba(255,255,255,.26)}.notion-button:hover{transform:translateY(-1px)}
.hero-stage{position:relative;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:56px max(22px,calc(50vw - 590px)) 84px;min-height:760px;color:#fff;background:radial-gradient(circle at 78% 18%,rgba(201,123,63,.40),transparent 23rem),radial-gradient(circle at 12% 20%,rgba(255,255,255,.10),transparent 18rem),linear-gradient(135deg,#121a23 0%,#263747 58%,#1f2937 100%);overflow:hidden}.hero-stage:after{content:"";position:absolute;inset:auto -10% -70px -10%;height:220px;background:var(--cream);clip-path:polygon(0 44%,100% 0,100% 100%,0 100%);z-index:1}.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(380px,.98fr);gap:44px;align-items:center}.notion-hero{padding:36px 0}.notion-hero h1{font-size:clamp(42px,7vw,86px);line-height:.98;letter-spacing:-.07em;color:#fff;margin-bottom:20px}.notion-eyebrow{display:inline-flex;gap:8px;align-items:center;color:#f1c79d;background:rgba(201,123,63,.14);border:1px solid rgba(201,123,63,.34);border-radius:999px;padding:8px 12px;font-weight:850;margin-bottom:18px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 20px}.trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:26px}.trust-pill{padding:13px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(10px)}.trust-pill strong{display:block;color:#fff}.trust-pill span{font-size:13px;color:rgba(255,255,255,.66)}.machine-card{position:relative;border-radius:34px;padding:18px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.18);box-shadow:0 44px 100px rgba(0,0,0,.32);backdrop-filter:blur(12px);overflow:hidden}.machine-card:before{content:"";position:absolute;inset:18px;border-radius:24px;background:linear-gradient(135deg,rgba(245,241,234,.10),transparent);pointer-events:none}.machine-card svg{display:block;width:100%;height:auto;border-radius:24px}.hero-bore-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.hero-bore-stats div{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);border-radius:17px;padding:14px}.hero-bore-stats b{display:block;font-size:24px;color:#fff;letter-spacing:-.05em}.hero-bore-stats span{font-size:13px;color:rgba(255,255,255,.68)}
.drill-head{animation:drillMove 3.2s ease-in-out infinite;transform-origin:center}.pipe-line{stroke-dasharray:260;animation:pipeGrow 4s ease-in-out infinite alternate}.lamp{animation:blink 1.35s infinite}.dust{animation:dust 3s ease-in-out infinite}.auger{animation:spin 6s linear infinite;transform-box:fill-box;transform-origin:50% 50%}.track-tread{animation:tread 2.2s linear infinite}.carriage{animation:carriageSlide 3.8s ease-in-out infinite}.drill-rod{animation:rodPulse 2.6s ease-in-out infinite}.stake{animation:stakePress 2.8s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 0}@keyframes tread{to{stroke-dashoffset:-52}}@keyframes carriageSlide{0%,100%{transform:translateX(0)}50%{transform:translateX(28px)}}@keyframes rodPulse{0%,100%{stroke:#1f2937}50%{stroke:#c97b3f}}@keyframes stakePress{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}.section-card{padding:26px;border-radius:28px;background:rgba(255,250,242,.88);border:1px solid rgba(31,41,55,.10);box-shadow:0 24px 70px rgba(31,41,55,.08)}.proof-ribbon{position:relative;z-index:4;margin-top:-52px}.proof-ribbon .notion-stat-grid{grid-template-columns:repeat(4,1fr)}.notion-stat{border-radius:22px;padding:20px;box-shadow:0 18px 45px rgba(31,41,55,.08)}.notion-stat-value{letter-spacing:-.07em}.notion-card{border-radius:24px;padding:24px;box-shadow:0 20px 55px rgba(31,41,55,.075);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.notion-card:hover{transform:translateY(-6px);box-shadow:0 30px 80px rgba(31,41,55,.13);border-color:rgba(201,123,63,.35)}.service-card{position:relative;overflow:hidden}.service-card:before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,var(--copper),#e7b36b)}.service-card.feature{grid-column:span 2;background:linear-gradient(135deg,#fffaf2,#f1dfc8)}.icon-svg{width:74px;height:64px;margin-bottom:14px}.price{font-size:clamp(26px,3vw,36px);font-weight:950;color:var(--copper-2);letter-spacing:-.06em;font-feature-settings:"tnum"}.price small{font-size:14px;color:var(--muted);font-weight:700}.mini-label{display:inline-flex;border:1px solid rgba(201,123,63,.24);background:rgba(201,123,63,.10);color:var(--copper-2);border-radius:999px;padding:5px 9px;font-size:12px;font-weight:850}.calculator{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(360px,.86fr);gap:22px;align-items:start}.price-table-card{border-radius:28px;overflow:hidden;background:rgba(255,250,242,.9);border:1px solid rgba(31,41,55,.10);box-shadow:0 22px 60px rgba(31,41,55,.08)}.price-table-card table{margin:0;border-radius:0;box-shadow:none}.calc-panel{position:relative;overflow:hidden;padding:26px;border-radius:30px;background:radial-gradient(circle at 100% 0,rgba(201,123,63,.34),transparent 14rem),linear-gradient(135deg,#182331,#2c3b49);color:#fff;box-shadow:0 30px 90px rgba(31,41,55,.26);border:1px solid rgba(255,255,255,.14)}.calc-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}.calc-panel>*{position:relative}.calc-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:20px}.calc-header h3{font-size:26px;line-height:1.12;margin:0 0 6px;color:#fff}.calc-header p{margin:0;color:rgba(255,255,255,.72)}.calc-badge{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border-radius:999px;background:rgba(47,125,89,.22);border:1px solid rgba(108,210,152,.35);color:#bff1d1;font-size:12px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.calc-fields{display:grid;gap:16px}.calc-field{display:block;margin:0;color:#fff}.calc-field-title,.calc-field legend{display:flex;justify-content:space-between;align-items:center;margin:0 0 8px;font-size:14px;font-weight:850;color:#fff}.input-wrap{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:8px 12px;transition:border-color .18s,box-shadow .18s,background .18s}.input-wrap:focus-within{border-color:rgba(201,123,63,.95);box-shadow:0 0 0 4px rgba(201,123,63,.18);background:rgba(255,255,255,.14)}.input-wrap input{width:100%;min-width:0;background:transparent!important;border:0!important;box-shadow:none!important;color:#fff!important;font-size:28px;font-weight:950;letter-spacing:-.04em;padding:2px 0}.input-wrap input::-webkit-outer-spin-button,.input-wrap input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.input-wrap span{color:rgba(255,255,255,.68);font-weight:850}.calc-hint{display:block;min-height:18px;margin-top:6px;color:rgba(255,255,255,.62);font-size:12px}.calc-hint[data-state="error"]{color:#ffd0c8}.calc-radio-field{border:0;padding:0;margin:0}.calc-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.calc-option{position:relative;display:block;margin:0;cursor:pointer}.calc-option input{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:auto;cursor:pointer;z-index:2}.calc-option-card{pointer-events:none}.calc-option-card{min-height:86px;display:flex;flex-direction:column;justify-content:space-between;gap:8px;padding:13px;border-radius:18px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);transition:transform .18s,border-color .18s,background .18s,box-shadow .18s}.calc-option-card strong{font-size:18px;color:#fff}.calc-option-card span{font-size:12px;color:rgba(255,255,255,.66)}.calc-option-card b{font-size:14px;color:#f6c58f}.calc-option input:checked+.calc-option-card{background:rgba(201,123,63,.22);border-color:rgba(246,197,143,.82);box-shadow:0 0 0 3px rgba(201,123,63,.17)}.calc-option input:focus-visible+.calc-option-card{outline:2px solid #f6c58f;outline-offset:2px}.calc-option:hover .calc-option-card{transform:translateY(-2px)}.calc-summary{margin-top:18px;padding:18px;border-radius:24px;background:linear-gradient(135deg,var(--copper),#e5a25e);color:#fff;box-shadow:0 18px 46px rgba(201,123,63,.25)}.calc-summary-row{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:10px;font-size:14px}.calc-summary-row strong{font-size:15px}.calc-total{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-top:12px;border-top:1px solid rgba(255,255,255,.24)}.calc-total span{font-weight:850}.calc-total b{font-size:clamp(32px,4vw,46px);line-height:1;letter-spacing:-.075em;font-feature-settings:"tnum"}.calc-note{display:flex;gap:10px;margin:14px 0 0;color:rgba(255,255,255,.72);font-size:13px}.calc-note:before{content:"i";flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);font-weight:900;color:#fff}.calc-actions{display:flex;gap:10px;margin-top:16px}.calc-actions .notion-button{flex:1;justify-content:center;box-shadow:none}.calc-error{display:none;margin-top:12px;padding:10px 12px;border-radius:14px;background:rgba(224,62,62,.16);border:1px solid rgba(255,150,135,.25);color:#ffd0c8;font-size:13px}.calc-error.is-visible{display:block}.process-map{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.process-map:before{content:"";position:absolute;left:8%;right:8%;top:36px;height:3px;background:linear-gradient(90deg,var(--copper),rgba(201,123,63,.18));z-index:0}.process-step{position:relative;z-index:1;padding:18px;border-radius:22px;background:rgba(255,250,242,.92);border:1px solid rgba(31,41,55,.10);box-shadow:0 16px 45px rgba(31,41,55,.07)}.process-num{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:var(--ink);color:#fff;font-weight:950;margin-bottom:26px;box-shadow:0 8px 20px rgba(31,41,55,.18)}.blueprint{background:linear-gradient(135deg,#1b2936,#2d4254);border-radius:32px;padding:28px;color:#fff;position:relative;overflow:hidden}.blueprint:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:34px 34px}.blueprint>*{position:relative}.spec-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:22px}.spec{padding:17px;border-radius:18px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.15)}.spec b{display:block;font-size:28px;color:#fff;letter-spacing:-.05em}.spec span{color:rgba(255,255,255,.65)}.case-grid{display:grid;grid-template-columns:1.25fr .85fr .85fr;gap:18px}.case-card{min-height:250px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;background:linear-gradient(135deg,#243443,#1a232d);border-radius:28px;padding:24px;position:relative;overflow:hidden}.case-card:after{content:"";position:absolute;right:-80px;bottom:-80px;width:220px;height:220px;border-radius:50%;background:rgba(201,123,63,.18)}.case-card.major{min-height:520px;background:radial-gradient(circle at 80% 20%,rgba(201,123,63,.42),transparent 18rem),linear-gradient(135deg,#1a232d,#354554)}.case-metrics{display:flex;gap:10px;flex-wrap:wrap}.case-metrics span{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);font-weight:850}.doc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.doc-card{display:flex;gap:14px;align-items:flex-start;padding:18px;border-radius:20px;background:#fffaf2;border:1px solid rgba(31,41,55,.10);text-decoration:none}.doc-icon{width:42px;height:52px;border-radius:10px;background:linear-gradient(135deg,var(--ink),var(--copper));color:#fff;display:grid;place-items:center;font-weight:950;flex:0 0 auto}.contact-layout{display:grid;grid-template-columns:1fr .86fr;gap:22px}.contact-panel{padding:28px;border-radius:30px;background:linear-gradient(135deg,#1d2a37,#2e4050);color:#fff}.contact-panel a{color:#fff}.contact-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:22px 0}.contact-chip{padding:16px;border-radius:18px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.13)}.form-card{border-radius:30px;padding:26px;background:#fffaf2;border:1px solid rgba(31,41,55,.10);box-shadow:0 28px 80px rgba(31,41,55,.11)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.wide{grid-column:1/-1}.form-card input,.form-card select,.form-card textarea{width:100%;min-height:46px;background:#fff;border-color:rgba(31,41,55,.18)}.map-line{margin-top:18px;border-radius:24px;min-height:180px;background:linear-gradient(135deg,rgba(201,123,63,.18),rgba(47,125,89,.12)),linear-gradient(90deg,rgba(31,41,55,.06) 1px,transparent 1px),linear-gradient(rgba(31,41,55,.06) 1px,transparent 1px);background-size:auto,32px 32px,32px 32px;display:grid;place-items:center;text-align:center;border:1px dashed rgba(201,123,63,.44);padding:22px}.footer-premium{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:48px max(22px,calc(50vw - 590px));background:#111820;color:#fff}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr 1fr 1fr;gap:28px}.footer-grid a{color:#fff}.sticky-cta{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;gap:10px}.whatsapp{background:#24a865!important;color:#fff!important}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1)}.reveal.in-view{opacity:1;transform:none}@keyframes spin{to{transform:rotate(360deg)}}@keyframes wheel{0%,100%{background-position:center 9px}50%{background-position:center 20px}}@keyframes drillMove{0%,100%{transform:translateX(0)}50%{transform:translateX(22px)}}@keyframes pipeGrow{from{stroke-dashoffset:260}to{stroke-dashoffset:0}}@keyframes blink{0%,45%,100%{opacity:1}50%,65%{opacity:.25}}@keyframes dust{0%,100%{opacity:.2;transform:translateX(0)}50%{opacity:.75;transform:translateX(-8px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}@media(max-width:1020px){.site-nav{grid-template-columns:auto auto}.nav-links{display:none}.hero-grid,.section-head,.calculator,.contact-layout{grid-template-columns:1fr}.hero-stage{min-height:auto}.process-map,.proof-ribbon .notion-stat-grid{grid-template-columns:repeat(2,1fr)}.process-map:before{display:none}.case-grid{grid-template-columns:1fr}.case-card.major{min-height:330px}.spec-grid,.doc-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.notion-shell{padding:0 16px}.site-nav{padding:10px 14px}.logo span:last-child{font-size:18px}.header-address{font-size:11px}.header-phone{font-size:15px}.hero-stage{padding-top:28px;padding-bottom:76px}.hero-grid{gap:18px}.notion-hero h1{font-size:42px}.trust-strip,.hero-bore-stats,.process-map,.spec-grid,.doc-grid,.contact-list,.form-grid,.calc-options{grid-template-columns:1fr}.service-card.feature{grid-column:auto}.footer-grid{grid-template-columns:1fr}.sticky-cta{left:10px;right:10px;bottom:10px}.sticky-cta .notion-button{flex:1;justify-content:center}}

/* Compact price calculator polish */
.calculator{grid-template-columns:minmax(0,1.05fr) minmax(340px,.78fr);gap:20px;align-items:start}.price-table-card{background:linear-gradient(180deg,#fffaf2,#f4eadb);border-color:rgba(31,41,55,.12);box-shadow:0 18px 46px rgba(31,41,55,.075)}.price-table-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-end;padding:18px 20px 14px;background:linear-gradient(135deg,rgba(31,41,55,.96),rgba(42,55,68,.94));color:#fff}.price-table-header span{display:block;color:#f6c58f;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.price-table-header strong{display:block;margin-top:3px;font-size:22px;line-height:1.08;letter-spacing:-.04em}.price-table-header b{flex:0 0 auto;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);font-size:13px}.price-table{width:100%;border-collapse:separate;border-spacing:0;margin:0!important;background:transparent;border:0!important;box-shadow:none!important}.price-table th{padding:12px 18px;background:rgba(201,123,63,.10);color:var(--copper-2);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.price-table td{padding:14px 18px;border-bottom:1px solid rgba(31,41,55,.08);vertical-align:middle}.price-table tbody tr{transition:background .18s,transform .18s}.price-table tbody tr:hover{background:rgba(201,123,63,.07)}.price-table tbody tr:last-child td{border-bottom:0}.pipe-diameter{display:inline-flex;align-items:center;justify-content:center;min-width:62px;padding:7px 10px;border-radius:14px;background:#1f2937;color:#fff;font-weight:950;letter-spacing:-.03em;box-shadow:inset 4px 0 0 #2f8ee5}.price-table td small{margin-left:6px;color:var(--muted);font-weight:800}.meter-price{font-size:20px;font-weight:950;color:var(--copper-2);letter-spacing:-.04em;white-space:nowrap;font-feature-settings:"tnum"}.price-table-note{padding:12px 18px 16px;color:var(--muted);font-size:13px;background:rgba(255,255,255,.38)}.calc-panel{padding:20px;border-radius:28px}.calc-header{display:block;margin-bottom:14px}.calc-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.calc-header h3{font-size:24px;margin:0}.calc-header p{width:100%;font-size:14px;line-height:1.45}.calc-badge{padding:7px 9px;font-size:11px}.calc-fields{gap:12px}.calc-field-title,.calc-field legend{margin-bottom:6px}.input-wrap{padding:6px 11px;border-radius:16px}.input-wrap input{font-size:24px}.calc-hint{min-height:auto;margin-top:4px}.calc-options{grid-template-columns:1fr 1fr;gap:8px}.calc-option-card{min-height:62px;padding:10px 11px;gap:4px}.calc-option-card strong{font-size:16px}.calc-option-card span{font-size:11px;line-height:1.25}.calc-option-card b{font-size:13px}.calc-summary{margin-top:12px;padding:12px 14px;border-radius:20px}.calc-summary-row{margin-bottom:6px;font-size:12px}.calc-summary-row strong{font-size:13px}.calc-total{padding-top:8px}.calc-total span{font-size:13px}.calc-total b{font-size:clamp(28px,3vw,34px)}.calc-note{margin-top:10px;font-size:12px;line-height:1.35}.calc-actions{margin-top:12px}.calc-actions .notion-button{padding:8px 10px;font-size:13px}@media(max-width:1020px){.calculator{grid-template-columns:1fr}.calc-panel{max-width:none}}@media(max-width:640px){.price-table-header{display:block}.price-table-header b{display:inline-flex;margin-top:10px}.price-table th:nth-child(3),.price-table td:nth-child(3){display:none}.price-table th,.price-table td{padding:12px 12px}.meter-price{font-size:18px}.calc-title-row{align-items:flex-start;flex-direction:column}.calc-options{grid-template-columns:1fr}.calc-actions{flex-direction:column}}

/* Price section layout: calculator aligned with intro, inclusions in left column */
.price-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.78fr);gap:22px;align-items:start}.price-main{display:grid;gap:20px}.price-intro h2{margin-top:0}.price-intro p:last-child{max-width:760px}.price-include-card{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;margin:0;padding:16px 18px;background:linear-gradient(135deg,rgba(47,125,89,.10),rgba(201,123,63,.08));border-top:1px solid rgba(31,41,55,.08)}.price-include-icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#2f7d59;color:#fff;font-weight:950;box-shadow:0 10px 24px rgba(47,125,89,.22)}.price-include-card strong{display:block;margin:0 0 4px;font-size:16px;color:var(--ink)}.price-include-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.5}.price-layout .calc-panel{margin-top:0}@media(max-width:1020px){.price-layout{grid-template-columns:1fr}.price-layout .calc-panel{order:-1}.price-main{gap:16px}}@media(max-width:640px){.price-include-card{grid-template-columns:1fr;padding:14px}.price-include-icon{width:30px;height:30px}}

/* Hero scroll hint: centered in hero flow, below main hero content, never over header */
.scroll-note{position:relative;z-index:4;width:max-content;max-width:calc(100% - 44px);margin:34px auto 0;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 14px;border-radius:999px;background:rgba(18,26,35,.46);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px);color:rgba(255,255,255,.74);font-size:13px;font-weight:700;white-space:nowrap;box-shadow:0 14px 34px rgba(0,0,0,.18)}.scroll-note:before{content:"";width:18px;height:28px;border:1px solid rgba(255,255,255,.42);border-radius:999px;background:linear-gradient(#fff,#fff) center 7px/3px 6px no-repeat;animation:wheel 1.7s ease infinite;flex:0 0 auto}@media(max-width:640px){.scroll-note{margin-top:24px;white-space:normal;text-align:center;line-height:1.25}}

/* Icon-only hero scroll animation */
.scroll-note:empty{width:48px;height:48px;padding:9px;margin-left:auto;margin-right:auto}.scroll-note:empty:before{margin:auto}

/* Dark section quote attribution fix */
.section-dark .notion-quote{border-left-color:var(--copper);background:rgba(255,255,255,.08);border-radius:22px;padding:18px 20px 18px 22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)}.section-dark .notion-quote p{color:#fff}.section-dark .notion-attribution{display:block;margin-top:14px}.section-dark .notion-attribution-name{display:block;color:#f6c58f!important;font-weight:900;letter-spacing:.02em}.section-dark .notion-attribution-meta{display:block;margin-top:2px;color:rgba(255,255,255,.78)!important;font-weight:700}

/* Contact section map */
.contact-map-card{margin-top:18px;overflow:hidden;border-radius:26px;background:rgba(255,250,242,.96);border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 70px rgba(0,0,0,.20);color:var(--ink)}.contact-map-visual{padding:10px;background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.04))}.contact-map-visual svg{display:block;width:100%;height:auto;border-radius:20px}.contact-map-info{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:18px;background:#fffaf2}.contact-map-info h3{margin:8px 0 4px;color:var(--ink)}.contact-map-info p{margin:0;color:var(--muted);font-size:14px}.contact-map-info .map-hours{margin-top:6px;color:var(--copper-2);font-weight:800}.contact-map-info .notion-button{flex:0 0 auto}.contact-panel .contact-map-card a{color:inherit}@media(max-width:640px){.contact-map-info{display:block}.contact-map-info .notion-button{width:100%;justify-content:center;margin-top:14px}.contact-map-visual{padding:8px}}

/* Premium button micro-interactions */
.notion-button{position:relative;isolation:isolate;overflow:hidden;transform:translateY(0) scale(1);transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s cubic-bezier(.2,.8,.2,1),border-color .22s ease,background .22s ease,color .22s ease;will-change:transform,box-shadow}.notion-button:before{content:"";position:absolute;z-index:-1;inset:-2px;transform:translateX(-115%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);transition:transform .72s cubic-bezier(.2,.8,.2,1);pointer-events:none}.notion-button:after{content:"";position:absolute;z-index:-2;inset:0;border-radius:inherit;background:radial-gradient(circle at 50% 120%,rgba(255,255,255,.26),transparent 48%);opacity:0;transition:opacity .22s ease;pointer-events:none}.notion-button:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 18px 42px rgba(201,123,63,.28),0 6px 16px rgba(31,41,55,.12)}.notion-button:hover:before{transform:translateX(115%) skewX(-18deg)}.notion-button:hover:after{opacity:1}.notion-button:active{transform:translateY(-1px) scale(.985);box-shadow:0 8px 22px rgba(31,41,55,.16)}.notion-button:focus-visible{outline:3px solid rgba(201,123,63,.42);outline-offset:3px}.notion-button[data-variant="primary"]{animation:buttonBreath 3.2s ease-in-out infinite}.notion-button[data-variant="primary"]:hover{box-shadow:0 20px 50px rgba(201,123,63,.38),0 0 0 1px rgba(255,255,255,.16) inset}.whatsapp{background:linear-gradient(135deg,#24a865,#38c878)!important;box-shadow:0 14px 34px rgba(36,168,101,.24)!important}.whatsapp:hover{box-shadow:0 20px 48px rgba(36,168,101,.38),0 0 0 1px rgba(255,255,255,.18) inset!important}.sticky-cta .notion-button{animation:stickyButtonFloat 4s ease-in-out infinite}.sticky-cta .notion-button:nth-child(2){animation-delay:.4s}@keyframes buttonBreath{0%,100%{box-shadow:0 12px 26px rgba(201,123,63,.18)}50%{box-shadow:0 16px 38px rgba(201,123,63,.30)}}@keyframes stickyButtonFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@media(prefers-reduced-motion:reduce){.notion-button,.sticky-cta .notion-button{animation:none!important;transition:none!important}.notion-button:before,.notion-button:after{display:none!important}.notion-button:hover,.notion-button:active{transform:none!important}}

/* Standalone map under contact columns */
.contact-map-standalone{margin-top:24px}.contact-map-standalone .contact-map-card{margin-top:0}.contact-panel>.contact-map-card{display:none}.contact-map-standalone .contact-map-visual svg{max-height:360px;object-fit:cover}@media(max-width:640px){.contact-map-standalone{margin-top:18px}}

/* Reviews + portfolio trust section */
.portfolio-trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 22px}.portfolio-trust-strip div{padding:16px;border-radius:20px;background:rgba(255,250,242,.76);border:1px solid rgba(31,41,55,.09);box-shadow:0 14px 38px rgba(31,41,55,.06)}.portfolio-trust-strip strong{display:block;font-size:18px;color:var(--ink);letter-spacing:-.03em}.portfolio-trust-strip span{display:block;margin-top:4px;color:var(--muted);font-size:13px;line-height:1.35}.reviews-portfolio-grid{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:18px}.review-case-card{overflow:hidden;border-radius:30px;background:#fffaf2;border:1px solid rgba(31,41,55,.10);box-shadow:0 24px 70px rgba(31,41,55,.10);display:flex;flex-direction:column;min-height:100%;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}.review-case-card:hover{transform:translateY(-5px);box-shadow:0 32px 90px rgba(31,41,55,.15);border-color:rgba(201,123,63,.32)}.review-case-card.featured{grid-row:span 2}.case-visual{padding:10px;background:linear-gradient(135deg,rgba(31,41,55,.08),rgba(201,123,63,.08))}.case-visual svg{display:block;width:100%;height:auto;border-radius:22px}.review-content{display:flex;flex-direction:column;gap:12px;padding:22px;flex:1}.review-content h3{font-size:22px;line-height:1.18;letter-spacing:-.03em;margin:0}.review-content p{margin:0;color:var(--muted)}.review-content blockquote{margin:2px 0 0;padding:14px 16px;border-left:3px solid var(--copper);border-radius:14px;background:rgba(201,123,63,.08);color:var(--ink);font-size:15px;line-height:1.5}.review-author{display:flex;gap:12px;align-items:center;margin-top:auto}.avatar{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;flex:0 0 auto;color:#fff;font-weight:950;letter-spacing:-.03em;box-shadow:0 12px 28px rgba(31,41,55,.16)}.avatar[data-tone="copper"]{background:linear-gradient(135deg,var(--copper),#e6b87a)}.avatar[data-tone="green"]{background:linear-gradient(135deg,#2f7d59,#38c878)}.avatar[data-tone="blue"]{background:linear-gradient(135deg,#2f6f9f,#5e9fe8)}.review-author strong{display:block;color:var(--ink)}.review-author span{display:block;color:var(--muted);font-size:13px}.review-author a{display:inline-block;margin-top:2px;color:var(--copper-2);font-size:13px;font-weight:800;text-decoration:none}.review-author a:hover{text-decoration:underline}.portfolio-disclaimer{margin:18px 0 0;padding:12px 14px;border-radius:16px;background:rgba(31,41,55,.06);color:var(--muted);font-size:13px}.review-content .notion-button{margin-top:4px;justify-content:center}.reviews-portfolio-grid .case-metrics{margin:0}.reviews-portfolio-grid .case-metrics span{background:rgba(31,41,55,.08);border-color:rgba(31,41,55,.10);color:var(--ink)}@media(max-width:1020px){.portfolio-trust-strip{grid-template-columns:repeat(2,1fr)}.reviews-portfolio-grid{grid-template-columns:1fr}.review-case-card.featured{grid-row:auto}}@media(max-width:640px){.portfolio-trust-strip{grid-template-columns:1fr}.review-content{padding:18px}.review-content h3{font-size:20px}.portfolio-disclaimer{font-size:12px}}

/* Portfolio and testimonial carousel */
.portfolio-showcase{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:18px}.portfolio-project-card{overflow:hidden;border-radius:30px;background:#fffaf2;border:1px solid rgba(31,41,55,.10);box-shadow:0 24px 70px rgba(31,41,55,.10);display:flex;flex-direction:column;min-height:100%;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}.portfolio-project-card:hover{transform:translateY(-5px);box-shadow:0 32px 90px rgba(31,41,55,.15);border-color:rgba(201,123,63,.32)}.portfolio-project-card.featured{grid-row:span 2}.testimonial-carousel{margin-top:24px;padding:22px;border-radius:30px;background:linear-gradient(135deg,#1f2937,#2a3744);box-shadow:0 28px 90px rgba(31,41,55,.18);overflow:hidden}.carousel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:16px}.carousel-head h3{margin:0;color:#fff;font-size:30px;letter-spacing:-.045em}.carousel-head .section-kicker{color:#f6c58f}.testimonial-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(320px,390px);gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:2px 2px 12px;scrollbar-color:rgba(246,197,143,.72) rgba(255,255,255,.10)}.testimonial-track:focus-visible{outline:2px solid #f6c58f;outline-offset:4px}.testimonial-card{scroll-snap-align:start;display:flex;flex-direction:column;gap:14px;min-height:260px;padding:20px;border-radius:24px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.13);color:#fff}.testimonial-top{display:flex;align-items:center;gap:12px}.testimonial-top strong{display:block;color:#fff}.testimonial-top span{display:block;color:rgba(255,255,255,.65);font-size:13px}.testimonial-card blockquote{margin:0;padding:0;border:0;color:rgba(255,255,255,.88);font-size:16px;line-height:1.55}.testimonial-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.testimonial-tags span{padding:7px 9px;border-radius:999px;background:rgba(246,197,143,.14);border:1px solid rgba(246,197,143,.20);color:#f6c58f;font-size:12px;font-weight:850}.video-testimonial{background:radial-gradient(circle at 80% 0,rgba(201,123,63,.26),transparent 12rem),rgba(255,255,255,.09)}.video-preview{min-height:120px;border-radius:18px;background:linear-gradient(135deg,rgba(0,0,0,.28),rgba(201,123,63,.22));border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;text-align:center;padding:18px}.play-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#c97b3f;color:#fff;box-shadow:0 16px 38px rgba(201,123,63,.35)}.video-preview strong{display:block;margin-top:10px;color:#fff}.video-preview em{display:block;color:rgba(255,255,255,.62);font-size:12px;font-style:normal}.portfolio-showcase .case-metrics span{background:rgba(31,41,55,.08);border-color:rgba(31,41,55,.10);color:var(--ink)}@media(max-width:1020px){.portfolio-showcase{grid-template-columns:1fr}.portfolio-project-card.featured{grid-row:auto}.testimonial-track{grid-auto-columns:minmax(300px,82vw)}}@media(max-width:640px){.carousel-head{display:block}.carousel-head .notion-button{width:100%;justify-content:center;margin-top:12px}.testimonial-carousel{padding:18px;border-radius:26px}.testimonial-track{grid-auto-columns:minmax(280px,88vw)}.portfolio-showcase .review-content{padding:18px}}

/* Trust metrics section layout fix */
.proof-ribbon{position:relative;z-index:3;margin:34px 0 22px;padding:0}.proof-ribbon .notion-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0}.proof-ribbon .notion-stat{min-height:156px;display:grid;grid-template-rows:auto auto 1fr;padding:20px;border-radius:24px;background:linear-gradient(180deg,#fffaf2,#f3eadc);border:1px solid rgba(31,41,55,.10);box-shadow:0 18px 48px rgba(31,41,55,.08);position:relative;overflow:hidden}.proof-ribbon .notion-stat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,var(--copper),#e6b87a)}.proof-ribbon .notion-stat-label{margin:0 0 8px;color:var(--copper-2);font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.proof-ribbon .notion-stat-value{margin:0;font-size:clamp(30px,3.2vw,42px);line-height:1;letter-spacing:-.06em;color:var(--ink);font-weight:950}.proof-ribbon .notion-stat-caption{margin:12px 0 0;color:var(--muted);font-size:14px;line-height:1.42}.hero-stage+.proof-ribbon{clear:both}@media(max-width:1020px){.proof-ribbon{margin-top:26px}.proof-ribbon .notion-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.proof-ribbon .notion-stat{min-height:140px}}@media(max-width:640px){.proof-ribbon{margin:22px 0 12px}.proof-ribbon .notion-stat-grid{grid-template-columns:1fr}.proof-ribbon .notion-stat{min-height:auto;padding:18px 18px 18px 20px}}

/* Header background fix: remove light strip above hero */
.site-header{background:rgba(18,26,35,.92)!important;border-bottom:1px solid rgba(255,255,255,.12)!important;box-shadow:0 10px 34px rgba(0,0,0,.18);backdrop-filter:blur(22px) saturate(1.1)}.site-header .logo{color:#fff}.site-header .nav-links a{color:rgba(255,255,255,.72)}.site-header .nav-links a:hover{color:#fff}.site-header .header-address{color:rgba(255,255,255,.64)}.site-header .header-phone{color:#fff}.site-header .header-phone:hover{color:#f6c58f}.site-header .nav-links a:after{background:#f6c58f}.site-header + .notion-shell .hero-stage{margin-top:0}

/* Modern interactive service cards */
.service-bento-grid{display:grid;gap:18px}.service-sub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}.service-card-pro{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:100%;border-radius:30px;background:linear-gradient(180deg,#fffaf2,#f2e7d8);border:1px solid rgba(31,41,55,.12);box-shadow:0 24px 70px rgba(31,41,55,.10);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s cubic-bezier(.2,.8,.2,1),border-color .28s ease}.service-card-pro:before{content:"";position:absolute;inset:0 0 auto;height:7px;background:linear-gradient(90deg,var(--copper),#f2b240,#2f8ee5);opacity:.95}.service-card-pro:after{content:"";position:absolute;inset:-40% -30% auto auto;width:220px;height:220px;border-radius:50%;background:rgba(201,123,63,.12);transition:transform .35s ease,opacity .35s ease}.service-card-pro:hover{transform:translateY(-8px);box-shadow:0 34px 100px rgba(31,41,55,.18);border-color:rgba(201,123,63,.42)}.service-card-pro:hover:after{transform:scale(1.35);opacity:.9}.service-primary{flex-direction:row;align-items:stretch;background:radial-gradient(circle at 90% 0,rgba(201,123,63,.22),transparent 22rem),linear-gradient(120deg,#fffaf2,#ead8bf)}.service-primary .service-visual-wrap{flex:0 0 42%;display:flex;align-items:center;padding:26px 8px 26px 26px}.service-primary .service-copy{justify-content:center;padding:30px 34px}.service-primary .service-copy h3{font-size:clamp(24px,2.4vw,33px)}.service-primary .service-footer{margin-top:18px}.service-visual-wrap{position:relative;z-index:1;padding:18px 18px 0}.service-visual-wrap.compact{padding:16px 16px 0}.service-visual{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 24px rgba(31,41,55,.10))}.service-primary .service-visual{min-height:0}.service-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:22px;flex:1}.service-copy h3{font-size:clamp(21px,2.2vw,30px);line-height:1.12;letter-spacing:-.04em;margin:0;color:var(--ink)}.service-card-pro:not(.service-primary) .service-copy h3{font-size:22px}.service-copy p{margin:0;color:var(--muted)}.service-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:auto;padding-top:12px;border-top:1px solid rgba(31,41,55,.08)}.service-footer .price{margin:0}.service-footer .notion-button{flex:0 0 auto;white-space:nowrap}.svc-pipe,.svc-pipe-blue{stroke-dasharray:260;animation:svcPipe 3.2s ease-in-out infinite alternate}.svc-drill{animation:svcDrill 3.8s ease-in-out infinite}.svc-water-flow{stroke-dasharray:180;animation:svcPipe 2.8s ease-in-out infinite alternate}.svc-drop{animation:svcDrop 2.2s ease-in-out infinite}.svc-stamp{animation:svcStamp 2.6s ease-in-out infinite}.svc-check{stroke-dasharray:140;animation:svcCheck 3s ease-in-out infinite alternate}.svc-ring{animation:svcRing 2.8s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 50%}@keyframes svcPipe{from{stroke-dashoffset:260}to{stroke-dashoffset:0}}@keyframes svcDrill{0%,100%{transform:translate(88px,74px)}50%{transform:translate(102px,78px)}}@keyframes svcDrop{0%,100%{transform:translateY(0);opacity:.85}50%{transform:translateY(8px);opacity:1}}@keyframes svcStamp{0%,100%{transform:scale(1);transform-origin:center;transform-box:fill-box}50%{transform:scale(1.08)}}@keyframes svcCheck{from{stroke-dashoffset:140}to{stroke-dashoffset:0}}@keyframes svcRing{0%,100%{transform:scale(.94);opacity:.22}50%{transform:scale(1.05);opacity:.48}}@media(max-width:1020px){.service-primary{flex-direction:column}.service-primary .service-visual-wrap{flex:auto;padding:16px 16px 0}.service-primary .service-copy{padding:22px}}@media(max-width:640px){.service-bento-grid{grid-template-columns:1fr}.service-card-pro{border-radius:26px}.service-footer{align-items:flex-start;flex-direction:column}.service-footer .notion-button{width:100%;justify-content:center}.service-visual-wrap,.service-visual-wrap.compact{padding:12px 12px 0}.service-copy{padding:18px}.service-card-pro:not(.service-primary) .service-copy h3{font-size:21px}}@media(prefers-reduced-motion:reduce){.service-card-pro,.service-card-pro:after,.svc-pipe,.svc-pipe-blue,.svc-drill,.svc-water-flow,.svc-drop,.svc-stamp,.svc-check,.svc-ring{animation:none!important;transition:none!important}}
.contact-map-iframe{display:block;width:100%;height:380px;border:0;border-radius:20px}@media(max-width:640px){.contact-map-iframe{height:300px}}