/*
Theme Name: Zen
Description: Japanese-inspired minimalist luxury. Clean whites, warm gold accents, generous whitespace — for hotels, resorts, spas, and premium brands.
Author: UP Manager
Version: 1.0
License: GNU General Public License v2
*/

:root {
  --bg:       #faf9f7;
  --bg2:      #f4f1ec;
  --bg3:      #ede9e2;
  --paper:    #ffffff;
  --ink:      #1a1812;
  --ink2:     #3d3830;
  --muted:    #8a8070;
  --light:    #b8af9f;
  --gold:     #b8953a;
  --gold2:    #d4b060;
  --gold3:    #efe0ba;
  --grad:     linear-gradient(135deg, #b8953a 0%, #d4b060 50%, #c9a84c 100%);
  --border:   #e0d8cc;
  --border2:  rgba(184,149,58,.25);
  --radius:   4px;
  --font:     'Cormorant Garamond', 'Noto Serif JP', Georgia, serif;
  --font-sans:'Inter', 'Noto Sans KR', sans-serif;
  --trans:    all .4s cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--ink);font-family:var(--font-sans);font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--gold);text-decoration:none;transition:color .25s;}
a:hover{color:var(--ink);}

.zn-container{max-width:1120px;margin:0 auto;padding:0 40px;}
.zn-container-sm{max-width:760px;margin:0 auto;padding:0 40px;}

/* ── Dividers ── */
.zn-rule{width:40px;height:1px;background:var(--gold);margin:0 auto 32px;}
.zn-rule-left{margin:0 0 32px;}

