/*
Theme Name: 優美堂 YUBIDO
Theme URI: https://yubido.net/
Author: Office Concierge
Description: 優美堂のエステサロン向け、上品な和モダンの1ページWordPressテーマです。
Version: 1.2.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: yubido
*/

:root{--ink:#4a3829;--muted:#7d7065;--cream:#fbf6ef;--paper:#fffdf9;--wine:#b48179;--wine-dark:#8f5d57;--gold:#ad7d32;--sage:#929277;--blush:#efd5cf;--line:#e1d3c0;--serif:"Yu Mincho","Hiragino Mincho ProN",Georgia,serif;--sans:"Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--sans);line-height:1.85}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}.wrap{width:min(1120px,calc(100% - 40px));margin:auto}.eyebrow{color:var(--gold);font-size:.75rem;letter-spacing:.28em;text-transform:uppercase}.section-title{margin:.25rem 0 2.5rem;font:400 clamp(1.8rem,4vw,2.8rem)/1.35 var(--serif);letter-spacing:.12em}
.site-header{position:fixed;z-index:20;top:0;width:100%;background:rgba(255,253,249,.94);border-bottom:1px solid rgba(225,211,192,.75);backdrop-filter:blur(10px)}.header-inner{height:84px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.header-symbol{display:block;width:68px;height:68px;object-fit:contain;flex:0 0 68px}.brand-text strong{display:block;font:400 1.35rem var(--serif);letter-spacing:.22em}.brand-text small{display:block;color:var(--muted);font-size:.62rem;letter-spacing:.24em}.nav{display:flex;align-items:center;gap:28px;font-size:.83rem;letter-spacing:.08em}.nav .reserve{padding:11px 20px;color:#fff;background:var(--gold)}.menu-toggle{display:none;border:0;background:none;font-size:1.4rem}
.hero{padding-top:84px;background:#fbf8f2}.hero-visual{position:relative;max-width:1440px;margin:auto;overflow:hidden}.hero-visual img{display:block;width:100%;height:auto}.hero-followup{padding:48px 20px 54px;text-align:center;background:linear-gradient(180deg,#fbf8f2,#fffdf9)}.hero-followup h1{margin:8px auto 12px;font:400 clamp(1.7rem,3.3vw,2.7rem)/1.5 var(--serif);letter-spacing:.12em;color:var(--gold)}.hero-lead{max-width:650px;margin:auto;color:var(--muted)}.hero-actions{display:flex;justify-content:center;gap:14px;margin-top:28px}.button{display:inline-block;padding:14px 26px;border:1px solid var(--gold);letter-spacing:.08em;font-size:.9rem}.button.primary{color:#fff;background:var(--gold)}.button.ghost{color:var(--gold)}
.intro,.menu-section,.salon,.faq{padding:110px 0}.intro-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.intro-copy h3{font:400 1.65rem/1.7 var(--serif);letter-spacing:.08em}.intro-copy p{color:var(--muted)}.promise{margin-top:80px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.promise article{padding:34px;border-right:1px solid var(--line)}.promise article:last-child{border:0}.promise b{color:var(--gold);font:400 2rem var(--serif)}.promise h4{font:400 1.1rem var(--serif);letter-spacing:.08em}.promise p{font-size:.9rem;color:var(--muted)}
.menu-section{background:var(--cream)}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.menu-card{padding:36px;background:var(--paper);border:1px solid var(--line)}.menu-card .num{color:var(--gold);font-family:var(--serif)}.menu-card h3{font:400 1.35rem var(--serif);letter-spacing:.08em}.menu-card p{min-height:82px;color:var(--muted);font-size:.92rem}.price{padding-top:18px;border-top:1px solid var(--line);font-family:var(--serif)}.price strong{font-size:1.35rem;color:var(--gold)}
.brand-story{padding:110px 0;background:var(--paper)}.brand-story-grid{display:grid;grid-template-columns:minmax(300px,.88fr) 1.12fr;align-items:center;gap:80px}.brand-story-image{padding:18px;background:#fff;border:1px solid var(--line);box-shadow:0 22px 55px rgba(100,75,45,.12)}.brand-story-image img{display:block;width:100%}.brand-story-copy h2{font:400 clamp(1.8rem,4vw,2.8rem)/1.5 var(--serif);letter-spacing:.12em;color:var(--gold)}.brand-story-copy p{color:var(--muted)}.brand-values{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}.brand-values span{padding:8px 14px;border:1px solid var(--line);border-radius:50px;color:var(--gold);font-family:var(--serif)}
.message{padding:110px 0;color:#fff;background:linear-gradient(135deg,#a77b72,#87635f)}.message-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}.message blockquote{margin:0;font:400 clamp(1.7rem,3vw,2.6rem)/1.8 var(--serif);letter-spacing:.08em}.message p{color:#f4e9e5}
.salon-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px}.salon-photo{min-height:420px;display:grid;place-items:center;background:linear-gradient(135deg,#f0dfd8,#ddd3b9);color:rgba(173,125,50,.48);font:400 7rem var(--serif)}.salon table{width:100%;border-collapse:collapse}.salon th,.salon td{padding:14px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.salon th{width:30%;font-weight:400;color:var(--muted)}.faq{background:var(--cream)}details{padding:22px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer;font-family:var(--serif);letter-spacing:.05em}.answer{padding:12px 28px 0;color:var(--muted)}
.cta{padding:90px 0;text-align:center;background:var(--ink);color:#fff}.cta h2{font:400 clamp(1.8rem,4vw,2.8rem) var(--serif);letter-spacing:.1em}.cta p{color:#ddd0c7}.cta .button{margin-top:20px;border-color:#fff;background:#fff;color:var(--gold)}.site-footer{padding:40px 0;background:#2c211b;color:#cbbfb7;font-size:.8rem}.footer-inner{display:flex;justify-content:space-between}
@media(max-width:850px){.nav{display:none}.menu-toggle{display:block}.nav.open{position:absolute;top:84px;left:0;width:100%;display:flex;flex-direction:column;padding:25px;background:var(--paper);border-bottom:1px solid var(--line)}.intro-grid,.message-grid,.salon-grid,.brand-story-grid{grid-template-columns:1fr;gap:38px}.brand-story-image{max-width:580px;margin:auto}.promise,.menu-grid{grid-template-columns:1fr}.promise article{border-right:0;border-bottom:1px solid var(--line)}.promise article:last-child{border-bottom:0}}
@media(max-width:520px){.wrap{width:calc(100% - 28px)}.header-inner{height:72px}.header-symbol{width:54px;height:54px;flex-basis:54px}.brand-text strong{font-size:1.05rem}.brand-text small{font-size:.52rem;letter-spacing:.12em}.hero{padding-top:72px}.hero-visual img{width:146%;max-width:none;margin-left:-23%}.hero-followup{padding:38px 18px 44px}.hero-actions{flex-direction:column}.hero-actions .button{text-align:center}.intro,.menu-section,.salon,.faq,.message,.brand-story{padding:76px 0}.footer-inner{display:block}.footer-inner span{display:block;margin-top:8px}}
