/*
Theme Name: Hajjo Media
Theme URI: https://hajjomedia.com/
Author: Hajjo Media
Description: Cinematic dark block theme for Hajjo Media – drone, film, CGI and AI production in the UAE. Fully editable in the Site Editor.
Version: 2.7.6
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hajjo-media
*/

/* ---------- Base ---------- */
body { -webkit-font-smoothing: antialiased; }
.hm-wrap { max-width: 1280px; margin-left: auto !important; margin-right: auto !important; padding-left: 40px; padding-right: 40px; box-sizing: border-box; }
.hm-mono, .hm-eyebrow, .hm-num { font-family: var(--wp--preset--font-family--mono); }
.hm-eyebrow { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin: 0 0 28px; }
.hm-accent { color: var(--wp--preset--color--accent); }

/* ---------- Header ---------- */
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar header.wp-block-template-part { top: 32px; }
.hm-header { background: rgba(10,10,11,.92); border-bottom: 1px solid var(--wp--preset--color--line); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.hm-header-inner { min-height: 72px; }
.hm-header .wp-block-site-title { font-weight: 800; font-stretch: 112%; letter-spacing: .04em; font-size: 20px; text-transform: uppercase; margin: 0; }
.hm-header .wp-block-site-title a { text-decoration: none; }
.hm-header .wp-block-site-logo img { max-height: 40px; width: auto; }
.hm-brand:has(.wp-block-site-logo img) .wp-block-site-title { display: none; }
.hm-footer .hm-brand .wp-block-site-logo img { max-height: 28px; width: auto; }
.hm-nav { font-size: 15px; }
.hm-nav a { color: var(--wp--preset--color--soft) !important; text-decoration: none; }
.hm-nav a:hover { color: var(--wp--preset--color--bone) !important; }

/* ---------- Buttons ---------- */
.wp-block-button .wp-block-button__link { border-radius: 0; font-weight: 700; padding: 14px 22px; min-height: 44px; box-sizing: border-box; }
.hm-btn-primary .wp-block-button__link { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }
.hm-btn-primary .wp-block-button__link:hover { background: var(--wp--preset--color--bone); color: var(--wp--preset--color--ink); }
.hm-btn-ghost .wp-block-button__link { background: transparent; color: var(--wp--preset--color--bone); border: 1px solid var(--wp--preset--color--bone); }
.hm-btn-ghost .wp-block-button__link:hover { background: var(--wp--preset--color--bone); color: var(--wp--preset--color--ink); }

/* ---------- Hero ---------- */
.hm-hero { padding-top: 96px; padding-bottom: 48px; }
.hm-h1 { font-size: clamp(52px, 8.4vw, 116px) !important; line-height: .92 !important; font-weight: 800; font-stretch: 118%; letter-spacing: -.02em; text-transform: uppercase; margin: 0 !important; }
.hm-hero-row { margin-top: 48px !important; gap: 40px; }
.hm-lead { max-width: 520px; font-size: 20px; line-height: 1.5; color: var(--wp--preset--color--soft); margin: 0; }
.hm-reel { padding-bottom: 80px; }
.hm-media { margin: 0 !important; border: 1px solid var(--wp--preset--color--line); }
.hm-media img { display: block; width: 100%; height: auto; }

/* ---------- Clients ---------- */
.hm-clients { border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); padding: 28px 0; }
.hm-clients-row { gap: 20px 48px; }
.hm-clients-row p { margin: 0; font-weight: 700; font-size: 18px; letter-spacing: .08em; color: var(--wp--preset--color--muted); }
.hm-clients-row p.hm-eyebrow { font-size: 12px; font-weight: 400; }

/* ---------- Section heads ---------- */
.hm-section { padding-top: 120px; padding-bottom: 120px; }
.hm-head { margin-bottom: 48px !important; gap: 24px; align-items: flex-end !important; }
.hm-h2 { font-size: clamp(36px, 4.6vw, 56px) !important; font-weight: 800; font-stretch: 112%; text-transform: uppercase; line-height: 1 !important; margin: 0 !important; }
.hm-sub { max-width: 420px; color: var(--wp--preset--color--soft); font-size: 17px; line-height: 1.55; margin: 0; }

/* ---------- Services ---------- */
.hm-services { gap: 2px !important; background: var(--wp--preset--color--line); border: 1px solid var(--wp--preset--color--line); }
.hm-service { background: var(--wp--preset--color--ink); padding: 32px 28px 36px; min-height: 340px; display: flex; flex-direction: column; gap: 20px; }
.hm-service > * { margin: 0 !important; }
.hm-num { font-size: 13px; color: var(--wp--preset--color--accent); }
.hm-service h3 { font-size: 26px; font-weight: 700; line-height: 1.1; }
.hm-service p:not(.hm-num):not(.hm-more) { color: var(--wp--preset--color--soft); font-size: 15px; line-height: 1.55; flex-grow: 1; }
.hm-more { font-size: 14px; font-weight: 600; }
.hm-more a { text-decoration: none; }

/* ---------- Work ---------- */
.hm-work { gap: 24px !important; }
.hm-work + .hm-work { margin-top: 48px !important; }
.hm-project h3 { font-size: 24px; font-weight: 700; margin: 16px 0 6px !important; }
.hm-project h3 a { text-decoration: none; }
.hm-project h3 a:hover { color: var(--wp--preset--color--accent); }
.hm-tag { font-size: 14px; color: var(--wp--preset--color--muted); margin: 0 !important; }
.hm-project .hm-media img { aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s ease; }
.hm-project .hm-media { overflow: hidden; }
.hm-project:hover .hm-media img { transform: scale(1.03); }

