:root{
  --bg:#f5f1eb;
  --white:rgba(255,255,255,1);
  --white-soft:rgba(255,255,255,.86);
  --sand:#eee5da;
  --moka:#d7c2ab;
  --ink:#111111;
  --line:rgba(17,17,17,.10);
  --accent:#b88857;
  --accent-deep:#a4774c;
  --shadow:0 12px 28px rgba(0,0,0,.05);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{font-family:"Montserrat",system-ui,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
.container{width:min(1240px, calc(100% - 48px));margin:0 auto}
.container--narrow{width:min(820px, calc(100% - 48px));margin:0 auto}
.mobileOnly{
  display:none !important;
}

@media (max-width: 900px){
  .desktopOnly{
    display:none !important;
  }

  .mobileOnly{
    display:block !important;
  }

  .mobileGallery.mobileOnly,
  .workshopSlider.mobileOnly{
    display:flex !important;
  }
}

.topbar{position:sticky;top:0;z-index:120;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.topbar__inner{min-height:78px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px}
.brand{grid-column:2;justify-self:center;display:flex;align-items:center;gap:10px}
.brand__logo{height:36px;width:auto;object-fit:contain}
.brand__text{font-size:clamp(22px,1.65vw,30px);font-weight:700;letter-spacing:-.03em;color:#111}
.topbar__right{display:flex;align-items:center;gap:16px}
.lang{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:700}
.lang a{opacity:.45}
.lang a.is-active{opacity:1}
.menuButton{width:46px;height:46px;border:none;background:transparent;display:flex;flex-direction:column;justify-content:center;gap:5px;padding:0;cursor:pointer}
.menuButton span{display:block;width:22px;height:2px;background:#111;border-radius:2px}
.mobileMenu{position:fixed;top:0;left:0;height:100vh;width:min(320px,84vw);background:var(--white-soft);backdrop-filter:blur(16px);border-right:1px solid rgba(17,17,17,.08);padding:20px 0 24px;transform:translateX(-100%);opacity:0;pointer-events:none;transition:transform .35s cubic-bezier(.22,.61,.36,1), opacity .25s ease;z-index:220}
.mobileMenu.is-open{transform:translateX(0);opacity:1;pointer-events:auto}
.mobileMenu__head{display:flex;align-items:center;justify-content:space-between;padding:0 20px 16px;border-bottom:1px solid rgba(17,17,17,.08);margin-bottom:8px}
.mobileMenu__lang{display:flex;gap:12px;font-size:14px;font-weight:700}
.mobileMenu__lang a{opacity:.45}
.mobileMenu__lang a.is-active{opacity:1}
.mobileMenu__close{border:none;background:transparent;font-size:28px;line-height:1;cursor:pointer;padding:4px 8px}
.mobileMenu a{display:block;padding:16px 24px;font-weight:600;border-bottom:1px solid rgba(17,17,17,.05)}
.menuBackdrop{position:fixed;inset:0;background:rgba(10,10,10,.16);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:210}
.menuBackdrop.is-open{opacity:1;pointer-events:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border:1px solid rgba(17,17,17,.14);border-radius:8px;background:var(--accent);color:#fff;font-weight:700;letter-spacing:-0.01em;line-height:1;cursor:pointer;box-shadow:0 3px 8px rgba(0,0,0,.035);transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease}
.btn:hover{background:var(--accent-deep);border-color:rgba(17,17,17,.18);box-shadow:0 4px 10px rgba(0,0,0,.045)}
.btn--small{min-height:42px;padding:10px 16px;font-size:14px}
.btn--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.28);box-shadow:none}
.btn--ghost:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.34);box-shadow:none}
.btn--ghost-dark{background:transparent;color:var(--ink);border:1px solid rgba(17,17,17,.14);box-shadow:none}
.btn--ghost-dark:hover{background:rgba(17,17,17,.03);border-color:rgba(17,17,17,.22);box-shadow:none}
h1,h2,h3{margin:0;letter-spacing:-.03em;line-height:1.04}
h1{font-size:clamp(48px,8.8vw,92px);font-weight:800}
h2{font-size:clamp(28px,5vw,54px);font-weight:800}
h3{font-size:clamp(20px,2.5vw,28px);font-weight:700}
.eyebrow{margin:0 0 14px 0;text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:700;color:rgba(255,255,255,.82)}
.eyebrow--dark{color:rgba(17,17,17,.58)}
.section{padding:110px 0}
.section--tight-bottom{padding-bottom:56px}
.section--tight-top{padding-top:56px}
.section--white{background:transparent}
.section--sand{background:linear-gradient(180deg,var(--white),var(--sand))}
.section--moka{background:linear-gradient(180deg,var(--sand),var(--moka))}
.section__lead{margin:16px 0 0 0;color:rgba(17,17,17,.72);font-size:18px}
.hero{position:relative;min-height:92vh;overflow:hidden;display:flex;align-items:flex-end}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(8,8,8,.78) 0%, rgba(8,8,8,.56) 24%, rgba(8,8,8,.20) 58%, rgba(8,8,8,.08) 100%),linear-gradient(180deg, rgba(10,10,10,.18), rgba(10,10,10,.38))}
.hero__content{position:relative;z-index:2;width:100%;padding-bottom:72px}
.hero__copy{max-width:980px;margin-left:18px}
.hero h1{color:rgba(245,240,232,0.94);text-shadow:0 2px 10px rgba(0,0,0,.22),0 14px 34px rgba(0,0,0,.20)}
.hero__lead{margin:18px 0 0 0;font-size:clamp(18px,2.05vw,25px);color:rgba(255,255,255,.92);max-width:46ch}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.scrolly{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:40px;align-items:start}
.scrolly__media{position:sticky;top:96px;height:calc(100vh - 140px);border-radius:18px;overflow:hidden;background:#ece3d8;box-shadow:var(--shadow);border:1px solid var(--line)}
.scrolly__frame{position:relative;width:100%;height:100%;isolation:isolate;transform:translate3d(0,0,0) scale(1);transition:transform .35s ease-out}
.scrolly__progress{position:absolute;left:20px;right:20px;bottom:16px;height:3px;background:rgba(17,17,17,.08);border-radius:999px;z-index:4;overflow:hidden}
.scrolly__progress span{display:block;height:100%;width:20%;background:linear-gradient(90deg,var(--accent),var(--accent-deep));transition:width .45s ease}
.scrolly__image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:14px;opacity:0;transform:scale(1.018);filter:blur(5px);transition:opacity .95s cubic-bezier(.22,.61,.36,1),transform 1.1s cubic-bezier(.22,.61,.36,1),filter .9s cubic-bezier(.22,.61,.36,1)}
.scrolly__image.is-active{opacity:1;transform:scale(1);filter:blur(0)}
.scrolly__steps{position:relative}
.scrollyStep{min-height:72vh;display:flex;flex-direction:column;justify-content:center;padding:24px 0;border-bottom:1px solid rgba(17,17,17,.08);opacity:.42;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease}
.scrollyStep:last-child{border-bottom:none}
.scrollyStep p{margin:10px 0 0 0;color:rgba(17,17,17,.72)}
.scrollyStep.is-active{opacity:1;transform:translateY(0)}

