@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=DM+Serif+Display:ital@0;1&family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap');*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f3f6f6;color:#344e68;font-family:"DM Sans",sans-serif}a{color:inherit;text-decoration:none}header{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:25px 6%;border-bottom:1px solid color-mix(in srgb,#344e68 30%,transparent)}.brand{display:inline-flex;align-items:center;gap:10px;font-family:"DM Serif Display",serif;font-size:22px;font-weight:700;letter-spacing:-.04em}.brand-icon{font-size:28px;color:#344e68}nav{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:700}.nav-link{border:1px solid currentColor;padding:12px 17px}.hero{display:grid;grid-template-columns:1.15fr .85fr;min-height:570px}.hero-main{padding:100px 9% 90px 10%}.eyebrow{font:11px 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase}.hero h1,.page h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:clamp(55px,6vw,95px);letter-spacing:-.055em;line-height:1.02;margin:30px 0}.hero-main p,.lead{font-size:19px;line-height:1.6;max-width:500px}.button{display:inline-flex;gap:45px;align-items:center;justify-content:space-between;background:#344e68;color:#f3f6f6;padding:18px 22px;margin-top:20px;font-weight:700;font-size:13px;border:0}.hero-art{background:#a9c8d9;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;min-height:350px}.art-inner{width:60%;aspect-ratio:1;display:grid;place-items:center;border:1px solid #344e68;border-radius:50% 0 50% 0;transform:rotate(8deg);font-family:"DM Serif Display",serif;font-size:clamp(90px,14vw,200px);letter-spacing:-.1em;color:#344e68}.art-inner:after{content:'';position:absolute;inset:12%;border:1px solid #344e68;border-radius:50% 0 50% 0}.art-caption{position:absolute;bottom:24px;right:25px;font:10px 'IBM Plex Mono';letter-spacing:.1em}.ribbon{background:#344e68;color:#f3f6f6;padding:18px 6%;font:11px 'IBM Plex Mono';letter-spacing:.15em}.about,.services,.closing{padding:105px 6%}.about{display:grid;grid-template-columns:1fr 2fr;gap:30px}.about h2,.services h2,.closing h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:clamp(45px,5vw,72px);letter-spacing:-.04em;line-height:1.05;margin:0 0 26px}.about p{font-size:18px;line-height:1.75;max-width:650px}.services{background:color-mix(in srgb,#a9c8d9 27%,#f3f6f6)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px}.section-head h2{margin-top:30px}.section-head p{max-width:260px;line-height:1.6}.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;margin-top:60px}.service{border-top:1px solid #344e68;padding:20px 0 25px}.number{font:11px 'IBM Plex Mono'}.service h3{font-family:"DM Serif Display",serif;font-size:25px;font-weight:400;line-height:1.2;margin:42px 0 15px}.service p{line-height:1.7;font-size:14px;max-width:400px}.closing{background:#a9c8d9}.closing h2{margin-top:50px}.closing p{font-size:18px}footer{padding:65px 6%;display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;align-items:start}footer p{font-size:13px;opacity:.75}.footer-nav{display:flex;gap:15px;flex-wrap:wrap;font-size:13px}.payments{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.pay-label{width:100%;font:10px 'IBM Plex Mono';letter-spacing:.12em}.paypal{width:90px;height:48px;object-fit:contain;mix-blend-mode:multiply}.cards{display:flex;gap:4px}.cards img{width:38px;height:26px;object-fit:contain}.pay-1{border:1px solid #344e68;padding:12px}.pay-1 .cards img{filter:grayscale(1)}.pay-2{display:grid;grid-template-columns:1fr auto}.pay-2 .pay-label{grid-column:1 / -1}.pay-2 .cards{display:grid;grid-template-columns:repeat(2,38px)}.pay-3{background:#a9c8d9;padding:12px;display:grid;grid-template-columns:auto auto}.pay-3 .pay-label{grid-column:1 / -1}.pay-3 .cards img{filter:grayscale(1)}.page{min-height:65vh;max-width:1000px;padding:100px 6% 130px}.page h1{max-width:900px}.page h2{font-family:"DM Serif Display",serif;font-size:32px;font-weight:400;margin:50px 0 15px}.page p{line-height:1.7;max-width:700px}.notice{padding:18px 22px;background:color-mix(in srgb,#a9c8d9 40%,#f3f6f6);border-left:3px solid #344e68}.under{text-decoration:underline}form label{display:block;font-weight:700;margin:24px 0 8px}input,textarea{width:100%;max-width:650px;border:1px solid #344e68;background:transparent;padding:15px;font:inherit}textarea{min-height:150px}button:disabled{opacity:.5}@media(max-width:700px){header{align-items:start}.brand{font-size:18px}nav{gap:14px;flex-wrap:wrap;justify-content:end}.nav-link{padding:8px}.hero{display:flex;flex-direction:column}.hero-main{padding:75px 6%}.hero-art{min-height:290px}.art-inner{width:200px}.about{display:block}.about .eyebrow{margin-bottom:40px}.about,.services,.closing{padding:75px 6%}.section-head{display:block}.services-grid{grid-template-columns:1fr 1fr;gap:20px}.service h3{margin-top:25px}footer{grid-template-columns:1fr}.page{padding:75px 6% 100px}}
.hero{grid-template-columns:.85fr 1.15fr}.hero-art{order:-1}.art-inner{width:55%}.ribbon{text-align:right}.services-grid{gap:50px}

