/* Strukture design system. Shared presentation; no framework or font downloads. */
:root{--ease:cubic-bezier(.22,1,.36,1);--space:clamp(80px,10vw,160px)}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #729500;outline-offset:6px}::selection{background:#d6ff62;color:#181b1b}
.agency{--paper:#fafbf8;--ink:#181b1b;background:var(--ink);color:var(--paper)}.agency .wrap{width:min(1320px,calc(100% - 112px))}.agency .header{position:sticky;top:0;z-index:30;background:#181b1bf2;border-bottom:1px solid #ffffff12;transition:background .35s,border-color .35s}.agency .header.is-scrolled{background:#181b1be8;backdrop-filter:blur(20px);border-color:#ffffff20}.agency .nav{min-height:80px;height:80px;flex-wrap:nowrap;padding:0;gap:26px}.agency .logo{font-size:2rem;letter-spacing:-.075em}.agency .header nav{font-size:.875rem;gap:28px;margin-left:auto}.agency .header nav a{position:relative;transition:color .2s}.agency .nav-contact{border:1px solid #ffffff30;border-radius:30px;padding:12px 18px;font-size:.875rem;white-space:nowrap;transition:background .2s,color .2s}.agency .nav-contact:hover{background:var(--lime);color:var(--ink)}.agency .nav-contact span{margin-left:10px}.agency .language-picker{border:0;padding:0;margin:0;font-family:inherit;font-size:.875rem}.agency .language-picker>span{display:none}.menu-toggle{display:none}
.agency .section{padding-block:var(--space)}.agency h1,.agency h2,.agency h3{font-weight:550;text-wrap:balance}.agency h2{font-size:clamp(2.5rem,4.7vw,5rem);line-height:1.04;letter-spacing:-.055em}.agency .eyebrow{font-size:.875rem;letter-spacing:.12em;line-height:1.6}.agency .section-heading{grid-template-columns:1fr 2fr;gap:60px;margin-bottom:70px}.agency .intro{max-width:560px;font-size:1.125rem;line-height:1.7}.agency .button{border-radius:100px;gap:24px;padding:18px 26px;line-height:1.5;transition:transform .4s var(--ease),background .3s,box-shadow .3s}.agency .button:hover{transform:translateY(-3px);box-shadow:0 8px 24px #00000012}.agency .button:active{transform:scale(.98)}.agency .text-link{font-size:1rem;text-decoration-thickness:1px;text-underline-offset:6px}.agency .button span,.agency .text-link span{transition:transform .35s var(--ease)}.agency .button:hover span,.agency .text-link:hover span{transform:translate(2px,-2px)}
/* Opening: a spacious display headline and two tangible project previews. */
.agency .premium-hero{padding-top:65px;text-align:center}.premium-hero .hero-top{justify-content:center}.premium-hero .hero-index{display:none}.premium-hero .hero-top .eyebrow{color:#c1c8c2;margin-bottom:0}.agency .premium-hero h1{font-size:clamp(3.5rem,8.3vw,8rem);line-height:1.01;letter-spacing:-.065em;max-width:1150px;margin:32px auto}.premium-hero .hero-bottom{display:flex;flex-direction:column;align-items:center;gap:28px;padding:0}.premium-hero .hero-bottom>p{font-size:clamp(1.125rem,1.6vw,1.4rem);max-width:620px;line-height:1.6}.premium-hero .hero-actions{flex-direction:row;align-items:center;justify-content:center;gap:28px;margin:0}.premium-hero .hero-rule{margin-top:30px;padding:28px 0;font-size:.875rem}.hero-stage{position:relative;margin:64px auto 0;max-width:1100px;padding:0 0 60px;text-align:left;perspective:1600px}.stage-primary,.stage-secondary{position:relative;display:block;border:1px solid #ffffff24;border-radius:18px;overflow:hidden;background:#242827;box-shadow:0 30px 80px #0005;transition:transform .8s var(--ease)}.stage-primary{width:77%;transform:rotate(-2deg)}.stage-secondary{position:absolute;width:40%;right:0;bottom:75px;transform:rotate(4deg)}.stage-primary:hover{transform:rotate(0) translateY(-5px)}.stage-secondary:hover{transform:rotate(0) translateY(-5px)}.stage-bar{height:38px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;font-size:.8125rem;color:#d4dbd5;background:#262b29}.hero-stage img{display:block;width:100%;height:auto;aspect-ratio:1.85;object-fit:cover}.stage-secondary img{aspect-ratio:1.35}.stage-caption{position:absolute;bottom:0;padding:50px 22px 20px;background:linear-gradient(transparent,#0009);width:100%;font-size:.875rem;letter-spacing:.14em;color:white}.stage-note{position:absolute;bottom:0;left:0;margin:0;color:#bbc3be;font-size:.875rem}
/* Work gets space, rather than competing small cards. */
.agency .demo-section{background:#eff1ed}.agency .demo-heading{margin-bottom:64px}.agency .project-grid{display:grid;grid-template-columns:1fr;gap:80px}.agency .project{max-width:1080px;width:100%;margin-inline:auto}.agency .project:nth-child(2){max-width:880px;margin-right:0}.agency .demo-preview{border-radius:16px;overflow:hidden;border-color:#d3d9d1;box-shadow:0 25px 70px #18221b0d;transition:transform .8s var(--ease)}.agency .preview-bar{height:40px}.agency .preview-window{aspect-ratio:1.8}.agency .preview-window iframe{width:166.667%;height:166.667%;transform:scale(.6)}.agency .project-caption{display:flex;padding:26px 0;border-bottom:0;gap:25px}.agency .project-caption h3{font-size:1.65rem;margin-bottom:8px}.agency .project-caption>span{margin:0;flex-shrink:0}.agency .project-caption p{font-size:1rem}.agency .demo-foot{margin-top:64px;padding-top:24px;border-top:1px solid #cbd1ca}.agency .demo-foot p{font-size:.875rem;max-width:530px}
/* Editorial service rows and a quietly emphasized main offer. */
.agency .services{display:block}.agency .services article{display:grid;grid-template-columns:50px 1fr 1fr;column-gap:40px;align-items:start;padding:38px 0;border-top:1px solid #d4d9d0}.agency .service-number{font-size:.875rem;padding-top:10px}.agency .services h3{font-size:clamp(1.8rem,2.8vw,2.8rem);max-width:350px;margin:0;letter-spacing:-.045em}.agency .services p{margin:0;max-width:470px;font-size:1.0625rem}.agency .service-tag{grid-column:3;border:0;padding:16px 0 0;font-size:.8125rem}.agency .offer-detail{padding:45px 0;margin-top:40px;border:0;border-top:1px solid #d4d9d0;gap:70px}.agency .deliverables{gap:35px}.agency .audience{margin-top:24px;padding-top:30px}.agency .audience>div{gap:16px 28px;font-size:1rem}.agency #methode{background:#eff1ed}.agency .steps{gap:55px}.agency .steps article{padding-top:28px}.agency .steps span{border:0;border-radius:0;width:auto;height:auto;font-size:2rem;letter-spacing:-.06em;color:#707b6d}.agency .steps h3{font-size:1.8rem}.agency .steps p{font-size:1.0625rem}.agency .quote-line{margin-top:64px}.agency .quote-line p{font-size:1.65rem}.offer-row{display:grid;grid-template-columns:1.1fr 1.2fr 1fr;gap:45px;align-items:center;padding:40px 28px;border-top:1px solid #d3d9d0}.offer-row.featured{background:#edf3e3;border-radius:18px;border:1px solid #d0dbc4;margin-top:10px}.offer-index{font-size:.875rem;color:#63705d}.offer-name h3{font-size:2.15rem;letter-spacing:-.045em;margin:10px 0}.offer-row>p{font-size:1.0625rem;color:#596255;line-height:1.7}.offer-badge{font-size:.875rem;color:#42522a}.offer-action{display:flex;flex-direction:column;gap:15px;align-items:flex-start}.offer-action strong{font-size:1.2rem;font-weight:550}.offer-footnote{max-width:770px;font-size:.9375rem;color:#626a62;line-height:1.7;margin:32px 0 0 auto}.agency .about-grid{gap:110px}.agency .about-grid h2{font-size:clamp(3rem,5.8vw,6rem)}.agency .about-copy>p{font-size:1.2rem;line-height:1.75}.agency .founder{padding-top:30px}.agency #creation-site-web-valais{padding-bottom:0}.agency #creation-site-web-valais .section-heading h2{font-size:clamp(2.3rem,3.8vw,4rem)}.agency .local-copy{max-width:850px}.agency .faq{max-width:850px}.agency .faq details{padding:26px 0}.agency .faq summary{font-size:1.2rem;list-style:none;display:flex;justify-content:space-between;gap:24px}.agency .faq summary::-webkit-details-marker{display:none}.agency .faq summary:after{content:'+';font-weight:400;font-size:1.5rem}.agency .faq details[open] summary:after{content:'−'}.agency .faq p{max-width:700px}
/* Guided enquiries remain functional with keyboard and no external services. */
.agency #projet{background:#eff1ed}.agency #projet h2{max-width:850px}.agency .brief-intro{color:#626a62;max-width:650px;margin-top:28px}.agency .project-brief{margin-top:44px}.agency .brief-choices{gap:18px}.agency .brief-choice>span{background:#fafbf8;border:1px solid #bfc8b9;border-radius:16px;padding:30px 24px 30px 52px;min-height:165px;transition:background .3s,border-color .3s,transform .3s}.agency .brief-choice:hover>span{transform:translateY(-3px);border-color:#7e8b70}.agency .brief-choice>input{top:33px}.agency .brief-choice input:checked+span{background:#d6ff62;border-color:#697d38}.agency .brief-grid{max-width:980px;gap:28px}.agency .brief-grid input:not([type=checkbox]),.agency .brief-grid select,.agency .brief-grid textarea,.agency .brief-summary{border-radius:10px;border-color:#abb5a4;padding:16px;background:#fafbf8}.agency [data-brief-details]{margin-top:48px}.agency .brief-review{background:#fafbf8;border-radius:18px;padding:32px}.agency .brief-actions button{border-radius:30px;padding:14px 22px}.agency .contact{padding-block:clamp(90px,12vw,180px)}.agency .contact h2{font-size:clamp(3.4rem,6.8vw,7rem)}.agency .contact-grid{gap:80px;grid-template-columns:1.2fr 1fr}.agency .email{font-size:clamp(1.4rem,2.4vw,2.2rem);padding-bottom:25px}.agency .email-note{font-size:.875rem!important}.agency .footer-top{padding:42px 0}.agency .footer-top p,.agency .footer-top>a:last-child,.agency .footer-bottom{font-size:.875rem}.agency .language-links{font-size:.875rem}.agency dialog{border-radius:20px;max-height:85vh;overflow:auto}.agency .service-hero{padding-block:65px 100px}.agency .service-hero h1{font-size:clamp(3rem,6.9vw,7rem);line-height:1.02}.agency .service-lead{max-width:730px;font-size:1.2rem;color:#c2c8c4}.agency .service-guide article{padding:50px 0;grid-template-columns:100px minmax(0,850px);gap:60px}.agency .service-guide h2{font-size:clamp(2rem,3.5vw,3.6rem)}
/* Demonstrations retain their distinct identities and working enquiry flows. */
.showcase .button{border-radius:100px;transition:transform .35s var(--ease),background .25s}.showcase .button:hover{transform:translateY(-3px)}.showcase .section{padding-block:clamp(70px,9vw,140px)}.showcase .hero-image,.showcase .hero-visual{overflow:hidden;border-radius:14px}.showcase .project img{border-radius:10px;transition:transform .6s var(--ease)}.showcase input,.showcase select,.showcase textarea{border-radius:8px}.showcase h1,.showcase h2{text-wrap:balance}.showcase .service{transition:transform .4s var(--ease)}.showcase .service:hover{transform:translateY(-4px)}
@keyframes premium-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){.agency .premium-hero h1{animation:premium-in .85s var(--ease) both}.agency .premium-hero .hero-bottom{animation:premium-in 1s .12s var(--ease) both}.hero-stage{animation:premium-in 1.2s .2s var(--ease) both}.reveal-entered{animation:premium-in .9s var(--ease) both!important}}
@media(min-width:1001px){.agency .service-guide article>p.eyebrow{position:sticky;top:120px}.agency .about-grid>div:first-child{position:sticky;top:120px;align-self:start}}
@media(max-width:1100px){.agency .wrap{width:calc(100% - 64px)}.agency .nav{gap:18px}.agency .header nav{gap:18px}.agency .nav-contact{display:none}.agency .section-heading{gap:35px}.agency .services article{gap:24px;grid-template-columns:36px 1fr 1fr}.offer-row{gap:25px}.agency .about-grid{gap:50px}}
@media(max-width:800px){.agency .wrap{width:calc(100% - 40px)}.agency .nav{height:72px;min-height:72px;gap:20px;position:relative;flex-wrap:nowrap}.agency .logo{font-size:1.8rem}.agency .language-picker{margin-left:auto;order:2}.agency .menu-toggle{order:3;display:flex;flex-direction:column;justify-content:center;gap:6px;background:transparent;border:1px solid #ffffff30;border-radius:50%;width:44px;height:44px;padding:12px;color:white;flex-shrink:0}.menu-toggle span{height:1px;background:currentColor;width:18px;transition:transform .35s var(--ease)}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.agency .header nav{display:flex;flex-direction:column;position:absolute;top:72px;left:-20px;right:-20px;width:auto;margin:0;padding:30px 24px 40px;gap:0;background:#181b1b;border:0;border-bottom:1px solid #ffffff20;visibility:hidden;opacity:0;transform:translateY(-10px);transition:opacity .3s,transform .4s var(--ease),visibility .3s;pointer-events:none}.agency .header nav[data-open]{visibility:visible;opacity:1;transform:none;pointer-events:auto}.agency .header nav a{font-size:1.7rem;letter-spacing:-.03em;padding:14px 0}.agency .header:not(.menu-ready) nav{position:static;visibility:visible;opacity:1;transform:none;pointer-events:auto;font-size:1rem}.agency .header:not(.menu-ready) .nav{height:auto;flex-wrap:wrap}.agency .header:not(.menu-ready) nav a{font-size:1rem}.agency .header:not(.menu-ready) .menu-toggle{display:none}.agency .premium-hero{padding-top:45px}.agency .premium-hero h1{font-size:clamp(3.1rem,10vw,5.8rem);margin:25px auto}.premium-hero .hero-actions{flex-direction:column;gap:22px}.premium-hero .hero-bottom>p{font-size:1.125rem;max-width:480px}.hero-stage{margin-top:48px;padding-bottom:55px}.stage-primary{width:87%;border-radius:12px}.stage-secondary{width:44%;bottom:65px;border-radius:10px}.stage-bar{height:28px;font-size:.75rem;padding-inline:10px}.stage-caption{font-size:.75rem;padding:28px 10px 12px}.stage-note{font-size:.8125rem;max-width:75%}.premium-hero .hero-rule{margin-top:5px;font-size:.875rem;text-align:left}.agency .section-heading{display:block;margin-bottom:40px}.agency .section-heading .eyebrow{margin-bottom:24px}.agency h2{font-size:clamp(2.5rem,7vw,3.8rem)}.agency .services article{grid-template-columns:32px 1fr;gap:15px 18px;padding:28px 0}.agency .services h3{max-width:none;font-size:2rem}.agency .services p,.agency .service-tag{grid-column:2;max-width:none}.agency .service-tag{padding-top:0}.agency .offer-detail{grid-template-columns:1fr;gap:30px;padding-block:30px}.agency .deliverables{grid-template-columns:1fr 1fr}.agency .audience{display:block}.agency .audience>div{margin-top:24px}.agency .demo-heading{display:block;margin-bottom:38px}.agency .demo-heading>p{max-width:550px;margin-top:25px}.agency .project-grid{gap:45px}.agency .preview-window{aspect-ratio:1.3}.agency .preview-window iframe{width:250%;height:250%;transform:scale(.4)}.agency .project-caption{display:block;padding:22px 0}.agency .project-caption>span{display:block;margin-top:16px}.agency .demo-foot{display:block;margin-top:35px}.agency .steps{grid-template-columns:1fr;gap:30px}.agency .steps article{display:grid;grid-template-columns:40px 1fr;gap:14px 18px}.agency .steps h3{margin:0}.agency .steps p{grid-column:2;max-width:none;margin:0}.agency .steps span{align-content:start;font-size:1.5rem}.offer-row{grid-template-columns:1fr;padding:30px 20px;gap:12px}.offer-name{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.offer-name h3{margin:0;font-size:2rem}.offer-badge{width:100%;padding-left:30px}.offer-row>p{margin:0}.offer-action{margin-top:10px}.agency .about-grid,.agency .contact-grid{grid-template-columns:1fr;gap:40px}.agency .about-grid h2{font-size:clamp(3rem,8vw,4.5rem)}.agency .brief-choices{grid-template-columns:1fr}.agency .brief-choice>span{min-height:0;padding-block:24px}.agency .brief-choice>input{top:27px}.agency .brief-review{padding:24px 18px}.agency .service-guide article{grid-template-columns:1fr;gap:15px}.agency .service-hero{padding-block:45px 65px}.agency .service-hero h1{font-size:clamp(3rem,9vw,5rem)}.agency .footer-bottom{flex-wrap:wrap}.agency .footer-bottom span{max-width:none}.agency .footer-top p{max-width:none}.agency .faq summary{font-size:1.125rem}}
@media(max-width:480px){.agency .deliverables{grid-template-columns:1fr}.agency .premium-hero h1{font-size:clamp(2.7rem,10.5vw,3.5rem)}.agency .hero-top .eyebrow{font-size:.75rem}.agency .stage-secondary{bottom:62px}.agency .hero-stage{padding-bottom:60px}.agency .hero-rule span:last-child{display:none}.agency .stage-note{max-width:100%}.agency .contact h2{font-size:3.3rem}.agency .button{font-size:.9375rem;gap:16px}.agency .language-picker select{max-width:94px}.agency .preview-bar b{font-size:.8125rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important}.reveal-ready{opacity:1!important}.hero-stage a,.agency .project:hover .demo-preview,.showcase .button:hover,.showcase .service:hover{transform:none!important}}
html{scroll-padding-top:96px}.skip{z-index:100}.agency .header :focus-visible{outline-color:#d6ff62}.agency .footer .language-links{position:static;width:auto;visibility:visible;opacity:1;transform:none;pointer-events:auto;margin:0}