.mobileGallery{
  display:flex;
  gap:12px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding:0 4px 8px;
  scroll-padding-left:4px;
}
.mobileGallery::-webkit-scrollbar,.workshopSlider::-webkit-scrollbar{display:none}
.mobileCard{
  min-width:72%;
  max-width:72%;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
  flex-shrink:0;
}
.mobileCard img{
  width:100%;
  aspect-ratio:5/6;
  object-fit:cover;
  background:#ece3d8;
}
.mobileCard__text{padding:18px 18px 22px}
.mobileCard__text p{margin:10px 0 0;color:rgba(17,17,17,.72)}

.workshopIntro{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:end;margin-bottom:28px}
.workshopIntro__lead{max-width:62ch}
.workshopGrid{display:grid;grid-template-columns:1.35fr .8fr .8fr;gap:22px;align-items:start}
.workshopGrid__item{margin:0}
.workshopGrid__item img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:18px;box-shadow:var(--shadow)}
.workshopGrid__item--wide img{aspect-ratio:4/5}
.workshopGrid__item figcaption,.workshopSlider__item figcaption{margin-top:12px;color:rgba(17,17,17,.68);font-size:14px;line-height:1.55}

.workshopSlider{
  display:flex;
  gap:12px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding:0 4px 8px;
  scroll-padding-left:4px;
}
.workshopSlider::-webkit-scrollbar{
  display:none;
}
.workshopSlider__item{
  min-width:58%;
  max-width:58%;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  margin:0;
  flex:0 0 auto;
}
.workshopSlider__item img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  border-radius:16px;
  box-shadow:var(--shadow);
}
.workshopSlider__item figcaption{
  margin-top:10px;
  font-size:13px;
  line-height:1.45;
  color:rgba(17,17,17,.68);
}

