/* =========================================================
   075 〇〇庵 — 温泉旅館（古民家系）
   Color: navy #0d2845 / gold #c9a96e / washi #f5f0e6 / sumi #1a1a1a
   Font : Cormorant Garamond × Shippori Mincho × Inter
   ========================================================= */

:root{
  --navy:#0d2845;
  --navy-deep:#081c33;
  --navy-soft:#15375c;
  --gold:#c9a96e;
  --gold-soft:#dcc18a;
  --washi:#f5f0e6;
  --washi-warm:#ece5d4;
  --sumi:#1a1a1a;
  --line:rgba(201,169,110,.32);
  --line-soft:rgba(13,40,69,.12);
  --shadow:0 18px 60px rgba(13,40,69,.18);
  --serif-en:'Cormorant Garamond', serif;
  --serif-jp:'Shippori Mincho', serif;
  --sans:'Inter','Hiragino Kaku Gothic ProN','Noto Sans JP',system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  font-family:var(--serif-jp);
  color:var(--sumi);
  background:var(--washi);
  line-height:1.85;
  font-feature-settings:"palt";
  overflow-x:hidden;
  letter-spacing:.04em;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;transition:opacity .25s ease;}
a:hover{opacity:.7;}

.container{
  width:min(1200px,92%);
  margin-inline:auto;
}

/* ─── DEMO BAR ─────────────────────────────────────── */
#demo-bar{
  position:fixed;top:0;left:0;right:0;z-index:1500;
  background:rgba(8,28,51,.96);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,169,110,.25);
  padding:7px 0;
}
.demo-bar-inner{
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-size:.7rem;color:rgba(245,240,230,.55);
  font-family:var(--sans);
  letter-spacing:.05em;
}
.demo-badge{
  font-size:.54rem;font-weight:700;letter-spacing:.18em;
  background:rgba(201,169,110,.18);color:var(--gold);
  padding:3px 10px;flex-shrink:0;text-transform:uppercase;
}
.demo-link{color:var(--gold);font-weight:600;text-decoration:underline;text-underline-offset:3px;}
.demo-copy{color:rgba(245,240,230,.3);font-size:.62rem;margin-left:4px;}
@media(max-width:640px){.demo-copy{display:none;}}

/* ─── HEADER（フローティング）───────────────────────── */
.site-header{
  position:fixed;top:36px;left:0;right:0;z-index:1100;
  padding:18px 0;
  transition:background .3s ease,padding .3s ease;
}
.site-header.is-scrolled{
  background:rgba(8,28,51,.92);
  backdrop-filter:blur(14px);
  padding:12px 0;
  border-bottom:1px solid rgba(201,169,110,.18);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  width:min(1320px,94%);margin-inline:auto;
}
.brand{
  display:flex;flex-direction:column;line-height:1;color:var(--washi);
}
.brand-en{
  font-family:var(--serif-en);font-style:italic;font-size:1.55rem;
  letter-spacing:.08em;color:var(--gold);font-weight:500;
}
.brand-jp{
  font-family:var(--serif-jp);font-size:.78rem;
  letter-spacing:.42em;color:var(--washi);margin-top:6px;
  padding-left:2px;
}
.is-scrolled .brand-en{color:var(--gold);}
.is-scrolled .brand-jp{color:var(--washi);}

.header-nav{
  display:flex;align-items:center;gap:34px;
}
.header-nav a{
  font-family:var(--sans);
  font-size:.74rem;letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--washi);
  position:relative;padding:6px 0;
}
.header-nav a::after{
  content:'';position:absolute;left:0;bottom:0;
  width:0;height:1px;background:var(--gold);
  transition:width .35s ease;
}
.header-nav a:hover{opacity:1;}
.header-nav a:hover::after{width:100%;}
.header-cta,
.header-nav a.header-cta{
  font-family:var(--sans);
  display:inline-flex;align-items:center;gap:8px;
  padding:11px 22px;
  background:transparent;
  color:var(--gold)!important;
  border:1px solid var(--gold);
  font-size:.7rem;letter-spacing:.24em;
  transition:all .35s ease;
}
.header-cta::after,
.header-nav a.header-cta::after{display:none!important;}
.header-cta:hover,
.header-nav a.header-cta:hover{background:var(--gold);color:var(--navy-deep)!important;opacity:1;}

