/* A full-viewport photographic poster; scoped to homepages. */
.home-cinematic .utility{display:none}
.home-cinematic .header{position:fixed;inset:0 0 auto;background:transparent;border:0;color:white;box-shadow:none;transition:background .25s,color .25s,box-shadow .25s}
.home-cinematic .header-inner{height:104px;border-bottom:1px solid #ffffff40}
.home-cinematic .header .brand img{filter:none}
.home-cinematic .header .login{border-color:#ffffff80;color:white;background:transparent}
.home-cinematic .desktop-nav a:after{background:currentColor}
.home-cinematic .header .menu-toggle{color:inherit}.home-cinematic .header .menu-toggle span{background:currentColor}
.home-cinematic .header .languages>div{color:var(--ink)}
.home-cinematic .header.scrolled{background:white;color:var(--ink);box-shadow:0 4px 24px #092e4810}
.home-cinematic .header.scrolled .header-inner{border-color:transparent}
.home-cinematic .header.scrolled .brand img{filter:none}
.home-cinematic .header.scrolled .login{color:var(--ink);border-color:var(--line)}
.home-cinematic #mobile-nav{color:var(--ink);background:white}
.home-cinematic .hero.hero-cinematic{display:block;min-height:100svh;background:#081922}
.home-cinematic .hero-cinematic:after{background:linear-gradient(90deg,#0515218a,transparent 85%),linear-gradient(180deg,#061723a8,transparent 35%,#0315228c)}
.hero-cinematic .hero-photo img{object-position:58% 52%;filter:saturate(1.1)}
.hero-cinematic .hero-stage{min-height:100svh;display:flex;flex-direction:column;padding-top:146px;padding-bottom:36px;position:relative}
.hero-eyebrow{display:flex;align-items:center;justify-content:space-between;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;line-height:1.5;font-weight:600}
.hero-eyebrow p{margin:0}.hero-eyebrow>span{white-space:nowrap}
.hero-headline{margin:auto 0;padding:24px 0 18px}
html .hero-cinematic h1{font-family:var(--sans);font-size:min(24vw,32svh,370px);line-height:.9;letter-spacing:-.085em;font-weight:800;margin:0;max-width:none;hyphens:none;overflow-wrap:normal;color:#fff}
.hero-cinematic .hero-title-line{display:block;overflow:hidden;padding:0 .06em .09em 0;margin-right:-.06em}
.hero-cinematic .hero-title-line>span{display:block;color:inherit}
.hero-cinematic h1 .hero-title-secondary{font-size:min(8.85vw,12svh,136px);letter-spacing:-.065em;line-height:1.05;margin-top:.04em;white-space:nowrap}
.hero-bottom{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:end;position:relative}
.hero-cinematic .hero-description{max-width:330px;margin:0;font-size:clamp(.9rem,1.2vw,1.2rem);line-height:1.5;letter-spacing:0;font-weight:500;align-self:end;padding-bottom:10px}
.hero-explore{display:flex;flex-direction:column;align-items:center;justify-content:center;width:144px;height:144px;background:#c62931;color:white;border-radius:50%;padding:25px;gap:16px;text-align:center;line-height:1.3;font-size:.8rem;font-weight:700;transition:transform .3s,background .3s;justify-self:center}
.hero-explore svg{width:35px;height:35px;fill:none;stroke:currentColor;stroke-width:1.7;transition:transform .3s}
.hero-explore:hover{background:#a91d25;transform:rotate(-6deg)}.hero-explore:hover svg{transform:translate(3px,-3px)}
.hero-explore:focus-visible,.hero-scroll:focus-visible{outline:2px solid white;outline-offset:7px}
.hero-scroll{justify-self:end;display:grid;place-items:center;width:52px;height:64px;color:white;border:1px solid #ffffff6e;border-radius:30px;margin-bottom:8px;transition:background .2s}
.hero-scroll svg{width:17px;height:26px;fill:none;stroke:currentColor;stroke-width:1.3}.hero-scroll:hover{background:#ffffff20}
html[lang=de] .hero-cinematic h1{font-size:min(24vw,32svh,370px);line-height:.9;letter-spacing:-.085em}
html[lang=de] .hero-cinematic h1 .hero-title-secondary{font-size:min(7.55vw,12svh,117px)}
html[lang=ja] .hero-cinematic h1{font-size:clamp(60px,11.7vw,175px);letter-spacing:-.05em;line-height:1.3;margin:0;font-weight:800}
html[lang=ja] .hero-cinematic h1 .hero-title-secondary{font-size:clamp(44px,9vw,136px);letter-spacing:-.05em;line-height:1.4;white-space:nowrap}
html[lang=ja] .hero-cinematic .hero-description{font-size:1rem;line-height:1.8}
@media(min-width:1500px){.hero-cinematic .hero-stage{width:calc(100% - 112px);max-width:1900px}.hero-explore{width:168px;height:168px;font-size:.9rem}}
@media(max-width:800px){
 .home-cinematic .header-inner{height:84px}.home-cinematic #mobile-nav{top:84px}
 .hero-cinematic .hero-stage{padding-top:115px;padding-bottom:25px;min-height:100svh}
 .hero-eyebrow{font-size:.6rem;letter-spacing:.07em;gap:20px}.hero-eyebrow>p{max-width:185px}
 .hero-cinematic .hero-photo img{object-position:65% center}
 .home-cinematic .hero-cinematic:after{background:linear-gradient(180deg,#041521a6,transparent 35%,#031522b8),linear-gradient(90deg,#04152144,transparent)}
 .hero-headline{padding:40px 0 30px}
 html .hero-cinematic h1,html[lang=de] .hero-cinematic h1{font-size:27vw;letter-spacing:-.085em;line-height:.95}
 .hero-cinematic h1 .hero-title-secondary{font-size:12vw;line-height:1;white-space:normal;max-width:7em;letter-spacing:-.06em;margin-top:.13em}
 html[lang=de] .hero-cinematic h1 .hero-title-secondary{font-size:11.7vw;max-width:7.4em;line-height:1.05;white-space:normal}
 .hero-bottom{grid-template-columns:1fr auto;gap:20px;align-items:end}
 .hero-cinematic .hero-description{font-size:.85rem;max-width:195px;padding:0;line-height:1.6}
 .hero-explore{width:114px;height:114px;padding:20px;gap:10px;font-size:.7rem}
 .hero-explore svg{width:28px;height:28px}.hero-scroll{display:none}
 html[lang=ja] .hero-cinematic h1{font-size:13vw;line-height:1.5;letter-spacing:-.065em}
 html[lang=ja] .hero-cinematic h1 .hero-title-secondary{font-size:12.6vw;white-space:normal;max-width:6em;letter-spacing:-.065em;line-height:1.55;margin:0}
 html[lang=ja] .hero-cinematic .hero-description{font-size:.78rem;line-height:1.85}
}
@media(max-width:359px){.hero-eyebrow{font-size:.55rem}.hero-explore{width:100px;height:100px;padding:16px;font-size:.65rem}.hero-cinematic .hero-description{font-size:.75rem}.hero-bottom{gap:12px}}
@media(max-height:650px) and (min-width:801px){.hero-cinematic .hero-stage{padding-top:125px;padding-bottom:24px}.hero-headline{padding:15px 0}.hero-cinematic .hero-title-line:first-child{font-size:32vh}.hero-cinematic h1 .hero-title-secondary{font-size:10vh}.hero-explore{width:100px;height:100px;font-size:.65rem;padding:16px;gap:8px}.hero-explore svg{width:26px;height:26px}}
@media(prefers-reduced-motion:no-preference){
 .hero-cinematic .hero-photo img{animation:hero-camera 1.8s cubic-bezier(.16,1,.3,1) both}
 .hero-title-line>span{animation:hero-type .95s cubic-bezier(.16,1,.3,1) both;animation-delay:.1s}
 .hero-title-secondary>span{animation-delay:.25s}
 .hero-eyebrow,.hero-bottom{animation:hero-detail .8s ease both;animation-delay:.45s}
 @keyframes hero-camera{from{transform:scale(1.12)}to{transform:scale(1)}}
 @keyframes hero-type{from{transform:translateY(115%)}to{transform:translateY(0)}}
 @keyframes hero-detail{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
}
@media(prefers-reduced-motion:reduce){.hero-explore,.hero-explore svg{transition:none}}

.hero-title-secondary .hero-ja-phrase{display:inline-block;white-space:nowrap}
/* Bright food photography, with SSP blue typography. */
.home-colour .header{color:#073b57}
.home-colour .header-inner{border-bottom-color:#073b5733}
.home-colour .header .login{color:#073b57;border-color:#073b5766}
.home-colour .hero.hero-cinematic{background:#d9e8e9;color:#073b57}
.home-colour .hero-cinematic:after{background:linear-gradient(90deg,#e0eeef9e,transparent 65%),linear-gradient(180deg,#e0eeef70,transparent 22%,transparent 80%,#e0eeef66)}
.home-colour .hero-photo img{object-position:center center;filter:none}
.home-colour .hero-eyebrow,.home-colour .hero-eyebrow p,.home-colour .hero-cinematic .hero-description{color:#073b57}
html .home-colour .hero-cinematic h1,html[lang=de] .home-colour .hero-cinematic h1{font-size:min(12.7vw,19svh,205px);line-height:.95;letter-spacing:-.075em;color:#073b57}
.home-colour .hero-title-line>span{color:#073b57}
.home-colour .hero-cinematic h1 .hero-title-secondary{font-size:min(12.7vw,19svh,205px);letter-spacing:-.075em;line-height:1;margin-top:0}
html[lang=de] .home-colour .hero-cinematic h1 .hero-title-secondary{font-size:min(10.4vw,17svh,165px)}
html[lang=ja] .home-colour .hero-cinematic h1{font-size:min(9.3vw,15svh,150px);line-height:1.35;letter-spacing:-.07em}
html[lang=ja] .home-colour .hero-cinematic h1 .hero-title-secondary{font-size:inherit;line-height:1.35;letter-spacing:-.07em}
.home-colour .hero-scroll{color:#073b57;border-color:#073b5766}
.home-colour .hero-explore:focus-visible,.home-colour .hero-scroll:focus-visible{outline-color:#073b57}
@media(max-width:800px){
 .home-colour .hero-photo img{object-position:56% center}
 .home-colour .hero-cinematic:after{background:linear-gradient(180deg,#e0eeefad,transparent 25%,#e0eeef99 50%,transparent 70%,#e0eeefb5),linear-gradient(90deg,#e0eeef8c,transparent 90%)}
 html .home-colour .hero-cinematic h1,html[lang=de] .home-colour .hero-cinematic h1{font-size:18.2vw;line-height:1.03;letter-spacing:-.075em}
 .home-colour .hero-cinematic h1 .hero-title-secondary{font-size:18.2vw;max-width:none;white-space:nowrap;line-height:1.05;letter-spacing:-.075em}
 html[lang=de] .home-colour .hero-cinematic h1 .hero-title-secondary{font-size:14vw;max-width:none;white-space:nowrap;line-height:1.08}
 html[lang=ja] .home-colour .hero-cinematic h1{font-size:13.5vw;line-height:1.5;letter-spacing:-.07em}
 html[lang=ja] .home-colour .hero-cinematic h1 .hero-title-secondary{font-size:13.5vw;line-height:1.5;max-width:none;white-space:nowrap}
}
@media(max-height:650px) and (min-width:801px){.home-colour .hero-cinematic .hero-title-line:first-child,.home-colour .hero-cinematic h1 .hero-title-secondary{font-size:17vh}}
/* Traditional table photography: warm ceramics, timber and ivory lettering. */
.home-traditional .header{color:#fff9ee}
.home-traditional .header-inner{border-bottom-color:#fff9ee40}
.home-traditional .header .login{color:#fff9ee;border-color:#fff9ee80}
.home-traditional .hero.hero-cinematic{background:#30271d;color:#fff9ee}
.home-traditional .hero-cinematic:after{background:linear-gradient(90deg,#1d1a1670,transparent 80%),linear-gradient(180deg,#171d2466,transparent 30%,transparent 70%,#1d1a1670)}
.home-traditional .hero-photo img{object-position:center 52%;filter:brightness(1.14) saturate(1.05)}
.home-traditional .hero-eyebrow,.home-traditional .hero-eyebrow p,.home-traditional .hero-cinematic .hero-description,.home-traditional .hero-title-line>span{color:#fff9ee}
html .home-traditional .hero-cinematic h1{color:#fff9ee}
.home-traditional .hero-scroll{color:#fff9ee;border-color:#fff9ee80}
.home-traditional .hero-explore:focus-visible,.home-traditional .hero-scroll:focus-visible{outline-color:#fff9ee}
.home-traditional .header.scrolled{color:var(--ink)}
.home-traditional .header.scrolled .login{color:var(--ink);border-color:var(--line)}
@media(max-width:800px){
 .home-traditional .hero-photo img{object-position:58% center}
 .home-traditional .hero-cinematic:after{background:linear-gradient(180deg,#191c2377,transparent 28%,#201b1638 48%,transparent 68%,#201b16a6),linear-gradient(90deg,#201b164d,transparent)}
}
/* A single central focal point for the traditional hero. */
.home-traditional .hero-cinematic .hero-stage{align-items:center;justify-content:center;gap:22px;padding-top:138px;padding-bottom:40px;text-align:center}
.home-traditional .hero-eyebrow{justify-content:center;gap:20px;flex-wrap:wrap}
.home-traditional .hero-eyebrow>span{border-left:1px solid #fff9ee66;padding-left:20px}
.home-traditional .hero-headline{margin:0;padding:0;width:100%}
html .home-traditional .hero-cinematic h1{font-size:min(12.7vw,16svh,190px);text-align:center}
.home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:inherit}
.home-traditional .hero-bottom{display:flex;flex-direction:column;align-items:center;gap:20px}
.home-traditional .hero-cinematic .hero-description{align-self:center;max-width:360px;padding:0;font-size:clamp(.85rem,1.1vw,1.05rem);text-align:center}
.home-traditional .hero-explore{width:120px;height:120px;padding:22px;gap:12px;font-size:.75rem}
.home-traditional .hero-explore svg{width:30px;height:30px}
.home-traditional .hero-scroll{display:none}
.home-traditional .hero-cinematic:after{background:radial-gradient(ellipse at 50% 48%,#241c1666,transparent 75%),linear-gradient(180deg,#171d2477,transparent 32%,transparent 72%,#1d1a1655)}
html[lang=de] .home-traditional .hero-cinematic h1{font-size:min(12.7vw,16svh,190px)}
html[lang=de] .home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:min(10.4vw,14svh,155px)}
html[lang=ja] .home-traditional .hero-cinematic h1{font-size:min(9.3vw,12svh,140px)}
html[lang=ja] .home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:inherit}
@media(max-width:800px){
 .home-traditional .hero-cinematic .hero-stage{padding-top:114px;padding-bottom:34px;gap:25px}
 .home-traditional .hero-eyebrow{gap:12px;font-size:.58rem;letter-spacing:.07em}
 .home-traditional .hero-eyebrow>span{padding-left:12px}
 html .home-traditional .hero-cinematic h1,html[lang=de] .home-traditional .hero-cinematic h1{font-size:min(18.2vw,13svh);line-height:1.03}
 .home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:inherit;line-height:1.05}
 html[lang=de] .home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:min(14vw,11svh)}
 html[lang=ja] .home-traditional .hero-cinematic h1,html[lang=ja] .home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:min(13.5vw,10svh);line-height:1.5}
 .home-traditional .hero-cinematic .hero-description{font-size:.82rem;max-width:270px}
 .home-traditional .hero-bottom{gap:22px}
 .home-traditional .hero-explore{width:108px;height:108px;padding:18px;font-size:.7rem}
 .home-traditional .hero-cinematic:after{background:radial-gradient(ellipse at 50% 48%,#241c1688,transparent 85%),linear-gradient(180deg,#171d2477,transparent 35%,transparent 75%,#1d1a1655)}
}
@media(max-height:650px) and (min-width:801px){
 .home-traditional .hero-cinematic .hero-stage{padding-top:120px;padding-bottom:24px;gap:14px}
 .home-traditional .hero-cinematic .hero-title-line:first-child,.home-traditional .hero-cinematic h1 .hero-title-secondary{font-size:13vh}
 .home-traditional .hero-bottom{gap:12px}
 .home-traditional .hero-explore{width:92px;height:92px;padding:15px;font-size:.64rem;gap:7px}
 .home-traditional .hero-explore svg{width:24px;height:24px}
}
