/* v72 · Home: the name and its lines sit a little further right */
html body #page-home .fashion-editorial .home-fit-stage :is(.native-home-name,.native-home-role,.native-home-tagline,.native-home-explore){translate:1vw 0}
@media (max-width:800px){html body #page-home .fashion-editorial .home-fit-stage :is(.native-home-name,.native-home-role,.native-home-tagline,.native-home-explore){translate:1.8vw 0}}
/* v72 · Enquiries: the message now sends itself, so the "open in your email" note is not needed */
html body #page-enquiries .thanks .note{display:none!important}
/* My ventures: the three logos sit on one centre line */
html body #my-ventures .vh-card[data-k=moniet] .vh-logo{translate:0 2.5%}
html body #my-ventures .vh-card[data-k=taot] .vh-logo{translate:0 -1.4%}
html body #my-ventures .vh-card[data-k=interiors] .vh-logo{translate:0 -5.8%}
@media (max-width:800px){html body #my-ventures .vh-card[data-k=moniet] .vh-logo{translate:0 6.6%}}
/* Opening: no shadow or light sweep; the page stays bright ivory and the name crossing begins sooner */
html body #page-home .fashion-editorial .home-fit-stage .v52-veil,html body #page-home .fashion-editorial .home-fit-stage .v52-sweep{display:none!important;animation:none!important}
html body #page-home#page-home#page-home.active .fashion-editorial .home-fit-stage.v52-open .native-home-name>span:nth-child(1){animation-delay:.45s!important}
html body #page-home#page-home#page-home.active .fashion-editorial .home-fit-stage.v52-open .native-home-name>span:nth-child(2){animation-delay:.7s!important}
/* Ventures: one quiet fact under each brand */
html body #page-ventures .vx-panel .vx-ptext p.vx-fact{margin:14px 0 0;font-family:var(--vx-sans);font-style:normal;font-weight:400;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;line-height:1.4;color:#fff;opacity:.78;max-width:none}
/* Enquiries: the press box sits on ivory with a fine gold line */
html body #page-enquiries .eq-aside .eq-press{background:#faf8f3!important;border:1px solid rgba(168,130,62,.28)!important;border-top:1px solid #a8823e!important;box-shadow:none!important}
html body #page-enquiries .eq-press .pk-img{margin-left:22px}
@media (max-width:800px){html body #page-enquiries .eq-press .pk-img{margin:14px 0 0}}
/* Enquiries: a quiet way on before the footer, like My Story */
html body #page-enquiries .eq-next{background:#f5f3ee;padding:20px max(7%,24px) 70px}
html body #page-enquiries .eq-next a{display:inline-flex;align-items:baseline;gap:.32em;transition:color .4s ease}
html body #page-enquiries .eq-next a span{display:inline-block;font-style:normal;font-size:.62em;transform:translateY(-.08em);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
html body #page-enquiries .eq-next a:hover{color:#182d62}
html body #page-enquiries .eq-next a:hover span{transform:translate(.32em,-.08em)}
html body #page-enquiries .eq-next a+a{margin-left:clamp(22px,3vw,40px)}
/* My ventures: the logo films now carry the ivory themselves (no filters or blending, so iPhone shows them cleanly) */
html body #page-home #my-ventures .vh-logo{mix-blend-mode:normal!important}
html body #page-home#page-home #my-ventures .vh-card[data-k] .vh-logo video{filter:none!important}
@media (max-width:800px){
 html body #page-home #my-ventures .vh-grid{max-width:300px!important;gap:38px!important}
}
/* Enquiries: the silk letters are cut on a canvas while they open, so their edges stay sharp however close they come */
html body #page-enquiries .eqs-cut{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;visibility:hidden}
html body #page-enquiries .opt.sent .thanks p{animation-delay:.25s!important}
html body #page-enquiries .thanks{padding-top:22px}
/* ============ v72 · phone fixes, Home ============ */
@media (max-width:800px){
 /* Beauty lives in the details: the line beneath reads clearly */
 html body #page-home #reveal#reveal .reveal-copy p.rc-short{font-family:'Jost',sans-serif!important;font-style:normal!important;font-weight:400!important;font-size:17px!important;line-height:1.55!important;letter-spacing:.01em!important;color:rgba(247,245,240,var(--kc3,0))!important;margin-top:20px!important}
 /* About: the closed chapters step back, Designer and Founder and CEO step forward, the portrait arrives sooner */
 html body #page-home .about-editorial .about-left .eyebrow{margin-bottom:14px!important}
 html body #page-home .about-editorial .about-left h2{margin-top:12px!important}
 html body #page-home .about-editorial .about-left h2>span{font-size:34px!important;line-height:1.12!important}
 html body #page-home .about-editorial .about-left h2>em{font-size:45px!important;line-height:1.12!important;margin-top:6px!important}
 html body #page-home .about-editorial .reinvention-stack{margin-top:14px!important}
 html body #page-home .about-editorial .reinvention-stack span{font-size:22px!important;line-height:1.3!important}
 html body #page-home .about-editorial .reinvention-stack span.role-interiors-current{font-size:36px!important;line-height:1.2!important;margin-top:6px!important}
 html body #page-home .about-editorial .reinvention-stack span.role-final{font-size:46px!important;line-height:1.08!important;margin-top:4px!important}
 html body #page-home .about-editorial .about-portrait-stage{margin-top:8px!important}
 /* Let's create something together: the blue light runs through the whole line */
 html body #page-home .closing h2>span{color:transparent!important;-webkit-text-fill-color:transparent!important;background:linear-gradient(115deg,#f5f3ee 0%,#f5f3ee 25%,#89baff 40%,#397bea 50%,#89baff 60%,#f5f3ee 75%,#f5f3ee 100%);background-size:250% 100%;background-position:100% 50%;-webkit-background-clip:text;background-clip:text;animation:bordersDiagonalSweep 2.8s ease-in-out infinite alternate;display:inline-block;padding-bottom:.12em;margin-bottom:-.12em}
}
/* Phone footers: each name on one line, and the whole close fits on one screen */
@media (max-width:800px){
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark{padding-top:52px!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .lede{margin-top:14px!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .cta{margin-top:20px!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .close-grid{row-gap:34px!important;gap:34px!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .follow-accent{margin-bottom:8px!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .socials li a{padding-top:11px!important;padding-bottom:11px!important;gap:10px!important;flex-wrap:nowrap!important;align-items:baseline!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .socials li a b{font-size:15px!important;letter-spacing:.03em!important;white-space:nowrap!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .socials li a span{font-size:8.5px!important;letter-spacing:.12em!important;white-space:nowrap!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .finale{margin-top:30px!important;padding-bottom:16px!important}
 html body :is(#page-home,#page-story,#page-ventures,#page-enquiries):is(#page-home,#page-story,#page-ventures,#page-enquiries) section.closing.dark .finale .foot{margin-top:16px!important;padding-top:14px!important}
}
/* ---- preview options (only active with ?pv=…) ---- */
@media (max-width:800px){
 html.v72-mvA body #page-home #my-ventures .vh-media{aspect-ratio:1/1!important}
 html.v72-mvA body #page-home #my-ventures .vh-grid{gap:30px!important}
 html.v72-mvB body #page-home #my-ventures .vh-card{transform-origin:50% 0!important;transition:transform 1.9s cubic-bezier(.65,.02,.25,1),opacity 1s ease!important;opacity:1!important}
 html.v72-mvB body #page-home #my-ventures .vh-card .vh-cap{opacity:0;transition:opacity 1s 1.4s ease}
 html.v72-mvB.v72-mvB-open body #page-home #my-ventures .vh-card .vh-cap{opacity:1}
}
/* Enquiries: the silk melts away at the top and fades as it falls (her choice: Softer) */
html body #page-enquiries .eqs-drape{transform:translateY(calc(var(--fall,0) * 62%))!important;box-shadow:none!important;opacity:calc(1 - var(--fall,0) * var(--fall,0));
 -webkit-mask-image:linear-gradient(to bottom,transparent 0,transparent calc(var(--fall,0) * 22%),#000 calc(var(--fall,0) * 58% + 1%));mask-image:linear-gradient(to bottom,transparent 0,transparent calc(var(--fall,0) * 22%),#000 calc(var(--fall,0) * 58% + 1%))}

/* My Story on phone: a thumb on the chapters scrolls the page itself (natural momentum, no jumps), and each city takes about one swipe */
@media (hover:none){html body #page-story #approvedRibbonFrame{pointer-events:none}}
@media (max-width:700px) and (prefers-reduced-motion:no-preference){html body #page-story #storySequence.approved-ribbon-section{height:760svh!important}}
/* ---- preview: My Story on phone (?pv=st) ---- */
@media (max-width:700px){
 html.v72-st body #page-story .story-portrait-hero{height:auto!important;min-height:0!important;padding:0!important;overflow:hidden}
 html.v72-st body #page-story .story-portrait-grid{display:flex!important;flex-direction:column!important;height:auto!important;min-height:0!important;padding:0!important}
 html.v72-st body #page-story .story-opening-copy{position:relative!important;left:auto!important;top:auto!important;right:auto!important;width:auto!important;padding:94px 22px 0!important;transform:none!important;opacity:1!important}
 html.v72-st body #page-story .story-opening-copy h1>span{font-size:39px!important;line-height:1.05!important;display:block!important;width:auto!important;max-width:none!important}
 html.v72-st body #page-story .story-opening-copy h1>em{display:block!important;font-size:36px!important;line-height:1.1!important;margin-top:2px!important}
 html.v72-st body #page-story .story-opening-copy .story-why{display:inline-block!important;font-size:54px!important;line-height:1!important;margin:0 0 0 .08em!important;position:static!important;vertical-align:baseline!important}
 html.v72-st body #page-story .story-opening-copy .lede{display:block!important;margin:14px 0 0!important;max-width:33ch!important;font:400 15.5px/1.6 'Jost',sans-serif!important;color:#4a463f!important;transform:none!important}
 html.v72-st body #page-story .story-pink-portrait{position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;width:calc(100% - 44px)!important;height:auto!important;margin:14px 22px 0!important;transform:translateY(var(--sty,0px)) scale(var(--sts,1))!important;transform-origin:50% 0!important;opacity:1!important;overflow:visible!important}
 html.v72-st body #page-story .story-pink-portrait svg{width:100%!important;height:auto!important;display:block!important}
 /* the opening: words rise in, the line follows, the portrait is unveiled as an ivory sheet slips down off it */
 html.v72-st body #page-story .st-pre :is(.story-opening-copy h1>span,.story-opening-copy h1>em,.story-opening-copy .lede){opacity:0!important}
 html.v72-st body #page-story .st-in .story-opening-copy h1>span{animation:st-rise .9s .05s cubic-bezier(.2,.7,.2,1) both}
 html.v72-st body #page-story .st-in .story-opening-copy h1>em{animation:st-rise .9s .3s cubic-bezier(.2,.7,.2,1) both}
 html.v72-st body #page-story .st-in .story-opening-copy .lede{animation:st-fade 1s .65s ease both}
 html.v72-st body #page-story .story-pink-portrait::after{content:"";position:absolute;left:-6%;right:-6%;top:-8%;height:130%;pointer-events:none;background:linear-gradient(to bottom,rgba(245,243,238,0) 0,#f5f3ee 16%,#f5f3ee 100%);transform:translateY(0)}
 html.v72-st body #page-story .st-in .story-pink-portrait::after{animation:st-unveil 1.7s .55s cubic-bezier(.55,.06,.25,1) forwards}
 html.v72-st body #page-story .st-done .story-pink-portrait::after{display:none}
 /* principles: no numbers on phone, the caption one quiet line, each principle given more room */
 html.v72-st body #page-story #principles .ep-num{display:none!important}
 html.v72-st body #page-story #principles .ep-cap{font-size:12px!important;line-height:1.35!important;margin-top:6px!important;letter-spacing:0!important}
 html.v72-st body #page-story .v53-lede-below{display:none!important}
 html.v72-st body #page-story .ep-dock{position:absolute;top:66px;right:20px;z-index:6;font:400 17px/1.2 'Cormorant Garamond',Georgia,serif;color:#141413;opacity:0;transform:translateY(-6px);transition:opacity .6s ease,transform .6s ease;pointer-events:none}
 html.v72-st body #page-story .ep-dock em{color:#182d62}
 html.v72-st body #page-story .ep-dock.on{opacity:1;transform:none}
 html.v72-st body #page-story #my-vision{margin-top:16svh!important}
}

/* My ventures: all three logos in black, 15% larger */
html body #page-home #my-ventures .vh-card .vh-logo{scale:1.15}
@keyframes st-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes st-fade{from{opacity:0}to{opacity:1}}
@keyframes st-unveil{from{transform:translateY(0)}to{transform:translateY(105%)}}

/* the principles label shows on phone only */
html body #page-story .ep-dock{display:none}
@media (max-width:700px){html.v72-st body #page-story .ep-dock{display:block}}
