/* page-top.css — このファイルはページ固有スタイルのみ。共通(リセット/変数/nav/footer/breadcrumb)はstyle.cssに集約。 */
/* ══ TOP-PAGE SPECIFIC ══ */

/* HERO — full screen, centered logo */
.top-hero{
  height:100vh;position:relative;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.top-hero-bg{position:absolute;inset:0;z-index:0;}
.top-hero-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(0.78) brightness(0.62);}
.top-hero-grade{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(to bottom,rgba(20,18,14,0.45) 0%,rgba(20,18,14,0.22) 50%,rgba(20,18,14,0.7) 100%);
}
.top-hero-inner{position:relative;z-index:2;text-align:center;}
.top-hero-logo{height:72px;margin:0 auto 20px;}
.top-hero-logo img{height:100%;width:auto;object-fit:contain;filter:brightness(3) saturate(0.3);}
.top-hero-rule{width:50px;height:1px;background:rgba(197,178,146,0.7);margin:0 auto 22px;}
.top-hero-read{font-family:'Cormorant Garamond',serif;font-size:15px;letter-spacing:0.2em;color:rgba(255,255,255,0.74);margin:0 auto 18px;}
.top-hero-copy{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(16px,2vw,22px);letter-spacing:0.08em;color:rgba(255,255,255,0.82);margin-bottom:8px;}
.top-hero-sub{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.28em;color:rgba(255,255,255,0.5);text-transform:uppercase;margin-bottom:44px;}
.top-hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.btn-hero-fill{padding:14px 32px;background:var(--gold);color:var(--ink);font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.2em;text-decoration:none;text-transform:uppercase;}
.btn-hero-line{padding:13px 31px;border:1px solid rgba(197,178,146,0.6);color:rgba(255,255,255,0.82);font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.2em;text-decoration:none;text-transform:uppercase;}
/* scroll cue */
.scroll-cue{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.22em;color:rgba(255,255,255,0.4);text-transform:uppercase;}
.scroll-cue-line{width:1px;height:36px;background:rgba(197,178,146,0.45);animation:sc 1.8s ease-in-out infinite;}
@keyframes sc{0%,100%{opacity:0.3;transform:scaleY(0.6)}50%{opacity:0.9;transform:scaleY(1)}}

/* MARQUEE */
.marquee{overflow:hidden;border-top:1px solid var(--line-i);border-bottom:1px solid var(--line-i);background:var(--w);padding:13px 0;}
.marquee-track{display:flex;width:max-content;animation:mq 28s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-item{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.28em;text-transform:uppercase;color:var(--faint);padding:0 30px;white-space:nowrap;}
.marquee-item.accent{color:var(--gold-dk);}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* INTRO — brand statement */
.intro{padding:120px 64px;text-align:center;}
.intro-inner{max-width:680px;margin:0 auto;}
.intro-pull{font-family:'Playfair Display',serif;font-style:italic;font-weight:400;font-size:clamp(26px,3.6vw,42px);line-height:1.3;color:var(--ink);margin-bottom:32px;letter-spacing:0.01em;}
.intro-body{font-size:14px;line-height:2.4;color:var(--soft);}
.intro-credit{font-size:12px;line-height:2;color:var(--faint);margin-top:28px;}

/* STYLES GRID */
.styles-section{padding:0 0 120px;}
.styles-label{padding:0 64px 40px;}
.styles-grid-top{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;}
.sc{position:relative;overflow:hidden;cursor:pointer;text-decoration:none;display:block;}
.sc:nth-child(1){aspect-ratio:3/4;}
.sc:nth-child(2){aspect-ratio:3/4;margin-top:48px;}
.sc:nth-child(3){aspect-ratio:3/4;}
.sc img{width:100%;height:100%;object-fit:cover;filter:saturate(0.84) brightness(0.86);transition:transform 1.1s ease,filter .4s;}
.sc:hover img{transform:scale(1.05);filter:saturate(0.92) brightness(0.92);}
.sc-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,18,14,0.72) 0%,transparent 52%);}
.sc-body{position:absolute;bottom:0;left:0;right:0;padding:24px 22px;z-index:2;}
.sc-code{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.22em;color:rgba(255,255,255,0.65);text-transform:uppercase;display:block;margin-bottom:6px;}
.sc-ja{font-family:'Noto Serif JP',serif;font-size:20px;font-weight:200;color:#fff;display:block;margin-bottom:6px;letter-spacing:0.04em;}
.sc-desc{font-size:12px;color:rgba(255,255,255,0.65);line-height:1.75;}
.sc-link{position:absolute;top:16px;right:16px;z-index:2;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.16em;color:rgba(255,255,255,0.5);text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,0.25);padding-bottom:2px;opacity:0;transition:opacity .3s;}
.sc:hover .sc-link{opacity:1;}

