/* Sample 07: nationwide opening, velvet applications and full-body mobile concierge. */
.hero{align-items:flex-start;justify-content:center;min-height:760px;height:100dvh;padding:156px 44px 108px}
.hero-content{max-width:900px;width:100%;text-align:center;margin:0;padding:0}
.hero .hero-origin{font-size:12px;line-height:1.7;font-weight:500;letter-spacing:.15em;color:#e6d8b6;margin:0 0 12px;text-shadow:0 2px 12px #000}
.hero h1{font-size:56px;line-height:1.35;letter-spacing:-.055em;margin:0 0 14px;max-width:none}
.hero .hero-nationwide{font-size:26px;line-height:1.5;font-weight:700;letter-spacing:-.045em;color:#fff;margin:0 0 8px;text-shadow:0 2px 14px #000a;word-break:keep-all}
.hero .hero-description{font-size:17px;line-height:1.7;margin:0 0 15px;color:#f4f3f0;max-width:none}
.hero-credentials{display:flex;justify-content:center;gap:0;list-style:none;padding:0;margin:0 0 20px;color:#ead8ad;font-size:12px;letter-spacing:-.01em;line-height:1.8}
.hero-credentials li+li::before{content:"";display:inline-block;width:1px;height:11px;background:#ddc79266;vertical-align:middle;margin:0 17px}
.hero-buttons{flex-direction:row;align-items:center}
.hero-buttons .btn{padding:13px 24px;font-size:14px;min-height:48px}
.curtain-poster{object-fit:contain;object-position:center bottom;background:#101b2a;mask-image:linear-gradient(to bottom,transparent 18%,#000 38%);-webkit-mask-image:linear-gradient(to bottom,transparent 18%,#000 38%)}
.hero-shade{background:linear-gradient(180deg,#0b1424 0%,#0b1424d9 20%,#050b1859 38%,#050b181a 55%,#050b1800 75%,#050b1877 100%)}
.hero-showcase-caption{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:4;width:min(730px,calc(100% - 350px));text-align:center;color:#fff;opacity:0;transition:opacity .8s;pointer-events:none;text-shadow:0 2px 10px #000}
.hero[data-state="curtain"] .hero-showcase-caption,.hero[data-state="blocked"] .hero-showcase-caption{opacity:1}
.hero-showcase-caption p{font-size:18px;font-weight:500;letter-spacing:-.035em;margin:0 0 6px}
.hero-showcase-caption>span{display:block;font-size:11px;line-height:1.8;color:#eee7db;word-break:keep-all}
.hero-showcase-caption small{display:block;font-size:9px;line-height:1.7;margin-top:3px;color:#dfded9}
.hero-scroll-link{left:auto;right:150px;transform:none}
.order-offline-label{grid-column:1 / -1;margin:0 0 -12px;font-size:12px;font-weight:500;color:#374657}
.order-offline-label span{font-size:10px;font-weight:400;margin-left:12px;color:#747568}
/* Lower the desktop photograph beneath a soft, image-relative top fade.
   Keep feet visible in short PC windows; leave touch-phone landscapes intact. */
@media(min-width:901px) and (min-height:501px),(min-width:901px) and (pointer:fine){
 .hero h1{font-size:clamp(42px,min(4vw,7.2dvh),56px)}
 .curtain-poster{inset:auto 0 calc(max(0px,100% - 100dvh) - clamp(40px,8dvh,90px));width:100%;height:auto;max-height:min(100%,100dvh);background:transparent;mask-image:linear-gradient(to bottom,transparent 0%,#00000026 6%,#000 16%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#00000026 6%,#000 16%)}
 .hero[data-state="curtain"] .hero-shade,.hero[data-state="blocked"] .hero-shade{background:linear-gradient(180deg,#0b1424 0%,#0b1424d9 16dvh,#050b180a min(26dvh,calc(18dvh + 90px)),#050b180a 65%,#050b1866 100%)}
}
@media(min-width:901px) and (max-width:1180px){
 .hero{padding:140px 142px 100px 32px;min-height:740px}
 .hero-content{margin-right:0}
 .hero h1{font-size:46px}.hero .hero-nationwide{font-size:23px}.hero .hero-description{font-size:15px}
 .hero-showcase-caption{width:calc(100% - 330px)}.hero-showcase-caption>span{font-size:10px}
}
@media(max-width:900px){
 .hero{height:min(760px,calc(100svh - var(--concierge-height)));min-height:620px;padding:94px 25px 93px}
 .hero-content{max-width:700px;margin:0;padding:0}
 .hero h1{font-size:43px;line-height:1.4;margin:0 0 12px;max-width:none}
 .hero .hero-origin{font-size:10px;letter-spacing:.1em;margin-bottom:10px}
 .hero .hero-nationwide{font-size:23px;margin-bottom:7px}
 .hero .hero-description{font-size:14px;line-height:1.8;margin-bottom:12px}
 .hero-credentials{font-size:11px;margin-bottom:16px}
 .hero-buttons .btn{padding:11px 21px;font-size:13px;min-height:44px}
 .hero-showcase-caption{bottom:62px;width:calc(100% - 50px)}
 .hero-showcase-caption p{font-size:15px;margin-bottom:4px}.hero-showcase-caption>span{font-size:10px}.hero-showcase-caption small{font-size:8px}
 .concierge-character{height:144px;width:86px}
}
@media(max-width:600px){
 .hero{height:min(690px,calc(100svh - var(--concierge-height)));min-height:620px;padding:87px 20px 88px}
 .hero h1{font-size:clamp(27px,8.2vw,35px);line-height:1.4;letter-spacing:-.055em;margin:0 0 12px}
 .hero .hero-origin{font-size:9px;letter-spacing:.08em;margin-bottom:9px}
 .hero .hero-nationwide{font-size:20px;line-height:1.5;max-width:330px;margin:0 auto 9px;word-break:keep-all}
 .hero .hero-description{font-size:12px;line-height:1.7;margin-bottom:12px;max-width:none}
 .hero-credentials{font-size:10px;margin-bottom:16px;white-space:nowrap}
 .hero-credentials li+li::before{height:9px;margin:0 11px}
 .hero-buttons{gap:10px}.hero-buttons .btn{font-size:12px;padding:10px 14px;gap:8px}
 .curtain-poster{object-position:center calc(100% + 40px)}
 .hero-showcase-caption{width:calc(100% - 36px);bottom:59px}
 .hero-showcase-caption p{font-size:14px}.hero-showcase-caption>span{font-size:9px;line-height:1.8}.hero-showcase-caption small{font-size:8px}
 .hero-shade{background:linear-gradient(180deg,#0b1424 0%,#0b1424bb 20%,#050b1855 35%,#050b181a 52%,#050b1800 70%,#050b1899)}
 .order-offline-label{margin-bottom:-7px}.order-offline-label span{display:block;margin:5px 0 0}
}
@media(max-width:350px){
 .hero{padding-left:15px;padding-right:15px}
 .hero .hero-origin{font-size:8px}.hero .hero-nationwide{font-size:18px;max-width:280px}.hero .hero-description{font-size:11px}
 .hero-credentials{font-size:9px}.hero-credentials li+li::before{margin:0 9px}.hero-buttons .btn{font-size:11px;padding:10px 13px}
 .hero-showcase-caption>span{font-size:8px}.hero-showcase-caption small{font-size:7px}
}
@media(max-height:500px) and (max-width:900px){
 .hero{height:calc(100svh - var(--concierge-height));min-height:312px;padding:76px 85px 52px}
 .hero{padding-left:24px;padding-right:24px}
 .hero-content{max-width:44%;margin:0 auto 0 0;text-align:left}
 .hero-credentials,.hero-buttons{justify-content:flex-start}
 .hero .hero-origin{font-size:8px;margin-bottom:3px}.hero h1{font-size:28px;margin-bottom:3px}
 .hero .hero-nationwide{font-size:17px;margin-bottom:3px}.hero .hero-description{font-size:11px;margin-bottom:5px}
 .hero-credentials{font-size:9px;margin-bottom:7px}.hero-credentials li+li::before{margin:0 12px}
 .hero-buttons .btn{font-size:10px;min-height:32px;padding:6px 13px}
 .hero-showcase-caption{display:none}
 .curtain-poster{left:48%;width:52%;object-position:center center;mask-image:none;-webkit-mask-image:none}
 .hero[data-state="curtain"] .hero-shade,.hero[data-state="blocked"] .hero-shade{background:linear-gradient(90deg,#0b1424 0%,#0b1424 44%,#0b142433 56%,transparent 72%)}
 .concierge-character{height:74px;width:50px}
}
@media(prefers-reduced-motion:reduce){.hero-showcase-caption{transition:none}}