/* ハンバーガー */
.mobile-toggle{
  display:none;
  width:38px;height:38px;
  border:none;background:transparent;cursor:pointer;
  position:relative;z-index:1200;
}
.mobile-toggle span{
  position:absolute;left:8px;right:8px;height:1px;
  background:var(--washi);
  transition:transform .3s ease,opacity .3s ease,top .3s ease;
}
.mobile-toggle span:nth-child(1){top:13px;}
.mobile-toggle span:nth-child(2){top:18px;}
.mobile-toggle span:nth-child(3){top:23px;}
.mobile-toggle.is-open span:nth-child(1){top:18px;transform:rotate(45deg);}
.mobile-toggle.is-open span:nth-child(2){opacity:0;}
.mobile-toggle.is-open span:nth-child(3){top:18px;transform:rotate(-45deg);}

/* ─── HERO（フルブリード×和ラグジュアリー）────────────── */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  color:var(--washi);
  isolation:isolate;
}
.hero-bg{
  position:absolute;inset:0;z-index:-2;
  background:linear-gradient(180deg,#0d2845 0%,#1c4470 35%,#3a6a93 60%,#7d9fb4 100%);
}
.hero-bg::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 25% 70%, rgba(201,169,110,.18), transparent 55%),
    radial-gradient(ellipse at 80% 30%, rgba(255,255,255,.08), transparent 60%);
}
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background:url('../images/hero.jpg') center/cover no-repeat;
  opacity:0;
  transition:opacity 1.2s ease;
}
.hero-bg.has-image::after{opacity:1;}
.hero-overlay{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(8,28,51,.55) 0%,rgba(8,28,51,.3) 40%,rgba(8,28,51,.7) 100%);
}

/* 上部金箔ライン */
.hero-top-line{
  position:absolute;top:120px;left:0;right:0;
  display:flex;align-items:center;justify-content:center;gap:18px;
  font-family:var(--serif-en);
  font-size:.78rem;letter-spacing:.4em;
  color:var(--gold);font-style:italic;
  z-index:2;
}
.hero-top-line::before,
.hero-top-line::after{
  content:'';flex:0 0 64px;height:1px;background:var(--gold);opacity:.7;
}

/* 下部金箔ライン */
.hero-bottom-line{
  position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);
  opacity:.5;
}

/* 縦書きアクセント */
.hero-vertical{
  position:absolute;right:4vw;top:50%;
  transform:translateY(-50%);
  writing-mode:vertical-rl;
  font-family:var(--serif-jp);
  font-size:.82rem;
  letter-spacing:.6em;
  color:var(--gold-soft);
  z-index:2;
  display:flex;flex-direction:column;gap:32px;
}
.hero-vertical span{display:inline-block;}

.hero-content{
  position:relative;z-index:3;
  width:min(1100px,90%);
  text-align:center;
  padding-top:32px;
}
.hero-eyebrow{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.85rem;letter-spacing:.42em;
  color:var(--gold);
  margin-bottom:32px;
}
.hero-title{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:clamp(48px,8vw,118px);
  font-weight:400;
  line-height:1;
  letter-spacing:.005em;
  color:var(--washi);
  margin-bottom:32px;
}
.hero-title em{font-style:italic;color:var(--gold-soft);}
.hero-jp{
  font-family:var(--serif-jp);
  font-size:clamp(15px,1.5vw,20px);
  letter-spacing:.5em;
  font-weight:300;
  color:var(--washi);
  margin-bottom:60px;
  text-indent:.5em;
}
.hero-cta-group{
  display:inline-flex;gap:18px;flex-wrap:wrap;justify-content:center;
}
.hero-cta{
  font-family:var(--sans);
  display:inline-flex;align-items:center;gap:14px;
  padding:18px 38px;
  font-size:.74rem;letter-spacing:.28em;
  text-transform:uppercase;
  border:1px solid var(--gold);
  color:var(--washi);
  background:transparent;
  transition:all .4s ease;
}
.hero-cta:hover{background:var(--gold);color:var(--navy-deep);opacity:1;}
.hero-cta.primary{background:var(--gold);color:var(--navy-deep);}
.hero-cta.primary:hover{background:transparent;color:var(--washi);}
.hero-cta-arrow{font-family:var(--serif-en);font-size:.95rem;}

