/* Auwave service stories: shared tokens, readable copy and tangible deliverables. */
:root{--paper:#f5f2e9;--ink:#30245f;--violet:#6045cf;--muted:#645c78;--line:#d2cbdc;--pale:#e8e2f8;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Instrument Sans',Arial,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b49dff;outline-offset:5px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:400;letter-spacing:-.045em;line-height:1.1}em{font-style:normal;color:var(--violet)}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0}img{max-width:100%;height:auto}::selection{background:var(--violet);color:white}[hidden]{display:none!important}.svc-wrap{width:min(1320px,calc(100% - 96px));margin-inline:auto}.svc-kicker{font-size:15px;letter-spacing:0;line-height:1.4;margin-bottom:24px}.svc-skip{position:fixed;left:20px;top:-100px;padding:12px 20px;background:var(--ink);color:white;z-index:100}.svc-skip:focus{top:10px}
.svc-nav{height:76px;border-bottom:1px solid var(--line);padding-inline:32px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:rgba(245,242,233,.98);position:sticky;top:0;z-index:20}.svc-nav>a:first-of-type{display:flex;align-items:center}.svc-nav img{width:132px;mix-blend-mode:multiply}.svc-nav nav{display:flex;height:100%}.svc-nav nav a{display:flex;align-items:center;padding-inline:24px;border-left:1px solid var(--line);font-size:15px}.svc-nav nav a:last-child{border-right:1px solid var(--line)}.svc-nav nav a:hover,.svc-nav nav a[aria-current]{background:var(--pale)}.svc-contact{display:flex;gap:20px;align-items:center;padding:12px 18px;background:var(--violet);color:white;font-size:16px}.svc-contact:hover{background:var(--ink)}
.svc-hero{display:grid;grid-template-columns:1fr 1.05fr;border-bottom:1px solid var(--line)}.svc-hero-copy{padding:34px clamp(28px,4vw,80px) 40px max(48px,calc((100vw - 1320px)/2));display:flex;flex-direction:column;justify-content:space-between;gap:45px}.svc-breadcrumb{display:flex;gap:10px;flex-wrap:wrap;font-size:14px;color:var(--muted)}.svc-breadcrumb a{text-decoration:underline;text-underline-offset:4px}.svc-hero h1{font-size:clamp(44px,4.5vw,72px);margin-bottom:28px;line-height:1.04;letter-spacing:-.055em}.svc-lead{max-width:480px;font-size:19px;line-height:1.6;margin-bottom:30px}.svc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}.svc-button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;background:var(--violet);color:white;min-height:52px;padding:14px 20px;font-size:16px;transition:background .25s}.svc-button:hover{background:var(--ink)}.svc-button svg,.svc-link svg{transition:transform .4s var(--ease)}.svc-button:hover svg,.svc-link:hover svg{transform:translateX(5px)}.svc-link{display:inline-flex;align-items:center;gap:22px;min-height:44px;font-size:16px}.svc-fit{border-top:1px solid var(--line);padding-top:20px;margin:0;color:var(--muted);font-size:15px;max-width:490px}
.svc-demo{background:var(--violet);color:var(--paper);padding:30px clamp(20px,3vw,52px) 24px;min-width:0;overflow:hidden}.demo-top{display:flex;justify-content:space-between;gap:20px;font-size:14px;padding-bottom:20px}.demo-top>span:last-child{white-space:nowrap;color:#ddd4ff}.demo-stage{display:grid;align-items:center;min-height:485px;padding:25px 0 35px;position:relative}.demo-stage:before{content:'';position:absolute;inset:16px -50px 24px;background-image:linear-gradient(#ffffff12 1px,transparent 1px),linear-gradient(90deg,#ffffff12 1px,transparent 1px);background-size:42px 42px;pointer-events:none;mask-image:linear-gradient(transparent,#000,transparent)}.demo-panel{grid-area:1/1;position:relative;min-width:0}.demo-sheet{background:var(--paper);color:var(--ink);border:1px solid var(--ink);max-width:425px;margin:auto;box-shadow:12px 12px 0 #ffffff22;transition:max-width .5s var(--ease)}.sheet-top{display:flex;justify-content:space-between;gap:16px;padding:18px 26px;border-bottom:1px solid var(--line);font-size:14px}.sheet-top>span:last-child{font-weight:600;color:var(--violet)}.demo-sheet h2{font-size:clamp(28px,2.7vw,40px);padding:26px 26px 0;margin-bottom:26px;letter-spacing:-.04em}.sheet-rows{padding:0 26px}.sheet-row{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);padding:16px 0;min-height:78px;font-size:15px}.row-index{color:var(--violet);font-size:14px}.sheet-row strong{font-weight:500;display:block}.sheet-row div>span{display:block;color:var(--muted);font-size:14px}.sheet-row svg{margin-left:auto;color:var(--violet)}.sheet-tag{background:var(--pale);padding:17px 26px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:14px;border-top:1px solid var(--line)}.demo-controls{display:flex;border:1px solid #b5a3ee}.demo-controls button{flex:1;min-width:0;border:0;border-right:1px solid #b5a3ee;background:transparent;color:var(--paper);padding:14px 8px;transition:background .3s,color .3s;font-size:16px;min-height:54px}.demo-controls button:last-child{border:0}.demo-controls button span{font-size:13px;margin-right:10px;opacity:.75}.demo-controls button[aria-pressed=true]{background:var(--paper);color:var(--violet)}.demo-controls button:hover:not([aria-pressed=true]){background:#ffffff18}.demo-note{font-size:13px;margin:14px 0 0;color:#e4dcff}.app-window-bar{display:flex;align-items:center;gap:5px;padding:12px 26px;border-bottom:1px solid var(--line)}.app-window-bar i{height:5px;width:5px;border-radius:50%;background:var(--violet)}.app-window-bar span{margin-left:auto;font-size:12px}.demo-apps #demo-1 .demo-sheet{max-width:290px;border-radius:20px;overflow:hidden;box-shadow:8px 10px 0 #ffffff22}.demo-ai .sheet-tag{background:var(--ink);color:var(--paper)}.demo-systems .sheet-row{border-left:2px solid var(--violet);padding-left:18px}
.svc-section{padding-block:96px}.svc-section-head{display:grid;grid-template-columns:1fr 2fr;gap:48px;margin-bottom:48px}.svc-section-head h2,.svc-work h2,.svc-faq h2,.svc-related h2{font-size:clamp(34px,4vw,54px);margin-bottom:22px}.svc-section-head p:not(.svc-kicker){max-width:660px;color:var(--muted);margin:0;font-size:19px}.svc-output-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--line)}.svc-output-grid article{padding:30px 32px 32px 0}.svc-output-grid article+article{padding-left:32px;border-left:1px solid var(--line)}.output-number{font-size:14px;color:var(--violet);display:block;margin-bottom:35px}.svc-output-grid h3{font-size:27px;margin-bottom:18px}.svc-output-grid p{margin:0;color:var(--muted);font-size:17px}.svc-method{background:#15151b;color:white;padding-block:90px}.svc-method .svc-kicker{color:#c4b7ff}.svc-method em{color:#b9aaff}.svc-method-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #4d4a5a;margin-bottom:26px}.svc-method-grid article{padding:30px 35px 20px 0}.svc-method-grid h3{font-size:28px;margin-bottom:16px}.svc-method-grid p{font-size:17px;color:#cbc8d5;margin:0}.method-number{color:#b9aaff;font-size:16px;display:block;margin-bottom:32px}.svc-method .svc-link{color:#c4b7ff}.svc-work{display:grid;grid-template-columns:1fr 1.5fr;align-items:center;gap:64px;border-bottom:1px solid var(--line)}.svc-work p:not(.svc-kicker){max-width:350px;color:var(--muted)}.svc-project-image{display:block;border:1px solid var(--line);background:#fff;padding:18px}.svc-project-image img{display:block;width:100%;object-fit:contain}.svc-project-image>span{display:flex;justify-content:space-between;align-items:center;padding-top:18px;border-top:1px solid var(--line);font-size:15px}
.svc-faq{display:grid;grid-template-columns:1fr 1.5fr;gap:64px}.svc-faq details{border-top:1px solid var(--line)}.svc-faq details:last-child{border-bottom:1px solid var(--line)}.svc-faq summary{list-style:none;display:flex;gap:25px;justify-content:space-between;align-items:center;padding:24px 0;font-size:20px;line-height:1.4;cursor:pointer}.svc-faq summary::-webkit-details-marker{display:none}.svc-faq summary span{font-size:26px;transition:transform .3s}.svc-faq details[open] summary span{transform:rotate(45deg)}.faq-answer p{margin:0;padding:0 35px 28px 0;color:var(--muted);font-size:17px}.svc-cta{background:var(--violet);color:var(--paper);padding-block:78px}.svc-cta h2{font-size:clamp(42px,5.2vw,74px);max-width:900px;margin:0 0 38px;line-height:1.05}.svc-button.light{background:var(--paper);color:var(--violet)}.svc-button.light:hover{background:var(--pale)}.svc-related>div{margin-top:40px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--line)}.svc-related>div>a{padding:26px;display:grid;grid-template-columns:1fr auto;gap:20px;transition:background .25s}.svc-related>div>a+a{border-left:1px solid var(--line)}.svc-related a>span{grid-column:1/-1;color:var(--violet);font-size:14px}.svc-related h3{font-size:25px;margin:0}.svc-related a:hover{background:var(--pale)}
.svc-footer{border-top:1px solid var(--line)}.svc-footer-grid{display:grid;grid-template-columns:1.2fr 1.5fr .7fr;gap:48px;padding-block:50px}.svc-footer img{mix-blend-mode:multiply}.svc-footer p{font-size:17px;margin-top:20px}.svc-footer h2{font-size:16px;letter-spacing:0;color:var(--muted);margin-bottom:22px}.svc-footer nav a{display:block;margin-block:12px;font-size:16px}.svc-footer a:hover{text-decoration:underline;text-underline-offset:5px}.svc-footer-bottom{border-top:1px solid var(--line);padding-block:24px;display:flex;justify-content:space-between;gap:20px;font-size:14px;color:var(--muted)}
.svc-hub-intro{padding-block:80px 60px}.svc-hub-intro h1{font-size:clamp(46px,6.2vw,86px);margin-bottom:32px}.svc-hub-intro>p:last-child{font-size:20px;color:var(--muted)}.svc-directory{padding-bottom:90px}.svc-service-card{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin-bottom:30px;transition:border-color .25s}.svc-service-card:hover{border-color:var(--violet)}.directory-art{display:grid;place-items:center;padding:35px;background:var(--pale);overflow:hidden}.svc-service-card:nth-child(even) .directory-art{background:var(--violet);color:var(--paper)}.directory-copy{padding:40px}.directory-copy h2{font-size:clamp(32px,3.3vw,48px);margin-bottom:24px}.directory-copy p{color:var(--muted);font-size:18px}.directory-copy .svc-kicker{display:block}.svc-motif{width:100%;height:auto;max-width:420px;fill:var(--paper);stroke:var(--violet);stroke-width:1.5;transition:transform .7s var(--ease)}.svc-service-card:hover .svc-motif{transform:translateY(-8px)}.svc-motif .art-accent{fill:var(--violet)}.svc-motif .art-soft{fill:var(--pale);stroke:none}.svc-motif .art-ink{fill:none;stroke:var(--violet);stroke-width:3}.svc-motif .art-paper{fill:none;stroke:var(--paper);stroke-width:3}.svc-motif .draw-line{stroke:currentColor;fill:none;stroke-width:2;stroke-dasharray:5 5}
@media(min-width:1600px){.svc-hero-copy{gap:65px}.demo-stage{min-height:560px}.demo-sheet{max-width:470px}}
@media(max-width:1000px){.svc-wrap{width:calc(100% - 48px)}.svc-nav{padding-inline:24px}.svc-hero-copy{padding:30px 28px;gap:30px}.svc-hero{grid-template-columns:1fr 1fr}.svc-hero h1{font-size:44px}.svc-lead{font-size:18px}.demo-stage{min-height:490px}.sheet-top,.sheet-tag{padding-inline:20px}.demo-sheet h2{padding-inline:20px;font-size:29px}.sheet-rows{padding-inline:20px}.demo-controls button span{display:none}.svc-section-head{grid-template-columns:1fr 2fr;gap:24px}.svc-faq,.svc-work{gap:35px}.svc-related>div>a{padding:22px 18px}.svc-related h3{font-size:22px}}
@media(max-width:760px){html{scroll-padding-top:82px}.svc-nav{height:68px;padding-inline:20px;gap:16px}.svc-nav img{width:112px}.svc-nav nav a{padding-inline:14px}.svc-nav nav a:not(:first-child){display:none}.svc-contact{padding:10px 14px;font-size:15px;gap:10px}.svc-contact svg{width:18px}.svc-hero{grid-template-columns:1fr}.svc-hero-copy{padding:26px 24px 36px;gap:30px}.svc-hero h1{font-size:clamp(43px,8vw,60px)}.svc-kicker{margin-bottom:20px}.svc-lead{font-size:18px;max-width:550px}.svc-demo{padding:26px 24px}.demo-stage{min-height:470px;padding:25px 6px 32px}.demo-sheet h2{font-size:34px}.demo-top{font-size:14px}.demo-controls button span{display:inline}.svc-section{padding-block:65px}.svc-section-head{grid-template-columns:1fr;gap:0;margin-bottom:32px}.svc-output-grid{grid-template-columns:1fr}.svc-output-grid article,.svc-output-grid article+article{padding:25px 0;border-left:0}.svc-output-grid article+article{border-top:1px solid var(--line)}.output-number{margin-bottom:18px}.svc-output-grid h3{font-size:26px}.svc-method{padding-block:65px}.svc-method-grid{grid-template-columns:1fr}.svc-method-grid article{display:grid;grid-template-columns:35px 1fr;gap:0 16px;padding:26px 0;border-bottom:1px solid #4d4a5a}.method-number{margin:4px 0 0;grid-row:1/3}.svc-method-grid h3{font-size:27px;margin-bottom:12px}.svc-faq,.svc-work{grid-template-columns:1fr;gap:25px}.svc-faq h2{margin:0}.svc-related>div{grid-template-columns:1fr}.svc-related>div>a{padding:24px 0;grid-template-columns:28px 1fr auto;align-items:center;gap:16px}.svc-related>div>a+a{border-left:0;border-top:1px solid var(--line)}.svc-related a>span{grid-column:auto}.svc-related h3{font-size:24px}.svc-cta{padding-block:60px}.svc-footer-grid{grid-template-columns:1fr 1fr;gap:35px 25px}.svc-footer-grid>div:first-child{grid-column:1/-1}.svc-footer-bottom{flex-direction:column;gap:8px}.svc-hub-intro{padding-block:55px 35px}.svc-service-card{grid-template-columns:1fr}.directory-art{padding:25px}.svc-motif{max-width:310px}.directory-copy{padding:28px}.directory-copy h2{font-size:36px}.svc-directory{padding-bottom:40px}}
@media(max-width:380px){.svc-nav{padding-inline:16px;gap:10px}.svc-nav nav a{padding-inline:10px;font-size:14px}.svc-nav img{width:95px}.svc-contact{padding:10px}.svc-contact svg{display:none}.svc-wrap{width:calc(100% - 40px)}.svc-hero-copy{padding-inline:20px}.svc-hero h1{font-size:42px}.svc-demo{padding-inline:20px}.demo-stage{padding-inline:0}.demo-top>span:last-child{display:none}.demo-sheet h2{font-size:30px}.demo-controls button{font-size:15px}.demo-controls button span{display:none}.sheet-row{gap:12px}.svc-footer-grid{grid-template-columns:1fr}.svc-footer-grid>div:first-child{grid-column:auto}.svc-button{gap:18px}}
/* Keep every example in the same grid cell so changing steps never shifts the page. */
.demo-panel[hidden]{display:block!important;visibility:hidden;pointer-events:none}
.svc-contact{white-space:nowrap;flex-shrink:0}.svc-nav>a:first-of-type{flex-shrink:0}
@media(max-width:760px){.svc-nav nav a{padding-inline:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
