@charset "utf-8";
/* ═══════════════════════════════════════════════
   46 MAISON BLANC — 웨딩 스튜디오
   컨셉: 우아한 미니멀 / 블러쉬 뉴트럴 + 머스크 골드 / 가는 고딕 + 넓은 자간
        큰 여백·가는 라인·세로 디테일 — 기존 템플릿과 겹치지 않는 파인아트 무드
   ═══════════════════════════════════════════════ */
:root{
  --cream:#f7f1ea;
  --cream-2:#efe6db;
  --paper:#fdfaf6;
  --ink:#2a2622;
  --ink-2:#6e655b;
  --ink-3:#9c9388;
  --line:#e4d9ca;
  --gold:#b8986a;
  --gold-deep:#9a7c52;
  --sage:#8a9080;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Pretendard Variable',Pretendard,'Noto Sans KR',sans-serif;color:var(--ink);background:var(--cream);font-size:16px;line-height:1.8;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,select,textarea{font-family:inherit}
.wrap{max-width:1240px;margin:0 auto;padding:0 36px}
.wrap-n{max-width:920px;margin:0 auto;padding:0 36px}
.en{letter-spacing:.34em;text-transform:uppercase}

html.js .reveal{opacity:0;transform:translateY(28px);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1)}
html.js .reveal.on{opacity:1;transform:none}

/* ── 헤더 ── */
.hd{position:fixed;top:0;left:0;right:0;z-index:100;padding:26px 0;transition:background .5s,padding .5s,color .5s;color:#fff}
.hd.solid{background:rgba(247,241,234,.92);backdrop-filter:blur(12px);color:var(--ink);padding:16px 0;box-shadow:0 1px 0 var(--line)}
.hd-in{max-width:1240px;margin:0 auto;padding:0 36px;display:flex;align-items:center;justify-content:space-between}
.logo{font-size:23px;font-weight:500;letter-spacing:.26em;line-height:1}
.logo small{display:block;font-size:8.5px;font-weight:500;letter-spacing:.42em;margin-top:6px;opacity:.7}
.gnb{display:flex;gap:34px;align-items:center}
.gnb a{font-size:13px;font-weight:500;letter-spacing:.06em;position:relative;padding:4px 0;transition:opacity .25s}
.gnb a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;background:var(--gold);transition:right .4s}
.gnb a:hover::after,.gnb a.active::after{right:0}
.hd .resv{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;border:1px solid currentColor;border-radius:0;padding:11px 22px;transition:.3s}
.hd.solid .resv{border-color:var(--gold);color:var(--gold-deep)}
.hd .resv:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.m-burger{display:none;font-size:22px}

#mNav{position:fixed;inset:0;background:var(--cream);z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;opacity:0;pointer-events:none;transition:opacity .5s}
#mNav.open{opacity:1;pointer-events:auto}
#mNav a{font-size:26px;font-weight:300;letter-spacing:.16em;padding:12px;color:var(--ink)}
#mNav a:hover{color:var(--gold-deep)}
#mNav .m-close{position:absolute;top:24px;right:28px;font-size:28px}