/* ── Buttons ── */
.zn-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 36px;font-family:var(--font-sans);font-size:13px;font-weight:500;letter-spacing:2px;text-transform:uppercase;cursor:pointer;border:none;transition:var(--trans);text-decoration:none;}
.zn-btn-dark{background:var(--ink);color:#fff;}
.zn-btn-dark:hover{background:var(--ink2);color:#fff;transform:translateY(-1px);}
.zn-btn-outline{background:transparent;color:var(--ink);border:1px solid var(--ink);}
.zn-btn-outline:hover{background:var(--ink);color:#fff;}
.zn-btn-gold{background:var(--gold);color:#fff;}
.zn-btn-gold:hover{background:var(--ink);color:#fff;transform:translateY(-1px);}
.zn-btn-gold-outline{background:transparent;color:var(--gold);border:1px solid var(--gold2);}
.zn-btn-gold-outline:hover{background:var(--gold);color:#fff;}
.zn-btn-text{background:transparent;color:var(--ink);padding:0;letter-spacing:1.5px;font-size:12px;border-bottom:1px solid currentColor;border-radius:0;}
.zn-btn-text:hover{color:var(--gold);}

/* ── Sections ── */
.zn-section{padding:100px 0;}
.zn-section-sm{padding:64px 0;}
.zn-label{display:block;font-family:var(--font-sans);font-size:11px;font-weight:500;letter-spacing:4px;text-transform:uppercase;color:var(--gold);margin-bottom:16px;}
.zn-heading{font-family:var(--font);font-size:clamp(2rem,4vw,3.2rem);font-weight:400;line-height:1.2;letter-spacing:-.5px;color:var(--ink);margin-bottom:20px;}
.zn-heading-sm{font-family:var(--font);font-size:clamp(1.4rem,2.5vw,2rem);font-weight:400;line-height:1.3;color:var(--ink);}
.zn-subheading{font-size:.95rem;color:var(--muted);line-height:2;max-width:520px;}
.zn-center{text-align:center;}
.zn-center .zn-subheading{margin:0 auto;}
.zn-center .zn-rule{margin:0 auto 32px;}

/* ── Nav ── */
#zn-nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:24px 0;transition:var(--trans);}
#zn-nav.scrolled{background:rgba(250,249,247,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:16px 0;}
.zn-nav-inner{display:flex;align-items:center;justify-content:space-between;}
.zn-logo{font-family:var(--font);font-size:1.5rem;font-weight:400;letter-spacing:3px;color:var(--ink);text-transform:uppercase;}
.zn-logo:hover{color:var(--gold);}
.zn-nav-links{display:flex;align-items:center;gap:36px;list-style:none;}
.zn-nav-links a{font-family:var(--font-sans);font-size:12px;font-weight:500;letter-spacing:2px;text-transform:uppercase;color:var(--ink2);transition:color .2s;}
.zn-nav-links a:hover{color:var(--gold);}
.zn-hamburger{display:none;flex-direction:column;gap:6px;cursor:pointer;background:none;border:none;padding:4px;}
.zn-hamburger span{display:block;width:22px;height:1px;background:var(--ink);transition:var(--trans);}

/* ── Mobile Nav ── */
#zn-mobile-nav{display:none;position:fixed;inset:0;background:var(--paper);z-index:999;flex-direction:column;align-items:center;justify-content:center;gap:32px;}
#zn-mobile-nav.open{display:flex;}
#zn-mobile-nav a{font-family:var(--font);font-size:2rem;color:var(--ink);font-weight:400;letter-spacing:2px;}
#zn-mobile-nav a:hover{color:var(--gold);}
#zn-mobile-close{position:absolute;top:28px;right:32px;background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink);font-family:var(--font-sans);}

/* ── Hero ── */
#zn-hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--ink);}
.zn-hero-bg{position:absolute;inset:0;background:linear-gradient(135deg,#2a2018 0%,#1a1410 40%,#0f0c08 100%);z-index:0;}
.zn-hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;mix-blend-mode:luminosity;}
.zn-hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,12,8,.85) 0%,rgba(15,12,8,.3) 50%,rgba(15,12,8,.1) 100%);z-index:1;}
.zn-hero-content{position:relative;z-index:2;padding:0 0 80px;width:100%;}
.zn-hero-eyebrow{font-family:var(--font-sans);font-size:10px;letter-spacing:5px;text-transform:uppercase;color:var(--gold2);margin-bottom:20px;}
.zn-hero-title{font-family:var(--font);font-size:clamp(3rem,6vw,5rem);font-weight:300;line-height:1.1;color:#fff;letter-spacing:1px;margin-bottom:24px;}
.zn-hero-title em{font-style:italic;color:var(--gold2);}
.zn-hero-sub{font-family:var(--font-sans);font-size:.9rem;color:rgba(255,255,255,.6);letter-spacing:.5px;max-width:460px;margin-bottom:40px;line-height:1.9;}
.zn-hero-actions{display:flex;gap:16px;flex-wrap:wrap;}
.zn-hero-scroll{position:absolute;right:48px;bottom:48px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(255,255,255,.4);font-size:10px;letter-spacing:3px;text-transform:uppercase;font-family:var(--font-sans);}
.zn-scroll-line{width:1px;height:48px;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.3));animation:scrollline 1.6s ease-in-out infinite;}
@keyframes scrollline{0%{transform:scaleY(0);transform-origin:top;}50%{transform:scaleY(1);transform-origin:top;}51%{transform:scaleY(1);transform-origin:bottom;}100%{transform:scaleY(0);transform-origin:bottom;}}

/* ── Philosophy strip ── */
.zn-philosophy{background:var(--ink);color:#fff;padding:56px 0;border-top:1px solid rgba(255,255,255,.08);}
.zn-philosophy-inner{display:flex;align-items:center;justify-content:center;gap:64px;flex-wrap:wrap;text-align:center;}
.zn-phil-item{flex:1;min-width:160px;}
.zn-phil-num{font-family:var(--font);font-size:2.4rem;font-weight:300;color:var(--gold2);display:block;line-height:1;}
.zn-phil-label{font-family:var(--font-sans);font-size:11px;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:8px;}
.zn-phil-divider{width:1px;height:48px;background:rgba(255,255,255,.15);}

/* ── Concept split ── */
.zn-concept{display:grid;grid-template-columns:1fr 1fr;min-height:600px;}
.zn-concept-img{position:relative;overflow:hidden;background:var(--bg3);}
.zn-concept-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease;}
.zn-concept-img:hover img{transform:scale(1.04);}
.zn-concept-placeholder{width:100%;height:100%;min-height:500px;background:linear-gradient(135deg,#d6cfc3,#ede9e2);display:flex;align-items:center;justify-content:center;color:var(--light);flex-direction:column;gap:12px;}
.zn-concept-body{padding:80px 64px;display:flex;flex-direction:column;justify-content:center;background:var(--paper);}

/* ── Rooms grid ── */
.zn-rooms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:48px;}
.zn-room-card{position:relative;overflow:hidden;background:var(--bg3);}
.zn-room-card-img{height:320px;overflow:hidden;}
.zn-room-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.zn-room-card:hover .zn-room-card-img img{transform:scale(1.05);}
.zn-room-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#d6cfc3,#c8bfb0);display:flex;align-items:center;justify-content:center;color:var(--light);}
.zn-room-card-body{background:var(--paper);padding:24px 28px 28px;}
.zn-room-tag{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--gold);font-family:var(--font-sans);margin-bottom:8px;}
.zn-room-title{font-family:var(--font);font-size:1.3rem;font-weight:400;color:var(--ink);margin-bottom:8px;}
.zn-room-desc{font-size:.84rem;color:var(--muted);line-height:1.8;margin-bottom:16px;}
.zn-room-link{font-family:var(--font-sans);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);border-bottom:1px solid var(--gold2);padding-bottom:2px;transition:var(--trans);}
.zn-room-link:hover{color:var(--ink);border-color:var(--ink);}

/* ── Amenities ── */
.zn-amenities-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border);margin-top:48px;}
.zn-amenity{padding:40px 28px;border-right:1px solid var(--border);transition:background .3s;}
.zn-amenity:last-child{border-right:none;}
.zn-amenity:hover{background:var(--bg2);}
.zn-amenity-icon{font-size:24px;margin-bottom:16px;}
.zn-amenity-title{font-family:var(--font);font-size:1.05rem;font-weight:400;color:var(--ink);margin-bottom:8px;}
.zn-amenity-desc{font-size:.82rem;color:var(--muted);line-height:1.8;}

