/* Cartavelle: shared foundation (tokens, header, mobile menu, type, buttons, a11y, reveal). */
:root{
  --paper:#FFFDFA;        /* canvas */
  --panel:#F7F0ED;        /* blush panel */
  --panel-2:#F4EEEA;      /* warm paper shade */
  --ink:#3A2A2D;          /* body text */
  --ink-soft:#5B4A47;     /* muted text, darker for readability */
  --wine:#6B3843;         /* brand bordo (logo) */
  --wine-deep:#4C2630;
  --rose:#B98289;         /* wax rosé */
  --rose-deep:#9C6670;
  --gold:#A9864E;         /* foil */
  --gold-hi:#E2C892;
  --gold-lo:#7A5E33;
  --line:rgba(107,56,67,.16);
  --accent:var(--wine);
  --f-display:'Cormorant Garamond','Cormorant',Georgia,'Times New Roman',serif;
  --f-body:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-script:'Pinyon Script','Snell Roundhand',cursive;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --gutter:clamp(20px,4vw,56px);
  --header-h:76px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* straight figures everywhere (prices, dates). !important because every `font:` shorthand resets this property */
*,*::before,*::after{font-variant-numeric:lining-nums!important}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--f-body);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,svg,canvas,video{display:block;max-width:100%}
button,input{font:inherit;color:inherit}
a{color:inherit}
::selection{background:rgba(185,130,137,.32)}

/* a11y */
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--wine);color:var(--paper);padding:10px 16px;border-radius:2px;text-decoration:none;transition:top .2s var(--ease)}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--wine);outline-offset:3px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


/* header */
.site-header{position:fixed;inset:0 0 auto;z-index:50;height:var(--header-h);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;
  padding:0 var(--gutter);transition:background .4s var(--ease),box-shadow .4s var(--ease)}
.site-header.is-scrolled{background:rgba(255,253,250,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.brand{grid-column:2;grid-row:1;justify-self:center;display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--wine)}
.brand-word{font:500 2.15rem/1 var(--f-display);letter-spacing:.01em}
.nav{grid-column:1;grid-row:1;justify-self:start;display:flex;align-items:center;gap:clamp(18px,2.4vw,34px)}
.nav a{font:600 .82rem/1 var(--f-body);letter-spacing:.06em;text-decoration:none;color:var(--ink);position:relative;padding:8px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease-out)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.header-end{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:18px}
.site-header > .btn-ghost-sm{grid-column:3;grid-row:1;justify-self:end}
.lang{display:flex;gap:2px}
.lang button{border:0;background:none;padding:8px 6px;min-width:32px;min-height:32px;font:600 .74rem/1 var(--f-body);letter-spacing:.14em;color:var(--ink-soft);cursor:pointer;border-bottom:1px solid transparent}
.lang button[aria-pressed="true"]{color:var(--wine);border-bottom-color:var(--wine)}
.btn-ghost-sm{font:600 .72rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--wine);text-decoration:none;padding:12px 18px;border:1px solid rgba(107,56,67,.4);border-radius:999px;transition:background .3s var(--ease),color .3s var(--ease)}
.btn-ghost-sm:hover{background:var(--wine);color:var(--paper)}
.menu-btn{display:none;border:0;background:none;width:44px;height:44px;padding:0;cursor:pointer;color:var(--wine)}
.menu-btn span{display:block;width:22px;height:1.5px;background:currentColor;margin:5px auto;transition:transform .3s var(--ease)}

/* mobile menu dialog */
.mmenu{position:fixed;inset:0;z-index:80;background:var(--paper);display:flex;flex-direction:column;padding:calc(var(--header-h) + 8px) var(--gutter) 32px;
  opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s .35s}
.mmenu.open{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
.mmenu nav{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.mmenu nav a{font:300 2.3rem/1.25 var(--f-display);text-decoration:none;color:var(--ink);padding:6px 0}
.mmenu .lang{margin-top:auto}
.mmenu-close{position:absolute;top:16px;right:calc(var(--gutter) - 10px);width:44px;height:44px;border:0;background:none;color:var(--wine);font-size:28px;line-height:1;cursor:pointer}

@media (max-width:860px){
  .nav,.header-end .btn-ghost-sm,.header-end .lang{display:none}
  .menu-btn{display:block}
  :root{--header-h:64px}
  .brand-word{font-size:1.9rem}
}

/* shared type */
.display{font-family:var(--f-display);font-weight:400;color:var(--wine-deep);letter-spacing:-.018em;line-height:.94;margin:0;text-wrap:balance}
.display em{font-style:italic;color:var(--wine)}

/* buttons */
.btn{--bx:0px;--by:0px;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:0 28px;border-radius:999px;
  font:600 .8rem/1.2 var(--f-body);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:1px solid transparent;text-align:center;
  transform:translate(var(--bx),var(--by));transition:transform .5s var(--ease-out),background .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease)}
.btn-primary{background:var(--wine);color:var(--paper);box-shadow:0 10px 30px -12px rgba(76,38,48,.55)}
.btn-primary:hover{background:var(--wine-deep)}
.btn-line{background:transparent;color:var(--wine);border-color:rgba(107,56,67,.38)}
.btn-line:hover{border-color:var(--wine);background:rgba(107,56,67,.05)}



/* reveal on load */
.rv{opacity:0;transform:translateY(18px);transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out)}
.is-in .rv{opacity:1;transform:none}
.is-in .rv.d1{transition-delay:.08s}.is-in .rv.d2{transition-delay:.18s}.is-in .rv.d3{transition-delay:.3s}.is-in .rv.d4{transition-delay:.42s}.is-in .rv.d5{transition-delay:.55s}
.mask-line{display:block;overflow:hidden;padding:.06em 0 .14em;margin:-.06em 0 -.14em}
.mask-line > span{display:block;transform:translateY(110%);transition:transform 1.25s var(--ease-out)}
.is-in .mask-line > span{transform:none}
.is-in .mask-line:nth-child(2) > span{transition-delay:.12s}

@media (prefers-reduced-motion:reduce){
  .rv,.mask-line > span{opacity:1!important;transform:none!important;transition:none!important}
  *{scroll-behavior:auto!important}
}
html.no-js .rv,html.no-js .mask-line > span{opacity:1;transform:none}

/* ely 24.10.2026: social links in the footer (Instagram, TikTok; Facebook placeholder in the HTML) */
.foot-social{display:flex;align-items:center;gap:10px}
.foot .foot-social a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid rgba(169,134,78,.55);border-radius:50%;color:var(--wine);text-decoration:none;transition:background-color .2s,color .2s,border-color .2s}
.foot .foot-social a:hover,.foot .foot-social a:focus-visible{background:var(--wine);border-color:var(--wine);color:var(--gold-hi);text-decoration:none}
.foot-social svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}