/* PLAN STRIP */
.plan-strip{background:var(--ink);padding:80px 64px;border-top:1px solid rgba(176,161,126,0.15);}
.plan-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center;}
.ps-left{}
.ps-tag{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.22em;color:var(--gold-lt);text-transform:uppercase;display:block;margin-bottom:14px;}
.ps-title{font-family:'Playfair Display',serif;font-style:italic;font-weight:400;font-size:clamp(26px,3.8vw,44px);color:rgba(250,250,247,0.92);margin-bottom:18px;line-height:1.2;}
.ps-body{font-size:14px;line-height:2.1;color:rgba(250,250,247,0.52);max-width:500px;}
.ps-right{text-align:center;flex-shrink:0;}
.ps-price{font-family:'Playfair Display',serif;font-style:italic;font-weight:400;font-size:clamp(56px,7vw,88px);line-height:0.9;color:rgba(250,250,247,0.92);display:block;margin-bottom:16px;}
.ps-tax{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.16em;color:var(--gold-lt);text-transform:uppercase;margin-bottom:24px;display:block;}
.ps-meta{display:inline-flex;gap:0;border:1px solid rgba(197,178,146,0.25);margin-bottom:34px;}
.ps-m{padding:12px 18px;border-right:1px solid rgba(197,178,146,0.18);text-align:center;}
.ps-m:last-child{border-right:none;}
.ps-mn{font-family:'Playfair Display',serif;font-style:italic;font-size:22px;color:rgba(250,250,247,0.88);display:block;}
.ps-ml{font-family:'Space Mono',monospace;font-size:8px;letter-spacing:0.12em;color:var(--gold-lt);text-transform:uppercase;margin-top:4px;display:block;}
.btn-ps{display:inline-block;padding:13px 30px;border:1px solid var(--gold-lt);color:var(--gold-lt);font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.2em;text-decoration:none;text-transform:uppercase;transition:all .3s;}
.btn-ps:hover{background:var(--gold-lt);color:var(--ink);}

/* GALLERY PREVIEW */
.gal-preview{padding:100px 64px;background:var(--w2);}
.gal-preview-inner{max-width:1200px;margin:0 auto;}
.gp-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:8px;margin-top:44px;}
.gp-item{display:block;overflow:hidden;position:relative;cursor:pointer;text-decoration:none;color:inherit;}
.gp-item img{width:100%;height:100%;object-fit:cover;filter:saturate(0.86);transition:transform .9s ease;}
.gp-item:hover img{transform:scale(1.06);}
.gp-item.tall{grid-row:span 2;}
.gp-tag{position:absolute;bottom:10px;left:10px;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.14em;color:rgba(255,255,255,0.8);text-transform:uppercase;background:rgba(20,18,14,0.45);padding:3px 7px;z-index:2;opacity:0;transition:opacity .3s;}
.gp-item:hover .gp-tag{opacity:1;}
.gp-more{text-align:center;margin-top:40px;}
.btn-more{font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.24em;color:var(--gold-dk);text-decoration:none;text-transform:uppercase;border-bottom:1px solid var(--gold);padding-bottom:2px;}

/* JOURNAL PREVIEW */
.journal-preview{padding:100px 64px;}
.journal-preview-inner{max-width:1200px;margin:0 auto;}
.jp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px;}
.jp-card{display:block;text-decoration:none;color:inherit;}
.jp-img{overflow:hidden;aspect-ratio:3/2;position:relative;background:var(--w3);margin-bottom:16px;}
.jp-img img{width:100%;height:100%;object-fit:cover;filter:saturate(0.88);transition:transform .9s ease;}
.jp-card:hover .jp-img img{transform:scale(1.05);}
.jp-cat{position:absolute;bottom:10px;left:10px;z-index:2;padding:4px 10px;background:rgba(250,250,247,0.92);font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.2em;color:var(--gold-dk);text-transform:uppercase;}
.jp-en{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.14em;color:var(--faint);text-transform:uppercase;display:block;margin-bottom:7px;}
.jp-title{font-family:'Noto Serif JP',serif;font-size:15px;font-weight:300;color:var(--ink);line-height:1.7;letter-spacing:0.03em;margin-bottom:12px;}
.jp-date{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.1em;color:var(--faint);}
.jp-read{font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.16em;color:var(--gold-dk);text-decoration:none;display:block;margin-top:12px;border-bottom:1px solid var(--line);padding-bottom:2px;width:fit-content;}