/* ヒーロー下KPI */
.hero-kpi{
  position:absolute;bottom:60px;left:0;right:0;
  display:flex;justify-content:center;gap:60px;flex-wrap:wrap;
  z-index:2;
  font-family:var(--sans);
  color:var(--washi);
}
.hero-kpi-item{text-align:center;}
.hero-kpi-num{
  font-family:var(--serif-en);
  font-size:1.6rem;font-style:italic;color:var(--gold);
  letter-spacing:.05em;
}
.hero-kpi-label{
  font-size:.62rem;letter-spacing:.28em;
  text-transform:uppercase;color:rgba(245,240,230,.65);
  margin-top:4px;
}

/* ─── COMMON SECTION ──────────────────────────────── */
.section{padding:120px 0;position:relative;}
.section-tight{padding:80px 0;}
.section-eyebrow{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--serif-en);
  font-style:italic;font-size:.85rem;
  letter-spacing:.36em;color:var(--gold);
  margin-bottom:18px;
}
.section-eyebrow::before{
  content:'';width:32px;height:1px;background:var(--gold);
}
.section-title{
  font-family:var(--serif-en);
  font-style:italic;font-weight:400;
  font-size:clamp(36px,5vw,68px);
  line-height:1.1;color:var(--navy);
  margin-bottom:18px;
}
.section-jp{
  font-family:var(--serif-jp);
  font-size:.95rem;letter-spacing:.36em;
  color:var(--navy-soft);
  margin-bottom:48px;
}

/* ─── ABOUT ───────────────────────────────────────── */
.about{
  background:var(--washi);
  overflow:hidden;
}
.about-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center;
}
.about-image{
  position:relative;aspect-ratio:4/5;
  background:linear-gradient(135deg,#1c4470 0%,#0d2845 100%);
  overflow:hidden;
}
.about-image::before{
  content:'';position:absolute;inset:0;
  background:url('../images/about.jpg') center/cover no-repeat;
}
.about-image::after{
  content:'';position:absolute;inset:0;
  border:1px solid var(--gold);
  margin:18px;
  pointer-events:none;
}
.about-image-frame{
  position:absolute;top:-18px;left:-18px;right:18px;bottom:18px;
  border:1px solid var(--line-soft);
  z-index:-1;
}
.about-text p{
  font-family:var(--serif-jp);
  font-size:1rem;line-height:2.2;
  color:var(--sumi);margin-bottom:24px;
}
.about-quote{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:1.5rem;line-height:1.5;
  color:var(--navy);
  border-left:2px solid var(--gold);
  padding-left:24px;
  margin:36px 0;
}
.about-sign{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.95rem;
  color:var(--gold);
  letter-spacing:.18em;
}

/* ─── PLAN（Service）──────────────────────────────── */
.plans{
  background:var(--navy);
  color:var(--washi);
  position:relative;
  overflow:hidden;
}
.plans::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);
}
.plans .section-title{color:var(--washi);}
.plans .section-jp{color:rgba(245,240,230,.65);}
.plans .section-eyebrow{color:var(--gold);}
.plans .section-eyebrow::before{background:var(--gold);}