/* ---------- Process ---------- */
.hm-process { background: var(--wp--preset--color--bone); color: var(--wp--preset--color--ink); }
.hm-process h2, .hm-process h3 { color: var(--wp--preset--color--ink); }
.hm-steps { gap: 32px !important; margin-top: 56px !important; }
.hm-step { border-top: 2px solid var(--wp--preset--color--ink); padding-top: 20px; }
.hm-step > * { margin: 0 0 12px !important; }
.hm-step .hm-mono { font-size: 13px; }
.hm-step h3 { font-size: 24px; font-weight: 700; }
.hm-step p:not(.hm-mono) { font-size: 15px; line-height: 1.55; color: #3D3B38; }

/* ---------- Store (WooCommerce) ---------- */
.hm-store ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0 !important; padding: 0; }
.hm-store ul.products::before, .hm-store ul.products::after { display: none !important; }
.hm-store ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; }
.hm-store ul.products li.product img { aspect-ratio: 1 / 1; object-fit: cover; border: 1px solid var(--wp--preset--color--line); margin-bottom: 14px !important; }
.hm-store .woocommerce-loop-product__title { font-family: var(--wp--preset--font-family--display); font-size: 18px !important; font-weight: 700; color: var(--wp--preset--color--bone); padding: 0 !important; }
.hm-store .price { font-family: var(--wp--preset--font-family--mono); color: var(--wp--preset--color--bone) !important; font-size: 15px !important; }
.hm-store a.button { background: transparent !important; color: var(--wp--preset--color--bone) !important; border: 1px solid #3A3A40 !important; border-radius: 0 !important; min-height: 44px; display: inline-flex !important; align-items: center; font-weight: 600; }
.hm-store a.button:hover { border-color: var(--wp--preset--color--accent) !important; }

/* ---------- Contact ---------- */
.hm-contact { border-top: 1px solid var(--wp--preset--color--line); }
.hm-contact-h { font-size: clamp(40px, 5.4vw, 72px) !important; font-weight: 800; font-stretch: 118%; text-transform: uppercase; line-height: .95 !important; margin: 0 0 24px !important; max-width: 900px; }
.hm-contact .hm-lead { margin-bottom: 32px; }

/* ---------- Footer ---------- */
.hm-footer { border-top: 1px solid var(--wp--preset--color--line); padding: 40px 0; }
.hm-footer-row { gap: 20px; }
.hm-footer .wp-block-site-title { font-weight: 800; font-stretch: 112%; letter-spacing: .04em; text-transform: uppercase; font-size: 16px; margin: 0; }
.hm-footer .wp-block-site-title a { text-decoration: none; }
.hm-small { font-size: 13px; color: var(--wp--preset--color--muted); margin: 0; }
.hm-social { gap: 12px !important; }

/* ---------- Generic pages ---------- */
.hm-page { padding-top: 96px; padding-bottom: 120px; }

/* ---------- Mobile ---------- */
@media (max-width: 900px) {
  .hm-wrap { padding-left: 16px; padding-right: 16px; }
  .hm-hero { padding-top: 56px; }
  .hm-section { padding-top: 72px; padding-bottom: 72px; }
  .hm-service { min-height: 0; }
  .hm-store ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 600px) {
  .hm-store ul.products { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .admin-bar header.wp-block-template-part { top: 0; }
}

/* ---------- Video & logo ---------- */
.hm-media video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.hm-logo svg { display: block; width: auto; }

/* ---------- Contact form (Contact Form 7) ---------- */
.hm-form { display: grid; gap: 24px; max-width: 760px; }
.hm-form label, .hm-form legend { display: block; font-size: 14px; color: var(--wp--preset--color--soft); }
.hm-form fieldset { border: 0; padding: 0; margin: 0; }
.hm-form legend { margin-bottom: 10px; }
.hm-form input[type=text], .hm-form input[type=email], .hm-form input[type=tel], .hm-form textarea { display: block; width: 100%; margin-top: 8px; box-sizing: border-box; background: var(--wp--preset--color--ink-2); border: 1px solid #2E2E33; color: var(--wp--preset--color--bone); padding: 14px; min-height: 48px; font: inherit; border-radius: 0; }
.hm-form input:focus, .hm-form textarea:focus { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 0; border-color: transparent; }
.hm-form .wpcf7-checkbox, .hm-form .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 10px; }
.hm-form .wpcf7-list-item { margin: 0; }
.hm-form .wpcf7-list-item label { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #3A3A40; padding: 0 16px; min-height: 44px; color: var(--wp--preset--color--bone); cursor: pointer; }
.hm-form .wpcf7-list-item label:has(input:checked) { border-color: var(--wp--preset--color--accent); }
.hm-form .wpcf7-acceptance label { border: 0; padding: 0; color: var(--wp--preset--color--soft); }
.hm-form input[type=submit] { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); border: 0; font: inherit; font-weight: 700; min-height: 52px; padding: 0 28px; cursor: pointer; justify-self: start; }
.hm-form input[type=submit]:disabled { opacity: .5; cursor: not-allowed; }
.wpcf7-not-valid-tip { color: #FF8A65; font-size: 13px; margin-top: 6px; }
.wpcf7 form .wpcf7-response-output { margin: 24px 0 0; padding: 14px 16px; border: 1px solid var(--wp--preset--color--accent); color: var(--wp--preset--color--bone); }

/* ---------- Full-screen video hero ---------- */
.hm-hero-cover { min-height: 100vh !important; min-height: 100svh !important; padding: 0 !important; margin-top: -73px !important; align-items: flex-end !important; }
.hm-hero-cover .wp-block-cover__background { background: linear-gradient(180deg, rgba(10,10,11,.55) 0%, rgba(10,10,11,.15) 35%, rgba(10,10,11,.55) 65%, rgba(10,10,11,.95) 100%) !important; opacity: 1 !important; }
.hm-hero-cover .wp-block-cover__inner-container { width: 100%; max-width: none; color: var(--wp--preset--color--bone); }
.hm-hero-inner { padding-top: 140px; padding-bottom: 64px; }
.hm-hero-cover .hm-eyebrow { color: var(--wp--preset--color--bone); opacity: .8; }
.hm-hero-cover .hm-lead { color: var(--wp--preset--color--bone); opacity: .85; }
/* Header sits transparent on top of the video, solid after scrolling */
body.home .hm-header { background: transparent; border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; transition: background .25s ease, border-color .25s ease; }
body.home.hm-scrolled .hm-header { background: rgba(10,10,11,.92); border-bottom-color: var(--wp--preset--color--line); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
@media (max-width: 900px) { .hm-hero-inner { padding-top: 110px; padding-bottom: 40px; } }
/* reduced motion: video stays visible (poster / paused) */

/* ---------- Achievement cards ---------- */
.hm-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.hm-cards .wp-block-cover.hm-card { position: relative; min-height: 0 !important; aspect-ratio: 2 / 3 !important; height: auto !important; padding: 0 !important; overflow: hidden; border-radius: 14px; align-items: stretch !important; }
.hm-card .wp-block-cover__image-background { transition: transform .6s ease; }
.hm-card:hover .wp-block-cover__image-background, .hm-card:focus-within .wp-block-cover__image-background { transform: scale(1.05); }
.hm-card .wp-block-cover__background { background: linear-gradient(180deg, rgba(10,10,11,.55) 0%, rgba(10,10,11,.25) 40%, rgba(10,10,11,.75) 100%) !important; opacity: 1 !important; }
.hm-card .wp-block-cover__inner-container { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 16px; box-sizing: border-box; color: #fff; }
.hm-card-client { position: absolute; top: 16px; left: 16px; right: 16px; gap: 12px !important; align-items: center; }
.hm-card-client p { margin: 0; font-weight: 700; font-size: 15px; letter-spacing: .02em; text-shadow: 0 1px 8px rgba(0,0,0,.5); }
.hm-card-logo { margin: 0 !important; flex: none; }
.hm-card-logo img { width: 48px !important; height: 48px !important; border-radius: 50%; object-fit: cover; background: #fff; display: block; }
.hm-card-title { margin: 0 !important; text-align: center; font-size: clamp(18px, 1.6vw, 24px) !important; font-weight: 700; line-height: 1.25; text-shadow: 0 2px 16px rgba(0,0,0,.6); padding: 0 8px; }
.hm-card-title a { color: #fff; text-decoration: none; }
.hm-card-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.hm-card-title a:focus-visible { outline: none; }
.hm-card:has(a:focus-visible) { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 3px; }
.hm-cards-more { margin-top: 32px !important; }
@media (max-width: 1100px) { .hm-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .hm-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .hm-card-logo img { width: 36px !important; height: 36px !important; } .hm-card-client p { font-size: 12px; } .hm-card-client { top: 10px; left: 10px; gap: 8px !important; } }

/* mobile header fit */
@media (max-width: 600px) { .hm-header .hm-logo svg { height: 15px !important; } .hm-header-inner { gap: 12px; } .hm-header .wp-block-button__link { padding: 10px 14px !important; font-size: 14px; } }

/* ---------- Lead CTA ---------- */
.hm-leadcta-cols { gap: 64px !important; }
.hm-leadcta-img { margin: 0 !important; border-radius: 14px; overflow: hidden; }
.hm-leadcta-img img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .6s ease; }
.hm-leadcta-img a:hover img { transform: scale(1.03); }
.hm-leadcta .hm-h2 { margin: 0 0 20px !important; }
.hm-leadcta .hm-eyebrow { margin-bottom: 16px; }
.hm-checks { list-style: none; padding: 0; margin: 28px 0 32px; display: grid; gap: 12px; }
.hm-checks li { position: relative; padding-left: 34px; font-size: 17px; }
.hm-checks li::before { content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: var(--wp--preset--color--accent); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23000'/%3E%3Cpath d='M6.5 11.5l3 3 6-6.5' stroke='%23fff' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Ccircle cx='11' cy='11' r='11' fill='%23000'/%3E%3Cpath d='M6.5 11.5l3 3 6-6.5' stroke='%23fff' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.hm-btn-big .wp-block-button__link { font-size: 18px; padding: 18px 32px; min-height: 56px; }
.hm-leadcta-trust { margin-top: 16px !important; }
@media (max-width: 900px) { .hm-leadcta-cols { gap: 28px !important; } .hm-leadcta-img img { aspect-ratio: 16 / 10; } .hm-btn-big, .hm-btn-big .wp-block-button__link { width: 100%; text-align: center; } }

/* anchors land below the sticky header */
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 110px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ---------- How it works ---------- */
.hm-howto .hm-h2 { margin: 0 0 8px !important; }
.hm-steps-list { list-style: none; counter-reset: hmstep; padding: 0; margin: 32px 0 36px; display: grid; gap: 22px; }
.hm-steps-list li { counter-increment: hmstep; position: relative; padding-left: 64px; min-height: 44px; display: flex; flex-direction: column; gap: 4px; }
.hm-steps-list li::before { content: counter(hmstep, decimal-leading-zero); position: absolute; left: 0; top: 0; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-family: var(--wp--preset--font-family--mono); font-size: 14px; font-weight: 500; background: var(--wp--preset--color--ink); color: var(--wp--preset--color--bone); }
.hm-steps-list li strong { font-size: 20px; font-weight: 700; }
.hm-steps-list li span { font-size: 16px; line-height: 1.5; color: #3D3B38; }
.hm-process .hm-accent { color: #C2410C; }
.hm-howto-note { color: #5A5650 !important; margin-top: 16px !important; font-size: 13px; }
@media (max-width: 900px) { .hm-howto { flex-direction: column-reverse; } }

/* ---------- About ---------- */
.hm-about .hm-h2 { margin: 0 0 20px !important; }
.hm-about .hm-lead { max-width: none; margin-bottom: 20px; }
.hm-about-text { color: var(--wp--preset--color--soft); font-size: 16px; line-height: 1.65; margin: 0 0 14px !important; }
.hm-about-text strong, .hm-about .hm-lead strong { color: var(--wp--preset--color--bone); }
.hm-values-label { margin: 32px 0 16px !important; }
.hm-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.hm-value { border: 1px solid var(--wp--preset--color--line); border-radius: 12px; padding: 18px 20px; }
.hm-value h3 { margin: 0 0 6px !important; font-size: 18px; font-weight: 700; }
.hm-value h3::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--wp--preset--color--accent); margin-right: 10px; vertical-align: middle; }
.hm-value p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--wp--preset--color--soft); }
@media (max-width: 600px) { .hm-values { grid-template-columns: repeat(1, minmax(0, 1fr)); } }

/* founder photo */
.hm-founder { overflow: visible !important; }
.hm-founder a { display: block; border-radius: 14px; overflow: hidden; }
.hm-founder img { object-position: 50% 20%; filter: brightness(.85) contrast(1.03); transition: filter .4s ease, transform .6s ease; }
.hm-founder a:hover img { filter: brightness(.95) contrast(1.03); }
.hm-founder figcaption { margin-top: 12px; font-size: 13px; color: var(--wp--preset--color--muted); text-align: left; }

/* ---------- Project videos ---------- */
.hm-video { margin: 0 0 8px !important; border-radius: 14px; overflow: hidden; background: #000; }
.hm-video iframe { display: block; width: 100%; height: 100%; }
.hm-media-wide img { aspect-ratio: 16 / 9; object-fit: cover; }
/* play badge on cards */
.hm-card-title::before { content: ""; display: block; width: 52px; height: 52px; margin: 0 auto 14px; border-radius: 50%; background: rgba(255,255,255,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23fff'/%3E%3C/svg%3E") center / 24px no-repeat; border: 1.5px solid rgba(255,255,255,.7); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: transform .3s ease, background-color .3s ease; }
.hm-card:hover .hm-card-title::before { transform: scale(1.1); background-color: var(--wp--preset--color--accent); border-color: var(--wp--preset--color--accent); }
@media (max-width: 900px) { .hm-card-title::before { width: 40px; height: 40px; background-size: 18px; margin-bottom: 10px; } }

/* ---------- Client logo marquee ---------- */
.hm-clients { padding: 32px 0 36px; }
.hm-clients-label { margin: 0 auto 22px !important; text-align: center; }
.hm-logos { display: flex; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.hm-logos-track { display: flex; align-items: center; flex: none; list-style: none; margin: 0; padding: 0; animation: hm-marquee 50s linear infinite; }
.hm-logos:hover .hm-logos-track { animation-play-state: paused; }
.hm-logos-track li { flex: none; margin-right: 64px; }
.hm-logos-track img { display: block; height: 44px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1) invert(1) brightness(1.15); mix-blend-mode: screen; opacity: .72; transition: opacity .3s ease; }
.hm-logos-track img:hover { opacity: 1; }
@keyframes hm-marquee { to { transform: translateX(-100%); } }
@media (max-width: 900px) { .hm-logos-track li { margin-right: 40px; } .hm-logos-track img { height: 34px; max-width: 110px; } }
@media (prefers-reduced-motion: reduce) { .hm-logos { flex-wrap: wrap; justify-content: center; -webkit-mask-image: none; mask-image: none; } .hm-logos-track { animation: none; flex-wrap: wrap; justify-content: center; row-gap: 24px; } .hm-logos-track[aria-hidden="true"] { display: none; } }

/* ---------- FAQ ---------- */
.hm-faq { border-top: 1px solid var(--wp--preset--color--line); }
.hm-faq-cols { gap: 64px !important; }
.hm-faq .hm-h2 { margin: 0 0 16px !important; }
.hm-faq-sub { max-width: 340px; }
.hm-faq-item { border-bottom: 1px solid var(--wp--preset--color--line); margin: 0 !important; }
.hm-faq-item:first-child { border-top: 1px solid var(--wp--preset--color--line); }
.hm-faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 22px 0; font-size: 19px; font-weight: 700; min-height: 44px; }
.hm-faq-item summary::-webkit-details-marker { display: none; }
.hm-faq-item summary::after { content: "+"; flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1px solid #3A3A40; display: grid; place-items: center; font-weight: 400; font-size: 20px; line-height: 1; transition: transform .25s ease, background-color .25s ease, color .25s ease; }
.hm-faq-item[open] summary::after { transform: rotate(45deg); background: var(--wp--preset--color--accent); border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }
.hm-faq-item summary:hover { color: var(--wp--preset--color--accent); }
.hm-faq-item summary:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 4px; }
.hm-faq-item p { margin: 0 0 24px !important; color: var(--wp--preset--color--soft); font-size: 16px; line-height: 1.65; max-width: 640px; }
@media (max-width: 900px) { .hm-faq-cols { gap: 28px !important; } .hm-faq-item summary { font-size: 17px; } }

/* ---------- Floating WhatsApp ---------- */
.hm-wa { position: fixed; right: 20px; bottom: 20px; z-index: 60; display: inline-flex; align-items: center; gap: 10px; background: #25D366; color: #fff !important; text-decoration: none; font-weight: 700; font-size: 15px; padding: 12px 18px 12px 14px; min-height: 52px; box-sizing: border-box; border-radius: 999px; box-shadow: 0 8px 24px rgba(0,0,0,.35); transition: transform .2s ease, box-shadow .2s ease; }
.hm-wa:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0,0,0,.45); color: #fff !important; }
.hm-wa:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 600px) { .hm-wa span { display: none; } .hm-wa { padding: 12px; width: 56px; height: 56px; justify-content: center; right: 16px; bottom: 16px; } }

/* ---------- Stats ---------- */
.hm-stats { padding-top: 56px; padding-bottom: 8px; }
.hm-stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); }
.hm-stat { padding: 36px 24px; border-left: 1px solid var(--wp--preset--color--line); }
.hm-stat:first-child { border-left: 0; padding-left: 0; }
.hm-stat-num { margin: 0 !important; font-size: clamp(44px, 5.6vw, 76px); font-weight: 800; font-stretch: 118%; line-height: 1; letter-spacing: -.02em; }
.hm-stat-label { margin: 10px 0 0 !important; font-size: 15px; color: var(--wp--preset--color--soft); }
@media (max-width: 900px) { .hm-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hm-stat { padding: 24px 16px; } .hm-stat:nth-child(odd) { border-left: 0; padding-left: 0; } .hm-stat:nth-child(n+3) { border-top: 1px solid var(--wp--preset--color--line); } }

/* ---------- Homepage contact form ---------- */
.hm-contact-cols { gap: 64px !important; align-items: flex-start !important; }
.hm-contact .hm-contact-h { margin: 0 0 20px !important; }
.hm-form-card { background: var(--wp--preset--color--ink-2); border: 1px solid var(--wp--preset--color--line); border-radius: 16px; padding: 36px; }
.hm-form-card .hm-form { max-width: none; }
@media (max-width: 900px) { .hm-contact-cols { gap: 32px !important; } .hm-form-card { padding: 22px 18px; } }

/* form spacing fix */
.hm-contact .hm-contact-h { font-size: clamp(36px, 4.2vw, 60px) !important; }
.hm-form { gap: 18px; }
.hm-form p { margin: 0 !important; }
.hm-form label > br, .hm-form p > br { display: none; }
.hm-form .wpcf7-form-control-wrap { display: block; }
.hm-form fieldset .wpcf7-form-control-wrap { margin-top: 0; }
.hm-form .wpcf7-acceptance .wpcf7-list-item label { display: inline-flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.hm-form .wpcf7-spinner { margin: 0 0 0 12px; }

/* process dark */
.hm-process { background: var(--wp--preset--color--ink) !important; color: var(--wp--preset--color--bone) !important; border-top: 1px solid var(--wp--preset--color--line); }
.hm-process h2, .hm-process h3, .hm-process .hm-steps-list li strong { color: var(--wp--preset--color--bone) !important; }
.hm-process .hm-accent { color: var(--wp--preset--color--accent) !important; }
.hm-process .hm-steps-list li span { color: var(--wp--preset--color--soft) !important; }
.hm-process .hm-steps-list li::before { background: var(--wp--preset--color--ink-2); color: var(--wp--preset--color--bone); border: 1px solid #3A3A40; }
.hm-process .hm-howto-note { color: var(--wp--preset--color--muted) !important; }

/* FAQ image */
.hm-faq-img { margin: 0 0 32px !important; border-radius: 14px; overflow: hidden; }
.hm-faq-img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .6s ease; }
.hm-faq-img a:hover img { transform: scale(1.03); }
@media (max-width: 900px) { .hm-faq-img img { aspect-ratio: 16 / 9; } }

.hm-faq-visual { border: 1px solid var(--wp--preset--color--line); line-height: 0; }
.hm-faq-visual svg { display: block; width: 100%; height: auto; }

/* hide native video play overlay (iOS / Safari / Chrome) – hero is a pure background video */
.hm-hero-cover video { pointer-events: none; }
.hm-hero-cover video::-webkit-media-controls,
.hm-hero-cover video::-webkit-media-controls-panel,
.hm-hero-cover video::-webkit-media-controls-overlay-play-button,
.hm-hero-cover video::-webkit-media-controls-start-playback-button,
.hm-hero-cover video::-webkit-media-controls-play-button { display: none !important; -webkit-appearance: none !important; opacity: 0 !important; }

/* ---------- Footer ---------- */
.hm-footer { border-top: 1px solid var(--wp--preset--color--line); padding: 0 !important; background: var(--wp--preset--color--ink); }
.hm-foot-cta { padding: 64px 0; border-bottom: 1px solid var(--wp--preset--color--line); gap: 24px; }
.hm-foot-cta-h { margin: 0 !important; font-size: clamp(28px, 3.4vw, 44px) !important; font-weight: 800; font-stretch: 112%; text-transform: uppercase; line-height: 1.05; max-width: 760px; }
.hm-foot-cols { padding: 56px 0 40px; gap: 40px !important; }
.hm-foot-about { color: var(--wp--preset--color--soft); font-size: 15px; line-height: 1.6; max-width: 340px; margin: 20px 0 22px !important; }
.hm-foot-h { margin: 4px 0 18px !important; }
.hm-foot-links { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.hm-foot-links a { color: var(--wp--preset--color--bone); text-decoration: none; font-size: 15px; }
.hm-foot-links a:hover { color: var(--wp--preset--color--accent); }
.hm-foot-loc { margin-top: 22px !important; font-size: 14px; color: var(--wp--preset--color--muted); }
.hm-footer .hm-social { gap: 14px !important; }
.hm-footer .hm-social .wp-social-link { transition: transform .2s ease; }
.hm-footer .hm-social .wp-social-link:hover { transform: translateY(-2px); }
.hm-foot-bottom { border-top: 1px solid var(--wp--preset--color--line); padding: 22px 0 28px; gap: 12px; }
.hm-foot-top a { color: var(--wp--preset--color--muted); text-decoration: none; }
.hm-foot-top a:hover { color: var(--wp--preset--color--bone); }
@media (max-width: 900px) {
  .hm-foot-cta { padding: 44px 0; }
  .hm-foot-cta .wp-block-buttons, .hm-foot-cta .hm-btn-big { width: 100%; }
  .hm-foot-cols { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px !important; padding: 40px 0 28px; }
  .hm-foot-cols > .wp-block-column:first-child { grid-column: 1 / -1; }
  .hm-foot-cols > .wp-block-column { flex-basis: auto !important; }
}

body.home .hm-foot-cta { display: none; }

/* contact details + Google rating */
.hm-foot-contact a { font-size: 14px !important; line-height: 1.5; }
.hm-stars { color: #FBBC04; letter-spacing: 2px; }
.hm-foot-rating { margin: 20px 0 0 !important; font-size: 14px; }
.hm-foot-rating a { color: var(--wp--preset--color--soft); text-decoration: none; }
.hm-foot-rating a:hover { color: var(--wp--preset--color--bone); }
.hm-foot-rating strong { color: var(--wp--preset--color--bone); }
.hm-foot-legal a { color: var(--wp--preset--color--muted); text-decoration: none; }
.hm-foot-legal a:hover { color: var(--wp--preset--color--bone); }
.hm-contact-direct { margin: 28px 0 0 !important; color: var(--wp--preset--color--soft); font-size: 16px; }
.hm-contact-direct a { color: var(--wp--preset--color--bone); font-weight: 600; }
.hm-contact-rating { margin-top: 12px !important; }
@media (max-width: 900px) { .hm-foot-cols > .wp-block-column:last-child { grid-column: 1 / -1; } }

/* ---------- Cookie notice ---------- */
.hm-cookie { position: fixed; left: 20px; bottom: 20px; z-index: 70; max-width: 420px; display: flex; gap: 16px; align-items: center; background: var(--wp--preset--color--ink-2); border: 1px solid #2E2E33; border-radius: 14px; padding: 16px 18px; box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.hm-cookie[hidden] { display: none; }
.hm-cookie p { margin: 0; font-size: 13px; line-height: 1.5; color: var(--wp--preset--color--soft); }
.hm-cookie a { color: var(--wp--preset--color--bone); }
.hm-cookie button { flex: none; background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); border: 0; font: inherit; font-weight: 700; font-size: 14px; padding: 0 16px; min-height: 44px; border-radius: 0; cursor: pointer; }
@media (max-width: 600px) { .hm-cookie { left: 12px; right: 84px; bottom: 16px; max-width: none; flex-direction: column; align-items: stretch; gap: 10px; padding: 14px; } }

/* ---------- About: client mosaic ---------- */
.hm-mosaic { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 10px; aspect-ratio: 3 / 4; }
.hm-mz-tile { position: relative; display: block; overflow: hidden; border-radius: 12px; background: var(--wp--preset--color--ink-2); text-decoration: none; min-height: 0; }
.hm-mz-tile > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.hm-mz-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,10,11,0) 45%, rgba(10,10,11,.85) 100%); }
.hm-mz-tile:hover > img { transform: scale(1.06); }
.hm-mz-big { grid-column: span 2; grid-row: span 2; }
.hm-mz-tag { position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 1; display: flex; align-items: center; gap: 8px; color: #fff; font-size: 12px; font-weight: 700; line-height: 1.2; }
.hm-mz-tag img { flex: none; width: 28px; height: 28px; border-radius: 50%; object-fit: cover; background: #fff; }
.hm-mz-big .hm-mz-tag { left: 16px; bottom: 16px; font-size: 16px; gap: 10px; }
.hm-mz-big .hm-mz-tag img { width: 40px; height: 40px; }
.hm-mz-stat { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); padding: 14px; display: flex; flex-direction: column; justify-content: flex-end; }
.hm-mz-stat::after { display: none; }
.hm-mz-stat strong { font-size: clamp(26px, 2.6vw, 38px); font-weight: 800; font-stretch: 118%; line-height: 1; }
.hm-mz-stat-l { font-size: 12px; font-weight: 600; margin-top: 4px; }
.hm-mz-stat-cta { font-size: 11px; font-weight: 700; margin-top: 10px; opacity: .8; }
.hm-mz-tile:focus-visible { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 2px; }
@media (max-width: 900px) { .hm-mosaic { aspect-ratio: 3 / 4; gap: 8px; } .hm-mz-tag { font-size: 10px; gap: 6px; left: 8px; bottom: 8px; } .hm-mz-tag img { width: 22px; height: 22px; } .hm-mz-stat strong { font-size: 24px; } .hm-mz-stat-cta { display: none; } }

/* ===== 3D layer ===== */
.hm-hero-cover .wp-block-cover__inner-container{z-index:2}
.hm-r3d{opacity:0;transform:perspective(1200px) translate3d(0,70px,-120px) rotateX(16deg);transform-origin:50% 100%;transition:opacity .9s cubic-bezier(.2,.7,.2,1) var(--hm-d,0ms),transform 1s cubic-bezier(.2,.7,.2,1) var(--hm-d,0ms)}
.hm-r3d.is-in{opacity:1;transform:none}
.hm-tilt{position:relative;transform-style:preserve-3d;will-change:transform}
.hm-tilt.is-in{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s,opacity .9s}
.hm-tilt.is-tilting{transition:transform .08s linear,box-shadow .3s;box-shadow:0 30px 60px -20px rgba(0,0,0,.55),0 0 0 1px rgba(255,90,31,.25)}
.hm-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:5;opacity:0;transition:opacity .3s;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.18),rgba(255,255,255,0) 55%);mix-blend-mode:screen}
.hm-tilt.is-tilting .hm-glare{opacity:1}
.hm-leadcta-img,.hm-card{overflow:hidden}
.hm-par{will-change:transform;transform:scale(1.14)}
.hm-mz3d{transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.hm-mz3d>*{transform:translateZ(0);transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}
.hm-mz3d:hover>*{transform:translateZ(var(--z,20px));box-shadow:0 24px 40px -18px rgba(0,0,0,.6)}
@media (prefers-reduced-motion:reduce){.hm-r3d{opacity:1;transform:none}.hm-drone{transition:none}}

/* Client reviews (Instagram) */
.hm-reviews[hidden]{display:none !important}
.hm-reviews{text-align:center}
.hm-rev-kicker{font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#FF5A1F;margin:0 0 10px}
.hm-reviews h2{margin:0 0 12px}
.hm-rev-lead{max-width:560px;margin:0 auto 40px;opacity:.75}
.hm-rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;text-align:left}
.hm-rev-card{margin:0;padding:28px;border-radius:18px;background:#111114;color:#F2EFE9;border:1px solid #26262b;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.hm-rev-card blockquote{margin:0;padding:0;border:0;font-size:17px;line-height:1.55}
.hm-rev-card figcaption{display:flex;align-items:center;gap:12px}
.hm-rev-avatar{width:42px;height:42px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;background:linear-gradient(45deg,#f09433,#dc2743,#bc1888)}
.hm-rev-who{display:flex;flex-direction:column;line-height:1.3}
.hm-rev-who small{opacity:.6;font-size:13px}
.hm-rev-src{margin-left:auto;color:#B9B5AE}
.hm-rev-src:hover{color:#FF5A1F}
.hm-rev-cta{margin-top:36px}
.hm-rev-btn{display:inline-block;padding:16px 28px;border-radius:999px;background:#FF5A1F;color:#0A0A0B;font-weight:700;text-decoration:none}
@media (max-width:600px){.hm-rev-card{padding:22px}.hm-rev-card blockquote{font-size:16px}}

/* ===== 3D v2 ===== */
.hm-drone{position:fixed;inset:0;z-index:30;pointer-events:none;opacity:0}
.hm-drone canvas{width:100%;height:100%;display:block}
.hm-ring-stage{height:150px;perspective:1700px;perspective-origin:50% 50%;align-items:center}
.hm-ring{position:relative;width:100%;height:100%;margin:0;padding:0;transform-style:preserve-3d;animation:none !important;transform:none}
.hm-ring>li{position:absolute;left:50%;top:50%;margin:0 !important;padding:0 !important;list-style:none;will-change:transform,opacity}
.hm-ring img{height:46px !important;width:auto !important;max-width:150px;object-fit:contain}
.hm-num3d{display:inline-block;transform-origin:50% 80%;font-variant-numeric:tabular-nums;text-shadow:0 1px 0 #d9d4cc,0 2px 0 #c4bfb7,0 3px 0 #aea9a1,0 4px 0 #97928b,0 5px 0 #7f7a74,0 6px 0 #67635e,0 7px 0 #4f4c48,0 8px 0 #3a3835,0 18px 22px rgba(0,0,0,.65)}
.hm-num3d .hm-accent{text-shadow:0 1px 0 #f0521a,0 2px 0 #e04a16,0 3px 0 #cc4313,0 4px 0 #b73b10,0 5px 0 #a1340e,0 6px 0 #8a2c0b,0 7px 0 #722409,0 8px 0 #5a1c07,0 18px 22px rgba(0,0,0,.65)}
@media (max-width:600px){.hm-ring-stage{height:120px}.hm-ring img{height:38px !important;max-width:118px}}
.hm-stat-num.hm-num3d{font-size:clamp(40px,4.2vw,64px) !important}
.hm-ring-stage .hm-logos-track:not(.hm-ring){display:none !important}

/* ===== 3D v3: timeline, globe, carousel ===== */
.pv-btn{display:inline-block;padding:16px 28px;border-radius:999px;background:#FF5A1F;color:#0A0A0B !important;font-weight:700;text-decoration:none !important}
.pv-btn:hover{filter:brightness(1.1)}
/* timeline — static fallback */
.hm-proc3d{position:relative;background:#0A0A0B;color:#F2EFE9}
.hm-proc3d .pv-tl-sticky{position:relative;max-width:1280px;margin:0 auto;padding:100px 24px}
.hm-proc3d .pv-bg,.hm-proc3d .pv-floor,.hm-proc3d .pv-prog{display:none}
.hm-proc3d .pv-steps{list-style:none;margin:40px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.pv-step{position:relative;padding:30px 30px 28px;border-radius:22px;background:linear-gradient(160deg,#1a1a1f,#101013);border:1px solid #2a2a30;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);list-style:none}
.pv-step .n{display:block;font-family:"IBM Plex Mono",monospace;color:#FF5A1F;font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.pv-step h3{font-size:clamp(24px,3vw,38px);font-weight:800;font-stretch:112%;margin:10px 0 12px;text-transform:uppercase;line-height:1;color:#F2EFE9}
.pv-step p{margin:0;opacity:.75;font-size:17px;line-height:1.55}
.pv-step .ic{position:absolute;right:24px;top:22px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,90,31,.12);color:#FF5A1F}
.pv-note{margin:14px 0 0;font-size:14px;opacity:.6}
/* timeline — 3D mode */
.hm-proc3d.is-3d .pv-tl{position:relative;height:430vh}
.hm-proc3d.is-3d .pv-tl-sticky{position:sticky;top:0;height:100vh;max-width:none;padding:0;overflow:hidden;display:flex;flex-direction:column}
.hm-proc3d.is-3d .pv-bg{display:block;position:absolute;inset:0;background:center/cover no-repeat;opacity:.16;filter:grayscale(.4);-webkit-mask-image:linear-gradient(#000,transparent 85%);mask-image:linear-gradient(#000,transparent 85%)}
.hm-proc3d.is-3d .pv-tl-head{max-width:1280px;width:100%;margin:0 auto;padding:clamp(70px,11vh,120px) 24px 0;position:relative;z-index:5}
.hm-proc3d.is-3d .pv-stage{position:relative;flex:1;perspective:900px;perspective-origin:50% 40%}
.hm-proc3d.is-3d .pv-steps{margin:0;display:block}
.hm-proc3d.is-3d .pv-step{position:absolute;left:50%;top:50%;width:min(560px,86vw);will-change:transform,opacity}
.hm-proc3d.is-3d .pv-floor{display:block;position:absolute;left:50%;top:64%;width:2400px;height:2400px;margin-left:-1200px;transform:rotateX(82deg) translateZ(-260px);background-image:linear-gradient(#202027 1px,transparent 1px),linear-gradient(90deg,#202027 1px,transparent 1px);background-size:80px 80px;-webkit-mask-image:radial-gradient(closest-side,#000 30%,transparent);mask-image:radial-gradient(closest-side,#000 30%,transparent)}
.hm-proc3d.is-3d .pv-foot{position:relative;z-index:5;text-align:center;padding:0 24px clamp(28px,5vh,56px)}
.hm-proc3d.is-3d .pv-prog{display:flex;justify-content:center;gap:10px;margin-bottom:22px}
.pv-prog i{width:34px;height:4px;border-radius:2px;background:#2a2a30;overflow:hidden;position:relative}
.pv-prog i b{position:absolute;inset:0;background:#FF5A1F;transform-origin:left;transform:scaleX(0)}
/* globe */
.hm-world{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.pv-gwrap{position:relative;aspect-ratio:1/1;width:100%;max-width:600px;cursor:grab;touch-action:pan-y;margin:0 auto}
.pv-gwrap canvas{width:100%;height:100%;display:block}
.pv-glabel{position:absolute;left:0;top:0;pointer-events:none;padding:6px 12px;border-radius:999px;background:#FF5A1F;color:#0A0A0B;font-weight:700;font-size:13px;white-space:nowrap;transform:translate(-50%,-150%);transition:opacity .3s;opacity:0;z-index:2}
.pv-glead{opacity:.75;font-size:17px;line-height:1.55;max-width:520px}
.pv-chips{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 30px;padding:0;list-style:none}
.pv-chips li{padding:7px 12px;border:1px solid #2a2a30;border-radius:999px;font-size:14px;transition:all .3s;margin:0}
.pv-chips li.on{background:#FF5A1F;border-color:#FF5A1F;color:#0A0A0B}
@media (max-width:860px){.hm-world{grid-template-columns:1fr;gap:20px}.pv-gwrap{max-width:440px}}
/* carousel */
.pv-car{position:relative;margin:10px 0 0}
.pv-cstage{position:relative;height:460px;perspective:1600px;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;overflow:hidden}
.pv-ring{position:absolute;left:50%;top:50%;transform-style:preserve-3d}
.pv-cc{position:absolute;left:0;top:0;width:380px;height:250px;margin:-125px 0 0 -190px;border-radius:18px;overflow:hidden;background:#111 center/cover;box-shadow:0 30px 60px -25px rgba(0,0,0,.85);cursor:pointer;border:1px solid rgba(255,255,255,.08);backface-visibility:hidden;-webkit-backface-visibility:hidden;color:#F2EFE9}
.pv-cc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.88))}
.pv-cc .t{position:absolute;left:18px;right:18px;bottom:16px;z-index:2}
.pv-cc .c{display:flex;align-items:center;gap:8px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;opacity:.85}
.pv-cc .c img{width:22px;height:22px;border-radius:50%;object-fit:cover;background:#fff}
.pv-cc h4{margin:6px 0 0;font-size:19px;font-weight:800;line-height:1.1}
.pv-cc .pl{position:absolute;left:50%;top:42%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:#FF5A1F;display:grid;place-items:center;z-index:2;transform:scale(.6);opacity:0;transition:all .35s}
.pv-cc.front .pl{transform:scale(1);opacity:1}
.pv-cnav{display:flex;justify-content:center;gap:12px;margin:6px 0 28px}
.pv-cnav button{width:48px;height:48px;border-radius:50%;border:1px solid #2a2a30;background:#141418;color:#F2EFE9;font-size:20px;cursor:pointer}
.pv-cnav button:hover{border-color:#FF5A1F;color:#FF5A1F}
.pv-modal{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.9);display:none;align-items:center;justify-content:center;padding:20px}
.pv-modal.on{display:flex}
.pv-modal .box{width:min(1100px,100%);aspect-ratio:16/9;position:relative}
.pv-modal iframe{width:100%;height:100%;border:0;border-radius:12px}
.pv-modal .x{position:absolute;right:0;top:-50px;background:none;border:0;color:#fff;font-size:36px;cursor:pointer;line-height:1}
.pv-modal .go{position:absolute;left:0;bottom:-46px;color:#F2EFE9;font-size:14px}
.hm-cards.pv-hidden{display:none !important}
@media (max-width:600px){.pv-cc{width:260px;height:175px;margin:-88px 0 0 -130px}.pv-cc h4{font-size:16px}.pv-cstage{height:320px}}

/* QA fixes */
.hm-hero-cover .wp-block-cover__inner-container{max-width:100%}
.hm-mz-stat strong{white-space:nowrap;font-size:clamp(26px,2.4vw,40px) !important}
.hm-mz-stat strong span{display:inline}
@media (max-width:600px){.hm-stat-num.hm-num3d{font-size:34px !important}.hm-mz-stat strong{font-size:22px !important}}

/* ===== How it works: 3D book ===== */
.hm-book{background:#0A0A0B;color:#F2EFE9;overflow:hidden}
.bk-in{max-width:1280px;margin:0 auto;padding:110px 24px 100px}
.bk-head{display:none;margin-bottom:28px}
.bk{position:relative;width:min(1040px,100%);aspect-ratio:2/1.22;margin:0 auto;perspective:2600px;outline:none}
.bk::before{content:"";position:absolute;left:-14px;right:-14px;top:10px;bottom:-14px;border-radius:14px;background:#17171b;box-shadow:0 60px 90px -40px rgba(0,0,0,.9);z-index:0}
.bk-base,.bk-leaf{position:absolute;top:0;width:50%;height:100%}
.bk-lb{left:0;z-index:1}.bk-rb{left:50%;z-index:1}
.bk-leaf{left:50%;transform-origin:left center;transform-style:preserve-3d;transition:transform 1.1s cubic-bezier(.55,.06,.25,1);cursor:pointer}
.bk-leaf.flip{transform:rotateY(-180deg)}
.bk-leaf .f,.bk-leaf .b{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.bk-leaf .b{transform:rotateY(180deg)}
.pg{box-sizing:border-box;padding:clamp(28px,4vw,56px);background:#121216 center/cover no-repeat;border:1px solid #26262c;display:flex;flex-direction:column;justify-content:center;overflow:hidden;color:#F2EFE9}
.bk-lb .pg,.bk-leaf .b{border-radius:14px 0 0 14px;background-image:linear-gradient(270deg,rgba(0,0,0,.45),rgba(0,0,0,0) 14%)}
.bk-rb .pg,.bk-leaf .f{border-radius:0 14px 14px 0}
.bk-leaf .f.pg-step,.bk-rb .pg{background-image:linear-gradient(90deg,rgba(0,0,0,.45),rgba(0,0,0,0) 14%)}
.bk-lb .pg,.bk-rb .pg{height:100%}
.bk-lb h2{font-size:clamp(30px,3.6vw,52px);line-height:.98;text-transform:uppercase;font-weight:800;font-stretch:118%;margin:6px 0 0}
.bk-hint{margin:26px 0 0;font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.08em;color:#B9B5AE}
.bk-kick{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#FF5A1F}
.pg h3{font-size:clamp(26px,3vw,44px);line-height:1;text-transform:uppercase;font-weight:800;font-stretch:112%;margin:12px 0 14px;color:#F2EFE9}
.pg p{font-size:clamp(15px,1.4vw,19px);line-height:1.55;opacity:.78;margin:0}
.pg-cover{justify-content:flex-end}
.bk-big{font-weight:800;font-stretch:118%;font-size:clamp(90px,12vw,170px);line-height:.85;color:#FF5A1F;display:flex;align-items:baseline;gap:10px;margin-top:10px}
.bk-big small{font-size:.22em;color:#F2EFE9;text-transform:uppercase;letter-spacing:.04em}
.bk-open{position:absolute;right:28px;top:26px;font-family:"IBM Plex Mono",monospace;font-size:13px;color:#F2EFE9;opacity:.8}
.pg-num{align-items:flex-start;justify-content:center}
.pg-num .n{font-weight:800;font-stretch:118%;font-size:clamp(110px,15vw,220px);line-height:.85;color:transparent;-webkit-text-stroke:2px #FF5A1F}
.pg-num .l{font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#B9B5AE;margin-top:14px}
.pg-num .ic{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:rgba(255,90,31,.14);color:#FF5A1F;margin-bottom:22px}
.n-s{font-family:"IBM Plex Mono",monospace;color:#FF5A1F;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.bk-pn{position:absolute;right:28px;bottom:22px;font-family:"IBM Plex Mono",monospace;font-size:12px;color:#8E8A84}
.pg-bts{justify-content:flex-end}
.pg-end{align-items:flex-start}
.pg-end .pv-btn{margin-top:8px}
.bk-leaf.turning .f,.bk-leaf.turning .b{box-shadow:0 30px 60px -20px rgba(0,0,0,.8)}
.bk-leaf .f::after,.bk-leaf .b::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(0,0,0,0) 30%,rgba(0,0,0,.25));opacity:0;transition:opacity .55s}
.bk-leaf.turning .f::after,.bk-leaf.turning .b::after{opacity:1}
.bk-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:40px}
.bk-nav button{width:48px;height:48px;border-radius:50%;border:1px solid #2a2a30;background:#141418;color:#F2EFE9;font-size:20px;cursor:pointer}
.bk-nav button:hover{border-color:#FF5A1F;color:#FF5A1F}
.bk-nav button:disabled{opacity:.3;cursor:default;border-color:#2a2a30;color:#F2EFE9}
.bk-dots{display:flex;gap:8px}.bk-dots i{width:26px;height:4px;border-radius:2px;background:#2a2a30;transition:background .3s}.bk-dots i.on{background:#FF5A1F}
/* single-page book on phones/tablets */
@media (max-width:820px){
 .bk-in{padding:80px 20px 70px}
 .bk-head{display:block}
 .bk{aspect-ratio:.78;width:min(460px,100%);overflow:hidden;border-radius:14px}
 .bk::before{display:none}
 .bk-lb{display:none}
 .bk-rb,.bk-leaf{left:0;width:100%}
 .bk-leaf{transition:transform 1s cubic-bezier(.55,.06,.25,1),opacity .25s}
 .bk-leaf .b{display:none}
 .bk-rb .pg,.bk-leaf .f{border-radius:14px}
 .bk-leaf.flip{transform:rotateY(-110deg);opacity:0;transition:transform 1s cubic-bezier(.55,.06,.25,1),opacity .4s .6s}
 .bk-dots i{width:18px}
}
@media (prefers-reduced-motion:reduce){.bk-leaf{transition:none}}

/* 6 services grid on home */
#services .hm-services{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
#services .hm-services>.hm-service{flex-basis:auto !important;width:auto !important;margin:0 !important}
@media (max-width:1000px){#services .hm-services{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){#services .hm-services{grid-template-columns:1fr}}

/* spacing between sections on inner pages */
.wp-block-post-content > h2.hm-h2{margin-top:clamp(56px,8vw,96px) !important;margin-bottom:28px !important}

/* Phone: country code picker */
.hm-phone{display:grid;grid-template-columns:minmax(118px,190px) minmax(0,1fr);gap:8px;margin-top:8px}
.hm-phone .wpcf7-form-control-wrap{display:block;min-width:0}
.hm-phone select.hm-cc{width:100%;height:100%;min-height:51px;box-sizing:border-box;background:#141416 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23B9B5AE'/%3E%3C/svg%3E") no-repeat right 12px center;border:1px solid #2E2E33;border-radius:0;color:#F2EFE9;font:inherit;font-size:14px;padding:0 30px 0 12px;-webkit-appearance:none;appearance:none;cursor:pointer;text-overflow:ellipsis}
.hm-phone select.hm-cc:focus{outline:none;border-color:#FF5A1F}
.hm-phone select.hm-cc option{background:#141416;color:#F2EFE9}
.hm-phone input{width:100%;margin-top:0!important}
@media (max-width:420px){.hm-phone{grid-template-columns:118px minmax(0,1fr)}}

/* Searchable country-code picker */
.hm-ccx{position:relative;height:100%}
.hm-ccx select.hm-cc{position:absolute!important;opacity:0;pointer-events:none;width:1px!important;height:1px!important;min-height:0!important;padding:0;border:0}
.hm-ccb{width:100%;height:100%;min-height:51px;box-sizing:border-box;text-align:left;background:#141416 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23B9B5AE'/%3E%3C/svg%3E") no-repeat right 12px center;border:1px solid #2E2E33;border-radius:0;color:#F2EFE9;font:inherit;font-size:14px;padding:0 30px 0 12px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-ccx.open .hm-ccb,.hm-ccb:focus-visible{outline:none;border-color:#FF5A1F}
.hm-ccp{position:absolute;left:0;top:calc(100% + 6px);z-index:60;width:min(320px,calc(100vw - 40px));background:#141416;border:1px solid #2E2E33;box-shadow:0 24px 48px -12px rgba(0,0,0,.85)}
.hm-ccp[hidden]{display:none}
.hm-ccs{display:block;width:100%;box-sizing:border-box;background:#0E0E10!important;border:0!important;border-bottom:1px solid #2E2E33!important;color:#F2EFE9;font:inherit;font-size:16px!important;padding:13px 14px!important;outline:none;margin:0!important;height:auto!important}
.hm-ccs::placeholder{color:#8E8A84}
.hm-ccl{list-style:none;margin:0!important;padding:4px 0!important;max-height:260px;overflow-y:auto;overscroll-behavior:contain}
.hm-ccl li{margin:0;padding:10px 14px;font-size:14px;line-height:1.3;color:#F2EFE9;cursor:pointer;white-space:nowrap}
.hm-ccl li.on,.hm-ccl li:hover{background:rgba(255,90,31,.14)}
.hm-ccl li[aria-selected]{color:#FF8A5B}
.hm-ccl li.none{color:#8E8A84;cursor:default;background:none}

/* Contact form: 4-page book */
.hm-form.hm-stepped{display:block!important}
.hm-sh{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px}
.hm-sk{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#FF5A1F}
.hm-sd{display:flex;gap:6px}.hm-sd i{width:22px;height:4px;border-radius:2px;background:#2a2a30;transition:background .3s}.hm-sd i.on{background:#FF5A1F}
.hm-stage{display:grid;perspective:2200px;transition:height .55s cubic-bezier(.55,.06,.25,1)}
.hm-step{grid-area:1/1;display:none;align-content:start;gap:18px;min-width:0;box-sizing:border-box;padding:clamp(20px,3vw,32px);background:#111114 linear-gradient(90deg,rgba(0,0,0,.45),rgba(0,0,0,0) 5%);border:1px solid #26262c;border-radius:4px 14px 14px 4px;transform-origin:left center;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.hm-step.on{display:grid}
.hm-step > p,.hm-step > fieldset{margin:0}
.hm-step.under{z-index:1}
.hm-step.turn-out{z-index:2;pointer-events:none;animation:hmTurn .72s cubic-bezier(.55,.06,.25,1) forwards}
.hm-step.turn-in{z-index:2;pointer-events:none;animation:hmTurn .72s cubic-bezier(.55,.06,.25,1) reverse both}
@keyframes hmTurn{0%{transform:rotateY(0);opacity:1;box-shadow:0 0 0 rgba(0,0,0,0)}45%{box-shadow:0 40px 80px -20px rgba(0,0,0,.95)}70%{opacity:1}100%{transform:rotateY(-100deg);opacity:0;box-shadow:0 40px 80px -20px rgba(0,0,0,.95)}}
.hm-serr{color:#FF8A5B;font-size:14px}.hm-serr:empty{display:none}
.hm-snav{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}
.hm-snav > p{margin:0 0 0 auto!important}
.hm-next{margin-left:auto}
.hm-next,.hm-again{background:#FF5A1F;color:#0A0A0B;border:0;border-radius:0;font:inherit;font-weight:700;font-size:16px;padding:16px 26px;cursor:pointer;transition:transform .2s}
.hm-next:hover,.hm-again:hover{transform:translateY(-2px)}
.hm-back{background:none;border:1px solid #2E2E33;border-radius:0;color:#F2EFE9;font:inherit;font-size:15px;padding:15px 20px;cursor:pointer}
.hm-back:hover{border-color:#FF5A1F;color:#FF5A1F}
.hm-done{padding-top:clamp(32px,5vw,56px);padding-bottom:clamp(32px,5vw,56px)}
.hm-done h3{font-size:clamp(28px,3.4vw,44px);line-height:1;text-transform:uppercase;font-weight:800;font-stretch:112%;margin:0;color:#F2EFE9}
.hm-done p{margin:0;opacity:.8}
.wpcf7-form.sent .hm-stepped ~ .wpcf7-response-output,.wpcf7-form.sent .wpcf7-response-output{display:none!important}
@media (max-width:600px){.hm-snav{gap:10px}.hm-next,.hm-snav .wpcf7-submit{flex:1}.hm-snav > p{flex:1}.hm-snav > p .wpcf7-submit{width:100%}}
@media (prefers-reduced-motion:reduce){.hm-stage{transition:none}}

/* Budget dropdown */
select.hm-sel{display:block;width:100%;box-sizing:border-box;height:52px;margin-top:8px;background:#141416 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23B9B5AE'/%3E%3C/svg%3E") no-repeat right 16px center;border:1px solid #2E2E33;border-radius:0;color:#F2EFE9;font:inherit;font-size:16px;padding:0 40px 0 14px;-webkit-appearance:none;appearance:none;cursor:pointer}
select.hm-sel:focus{outline:none;border-color:#FF5A1F}
select.hm-sel:invalid,select.hm-sel.is-empty{color:#8E8A84}
select.hm-sel option{background:#141416;color:#F2EFE9}