/* Okinawa: open sky, clear water, warm sand and a coral booking accent. */
:root{--ink:#103d51;--muted:#506e7a;--paper:#fffdf8;--white:#fff;--accent:#ff7957;--line:#cde3e7;--sea:#e2f7fa;--radius:8px;--ocean:#007e94;--deep-ocean:#076d87;--sand:#fbf5e8}
body{background:var(--paper)}
h2{font-family:var(--sans);font-weight:700;letter-spacing:-.015em;line-height:1.55}
.status-bar{background:#076b83;color:white}
.status-dot{background:#ffda85}
.site-header{height:90px;background:#fffffffa;border-color:#d9eaed;padding-inline:4.4vw;backdrop-filter:blur(12px)}
.brand-main{color:var(--deep-ocean)}
.brand-dot{color:var(--accent)}
.brand-sub{color:var(--deep-ocean)}
.language-select{background:#f1fafb;border-color:#d6e8ec;border-radius:7px}
.button{background:var(--accent);border-color:var(--accent);color:#153b4c;font-weight:700;box-shadow:0 5px 15px #9b35120a}
.button:hover{background:#ff926d;border-color:#ff926d;transform:translateY(-2px)}
.button-small{background:var(--deep-ocean);border-color:var(--deep-ocean);color:white}
.button-small:hover{background:#005d78;border-color:#005d78}
.text-link{color:var(--deep-ocean);border-color:#66adbb}
.text-link:hover{color:#005d78;border-color:#005d78}
.eyebrow{color:var(--deep-ocean)}
.hero.hero-okinawa{display:block;width:100%;max-width:none;margin:0;padding:0;overflow:hidden}
.hero-stage{position:relative;min-height:630px;height:clamp(630px,51.5vw,820px);isolation:isolate;background:#24a6cc}
.hero-scene{position:absolute;inset:0;z-index:-3;margin:0;overflow:hidden}
.hero-scene img{width:100%;height:100%;object-fit:cover;object-position:center 54%}
.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(2,48,79,.55) 0%,rgba(1,55,82,.26) 40%,rgba(1,55,82,0) 68%),linear-gradient(0deg,rgba(0,45,66,.2),transparent 45%)}
.hero.hero-okinawa .hero-copy{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-block:45px 50px;position:relative}
.hero-kicker{color:white;font-size:11px;letter-spacing:.2em;text-shadow:0 2px 8px #00395033}
.hero-kicker .short-line{background:#ffdb89;width:36px;height:2px}
.hero.hero-okinawa h1{font-family:var(--sans);font-weight:800;font-size:clamp(52px,5.9vw,91px);line-height:1.28;letter-spacing:-.04em;white-space:normal;max-width:9em;margin:26px 0 0;text-shadow:0 3px 22px #002e4e20}
.hero.hero-okinawa h1>.hero-line,.hero.hero-okinawa h1>.hero-second{display:block;color:white}
.hero.hero-okinawa h1 .hero-accent{color:#ffe2a6}
.hero.hero-okinawa .hero-intro{color:#fff;font-size:15px;line-height:2.05;letter-spacing:.07em;margin-top:21px;max-width:30em;text-shadow:0 2px 9px #06375244}
.hero-booking-bar{display:flex;align-items:center;gap:24px;margin-top:33px;padding:20px 22px;background:#ffffffef;border:1px solid #ffffffad;border-radius:12px;box-shadow:0 14px 44px #003f5a1c;max-width:610px;backdrop-filter:blur(10px)}
.hero.hero-okinawa .hero-rate{display:grid;grid-template-columns:auto auto;gap:2px 10px;align-items:baseline;margin:0;color:var(--ink);font-size:11px;flex-shrink:0}
.hero-rate>span{grid-column:1/-1;font-weight:600}
.hero.hero-okinawa .hero-rate strong{font:800 38px/1.1 Arial,sans-serif;letter-spacing:-.035em}
.hero.hero-okinawa .hero-rate small{font-size:10px;color:var(--muted)}
.hero-booking-button{min-height:61px;padding:15px 21px;font-size:14px;gap:24px;white-space:nowrap;box-shadow:none}
.hero-booking-button [data-i18n]{font:inherit}
.hero-place{position:absolute;right:4.3%;top:27px;color:white;font:700 38px/1.12 Arial,sans-serif;letter-spacing:-.03em;display:flex;flex-direction:column;gap:5px;text-align:right;text-shadow:0 2px 12px #03547924}
.hero-place span{font:700 8px/1.3 Arial,sans-serif;letter-spacing:.22em}
.hero-support{padding:22px 0 24px}
.hero-support-main{display:flex;align-items:center;justify-content:space-between;gap:20px}
.hero-base{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.04em}
.sea-dot{width:9px;height:9px;border-radius:50%;background:#05aab9;box-shadow:0 0 0 5px #e6f7f8;flex-shrink:0}
.hero-phone{display:flex;align-items:center;gap:15px;font-size:11px;color:var(--deep-ocean)}
.hero-phone strong{font:700 17px Arial,sans-serif;letter-spacing:.02em}
.hero-phone>span:last-child{font-size:22px}
.hero-support .rate-note{margin-top:12px;font-size:10px;line-height:1.85;max-width:85em}
.visual-note{font-size:9px;color:var(--muted);margin-top:5px}
.fact-strip{background:#e8f8fa;border-color:#c9e8ed;color:var(--deep-ocean);min-height:79px}
.fact-strip>span+span{border-color:#bbdce3}
.fact-strip small{color:#54818e}
.vehicle-section{padding-block:85px 95px}
.section-index{color:#8cd4e0}
.vehicle-heading h2{font-size:39px;line-height:1.6}
.vehicle-spec,.steps li{border-top-color:#0793a8}
.spec-top h3 strong{color:var(--deep-ocean)}
.vehicle-gallery{max-width:920px;gap:26px;margin-top:49px}
.vehicle-gallery figure{border-radius:18px;background:#eaf8fa;border:1px solid #d4edf0}
.vehicle-gallery img{height:440px}
.vehicle-gallery figcaption{color:var(--deep-ocean);padding:18px 22px}
.price-section{background:#e8f7fb;padding-block:80px}
.price-inner h2{color:var(--ink)}
.price-panel{background:var(--deep-ocean);border-radius:18px;box-shadow:0 18px 40px #00658014;padding:37px}
.price-detail{color:#e6f7fc}
.plan-footnote{color:#e6f7fc}
.button-light{background:#fff6e4;border-color:#fff6e4;color:var(--ink)}
.button-light:hover{background:#fff;border-color:#fff}
.reservation-section{background:linear-gradient(140deg,#d7f3f7,#effafb);padding-block:85px}
.reservation-intro h2{color:var(--deep-ocean)}
#reservation-calendar{border:1px solid #bfe2e9;border-radius:16px;box-shadow:0 10px 40px #056c8410}
.calendar-time{background:#f1f9fa}
.calendar-controls button{background:#f0fafb;border-color:#cee7eb}
.legend-open:before{background:#00899b!important}
.state-open{background:#dff8f6;border-color:#95d9d8;color:#006576}
.state-open:hover,.state-open:focus-visible{background:#bef1eb;border-color:#007f92}
.state-full{background:#ffe9e2;color:#9b3c29}
.state-closed{background:#e5edf0;color:#596e78}
.state-preparing{background:#f2f4f3;color:#737f80}
.howto-section{background:#fffdf8}
.step-icon{color:#019bb3}
.step-number{color:var(--deep-ocean)}
.access-section{background:var(--sand)}
.shop-card{border:1px solid #e7e7d9;border-radius:17px;box-shadow:0 10px 32px #6e876008}
.closing.section-wrap{width:100%;max-width:none;margin:0;padding:85px 22px;background:linear-gradient(120deg,#076f8a,#009baf);color:white}
.closing .eyebrow,.closing>p:last-child{color:#e8fbff}
.closing h2{color:white;font-weight:700}
.closing .button{border-color:var(--accent)}
footer{background:#f4fcfd}
.footer-inner{border-top:0}
.mobile-booking{background:#ffffffed;border-color:#cde3e7}
.mobile-booking .button{box-shadow:0 3px 12px #bf573718}
dialog{border-radius:17px}
.reservation-total{background:#e2f7fa}

/* Translated headlines keep intentional breaks without forcing overflow. */
html:not([lang=ja]) .hero.hero-okinawa h1{font-size:clamp(49px,5.4vw,82px);max-width:9.5em;letter-spacing:-.04em}
html[lang=en] .hero-second>span+span:before{content:' '}
html[lang=ko] .hero-second>span+span:before{content:' '}
html[lang=en] .hero-booking-bar{gap:18px}
html[lang=en] .hero-booking-button{font-size:13px;gap:18px}

@media(min-width:1600px){.hero.hero-okinawa .hero-copy{padding-top:48px}.hero-booking-bar{margin-top:40px}}
@media(min-width:801px) and (max-width:1100px){
  .site-header{height:88px}
  .hero-stage{height:600px;min-height:600px}
  .hero-scene img{object-position:59% center}
  .hero.hero-okinawa h1{font-size:59px}
  html:not([lang=ja]) .hero.hero-okinawa h1{font-size:52px;max-width:8.4em}
  .hero.hero-okinawa .hero-intro{font-size:13px}
  .hero-booking-bar{gap:16px;padding:17px;max-width:530px}
  .hero.hero-okinawa .hero-rate strong{font-size:31px}
  .hero.hero-okinawa .hero-rate small{grid-column:1/-1}
  .hero-booking-button{font-size:12px;gap:17px}
  .hero-place{font-size:28px}
}
@media(max-width:800px){
  html{scroll-padding-top:80px}
  .site-header{height:73px;padding-inline:22px}
  .site-header nav{top:73px;background:#fff}
  .status-bar{font-size:9px;min-height:29px}
  .brand-main{font-size:29px}
  .brand-dot{font-size:34px}
  .site-header .brand{min-width:0}
  html:not([lang=ja]) .site-header .brand-main{font-size:25px}
  .site-header .language-select{min-width:0;flex-shrink:1}
  .hero.hero-okinawa{padding:0}
  .hero-stage{height:auto;min-height:0;display:flex;flex-direction:column;background:#ecf8fb}
  .hero-scene{position:relative;inset:auto;width:100%;height:clamp(265px,70vw,460px);z-index:0}
  .hero-scene img{object-fit:cover;object-position:83% 53%;height:100%;width:100%}
  .hero-shade{display:none}
  .hero.hero-okinawa .hero-copy{width:calc(100% - 44px);height:auto;padding:23px 0 26px;justify-content:flex-start;align-items:stretch}
  .hero-kicker{color:var(--deep-ocean);font-size:8px;letter-spacing:.16em;text-shadow:none;gap:9px}
  .hero-kicker .short-line{width:23px;background:#05a5bd}
  .hero.hero-okinawa h1,html:not([lang=ja]) .hero.hero-okinawa h1{font-size:clamp(34px,8.3vw,50px);line-height:1.35;letter-spacing:-.035em;max-width:none;margin-top:14px;text-shadow:none}
  .hero.hero-okinawa h1>.hero-line,.hero.hero-okinawa h1>.hero-second{color:var(--deep-ocean)}
  .hero.hero-okinawa h1 .hero-accent{color:#057a92}
  .hero.hero-okinawa h1>.hero-line{display:inline}
  .hero.hero-okinawa h1>.hero-second{display:block}
  .hero.hero-okinawa .hero-intro{font-size:11px;color:var(--muted);line-height:1.85;letter-spacing:.035em;margin-top:11px;text-shadow:none;max-width:none}
  .hero-booking-bar{margin-top:19px;max-width:none;padding:16px;gap:14px;border-radius:10px;background:#fff;box-shadow:0 7px 22px #046b8110;justify-content:space-between}
  .hero.hero-okinawa .hero-rate{font-size:9px;gap:3px 7px;flex-shrink:1}
  .hero.hero-okinawa .hero-rate strong{font-size:29px;white-space:nowrap}
  .hero.hero-okinawa .hero-rate small{font-size:8px;grid-column:1/-1;line-height:1.4}
  .hero-booking-button{font-size:11px;min-height:61px;gap:13px;padding:12px 14px;flex-shrink:0}
  html[lang=en] .hero-booking-bar{gap:12px}
  html[lang=en] .hero-booking-button{font-size:10px;gap:9px;white-space:normal;max-width:145px}
  .hero-place{top:16px;left:20px;right:auto;text-align:left;font-size:27px;gap:4px;z-index:1}
  .hero-place span{font-size:6px}
  .hero-support{padding:19px 0 22px}
  .hero-support-main{align-items:flex-start;flex-direction:column;gap:13px}
  .hero-base{font-size:11px;gap:10px}
  .hero-phone{gap:12px;font-size:10px}
  .hero-phone strong{font-size:16px}
  .hero-support .rate-note{font-size:9px;margin-top:12px;line-height:1.9}
  .visual-note{font-size:8px;margin-top:6px}
  .fact-strip{min-height:74px;padding-inline:8px}
  .fact-strip>span{font-size:9px}
  .vehicle-section{padding-block:57px 59px}
  .vehicle-heading h2{font-size:29px}
  .vehicle-gallery{gap:12px;margin-top:30px}
  .vehicle-gallery figure{border-radius:11px}
  .vehicle-gallery img{height:280px;aspect-ratio:auto;object-fit:cover}
  .vehicle-gallery figcaption{font-size:6px;padding:12px 10px}
  .price-section,.reservation-section{padding-block:54px}
  .price-panel{padding:27px;border-radius:14px}
  #reservation-calendar{padding:18px 12px;border-radius:12px}
  .closing.section-wrap{padding:56px 22px}
  .shop-card{border-radius:13px}
  .calendar-table{border-spacing:3px}
}
@media(max-width:360px){
  .site-header{padding-inline:16px}
  .site-header .brand-main,html:not([lang=ja]) .site-header .brand-main{font-size:23px}
  .site-header .brand-dot{font-size:28px}
  .site-header .language-select{width:108px;flex-basis:108px;padding-right:18px}
  .hero.hero-okinawa .hero-copy{width:calc(100% - 32px)}
  .hero-scene{height:270px}
  .hero.hero-okinawa h1,html:not([lang=ja]) .hero.hero-okinawa h1{font-size:33px}
  .hero-booking-bar{padding:12px;gap:9px}
  .hero.hero-okinawa .hero-rate strong{font-size:27px}
  .hero-booking-button{padding:10px 11px;gap:8px;font-size:10px}
  html[lang=en] .hero-booking-button{max-width:120px}
  .vehicle-gallery img{height:230px}
  .price-panel{padding:22px}
}
