:root{--ink:#202624;--muted:#606762;--paper:#fff;--surface:#f1f3f1;--line:#d9dfd9;--accent:#c94730;--display:Georgia,'Times New Roman',serif;--sans:'Avenir Next',Avenir,'Segoe UI',Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:6.5rem}
body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--sans);font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible{outline:3px solid var(--accent);outline-offset:6px;border-radius:2px}
img{display:block;width:100%;height:auto}
figure,h1,h2,h3,p{margin:0}
::selection{background:#e9d4c9;color:var(--ink)}
.shell{width:min(100% - 7rem,1380px);margin-inline:auto}
.skip-link{position:fixed;z-index:100;top:1rem;left:1rem;transform:translateY(-200%);padding:.75rem 1rem;background:var(--ink);color:white}
.skip-link:focus{transform:translateY(0)}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line)}
.header-inner{min-height:96px;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.brand{display:inline-flex;align-items:center;gap:.9rem;white-space:nowrap;font-size:1.12rem;font-weight:600;letter-spacing:-.035em}
.brand-icon{flex-shrink:0}
.brand-divider,.footer-brand>span{color:var(--accent);font-weight:400;margin:0 .2rem}
.main-nav{display:flex;align-items:center;gap:2.5rem;font-size:.9rem;font-weight:500}
.main-nav>a{padding:.55rem 0;transition:color .18s}
.main-nav>a:hover{color:var(--accent)}
.main-nav .nav-contact{display:flex;gap:1.1rem;align-items:center;border-bottom:1px solid var(--ink)}
.hero{display:grid;grid-template-columns:.94fr 1.1fr;gap:2rem;align-items:center;min-height:690px;padding-block:5.3rem 5.8rem}
.eyebrow{display:flex;align-items:center;gap:.65rem;font-size:.875rem;line-height:1.45;margin-bottom:2rem}
.small-rule{display:inline-block;flex:0 0 22px;height:2px;background:var(--accent)}
h1{font-family:var(--display);font-weight:400;font-size:clamp(3rem,4.65vw,5rem);line-height:1.075;letter-spacing:-.053em}
h1>span{font-style:italic;color:var(--accent);white-space:normal}
.hero-description{font-size:1.08rem;line-height:1.8;max-width:410px;color:var(--muted);margin-top:1.7rem}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:2rem;min-height:54px;background:var(--ink);color:#fff;padding:.85rem 1.3rem;font-size:.9375rem;transition:background .2s,transform .2s;margin-top:2rem}
.button:hover{background:var(--accent);transform:translateY(-2px)}
.button>span{font-size:1.2rem}
.hero-note{max-width:310px;font-size:.875rem;color:var(--muted);margin-top:1.2rem;line-height:1.6}
.hero-visual{min-width:0;align-self:center;padding-top:1rem}
.image-label{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem;color:var(--muted);padding-bottom:.8rem;border-bottom:1px solid var(--line)}
.image-label>span:last-child{font-size:.8rem;letter-spacing:.04em}
.hero-visual>img{width:100%;aspect-ratio:1.28;object-fit:contain;background:#fff;mix-blend-mode:multiply}
.hero-visual>figcaption{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.875rem}
.concept-label{border:1px solid var(--line);padding:.2rem .6rem;font-size:.8125rem;color:var(--muted)}
.service-section{background:var(--surface);padding-block:5.4rem 5.8rem;scroll-margin-top:4rem}
.section-intro{display:grid;grid-template-columns:1fr 2fr;gap:2rem}
.section-index{display:flex;align-items:baseline;gap:1.2rem;font-size:.875rem;font-weight:500;color:var(--muted);line-height:1.6}
.section-index>span{color:var(--ink)}
h2{font-family:var(--display);font-size:clamp(2.2rem,3.4vw,3.55rem);font-weight:400;line-height:1.1;letter-spacing:-.045em}
.section-description{max-width:650px;margin-top:1.5rem;color:var(--muted);font-size:1.065rem;line-height:1.85}
.service-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5rem;margin-top:3.8rem}
.service-step{padding-top:1.1rem;border-top:1px solid #c9d0c9}
.step-number{font-family:var(--display);font-size:1.5rem;color:var(--accent)}
.service-step>h3{font-size:1.05rem;font-weight:600;margin-top:1rem;line-height:1.4;letter-spacing:-.025em}
.service-step>p{font-size:1rem;color:var(--muted);line-height:1.75;margin-top:.65rem}
.portfolio-section{padding-block:6rem 5.8rem;scroll-margin-top:4rem}
.portfolio-heading{display:flex;justify-content:space-between;gap:3rem;align-items:flex-end}
.portfolio-heading h2{margin-top:1.6rem}
.portfolio-description{max-width:300px;font-size:1rem;line-height:1.75;color:var(--muted);padding-bottom:.1rem}
.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2.8rem}
.project{min-width:0}
.project-image{background:#f7f8f6;border:1px solid #e8ece6;overflow:hidden}
.project-image>img{aspect-ratio:1.28;object-fit:contain;mix-blend-mode:multiply;transition:transform .6s ease}
.project:hover .project-image>img{transform:scale(1.025)}
.project>figcaption{padding-top:1.15rem;display:flex;justify-content:space-between;gap:1.25rem;align-items:flex-end}
.project-number{font-size:.75rem;letter-spacing:.08em;color:var(--muted)}
.project h3{font-size:1.05rem;letter-spacing:-.03em;font-weight:500;margin-top:.2rem}
.project-type{font-size:.8125rem;color:var(--muted);text-align:right;max-width:150px;line-height:1.5}
.portfolio-note{margin-top:2rem;font-size:.875rem;color:var(--muted);max-width:760px;line-height:1.7}
.contact-section{background:var(--ink);color:#f8faf6;scroll-margin-top:4rem}
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:5rem;padding-block:4.7rem 5rem}
.contact-section .section-index{color:#a1b0a3}
.contact-section .section-index>span{color:#ebf0ea}
.contact-copy>h2{margin-top:1.8rem;font-size:clamp(2.2rem,3.55vw,3.8rem)}
.contact-copy>p:last-child{max-width:430px;font-size:1rem;color:#bcc7bc;line-height:1.8;margin-top:1.5rem}
.contact-details{padding-top:2.8rem;max-width:390px;width:100%;justify-self:end}
.contact-status{font-size:.875rem;color:#c5cec3;padding-bottom:1rem;border-bottom:1px solid #536054}
.contact-details dl{margin:0}
.contact-details dl>div{padding-top:1.4rem}
.contact-details dt{font-size:.9375rem;color:#f7f9f5}
.contact-details dd{font-size:1rem;line-height:1.65;color:#bcc7bc;margin:.3rem 0 0}
.contact-details dd a{text-decoration:underline;text-underline-offset:.2em;overflow-wrap:anywhere}
.contact-details dd a:hover{color:#f2a58c}
.site-footer{padding-block:1.5rem 1.8rem;border-top:1px solid #495349;display:flex;justify-content:space-between;gap:1.5rem;align-items:center}
.footer-brand{font-size:1rem;font-weight:600;letter-spacing:-.035em;white-space:nowrap}
.footer-brand>span{color:#ed8e73}
.site-footer>p{font-size:.8125rem;color:#bdc6bb}
.back-top{font-size:.875rem;display:flex;gap:1.3rem;align-items:center;color:#e1e8dd}
.back-top:hover{color:#f2a58c}
@media(min-width:1600px){.hero{gap:4.5rem}}
@media(max-width:1100px){.shell{width:calc(100% - 4rem)}.hero{gap:1.5rem;min-height:620px;padding-block:4rem}.main-nav{gap:1.75rem}h1{font-size:clamp(2.65rem,4.7vw,4.1rem)}.hero-description{font-size:1rem}.eyebrow{font-size:.8125rem}.service-steps{gap:1.7rem}.project>figcaption{display:block}.project-type{display:block;text-align:left;max-width:none;margin-top:.25rem}.contact-grid{gap:3rem}}
@media(max-width:780px){.shell{width:calc(100% - 3rem)}.header-inner{min-height:84px;gap:1rem}.brand{font-size:1rem;gap:.55rem}.brand-icon{width:28px}.main-nav{gap:1.3rem;font-size:.875rem}.main-nav .nav-contact{gap:.6rem}.hero{grid-template-columns:1fr;padding-block:3rem 3.5rem;gap:2.5rem}.hero-copy{max-width:620px}h1{font-size:clamp(2.8rem,7.5vw,4.4rem)}.hero-description{max-width:490px;font-size:1.0625rem}.hero-note{max-width:440px}.hero-visual{padding-top:0}.hero-visual>img{aspect-ratio:1.6}.service-section{padding-block:3.5rem}.section-intro{grid-template-columns:1fr;gap:1.7rem}.service-steps{gap:1.5rem;margin-top:2.8rem}.service-step>h3{font-size:1rem}.portfolio-section{padding-block:3.8rem}.portfolio-heading{display:block}.portfolio-description{max-width:460px;margin-top:1.2rem}.portfolio-grid{gap:1.3rem;margin-top:2rem}.contact-grid{grid-template-columns:1.25fr 1fr;gap:2rem;padding-block:3.5rem}.contact-details{padding-top:3rem}.site-footer{flex-wrap:wrap}.site-footer>p{order:3;width:100%}.contact-copy>h2{font-size:2.6rem}}
@media(max-width:560px){html{scroll-padding-top:8rem}.shell{width:calc(100% - 2.5rem)}.header-inner{flex-wrap:wrap;min-height:0;padding-block:1rem .7rem;gap:.9rem}.brand{font-size:1.05rem}.brand-icon{width:27px;height:29px}.main-nav{width:100%;justify-content:space-between;gap:1rem;font-size:.875rem}.main-nav>a{padding:.3rem 0}.main-nav .nav-contact{border-bottom:0}.hero{padding-top:2.4rem;gap:2.2rem}.eyebrow{font-size:.8125rem;margin-bottom:1.5rem;gap:.5rem;max-width:300px}.small-rule{flex-basis:15px}h1{font-size:clamp(2.35rem,9.4vw,3.3rem)}.hero-description{margin-top:1.35rem;font-size:1rem;line-height:1.75}.button{margin-top:1.5rem}.hero-note{font-size:.875rem;max-width:320px}.image-label{font-size:.8125rem}.hero-visual>img{aspect-ratio:1.2}.hero-visual>figcaption{font-size:.8125rem;gap:.6rem}.concept-label{font-size:.75rem}.service-section,.portfolio-section{scroll-margin-top:6rem}.service-steps{grid-template-columns:1fr;gap:1.65rem;margin-top:2.4rem}.service-step{display:grid;grid-template-columns:2rem 1fr;column-gap:1rem;padding-top:1.3rem}.step-number{grid-column:1;grid-row:1 / 3;font-size:1.35rem;line-height:1.5}.service-step>h3{grid-column:2;margin-top:0;font-size:1.05rem}.service-step>p{grid-column:2;font-size:1rem;margin-top:.5rem}h2{font-size:2.4rem}.section-description{font-size:1rem;line-height:1.8}.portfolio-grid{grid-template-columns:1fr;gap:2rem}.project-image>img{aspect-ratio:1.2}.project>figcaption{display:flex}.project-type{font-size:.75rem;text-align:right;max-width:120px;margin-top:0}.project h3{font-size:1rem}.portfolio-note{font-size:.875rem}.contact-grid{grid-template-columns:1fr;gap:2rem;padding-block:3rem}.contact-details{max-width:none;justify-self:start;padding-top:0}.contact-copy>h2{font-size:2.4rem}.site-footer{padding-block:1.3rem 1.6rem;gap:.9rem}.site-footer>p{font-size:.8125rem}.back-top{font-size:.8125rem;gap:.6rem}.footer-brand{font-size:.9375rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.project:hover .project-image>img{transform:none}}

h1,h2,h3{overflow-wrap:break-word}.main-nav{flex-wrap:wrap}
