/*
Theme Name: Royal
Theme URI: https://royalmedicaltrans.com
Author: Royal Medical Transportation
Description: Block theme for Royal Medical Transportation. No page builder required; every page is edited in the standard WordPress editor.
Version: 1.2.0
Requires at least: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: royal
*/

/* Only what theme.json can't express. Colors/fonts/spacing come from theme.json presets. */
:root {
	--royal-radius: 24px;
	--royal-section-y: clamp(2.5rem, 6vw, 4rem);
}

/* ---------- Header ---------- */
.royal-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .royal-header { top: var(--wp-admin--admin-bar--height, 0); }
.royal-header .wp-block-site-logo img { height: 48px; width: auto; }
.royal-header .wp-block-navigation a:hover,
.royal-header .wp-block-navigation a:focus-visible { color: var(--wp--preset--color--green-dark); }
.royal-header .wp-block-navigation [aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.royal-header__phone { line-height: 1.3; text-align: right; }
.royal-header__phone a { text-decoration: none; }
@media (max-width: 1199px) { .royal-header__phone { display: none; } }

/* ---------- Footer ---------- */
.royal-footer a { color: inherit; }
.royal-footer a:hover, .royal-footer a:focus-visible { color: var(--wp--preset--color--green-light); }
.royal-footer .royal-footer__logo img { filter: brightness(0) invert(1); height: 44px; width: auto; }
.royal-footer .wp-block-navigation a { text-decoration: none; }

/* ---------- Sections ---------- */
.royal-section { padding-block: var(--royal-section-y); }
.royal-section + .royal-section:not(.royal-white):not(.royal-cta-band) { padding-top: 0; } /* stacked paper sections share one gap */
.royal-white { background: var(--wp--preset--color--white); }
.royal-border-top { border-top: 1px solid var(--wp--preset--color--line); }
.royal-grid { gap: 1rem; }

/* ---------- Type helpers ---------- */
.royal-kicker { color: var(--wp--preset--color--green-dark); font-size: var(--wp--preset--font-size--small); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: .5rem; }
.royal-lead { color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--large); line-height: 1.6; }
.royal-lead-lg { font-size: var(--wp--preset--font-size--x-large); font-weight: 600; line-height: 1.35; }
.royal-muted { color: var(--wp--preset--color--muted); }
.royal-small { font-size: var(--wp--preset--font-size--small); opacity: .8; }
.royal-statement { font-size: var(--wp--preset--font-size--xx-large); font-weight: 700; line-height: 1.2; }
.royal-h3, .royal-row-title { font-size: var(--wp--preset--font-size--x-large); }
.royal-num { color: var(--wp--preset--color--green-dark); font-weight: 700; font-variant-numeric: tabular-nums; margin: 0; }
.royal-more a, .royal-links a { font-weight: 700; text-decoration: none; }
.royal-section-head { margin-bottom: 1.5rem; }
.royal-section-head h2 { margin: 0; }

/* ---------- Hero (text + photo) ---------- */
.royal-hero h1 { margin-top: 0; }
.royal-hero-media img { width: 100%; height: clamp(18rem, 38vw, 28rem); object-fit: cover; border-radius: var(--royal-radius); }

/* ---------- Cards ---------- */
.royal-card { background: var(--wp--preset--color--white); border-radius: var(--royal-radius); padding: 1.5rem; }
.royal-white .royal-card { background: var(--wp--preset--color--paper); }
.royal-card > :first-child { margin-top: 0; }
.royal-card h3 { margin: 0 0 .5rem; }