/* ── Gallery ── */
.zn-gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:280px 280px;gap:3px;margin-top:48px;}
.zn-gallery-item{overflow:hidden;background:var(--bg3);position:relative;}
.zn-gallery-item:first-child{grid-row:1/3;}
.zn-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.zn-gallery-item:hover img{transform:scale(1.06);}
.zn-gallery-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#d6cfc3,#ede9e2);display:flex;align-items:center;justify-content:center;color:var(--light);font-size:13px;font-family:var(--font-sans);}

/* ── Testimonial ── */
.zn-testimonial-wrap{background:var(--ink);padding:100px 0;color:#fff;}
.zn-testimonial-inner{max-width:720px;margin:0 auto;text-align:center;padding:0 40px;}
.zn-quote-mark{font-family:var(--font);font-size:80px;color:var(--gold);line-height:.5;margin-bottom:24px;display:block;opacity:.6;}"
.zn-testimonial-text{font-family:var(--font);font-size:clamp(1.2rem,2vw,1.6rem);font-weight:300;line-height:1.7;color:rgba(255,255,255,.9);font-style:italic;margin-bottom:32px;}
.zn-testimonial-author{font-family:var(--font-sans);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--gold2);}

/* ── CTA ── */
.zn-cta-wrap{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.zn-cta-inner{display:grid;grid-template-columns:1fr auto;align-items:center;gap:48px;padding:72px 0;}
.zn-cta-text{}

/* ── Footer ── */
#zn-footer{background:var(--ink);color:rgba(255,255,255,.7);padding:72px 0 36px;}
.zn-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:56px;padding-bottom:56px;border-bottom:1px solid rgba(255,255,255,.08);}
.zn-footer-logo{font-family:var(--font);font-size:1.4rem;font-weight:400;letter-spacing:4px;color:#fff;text-transform:uppercase;display:block;margin-bottom:16px;}
.zn-footer-desc{font-size:.84rem;color:rgba(255,255,255,.45);line-height:1.9;max-width:240px;}
.zn-footer-col-title{font-family:var(--font-sans);font-size:10px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold2);margin-bottom:20px;}
.zn-footer-links{list-style:none;display:flex;flex-direction:column;gap:12px;}
.zn-footer-links a{font-size:.85rem;color:rgba(255,255,255,.45);transition:color .2s;}
.zn-footer-links a:hover{color:#fff;}
.zn-footer-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.zn-footer-copy{font-size:.78rem;color:rgba(255,255,255,.3);letter-spacing:.5px;}
.zn-social{display:flex;gap:16px;}
.zn-social a{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.35);font-family:var(--font-sans);transition:color .2s;}
.zn-social a:hover{color:var(--gold2);}

/* ── Responsive ── */
@media(max-width:1024px){
  .zn-rooms-grid{grid-template-columns:1fr 1fr;}
  .zn-amenities-grid{grid-template-columns:1fr 1fr;}
  .zn-amenity:nth-child(2){border-right:none;}
  .zn-amenity:nth-child(3){border-top:1px solid var(--border);}
  .zn-amenity:nth-child(4){border-top:1px solid var(--border);border-right:none;}
  .zn-footer-grid{grid-template-columns:1fr 1fr;}
  .zn-cta-inner{grid-template-columns:1fr;text-align:center;}
}
@media(max-width:768px){
  .zn-container{padding:0 24px;}
  .zn-container-sm{padding:0 24px;}
  .zn-section{padding:72px 0;}
  .zn-nav-links,.zn-nav-cta{display:none;}
  .zn-hamburger{display:flex;}
  .zn-concept{grid-template-columns:1fr;}
  .zn-concept-body{padding:48px 32px;}
  .zn-rooms-grid{grid-template-columns:1fr;}
  .zn-gallery{grid-template-columns:1fr 1fr;grid-template-rows:auto;}
  .zn-gallery-item:first-child{grid-row:auto;}
  .zn-hero-scroll{display:none;}
  .zn-phil-divider{display:none;}
}
@media(max-width:480px){
  .zn-amenities-grid{grid-template-columns:1fr;}
  .zn-amenity{border-right:none;border-top:1px solid var(--border);}
  .zn-amenity:first-child{border-top:none;}
  .zn-footer-grid{grid-template-columns:1fr;}
  .zn-gallery{grid-template-columns:1fr;}
  .zn-philosophy-inner{gap:32px;}
}