.customLayout{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.customLayout__left .section__lead{max-width:32ch}
.customLayout__right{display:flex;flex-direction:column}
.processRow{display:grid;grid-template-columns:48px 1fr;gap:20px;padding:18px 0 24px;border-bottom:1px solid rgba(17,17,17,.08)}
.processRow span{font-size:18px;font-weight:800;color:var(--accent-deep);line-height:1;padding-top:8px}
.processRow h3{margin:0 0 8px 0}
.processRow p{margin:0;color:rgba(17,17,17,.68)}
.serviceIntro{max-width:1100px}
.serviceCards{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:32px}
.serviceCard{background:rgba(255,255,255,.72);border:1px solid rgba(17,17,17,.06);border-radius:24px;padding:28px 28px 30px;box-shadow:0 10px 24px rgba(0,0,0,.03)}
.serviceCard h3{margin:0 0 14px 0}
.serviceCard p{margin:0;color:rgba(17,17,17,.68)}
.storyGrid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;margin-top:28px}
.card{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}
.card p{margin:12px 0 0 0;color:rgba(17,17,17,.72)}
.closingHero{position:relative;min-height:72vh;overflow:hidden}
.closingHero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.closingHero__overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(10,10,10,.70), rgba(10,10,10,.28) 55%, rgba(10,10,10,.10)),linear-gradient(180deg, rgba(10,10,10,.12), rgba(10,10,10,.42))}
.closingHero__content{position:relative;z-index:2;min-height:72vh;display:flex;flex-direction:column;justify-content:center;color:#fff;max-width:760px}
.closingHero__content p:not(.eyebrow){max-width:34ch;color:rgba(255,255,255,.88)}
.ctaRow{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.footer{background:var(--white);border-top:1px solid var(--line);padding:28px 0 36px}
.footer__inner{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.footer__brand{font-weight:800}
.footer__links{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:rgba(17,17,17,.66)}
.footer__meta{font-size:13px;color:rgba(17,17,17,.58)}

@media (max-width:1100px){
  .scrolly{grid-template-columns:1fr}
  .scrolly__media{height:58vh;top:86px}
  .scrollyStep{min-height:auto;padding:28px 0;opacity:1;transform:none}
  .workshopIntro,.customLayout,.storyGrid,.serviceCards{grid-template-columns:1fr}
  .workshopGrid{grid-template-columns:1fr 1fr}
  .workshopGrid__item--wide{grid-column:1 / -1}
}

@media (max-width:900px){
  .container,
  .container--narrow{
    width:min(100%, calc(100% - 24px));
  }

  .desktopOnly{
    display:none !important;
  }

  .mobileOnly{
    display:block !important;
  }

  .mobileGallery.mobileOnly,
  .workshopSlider.mobileOnly{
    display:flex !important;
  }

  .topbar__inner{
    grid-template-columns:46px 1fr 46px;
    min-height:72px;
    position:relative;
  }

  .brand{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    grid-column:auto;
    justify-self:center;
    gap:8px;
  }

  .brand__logo{
    height:28px;
  }

  .brand__text{
    font-size:22px;
    font-weight:600;
  }

  .topbar__right{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    gap:0;
  }

  .topbar__right .btn,
  .topbar__right .lang{
    display:none;
  }

  .hero{
    min-height:84vh;
  }

  .hero__content{
    padding-bottom:34px;
  }

  .hero__copy{
    margin-left:0;
    max-width:none;
  }

  .hero h1{
    font-size:clamp(40px,12vw,62px);
    line-height:.96;
  }

  .hero__lead{
    font-size:18px;
    max-width:30ch;
  }

  .hero__actions{
    gap:10px;
  }

  .btn{
    min-height:46px;
    padding:11px 16px;
    font-size:15px;
  }

  .section{
    padding:76px 0;
  }

  .section__lead{
    font-size:17px;
  }

  h2{
    font-size:clamp(30px,8vw,42px);
  }

  h3{
    font-size:24px;
  }

  .mobileGallery{
    gap:12px;
    padding:0 4px 8px;
    scroll-padding-left:4px;
  }

  .mobileCard{
    min-width:72%;
    max-width:72%;
  }

  .mobileCard__text{
    padding:14px 14px 18px;
  }

  .mobileCard__text h3{
    font-size:20px;
  }

  .mobileCard__text p{
    font-size:14px;
    line-height:1.5;
  }

  .workshopIntro{
    gap:16px;
    margin-bottom:20px;
  }

  .workshopSlider{
    gap:10px;
    padding:0 4px 8px;
    scroll-padding-left:4px;
  }

  .workshopSlider__item{
    min-width:52%;
    max-width:52%;
  }

  .workshopSlider__item img{
    aspect-ratio:4/5;
    border-radius:16px;
  }

  .workshopSlider__item figcaption{
    font-size:13px;
    line-height:1.45;
  }

  .processRow{
    grid-template-columns:38px 1fr;
    gap:14px;
    padding:16px 0 20px;
  }

  .serviceCard,
  .card{
    padding:20px;
  }

  .closingHero{
    min-height:62vh;
  }

  .closingHero__content{
    min-height:62vh;
  }

  .footer__inner{
    align-items:flex-start;
  }
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .scrolly__image,.scrollyStep,.scrolly__frame,.scrolly__progress span,.mobileMenu,.menuBackdrop,.btn{transition:none}
}