/* ============================================
   Breath Yoga Studio — ヨガスタジオ
   Theme: Earthy Zen / Extreme whitespace / Photo-driven
   STANDALONE — Completely unique layout
   ============================================ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;color:#8a8578;background:#faf9f6;font-size:15px;line-height:2;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:rgba(139,158,130,.2)}

:root{
  --sage:#8b9e82;--sage2:#a3b498;--sage-light:#eef2eb;
  --earth:#6b5e4f;--sand:#e8e0d4;--cream:#faf9f6;
  --heading:#3a3530;--text:#8a8578;
  --serif:'Cormorant Garamond','Georgia',serif;
  --sans:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;
}

/* === NO HEADER — Just floating logo === */
.float-logo{position:fixed;top:1.5rem;left:clamp(1.5rem,4vw,3rem);z-index:800;font-family:var(--serif);font-size:1rem;color:var(--heading);font-weight:400;letter-spacing:.2em;mix-blend-mode:difference;color:#fff}
.float-reserve{position:fixed;top:1.5rem;right:clamp(1.5rem,4vw,3rem);z-index:800;font-family:var(--serif);font-size:.6rem;letter-spacing:.2em;color:var(--sage);border:1px solid var(--sage);padding:.35rem 1.2rem;transition:all .4s;mix-blend-mode:difference}
.float-reserve:hover{background:var(--sage);color:#fff;opacity:1}

/* === HERO — Full image, no overlay, text below === */
.hero-yoga{position:relative}
.hero-yoga-img{width:100%;height:85vh;object-fit:cover}
.hero-yoga-text{padding:clamp(3rem,6vw,5rem) clamp(2rem,5vw,4rem);text-align:center}
.hero-yoga-text h1{font-family:var(--serif);font-size:clamp(2rem,5vw,4rem);font-weight:300;color:var(--heading);letter-spacing:.1em;line-height:1.4}
.hero-yoga-text p{font-size:.85rem;color:var(--text);max-width:450px;margin:1.25rem auto 0;line-height:2.2}

/* === SPACER === */
.spacer{height:clamp(4rem,10vw,8rem)}

/* === PHOTO + TEXT ALTERNATING === */
.pt-block{display:grid;grid-template-columns:1fr 1fr;min-height:80vh}
.pt-block:nth-child(even){direction:rtl}
.pt-block:nth-child(even)>*{direction:ltr}
.pt-img{overflow:hidden}
.pt-img img{width:100%;height:100%;object-fit:cover;min-height:500px}
.pt-text{display:flex;flex-direction:column;justify-content:center;padding:clamp(3rem,6vw,6rem)}
.pt-text .label{font-family:var(--serif);font-size:.6rem;letter-spacing:.25em;color:var(--sage);text-transform:uppercase;margin-bottom:1.5rem}
.pt-text h2{font-family:var(--serif);font-size:clamp(1.4rem,3vw,2.2rem);font-weight:300;color:var(--heading);letter-spacing:.08em;line-height:1.7;margin-bottom:1.25rem}
.pt-text p{font-size:.85rem;line-height:2.4}
@media(max-width:768px){.pt-block,.pt-block:nth-child(even){grid-template-columns:1fr;direction:ltr;min-height:auto}.pt-img img{min-height:300px}}

/* === CLASSES — Horizontal scroll === */
.classes{padding:clamp(4rem,8vw,6rem) 0}
.classes-header{padding:0 clamp(2rem,5vw,4rem);margin-bottom:2rem}
.classes-header h2{font-family:var(--serif);font-size:clamp(1.3rem,3vw,2rem);font-weight:300;color:var(--heading);letter-spacing:.1em}
.classes-scroll{display:flex;gap:1.25rem;overflow-x:auto;padding:0 clamp(2rem,5vw,4rem) 1rem;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.classes-scroll::-webkit-scrollbar{display:none}
.class-card{flex:0 0 300px;scroll-snap-align:start;background:#fff;border-radius:16px;overflow:hidden;transition:transform .4s}
.class-card:hover{transform:translateY(-4px)}
.class-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.class-card-body{padding:1.25rem 1.5rem 1.5rem}
.class-card h3{font-family:var(--serif);font-size:1rem;font-weight:400;color:var(--heading);letter-spacing:.05em;margin-bottom:.3rem}
.class-card p{font-size:.72rem;line-height:1.8}
.class-card .time{font-family:var(--serif);font-size:.7rem;color:var(--sage);margin-top:.5rem;display:block}

/* === QUOTE === */
.quote{padding:clamp(6rem,12vw,10rem) clamp(2rem,5vw,4rem);text-align:center;background:var(--sage-light)}
.quote blockquote{font-family:var(--serif);font-size:clamp(1.3rem,3vw,2.2rem);font-weight:300;color:var(--heading);letter-spacing:.08em;line-height:1.8;max-width:600px;margin:0 auto;font-style:italic}
.quote cite{display:block;margin-top:1.5rem;font-size:.7rem;color:var(--sage);letter-spacing:.1em;font-style:normal}

/* === INFO === */
.info-yoga{padding:clamp(4rem,8vw,6rem) clamp(2rem,5vw,4rem);max-width:800px;margin:0 auto}
.info-yoga-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.info-yoga-grid h3{font-family:var(--serif);font-size:.9rem;color:var(--heading);letter-spacing:.1em;margin-bottom:1rem;font-weight:400}
.info-yoga-grid p{font-size:.8rem;line-height:2.2}
@media(max-width:640px){.info-yoga-grid{grid-template-columns:1fr}}

/* === CTA === */
.cta-yoga{background:var(--sage);text-align:center;padding:clamp(4rem,8vw,6rem) 2rem;color:#fff}
.cta-yoga h2{font-family:var(--serif);font-size:clamp(1.3rem,3vw,2rem);font-weight:300;letter-spacing:.12em;margin-bottom:.5rem}
.cta-yoga p{font-size:.8rem;color:rgba(255,255,255,.6);margin-bottom:1.5rem}
.cta-yoga-btn{display:inline-block;font-family:var(--serif);font-size:.7rem;letter-spacing:.2em;border:1px solid rgba(255,255,255,.4);padding:.6rem 2rem;color:#fff;transition:all .3s}
.cta-yoga-btn:hover{background:#fff;color:var(--sage);opacity:1}

/* === FOOTER === */
.ftr-yoga{padding:2rem clamp(2rem,5vw,4rem);text-align:center;font-size:.6rem;color:rgba(0,0,0,.15)}

/* === ANIMATIONS === */
.sa{opacity:0;transform:translateY(25px);transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1.2s cubic-bezier(.22,1,.36,1)}
.sa.v{opacity:1;transform:none}
.d1{transition-delay:.15s}.d2{transition-delay:.3s}.d3{transition-delay:.45s}

.badge{position:fixed;bottom:1.25rem;right:1.25rem;font-size:.55rem;color:rgba(0,0,0,.12);letter-spacing:.05em;display:flex;align-items:center;gap:.4rem;z-index:700}
.badge::before{content:'';width:4px;height:4px;background:var(--sage);border-radius:50%}