/* Utiligence – layout styles for the tile-based design */
html { scroll-behavior: smooth; }
body { margin: 0; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
[id] { scroll-margin-top: 90px; }

/* Header */
.utg-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid #1e1e24; padding: 14px 24px; }
.admin-bar .utg-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .utg-header { top: 46px; } }
.utg-header .wp-block-site-logo img { height: auto; }
.utg-nav a { color: var(--wp--preset--color--ink); text-decoration: none; font-weight: 500; font-size: .95rem; letter-spacing: .03em; text-transform: uppercase; }
.utg-nav a:hover { color: var(--wp--preset--color--orange); }

/* Tile grid */
.wp-block-columns.utg-tiles { gap: 0 !important; margin: 0 !important; }
.utg-tiles > .wp-block-column { display: flex; flex-direction: column; justify-content: center; min-height: 380px; margin: 0 !important; }
.utg-tile { box-sizing: border-box; padding: clamp(2rem, 5vw, 4.5rem); text-align: center; }
.utg-tile p { font-size: clamp(1.05rem, 1.4vw, 1.3rem); line-height: 1.75; color: var(--wp--preset--color--text); max-width: 34em; margin-left: auto; margin-right: auto; }
.utg-tile--lead p { color: var(--wp--preset--color--ink); font-size: clamp(1.2rem, 1.8vw, 1.55rem); }
.utg-tile--purple { background: var(--wp--preset--color--purple); }
.utg-tile--orange { background: var(--wp--preset--color--orange); text-align: left; }
.utg-tile--orange p, .utg-tile--orange h2, .utg-tile--orange a { color: #fff; }
.utg-tile--orange h2 { margin-bottom: .25em; }
.utg-tile--orange a:hover { color: #fff; text-decoration-thickness: 2px; }
.utg-tile--icon img { width: min(220px, 60%); height: auto; }
.utg-tile--icon .wp-block-image { margin: 0 auto; }

/* Photo tiles fill their cell */
.utg-photo { position: relative; padding: 0 !important; overflow: hidden; }
.utg-photo .wp-block-image { margin: 0; height: 100%; }
.utg-photo .wp-block-image img { display: block; width: 100%; height: 100%; min-height: 380px; object-fit: cover; }

/* Outline button on purple */
.utg-tile--purple .wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; border: 1px solid #fff; color: #fff; padding: .85em 3em; font-size: 1.2rem; border-radius: 0; }
.utg-tile--purple .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--purple); }

/* Why choose */
.utg-why { background-color: var(--wp--preset--color--mist); background-size: cover; background-position: center; padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 12vw, 10rem) !important; }
.utg-why h2 { margin-bottom: 1.5em; }
.utg-why h3 { margin: 1.6em 0 .2em; font-weight: 500; }
.utg-why p { margin-top: 0; max-width: 52em; }

/* Commitment */
.utg-commitment { padding: clamp(3.5rem, 8vw, 7rem) 1.5rem !important; text-align: center; }
.utg-commitment p { max-width: 44em; margin-left: auto; margin-right: auto; }

/* Contact */
.utg-contact { background: var(--wp--preset--color--mist); padding: clamp(3rem, 7vw, 5.5rem) 1.5rem !important; }
.utg-contact .utg-contact-inner { max-width: 760px; margin: 0 auto; }
.utg-contact h2, .utg-contact > .utg-contact-inner > p { text-align: center; }
.wpcf7 label { display: block; font-weight: 500; color: var(--wp--preset--color--ink); }
.wpcf7 input[type=text], .wpcf7 input[type=email], .wpcf7 input[type=tel], .wpcf7 textarea {
	width: 100%; box-sizing: border-box; margin-top: .35em; padding: .8em 1em; border: 1px solid #c9ccd3; background: #fff; font: inherit; border-radius: 0;
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: 2px solid var(--wp--preset--color--purple); outline-offset: 0; border-color: transparent; }
.wpcf7 textarea { height: 160px; }
.wpcf7 input[type=submit] { background: var(--wp--preset--color--purple); color: #fff; border: 0; padding: .9em 2.6em; font: inherit; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.wpcf7 input[type=submit]:hover { background: var(--wp--preset--color--orange); }
.utg-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
@media (max-width: 640px) { .utg-form-row { grid-template-columns: 1fr; } }

/* Footer */
.utg-footer { background: var(--wp--preset--color--ink); color: #c9ccd3; padding: 2.5rem 24px !important; font-size: .9rem; }
.utg-footer a { color: #fff; }
.utg-footer .wp-block-image img { width: 44px; height: auto; }

/* Mobile: tiles stack; keep text before image in each pair */
@media (max-width: 781px) {
	.utg-tiles > .wp-block-column { min-height: 0; }
	.utg-photo .wp-block-image img { min-height: 260px; max-height: 360px; }
	.utg-tile--orange { text-align: center; }
}

/* Generic pages */
.utg-page { padding: 4rem 1.5rem !important; }

/* Hero title (sentence case, ink, like the brochure) */
.utg-hero-title { color: var(--wp--preset--color--ink); text-transform: none; font-weight: 500; font-size: clamp(1.35rem, 2.1vw, 1.85rem); line-height: 1.65; max-width: 22em; margin: 0 auto; }
@media (max-width: 781px) { .wp-block-columns.utg-tiles.utg-reverse-mobile { flex-direction: column-reverse; } }

/* Equal 50/50 tiles; photos fill their tile exactly */
@media (min-width: 782px) {
	.utg-tiles > .wp-block-column { flex: 1 1 50% !important; min-width: 0; min-height: 420px; }
	.utg-photo .wp-block-image { position: absolute; inset: 0; }
	.utg-photo .wp-block-image img { min-height: 0; }
}
.utg-photo .wp-block-image, .utg-photo .wp-block-image img { margin: 0 !important; }
.utg-tile--orange p { margin-left: 0; font-size: clamp(1.15rem, 1.6vw, 1.45rem); }
@media (max-width: 781px) { .utg-tile--orange p { margin-left: auto; } }
.utg-why p, .utg-commitment p { font-size: 1.12rem; }
.utg-why h3 { font-size: 1.15rem; }