*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#f7f3e9;color:#432f25;font-family:'Noto Serif JP','Yu Mincho',serif;line-height:1.9}a{color:inherit;text-decoration:none}img{display:block;width:100%;object-fit:cover}h1,h2,h3,p{margin:0}h2{font-size:clamp(25px,2.8vw,40px);line-height:1.6;font-weight:900}a:focus-visible{outline:3px solid #bd8d32;outline-offset:5px}.button{display:inline-flex;justify-content:center;align-items:center;background:#62412e;color:#fff;padding:12px 22px;min-height:48px;font-weight:900;border-radius:2px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 5%}.brand{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-size:34px;font-weight:900;line-height:1}.brand-mark{width:58px;height:46px;flex:none}.brand small{display:block;font:700 8px/1.6 Arial;letter-spacing:.1em;margin-top:6px}nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:900}.recruit-hero{position:relative;height:650px;overflow:hidden}.recruit-hero>img{height:100%;object-position:center 40%}.ribbon{position:absolute;top:12%;left:0;background:#076e76f5;color:#fff;padding:36px 5%;transform:skewY(-8deg)}.ribbon>*{transform:skewY(8deg)}.ribbon h1{font-size:clamp(34px,4.5vw,64px);line-height:1.6;letter-spacing:.04em}.ribbon p{font:600 13px Arial;letter-spacing:.28em;margin-bottom:18px}.handwriting{position:absolute;bottom:35px;left:5%;font:32px/1.1 Caveat,cursive;text-shadow:0 0 5px #fff}.intro{padding:70px 6%;text-align:center}.eyebrow{font:600 13px/1.5 Arial;letter-spacing:.18em;margin-bottom:16px;color:#8a542f}.intro>p:last-child{margin-top:20px;font-size:17px}.stories{max-width:1440px;margin:auto}.story-row{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center;padding:46px 5% 60px}.story-row:nth-child(even){background:#eee5d9}.reverse .framed{order:2}.copy{padding:12px 0}.copy>p:last-child{font-size:17px;line-height:2;margin-top:24px}.chapter{font:clamp(40px,6.5vw,88px)/1 Georgia;color:#c8b58e;margin-bottom:24px;white-space:nowrap}.chapter span{font-size:.5em;vertical-align:top;font-style:italic}.framed{position:relative}.framed>img{height:400px}.framed:after{content:'';position:absolute;inset:-14px 22px 14px -14px;border:2px solid #b78a31;pointer-events:none}.reverse .framed:after{border-color:#076e76;inset:-14px -14px 14px 22px}.scenery{margin-bottom:50px}.scenery .inset{position:absolute;width:48%;height:220px;right:-20px;bottom:-50px;border:5px solid #f7f3e9;z-index:1}.apply{background:#62412e;color:#fff9ee;text-align:center;padding:64px 6%}.apply .eyebrow{color:#e5c793}.apply>p{margin-top:20px}.store-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:960px;margin:32px auto 0}.store-grid article{padding:24px;background:#ffffff08;border:1px solid #ffffff40}.store-grid h3{font-size:24px;margin-bottom:16px}.store-grid .button{width:100%}.ocean{background:#076e76}.gold{background:#90691f}.store-grid p{margin:12px 0}.store-grid a:last-child{font-size:14px;text-decoration:underline;text-underline-offset:5px}footer{padding:40px 6%;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}footer p,footer small{font-size:12px}footer p{width:100%;text-align:center}footer small{margin:auto}@media(max-width:900px){header{flex-wrap:wrap}nav{gap:18px}.recruit-hero{height:560px}.framed>img{height:300px}.chapter{font-size:44px}.story-row{gap:7%}.copy>p:last-child{font-size:16px}}@media(max-width:600px){header{padding:14px 5%;gap:16px}.brand{font-size:28px}.brand-mark{width:45px;height:36px}nav{width:100%;justify-content:space-between;gap:8px;font-size:12px}nav .button{padding:8px 12px;min-height:44px}.recruit-hero{height:580px}.recruit-hero>img{object-position:60% center}.ribbon{top:28px;padding:24px 6%;width:94%}.ribbon h1{font-size:32px}.ribbon p{font-size:11px;margin-bottom:10px}.handwriting{font-size:25px;bottom:20px}.intro{padding:42px 6%}.intro h2{font-size:25px}.intro>p:last-child{font-size:16px;text-align:left}.story-row{grid-template-columns:1fr;gap:28px;padding:32px 7% 44px}.reverse .framed{order:0}.framed>img{height:280px}.copy h2{font-size:27px}.chapter{font-size:50px;margin-bottom:18px}.copy>p:last-child{margin-top:18px}.scenery .inset{right:-10px;width:48%;height:165px}.apply{padding:44px 6%}.apply h2{font-size:26px}.store-grid{grid-template-columns:1fr;gap:20px}.store-grid article{padding:22px 18px}footer{justify-content:center;text-align:center}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:600px){.recruit-hero{height:auto;display:flex;flex-direction:column;background:#076e76}.ribbon{position:relative;order:-1;top:auto;width:100%;transform:none;padding:26px 6%}.ribbon>*{transform:none}.recruit-hero>img{height:340px;object-position:70% center}.ribbon h1{font-size:30px}.handwriting{display:none}.intro h2{text-wrap:balance}.story-row{min-width:0}.copy{min-width:0}.chapter{font-size:46px}}.story-row>*{min-width:0}.framed img{max-width:100%}.recruit-hero>img{min-width:0}.intro h2{word-break:normal;overflow-wrap:normal}
.reverse .framed>img{object-position:center 25%}