.plan-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1px;
  background:rgba(201,169,110,.18);
  border:1px solid rgba(201,169,110,.18);
}
.plan-card{
  background:var(--navy);
  padding:48px 36px;
  position:relative;
  transition:background .35s ease;
}
.plan-card:hover{background:var(--navy-soft);}
.plan-num{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.95rem;letter-spacing:.32em;
  color:var(--gold);
  margin-bottom:28px;
}
.plan-name{
  font-family:var(--serif-jp);
  font-size:1.35rem;letter-spacing:.18em;
  color:var(--washi);
  margin-bottom:10px;
}
.plan-name-en{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.85rem;
  color:var(--gold-soft);letter-spacing:.18em;
  margin-bottom:24px;
  display:block;
}
.plan-desc{
  font-family:var(--serif-jp);
  font-size:.9rem;line-height:1.95;
  color:rgba(245,240,230,.72);
  margin-bottom:24px;
}
.plan-price{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:1.6rem;color:var(--gold);
  letter-spacing:.06em;
  border-top:1px solid rgba(201,169,110,.25);
  padding-top:18px;
}
.plan-price small{
  font-size:.6rem;letter-spacing:.22em;
  color:rgba(245,240,230,.5);
  text-transform:uppercase;
  display:block;font-style:normal;
  font-family:var(--sans);
  margin-bottom:4px;
}

/* ─── WORKS（メディア掲載・受賞）────────────────────── */
.works{background:var(--washi-warm);}
.works-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:36px;
}
.work-card{
  background:var(--washi);
  border:1px solid var(--line-soft);
  position:relative;
  overflow:hidden;
  transition:transform .4s ease,box-shadow .4s ease;
}
.work-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow);
}
.work-image{
  aspect-ratio:3/2;
  background:linear-gradient(135deg,#15375c 0%,#0d2845 100%);
  position:relative;overflow:hidden;
  filter:sepia(.18) saturate(.95);
  transition:filter .5s ease;
}
.work-image[data-img="works-01"]{background-image:url('../images/works-01.jpg');background-size:cover;background-position:center;}
.work-image[data-img="works-02"]{background-image:url('../images/works-02.jpg');background-size:cover;background-position:center;}
.work-image[data-img="works-03"]{background-image:url('../images/works-03.jpg');background-size:cover;background-position:center;}
.work-card:hover .work-image{filter:sepia(0) saturate(1.05);}
.work-body{padding:28px 26px 32px;}
.work-tag{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.72rem;letter-spacing:.28em;
  color:var(--gold);text-transform:uppercase;
  margin-bottom:10px;
}
.work-title{
  font-family:var(--serif-jp);
  font-size:1.05rem;line-height:1.55;letter-spacing:.05em;
  color:var(--navy);
  margin-bottom:8px;
}
.work-meta{
  font-family:var(--sans);
  font-size:.72rem;letter-spacing:.16em;
  color:var(--navy-soft);
  text-transform:uppercase;
}

/* ─── NEWS ────────────────────────────────────────── */
.news{background:var(--washi);}
.news-list{
  border-top:1px solid var(--line-soft);
}
.news-item{
  display:grid;
  grid-template-columns:140px 110px 1fr auto;
  gap:32px;
  padding:24px 8px;
  border-bottom:1px solid var(--line-soft);
  align-items:center;
  transition:background .3s ease,padding-left .3s ease;
}
.news-item:hover{background:var(--washi-warm);padding-left:18px;}
.news-date{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.88rem;letter-spacing:.16em;
  color:var(--gold);
}
.news-cat{
  font-family:var(--sans);
  font-size:.65rem;letter-spacing:.22em;
  text-transform:uppercase;
  text-align:center;
  padding:4px 0;
  border:1px solid var(--gold);
  color:var(--gold);
}
.news-title{
  font-family:var(--serif-jp);
  font-size:.98rem;letter-spacing:.06em;
  color:var(--sumi);
}
.news-arrow{
  font-family:var(--serif-en);
  font-style:italic;
  color:var(--gold);font-size:1.1rem;
}

/* ─── CTA BAND ────────────────────────────────────── */
.cta-band{
  background:var(--navy-deep);
  color:var(--washi);
  padding:100px 0;
  text-align:center;
  position:relative;
  border-top:1px solid rgba(201,169,110,.2);
  border-bottom:1px solid rgba(201,169,110,.2);
}
.cta-band::before{
  content:'';position:absolute;top:18px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);
  opacity:.4;
}
.cta-band-eyebrow{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.9rem;letter-spacing:.42em;
  color:var(--gold);
  margin-bottom:24px;
}
.cta-band-title{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:clamp(36px,5vw,64px);
  color:var(--washi);
  margin-bottom:14px;line-height:1.1;
}
.cta-band-jp{
  font-family:var(--serif-jp);
  font-size:1rem;letter-spacing:.36em;
  color:rgba(245,240,230,.7);
  margin-bottom:40px;
}
.cta-band a{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--sans);
  padding:18px 42px;
  border:1px solid var(--gold);
  color:var(--gold);
  font-size:.74rem;letter-spacing:.3em;
  text-transform:uppercase;
  transition:all .4s ease;
}
.cta-band a:hover{background:var(--gold);color:var(--navy-deep);opacity:1;}

