@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Manrope:wght@400;500;600;700&display=swap');
:root{--bg:#232421;--panel:#2d2d29;--gold:#b59663;--ink:#ece8df;--muted:#aaa89f}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;background-image:url('assets/grain.svg')}a{color:inherit;text-decoration:none}a:hover{color:var(--gold)}header{position:sticky;top:0;z-index:10;background:#232421ef;backdrop-filter:blur(15px);border-bottom:1px solid #ffffff13}.nav{max-width:1200px;margin:auto;min-height:86px;padding:14px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font:600 13px Manrope,sans-serif;letter-spacing:.13em;text-transform:uppercase}.brand img{width:39px;height:39px}nav{display:flex;gap:30px}nav a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#c6c4bb}nav a.active{color:var(--gold)}main{max-width:1200px;margin:auto;padding:0 28px}.hero{min-height:72vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;border-bottom:1px solid #ffffff25}.eyebrow{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}h1,h2,h3{font-family:Manrope,sans-serif;font-weight:500}h1{font-size:clamp(46px,8vw,110px);letter-spacing:-.065em;line-height:1.06;margin:23px 0}h2{font-size:clamp(32px,4vw,58px);letter-spacing:-.05em}p{color:var(--muted);line-height:1.85;max-width:680px}.hero p{font-size:17px}.button{display:inline-block;margin-top:25px;border:1px solid var(--gold);padding:14px 23px;color:var(--gold);font-size:11px;letter-spacing:.17em;text-transform:uppercase}.button:hover{background:var(--gold);color:#20201d}.section{padding:100px 0;border-bottom:1px solid #ffffff20}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}.tile{background:var(--panel);border:1px solid #ffffff15;padding:20px;min-height:290px;display:flex;flex-direction:column;justify-content:end}.tile .art{height:175px;border:1px dashed #8d826e55;display:flex;align-items:center;justify-content:center;color:#8e887d;font-size:12px;letter-spacing:.15em;margin-bottom:18px}.tile h3{margin:0 0 6px;font-size:20px}.tile p{font-size:13px;margin:0}.placeholder{border:1px dashed #b5966370;padding:16px;color:#b6aa96;background:#b5966309;font-size:13px;letter-spacing:.06em}.intro{position:fixed;inset:0;background:#191a18;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;transition:opacity .8s ease,visibility .8s ease}.intro.hide{opacity:0;visibility:hidden;pointer-events:none}.intro img{width:95px;animation:rise 1.2s ease both}.intro strong{font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);animation:rise 1.2s .2s ease both}.skip{position:absolute;bottom:35px;right:35px;border:0;background:none;color:#d4c5a9;cursor:pointer;letter-spacing:.15em;text-transform:uppercase}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}footer{max-width:1200px;margin:auto;padding:35px 28px 55px;display:flex;justify-content:space-between;gap:15px;color:#aaa89f;font-size:12px}footer a{color:var(--gold)}@media(max-width:700px){.nav{flex-direction:column;gap:14px}.brand{font-size:11px}nav{gap:18px}nav a{font-size:10px}.hero{min-height:60vh}.section{padding:65px 0}.grid{grid-template-columns:1fr}.section-head{display:block}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.intro{display:none}}

/* Branded arrow-and-wreath navigation emblem */
.brand img{width:49px;height:49px;object-fit:contain;flex-shrink:0}
.brand span{letter-spacing:.11em}

/* Shared asphalt finish: transparent logo pixels show the SAME texture as the page. */
:root{--bg:#232421}
body{background-color:var(--bg);background-image:url('assets/asphalt-grain.svg');background-size:240px 240px;background-repeat:repeat}
header{background-color:rgba(35,36,33,.94)}
.brand img{background:transparent;object-fit:contain}
.intro{background-color:var(--bg);background-image:url('assets/asphalt-grain.svg');background-size:240px 240px;background-repeat:repeat;gap:0}
.intro .intro-logo{display:block;width:min(78vw,750px);height:auto;max-height:75vh;object-fit:contain;animation:logoFade 2.65s ease-in-out both}
@keyframes logoFade{0%{opacity:0}25%{opacity:1}68%{opacity:1}100%{opacity:0}}
.intro.hide{opacity:0;visibility:hidden;pointer-events:none}
@media(max-width:700px){.intro .intro-logo{width:94vw}}
@media(prefers-reduced-motion:reduce){.intro{display:none}}

/* Home page: centered brand reveal and content */
.hero{align-items:center;text-align:center;min-height:calc(100svh - 86px);padding:46px 0 82px;justify-content:center}
.hero-logo-heading{margin:0;line-height:0;width:100%;display:flex;justify-content:center}
.hero-logo{display:block;width:min(78vw,750px);max-height:54svh;height:auto;object-fit:contain}
.hero-quote{margin:2px auto 0;font-size:clamp(16px,2vw,22px);font-family:Georgia,serif;font-style:italic;letter-spacing:.035em;color:var(--ink)}
.hero-quote span{display:block;font-family:'DM Sans',sans-serif;font-size:11px;font-style:normal;text-transform:uppercase;letter-spacing:.23em;color:var(--gold);margin-top:9px}
.hero-descriptor{font-size:12px!important;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:24px auto 0}
.hero .button{margin-top:32px}
.company-intro{font-size:17px;max-width:760px}
/* Match the opening logo and the destination hero logo in size and position. */
body:has(.hero-logo) .intro{background-color:var(--bg)}
body:has(.hero-logo) .intro .intro-logo{width:min(78vw,750px);max-height:54svh;animation:homeLogoReveal 2.7s ease-in-out both}
@keyframes homeLogoReveal{0%{opacity:0;transform:scale(.975)}30%{opacity:1;transform:scale(1)}74%{opacity:1;transform:scale(1)}100%{opacity:1;transform:scale(1)}}
body:has(.hero-logo) .intro{transition:opacity 1.05s ease,visibility 1.05s ease}
@media(max-width:700px){.hero{min-height:calc(100svh - 116px);padding:32px 0 65px}.hero-logo,body:has(.hero-logo) .intro .intro-logo{width:94vw;max-height:43svh}.hero-descriptor{font-size:10px!important;letter-spacing:.15em}}

/* V4 wordmark: lettering extracted directly from the original full logo, rendered white. */
.brand img.brand-wordmark{width:clamp(160px,17vw,218px);height:auto;max-height:46px;object-fit:contain;object-position:left center;flex-shrink:1}
.brand{gap:13px}
@media(max-width:700px){.brand img.brand-wordmark{width:180px;max-width:calc(100vw - 115px)}}

/* V4.3: Project details */
.project-details{display:flex;flex-direction:column;gap:20px;margin-top:19px}
.project-detail-label{display:block;color:var(--gold);font-size:11px;letter-spacing:.19em;text-transform:uppercase;font-weight:600;margin-bottom:7px}
.project-detail p{margin:0;line-height:1.7}

/* V5.1 Projects intro: unboxed text below title */
.projects-intro{border:0;background:none;padding:0;margin:0;color:var(--muted);font-size:17px;letter-spacing:normal;line-height:1.7;text-align:center}

/* V6: Projects intro and About page */
.projects-intro-bronze{color:var(--gold)}
.about-mission{font-family:Georgia,serif;font-style:italic;font-size:clamp(21px,3vw,31px)!important;color:var(--gold);margin:0}
.about-story-copy{max-width:900px}
.about-story-copy p{color:var(--gold);font-size:clamp(15px,1.5vw,18px);line-height:1.9;max-width:none;margin:0 0 24px}
.about-story-copy strong{font-weight:700}
.about-team .team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:35px}
.team-member{padding:0 0 24px;border-bottom:1px solid #ffffff20}
.team-role{color:var(--gold);font-size:13px;line-height:1.7;max-width:none;margin:0 0 12px}
.team-member h3{color:var(--ink);font-size:clamp(22px,2.6vw,32px);margin:0}
.about-disclaimer h2{font-size:clamp(28px,3.4vw,46px);max-width:950px}
.disclaimer-copy{max-width:900px}
.disclaimer-copy p{max-width:none;font-size:16px;line-height:1.9;margin:0 0 22px}
.disclaimer-copy strong{color:var(--ink)}
@media(max-width:700px){.about-team .team-grid{grid-template-columns:1fr;gap:24px}}

/* V6.1: About page emphasis and disclaimer readability */
.about-story-copy .story-highlight{color:var(--ink)}
.disclaimer-copy{max-width:860px}
.disclaimer-copy p{color:var(--gold);font-size:clamp(15px,1.45vw,17px);line-height:1.9;margin:0 0 25px;max-width:none}
.disclaimer-copy strong{color:var(--gold);font-weight:700}
.disclaimer-copy p:last-child{margin-bottom:0}

/* V6.2: Projects intro matches About page mission typography. */
.projects-intro-bronze{font-family:Georgia,serif;font-style:italic;font-size:clamp(21px,3vw,31px)!important;letter-spacing:normal;line-height:1.7;color:var(--gold);margin:0}


/* V7: Contact page layout */
.contact-page .contact-hero{min-height:0;padding:85px 0 58px;border-bottom:0;align-items:center;text-align:center}
.contact-page .contact-hero h1{margin:0 0 10px}
.contact-intro{font-family:Georgia,serif;font-style:italic;font-size:clamp(21px,3vw,31px)!important;letter-spacing:normal;line-height:1.7;color:var(--gold);margin:0 auto;max-width:none}
.contact-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(35px,6vw,95px);padding:52px 0 120px;border-top:1px solid #ffffff20}
.contact-column{min-width:0}
.contact-column h2{font-size:clamp(19px,2.15vw,27px);letter-spacing:-.025em;line-height:1.35;margin:0 0 24px;color:var(--ink)}
.contact-link{border:1px solid var(--gold);padding:18px 22px;min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:15px;color:var(--gold);font-size:clamp(12px,1.3vw,15px);overflow-wrap:anywhere;transition:background .2s ease,color .2s ease}
a.contact-link:hover{background:var(--gold);color:var(--bg)}
.social-links{display:grid;gap:12px}
.social-platform{font-size:11px;text-transform:uppercase;letter-spacing:.15em;color:var(--ink)}
a.contact-link:hover .social-platform{color:var(--bg)}
.contact-link-disabled{border-color:#b5966355;color:var(--muted);cursor:default}
@media(max-width:700px){.contact-page .contact-hero{padding:62px 0 35px}.contact-columns{grid-template-columns:1fr;gap:45px;padding:35px 0 80px}.contact-column h2{margin-bottom:18px}.contact-link{padding:16px}}