.recruit-hero-picture{display:block;width:100%;height:100%;min-width:0}.recruit-hero-picture>img{width:100%;height:100%;object-fit:cover;object-position:center 40%}@media(max-width:600px){.recruit-hero-picture{height:auto;flex:none}.recruit-hero-picture>img{height:auto;aspect-ratio:2/3;object-fit:contain;object-position:center}}

/* Keep both faces and the serving tray in frame on desktop and tablet. */
@media(min-width:601px){.recruit-hero{height:clamp(560px,54vw,1040px)}.recruit-hero-picture>img{object-position:right top}}
@media(min-width:601px){.ribbon{width:40%;padding:30px 4%}.ribbon h1{font-size:clamp(22px,3vw,58px)}.ribbon p{font-size:clamp(9px,.8vw,13px)}}

/* Mobile headline sits directly over the sky, without a solid banner. */
@media(max-width:600px){
 .recruit-hero{display:block;background:transparent}
 .recruit-hero .ribbon{position:absolute;top:18px;left:6%;width:auto;max-width:88%;padding:0;background:transparent;color:#103f4b;transform:none;text-shadow:0 1px 5px rgba(255,255,255,.85)}
 .recruit-hero .ribbon p{font-size:10px;letter-spacing:.18em;margin-bottom:10px}
 .recruit-hero .ribbon h1{font-size:clamp(22px,6vw,32px);line-height:1.65;letter-spacing:.015em}
}
@media(max-width:360px){.recruit-hero .ribbon{top:10px}.recruit-hero .ribbon p{font-size:8px;line-height:1.2;margin-bottom:7px}.recruit-hero .ribbon h1{font-size:18px;line-height:1.4}}

/* Keep the label and heading on one alignment; skew only the backdrop. */
.recruit-hero .ribbon{transform:none;isolation:isolate}
.recruit-hero .ribbon>p,.recruit-hero .ribbon>h1{transform:none;margin-left:0;margin-right:0;text-align:left}
@media(min-width:601px){
 .recruit-hero .ribbon{background:transparent}
 .recruit-hero .ribbon::before{content:"";position:absolute;inset:0 0 -6vw;z-index:-1;background:#076e76f5;transform:skewY(-8deg);transform-origin:left top}
}
@media(max-width:600px){.recruit-hero .ribbon::before{content:none}.recruit-hero .ribbon>p{padding:0;text-indent:0}}
