:root{--ink:#14231e;--cream:#f2efe6;--paper:#fbfaf6;--moss:#52705a;--lime:#c9dc62;--gold:#db9c42;--line:rgba(20,35,30,.16);--radius:28px;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--serif:Georgia,"Times New Roman",serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.55}
a{color:inherit}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.75rem}
.site-header{position:fixed;z-index:20;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:1.25rem clamp(1.25rem,4vw,5rem);color:#fff;transition:.3s}
.site-header.scrolled{background:rgba(20,35,30,.92);backdrop-filter:blur(14px);padding-top:.8rem;padding-bottom:.8rem}
.brand img{width:74px;height:74px;display:block}
.nav{display:flex;gap:1.7rem;align-items:center;font-size:.82rem;text-transform:uppercase;letter-spacing:.12em}
.nav a{text-decoration:none}
.nav .nav-cta{border:1px solid rgba(255,255,255,.55);border-radius:99px;padding:.7rem 1rem}
.menu-button{display:none;background:none;border:0;color:#fff;font-size:1.5rem}
.hero{min-height:100svh;color:white;position:relative;display:grid;align-items:end;overflow:hidden;background-color:#1a3129;background-image:url('../images/hero-alps.webp');background-position:center;background-size:cover;background-repeat:no-repeat}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,25,20,.82),rgba(10,25,20,.28) 65%,rgba(10,25,20,.08)),linear-gradient(0deg,rgba(10,25,20,.8),transparent 55%)}
.hero-inner{position:relative;z-index:1;width:min(1280px,calc(100% - 2.5rem));margin:0 auto;padding:10rem 0 6rem}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;font-weight:700}
.hero h1{font-family:var(--serif);font-size:clamp(4rem,9vw,9rem);line-height:.88;letter-spacing:-.06em;margin:.55rem 0 1.5rem;max-width:9ch;font-weight:500}
.hero h1 em{color:var(--lime);font-weight:400}
.hero-copy{font-size:clamp(1.05rem,1.5vw,1.35rem);max-width:590px;color:rgba(255,255,255,.84)}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2.2rem}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;border:1px solid var(--ink);background:var(--ink);color:#fff;border-radius:99px;padding:.9rem 1.3rem;text-decoration:none;font-weight:650;font-size:.9rem;cursor:pointer}
.button.alt{background:transparent;border-color:rgba(255,255,255,.5)}
.hero-index{position:absolute;right:clamp(1.25rem,4vw,5rem);bottom:3.2rem;z-index:2;font-family:var(--serif);font-size:1.1rem}
.marquee{background:var(--lime);overflow:hidden;padding:.9rem 0;white-space:nowrap}
.marquee span{display:inline-block;font-size:.78rem;text-transform:uppercase;letter-spacing:.18em;animation:move 28s linear infinite}
@keyframes move{to{transform:translateX(-50%)}
}
.section{padding:clamp(5rem,10vw,9rem) clamp(1.25rem,4vw,5rem)}
.section-inner{max-width:1280px;margin:auto}
.intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(2rem,6vw,7rem);align-items:start}
.section-title{font-family:var(--serif);font-size:clamp(2.7rem,6vw,5.8rem);line-height:.95;letter-spacing:-.045em;margin:0 0 2rem;font-weight:500}
.lead{font-size:clamp(1.3rem,2.2vw,2rem);line-height:1.35;margin:0}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.5rem,3vw,3.5rem);margin-top:5rem}
.value{position:relative;padding:1.5rem 0 0}
.value:before{content:"";position:absolute;top:0;left:0;width:3.25rem;height:2px;background:#7895a6}
.value h3{font-family:var(--serif);font-size:clamp(1.65rem,2.2vw,2.25rem);font-weight:500;line-height:1.05;margin:0 0 .85rem}
.value p{margin:0;max-width:27ch;color:#4d5c56}
.team{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);gap:clamp(3rem,7vw,7rem);align-items:center;margin-top:clamp(5rem,10vw,9rem);padding:clamp(1rem,2vw,2rem) 0}
.team-heading{display:block;margin:0}
.team-heading h3{font-family:var(--serif);font-size:clamp(2.6rem,4.2vw,4.4rem);font-weight:500;letter-spacing:-.045em;line-height:1.02;margin:.6rem 0 1.4rem}
.team-heading p{max-width:430px;color:#53636b;font-size:.98rem;line-height:1.65;margin:0}
.team-people{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2.5vw,2rem);max-width:650px;margin-left:auto;width:100%}
.person{margin:0;min-width:0}
.person>img,.person-placeholder{display:grid;place-items:center;width:100%;aspect-ratio:4/5;max-height:360px;object-fit:cover;border-radius:var(--radius);background:#d8e0e1;color:#5f7e91;font-family:var(--serif);font-size:clamp(3rem,7vw,6rem)}
.person-meta{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.85rem .15rem 0}
.person h4{font-family:var(--serif);font-size:clamp(1.3rem,2vw,1.65rem);font-weight:500;margin:0}
.person-contact{display:flex;gap:.55rem}
.person-contact a{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(23,38,49,.25);border-radius:50%;background:transparent;color:#172631;transition:transform .2s,background .2s,color .2s}
.person-contact a:hover{transform:translateY(-2px);background:#172631;color:#fff}
.person-contact svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.showcase{background:var(--ink);color:#fff}
.showcase-head{display:flex;justify-content:space-between;gap:2rem;align-items:end;margin-bottom:3rem}
.showcase-head p{max-width:470px;color:rgba(255,255,255,.64)}
.filter{display:flex;gap:.5rem;flex-wrap:wrap}
.filter button{border:1px solid rgba(255,255,255,.25);color:#fff;background:transparent;border-radius:99px;padding:.65rem 1rem;cursor:pointer}
.filter button.active{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{min-height:330px;border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between;color:var(--ink);text-decoration:none;transition:.3s;overflow:hidden;position:relative}
.card:hover{transform:translateY(-6px)}
.card:after{content:"↗";position:absolute;right:1.4rem;top:1.1rem;font-size:1.45rem}
.card .kind{text-transform:uppercase;font-size:.65rem;letter-spacing:.18em}
.card h3{font-family:var(--serif);font-size:clamp(2rem,3vw,3.4rem);line-height:.95;margin:0 0 .65rem;max-width:8ch;font-weight:500}
.card p{margin:0;max-width:24ch}
.tone-blue{background:#9cc8d6}
.tone-stone{background:#d8d3c8}
.tone-rose{background:#e4b5ac}
.tone-gold{background:#e6b963}
.tone-green{background:#a8c19e}
.tone-violet{background:#b7aacb}
.services{background:var(--paper)}
.service-list{border-top:1px solid var(--line)}
.service{display:grid;grid-template-columns:80px 1fr 1fr;gap:2rem;padding:2rem 0;border-bottom:1px solid var(--line);align-items:start}
.service span{font-family:var(--serif);font-size:1.5rem;color:var(--moss)}
.service h3{font-family:var(--serif);font-size:clamp(1.7rem,3vw,2.7rem);margin:0;font-weight:500}
.service p{margin:0;color:#4d5c56}
.contact{background:var(--gold)}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(3rem,8vw,8rem)}
.contact-form{background:var(--paper);border-radius:var(--radius);padding:clamp(1.5rem,4vw,3rem)}
label{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;margin:.8rem 0 .35rem}
input,textarea{width:100%;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:.75rem 0;font:inherit;color:inherit;border-radius:0}
textarea{min-height:125px;resize:vertical}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.78rem;text-transform:none;letter-spacing:0;margin:1.2rem 0}
.check input{width:auto;margin-top:.25rem}
.notice{padding:.8rem 1rem;border-radius:12px;margin-bottom:1rem;background:#dff0dc}
.notice.error{background:#f4d9d4}
.footer{background:#0d1814;color:white;padding:3rem clamp(1.25rem,4vw,5rem)}
.footer-inner{max-width:1280px;margin:auto;display:grid;grid-template-columns:1fr auto 1fr;gap:2rem;align-items:end}
.footer-logo{width:100px}
.footer a{color:inherit}
.footer-right{text-align:right}
.legal{font-size:.72rem;color:rgba(255,255,255,.55);margin-top:2rem;text-align:center}
.reveal{opacity:0;transform:translateY(20px);transition:.7s}
.reveal.visible{opacity:1;transform:none}
@media(max-width:800px){.nav{position:fixed;inset:0 0 auto 0;background:var(--ink);padding:7rem 1.5rem 2rem;display:none;flex-direction:column;align-items:flex-start}
.nav.open{display:flex}
.menu-button{display:block;z-index:2}
.hero h1{font-size:clamp(3.6rem,18vw,6rem)}
.hero-index{display:none}
.intro,.contact-grid{grid-template-columns:1fr}
.team{grid-template-columns:1fr}.team-people{grid-template-columns:1fr 1fr;max-width:none;margin:0}.team-heading p{max-width:600px}
.values{grid-template-columns:1fr 1fr}
.cards{grid-template-columns:1fr}
.card{min-height:270px}
.showcase-head{display:block}
.filter{margin-top:1.5rem}
.service{grid-template-columns:50px 1fr}
.service p{grid-column:2}
.footer-inner{grid-template-columns:1fr;text-align:left}
.footer-right{text-align:left}
.footer-logo{grid-row:1}
.brand img{width:58px;height:58px}
}
@media(max-width:520px){.team-people{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.marquee span{animation:none}
.reveal{opacity:1;transform:none}
}

.showcase-intro{max-width:800px;margin-bottom:clamp(5rem,10vw,9rem)}
.showcase-intro>p{max-width:560px;color:rgba(255,255,255,.64);font-size:1.08rem}
.portfolio-group{padding:0 0 clamp(6rem,11vw,10rem)}
.portfolio-group:last-child{padding-bottom:0}
.portfolio-group+.portfolio-group{border-top:1px solid rgba(255,255,255,.18);padding-top:clamp(5rem,9vw,8rem)}
.group-head{display:grid;grid-template-columns:90px 1fr;gap:2rem;align-items:start;margin-bottom:2.5rem}
.group-head>span{font-family:var(--serif);font-size:3.4rem;line-height:1;color:var(--lime)}
.group-head h3{font-family:var(--serif);font-size:clamp(2.7rem,5vw,5rem);font-weight:500;letter-spacing:-.045em;line-height:1;margin:0 0 .8rem}
.group-head p{max-width:600px;margin:0;color:rgba(255,255,255,.64)}
.cards-projects,.cards-events{grid-template-columns:repeat(3,1fr)}
.card{padding:0;min-height:0;display:block;justify-content:initial}
.card figure{height:210px;margin:0;overflow:hidden;background:#263a32}
.cards-projects .card figure,.cards-events .card figure{height:210px}
.card figure img{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(.82);transition:transform .7s ease,filter .4s ease}
.card:nth-child(2) figure img{object-position:68% center}
.card:nth-child(3) figure img{object-position:35% center}
.card:nth-child(4) figure img{object-position:78% center}
.card:nth-child(5) figure img{object-position:20% center}
.card:nth-child(6) figure img{object-position:58% center}
.card:hover figure img{transform:scale(1.035);filter:saturate(1)}
.card-copy{min-height:220px;padding:1.35rem 1.5rem 1.6rem;display:flex;flex-direction:column;justify-content:flex-start}
.cards-projects .card-copy,.cards-events .card-copy{min-height:220px}
.card:after{z-index:2;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.9);top:1rem;right:1rem;color:var(--ink);font-size:1.1rem}
.card h3{margin-top:1.35rem}
@media(max-width:800px){
  .group-head{grid-template-columns:55px 1fr;gap:1rem}
  .group-head>span{font-size:2.5rem}
  .cards-projects,.cards-events{grid-template-columns:1fr}
  .card figure,.cards-projects .card figure,.cards-events .card figure{height:220px}
  .card-copy,.cards-projects .card-copy,.cards-events .card-copy{min-height:210px}
}

:root{--ink:#172631;--cream:#f1eee8;--paper:#faf8f3;--moss:#5f7e91;--lime:#b8d4e2;--gold:#d8cec1;--line:rgba(23,38,49,.16)}
body{background:var(--cream)}
.site-header.scrolled{background:rgba(23,38,49,.94)}
.brand img{width:96px;height:96px}
.site-header .brand{opacity:0;transform:translateY(-8px);transition:opacity .3s,transform .3s}
.site-header.scrolled .brand{opacity:1;transform:none}
.hero:before{background:linear-gradient(90deg,rgba(12,26,36,.84),rgba(12,26,36,.3) 66%,rgba(12,26,36,.08)),linear-gradient(0deg,rgba(12,26,36,.82),transparent 55%)}
.hero-inner{padding-top:9rem}
.hero-lockup{display:inline-grid;justify-items:center;margin-bottom:1.25rem}
.hero-logo{display:block;width:clamp(175px,16vw,230px);height:auto;margin:0 0 .9rem}
.hero h1{line-height:.94}
.hero-copy{line-height:1.62}
.section-title{line-height:1.02}
.lead{line-height:1.48}
.nowrap{white-space:nowrap}
.showcase{background:#172631}
.tone-blue{background:#aac7d5}
.tone-stone{background:#d8d1c7}
.tone-rose{background:#d9b9bd}
.tone-gold{background:#d9c59f}
.tone-green{background:#b8c8c2}
.tone-violet{background:#c1b9ce}
.portfolio-brands .card{background:#d8e0e1}
.portfolio-events .card{background:#ded8d2}
.portfolio-projects .card{background:#d5dde1}
.portfolio-group .card{box-shadow:0 16px 45px rgba(7,20,28,.12)}
.portfolio-group .card:hover{box-shadow:0 22px 55px rgba(7,20,28,.2)}
.card h3{font-size:clamp(1.9rem,2.5vw,2.8rem);line-height:1.06;letter-spacing:-.035em;max-width:none;overflow-wrap:anywhere}
.card p{line-height:1.55}
.portfolio-group .cards{grid-template-columns:repeat(6,minmax(0,1fr))}
.portfolio-group .card{grid-column:span 2}
.portfolio-group .card:last-child:nth-child(3n + 1){grid-column:3/span 2}
.portfolio-group .card:first-child:nth-last-child(2){grid-column:2/span 2}
.group-head h3{line-height:1.06}
.group-head p,.showcase-intro>p{line-height:1.65}
.contact{background:#d8cec1}
.contact-form{box-shadow:0 24px 70px rgba(23,38,49,.11)}
.required-note{margin:0 0 1.4rem;text-align:right;font-size:.72rem;color:#68757d}
.required-note span,.contact-form label>span{color:#5f7e91;font-weight:800}
.contact-form label small{float:right;color:#7c8589;text-transform:none;letter-spacing:0;font-size:.72rem}
.captcha{margin:1.5rem 0 1rem;padding:1.1rem 1.25rem 1.2rem;border-radius:18px;background:#e8eff2;display:grid;grid-template-columns:auto minmax(90px,130px);gap:.7rem 1.3rem;align-items:end}
.captcha>div{grid-row:1/3;align-self:center}
.captcha-label{display:block;margin-bottom:.3rem;font-size:.65rem;text-transform:uppercase;letter-spacing:.14em;color:#5f6c73}
.captcha strong{font-family:var(--serif);font-size:2rem;font-weight:500;color:#172631}
.captcha label{margin:0}
.captcha input{padding:.25rem 0;font-size:1.25rem}
.captcha>small{grid-column:1/3;color:#5f6c73;font-size:.72rem}
.privacy-note{font-size:.75rem;line-height:1.5;color:#68757d;margin:1rem 0 1.3rem}
.footer{background:#111d25}
.footer-logo{width:138px}
.page-up{position:fixed;right:clamp(1rem,3vw,2.5rem);bottom:clamp(1rem,3vw,2.5rem);z-index:30;width:52px;height:52px;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:#172631;color:#fff;font:600 1.25rem/1 var(--sans);box-shadow:0 12px 35px rgba(17,29,37,.25);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s,visibility .25s,transform .25s,background .25s}
.page-up.visible{opacity:1;visibility:visible;transform:none}
.page-up:hover{background:#5f7e91}
.page-up:focus-visible{outline:3px solid #b8d4e2;outline-offset:3px}
@media(max-width:800px){.brand img{width:70px;height:70px}.hero-logo{width:165px}.hero h1{line-height:.96}.section-title{line-height:1.04}.portfolio-group .cards{grid-template-columns:1fr}.portfolio-group .card{grid-column:auto!important}.card h3{font-size:2.2rem}.captcha{grid-template-columns:1fr}.captcha>div{grid-row:auto}.captcha>small{grid-column:auto}}