/* ─── FOOTER ──────────────────────────────────────── */
.site-footer{
  background:var(--navy-deep);
  color:var(--washi);
  padding:80px 0 36px;
  font-family:var(--sans);
}
.footer-top{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:60px;
  margin-bottom:60px;
}
.footer-brand-en{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:1.6rem;color:var(--gold);
  letter-spacing:.06em;
  margin-bottom:8px;
}
.footer-brand-jp{
  font-family:var(--serif-jp);
  font-size:.85rem;letter-spacing:.36em;
  color:var(--washi);
  margin-bottom:24px;
}
.footer-info{
  font-size:.78rem;line-height:2;
  color:rgba(245,240,230,.6);
}
.footer-col-title{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.95rem;color:var(--gold);
  letter-spacing:.16em;
  margin-bottom:18px;
}
.footer-links{list-style:none;}
.footer-links li{margin-bottom:10px;}
.footer-links a{
  font-size:.78rem;letter-spacing:.1em;
  color:rgba(245,240,230,.7);
}
.footer-links a:hover{color:var(--gold);opacity:1;}
.footer-bottom{
  border-top:1px solid rgba(201,169,110,.18);
  padding-top:28px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;
  font-size:.7rem;
  color:rgba(245,240,230,.4);
  letter-spacing:.12em;
}

/* ─── REVEAL ANIMATION ────────────────────────────── */
.reveal{opacity:0;transform:translateY(30px);transition:opacity 1s ease,transform 1s ease;}
.reveal.show{opacity:1;transform:translateY(0);}
.reveal.delay-1{transition-delay:.15s;}
.reveal.delay-2{transition-delay:.3s;}
.reveal.delay-3{transition-delay:.45s;}

/* thumb撮影用：アニメ初期状態を強制完了 */
.force-anim-end .reveal{opacity:1!important;transform:none!important;}

/* ─── PAGE HEADER（下層共通）────────────────────────── */
.page-hero{
  padding:200px 0 100px;
  background:linear-gradient(180deg,#0d2845 0%,#15375c 100%);
  color:var(--washi);
  position:relative;
  text-align:center;
}
.page-hero::before{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);
}
.page-hero-eyebrow{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.85rem;letter-spacing:.4em;
  color:var(--gold);
  margin-bottom:22px;
}
.page-hero-title{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:clamp(40px,6vw,82px);
  color:var(--washi);
  margin-bottom:14px;
  line-height:1;
}
.page-hero-jp{
  font-family:var(--serif-jp);
  font-size:.95rem;letter-spacing:.42em;
  color:rgba(245,240,230,.75);
}

/* ─── COMPANY TABLE ───────────────────────────────── */
.company-table{
  width:100%;border-collapse:collapse;
  font-family:var(--serif-jp);
}
.company-table th,
.company-table td{
  padding:22px 0;
  border-bottom:1px solid var(--line-soft);
  font-weight:normal;
  text-align:left;
  font-size:.92rem;
  letter-spacing:.06em;
  vertical-align:top;
}
.company-table th{
  width:200px;
  font-family:var(--serif-en);
  font-style:italic;
  color:var(--gold);
  font-size:.85rem;letter-spacing:.18em;
}

