:root {
  --bg: #0d0d0d;
  --surface: #141414;
  --card: #191919;
  --elevated: #202020;
  --text: #fff;
  --muted: #b8b8b8;
  --quiet: #777;
  --border: rgba(255, 255, 255, .12);
  --accent: #ff7900;
  --accent-hot: #ff1e00;
  --accent-gradient: linear-gradient(135deg, #ffb000 0%, #ff7900 42%, #ff1e00 100%);
  --content: min(84%, 1240px);
  --section-gap: clamp(4.5rem, 9vw, 8.75rem);
  --ease: cubic-bezier(.22, 1, .36, 1);
  --font-display: "Barlow Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: #5f300d #101010; scrollbar-width: thin; }
body { margin: 0; overflow-x: hidden; color: var(--text); background: var(--bg); font-family: var(--font-body); font-size: 16px; line-height: 1.65; }
body::selection { background: #ff7900; color: #0d0d0d; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 2px solid #ffb000; outline-offset: 4px; }
button { color: inherit; font: inherit; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #101010; }
::-webkit-scrollbar-thumb { background: #5f300d; border: 3px solid #101010; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #ff7900; }

.skip-link { position: fixed; z-index: 100; top: 1rem; left: 1rem; padding: .6rem 1rem; color: #0d0d0d; background: #ffb000; transform: translateY(-160%); transition: transform .2s ease; }
.skip-link:focus { transform: translateY(0); }
.section-inner { width: var(--content); margin-inline: auto; }
.section-shell { position: relative; width: 100%; }
.section { padding-block: var(--section-gap); }
section[id] { scroll-margin-top: 90px; }

.site-header { position: fixed; z-index: 20; inset: 0 0 auto; border-bottom: 1px solid transparent; transition: background .3s ease, border-color .3s ease, backdrop-filter .3s ease; }
.site-header.is-scrolled { background: rgba(13, 13, 13, .86); border-color: rgba(255, 255, 255, .1); backdrop-filter: blur(16px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; width: var(--content); min-height: 82px; margin-inline: auto; }
.brand { display: inline-flex; align-items: center; width: 192px; flex: 0 0 auto; }
.brand img { width: 100%; height: auto; }
.desktop-nav { display: flex; align-items: center; gap: clamp(1rem, 2.2vw, 2rem); margin-left: auto; }
.desktop-nav a { position: relative; padding: .4rem 0; color: var(--muted); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.desktop-nav a::after { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; content: ""; background: var(--accent-gradient); transform: scaleX(0); transform-origin: right; transition: transform .3s var(--ease); }
.desktop-nav a:hover { color: var(--text); }
.desktop-nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 3.25rem; padding: .75rem 1.25rem; border: 1px solid transparent; border-radius: 999px; font-size: .78rem; font-weight: 800; letter-spacing: .1em; line-height: 1.2; text-align: center; text-transform: uppercase; transition: transform .25s var(--ease), box-shadow .25s ease, border-color .25s ease, background .25s ease, color .25s ease; }
.button:hover { transform: translateY(-3px); }
.button--primary { color: #0d0d0d; background: var(--accent-gradient); box-shadow: 0 8px 30px rgba(255, 81, 0, .16); }
.button--primary:hover { box-shadow: 0 12px 34px rgba(255, 81, 0, .3); filter: saturate(1.1) brightness(1.05); }
.button--secondary { border-color: rgba(255, 255, 255, .22); color: #fff; background: rgba(255, 255, 255, .02); }
.button--secondary:hover { border-color: #ff7900; background: rgba(255, 121, 0, .08); }
.button-icon { display: inline-grid; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; color: #0d0d0d; background: #fff; font-size: 1rem; line-height: 1; }
.header-phone { min-height: 2.7rem; padding-inline: 1rem; font-size: .68rem; }
.menu-toggle, .mobile-menu, .mobile-nav, .mobile-phone { display: none; }

.hero { min-height: min(860px, 92svh); padding-top: 9.5rem; padding-bottom: 2.2rem; background: radial-gradient(circle at 73% 24%, rgba(255, 96, 0, .12), transparent 24rem), linear-gradient(115deg, #0d0d0d 0%, #0d0d0d 48%, #10100f 100%); }
.hero::before { position: absolute; inset: 0; pointer-events: none; opacity: .3; content: ""; background-image: linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, #000, transparent 72%); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; gap: clamp(2rem, 5vw, 5.5rem); min-height: 650px; }
.hero-copy { max-width: 700px; }
.eyebrow { display: flex; align-items: center; gap: .75rem; margin: 0 0 1.5rem; color: #ff9d00; font-size: .72rem; font-weight: 800; letter-spacing: .18em; line-height: 1.4; text-transform: uppercase; }
.eyebrow-line { display: inline-block; width: 2.75rem; height: 1px; background: var(--accent-gradient); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); }
h1 { max-width: 750px; margin-bottom: 2rem; font-size: clamp(3.8rem, 5.4vw, 6.2rem); font-stretch: condensed; font-weight: 900; letter-spacing: -.055em; line-height: .98; text-transform: uppercase; }
.hero-heading-line { display: block; white-space: nowrap; }
h1 em, h2 span { color: transparent; background: var(--accent-gradient); -webkit-background-clip: text; background-clip: text; font-style: normal; }
.hero-dot { color: var(--accent); }
.hero-lede { max-width: 520px; margin-bottom: 2rem; color: var(--muted); font-size: clamp(1rem, 1.5vw, 1.12rem); line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.hero-tags { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: 2.2rem; color: #8c8c8c; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .68rem; letter-spacing: .03em; }
.hero-tags span + span::before { margin-right: 1rem; color: #ff7900; content: "•"; }
.hero-visual { position: relative; min-height: 540px; overflow: hidden; border: 1px solid rgba(255, 255, 255, .15); background: #161616; box-shadow: 0 24px 80px rgba(0, 0, 0, .5), 0 0 60px rgba(255, 79, 0, .1); }
.hero-visual__image { position: absolute; inset: 0; background: url("https://images.unsplash.com/photo-1778369850153-775403bf5844?auto=format&fit=crop&w=1800&q=82") right center / 200% auto no-repeat; transform: scale(1.02); }
.hero-visual__shade { position: absolute; inset: 0; background: linear-gradient(90deg, #101010 0%, rgba(16, 16, 16, .45) 26%, transparent 70%), linear-gradient(0deg, rgba(8, 8, 8, .75), transparent 50%); }
.hero-visual::before { position: absolute; z-index: 1; top: 13%; right: -10%; width: 66%; height: 48%; border-radius: 50%; content: ""; background: rgba(255, 111, 0, .18); filter: blur(60px); }
.hero-visual__topline, .hero-visual__caption { position: absolute; z-index: 2; right: 1.1rem; left: 1.1rem; display: flex; justify-content: space-between; color: rgba(255, 255, 255, .72); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; }
.hero-visual__topline { top: 1.2rem; padding-bottom: .75rem; border-bottom: 1px solid rgba(255, 255, 255, .28); }
.hero-visual__caption { bottom: 1.25rem; align-items: center; justify-content: flex-start; gap: .55rem; }
.signal-dot { display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; background: #ff8d00; box-shadow: 0 0 14px #ff6200; }
.signal-meter { position: absolute; z-index: 2; top: 33%; right: 1.25rem; display: flex; flex-direction: column-reverse; gap: .25rem; width: .35rem; }
.signal-meter span { height: 1.4rem; background: rgba(255, 255, 255, .28); }
.signal-meter span:nth-child(1), .signal-meter span:nth-child(2), .signal-meter span:nth-child(3), .signal-meter span:nth-child(4), .signal-meter span:nth-child(5) { background: var(--accent-gradient); animation: meter 2.1s ease-in-out infinite alternate; }
.signal-meter span:nth-child(2) { animation-delay: -.4s; }.signal-meter span:nth-child(3) { animation-delay: -.8s; }.signal-meter span:nth-child(4) { animation-delay: -1.2s; }
@keyframes meter { from { opacity: .45; transform: scaleX(.75); } to { opacity: 1; transform: scaleX(1); } }
.hero-meta { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; margin-top: 1.25rem; color: #666; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .62rem; letter-spacing: .12em; }
.hero-meta__scroll { display: flex; align-items: center; gap: .6rem; }.hero-meta__line { width: 3.5rem; height: 1px; background: #555; }

.service-strip { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface); }
.service-strip__inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; min-height: 106px; }
.service-strip p { margin: 0; color: #8e8e8e; font-size: .9rem; }.service-strip strong { color: #fff; font-weight: 700; }
.service-strip__rail { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .9rem; color: #d3d3d3; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .63rem; letter-spacing: .14em; }.service-strip__rail i { color: #ff7900; font-style: normal; }

.section--services { background: var(--bg); }.section-heading { margin-bottom: 3.75rem; }.section-heading--split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(250px, .72fr); align-items: end; gap: 3rem; }.section-heading--gallery { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .55fr); align-items: end; gap: 3rem; }
h2 { margin-bottom: 0; font-size: clamp(3rem, 6vw, 6.1rem); font-weight: 900; letter-spacing: -.055em; line-height: .94; text-transform: uppercase; }
.section-heading--gallery h2 { font-size: clamp(3rem, 5vw, 5.25rem); }
.section-intro { max-width: 460px; margin-bottom: .3rem; color: var(--muted); font-size: .97rem; line-height: 1.75; }
.services-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; border: 1px solid var(--border); background: var(--border); }.service-card { position: relative; display: flex; min-height: 265px; flex-direction: column; padding: clamp(1.25rem, 2.2vw, 2rem); overflow: hidden; background: var(--card); transition: background .25s ease, transform .25s var(--ease), box-shadow .25s ease; }.service-card::before { position: absolute; top: 0; left: 0; width: 0; height: 2px; content: ""; background: var(--accent-gradient); transition: width .35s var(--ease); }.service-card:hover { z-index: 1; background: #1e1d1c; box-shadow: 0 16px 34px rgba(0, 0, 0, .25); transform: translateY(-4px); }.service-card:hover::before { width: 100%; }.service-card--accent { background: linear-gradient(145deg, #241a14, #191919 55%); }.service-card__head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: auto; }.service-number { color: #ff8500; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .7rem; letter-spacing: .1em; }.card-icon { display: inline-grid; width: 3rem; height: 3rem; place-items: center; border: 1px solid rgba(255, 121, 0, .42); border-radius: 50%; color: #ff9d00; background: rgba(255, 121, 0, .06); }.card-icon svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }.service-card h3 { margin: 2.5rem 0 .4rem; font-size: clamp(1.45rem, 2vw, 2rem); letter-spacing: -.02em; line-height: 1; text-transform: uppercase; }.service-card p { max-width: 29rem; margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.65; }.card-arrow { position: absolute; right: 1.5rem; bottom: 1.55rem; color: #ff7900; font-size: 1.1rem; opacity: 0; transform: translate(-5px, 5px); transition: opacity .25s ease, transform .25s var(--ease); }.service-card:hover .card-arrow { opacity: 1; transform: translate(0, 0); }

.section--gallery { background: #111; }.gallery-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(190px, .58fr) minmax(0, .85fr); grid-template-rows: 250px 250px; gap: .8rem; }.gallery-card { position: relative; min-height: 0; margin: 0; overflow: hidden; background: #1b1b1b; }.gallery-card img { --image-scale: 1; width: 100%; height: 100%; object-fit: cover; transform: scale(var(--image-scale)); transition: transform .7s var(--ease), filter .4s ease; }.gallery-card::after { position: absolute; inset: 0; content: ""; background: linear-gradient(0deg, rgba(0, 0, 0, .88), transparent 62%); }.gallery-card:hover img { filter: saturate(1.1); transform: scale(1.4); }.gallery-card--wide { grid-row: 1 / 3; }.gallery-card--wide img { --image-scale: 1.36; object-position: right center; transform-origin: right center; }.gallery-card--tall { grid-row: 1 / 3; grid-column: 3; }.gallery-card--tall img { --image-scale: 1.2; object-position: right center; transform-origin: right center; }.gallery-card--mark, .gallery-card--wordmark { background: radial-gradient(circle at 50% 38%, rgba(255, 121, 0, .16), transparent 56%), #050505; }.gallery-card--mark img { --image-scale: 1; width: 74%; height: 74%; margin: 8% auto 0; object-fit: contain; opacity: .88; }.gallery-card--wordmark { grid-column: 2; }.gallery-card--wordmark img { --image-scale: 1; width: 86%; height: 70%; margin: 5% auto 0; object-fit: contain; opacity: .9; }.gallery-card--wordmark:hover img { transform: scale(1.03); }.gallery-card figcaption { position: absolute; z-index: 1; right: 1.1rem; bottom: 1rem; left: 1.1rem; display: grid; gap: .22rem; }.gallery-card figcaption span { color: #ff9d00; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .6rem; letter-spacing: .12em; }.gallery-card figcaption strong { max-width: 18rem; font-family: "Arial Narrow", "Helvetica Neue", Arial, sans-serif; font-size: 1.5rem; line-height: 1; text-transform: uppercase; }.gallery-card figcaption b { position: absolute; right: 0; bottom: 0; color: #ff7900; font-size: 1.2rem; }

.section--process { position: relative; overflow: hidden; background: var(--surface); }.section--process::before { position: absolute; top: 10%; right: -10%; width: 50rem; height: 20rem; border-radius: 50%; content: ""; background: rgba(255, 78, 0, .1); filter: blur(80px); }.section-heading--center { position: relative; z-index: 1; max-width: 800px; margin-inline: auto; text-align: center; }.section-heading--center .eyebrow { justify-content: center; }.section-heading--center .section-intro { max-width: 570px; margin: 1.5rem auto 0; }.process-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 4.5rem; background: rgba(255, 255, 255, .13); }.process-step { min-height: 260px; padding: 1.75rem; background: var(--surface); }.process-step__top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 1.5rem; border-bottom: 1px solid rgba(255, 255, 255, .12); }.process-step__top > span { color: #ff8b00; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .7rem; letter-spacing: .1em; }.process-step__top i { display: inline-grid; width: 3rem; height: 3rem; place-items: center; border: 1px solid rgba(255, 121, 0, .4); border-radius: 50%; color: #ff9d00; font-style: normal; }.process-step__top svg { width: 1.4rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }.process-step h3 { max-width: 18rem; margin: 2rem 0 .5rem; font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1; text-transform: uppercase; }.process-step p { max-width: 19rem; margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.6; }.process-cta { position: relative; z-index: 1; display: flex; justify-content: center; margin-top: 2.25rem; }

.section--about { background: var(--bg); }.about-grid { display: grid; grid-template-columns: minmax(270px, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(3rem, 8vw, 9rem); }.about-mark { position: relative; display: grid; min-height: 420px; place-items: center; border: 1px solid rgba(255, 255, 255, .1); overflow: hidden; background: radial-gradient(circle, rgba(255, 101, 0, .14), transparent 35%), #111; }.about-mark::before, .about-mark::after { position: absolute; content: ""; border: 1px solid rgba(255, 121, 0, .25); }.about-mark::before { inset: 10%; }.about-mark::after { inset: 15%; border-color: rgba(255, 255, 255, .1); }.about-mark img { position: relative; z-index: 1; width: 62%; opacity: .9; filter: drop-shadow(0 20px 35px rgba(255, 67, 0, .25)); }.about-mark span { position: absolute; right: 1rem; bottom: 1rem; color: #ff8500; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .6rem; letter-spacing: .14em; }.about-copy { max-width: 650px; }.about-copy h2 { margin-bottom: 1.8rem; }.about-copy > p { max-width: 570px; margin-bottom: .8rem; color: var(--muted); font-size: .98rem; }.text-link { display: inline-flex; align-items: center; gap: .7rem; margin-top: 1.5rem; padding-bottom: .3rem; border-bottom: 1px solid #ff7900; color: #fff; font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.text-link span { color: #ff7900; font-size: 1.1rem; }

.main-cta { min-height: 610px; overflow: hidden; background: #111; }.main-cta__image, .main-cta__overlay { position: absolute; inset: 0; }.main-cta__image { background: url("https://images.unsplash.com/photo-1770737639812-bd3c709da73b?auto=format&fit=crop&w=1800&q=82") right center / 200% auto no-repeat; filter: saturate(.85); }.main-cta__overlay { background: linear-gradient(90deg, rgba(9, 9, 9, .95) 0%, rgba(9, 9, 9, .76) 42%, rgba(9, 9, 9, .28) 100%); }.main-cta__inner { position: relative; z-index: 1; display: flex; min-height: 610px; flex-direction: column; justify-content: center; }.main-cta h2 { max-width: 620px; margin-bottom: 1.5rem; }.main-cta__inner > p { max-width: 420px; margin-bottom: 1.7rem; color: #d0d0d0; }.main-cta__actions { display: flex; flex-wrap: wrap; gap: .75rem; }.main-cta small { margin-top: 1.6rem; color: #8e8e8e; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .65rem; letter-spacing: .04em; }

.section--contact { background: #111; }.contact-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(3rem, 8vw, 9rem); }.contact-copy h2 { margin-bottom: 1.5rem; }.contact-copy > p { max-width: 360px; margin: 0; color: var(--muted); }.contact-card { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid rgba(255, 255, 255, .14); background: var(--card); }.contact-card__label, .footer-label { margin-bottom: 1.2rem; color: #ff8500; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .64rem; font-weight: 700; letter-spacing: .14em; }.contact-line { display: grid; grid-template-columns: minmax(80px, .45fr) minmax(0, 1fr) auto; align-items: center; gap: 1rem; min-height: 74px; border-top: 1px solid rgba(255, 255, 255, .1); }.contact-line span { color: #777; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }.contact-line strong { font-family: "Arial Narrow", "Helvetica Neue", Arial, sans-serif; font-size: clamp(1.35rem, 3vw, 2.15rem); letter-spacing: -.02em; }.contact-line b { color: #ff7900; font-size: 1.2rem; font-weight: 400; }.contact-line--address { align-items: start; padding-block: 1rem; }.contact-line--address strong { font-family: inherit; font-size: .95rem; line-height: 1.55; }.contact-card__button { width: 100%; margin-top: 1rem; }

.site-footer { padding-block: 4.5rem 1.5rem; border-top: 1px solid rgba(255, 255, 255, .1); background: var(--bg); }.footer-grid { display: grid; grid-template-columns: 1.4fr .7fr 1fr; gap: 3rem; padding-bottom: 4rem; }.footer-brand .brand { width: 215px; margin-bottom: 1rem; }.footer-brand p, .footer-grid > div:last-child p:not(.footer-label) { margin: 0; color: #777; font-size: .8rem; line-height: 1.7; }.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; align-items: flex-start; }.footer-grid > div:not(.footer-brand) a { margin-bottom: .4rem; color: #b8b8b8; font-size: .85rem; }.footer-grid > div:not(.footer-brand) a:hover { color: #ff9d00; }.footer-label { margin-bottom: 1rem; }.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; padding-top: 1.2rem; border-top: 1px solid rgba(255, 255, 255, .1); color: #666; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .62rem; letter-spacing: .04em; }
.mobile-contact-bar { display: none; }

/* Sentence case keeps Vietnamese copy readable; uppercase stays with technical labels. */
.desktop-nav a { letter-spacing: .03em; text-transform: none; }
.button { letter-spacing: .02em; text-transform: none; }
h1 { font-weight: 800; letter-spacing: -.035em; line-height: 1.02; text-transform: none; }
h2 { font-weight: 800; letter-spacing: -.03em; line-height: 1.02; text-transform: none; }
.service-card h3, .process-step h3 { font-weight: 700; letter-spacing: -.01em; line-height: 1.08; text-transform: none; }
.gallery-card figcaption strong { font-family: var(--font-display); font-weight: 700; letter-spacing: -.01em; line-height: 1.08; text-transform: none; }
.process-step h3 { font-family: var(--font-display); }
.text-link { letter-spacing: .02em; text-transform: none; }
.contact-line span { letter-spacing: .04em; text-transform: none; }
.contact-line strong { font-family: var(--font-display); }
.mobile-menu > a:not(.button) { letter-spacing: .02em; text-transform: none; }
.mobile-contact-bar a { letter-spacing: .02em; text-transform: none; }
.hero-visual__caption { letter-spacing: .03em; text-transform: none; }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s var(--ease), transform .6s var(--ease); }.reveal.is-visible { opacity: 1; transform: translateY(0); }.reveal--delay { transition-delay: .12s; }.reveal--delay-1 { transition-delay: .08s; }.reveal--delay-2 { transition-delay: .16s; }

@media (max-width: 1024px) {
  :root { --content: min(90%, 900px); }
  .header-inner { min-height: 72px; }.desktop-nav { gap: 1rem; }.desktop-nav a { font-size: .66rem; }.brand { width: 165px; }.header-phone { padding-inline: .8rem; }.header-phone span:last-child { display: none; }
  .hero { padding-top: 8rem; }.hero-grid { gap: 2rem; min-height: 560px; }.hero-visual { min-height: 460px; }h1 { font-size: clamp(3.5rem, 5.4vw, 5.2rem); }.section-heading--split, .section-heading--gallery { gap: 2rem; }.gallery-grid { grid-template-rows: 210px 210px; }.contact-grid, .about-grid { gap: 3rem; }
}

@media (max-width: 900px) and (min-width: 768px) {
  .hero-grid { display: flex; min-height: 0; flex-direction: column; align-items: stretch; gap: 3rem; }
  .hero-copy { max-width: none; }
  h1 { font-size: clamp(3.5rem, 8vw, 5.2rem); }
  .hero-visual { min-height: 480px; }
}

@media (max-width: 767px) {
  :root { --content: 90%; --section-gap: 5rem; }
  body { padding-bottom: 64px; }.site-header { background: rgba(13, 13, 13, .78); }.header-inner { width: 90%; min-height: 66px; gap: .75rem; }.brand { width: 160px; }.desktop-nav, .header-phone { display: none; }.mobile-phone { display: grid; width: 42px; height: 42px; margin-left: auto; place-items: center; border: 1px solid rgba(255, 255, 255, .18); color: #ff9d00; font-size: 1rem; }.mobile-nav { position: relative; display: block; }.mobile-nav > summary { list-style: none; }.mobile-nav > summary::-webkit-details-marker { display: none; }.menu-toggle { display: flex; width: 42px; height: 42px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 0; border: 1px solid rgba(255, 255, 255, .18); background: transparent; cursor: pointer; }.menu-toggle span { display: block; width: 17px; height: 1px; background: #fff; transition: transform .25s ease; }.mobile-nav[open] .menu-toggle span:first-child { transform: translateY(3.5px) rotate(45deg); }.mobile-nav[open] .menu-toggle span:last-child { transform: translateY(-3.5px) rotate(-45deg); }.mobile-menu { position: absolute; z-index: 2; top: calc(100% + .75rem); right: 0; display: none; width: min(84vw, 320px); padding: .7rem 1rem 1rem; flex-direction: column; gap: .1rem; border: 1px solid rgba(255, 255, 255, .14); background: rgba(20, 20, 20, .97); box-shadow: 0 20px 50px rgba(0, 0, 0, .4); }.mobile-nav[open] .mobile-menu { display: flex; }.mobile-menu > a:not(.button) { padding: .75rem .15rem; color: #d0d0d0; font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }.mobile-menu__cta { margin-top: .7rem; }
  .hero { min-height: auto; padding-top: 8rem; padding-bottom: 1.4rem; }.hero::before { opacity: .16; background-size: 48px 48px; }.hero-grid { display: flex; min-height: 0; flex-direction: column; align-items: stretch; gap: 2.8rem; }.hero-copy { max-width: none; }.eyebrow { margin-bottom: 1.1rem; font-size: .62rem; letter-spacing: .14em; }.eyebrow-line { width: 2rem; }h1 { margin-bottom: 1.4rem; font-size: clamp(3rem, 13vw, 4.5rem); line-height: .98; }.hero-heading-line { white-space: normal; }.hero-lede { margin-bottom: 1.5rem; font-size: .98rem; }.hero-actions { display: grid; grid-template-columns: 1fr; }.button { width: 100%; min-height: 3.25rem; }.hero-tags { margin-top: 1.6rem; font-size: .6rem; line-height: 1.9; }.hero-visual { min-height: 360px; }.hero-visual__image { background-size: 170% auto; }.hero-meta { margin-top: 1rem; font-size: .54rem; }.hero-meta__scroll { display: none; }
  section[id] { scroll-margin-top: 76px; }
  .service-strip__inner { min-height: 0; padding-block: 1.2rem; flex-direction: column; align-items: flex-start; gap: .75rem; }.service-strip p { font-size: .82rem; line-height: 1.45; }.service-strip__rail { justify-content: flex-start; gap: .55rem; font-size: .55rem; letter-spacing: .08em; }.service-strip__rail i { margin-inline: .05rem; }
  .section-heading, .section-heading--split, .section-heading--gallery { display: block; margin-bottom: 2.5rem; }.section-heading .section-intro { margin-top: 1.4rem; font-size: .9rem; }.section-heading--gallery .section-intro { max-width: none; }h2 { font-size: clamp(3rem, 14vw, 4.8rem); line-height: .96; }
  .services-grid { grid-template-columns: 1fr; }.service-card { min-height: 230px; }.service-card h3 { margin-top: 2.2rem; font-size: 1.8rem; }.card-arrow { opacity: 1; transform: none; }
  .gallery-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 245px 200px 140px; gap: .55rem; }.gallery-card--wide { grid-column: 1 / 3; grid-row: auto; }.gallery-card--mark { grid-column: 1; grid-row: auto; }.gallery-card--tall { grid-column: 2; grid-row: auto; }.gallery-card--wordmark { grid-column: 1 / 3; grid-row: 3; }.gallery-card--wordmark img { width: 78%; height: 68%; margin-top: 4%; }.gallery-card figcaption { right: .7rem; bottom: .7rem; left: .7rem; }.gallery-card figcaption strong { font-size: 1.05rem; }.gallery-card figcaption span { font-size: .52rem; }
  .section-heading--center .eyebrow { justify-content: flex-start; }.section-heading--center { text-align: left; }.section-heading--center .section-intro { margin-left: 0; }.process-grid { grid-template-columns: 1fr; gap: 1px; margin-top: 2.8rem; }.process-step { min-height: 0; padding: 1.4rem; }.process-step h3 { margin-top: 1.4rem; font-size: 1.6rem; }.process-cta { margin-top: 1.6rem; }
  .about-grid, .contact-grid { display: flex; flex-direction: column; align-items: stretch; gap: 2.5rem; }.about-mark { min-height: 300px; }.about-copy h2 { margin-bottom: 1.4rem; }.about-copy > p { font-size: .92rem; }.text-link { margin-top: 1rem; }
  .main-cta { min-height: 560px; }.main-cta__image { background-size: 220% auto; }.main-cta__overlay { background: linear-gradient(90deg, rgba(9, 9, 9, .92) 0%, rgba(9, 9, 9, .68) 100%); }.main-cta__inner { min-height: 560px; }.main-cta h2 { font-size: clamp(3rem, 14vw, 4.8rem); }.main-cta__actions { display: grid; grid-template-columns: 1fr; }.main-cta small { font-size: .58rem; }
  .contact-line { grid-template-columns: 1fr auto; gap: .25rem 1rem; min-height: 78px; }.contact-line span { grid-column: 1 / 3; align-self: end; }.contact-line strong { font-size: 1.5rem; }.contact-line b { grid-column: 2; grid-row: 2; }.contact-line--address strong { font-size: .84rem; }
  .site-footer { padding-bottom: 1rem; }.footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem 1rem; padding-bottom: 2.5rem; }.footer-brand { grid-column: 1 / 3; }.footer-brand .brand { width: 190px; }.footer-bottom { flex-direction: column; gap: .5rem; font-size: .55rem; }
  .mobile-contact-bar { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: .75fr 1.25fr; min-height: 64px; border-top: 1px solid rgba(255, 255, 255, .18); background: rgba(20, 20, 20, .96); backdrop-filter: blur(16px); }.mobile-contact-bar a { display: flex; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: .05rem; color: #ffb000; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }.mobile-contact-bar a strong { color: #fff; font-size: .75rem; letter-spacing: .04em; }.mobile-contact-bar__call { color: #fff !important; background: var(--accent-gradient); }.mobile-contact-bar__call strong { color: #fff !important; }
  .reveal--delay, .reveal--delay-1, .reveal--delay-2 { transition-delay: 0s; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

@media (max-width: 340px) {
  h1 { font-size: 2.7rem; }
}

@media (max-width: 767px) {
  .mobile-menu > a:not(.button), .mobile-contact-bar a { letter-spacing: .02em; text-transform: none; }
}