/* Photo tiles: whole tile is the link */
.royal-tile { position: relative; border-radius: var(--royal-radius); overflow: hidden; margin: 0; }
.royal-tile figure { margin: 0; }
.royal-tile img { width: 100%; height: 18rem; object-fit: cover; display: block; transition: transform .5s ease; }
.royal-tile::before { content: ""; position: absolute; inset: 0; background: rgb(54 72 158 / .5); z-index: 1; pointer-events: none; }
.royal-tile__label { position: absolute; left: 1.5rem; bottom: 1.25rem; margin: 0; z-index: 2; font-size: var(--wp--preset--font-size--x-large); font-weight: 800; }
.royal-tile__label a { color: #fff; text-decoration: none; }
.royal-tile__label a::after { content: ""; position: absolute; inset: -100vh -100vw; } /* stretch link over tile */
.royal-tile:hover img { transform: scale(1.03); }
.royal-tile:focus-within { outline: 3px solid var(--wp--preset--color--navy); outline-offset: 3px; }

/* Service cards */
.royal-service-card { position: relative; border: 1px solid var(--wp--preset--color--line); border-radius: var(--royal-radius); overflow: hidden; background: #fff; }
.royal-service-card figure { margin: 0; }
.royal-service-card img { width: 100%; height: 11rem; object-fit: cover; display: block; }
.royal-service-card__body { padding: 1.25rem; }
.royal-service-card h3 { margin: 0; }
.royal-service-card h3 a { text-decoration: none; }
.royal-service-card h3 a::after { content: ""; position: absolute; inset: 0; }
.royal-service-card:hover h3 a { color: var(--wp--preset--color--green-dark); }
.royal-service-card:focus-within { outline: 3px solid var(--wp--preset--color--navy); outline-offset: 2px; }

/* ---------- Rows (numbered lists) ---------- */
.royal-rows .royal-row { padding-block: 1.5rem; margin: 0; }
.royal-rows .royal-row + .royal-row { border-top: 1px solid var(--wp--preset--color--line); }
.royal-row h2, .royal-row h3 { margin: 0 0 .25rem; }
.royal-row p { margin: 0; }
.royal-row-thumb { margin: 0; }
.royal-row-thumb img { width: 160px; height: 112px; object-fit: cover; border-radius: 12px; display: block; }
.royal-row-title a { text-decoration: none; }

/* ---------- Bands ---------- */
.royal-band .royal-grid { gap: 0; }
.royal-band figure { margin: 0; }
.royal-band img { width: 100%; height: clamp(16rem, 28vw, 24rem); object-fit: cover; display: block; }
.royal-cta-band { background: var(--wp--preset--color--green-dark); padding-block: clamp(2rem, 5vw, 3rem); }
.royal-cta-band__link { margin: 0; font-size: var(--wp--preset--font-size--xx-large); font-weight: 800; }
.royal-cta-band__link a { color: #fff; text-decoration: none; }
.royal-cta-band__link a:hover, .royal-cta-band__link a:focus-visible { text-decoration: underline; }

/* ---------- FAQ ---------- */
.royal-faq .wp-block-details { border-top: 1px solid var(--wp--preset--color--line); padding-block: 1.1rem; margin: 0; }
.royal-faq .wp-block-details:last-child { border-bottom: 1px solid var(--wp--preset--color--line); }
.royal-faq summary { font-weight: 800; cursor: pointer; }
.royal-faq .wp-block-details p { color: var(--wp--preset--color--muted); margin: .75rem 0 0; }

/* ---------- Team ---------- */
.royal-team { padding: 0; background: transparent !important; }
.royal-team figure { margin: 0 0 1.25rem; }
.royal-team img { width: 100%; height: clamp(22rem, 42vw, 32rem); object-fit: cover; object-position: center 18%; border-radius: var(--royal-radius); display: block; }
.royal-team .is-contain img { object-fit: contain; background: var(--wp--preset--color--navy); }

/* ---------- Contact / forms ---------- */
.royal-navy-panel { background: var(--wp--preset--color--navy) !important; color: #fff; padding: clamp(1.5rem, 4vw, 3rem); }
.royal-navy-panel h1, .royal-navy-panel a { color: #fff; }
.royal-navy-panel h1 { font-size: clamp(1.9rem, 7.5vw, 3.25rem); overflow-wrap: normal; }
.royal-navy-panel .royal-kicker { color: var(--wp--preset--color--green-light); }
.royal-navy-panel .royal-lead { color: #fff; }
.royal-form-card { padding: clamp(1.25rem, 3vw, 2rem); }
.royal-license img { border: 1px solid var(--wp--preset--color--line); border-radius: 12px; background: #fff; }
.royal-bbb { background: #fff; display: inline-block; padding: 8px 12px; line-height: 0; }

/* Prefixed with body .wp-site-blocks: the host injects a block-theme "contrast fallback" that strips input borders. */
body .wp-site-blocks .wpcf7 form br { display: none; }
body .wp-site-blocks .wpcf7 form p { margin: 0 0 12px; }
body .wp-site-blocks .wpcf7 label { display: block; font-weight: 600; margin-bottom: 12px; }
body .wp-site-blocks .wpcf7 .wpcf7-form-control-wrap { display: block; margin-top: 4px; font-weight: 400; }
body .wp-site-blocks .wpcf7 input:not([type=submit]):not([type=checkbox]):not([type=radio]),
body .wp-site-blocks .wpcf7 select,
body .wp-site-blocks .wpcf7 textarea {
	box-sizing: border-box; width: 100%; padding: 12px 14px; font: inherit; color: var(--wp--preset--color--navy);
	border: 1px solid #c3cad6 !important; border-radius: 10px !important; background: #fff !important; /* !important: host fallback uses a longer :not() chain */
}
body .wp-site-blocks .wpcf7 input:focus-visible, body .wp-site-blocks .wpcf7 select:focus-visible, body .wp-site-blocks .wpcf7 textarea:focus-visible { outline: 2px solid var(--wp--preset--color--navy); outline-offset: 1px; }
body .wp-site-blocks .wpcf7 div[style*="grid"] { display: block !important; }
body .wp-site-blocks .wpcf7 div[style*="grid"] > p { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 16px; align-items: end; margin: 0; }
body .wp-site-blocks .wpcf7 .wpcf7-submit { background: var(--wp--preset--color--green-dark); color: #fff; border: 0; border-radius: 999px; padding: 14px 28px; font: inherit; font-weight: 700; cursor: pointer; }
body .wp-site-blocks .wpcf7 .wpcf7-submit:hover, body .wp-site-blocks .wpcf7 .wpcf7-submit:focus-visible { background: var(--wp--preset--color--navy); }
body .wp-site-blocks .wpcf7 fieldset { border: 0; padding: 0; margin: 0 0 12px; }
body .wp-site-blocks .wpcf7 .wpcf7-list-item { margin: 0 16px 0 0; }

/* ---------- Posts (Knowledge Hub) ---------- */
.royal-posts .wp-block-post { background: #fff; border-radius: var(--royal-radius); overflow: hidden; }
.royal-posts .wp-block-columns { margin: 0; }
.royal-posts .wp-block-post-featured-image { height: 100%; margin: 0; }
.royal-posts .wp-block-post-featured-image img { height: 100%; min-height: 12rem; object-fit: cover; }
.royal-posts .wp-block-post-title { margin: .25rem 0 .5rem; }
.royal-posts .wp-block-post-title a { text-decoration: none; }

@media (prefers-reduced-motion: reduce) {
	.royal-tile img { transition: none; }
}