@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800;900&display=swap");
:root{--ivory:#f4f0e6;--paper:#faf8f2;--forest:#18392f;--deep:#102b24;--olive:#879171;--sand:#d9c7a6;--charcoal:#252722;--line:rgba(37,39,34,.18);--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--charcoal);font-family:var(--sans);font-size:16px;line-height:1.6}body.modal-open{overflow:hidden}button,input,textarea,select{font:inherit}button,a{color:inherit}a{text-decoration:none}button{cursor:pointer}::selection{background:var(--olive);color:white}[hidden]{display:none!important}.skip{position:fixed;top:8px;left:8px;transform:translateY(-150%);z-index:200;background:white;padding:10px 16px}.skip:focus{transform:none}
.site-header{height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5vw,80px);border-bottom:1px solid var(--line);position:relative;z-index:20}.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:12px;line-height:1.05;letter-spacing:.18em}.brand small{font-size:8px;font-weight:500}.brand-mark{width:36px;height:36px;flex:0 0 36px;border:1px solid currentColor;border-radius:50%;display:block;position:relative;font-family:var(--serif);font-weight:400;line-height:1;letter-spacing:0}.monogram-s,.monogram-j{position:absolute;display:block}.monogram-s{font-size:11.5px;left:20.5px;top:6.5px;z-index:2}.monogram-j{font-size:22.5px;left:11.5px;top:5.5px;font-style:italic;z-index:1}.site-header nav{display:flex;align-items:center;gap:36px;font-size:12px;letter-spacing:.08em}.site-header nav a:not(.nav-cta){position:relative}.site-header nav a:not(.nav-cta):after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:.3s}.site-header nav a:hover:after,.site-header nav a:focus-visible:after{transform:scaleX(1);transform-origin:left}.nav-cta{border:1px solid var(--forest);padding:12px 18px;display:flex;gap:22px}.menu-button{display:none;background:none;border:0;text-transform:uppercase;letter-spacing:.1em;font-size:11px}
.hero{min-height:calc(100vh - 96px);display:grid;grid-template-columns:1.05fr .95fr;border-bottom:1px solid var(--line)}.hero-copy{padding:clamp(70px,9vw,140px) clamp(28px,6vw,96px);display:flex;flex-direction:column;justify-content:center}.eyebrow{text-transform:uppercase;letter-spacing:.19em;font-size:10px;font-weight:700;margin:0 0 28px}.eyebrow:before{content:"";display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin-right:12px}.eyebrow.light{color:#c9d4c7}h1,h2,h3,p{margin-top:0}h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.045em;line-height:.98}h1{font-size:clamp(52px,6.4vw,104px);max-width:900px;margin-bottom:36px}h1 em,h2 em{color:var(--olive);font-weight:400}.lede{font-family:var(--serif);font-size:clamp(18px,1.6vw,23px);line-height:1.5;max-width:600px;color:#4d5049}.actions{display:flex;align-items:center;gap:34px;margin-top:20px}.button{border:0;padding:16px 20px;display:inline-flex;gap:45px;align-items:center;justify-content:space-between;font-size:11px;text-transform:uppercase;letter-spacing:.11em;transition:transform .25s,background .25s}.button:hover{transform:translateY(-3px)}.button.dark{background:var(--forest);color:white}.button.sand{background:var(--sand);color:var(--deep)}.text-link{font-size:11px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid;padding:4px 0;display:flex;gap:22px}
.hero-stage{background:var(--forest);color:#eef0e8;position:relative;overflow:hidden;min-height:640px}.stage-note,.stage-caption{position:absolute;left:8%;right:8%;display:flex;justify-content:space-between;z-index:6;text-transform:uppercase;letter-spacing:.14em;font-size:9px}.stage-note{top:7%}.stage-note b{font-weight:400}.stage-caption{bottom:5%}.screen-stack{position:absolute;width:80%;aspect-ratio:16/10;left:10%;top:50%;transform:translateY(-50%);perspective:1000px}.hero-screen{position:absolute;width:88%;height:auto;aspect-ratio:16/10;left:6%;top:10%;filter:drop-shadow(0 22px 40px rgba(0,0,0,.25));animation:screenCycle 16s infinite}.screen-1{animation-delay:0s}.screen-2{animation-delay:-12s}.screen-3{animation-delay:-8s}.screen-4{animation-delay:-4s}@keyframes screenCycle{0%,20%{opacity:1;transform:translate(0) rotate(-1deg);z-index:4}25%,45%{opacity:.75;transform:translate(9%,-5%) rotate(3deg);z-index:3}50%,70%{opacity:.45;transform:translate(-10%,4%) rotate(-4deg);z-index:2}75%,95%{opacity:0;transform:translate(0,18%) scale(.92);z-index:1}100%{opacity:1}}.intro-band{display:grid;grid-template-columns:repeat(3,1fr);padding:50px clamp(24px,6vw,96px);border-bottom:1px solid var(--line);text-align:center;font-family:var(--serif);font-style:italic;font-size:18px}.intro-band p{margin:0;border-right:1px solid var(--line)}.intro-band p:last-child{border:0}
.section{padding:clamp(72px,8vw,128px) clamp(24px,6vw,96px)}.section-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:12%;align-items:end;margin-bottom:56px}.section-heading h2,.center-heading h2,.contact h2,.faq h2{font-size:clamp(48px,6vw,88px);margin:0}.section-heading>p{max-width:440px;color:#62655d}.work{background:var(--paper)}.concept-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px 28px}.concept-card{border:0;background:transparent;text-align:left;padding:0}.concept-card:nth-child(even){margin-top:80px}.concept-top{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:13px 0;text-transform:uppercase;letter-spacing:.15em;font-size:9px}.concept-card .mock-site{transition:transform .5s cubic-bezier(.2,.8,.2,1)}.concept-card:hover .mock-site{transform:translateY(-7px)}.concept-bottom{display:flex;justify-content:space-between;align-items:center;padding:20px 0}.concept-bottom small{font-size:9px;text-transform:uppercase;letter-spacing:.14em}.concept-bottom h3{font-family:var(--serif);font-size:31px;font-weight:400;margin:2px 0}.circle-arrow{border:1px solid var(--line);width:47px;height:47px;border-radius:50%;display:grid;place-items:center;transition:.3s}.concept-card:hover .circle-arrow{background:var(--forest);color:white}
.project-device-preview{--device-edge:clamp(20px,3.2vw,38px);--device-bottom:clamp(40px,4vw,56px);overflow:hidden;background:var(--forest);padding:var(--device-edge);transition:transform .5s cubic-bezier(.2,.8,.2,1)}.concept-card:hover .project-device-preview{transform:translateY(-7px)}.project-device-preview .live-mockups{padding-bottom:var(--device-bottom);transform:scale(.96);transform-origin:center}.project-device-preview .desktop-preview{width:89%;margin-left:0}.project-device-preview .mobile-preview{right:calc(var(--device-edge) * -1);bottom:calc(var(--device-bottom) + 6px);box-shadow:0 18px 38px rgba(0,0,0,.28)}.project-device-preview .desktop-preview img,.project-device-preview .mobile-preview img{height:auto;object-fit:contain;aspect-ratio:auto}.project-details{align-items:flex-start}.project-details>div{max-width:620px}.project-details p{max-width:560px;margin:9px 0 0;color:#62655d;font-size:13px}.project-details .project-type{margin-top:2px;color:#7a7d74;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.project-link{display:inline-block;margin-top:17px;border-bottom:1px solid;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.future-project-preview{display:grid;place-items:center;background:#e8e4da;color:#777970}.future-project-preview:before,.future-project-preview:after{content:"";position:absolute;background:rgba(37,39,34,.15)}.future-project-preview:before{width:1px;height:28%}.future-project-preview:after{width:18%;height:1px}.future-project-preview>span{position:relative;z-index:1;background:#e8e4da;padding:12px 18px;font-family:var(--serif);font-size:clamp(17px,2vw,28px);font-style:italic}.projects-footer{display:flex;justify-content:center;margin-top:60px}.projects-footer .button{min-width:190px}
.mock-site{aspect-ratio:16/10;background:#ddd;overflow:hidden;padding:4%;color:#27352c;position:relative}.mock-site.compact{height:100%;aspect-ratio:auto}.mock-nav{display:flex;justify-content:space-between;align-items:center;font-size:clamp(5px,.55vw,9px);letter-spacing:.13em}.mock-nav b{font-size:1.2em}.mock-body{padding:10% 7%;height:90%;position:relative}.mock-body small{font-size:clamp(5px,.5vw,8px);text-transform:uppercase;letter-spacing:.15em;display:block}.mock-body strong{font-family:var(--serif);font-size:clamp(20px,3vw,54px);font-weight:400;line-height:1;max-width:60%;display:block;margin:4% 0}.mock-body i{font-family:var(--serif);font-size:clamp(7px,.7vw,11px);border-bottom:1px solid;font-style:normal}.mock-art{position:absolute;right:2%;bottom:0;width:42%;height:78%}.mock-art span{position:absolute;display:block}.mock-art span:first-child{width:68%;height:74%;border-radius:45% 45% 5% 5%;bottom:0;right:7%;background:rgba(255,255,255,.6)}.mock-art span:nth-child(2){width:42%;height:42%;border-radius:50%;top:8%;left:0;background:rgba(40,60,45,.25)}.mock-art span:last-child{width:25%;height:53%;border-left:2px solid rgba(40,60,45,.45);transform:rotate(-28deg);bottom:0;left:25%}.mock-sage{background:#cad3bc;color:#254538}.mock-clay{background:#c58b69;color:#3c241c}.mock-blue{background:#cbd9d5;color:#26413e}.mock-olive{background:#9da17c;color:#263328}.mock-clay .mock-art span:first-child{background:#e2c4ad;border-radius:50% 50% 15% 15%}.mock-blue .mock-art span:first-child{border-radius:50%;background:#f4eee4}.mock-olive .mock-art span:first-child{clip-path:polygon(20% 0,100% 10%,85% 100%,0 88%);border-radius:0;background:#d3c3a1}
.joasility-preview{padding:0}.joasility-preview img{display:block;width:100%;height:auto;object-fit:contain}
.center-heading{text-align:center;max-width:900px;margin:0 auto 70px}.center-heading>p:last-child{max-width:570px;margin:26px auto;color:#686b63}.package-grid{display:grid;grid-template-columns:repeat(3,1fr);align-items:start}.package-card{position:relative;padding:44px 34px;border:1px solid var(--line);min-height:720px;display:flex;flex-direction:column}.package-card.featured{background:var(--forest);color:#f6f3eb;transform:translateY(-18px);border-color:var(--forest)}.package-number{font-family:var(--serif);font-style:italic;color:var(--olive)}.package-card h3{font-family:var(--serif);font-size:45px;font-weight:400;margin:34px 0 12px}.package-card>p{font-size:14px;color:#65685f;min-height:70px}.package-card.featured>p{color:#c0c8c0}.package-card hr{width:100%;border:0;border-top:1px solid currentColor;opacity:.18;margin:24px 0}.package-card>small{font-size:8px;letter-spacing:.16em}.package-card ul{list-style:none;padding:20px 0;margin:0}.package-card li{padding:7px 0;font-size:13px}.package-card li::first-letter{color:var(--olive)}.package-card>a{margin-top:auto;border-top:1px solid currentColor;padding-top:20px;display:flex;justify-content:space-between;text-transform:none;letter-spacing:.12em;font-size:9px}.package-note{max-width:620px;margin:54px auto 0;text-align:center;font-size:12px;line-height:1.6;color:#71736d}
.live-mockups{min-width:0;position:relative;padding:0 0 72px}.desktop-preview,.mobile-preview{margin:0;overflow:hidden}.desktop-preview{width:80%;margin-left:auto;background:#eee7dc;border:1px solid rgba(255,255,255,.18);box-shadow:0 35px 70px rgba(0,0,0,.26)}.browser-bar{height:30px;background:#e7e0d3;display:flex;align-items:center;gap:5px;padding:0 12px;color:#526259}.browser-bar>span{width:6px;height:6px;border-radius:50%;background:#a8afa4}.browser-bar small{margin-left:auto;margin-right:auto;font-size:7px;letter-spacing:.08em}.desktop-preview img{width:100%;height:auto;display:block;aspect-ratio:16/10;object-fit:cover}.mobile-preview{position:absolute;z-index:2;width:25%;right:0;bottom:8px;background:#f4f0e6;border:5px solid #16261f;border-radius:24px;box-shadow:0 30px 60px rgba(0,0,0,.46);padding:13px 4px 5px}.mobile-preview img{display:block;width:100%;aspect-ratio:9/17;object-fit:cover;object-position:top;border-radius:13px}.phone-speaker{position:absolute;top:5px;left:50%;transform:translateX(-50%);width:24%;height:3px;background:#59665f;border-radius:4px}
.faq{background:var(--ivory)}.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:12%}.faq-layout>div:first-child>p:not(.eyebrow){color:#71736b}.faq-layout>div:first-child>a{font-size:11px;border-bottom:1px solid}.accordion{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:19px 0}summary{display:grid;grid-template-columns:45px 1fr 20px;align-items:center;cursor:pointer;list-style:none;font-family:var(--serif);font-size:20px}summary::-webkit-details-marker{display:none}summary span{font-family:var(--sans);font-size:9px}summary i{font-style:normal;font-family:var(--sans);transition:.3s}details[open] summary i{transform:rotate(45deg)}details>p{padding-left:45px;margin:12px 0 0;max-width:600px;color:#686b63;font-size:14px}
.contact{background:var(--forest);color:#f5f1e7;padding:clamp(72px,8vw,120px) clamp(24px,6vw,96px);display:grid;grid-template-columns:.85fr 1.15fr;gap:10%}.contact-intro>p:not(.eyebrow){color:#bdc7bf;max-width:500px}.contact-intro>a{display:inline-block;color:var(--sand);border-bottom:1px solid;margin:18px 0 56px;font-family:var(--serif);font-size:20px}.contact-intro small{display:block;color:#9faea2;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:24px 22px;align-content:start}.contact-form label{font-size:9px;text-transform:uppercase;letter-spacing:.14em}.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.35);color:white;padding:10px 0;outline:none;border-radius:0;text-transform:none;letter-spacing:0}.contact-form select option{color:#222}.contact-form textarea{resize:vertical}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--sand)}.contact-form .full{grid-column:1/-1}.contact-form .button{grid-column:1/-1;width:max-content;margin-top:8px}.form-status{grid-column:1/-1;font-size:12px;color:var(--sand);min-height:22px}
footer{background:#0d261f;color:#dce2da;padding:48px clamp(24px,6vw,96px) 25px}.footer-brand{display:flex;gap:20px;align-items:flex-start}.footer-brand b{font-family:var(--serif);font-size:25px;font-weight:400}.footer-brand p{font-size:11px;color:#9fada3;margin-top:8px}footer>nav{display:flex;justify-content:flex-end;gap:35px;font-size:10px;text-transform:uppercase;letter-spacing:.12em;margin-top:-50px}.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:22px;margin-top:56px;display:flex;justify-content:space-between;color:#86988d;font-size:8px;text-transform:uppercase;letter-spacing:.12em}
.modal-backdrop{position:fixed;inset:0;background:rgba(12,24,20,.76);z-index:100;display:grid;place-items:center;padding:3vw;animation:fade .25s}.concept-modal{background:var(--paper);width:min(1150px,100%);max-height:92vh;overflow:auto;display:grid;grid-template-columns:.7fr 1.3fr;position:relative}.modal-close{position:absolute;right:18px;top:15px;z-index:2;background:var(--paper);border:1px solid var(--line);padding:8px 12px;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.modal-copy{padding:clamp(35px,5vw,70px)}.modal-copy h2{font-size:clamp(48px,5vw,75px)}.modal-copy h3{font-family:var(--serif);font-size:24px;font-weight:400;color:var(--olive)}.modal-copy>p:not(.eyebrow){font-size:14px;color:#66695f}.modal-copy dl{margin:35px 0;font-size:11px}.modal-copy dl div{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;padding:9px 0}.modal-copy dt{text-transform:uppercase;letter-spacing:.1em;font-size:8px}.modal-copy dd{margin:0}.modal-copy>a{font-size:9px;text-transform:uppercase;letter-spacing:.12em;border-bottom:1px solid}.modal-visual{padding:8%;display:grid;place-items:center;background:#e5dfd2}.modal-visual .mock-site{width:100%;box-shadow:0 30px 50px rgba(0,0,0,.2)}@keyframes fade{from{opacity:0}}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s,transform .8s}.reveal.seen{opacity:1;transform:none}
@media(max-width:900px){.site-header{height:78px}.menu-button{display:block}.site-header nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--paper);padding:30px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}.site-header nav.open{display:flex}.hero{grid-template-columns:1fr}.hero-copy{min-height:630px}.hero-stage{min-height:650px}.section-heading{grid-template-columns:1fr;gap:25px}.concept-card:nth-child(even){margin-top:60px}.package-grid{grid-template-columns:1fr}.package-card{min-height:auto}.package-card.featured{transform:none}.live-mockups{padding-right:3%}.desktop-preview{width:92%}.mobile-preview{right:4%}.faq-layout,.contact{grid-template-columns:1fr;gap:70px}.concept-modal{grid-template-columns:1fr}.modal-visual{min-height:450px}.modal-copy{order:2}}
@media(max-width:620px){.hero-copy{padding-top:80px}.hero-stage{min-height:480px}.intro-band{grid-template-columns:1fr;gap:18px}.intro-band p{border-right:0;border-bottom:1px solid var(--line);padding-bottom:18px}.concept-grid{grid-template-columns:1fr}.concept-card:nth-child(even){margin-top:0}.package-card{padding:35px 25px}.live-mockups{padding:0 7% 58px 0}.desktop-preview{width:100%}.mobile-preview{width:31%;right:4%;bottom:16px;border-width:4px;border-radius:18px}.faq-layout{gap:50px}.contact-form{grid-template-columns:1fr}.contact-form .full,.contact-form .button,.form-status{grid-column:auto}.contact-intro>a{margin-bottom:40px}footer>nav{margin:35px 0;justify-content:flex-start;flex-wrap:wrap}.footer-bottom{margin-top:30px;flex-direction:column;gap:10px}.concept-modal{display:block}.modal-visual{min-height:300px}.actions{align-items:flex-start;flex-direction:column}.stage-caption{display:none}}
@media(min-width:901px){.project-device-preview .live-mockups{transform:translateX(-18px) scale(.96)}}
@media(min-width:901px){.packages{padding-top:clamp(64px,5.5vw,80px);padding-bottom:clamp(64px,5.5vw,80px)}.packages .center-heading{margin-bottom:48px}.package-card{min-height:660px;padding:36px 30px}.package-card h3{margin:28px 0 10px}.package-card>p{min-height:60px}.package-card hr{margin:18px 0}.package-card ul{padding:14px 0}.package-card li{padding:5px 0}.package-card>a{padding-top:16px}}
@media(min-width:901px){:root{--header-height:96px;--intro-band-height:clamp(84px,9svh,96px)}.hero{height:calc(96svh - var(--header-height) - var(--intro-band-height));min-height:0}.hero-copy,.hero-stage{min-height:0}.intro-band{height:var(--intro-band-height);padding:0 clamp(24px,6vw,96px);align-items:center}}
@media(min-width:901px) and (max-height:950px){.hero-copy{padding:clamp(34px,5svh,48px) clamp(38px,5vw,80px)}.hero-copy .eyebrow{margin-bottom:18px}.hero-copy h1{font-size:clamp(54px,5.25vw,78px);margin-bottom:22px}.hero-copy .lede{font-size:clamp(17px,1.45vw,21px);line-height:1.4}.hero-copy .actions{margin-top:12px}.screen-stack{width:78%;left:11%}.stage-note{top:5%}.stage-caption{bottom:4%}}
@media(max-width:900px){.project-device-preview .desktop-preview{width:90%}.project-device-preview .mobile-preview{right:-16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}