.hero-art{background-image:radial-gradient(circle at center,transparent 30%,#344e6818 31%,transparent 32%)}.art-inner{border-radius:50%;border-style:dotted;border-width:4px}.about{background:#fff}.services-grid{gap:50px}.closing{border-radius:50px 50px 0 0}

/* Individual composition */
.art-inner span{font:500 clamp(13px,1.5vw,19px)/2 "IBM Plex Mono",monospace;letter-spacing:.12em;text-align:center}.art-inner{letter-spacing:0}.hero-art{isolation:isolate}.art-caption{font-size:9px}.paypal{object-fit:contain}.hero{display:block}.hero-main{text-align:center;width:100%;padding:110px 10%}.hero-main p{margin:auto}.hero-art{height:170px;min-height:0;order:0}.art-inner{width:auto;aspect-ratio:auto;border:0;transform:none}.art-inner:after{display:none}.about{display:block;text-align:center}.about p{margin:auto}.services-grid{grid-template-columns:repeat(2,1fr)}.service{background:#fff8;padding:25px}.closing{text-align:center}footer .payments{display:flex;flex-direction:column;align-items:flex-end;padding:15px;border-right:4px solid}.payments .pay-label{text-align:right}.payments .cards{display:grid;grid-template-columns:repeat(2,38px)}
@media(max-width:700px){.hero{display:flex;flex-direction:column}.hero-main{width:100%;padding:70px 6%;text-align:left}.hero-main p{margin-left:0}.hero-art{position:relative;order:0;width:100%;min-height:180px;height:220px;margin:0}.art-inner{width:auto;aspect-ratio:auto;border:0;box-shadow:none;transform:none}.art-inner:after{display:none}.about{display:block;padding:70px 6%;text-align:left}.about .eyebrow{margin-bottom:32px}.services-grid{grid-template-columns:1fr!important}.service{display:block;min-height:0;transform:none!important}.service h3{margin:18px 0}.closing{display:block;text-align:left}.closing .button{width:auto}footer .payments{justify-items:start;align-items:flex-start}.payments .pay-label{text-align:left}}

/* Individual payment composition */
footer .payments{display:grid; grid-template-columns:1fr; justify-items:center;gap:8px}.payments .cards{display:grid; grid-template-columns:repeat(2,38px);}.payments .pay-label{width:100%;grid-column:1 / -1}.art-inner span{transform:rotate(0deg)}@media(max-width:700px){.art-inner span{transform:none}.payments .cards{max-width:100%}}

/* Site-specific illustration */
.hero-art{height:auto!important;min-height:370px!important}.feedback-art{position:relative;width:min(70%,500px)}.feedback-sheet{background:#fff;padding:35px;box-shadow:12px 12px 0 #344e6830}.feedback-sheet small{font:10px IBM Plex Mono}.feedback-sheet p{font:30px/1.3 DM Serif Display}.feedback-sheet div{letter-spacing:.3em}.quote{position:absolute;top:-50px;right:10px;font:130px DM Serif Display}
@media(max-width:700px){.hero-art{min-height:300px!important;height:auto!important;padding:45px 6%}.workflow-art{gap:8px;width:100%}.workflow-art div{padding:12px;font-size:9px}.workflow-art b{font-size:12px}.workflow-art span{font-size:18px}.workshop-card{width:29vw;height:150px;padding:12px}.workshop-card span{font-size:40px}.orbit-art{width:230px}.orbit-art span{font-size:9px}.partnership-art div{width:28vw;font-size:9px}.editorial-title{font-size:36px}.identity-type{font-size:100px}.identity-swatches i{height:60px}.tech-grid b{font-size:12px}.store-layout{min-height:150px}.store-detail{padding:15px}.store-detail b{font-size:20px}}

/* Distinct brand composition */
header{padding:30px 10%;border:0}.hero{display:flex;flex-direction:column-reverse;min-height:0}.hero-art{min-height:390px;margin:0 10%}.hero-main{padding:55px 10% 80px;text-align:center}.hero-main p{margin-inline:auto}.hero h1{font-weight:400;font-size:clamp(60px,8vw,105px);max-width:850px;margin-inline:auto}.ribbon{background:transparent;color:inherit;border-block:1px solid;text-align:center}.about{display:block;text-align:center;max-width:900px;margin:auto}.about p{margin-inline:auto}.services-grid{grid-template-columns:1fr 1fr;gap:0}.service{padding:30px;border-top:1px solid}.service:nth-child(odd){border-right:1px solid}.closing{text-align:center}
@media(max-width:700px){header{padding:20px 6%;gap:12px;flex-wrap:wrap}nav{gap:12px}.hero{display:flex;flex-direction:column;min-height:0}.hero-main{width:100%;padding:55px 6%}.hero h1{font-size:clamp(44px,10vw,66px);line-height:1.02;overflow-wrap:normal}.hero-art{width:auto;min-height:290px;height:auto;margin:0}.about,.services,.closing{padding:65px 6%}.services-grid{grid-template-columns:1fr!important;gap:12px}.service{display:block;min-height:0;margin:0!important;border-radius:0}.service h3{margin:18px 0}.closing{display:block}.closing .button{margin-top:20px}.section-head{display:block}.hero-art .partnership-art div{font-size:9px}footer{grid-template-columns:1fr}.hero-art{overflow:hidden}.hero-main p{font-size:18px}}
@media(max-width:700px){.hero{flex-direction:column-reverse}}

/* Pricing and inquiry pages */
.pricing-page{text-align:center}.pricing-page .lead,.pricing-page p{margin-inline:auto}.contact-page form{border:1px solid;padding:30px}
@media(max-width:700px){.pricing-page{margin-left:0}.contact-page form{padding-inline:12px}}
