:root{
  --paper:#e8e0d2;
  --brown:#a38e82;
  --dark:#554a43;
  --soft:#a89387;
  --white:#fff;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Helvetica Neue",Arial,sans-serif;color:var(--dark);background:var(--paper) url("papier-textur.jpg") center/cover fixed no-repeat}
a{color:inherit;text-decoration:none}
.home{min-height:100svh;width:100%;display:grid;grid-template-columns:55vw 45vw;overflow:hidden;padding:0}
.brand{position:relative;display:flex;align-items:flex-end;justify-content:center;padding:clamp(52px,7vw,112px)}
.brand-inner{width:min(850px,90%);text-align:right;margin-bottom:2.2vh}
.logo{display:inline-flex;flex-direction:column;line-height:.82;letter-spacing:-.08em;white-space:nowrap}
.logo-top{font-weight:800;font-size:clamp(92px,12vw,190px);color:var(--dark)}
.logo-bottom{font-weight:200;font-size:clamp(92px,12vw,190px);color:var(--soft)}
.contact{display:block;font-weight:500;letter-spacing:-.03em;font-size:clamp(23px,3vw,44px);margin-top:1.6rem;color:var(--dark)}
.mobile-contact{display:none}
.services-panel{background:var(--brown);display:flex;align-items:center;justify-content:center;height:100svh;min-height:100svh;overflow:hidden;padding-right:clamp(58px,6vw,126px);padding-left:clamp(44px,4.5vw,88px)}
.services-window{height:min(82svh,860px);width:100%;max-width:820px;overflow:hidden;display:flex;align-items:flex-start;justify-content:flex-start;container-type:inline-size;mask-image:linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.35) 4%, #000 12%, #000 86%, rgba(0,0,0,.35) 94%, transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.35) 4%, #000 12%, #000 86%, rgba(0,0,0,.35) 94%, transparent 100%)}
.services-track{display:flex;flex-direction:column;align-items:flex-start;width:100%;will-change:transform;transform:translate3d(0,0,0)}
.services-track span{display:block;font-size:clamp(24px,min(8.7cqw,6.2svh),76px);line-height:1.02;font-weight:500;letter-spacing:-.045em;color:var(--dark);padding:.01em 0;white-space:nowrap;max-width:100%;transform-origin:left center;transition:color .35s linear, opacity .35s linear}

.legal-nav{position:fixed;left:clamp(36px,5vw,84px);bottom:clamp(32px,5vw,72px);display:flex;gap:1.8rem;font-size:clamp(16px,1.5vw,24px);font-weight:500;z-index:10}.legal-nav a:hover,.sub-header a:hover{text-decoration:underline;text-underline-offset:.25em}
.subpage{min-height:100svh;padding:clamp(18px,4vw,56px)}
.sub-header{display:flex;justify-content:space-between;align-items:center;gap:2rem;margin-bottom:clamp(32px,6vw,72px)}
.mini-logo{font-size:clamp(24px,3vw,44px);letter-spacing:-.06em;color:var(--dark)}
.sub-header nav{display:flex;gap:1.2rem;font-size:clamp(16px,1.5vw,22px)}
.content-card{width:min(900px,100%);background:rgba(255,255,255,.76);padding:clamp(28px,5vw,72px);margin:0 auto;border-left:clamp(12px,2vw,28px) solid var(--brown);box-shadow:0 20px 80px rgba(70,55,45,.12)}
h1{font-size:clamp(42px,7vw,86px);line-height:.92;letter-spacing:-.06em;margin:0 0 .65em}p{font-size:clamp(17px,1.7vw,22px);line-height:1.5}.note{margin-top:2rem;font-size:clamp(15px,1.35vw,18px);opacity:.82}

@media (max-width: 1180px){
  .home{grid-template-columns:54vw 46vw}
  .services-panel{padding-right:clamp(44px,5vw,92px);padding-left:clamp(34px,4vw,68px)}
  .services-track span{font-size:clamp(22px,min(8.3cqw,5.8svh),64px)}
}
@media (max-width: 920px) and (min-width: 761px){
  .home{grid-template-columns:52vw 48vw}
  .brand{padding:clamp(32px,5vw,70px)}
  .logo-top,.logo-bottom{font-size:clamp(70px,10vw,132px)}
  .contact{font-size:clamp(18px,2.4vw,30px)}
  .services-panel{padding-right:clamp(30px,4vw,58px);padding-left:clamp(24px,3.5vw,46px)}
  .services-track span{font-size:clamp(18px,min(7.7cqw,5.2svh),48px);letter-spacing:-.04em}
}
@media (max-height: 720px) and (min-width: 761px){
  .services-window{height:86svh}
  .services-track span{font-size:clamp(16px,min(7.1cqw,4.8svh),44px);line-height:1}
}

@media (max-width: 760px){
  html,body{height:100%;min-height:100%;overflow:hidden;background-attachment:scroll}
  .home{
    display:flex;
    flex-direction:column;
    height:100svh;
    min-height:100svh;
    overflow:hidden;
    padding:clamp(12px,3.2svw,18px) 0;
    padding-bottom:clamp(54px,12svh,76px);
  }
  .brand{
    flex:0 0 30svh;
    min-height:0;
    align-items:center;
    justify-content:center;
    padding:clamp(12px,3.5svh,28px) clamp(16px,5svw,28px) clamp(8px,2svh,18px);
  }
  .brand-inner{text-align:center;width:100%;margin:0}
  .logo-top,.logo-bottom{font-size:clamp(58px,19svw,112px);line-height:.82}
  .desktop-contact{display:none}
  .mobile-contact{display:block;font-size:clamp(17px,5svw,28px);margin-top:clamp(8px,1.8svh,15px);margin-bottom:16px}
  .services-panel{
    flex:1 1 auto;
    min-height:0;
    width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    border-radius:0;
    height:auto;
    padding:clamp(10px,2.8svh,22px) clamp(18px,5svw,34px);
  }
  .services-window{
    height:100%;
    width:100%;
    max-width:none;
    justify-content:center;
    mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 8%,#000 18%,#000 82%,rgba(0,0,0,.35) 92%,transparent 100%);
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.35) 8%,#000 18%,#000 82%,rgba(0,0,0,.35) 92%,transparent 100%);
  }
  .services-track{align-items:center}
  .services-track span{
    font-size:clamp(17px,min(6.4svw,4.15svh),34px);
    line-height:.98;
    text-align:center;
    white-space:nowrap;
    letter-spacing:-.04em;
  }
  .legal-nav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:20;
    justify-content:center;
    gap:1.2rem;
    padding:0 14px clamp(12px,2.8svh,22px);
    background:transparent;
    font-size:clamp(15px,4.4svw,22px);
  }
  .subpage{padding:20px;overflow:auto;min-height:100svh}
  .sub-header{align-items:flex-start}
  .sub-header nav{flex-direction:column}
  .content-card{padding:28px 22px;border-left:12px solid var(--brown)}
}

@media (max-width: 760px) and (max-height: 680px){
  .home{padding:10px 0;padding-bottom:48px}
  .brand{flex-basis:27svh;padding:8px 16px 6px}
  .logo-top,.logo-bottom{font-size:clamp(48px,17svw,86px)}
  .mobile-contact{font-size:clamp(15px,4.4svw,22px);margin-top:6px}
  .services-panel{padding:8px 16px}
  .services-track span{font-size:clamp(15px,min(5.8svw,3.7svh),28px);line-height:.96}
  .legal-nav{font-size:clamp(14px,4svw,18px);padding-bottom:10px}
}

@media (prefers-reduced-motion: reduce){.services-track{transition:none!important;transform:none!important}}