@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');

:root { --black:#0B0B0D; --charcoal:#1A1A1E; --gold:#D4AF37; --champagne:#EFE3C8; --offwhite:#F8F6F1; --ink:#17171A; --muted:#817C73; --line:rgba(212,175,55,.28); --serif:'Playfair Display', Georgia, serif; --sans:'DM Sans', Arial, sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--offwhite); font-family:var(--sans); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button, input, textarea { font:inherit; }
.container { width:min(1180px, calc(100% - 48px)); margin:0 auto; }
.site-header { position:sticky; top:0; z-index:50; background:rgba(11,11,13,.96); color:var(--offwhite); backdrop-filter:blur(14px); }
.header-inner { min-height:82px; display:flex; align-items:center; gap:32px; }
.gold-rule { height:2px; background:linear-gradient(90deg, transparent, var(--gold), transparent); opacity:.95; }
.brand { display:inline-flex; align-items:center; gap:11px; letter-spacing:.02em; flex-shrink:0; }
.brand-mark { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--gold); color:var(--gold); font-size:11px; font-weight:700; letter-spacing:-.08em; transform:rotate(45deg); }
.brand-mark::first-letter { letter-spacing:-.13em; }
.brand-name { font-size:17px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.brand-name em { color:var(--gold); font-family:var(--serif); font-size:18px; font-weight:500; text-transform:none; letter-spacing:0; }
.primary-nav { display:flex; align-items:center; justify-content:center; gap:28px; margin-left:auto; }
.primary-nav a { color:#b9b4aa; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; transition:color .25s ease; }
.primary-nav a:hover, .primary-nav a:focus-visible { color:var(--gold); }
.header-phone { color:var(--gold); border-left:1px solid var(--line); padding-left:24px; font-size:13px; font-weight:700; white-space:nowrap; }
.phone-icon { display:inline-block; margin-right:5px; font-size:16px; }
.menu-toggle { display:none; background:none; border:0; color:var(--offwhite); padding:8px; cursor:pointer; }
.menu-toggle span { display:block; width:23px; height:1px; background:var(--gold); margin:5px 0; }
.hero { min-height:calc(100vh - 84px); position:relative; display:flex; align-items:center; overflow:hidden; background:var(--black); color:var(--offwhite); }
.hero-backdrop { position:absolute; inset:0; background-image:linear-gradient(90deg, rgba(11,11,13,.96) 0%, rgba(11,11,13,.72) 42%, rgba(11,11,13,.42) 100%), url('/manus-storage/async-images/bdveksA0TkZHDi3adzpULX/image-1.webp'); background-size:cover; background-position:center; transform:scale(1.02); }
.hero::after { content:''; position:absolute; inset:auto 0 0; height:160px; background:linear-gradient(transparent, rgba(11,11,13,.78)); pointer-events:none; }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,390px); gap:clamp(44px,8vw,120px); align-items:center; padding:clamp(80px,12vw,150px) 0 100px; }
.eyebrow, .section-label { margin:0 0 22px; font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow { color:var(--gold); display:flex; align-items:center; gap:12px; }
.eyebrow span { width:34px; height:1px; background:var(--gold); }
h1, h2, h3, p { margin-top:0; }
h1, h2, h3 { font-family:var(--serif); font-weight:500; line-height:1.13; }
h1 { max-width:760px; margin-bottom:26px; font-size:clamp(46px,7vw,90px); letter-spacing:-.045em; }
h1 i, h2 i { color:var(--gold); font-weight:500; }
.hero-lede { max-width:580px; margin-bottom:34px; color:#d3cfc4; font-size:17px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:50px; padding:0 22px; border:1px solid transparent; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease; cursor:pointer; }
.button:hover, .button:focus-visible { transform:translateY(-3px); }
.button span { font-size:17px; font-weight:400; }
.button-gold { background:var(--gold); color:var(--black); }
.button-gold:hover, .button-gold:focus-visible { background:#edd06a; }
.button-outline { border-color:rgba(239,227,200,.5); color:var(--offwhite); }
.button-outline:hover, .button-outline:focus-visible { border-color:var(--gold); color:var(--gold); }
.button-dark { background:var(--black); color:var(--gold); width:100%; }
.trust-row { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:54px; color:#b7b0a4; font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.trust-row span { display:flex; align-items:center; gap:8px; }
.trust-row span::before { content:'✦'; color:var(--gold); font-size:10px; }
.hero-card { border:1px solid rgba(239,227,200,.34); background:rgba(26,26,30,.72); box-shadow:24px 24px 0 rgba(212,175,55,.12); }
.hero-card-image { min-height:275px; background-image:url('/manus-storage/async-images/bdveksA0TkZHDi3adzpULX/image-3.webp'); background-size:cover; background-position:center; }
.hero-card-body { padding:22px 24px 20px; }
.card-kicker { margin-bottom:12px; color:var(--gold); font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.hero-card-quote { margin-bottom:22px; color:var(--offwhite); font-family:var(--serif); font-size:21px; line-height:1.3; }
.hero-card-footer, .visual-caption { display:flex; justify-content:space-between; gap:12px; color:#a9a294; font-size:10px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.hero-card-footer span:first-child { color:var(--gold); }
.scroll-cue { position:absolute; bottom:28px; left:50%; z-index:2; display:flex; align-items:center; gap:12px; color:#aaa399; font-size:10px; letter-spacing:.16em; text-transform:uppercase; transform:translateX(-50%); }
.scroll-cue span { width:28px; height:1px; background:var(--gold); }
.section-light, .section-dark, .section-champagne { padding:clamp(86px,11vw,150px) 0; }
.section-light { background:var(--offwhite); }
.section-dark { background:var(--black); color:var(--offwhite); }
.section-champagne { background:var(--champagne); }
.section-label { color:#90897e; }
.gold-label { color:var(--gold); }
h2 { margin-bottom:24px; font-size:clamp(38px,5.2vw,68px); letter-spacing:-.04em; }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,9vw,140px); align-items:center; }
.about-copy { max-width:550px; }
.about-copy .lead-copy { margin-bottom:18px; color:#332f2a; font-size:19px; line-height:1.55; }
.about-copy p:not(.section-label) { color:#5f594f; }
.owner-line { display:flex; align-items:center; gap:14px; margin:28px 0 28px; }
.owner-initials { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--gold); color:var(--gold); font-size:12px; font-weight:700; }
.owner-line strong, .owner-line small { display:block; }
.owner-line strong { color:var(--ink); font-size:14px; }
.owner-line small { margin-top:2px; color:#918a7f; font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
blockquote { margin:0; padding:20px 0 0 22px; border-left:2px solid var(--gold); color:#38322a; font-family:var(--serif); font-size:23px; line-height:1.35; }
.about-visual { position:relative; padding:0 40px 44px 0; }
.visual-frame { position:relative; overflow:hidden; border:1px solid var(--gold); background:var(--charcoal); }
.visual-frame::after { content:''; position:absolute; inset:16px; border:1px solid rgba(239,227,200,.38); pointer-events:none; }
.visual-frame img { width:100%; aspect-ratio:4 / 5; object-fit:cover; }
.visual-stamp { position:absolute; right:0; top:25%; display:grid; place-items:center; width:104px; height:104px; background:var(--black); border:1px solid var(--gold); color:var(--gold); text-align:center; transform:rotate(5deg); }
.visual-stamp span { margin-bottom:-10px; font-family:var(--serif); font-size:25px; }
.visual-stamp small { color:var(--champagne); font-size:9px; line-height:1.25; letter-spacing:.12em; text-transform:uppercase; }
.visual-caption { position:absolute; bottom:13px; left:18px; right:58px; color:#6f685c; }
.visual-caption span:first-child { color:var(--gold); }
.section-heading { margin-bottom:62px; }
.split-heading { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:end; }
.split-heading h2 { margin-bottom:0; }
.split-heading > p { max-width:395px; justify-self:end; margin-bottom:5px; color:#aaa49a; }
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.service-card { min-height:278px; padding:26px 24px 23px; display:flex; flex-direction:column; background:linear-gradient(145deg, rgba(36,36,41,.95), rgba(18,18,20,.95)); transition:transform .3s ease, background .3s ease; }
.service-card:hover { z-index:1; background:linear-gradient(145deg, #323039, #19191e); transform:translateY(-5px); }
.service-number { color:var(--gold); font-family:var(--serif); font-size:16px; }
.service-card h3 { margin:30px 0 12px; color:var(--offwhite); font-size:22px; line-height:1.2; }
.service-card p { margin-bottom:22px; color:#a7a29a; font-size:13px; line-height:1.55; }
.service-card a { margin-top:auto; color:var(--gold); font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.service-card a span { margin-left:7px; font-size:15px; }
.centered { max-width:650px; margin-left:auto; margin-right:auto; text-align:center; }
.centered > p:last-child { color:#6e665b; }
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid rgba(26,26,30,.22); }
.process-step { display:grid; gap:22px; grid-template-columns:auto 1fr; padding:34px 27px 0 0; border-right:1px solid rgba(26,26,30,.22); }
.process-step + .process-step { padding-left:27px; }
.process-step:last-child { border-right:0; }
.step-badge { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--gold); color:#6e5520; font-family:var(--serif); font-size:15px; }
.process-step h3 { margin:3px 0 12px; color:var(--ink); font-size:22px; }
.process-step p { color:#72695d; font-size:13px; line-height:1.55; }
.benefits-grid { display:grid; grid-template-columns: .7fr 1.3fr; gap:clamp(50px,8vw,120px); align-items:start; }
.benefits-intro { position:sticky; top:130px; }
.benefits-intro h2 { margin-bottom:22px; }
.benefits-intro > p:not(.section-label) { max-width:290px; color:#6d675d; }
.text-link { display:inline-flex; align-items:center; gap:12px; margin-top:25px; color:var(--ink); border-bottom:1px solid var(--gold); padding-bottom:7px; font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.text-link span { color:#8d6f1d; font-size:16px; }
.benefit-list { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #d5d0c7; }
.benefit { display:grid; grid-template-columns:35px 1fr; column-gap:12px; padding:25px 18px 25px 0; border-bottom:1px solid #d5d0c7; }
.benefit:nth-child(odd) { border-right:1px solid #d5d0c7; padding-right:25px; }
.benefit:nth-child(even) { padding-left:25px; }
.benefit > span { color:#aa8823; font-family:var(--serif); font-size:15px; }
.benefit h3 { margin:0 0 8px; color:var(--ink); font-size:19px; line-height:1.2; }
.benefit p { grid-column:2; margin:0; color:#7e7669; font-size:12px; line-height:1.55; }
.gallery-grid { display:grid; grid-template-columns:1.2fr .8fr .8fr; grid-auto-rows:270px; gap:12px; }
.gallery-card { position:relative; overflow:hidden; margin:0; background:var(--charcoal); }
.gallery-card img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.6,.2,1); }
.gallery-card::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 35%, rgba(11,11,13,.9)); }
.gallery-card:hover img { transform:scale(1.06); }
.gallery-large { grid-row:span 2; }
.gallery-wide { grid-column:span 2; }
.gallery-card figcaption { position:absolute; bottom:20px; left:22px; right:22px; z-index:1; display:flex; flex-direction:column; gap:4px; color:var(--offwhite); }
.gallery-card figcaption span { color:var(--gold); font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.gallery-card figcaption strong { font-family:var(--serif); font-size:17px; font-weight:500; }
.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(50px,8vw,115px); align-items:start; }
.contact-intro h2 { max-width:490px; }
.contact-intro > p:not(.section-label) { max-width:450px; color:#6d665b; }
.contact-details { display:grid; gap:15px; margin-top:36px; padding-top:26px; border-top:1px solid #d2c9b7; }
.contact-details a, .contact-details p { margin:0; color:var(--ink); font-size:14px; }
.contact-details span { display:block; margin-bottom:2px; color:#9b8c72; font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.form-panel { padding:34px; background:rgba(248,246,241,.63); border:1px solid rgba(26,26,30,.15); box-shadow:14px 14px 0 rgba(212,175,55,.18); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
form label { display:block; margin-bottom:19px; color:#625b4d; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
form label small { color:#9c917e; font-size:9px; font-weight:500; letter-spacing:0; text-transform:none; }
input, textarea { display:block; width:100%; margin-top:9px; border:0; border-bottom:1px solid #bdb4a3; border-radius:0; outline:0; padding:12px 2px; color:var(--ink); background:transparent; font-size:14px; letter-spacing:0; text-transform:none; resize:vertical; transition:border-color .2s ease, box-shadow .2s ease; }
input:focus, textarea:focus { border-color:var(--gold); box-shadow:0 1px 0 var(--gold); }
input::placeholder, textarea::placeholder { color:#9a9286; opacity:1; }
form.has-errors input:invalid, form.has-errors textarea:invalid { border-color:#b44732; }
#form-success { display:none; margin-top:20px; padding:17px; border-left:2px solid var(--gold); color:#655838; background:rgba(212,175,55,.11); font-size:13px; }
.map-wrap { margin-top:72px; }
.map-card { position:relative; min-height:370px; overflow:hidden; border:1px solid rgba(26,26,30,.15); background:#d8d4ca; }
.map-card iframe { width:100%; height:370px; border:0; filter:grayscale(1) sepia(.2) contrast(.92); }
.map-overlay { position:absolute; bottom:20px; left:20px; width:min(290px, calc(100% - 40px)); padding:23px; background:rgba(11,11,13,.92); color:var(--offwhite); box-shadow:10px 10px 0 rgba(212,175,55,.55); }
.map-overlay p { margin-bottom:4px; color:var(--gold); font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.map-overlay strong { display:block; margin-bottom:18px; font-family:var(--serif); font-size:19px; font-weight:500; line-height:1.3; }
.map-overlay .button { min-height:42px; padding:0 15px; font-size:10px; }
.site-footer { padding:66px 0 25px; background:var(--black); color:var(--offwhite); }
.footer-top { display:grid; grid-template-columns:1.4fr .9fr .6fr; gap:50px; padding-bottom:55px; }
.footer-brand { margin-bottom:22px; }
.footer-top > div:first-child p { max-width:310px; color:#8f8b83; font-size:13px; }
.footer-contact { display:grid; align-content:start; gap:12px; }
.footer-contact a { color:var(--champagne); font-size:13px; }
.footer-contact span { color:#8f8b83; font-size:12px; line-height:1.5; }
.footer-nav { display:grid; align-content:start; gap:12px; }
.footer-nav a { color:#a7a29a; font-size:12px; letter-spacing:.09em; text-transform:uppercase; }
.footer-nav a:hover { color:var(--gold); }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-top:20px; border-top:1px solid rgba(239,227,200,.16); color:#746f68; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.reveal { opacity:0; transform:translateY(22px); transition:opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity:1; transform:translateY(0); }
.reveal-delay { transition-delay:.16s; }
@media (max-width: 1000px) { .header-inner { gap:20px; } .primary-nav { gap:16px; } .header-phone { padding-left:15px; font-size:11px; } .service-grid { grid-template-columns:repeat(2,1fr); } .gallery-grid { grid-template-columns:1fr 1fr; } .gallery-large { grid-row:span 1; } .gallery-wide { grid-column:span 2; } }
@media (max-width: 760px) { .container { width:min(100% - 34px, 600px); } .header-inner { min-height:70px; justify-content:space-between; } .menu-toggle { display:block; order:2; } .header-phone { display:none; } .primary-nav { position:absolute; top:70px; left:0; right:0; display:none; flex-direction:column; align-items:stretch; gap:0; padding:10px 17px 18px; background:rgba(11,11,13,.98); border-bottom:1px solid var(--line); } .primary-nav.is-open { display:flex; } .primary-nav a { padding:14px 0; border-bottom:1px solid rgba(239,227,200,.1); } .brand-name { font-size:14px; } .brand-name em { font-size:16px; } .hero { min-height:760px; } .hero-grid { grid-template-columns:1fr; gap:48px; padding:80px 0 94px; } .hero-card { max-width:380px; } .hero-card-image { min-height:180px; } .trust-row { margin-top:36px; gap:10px 16px; } .scroll-cue { display:none; } .about-grid, .contact-grid, .benefits-grid { grid-template-columns:1fr; } .about-visual { max-width:500px; margin:0 auto; } .benefits-intro { position:static; } .split-heading { grid-template-columns:1fr; gap:24px; } .split-heading > p { justify-self:start; } .process-grid { grid-template-columns:1fr 1fr; } .process-step, .process-step + .process-step { padding:25px 18px 0 0; border-bottom:1px solid rgba(26,26,30,.22); } .process-step:nth-child(even) { padding-left:18px; border-right:0; } .process-step:nth-last-child(-n+2) { border-bottom:0; } .benefit-list { grid-template-columns:1fr; } .benefit:nth-child(odd), .benefit:nth-child(even) { border-right:0; padding:23px 0; } .gallery-grid { grid-template-columns:1fr 1fr; grid-auto-rows:220px; } .gallery-card figcaption { left:14px; right:14px; bottom:13px; } .gallery-card figcaption strong { font-size:14px; } .form-panel { padding:23px; } .footer-top { grid-template-columns:1fr 1fr; gap:35px 20px; } .footer-top > div:first-child { grid-column:span 2; } .footer-bottom { flex-direction:column; gap:8px; } }
@media (max-width: 500px) { h1 { font-size:43px; } h2 { font-size:38px; } .hero-lede { font-size:15px; } .hero-actions { flex-direction:column; align-items:stretch; } .button { width:100%; } .service-grid { grid-template-columns:1fr; } .service-card { min-height:230px; } .process-grid { grid-template-columns:1fr; } .process-step, .process-step + .process-step, .process-step:nth-child(even) { padding:24px 0; border-right:0; border-bottom:1px solid rgba(26,26,30,.22); } .process-step:last-child { border-bottom:0; } .gallery-grid { grid-template-columns:1fr; grid-auto-rows:260px; } .gallery-large, .gallery-wide { grid-column:span 1; grid-row:span 1; } .form-row { grid-template-columns:1fr; gap:0; } .map-card, .map-card iframe { min-height:440px; height:440px; } .footer-top { grid-template-columns:1fr; } .footer-top > div:first-child { grid-column:auto; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *, *::before, *::after { transition-duration:.01ms !important; animation-duration:.01ms !important; } .reveal { opacity:1; transform:none; } }