/* ── 히어로 슬라이드 ── */
.hero{position:relative;height:100vh;min-height:620px;overflow:hidden}
.hero .swiper,.hero .swiper-wrapper,.hero .swiper-slide{height:100%}
.hero .swiper-slide{position:relative}
.hero .swiper:not(.swiper-initialized) .swiper-slide:not(:first-child){display:none}
.hero .swiper-slide img{width:100%;height:100%;object-fit:cover}
.hero .swiper-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,26,22,.32),rgba(30,26,22,.12) 35%,rgba(30,26,22,.5))}
.hero-cap{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:0 24px}
.hero-cap .ovl{font-size:12px;font-weight:500;letter-spacing:.4em;text-transform:uppercase;opacity:.92;margin-bottom:22px}
.hero-cap h1{font-size:clamp(34px,5.6vw,76px);font-weight:300;line-height:1.18;letter-spacing:.04em}
.hero-cap h1 b{font-weight:500}
.hero-cap .sub{margin-top:20px;font-size:15px;font-weight:300;letter-spacing:.06em;opacity:.92;max-width:480px;line-height:2}
.hero-cap .cta{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:15px 32px;transition:.3s;border:1px solid transparent}
.btn-gold{background:var(--gold);color:#fff}
.btn-gold:hover{background:var(--gold-deep)}
.btn-line{border-color:rgba(255,255,255,.7);color:#fff}
.btn-line:hover{background:#fff;color:var(--ink)}
.btn-dline{border-color:var(--ink);color:var(--ink)}
.btn-dline:hover{background:var(--ink);color:var(--cream)}
.btn-dgold{border-color:var(--gold);color:var(--gold-deep)}
.btn-dgold:hover{background:var(--gold);color:#fff}
.hero .h-pg{position:absolute;left:0;right:0;bottom:34px;z-index:4;display:flex;justify-content:center;gap:0}
.hero .h-pg .swiper-pagination-bullet{width:42px;height:2px;border-radius:0;background:rgba(255,255,255,.4);opacity:1;margin:0 5px !important;transition:.3s}
.hero .h-pg .swiper-pagination-bullet-active{background:#fff}

/* ── 섹션 공통 ── */
.sec{padding:130px 0}
.sec-tit{text-align:center;margin-bottom:64px}
.sec-tit .ovl{font-size:11.5px;font-weight:600;letter-spacing:.36em;text-transform:uppercase;color:var(--gold-deep)}
.sec-tit h2{font-size:clamp(28px,3.8vw,46px);font-weight:300;letter-spacing:.04em;line-height:1.3;margin-top:18px}
.sec-tit h2 b{font-weight:500}
.sec-tit .ds{margin:18px auto 0;max-width:540px;color:var(--ink-2);font-size:15px;line-height:2;font-weight:300}
.sec-tit .div{width:40px;height:1px;background:var(--gold);margin:26px auto 0}

/* ── 인트로 (좌 이미지 / 우 텍스트) ── */
.intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.intro .ph{position:relative}
.intro .ph img{width:100%;aspect-ratio:4/5;object-fit:cover}
.intro .ph .frame{position:absolute;inset:18px;border:1px solid rgba(255,255,255,.5);pointer-events:none}
.intro .tx .ovl{font-size:11.5px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--gold-deep)}
.intro .tx h2{font-size:clamp(26px,3.4vw,40px);font-weight:300;letter-spacing:.03em;line-height:1.4;margin:18px 0 22px}
.intro .tx h2 b{font-weight:500}
.intro .tx p{color:var(--ink-2);font-size:15.5px;line-height:2.05;font-weight:300;margin-bottom:16px}
.intro .tx .sign{margin-top:26px;font-size:14px;letter-spacing:.04em;color:var(--ink)}
.intro .tx .sign b{font-weight:600}

/* ── 서비스 ── */
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--line)}
.svc{position:relative;background:var(--cream);overflow:hidden}
.svc .ph{aspect-ratio:16/11;overflow:hidden}
.svc .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.svc:hover .ph img{transform:scale(1.05)}
.svc .bd{padding:34px 38px 38px}
.svc .no{font-size:12px;letter-spacing:.2em;color:var(--gold-deep)}
.svc h3{font-size:23px;font-weight:400;letter-spacing:.04em;margin:10px 0 12px}
.svc p{color:var(--ink-2);font-size:14.5px;font-weight:300;line-height:1.95}
.svc .mo{margin-top:18px;display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);transition:gap .3s}
.svc .mo:hover{gap:14px;color:var(--gold-deep)}

/* ── 갤러리 프리뷰 (정제 그리드) ── */
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gal-grid.lg{grid-template-columns:repeat(3,1fr);gap:18px}
.ga{position:relative;overflow:hidden;display:block;background:var(--cream-2)}
.ga img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.ga.wide img{aspect-ratio:3/4}
.ga:hover img{transform:scale(1.06)}
.ga::after{content:"";position:absolute;inset:0;background:rgba(30,26,22,0);transition:background .4s}
.ga:hover::after{background:rgba(30,26,22,.18)}
.ga .lb{position:absolute;left:18px;bottom:16px;z-index:2;color:#fff;opacity:0;transform:translateY(8px);transition:.4s}
.ga:hover .lb{opacity:1;transform:none}
.ga .lb span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.85}
.ga .lb h4{font-size:16px;font-weight:400;margin-top:4px}

/* ── 가격 패키지 ── */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pk{background:var(--paper);border:1px solid var(--line);padding:44px 36px 40px;text-align:center;position:relative;transition:.35s}
.pk:hover{transform:translateY(-6px);box-shadow:0 30px 60px rgba(42,38,34,.1)}
.pk.feat{border-color:var(--gold);background:#fff}
.pk.feat .badge{position:absolute;top:-1px;left:50%;transform:translateX(-50%);background:var(--gold);color:#fff;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;padding:6px 16px}
.pk .nm{font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-deep)}
.pk .pr{font-size:40px;font-weight:300;letter-spacing:.02em;margin:18px 0 4px}
.pk .pr small{font-size:15px;color:var(--ink-3)}
.pk .note{font-size:12.5px;color:var(--ink-3);margin-bottom:24px}
.pk ul{text-align:left;border-top:1px solid var(--line);padding-top:24px}
.pk li{font-size:14px;color:var(--ink-2);font-weight:300;padding:8px 0;display:flex;gap:10px}
.pk li::before{content:"—";color:var(--gold);flex-shrink:0}
.pk .btn{width:100%;margin-top:28px}

/* ── 프로세스 스텝 ── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.step{padding:40px 26px;border-right:1px solid var(--line);position:relative}
.step:last-child{border-right:0}
.step .no{font-size:13px;letter-spacing:.2em;color:var(--gold-deep)}
.step h3{font-size:19px;font-weight:400;letter-spacing:.03em;margin:14px 0 10px}
.step p{font-size:13.5px;color:var(--ink-2);font-weight:300;line-height:1.85}

/* ── 후기 ── */
.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.rv{background:var(--paper);border:1px solid var(--line);padding:34px 32px}
.rv .st{color:var(--gold);letter-spacing:3px;font-size:13px}
.rv p{margin-top:14px;font-size:14.5px;color:var(--ink);font-weight:300;line-height:1.95}
.rv .who{margin-top:20px;font-size:12.5px;color:var(--ink-3);letter-spacing:.04em}
.rv .who b{color:var(--ink);font-weight:500}

/* ── 풀폭 인용/배너 ── */
.quote{position:relative;padding:150px 0;text-align:center;color:#fff;overflow:hidden}
.quote .bg{position:absolute;inset:0}
.quote .bg img{width:100%;height:100%;object-fit:cover}
.quote .bg::after{content:"";position:absolute;inset:0;background:rgba(30,26,22,.5)}
.quote .inner{position:relative;z-index:2}
.quote p{font-size:clamp(22px,3vw,38px);font-weight:300;letter-spacing:.04em;line-height:1.6;max-width:760px;margin:0 auto}
.quote .by{margin-top:26px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;opacity:.85}

/* ── CTA ── */
.cta-sec{padding:120px 0;text-align:center}
.cta-sec h2{font-size:clamp(28px,4vw,52px);font-weight:300;letter-spacing:.04em;line-height:1.3}
.cta-sec h2 b{font-weight:500}
.cta-sec p{margin:20px auto 0;max-width:460px;color:var(--ink-2);font-size:15px;font-weight:300;line-height:2}
.cta-sec .cta{margin-top:36px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ── 푸터 ── */
.footer{background:var(--ink);color:#b3a99c;padding:80px 0 40px}
.ft-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:44px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.1)}
.ft-top .lg{font-size:23px;font-weight:400;letter-spacing:.24em;color:#fff}
.ft-top .lg small{display:block;font-size:8.5px;letter-spacing:.4em;margin-top:8px;color:#8a8073}
.ft-top p{margin-top:18px;font-size:13px;line-height:1.95;color:#8a8073;font-weight:300}
.ft-top h4{color:#fff;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px}
.ft-top li{margin-bottom:10px;font-size:13.5px;font-weight:300}
.ft-top li a:hover{color:#fff}
.ft-top .tel{font-size:21px;font-weight:300;color:#fff;letter-spacing:.04em}
.ft-bot{padding-top:26px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:#6f665b}

/* ── 서브 히어로 ── */
.sub-hero{position:relative;padding:200px 0 90px;text-align:center;color:#fff;overflow:hidden}
.sub-hero .bg{position:absolute;inset:0}
.sub-hero .bg img{width:100%;height:100%;object-fit:cover}
.sub-hero .bg::after{content:"";position:absolute;inset:0;background:rgba(30,26,22,.46)}
.sub-hero .inner{position:relative;z-index:2}
.sub-hero .crumb{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;opacity:.85}
.sub-hero h1{font-size:clamp(34px,5vw,62px);font-weight:300;letter-spacing:.06em;margin-top:16px}
.sub-hero p{max-width:540px;margin:18px auto 0;font-size:15px;font-weight:300;line-height:2;opacity:.92}

/* ── ABOUT ── */
.ab-body{padding:120px 0}
.ab-team{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:20px}
.tm{text-align:center}
.tm .ph{aspect-ratio:3/4;overflow:hidden;margin-bottom:18px}
.tm .ph img{width:100%;height:100%;object-fit:cover}
.tm .ro{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep)}
.tm h3{font-size:20px;font-weight:400;margin:8px 0 8px}
.tm p{font-size:13.5px;color:var(--ink-2);font-weight:300}

/* ── PRICE 표 보조 ── */
.opt-table{width:100%;border-collapse:collapse;margin-top:20px;font-weight:300}
.opt-table th,.opt-table td{padding:16px 18px;border-bottom:1px solid var(--line);text-align:left;font-size:14.5px}
.opt-table th{font-weight:500;letter-spacing:.06em;color:var(--ink)}
.opt-table td:last-child{text-align:right;color:var(--gold-deep);font-weight:400}

/* ── FAQ (process 내) ── */
.faq{max-width:820px;margin:0 auto}
.fq{border-bottom:1px solid var(--line)}
.fq summary{padding:24px 4px;font-size:16px;font-weight:400;letter-spacing:.02em;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.fq summary::-webkit-details-marker{display:none}
.fq summary::after{content:"+";color:var(--gold-deep);font-size:22px;font-weight:300;transition:transform .3s}
.fq[open] summary::after{transform:rotate(45deg)}
.fq p{padding:0 4px 26px;color:var(--ink-2);font-size:14.5px;font-weight:300;line-height:1.95}

/* ── CONTACT ── */
.ct-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:start}
.ct-info h2{font-size:clamp(26px,3.4vw,40px);font-weight:300;letter-spacing:.03em;line-height:1.35;margin-bottom:22px}
.ct-info h2 b{font-weight:500}
.ct-info p{color:var(--ink-2);font-size:15px;font-weight:300;line-height:2;margin-bottom:30px}
.ct-info .row{display:flex;gap:16px;padding:18px 0;border-top:1px solid var(--line)}
.ct-info .row .k{width:90px;flex-shrink:0;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);padding-top:3px}
.ct-info .row .v{font-size:14.5px;color:var(--ink);font-weight:300}
.ct-form{background:var(--paper);border:1px solid var(--line);padding:40px}
.ct-form .fr{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ct-form .fld{margin-bottom:18px}
.ct-form label{display:block;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:9px}
.ct-form input,.ct-form select,.ct-form textarea{width:100%;background:var(--cream);border:1px solid var(--line);border-radius:0;padding:13px 15px;font-size:14.5px;color:var(--ink);font-weight:300;outline:0;transition:border-color .25s}
.ct-form input:focus,.ct-form select:focus,.ct-form textarea:focus{border-color:var(--gold)}
.ct-form .btn{width:100%;margin-top:6px}

/* ── 반응형 ── */
@media (max-width:1024px){
  .intro{grid-template-columns:1fr;gap:44px}
  .svc-grid{grid-template-columns:1fr}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .gal-grid.lg{grid-template-columns:repeat(2,1fr)}
  .price-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto}
  .steps{grid-template-columns:1fr 1fr}
  .step:nth-child(2n){border-right:0}
  .rv-grid{grid-template-columns:1fr}
  .ab-team{grid-template-columns:1fr}
  .ct-grid{grid-template-columns:1fr;gap:40px}
  .ft-top{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  .wrap,.wrap-n{padding:0 22px}
  .gnb,.hd .resv{display:none}
  .m-burger{display:block}
  .sec{padding:80px 0}
  .gal-grid{grid-template-columns:1fr 1fr;gap:8px}
  .steps{grid-template-columns:1fr}
  .step{border-right:0;border-bottom:1px solid var(--line)}
  .ct-form{padding:26px}
  .ct-form .fr{grid-template-columns:1fr}
  .ft-top{grid-template-columns:1fr}
  .sub-hero{padding:150px 0 64px}
}
@media (prefers-reduced-motion:reduce){
  .reveal{transition:none}
}