/* ─── HISTORY ─────────────────────────────────────── */
.history-list{position:relative;padding-left:32px;}
.history-list::before{
  content:'';position:absolute;left:0;top:8px;bottom:8px;
  width:1px;background:var(--gold);opacity:.4;
}
.history-item{
  position:relative;margin-bottom:36px;padding-left:28px;
}
.history-item::before{
  content:'';position:absolute;left:-7px;top:12px;
  width:13px;height:13px;border-radius:50%;
  background:var(--washi);
  border:1px solid var(--gold);
}
.history-year{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:1.2rem;color:var(--gold);
  letter-spacing:.08em;
  margin-bottom:6px;
}
.history-text{
  font-family:var(--serif-jp);
  font-size:.95rem;line-height:1.85;color:var(--sumi);
}

/* ─── FLOW ────────────────────────────────────────── */
.flow{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:36px;
  position:relative;
}
.flow-step{
  background:var(--washi);
  padding:36px 30px;
  border:1px solid var(--line-soft);
  position:relative;
}
.flow-step::before{
  content:attr(data-step);
  position:absolute;top:-18px;left:24px;
  width:36px;height:36px;
  border-radius:50%;
  background:var(--gold);
  color:var(--navy-deep);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif-en);
  font-style:italic;font-size:1rem;
}
.flow-name{
  font-family:var(--serif-jp);
  font-size:1.08rem;letter-spacing:.1em;
  color:var(--navy);
  margin:8px 0 12px;
}
.flow-desc{
  font-family:var(--serif-jp);
  font-size:.82rem;line-height:1.85;
  color:var(--sumi);
}

/* ─── RECRUIT ─────────────────────────────────────── */
.recruit-jobs{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:32px;
  margin-bottom:80px;
}
.recruit-card{
  background:var(--washi);
  border:1px solid var(--line-soft);
  padding:42px 36px;
  position:relative;
}
.recruit-tag{
  display:inline-block;
  font-family:var(--sans);
  font-size:.62rem;letter-spacing:.26em;
  text-transform:uppercase;
  padding:5px 12px;
  background:var(--navy);color:var(--gold);
  margin-bottom:18px;
}
.recruit-title{
  font-family:var(--serif-jp);
  font-size:1.3rem;letter-spacing:.12em;
  color:var(--navy);
  margin-bottom:18px;
}
.recruit-list{list-style:none;font-family:var(--serif-jp);font-size:.85rem;line-height:2;}
.recruit-list li{
  padding-left:18px;position:relative;
}
.recruit-list li::before{
  content:'—';position:absolute;left:0;color:var(--gold);
}

