@font-face{font-family:Anton;src:url("assets/anton.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DM Sans";src:url("assets/dm-sans.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DM Sans";src:url("assets/dm-sans-semibold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}

:root{
  --paper:#f7f8f4;
  --ink:#171b17;
  --muted:#60675f;
  --sage:#71998b;
  --sage-light:#d8e3da;
  --line:rgba(33,47,37,.23);
  --copper:#a74730;
  font-family:"DM Sans",sans-serif;
  font-synthesis:none;
  color:var(--ink);
  background:var(--paper);
  text-rendering:optimizeLegibility;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;line-height:1.5}
body,p,h1,h2,h3{margin-block-start:0}
h1,h2,h3,p{margin-block-end:0}
a{color:inherit;text-decoration:none}
button,summary,a{-webkit-tap-highlight-color:transparent}
a,summary{touch-action:manipulation}
a:focus-visible,summary:focus-visible{outline:2px solid var(--copper);outline-offset:6px}
::selection{background:#bccfc0;color:var(--ink)}
.svg-library{position:absolute;width:0;height:0;overflow:hidden}
.frame{width:min(1240px,calc(100% - 112px));margin-inline:auto;border-inline:1px solid var(--line)}
.arrow{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.skip-link{position:absolute;z-index:50;top:12px;left:12px;padding:12px 18px;background:var(--paper);transform:translateY(-170%)}
.skip-link:focus{transform:translateY(0)}
.hero-shell{background:linear-gradient(180deg,#507464 0%,#6e9382 40%,#e9eee6 70%,var(--paper) 85%)}
.site-header{border-bottom:1px solid rgba(247,248,244,.21);background:#507464;color:var(--paper)}
.header-inner{height:88px;padding-inline:32px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.brand{display:flex;gap:11px;align-items:center;font-size:23px;line-height:.98;font-weight:600;letter-spacing:-.06em}
.brand-symbol{width:36px;height:36px;fill:currentColor}
.brand-sub{display:block;margin-top:5px;font-size:9px;letter-spacing:.13em}
.desktop-nav{display:flex;gap:34px;margin-left:auto;margin-right:30px}
.desktop-nav a{font-size:12px;position:relative;padding-block:10px}
.desktop-nav a:after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s}
.desktop-nav a:hover:after{transform:scaleX(1)}
.header-contact{display:flex;gap:30px;align-items:center;border:1px solid rgba(255,255,255,.65);border-radius:30px;padding:10px 18px;font-size:12px;transition:background .2s,color .2s}
.header-contact:hover{background:var(--paper);color:var(--ink)}
.header-contact .arrow{width:15px;height:15px}
.mobile-menu{display:none}
.hero{position:relative;padding:31px 32px 0}
.hero-heading{position:relative;z-index:2}
.hero h1{font-family:Anton,"Impact",sans-serif;font-size:clamp(80px,13.4vw,187px);font-weight:400;line-height:1.13;letter-spacing:-.026em;color:var(--paper);text-align:center;white-space:nowrap}
.hero-stage{height:342px;position:relative;perspective:1100px}
.hero-side-note{position:absolute;top:7px;left:1px;display:flex;gap:14px;align-items:flex-start;color:var(--ink)}
.hero-side-note p{font-size:10px;line-height:1.65;letter-spacing:.025em}
.small-cross{font-size:24px;line-height:.8;font-weight:400}
.artwork-wrap{position:absolute;top:-12px;left:50%;width:270px;height:350px;transform:translateX(-50%)}
.artwork{height:100%;width:100%;position:relative;overflow:hidden;border-radius:150px;transform:rotate(-6deg);box-shadow:0 20px 40px -30px rgba(18,35,25,.35);transition:transform .6s cubic-bezier(.2,.7,.2,1);will-change:transform}
.artwork img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.015)}
.artwork-shine{position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.18),transparent 42%,rgba(5,16,7,.06));opacity:.45}
.artwork-index{position:absolute;right:-33px;bottom:43px;font-size:9px;letter-spacing:.12em;writing-mode:vertical-rl}
.hero-serif{position:absolute;top:3px;left:calc(50% + 160px);font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(44px,5.4vw,76px);line-height:1.08;letter-spacing:-.065em;color:var(--paper);white-space:nowrap}
.stage-cross{position:absolute;right:0;bottom:34px;font-size:24px;color:#5a7461}
.hero-intro{text-align:center;position:relative;max-width:440px;margin:25px auto 0}
.hero-intro>p:first-child{font-size:17px;line-height:1.5}
.hero-description{font-size:12px;line-height:1.65;color:var(--muted);margin-top:12px}
.button{min-height:47px;display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:13px 21px;border-radius:30px;font-size:10px;letter-spacing:.03em;font-weight:600;transition:background .2s,transform .2s}
.button-dark{background:var(--ink);color:var(--paper)}
.button-dark:hover{background:#354f40;transform:translateY(-2px)}
.button .arrow{width:16px;height:16px}
.hero-intro .button{margin-top:22px}
.hero-baseline{display:flex;align-items:center;justify-content:space-between;margin-top:43px;padding:21px 0;font-size:9px;letter-spacing:.055em}
.scroll-link{display:flex;gap:24px;align-items:center}
.scroll-link span{font-size:19px;line-height:1}
.page-body{background:var(--paper)}
.services{display:grid;grid-template-columns:30% 70%;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-aside{padding:32px;position:relative;border-right:1px solid var(--line)}
.section-index{display:flex;gap:9px;align-items:center;font-size:9px;letter-spacing:.07em;font-weight:600;line-height:1.4}
.status-dot{display:inline-block;flex-shrink:0;width:5px;height:5px;border-radius:50%;background:currentColor}
.display{font-family:Anton,"Impact",sans-serif;font-weight:400;font-size:clamp(58px,6.1vw,86px);line-height:1.05;letter-spacing:-.025em}
.section-aside h2{margin-top:39px}
.period{color:var(--copper)}
.aside-copy{margin-top:32px;font-size:14px;line-height:1.7;color:var(--muted)}
.aside-spark{width:88px;height:88px;fill:var(--ink);margin-top:80px}
.service{border-bottom:1px solid var(--line);transition:background .25s}
.service:last-child{border-bottom:0}
.service summary{min-height:120px;padding:29px 31px;display:flex;align-items:center;gap:20px;cursor:pointer;list-style:none}
.service summary::-webkit-details-marker{display:none}
.service-number{align-self:flex-start;min-width:18px;padding-top:9px;font-size:10px;color:var(--muted)}
.service h3{font-family:Anton,"Impact",sans-serif;font-weight:400;font-size:clamp(29px,3.7vw,51px);line-height:1.12;letter-spacing:-.025em}
.service-toggle{margin-left:auto;flex:0 0 31px;width:31px;height:31px;border:1px solid var(--line);border-radius:50%;position:relative;transition:transform .3s,background .3s}
.service-toggle:before,.service-toggle:after{content:"";position:absolute;left:9px;right:9px;top:14px;height:1px;background:var(--ink)}
.service-toggle:after{transform:rotate(90deg);transition:transform .25s}
.service[open]{background:#eef2eb}
.service[open] .service-toggle{background:var(--ink);border-color:var(--ink)}
.service[open] .service-toggle:before{background:var(--paper)}
.service[open] .service-toggle:after{transform:rotate(0deg);background:var(--paper)}
.service-content{padding:0 32px 30px 70px}
.service-content>p{max-width:520px;font-size:15px;line-height:1.7;color:#4c554d}
.service-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:27px}
.service-bottom>span{font-size:10px;letter-spacing:.04em;line-height:1.7}
.service-bottom a{display:grid;place-items:center;min-width:44px;height:44px;border-radius:50%;border:1px solid var(--line)}
.service-bottom a:hover{background:var(--sage-light)}
@media(hover:hover){.service:not([open]):hover{background:#e7eee4}.service:not([open]):hover .service-toggle{transform:rotate(90deg)}}
.about{display:grid;grid-template-columns:1.14fr 1fr;border-bottom:1px solid var(--line);padding:92px 32px;gap:80px}
.about h2{margin-top:38px;font-size:clamp(52px,5.6vw,78px);white-space:nowrap}
.serif-word{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-style:italic;font-size:1.18em;letter-spacing:-.075em;text-transform:none}
.about-intro{margin-top:32px;font-size:18px;letter-spacing:-.03em}
.body-copy{font-size:14px;line-height:1.8;color:var(--muted);max-width:400px;margin-top:14px}
.text-link{display:inline-flex;gap:35px;align-items:center;font-size:9px;font-weight:600;letter-spacing:.05em;border-bottom:1px solid var(--ink);padding-bottom:8px;margin-top:28px}
.text-link .arrow{width:17px;height:17px;transition:transform .2s}
.text-link:hover .arrow{transform:translate(3px,-3px)}
.thinking-panel{position:relative;padding:28px;background:#d2dfd4;display:flex;flex-direction:column;justify-content:space-between;transform:rotate(2deg);min-height:450px}
.thinking-topline{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.09em}
.thinking-topline svg{width:37px;height:37px;fill:var(--ink)}
.thinking-quote{font-family:Georgia,"Times New Roman",serif;font-size:clamp(42px,4.7vw,65px);line-height:.99;letter-spacing:-.06em;padding-block:26px}
.thinking-quote em{color:#4a6857;font-weight:400}
.thinking-caption{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:15px;font-size:8px;letter-spacing:.055em}
.thinking-caption span:last-child{font-size:19px;line-height:1}
.process{border-bottom:1px solid var(--line)}
.process-heading{padding:63px 32px 48px;display:grid;grid-template-columns:1fr auto;align-items:end;gap:24px}
.process-heading .section-index{grid-column:1/-1;margin-bottom:8px}
.process-heading h2{font-size:clamp(52px,5.7vw,79px)}
.process-heading>p:last-child{font-size:13px;line-height:1.7;margin:0 22px 5px 0;color:var(--muted)}
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.process-step{padding:28px 32px 32px;border-right:1px solid var(--line)}
.process-step:last-child{border-right:0}
.step-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:42px}
.step-number{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:46px;letter-spacing:-.08em;line-height:1}
.step-top .arrow{width:20px;height:20px;color:#6e7b6f}
.process-step h3{font-family:Anton,"Impact",sans-serif;font-weight:400;letter-spacing:-.02em;font-size:27px}
.process-step p{font-size:14px;line-height:1.8;color:var(--muted);max-width:290px;margin-top:14px}
.step-label{display:block;font-size:8px;letter-spacing:.07em;margin-top:30px}
.contact{padding:37px 32px 34px;background:linear-gradient(130deg,#d5e0d2,#bbcebc)}
.contact-top{display:flex;justify-content:space-between;align-items:flex-start;gap:25px}
.contact-note{font-size:8px;line-height:1.7;letter-spacing:.03em}
.contact h2{position:relative;margin:50px 0 34px;font-size:clamp(85px,11vw,153px);line-height:1.06;letter-spacing:-.035em}
.contact-serif{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:1.19em;font-weight:400;letter-spacing:-.09em}
.contact-arrow{position:absolute;right:32px;top:28px;width:180px;height:180px;stroke:currentColor;fill:none;stroke-width:.7}
.contact-bottom{display:flex;justify-content:space-between;align-items:end;gap:25px;border-top:1px solid var(--line);padding-top:24px}
.contact-bottom>p{font-size:13px;line-height:1.6}
.contact-identity{display:flex;flex-direction:column;gap:5px;text-align:right}
.contact-identity span:first-child{font-size:9px;letter-spacing:.06em;font-weight:600}
.contact-identity span:last-child{font-family:Georgia,"Times New Roman",serif;font-size:26px;letter-spacing:-.035em}
.site-footer{padding:38px 32px 0}
.footer-top{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-bottom:35px}
.footer-top p{font-size:12px;line-height:1.6;color:var(--muted)}
.back-to-top{display:flex;align-items:center;gap:20px;font-size:9px;letter-spacing:.04em}
.back-to-top span{font-size:20px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding:19px 0;border-top:1px solid var(--line);font-size:8px;letter-spacing:.04em;color:var(--muted)}

@media(prefers-reduced-motion:no-preference){
  .hero-heading{animation:enter .8s cubic-bezier(.2,.65,.3,1) both}
  .artwork-wrap{animation:art-enter 1s cubic-bezier(.2,.65,.3,1) both}
  .hero-intro{animation:enter .8s .12s cubic-bezier(.2,.65,.3,1) both}
  @keyframes enter{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
  @keyframes art-enter{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
}
@media(min-width:1600px){.hero h1{font-size:187px}}
@media(max-width:1100px){
  .frame{width:calc(100% - 64px)}
  .header-inner{padding-inline:24px}
  .desktop-nav{gap:24px;margin-right:0}
  .hero{padding-inline:24px}
  .hero h1{font-size:13.3vw}
  .hero-serif{left:calc(50% + 135px);font-size:5.5vw}
  .artwork-wrap{width:245px;height:330px}
  .hero-stage{height:325px}
  .hero-side-note{top:12px;max-width:180px;gap:8px}
  .hero-side-note p{font-size:8px}
  .section-aside{padding:26px 22px}
  .section-aside .display{font-size:6.8vw}
  .service summary{padding:27px 24px;gap:13px;min-height:110px}
  .service h3{font-size:3.7vw}
  .service-content{padding-left:55px;padding-right:24px}
  .about{gap:40px;padding:72px 24px}
  .thinking-panel{padding:24px;min-height:400px}
  .process-step{padding-inline:24px}
  .process-step h3{font-size:24px}
  .contact-arrow{width:145px;height:145px}
}
@media(max-width:760px){
  html{scroll-padding-top:16px}
  .frame{width:calc(100% - 32px)}
  .header-inner{height:75px;padding-inline:18px}
  .brand{font-size:21px;gap:9px}
  .brand-sub{font-size:8px}
  .brand-symbol{width:32px;height:32px}
  .desktop-nav,.header-contact{display:none}
  .mobile-menu{display:block;position:relative;z-index:10}
  .mobile-menu summary{display:flex;align-items:center;gap:14px;list-style:none;font-size:12px;cursor:pointer;min-height:44px;padding:8px 0 8px 10px}
  .mobile-menu summary::-webkit-details-marker{display:none}
  .menu-lines{position:relative;width:19px;height:13px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
  .menu-lines:after{content:"";position:absolute;left:0;right:0;top:5px;border-top:1px solid currentColor}
  .mobile-menu[open] .menu-lines{border-bottom-color:transparent;transform:translateY(5px) rotate(45deg)}
  .mobile-menu[open] .menu-lines:after{top:-1px;transform:rotate(90deg)}
  .mobile-menu nav{position:absolute;right:-18px;top:57px;width:min(325px,calc(100vw - 34px));color:var(--ink);background:var(--paper);border:1px solid var(--line);padding:12px 22px;box-shadow:0 16px 25px rgba(26,42,28,.12)}
  .mobile-menu nav a{display:flex;justify-content:space-between;align-items:center;gap:25px;min-height:57px;border-bottom:1px solid var(--line);font-size:15px}
  .mobile-menu nav a:last-child{border-bottom:0}
  .mobile-menu nav a span{font-size:10px;color:var(--muted)}
  .hero{padding:30px 17px 0}
  .hero h1{font-size:13.8vw;letter-spacing:-.035em}
  .hero-stage{height:328px;margin-top:19px}
  .hero-side-note{top:0;left:1px;gap:6px;max-width:110px}
  .hero-side-note p{font-size:8px;line-height:1.6}
  .small-cross{font-size:16px}
  .hero-serif{top:12px;left:auto;right:0;font-size:clamp(30px,6.2vw,45px);z-index:2}
  .artwork-wrap{top:47px;width:205px;height:272px}
  .artwork-index{right:-24px;bottom:25px;font-size:8px}
  .stage-cross{bottom:32px;font-size:20px}
  .hero-intro{margin-top:22px;max-width:300px}
  .hero-intro>p:first-child{font-size:15px}
  .hero-description{font-size:13px;margin-top:10px}
  .hero-intro .button{margin-top:20px}
  .hero-baseline{margin-top:34px;padding-block:18px;font-size:7px;gap:15px}
  .hero-baseline>span{max-width:120px;line-height:1.6}
  .scroll-link{gap:14px;font-size:7px}
  .services{grid-template-columns:1fr}
  .section-aside{border-right:0;border-bottom:1px solid var(--line);padding:27px 20px 30px;display:grid;grid-template-columns:1fr auto;gap:24px 16px}
  .section-index{font-size:8px}
  .section-aside .section-index{grid-column:1/-1}
  .section-aside .display{font-size:clamp(57px,11.5vw,79px);margin-top:0}
  .section-aside .aside-copy{grid-column:1/-1;margin:0;font-size:13px}
  .aside-spark{width:54px;height:54px;margin:16px 0 0;grid-column:2;grid-row:2}
  .service summary{min-height:100px;padding:23px 19px;gap:12px}
  .service-number{font-size:8px;min-width:14px;padding-top:7px}
  .service h3{font-size:clamp(25px,6.7vw,43px);letter-spacing:-.025em}
  .service-toggle{width:28px;height:28px;flex-basis:28px}
  .service-toggle:before,.service-toggle:after{left:8px;right:8px;top:12.5px}
  .service-content{padding:0 20px 24px 45px}
  .service-content>p{font-size:14px}
  .service-bottom{margin-top:20px;gap:12px}
  .service-bottom>span{font-size:9px;max-width:210px}
  .about{grid-template-columns:1fr;padding:44px 20px 46px;gap:38px}
  .about h2{font-size:clamp(47px,10.7vw,78px);margin-top:26px}
  .about-intro{font-size:16px;margin-top:26px}
  .body-copy{font-size:14px}
  .thinking-panel{width:calc(100% - 12px);justify-self:center;min-height:377px;padding:24px}
  .thinking-quote{font-size:58px}
  .process-heading{padding:36px 20px 30px;grid-template-columns:1fr;gap:22px}
  .process-heading .section-index{margin-bottom:4px}
  .process-heading h2{font-size:clamp(45px,10.5vw,74px)}
  .process-heading>p:last-child{font-size:12px}
  .process-grid{grid-template-columns:1fr}
  .process-step{padding:26px 20px 28px;border-right:0;border-bottom:1px solid var(--line)}
  .process-step:last-child{border-bottom:0}
  .step-top{margin-bottom:25px}
  .step-number{font-size:43px}
  .process-step h3{font-size:27px}
  .process-step p{max-width:100%;font-size:14px}
  .step-label{margin-top:23px}
  .contact{padding:27px 20px}
  .contact-top{display:block}
  .contact-note{display:block;margin-top:19px;font-size:7px}
  .contact h2{font-size:clamp(64px,15.7vw,105px);margin-top:34px;margin-bottom:26px}
  .contact-arrow{width:65px;height:65px;right:0;top:83px;stroke-width:1}
  .contact-bottom{align-items:flex-start;flex-direction:column;gap:24px}
  .contact-bottom>p{font-size:12px}
  .contact-identity{text-align:left}
  .contact-identity span:last-child{font-size:25px}
  .site-footer{padding:30px 20px 0}
  .footer-top{display:grid;grid-template-columns:1fr auto;gap:24px;padding-bottom:25px}
  .footer-top p{font-size:11px;grid-row:2}
  .back-to-top{grid-column:2;grid-row:1;font-size:7px;gap:10px}
  .footer-bottom{font-size:7px;flex-wrap:wrap;gap:10px 20px}
  .footer-bottom span:last-child{width:100%}
}
@media(max-width:370px){
  .hero h1{font-size:13.3vw}
  .service summary{padding-inline:15px;gap:9px}
  .service h3{font-size:6.3vw}
  .service-content{padding-left:38px}
  .hero-serif{font-size:29px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .artwork{transform:rotate(-6deg)!important;will-change:auto}
}
