.hero { position: relative; min-height: 800px; overflow: hidden; padding: 150px 0 88px; color: white; background: var(--brown); }
.hero::before { position: absolute; inset: 0; opacity: .08; background-image: radial-gradient(rgba(255,255,255,.45) .6px,transparent .6px); background-size: 10px 10px; content: ""; }
.hero-glow { position: absolute; border-radius: 50%; }
.hero-glow-one { top: -350px; left: -260px; width: 740px; height: 740px; background: radial-gradient(circle,rgba(180,105,67,.36),transparent 67%); }
.hero-glow-two { right: -200px; bottom: -450px; width: 850px; height: 850px; background: radial-gradient(circle,rgba(217,174,88,.19),transparent 67%); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .94fr 1.06fr; align-items: center; gap: clamp(42px,6vw,92px); }
.hero-copy { padding-bottom: 30px; }
.hero h1 { margin: 0 0 28px; font-size: clamp(4rem,7.2vw,7.1rem); }
.hero h1 em { display: inline-block; white-space: nowrap; }
.hero-intro { max-width: 590px; margin-bottom: 34px; color: rgba(255,255,255,.8); font-size: clamp(1.05rem,1.5vw,1.25rem); }
.hero-actions { display: flex; align-items: center; gap: 30px; }
.hero-promise { display: flex; align-items: center; gap: 16px; max-width: 420px; margin-top: 52px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.16); }
.hero-promise p { margin: 0; color: rgba(255,255,255,.66); font-size: .82rem; line-height: 1.55; }
.hero-promise strong { color: white; }
.promise-mark { color: var(--gold); font-size: 1.45rem; }
.hero-visual { position: relative; justify-self: end; width: 100%; max-width: 610px; }
.hero-photo { position: relative; overflow: hidden; height: min(590px,63vw); min-height: 470px; box-shadow: 0 35px 90px rgba(16,6,3,.34); }
.hero-photo > img { width: 100%; height: 100%; object-fit: cover; object-position: 48% center; }
.photo-shade { position: absolute; inset: 0; background: linear-gradient(180deg,transparent 45%,rgba(31,13,9,.82)); }
.photo-caption { position: absolute; right: 28px; bottom: 30px; left: 28px; display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 10px; color: rgba(255,255,255,.76); font-size: .7rem; letter-spacing: .13em; text-transform: uppercase; }
.photo-caption strong { grid-column: 2; margin-top: 5px; color: white; font: 1.2rem "Playfair Display",serif; letter-spacing: 0; text-transform: none; }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: #ef6d54; box-shadow: 0 0 0 5px rgba(239,109,84,.16); }
.hero-seal { position: absolute; top: -44px; right: -42px; width: 144px; height: 144px; padding: 8px; border-radius: 50%; background: white; box-shadow: var(--shadow); object-fit: cover; animation: float 5s ease-in-out infinite; }
.hero-note { position: absolute; bottom: 48px; left: -64px; display: flex; align-items: center; gap: 14px; min-width: 190px; padding: 17px 20px; color: var(--ink); background: var(--gold-light); box-shadow: var(--shadow); }
.hero-note span { color: var(--brown-light); font: 1.9rem "Playfair Display",serif; }
.hero-note p { margin: 0; font-size: .7rem; line-height: 1.35; letter-spacing: .08em; text-transform: uppercase; }
.hero-ticker { position: absolute; z-index: 2; right: 0; bottom: 0; left: 0; overflow: hidden; padding: 13px 0; color: var(--brown); background: var(--gold); white-space: nowrap; }
.hero-ticker div { width: max-content; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; animation: ticker 24s linear infinite; }
.hero-ticker span { margin-inline: 48px; }
.intro-section { background: var(--white); }
.intro-grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: 11%; align-items: start; }
.intro-copy { max-width: 560px; padding-top: 8px; }
.intro-copy > p:not(.lead) { color: var(--muted); }
.values-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 86px; }
.value-card { min-height: 310px; padding: 38px; border: 1px solid var(--line); }
.value-card + .value-card { border-left: 0; }
.value-card-dark { color: white; border-color: var(--brown); background: var(--brown); transform: translateY(24px); }
.value-card > span { color: var(--gold); font-family: "Playfair Display",serif; }
.value-card h3 { margin: 92px 0 14px; font: 2.1rem "Playfair Display",serif; }
.value-card p { margin: 0; color: var(--muted); font-size: .92rem; }
.value-card-dark p { color: rgba(255,255,255,.7); }
.work-section { background: var(--cream); }
.work-section .work-grid { margin-top: 70px; }
.media-feature { position: relative; overflow: hidden; padding: 130px 0; color: white; background: var(--brown-deep); }
.media-feature::after { position: absolute; right: -8vw; bottom: -19vw; width: 48vw; height: 48vw; border: 1px solid rgba(217,174,88,.16); border-radius: 50%; box-shadow: 0 0 0 70px rgba(217,174,88,.025),0 0 0 140px rgba(217,174,88,.018); content: ""; }
.media-feature-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.05fr .85fr; align-items: center; gap: 11%; }
.media-photo-stack { position: relative; min-height: 600px; }
.media-main-photo { position: absolute; top: 0; left: 0; width: 85%; margin: 0; }
.media-main-photo img { width: 100%; height: 410px; object-fit: cover; }
.media-main-photo figcaption { padding-top: 10px; color: rgba(255,255,255,.5); font-size: .7rem; }
.media-small-photo { position: absolute; right: 0; bottom: 0; width: 42%; margin: 0; border: 8px solid var(--brown-deep); }
.media-small-photo img { width: 100%; height: 290px; object-fit: cover; }
.media-stamp { position: absolute; bottom: 48px; left: 8%; display: grid; width: 100px; height: 100px; place-content: center; color: var(--ink); border-radius: 50%; background: var(--gold); text-align: center; transform: rotate(-8deg); }
.media-stamp span { font: 2rem/.75 "Playfair Display",serif; }
.media-stamp small { font-size: .6rem; font-weight: 700; letter-spacing: .2em; }
.media-feature-copy h2 { font-size: clamp(3.3rem,5.9vw,5.8rem); }
.media-feature-copy .lead { margin: 32px 0 20px; color: white; }
.media-feature-copy > p:not(.eyebrow,.lead) { color: rgba(255,255,255,.68); }
.media-feature-copy .button { margin-top: 20px; }
.approach-section { background: var(--white); }
.approach-line { position: relative; display: grid; grid-template-columns: repeat(3,1fr); margin: 80px 0 95px; }
.approach-line::before { position: absolute; top: 27px; right: 16%; left: 16%; height: 1px; background: var(--line); content: ""; }
.approach-line article { position: relative; padding: 0 30px; text-align: center; }
.approach-line article > span { position: relative; z-index: 1; display: grid; width: 56px; height: 56px; margin: 0 auto 22px; place-items: center; color: var(--brown-light); border: 1px solid var(--gold); border-radius: 50%; background: var(--white); font-family: "Playfair Display",serif; }
.approach-line h3 { margin-bottom: 9px; font: 1.45rem "Playfair Display",serif; }
.approach-line p { max-width: 290px; margin: auto; color: var(--muted); font-size: .86rem; }
.project-banner { display: grid; grid-template-columns: 1.15fr .85fr; color: white; background: var(--brown); }
.project-banner > div { padding: clamp(38px,6vw,76px); }
.project-banner h3 { max-width: 650px; margin: 28px 0 18px; font: clamp(2rem,3.7vw,3.5rem)/1.08 "Playfair Display",serif; }
.project-banner > div > p { color: rgba(255,255,255,.66); }
.project-banner blockquote { display: grid; align-content: center; margin: 0; padding: clamp(38px,5vw,70px); color: var(--brown); background: var(--gold-light); font: clamp(1.7rem,2.8vw,2.7rem)/1.2 "Playfair Display",serif; }
.project-banner blockquote span { height: 65px; color: var(--gold); font: 6rem/1 Georgia,serif; }
.board-section { background: var(--cream); }
.board-grid { display: grid; grid-template-columns: .9fr 1fr; align-items: center; gap: 10%; }
.board-photo { position: relative; padding: 0 0 35px 35px; }
.board-photo::before { position: absolute; bottom: 0; left: 0; width: 70%; height: 70%; background: var(--gold); content: ""; }
.board-photo img { position: relative; width: 100%; max-height: 650px; object-fit: cover; object-position: center 35%; }
.board-photo > div { position: absolute; right: -25px; bottom: 10px; padding: 16px 22px; color: white; background: var(--brown); }
.board-photo > div span, .board-photo > div strong { display: block; }
.board-photo > div span { color: var(--gold-light); font-size: .63rem; letter-spacing: .12em; text-transform: uppercase; }
.board-photo > div strong { font: 1.1rem "Playfair Display",serif; }
.board-copy h2 { max-width: 670px; font-size: clamp(2.7rem,4.6vw,4.7rem); }
.board-copy > p:not(.eyebrow) { max-width: 560px; margin: 26px 0 35px; color: var(--muted); }
.home-contact { background: var(--white); }
.home-contact-inner { display: grid; grid-template-columns: 1fr .65fr; align-items: end; gap: 10%; }
.home-contact-inner > div:last-child p { color: var(--muted); }
.home-contact-inner .button { margin-top: 15px; }