/* ─── CONTACT FORM ─────────────────────────────────── */
.contact-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:90px;
}
.contact-form{
  background:var(--washi);
  border:1px solid var(--line-soft);
  padding:48px;
}
.form-row{margin-bottom:26px;}
.form-row label{
  display:block;
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.78rem;letter-spacing:.22em;
  color:var(--gold);
  margin-bottom:8px;
}
.form-row label .req{color:#c5483b;font-style:normal;margin-left:4px;}
.form-row input,
.form-row select,
.form-row textarea{
  width:100%;
  padding:14px 0;
  font-size:.92rem;
  font-family:var(--serif-jp);
  background:transparent;
  border:none;
  border-bottom:1px solid var(--line-soft);
  color:var(--sumi);
  outline:none;
  transition:border-color .3s ease;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus{border-bottom-color:var(--gold);}
.form-row textarea{min-height:140px;resize:vertical;}
.form-submit{
  display:inline-flex;align-items:center;gap:14px;
  padding:18px 38px;
  background:var(--navy);
  color:var(--gold);
  border:1px solid var(--gold);
  font-family:var(--sans);
  font-size:.74rem;letter-spacing:.3em;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .35s ease;
}
.form-submit:hover{background:var(--gold);color:var(--navy-deep);}
.contact-info{
  background:var(--navy);
  color:var(--washi);
  padding:48px;
  position:relative;
}
.contact-info::before{
  content:'';position:absolute;inset:0;
  border:1px solid rgba(201,169,110,.25);
  margin:14px;pointer-events:none;
}
.contact-info-eyebrow{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.85rem;letter-spacing:.32em;
  color:var(--gold);
  margin-bottom:14px;
}
.contact-info-title{
  font-family:var(--serif-jp);
  font-size:1.2rem;letter-spacing:.16em;
  color:var(--washi);
  margin-bottom:30px;
}
.contact-info-item{
  border-top:1px solid rgba(201,169,110,.2);
  padding:18px 0;
}
.contact-info-label{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:.78rem;letter-spacing:.22em;
  color:var(--gold);
  margin-bottom:6px;
}
.contact-info-text{
  font-family:var(--serif-jp);
  font-size:.95rem;letter-spacing:.06em;
  color:rgba(245,240,230,.85);
}
.contact-info-tel{
  font-family:var(--serif-en);
  font-style:italic;
  font-size:1.6rem;color:var(--gold);
  letter-spacing:.04em;
}

/* ─── PRIVACY ─────────────────────────────────────── */
.privacy-body{
  background:var(--washi);
  padding:60px 64px;
  border:1px solid var(--line-soft);
  font-family:var(--serif-jp);
  line-height:2;
}
.privacy-body h2{
  font-family:var(--serif-en);
  font-style:italic;
  font-weight:400;
  font-size:1.5rem;
  color:var(--gold);
  margin:42px 0 14px;
  letter-spacing:.08em;
}
.privacy-body h2:first-child{margin-top:0;}
.privacy-body p{font-size:.92rem;color:var(--sumi);margin-bottom:14px;}

/* ─── NEWS DETAIL ─────────────────────────────────── */
.news-detail{
  background:var(--washi);
  padding:60px 64px;
  border:1px solid var(--line-soft);
  font-family:var(--serif-jp);
  line-height:2;
}
.news-detail-meta{
  display:flex;align-items:center;gap:18px;
  margin-bottom:18px;
  padding-bottom:18px;
  border-bottom:1px solid var(--line-soft);
}
.news-detail-meta .news-date{font-size:1rem;}
.news-detail-title{
  font-family:var(--serif-jp);
  font-size:1.6rem;letter-spacing:.08em;
  color:var(--navy);
  margin-bottom:32px;line-height:1.5;
}
.news-detail h3{
  font-family:var(--serif-en);
  font-style:italic;
  color:var(--gold);
  font-size:1.3rem;
  margin:32px 0 12px;
  letter-spacing:.1em;
}
.news-detail p{font-size:.95rem;margin-bottom:18px;color:var(--sumi);}
.news-back{
  display:inline-flex;align-items:center;gap:12px;
  margin-top:48px;
  padding:14px 32px;
  border:1px solid var(--gold);
  font-family:var(--sans);
  font-size:.72rem;letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--navy);
}
.news-back:hover{background:var(--navy);color:var(--gold);opacity:1;}

/* ─── RESPONSIVE ──────────────────────────────────── */
@media(max-width:1024px){
  .about-inner{gap:60px;}
  .footer-top{grid-template-columns:1fr 1fr;gap:48px;}
  .contact-grid{grid-template-columns:1fr;gap:48px;}
  .hero-vertical{font-size:.7rem;letter-spacing:.5em;}
}

@media(max-width:900px){
  .header-nav{
    position:fixed;inset:0;
    background:var(--navy-deep);
    z-index:1000;
    flex-direction:column;
    align-items:center;justify-content:center;
    gap:28px;
    display:none;
  }
  .header-nav.is-open{display:flex;}
  .header-nav a{font-size:1rem;letter-spacing:.32em;}
  .header-cta{padding:14px 32px;}
  .mobile-toggle{display:block;}
  .site-header,
  .site-header.is-scrolled,
  .site-header.menu-active{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .site-header.menu-active{
    background:var(--navy-deep)!important;
  }
  .hamburger,.mobile-toggle{z-index:1100;position:relative;}

  .hero{min-height:88vh;padding-top:140px;}
  .hero-top-line{top:120px;font-size:.62rem;letter-spacing:.3em;}
  .hero-top-line::before,.hero-top-line::after{flex:0 0 32px;}
  .hero-vertical{display:none;}
  .hero-content{padding-top:48px;}
  .hero-jp{letter-spacing:.32em;margin-bottom:36px;}
  .hero-cta{padding:14px 28px;}
  .hero-kpi{bottom:34px;gap:32px;}
  .hero-kpi-num{font-size:1.3rem;}

  .section{padding:80px 0;}
  .about-inner{grid-template-columns:1fr;gap:48px;}
  .about-image{aspect-ratio:4/3;}
  .about-quote{font-size:1.2rem;}

  .news-item{
    grid-template-columns:auto auto 1fr;
    grid-template-rows:auto auto;
    gap:14px;
    padding:18px 8px;
  }
  .news-item .news-arrow{display:none;}
  .news-title{grid-column:1/-1;}

  .footer-top{grid-template-columns:1fr;gap:36px;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px;}

  .privacy-body,.news-detail{padding:36px 24px;}
  .contact-form,.contact-info{padding:32px 24px;}
  .company-table th{width:130px;font-size:.78rem;}
  .company-table th,.company-table td{padding:18px 0;font-size:.85rem;}

  .page-hero{padding:140px 0 70px;}
}

@media(max-width:560px){
  .hero-title{letter-spacing:0;}
  .hero-jp{font-size:13px;letter-spacing:.24em;}
  .hero-cta-group{flex-direction:column;gap:12px;width:100%;}
  .hero-cta{width:100%;justify-content:center;}
  .hero-kpi{gap:18px;}
  .hero-kpi-num{font-size:1.05rem;}
  .hero-kpi-label{font-size:.55rem;letter-spacing:.16em;}
  .plan-card{padding:36px 24px;}
}


/* ====================================================
   Visual safety override (2026-05-04 一括強制表示化)
   feedback_pre_upload_visual_check ルール準拠
   JS未発火時/画像非表示を防ぐため、すべての
   reveal系クラスを初期表示OKに強制
==================================================== */
.reveal, .reveal-up, .reveal-fade, .reveal-clip, .reveal-noren,
.scrub-item, .reveal-left, .reveal-right { 
  opacity: 1 !important; 
  transform: none !important; 
  clip-path: inset(0 0 0% 0) !important;
  -webkit-clip-path: inset(0 0 0% 0) !important;
}



/* ====================================================
   スマホ時 contact フォーム強制1カラム化（2026-05-05）
   2カラム表示で入力欄が狭くなる問題
==================================================== */
@media (max-width: 767px) {
    .form-row,
    .form-grid,
    .form-2col,
    .form-pair,
    .input-row,
    .input-grid,
    [class*="form-row"],
    [class*="form-grid"],
    [class*="two-col"] {
        display: block !important;
        grid-template-columns: 1fr !important;
    }
    form input[type="text"],
    form input[type="email"],
    form input[type="tel"],
    form input[type="number"],
    form textarea,
    form select,
    .form-row > input,
    .form-row > textarea,
    .form-row > select,
    .form-row > div,
    .form-grid > * {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    .form-row, .form-grid {
        margin-bottom: 1rem;
    }
}



/* ====================================================
   contact 1カラム化 強化版（2026-05-05・全クラス網羅）
==================================================== */
@media (max-width: 767px) {
    .contact-grid,
    .contact-form,
    .ct-grid,
    .ct-form,
    .booking-form,
    .reserve-form,
    .form-card,
    .form-wrap,
    .form-box,
    [class*="contact-grid"],
    [class*="contact-form"],
    [class*="ct-grid"],
    [class*="ct-form"] {
        display: block !important;
        grid-template-columns: 1fr !important;
    }
    .contact-grid > *,
    .contact-form > *,
    .ct-grid > *,
    .ct-form > *,
    .booking-form > *,
    .reserve-form > *,
    .form-card > *,
    .form-wrap > *,
    .form-box > * {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    .ct-budget-grid,
    .ct-field {
        grid-template-columns: 1fr !important;
        display: block !important;
    }
}

/* ====================================================
   スマホ時 2カラム→1カラム化（2026-05-15）
   右文章が縦長になる時
==================================================== */
@media (max-width: 768px) {
  .about-inner { grid-template-columns: 1fr !important; gap: 24px !important; }
}

/* ====================================================
   2カラム→1カラム化 B案（2026-05-15）
   左画像・右文章になりがちなキーワード対象
==================================================== */
@media (max-width: 768px) {
  .contact-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
}