/* Geometry from the original laptop / desktop / min artboards, in CSS pixels.
   Outlined lettering and icons are referenced from the supplied XD vectors. */
.saito-hero { height:calc(100svh - 80px); min-height:688px; max-height:none; }
.saito-hero-photo { inset:auto; top:-80px; left:0; width:100%; height:auto; min-height:calc(100% + 80px); max-width:none; object-fit:cover; }
.saito-hero::after { inset:-80px auto 0 0; width:683px; background:linear-gradient(90deg,rgba(0,0,0,.60392157),rgba(118,118,118,.01176471)); }
.saito-hero-copy { inset:0; text-shadow:none; }
.saito-hero-heading { position:absolute; left:108px; top:76.985374px; width:264.462624px; height:414.327988px; display:block; }
.saito-hero-lettering { display:block; width:100%; height:100%; }
.saito-hero-lead { position:absolute; top:527.014648px; left:98px; width:285px; margin:0; font-size:14px; font-weight:600; line-height:22px; letter-spacing:0; }
.saito-pickup { width:856px; height:191px; min-height:0; padding:0; bottom:0; background:none; }
.saito-pickup::before { content:""; position:absolute; inset:32px 0 0 30px; background:rgba(255,255,255,.9); z-index:-1; }
.saito-pickup-label { left:30px; top:14px; width:274px; height:32px; padding:0 0 0 57px; font-size:16px; font-weight:800; line-height:32px; color:#355e3b; white-space:nowrap; }
.saito-pickup-badge { position:absolute; top:0; left:0; width:81.47622px; height:63.984917px; }
.saito-pickup > a { position:absolute; top:57px; left:55px; width:578px; gap:15px; }
.saito-pickup > a > img { flex:0 0 100px; width:100px; height:100px; }
.saito-pickup > a > span { flex:1; min-width:0; }
.saito-pickup time { margin:0 0 4px; font-size:14px; line-height:16px; color:#777; }
.saito-pickup strong { font-size:18px; font-weight:800; line-height:26px; -webkit-line-clamp:1; }
.saito-pickup-excerpt { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; margin-top:7px; font-size:12px; line-height:18px; }
.saito-pickup-close { position:absolute; top:14px; right:167px; width:36px; height:36px; padding:0; border:0; background:none; box-shadow:none; }
.saito-pickup-close svg { display:block; width:36px; height:36px; }
.saito-pickup[hidden] { display:none; }
.saito-intro { height:972.423828px; min-height:0; padding:0; background:none; }
.saito-intro::before { content:""; position:absolute; left:0; top:384px; width:100%; height:588.423615px; z-index:-1; opacity:.7; background:url(../images/paper.webp) 0 -4.05px/100% auto no-repeat; mask:url(../images/home-intro-mask.svg) 0 0/100% 100% no-repeat; }
.saito-intro::after { display:none; }
.saito-intro-photo-frame { position:absolute; top:0; left:0; width:100%; height:384px; overflow:hidden; z-index:-1; }
.saito-intro-photo-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,255,255,.50196078),transparent); }
.saito-intro-photo { position:absolute; inset:0; width:100%; height:384px; object-fit:cover; object-position:50% 77.278%; mask:none; }
.saito-intro-inner { position:relative; width:min(1596px,calc(100% - 196px)); height:100%; padding:0; display:block; }
.saito-intro h2.saito-intro-title { position:absolute; top:90px; left:0; margin:0; width:78px; height:584.184509px; }
.saito-intro-lettering { display:block; width:100%; height:100%; }
.saito-intro-copy { position:absolute; top:365.092285px; left:124px; width:491.67099px; max-width:none; margin:0; }
.saito-intro-copy h3 { font-size:30px; font-weight:600; line-height:42px; letter-spacing:0; margin:0 0 14px; text-shadow:0 3px 3px #ffffff80; }
.saito-intro-copy > p { font-size:16px; line-height:32px; letter-spacing:.05em; margin:0; width:100%; margin-left:.32901px; }
.saito-intro-copy > .saito-intro-mobile-copy { display:none; }
.saito-intro-buttons { position:absolute; top:105px; left:532px; right:auto; bottom:auto; gap:7px; }
.saito-intro-buttons .saito-button { width:232px; height:59px; min-width:0; min-height:0; padding:3px 23px 0 20px; border:0; box-shadow:none; font-size:16px; font-weight:600; line-height:24px; letter-spacing:0; position:relative; white-space:nowrap; gap:10px; }
.saito-intro-buttons .saito-button::before { content:""; position:absolute; inset:3px 3px 0 0; border:1px solid #355e3b; pointer-events:none; }
.saito-intro-buttons .saito-button::after { content:""; position:absolute; inset:0 0 3px 3px; border:1px solid #355e3b; pointer-events:none; }
.saito-intro-buttons svg { flex:0 0 10px; width:10px; height:10.5px; overflow:visible; }
.saito-intro-buttons .saito-button:hover svg { filter:brightness(0) invert(1); }
.saito-intro-map { position:absolute; right:-49.73996px; top:90px; width:414.247162px; height:547.373615px; margin:0; }
@media(min-width:1600px) {
 .saito-hero-photo { width:calc(100% + .9375px); }
 .saito-hero-heading { left:135.535522px; top:120.276367px; width:401.97142px; height:629.760132px; }
 .saito-hero-lead { left:140px; top:804.014648px; width:398px; font-size:16px; line-height:27px; }
 .saito-pickup { bottom:-2px; }
 .saito-intro { height:954.423828px; }
 .saito-intro::before { height:570.423615px; background-position:0 -4.756px; mask-image:url(../images/home-intro-mask-wide.svg); }
 .saito-intro-photo { object-position:50% 72.543505%; }
 .saito-intro-copy { left:174px; width:615.671021px; }
 .saito-intro-buttons { left:679px; top:93px; }
 .saito-intro-map { right:50.26004px; }
}
@media(min-width:1600px) and (max-height:1000px) {
 .saito-hero { min-height:1000px; }
}
@media(min-width:1600px) and (max-width:1919px) {
 .saito-intro-buttons { position:relative; left:0; top:auto; width:100%; margin-top:20px; flex-direction:row; }
}
@media(min-width:601px) and (max-width:1250px) {
 .saito-hero-heading { left:50px; width:230px; height:360.334px; }
 .saito-hero-lead { left:50px; top:470px; }
 .saito-pickup { width:min(856px,100%); }
 .saito-pickup > a { width:calc(100% - 165px); }
 .saito-pickup-close { right:35px; }
 .saito-intro-inner { width:calc(100% - 60px); }
 .saito-intro-copy { left:100px; width:calc(100% - 100px); }
 .saito-intro-map { right:0; width:200px; height:auto; }
 .saito-intro-buttons { position:relative; left:0; top:auto; margin-top:20px; width:100%; flex-direction:row; }
 .saito-intro-buttons .saito-button { width:calc((100% - 7px)/2); }
}
@media(max-width:600px) {
 .saito-hero { height:calc(100svh - 66px); min-height:733px; }
 .saito-hero-photo { top:-64px; height:calc(100% + 64px); min-height:0; width:100%; object-fit:cover; object-position:22.574% 50%; }
 .saito-hero::after { top:-64px; width:50%; }
 .saito-hero-heading { left:30px; top:88.985374px; width:166.314663px; height:260.561598px; }
 .saito-hero-lead { left:30px; top:364.546997px; width:166.5px; margin:0; font-size:12px; line-height:22px; }
 .saito-pickup { width:100%; height:191px; bottom:-2px; }
 .saito-pickup::before { inset:32px 0 0; }
 .saito-pickup-label { left:35px; top:16px; width:248px; height:30px; padding-left:57px; font-size:14px; line-height:30px; }
 .saito-pickup-badge { left:5px; }
 .saito-pickup > a { left:16px; top:61px; width:247px; gap:13px; }
 .saito-pickup > a > img { flex-basis:80px; width:80px; height:80px; }
 .saito-pickup time { font-size:14px; line-height:16px; margin-bottom:8px; }
 .saito-pickup strong { font-size:16px; line-height:22px; -webkit-line-clamp:3; }
 .saito-pickup-excerpt { display:none; }
 .saito-pickup-close { top:13px; right:30px; }
 .saito-intro { height:1299.731323px; }
 .saito-intro::before { height:915.73111px; background-size:1366px auto; background-position:0 -704.972px; mask-image:url(../images/home-intro-mask-mobile.svg); }
 .saito-intro-photo-frame { width:calc(100% + 3px); left:-3px; }
 .saito-intro-photo-frame::after { background:linear-gradient(90deg,rgba(255,255,255,.50196078),transparent); }
 .saito-intro-photo { object-position:center; transform:translateY(-35.099px) scale(1.157878); }
 .saito-intro-inner { width:calc(100% - 40px); }
 .saito-intro h2.saito-intro-title { left:10px; top:234px; width:39px; height:292.092255px; }
 .saito-intro-copy { left:69px; top:370px; width:calc(100% - 79px); max-width:none; }
 .saito-intro-copy h3 { font-size:23px; line-height:32px; letter-spacing:0; margin-bottom:20px; }
 .saito-intro-copy > .saito-intro-desktop-copy { display:none; }
 .saito-intro-copy > .saito-intro-mobile-copy { display:block; font-size:16px; line-height:27px; letter-spacing:.05em; margin-left:1px; }
 .saito-intro-map { left:30.0343px; right:auto; top:721px; width:283.813px; height:375.02187px; }
 .saito-intro-buttons { top:744px; left:-69px; width:calc(100% + 79px); bottom:auto; flex-direction:row; gap:8px; }
 .saito-intro-buttons .saito-button { width:calc((100% - 8px)/2); height:58px; font-size:16px; padding:2px 20px 0; }
}
@media(max-width:360px) {
 .saito-pickup-label { font-size:12px; width:225px; }
 .saito-pickup > a { width:calc(100% - 112px); }
 .saito-intro-copy { left:59px; width:calc(100% - 59px); }
 .saito-intro-map { left:0; width:min(283.813px,100%); }
 .saito-intro { height:1450px; }
 .saito-intro::before { height:1066px; }
 .saito-intro-map { top:815px; }
 .saito-intro-buttons { top:920px; }
 .saito-intro-buttons { left:-59px; width:calc(100% + 59px); }
 .saito-intro-buttons .saito-button { font-size:14px; padding-inline:12px; }
}

/* Original XD auto-animate: r5 -> r155, centered at (115,28), .8s ease-out.
   The moving circle is clipped separately, keeping both original frames visible. */
.saito-xd-button { isolation:isolate; }
.saito-xd-button .saito-button-fill { position:absolute; inset:3px 3px 0 0; border-radius:2px; overflow:hidden; z-index:-1; pointer-events:none; }
.saito-xd-button .saito-button-fill::before { content:""; position:absolute; left:calc(50% + .5px); top:50%; width:max(310px,calc(100% + 56px)); aspect-ratio:1; border-radius:50%; background:#385132; transform:translate(-50%,-50%) scale(.032258064516); opacity:.000849686; transition:transform .8s ease-out,opacity .8s ease-out; }
.saito-intro-buttons .saito-button.saito-xd-button { transition:color .8s ease-out; }
.saito-intro-buttons .saito-button.saito-xd-button:is(:hover,:focus-visible) { background:transparent; color:#fff; }
.saito-xd-button:is(:hover,:focus-visible) .saito-button-fill::before { transform:translate(-50%,-50%) scale(1); opacity:1; }
.saito-xd-button svg { transition:filter .8s ease-out; }
.saito-intro-buttons .saito-xd-button:focus-visible svg { filter:brightness(0) invert(1); }
@media(prefers-reduced-motion:reduce) { .saito-xd-button,.saito-xd-button svg,.saito-xd-button .saito-button-fill::before { transition:none!important; } }

/* Desktop first view: header and hero together retain a 16:9 ratio. */
@media (width > 600px) {
 .saito-hero { height:auto; min-height:0; max-height:none; container-type:inline-size; }
 .saito-hero::before { content:""; display:block; padding-top:calc(56.25% - var(--saito-header)); }
 .saito-hero-heading { left:clamp(24px,7.9cqw,135.535522px); top:5.64cqw; width:19.36cqw; height:auto; aspect-ratio:264.462624 / 414.327988; }
 .saito-hero-lead { left:clamp(24px,7.18cqw,140px); top:38.6cqw; }
}
@media (min-width:1366px) {
 .saito-hero-heading { left:clamp(108px,calc(4.97cqw + 40.1px),135.535522px); top:clamp(76.985374px,calc(7.81cqw - 29.7px),120.276367px); width:clamp(264.462624px,calc(24.82cqw - 74.57px),401.97142px); }
 .saito-hero-lead { left:clamp(98px,calc(7.58cqw - 5.55px),140px); top:clamp(527.014648px,calc(50cqw - 156px),804.014648px); }
}
@media (width > 600px) and (max-width:850px) {
 .saito-hero-heading { left:24px; top:16px; width:19cqw; }
 .saito-hero-lead { left:calc(19cqw + 44px); top:8px; width:calc(81cqw - 60px); font-size:12px; line-height:19px; }
 .saito-pickup { width:calc(81% - 40px); }
 .saito-pickup > a { width:calc(100% - 165px); }
 .saito-pickup-close { right:35px; }
 .saito-pickup-excerpt { -webkit-line-clamp:2; }
}
@media (width > 850px) and (max-width:1250px) {
 .saito-pickup { width:55%; }
}

/* Pickup remains visible while scrolling; keep it below navigation overlays. */
.saito-home ~ .saito-pickup { position:fixed; bottom:max(0px, env(safe-area-inset-bottom)); z-index:20; isolation:isolate; }
.saito-home ~ .saito-pickup[hidden] { display:none; }
.saito-home ~ .saito-pickup > a > .saito-pickup-image { display:block; flex:0 0 100px; width:100px; height:100px; background:#ddd; overflow:hidden; }
.saito-home ~ .saito-pickup .saito-pickup-image img { display:block; width:100%; height:100%; object-fit:cover; }
@media (max-width:767px) { .saito-home ~ .saito-pickup > a > .saito-pickup-image { flex-basis:80px; width:80px; height:80px; } }

.saito-hero-video[hidden] { display:none; }