/* ACCESS */
.access{padding:100px 64px;background:var(--w2);border-top:1px solid var(--line-i);}
.access-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;}
.access-map{aspect-ratio:4/3;background:var(--w3);overflow:hidden;position:relative;}
.access-map iframe{width:100%;height:100%;border:none;filter:grayscale(1) sepia(0.12) contrast(1.04) brightness(1.02);transition:filter .6s ease;}
.access-map iframe:hover{filter:none;}
.access-info{}
.ai-title{font-family:'Playfair Display',serif;font-style:italic;font-weight:400;font-size:clamp(28px,3.5vw,42px);color:var(--ink);margin-bottom:20px;letter-spacing:0.01em;}
.ai-row{display:flex;gap:14px;align-items:baseline;margin-bottom:14px;}
.ai-label{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.16em;color:var(--gold-dk);text-transform:uppercase;flex-shrink:0;min-width:52px;}
.ai-val{font-size:13px;line-height:1.8;color:var(--soft);}
.ai-hr{height:1px;background:var(--line-i);margin:28px 0;}
.ai-note{font-size:12px;line-height:1.9;color:var(--faint);}

/* FINAL CTA */
.top-cta{padding:140px 64px;text-align:center;position:relative;overflow:hidden;}
.top-cta-escape{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(56px,10vw,140px);line-height:0.88;color:rgba(176,161,126,0.09);position:absolute;top:28px;left:50%;transform:translateX(-50%);white-space:nowrap;pointer-events:none;width:130%;}
.top-cta-inner{position:relative;z-index:2;}
.top-cta-wing{width:88px;margin:0 auto 24px;}
.top-cta-title{font-family:'Playfair Display',serif;font-weight:400;font-size:clamp(24px,3.8vw,44px);line-height:1.35;color:var(--ink);margin-bottom:26px;letter-spacing:0.02em;}
.top-cta-body{font-size:14px;line-height:2.3;color:var(--soft);max-width:440px;margin:0 auto 44px;}
.top-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.btn-tc-fill{padding:15px 38px;background:var(--ink);color:var(--w);font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.2em;text-decoration:none;text-transform:uppercase;transition:background .3s;}
.btn-tc-fill:hover{background:var(--gold-dk);}
.btn-tc-line{padding:14px 37px;border:1px solid var(--gold);color:var(--gold-dk);font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.2em;text-decoration:none;text-transform:uppercase;}

@media(max-width:960px){

  .top-hero-logo{height:52px;}
  .intro,.gal-preview,.journal-preview,.access,.top-cta{padding:72px 22px;}
  .marquee{padding:13px 0;}
  .styles-label{padding:0 22px 32px;}
  .styles-grid-top{grid-template-columns:1fr;gap:4px;max-width:420px;margin:0 auto;}
  .sc:nth-child(2){margin-top:0;}
  .plan-strip{padding:72px 22px;}
  .plan-strip-inner{grid-template-columns:1fr;gap:36px;text-align:center;}
  .ps-body{max-width:100%;}
  .gp-grid{grid-template-columns:1fr 1fr;grid-auto-rows:auto;}
  .gp-item{aspect-ratio:1/1;} .gp-item.tall{grid-row:auto;}
  /* 7枚目はスマホでは横全幅にして右下の余りを無くす */
  .gp-grid .gp-item:last-child{grid-column:1 / -1;aspect-ratio:16/9;}
  .jp-grid{grid-template-columns:1fr;gap:36px;}
  .access-inner{grid-template-columns:1fr;gap:36px;}
  .access-map{aspect-ratio:16/9;}
}

.seo-h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
/* ── トップのお知らせバー（外観→カスタマイズで編集）── */
.top-notice{background:var(--w2);border-top:1px solid var(--line-i);border-bottom:1px solid var(--line-i);}
.tn-inner{max-width:1200px;margin:0 auto;padding:16px 64px;display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap;}
.tn-label{flex-shrink:0;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold-dk);border:1px solid var(--gold);padding:5px 12px;}
.tn-text{flex:1;min-width:220px;font-size:13.5px;line-height:1.85;color:var(--ink);letter-spacing:0.02em;}
.tn-link{flex-shrink:0;font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold-dk);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px;white-space:nowrap;transition:color .3s;}
.tn-link:hover{color:var(--ink);}
@media(max-width:900px){
  .tn-inner{padding:14px 22px;gap:10px 14px;}
  .tn-text{flex-basis:100%;min-width:0;font-size:13px;}
}

/* アクセス欄の Tel/Mail リンク（config参照化に伴い追加） */
.ai-val a{color:var(--soft);text-decoration:none;border-bottom:1px solid var(--line-i);transition:color .3s,border-color .3s;}
.ai-val a:hover{color:var(--gold-dk);border-color:var(--gold-lt);}

/* 見出しのブランド読み（エレア）を小さめの添え字に */
.ai-read{font-family:'Noto Sans JP',sans-serif;font-style:normal;font-weight:300;font-size:0.5em;letter-spacing:0.06em;color:var(--soft);vertical-align:0.12em;margin-left:1px;}