/* 제목용 서체: 나눔스퀘어라운드 ExtraBold (SIL OFL 1.1 · /assets/fonts/OFL.txt) 를 "CTT Round" 이름으로 나눠 담음 */
@font-face{font-family:"CTT Round";font-style:normal;font-weight:800;font-display:swap;src:url("/assets/fonts/ctt-round-rest.woff2?v=20261006a") format("woff2");unicode-range:U+22-24,U+27,U+2A,U+3B-3C,U+3E,U+40,U+5B-60,U+7B-7D,U+3131-318E,U+AC01-AC03,U+AC05-AC0F,U+AC12-AC14,U+AC16-AC1B,U+AC1E-AC6F,U+AC71-AC73,U+AC75-AC8B,U+AC8D-ACA7,U+ACA9-ACAB,U+ACAD-ACAF,U+ACB1-ACB8,U+ACBA-ACBC,U+ACBE-ACC3,U+ACC5-ACDF,U+ACE1-ACF2,U+ACF4,U+ACF6-ACFB,U+ACFD-ACFF,U+AD01-AD4F,U+AD51-AD6B,U+AD6E-AD6F,U+AD71-AD8B,U+AD8D-ADDB,U+ADDD-ADF7,U+ADF9-AE07,U+AE09-AE2F,U+AE31-AE3F,U+AE41-AE4B,U+AE4D-AED7,U+AED9-AF2B,U+AF2E-AF42,U+AF44-B05C,U+B05E-B07B,U+B07D-B097,U+B099-B09B,U+B09D-B09F,U+B0A1-B0A7,U+B0A9-B0AC,U+B0AE-B0B3,U+B0B6-B0C4,U+B0C6-B107,U+B109-B10F,U+B111-B11A,U+B11C-B122,U+B125-B143,U+B145-B14F,U+B151-B177,U+B17A-B17B,U+B17D-B207,U+B209-B273,U+B275-B293,U+B295-B297,U+B299-B2C7,U+B2C9-B2CF,U+B2D1-B2DA,U+B2DC-B2E3,U+B2E5-B2E7,U+B2E9-B2EB,U+B2EE-B2F3,U+B2F5-B2F8,U+B2FA-B2FF,U+B301-B353,U+B355-B36D,U+B36F-B3C3,U+B3C5-B3CB,U+B3CD-B3D8,U+B3DA-B3FB,U+B3FD-B417,U+B419-B428,U+B42A-B44F,U+B451-B45F,U+B461-B4A3,U+B4A5-B4DB,U+B4DD-B4DF,U+B4E1-B4E3,U+B4E5-B513,U+B515-B5A0,U+B5A2-B5A3,U+B5A5-B5BB,U+B5BD-B77B,U+B77E-B78B,U+B78D-B790,U+B792-B797,U+B79A-B79B,U+B79D-B7A7,U+B7A9-B7C8,U+B7CA-B7EB,U+B7EE-B7EF,U+B7F1-B7FC,U+B7FE,U+B800-B806,U+B809-B80B,U+B80D-B823,U+B826-B85B,U+B85E-B870,U+B872-B8CB,U+B8CD-B957,U+B959-B974,U+B976-B97B,U+B97D-B983,U+B985-B9AB,U+B9AD-B9AF,U+B9B1-B9BB,U+B9BE-B9C0,U+B9C2-B9C7,U+B9CA-B9CB,U+B9CD-B9DA,U+B9DC-B9DD,U+B9DF-BA37,U+BA39-BA53,U+BA55-BA6F,U+BA71-BA73,U+BA75-BA84,U+BA86-BAA7,U+BAAA-BAAB,U+BAAD-BAAF,U+BAB1-BABC,U+BABE-BB33,U+BB36-BB37,U+BB39-BB3A,U+BB3D-BBF7,U+BBF9-BBFB,U+BBFD-BBFF,U+BC01-BC0E,U+BC10-BC13,U+BC15-BC1A,U+BC1D-BC24,U+BC26-BC28,U+BC2A-BC2F,U+BC31-BC83,U+BC85-BC87,U+BC89-BC8B,U+BC8D-BC94,U+BC96-BC99,U+BC9B-BC9F,U+BCA1-BCA3,U+BCA5-BCBF,U+BCC1-BCC3,U+BCC5-BCF3,U+BCF7,U+BCF9-BD7F,U+BD81-BD83,U+BD85-BD87,U+BD89-BD94,U+BD96-BE0B,U+BE0D-BE13,U+BE15-BE43,U+BE45-BE58,U+BE5A-BE74,U+BE76-C0AB,U+C0AD-C0AF,U+C0B1-C0BB,U+C0BD-C0C0,U+C0C2-C0C7,U+C0C9-C0CB,U+C0CD-C0DC,U+C0DE-C11B,U+C11D-C11F,U+C121-C123,U+C125-C12E,U+C130,U+C132-C137,U+C139-C153,U+C155-C157,U+C159-C18B,U+C18E-C1A0,U+C1A2-C20C,U+C20E-C217,U+C21A-C21B,U+C21D-C22A,U+C22C,U+C22E-C26B,U+C26D-C2A3,U+C2A5-C2B4,U+C2B6-C2B8,U+C2BA-C2DB,U+C2DE-C2DF,U+C2E1-C2E3,U+C2E5-C2EB,U+C2ED-C4EF,U+C4F1-C543,U+C545-C547,U+C549,U+C54B,U+C54D-C560,U+C562-C57B,U+C57E-C5B3,U+C5B5-C5B7,U+C5B9-C5C3,U+C5C7-C5CF,U+C5D1-C5EB,U+C5EE-C5EF,U+C5F1-C5F3,U+C5F5-C5FF,U+C602-C607,U+C609-C61A,U+C61C-C623,U+C625-C627,U+C629-C634,U+C636-C63F,U+C641-C654,U+C656-C677,U+C679-C693,U+C696-C6A8,U+C6AA-C6AF,U+C6B1-C6B3,U+C6B5-C6B7,U+C6B9-C6BF,U+C6C1-C6CB,U+C6CD-C6CF,U+C6D1-C703,U+C705-C71F,U+C722-C73B,U+C73D-C73F,U+C741-C743,U+C745-C74B,U+C74D-C750,U+C752-C757,U+C759-C773,U+C776-C777,U+C779-C77B,U+C77D-C783,U+C786-C787,U+C789-C78F,U+C792-C793,U+C795-C7A4,U+C7A6-C7AB,U+C7AD-C7FF,U+C802-C803,U+C805-C807,U+C809-C810,U+C812-C814,U+C816-C81B,U+C81D-C86F,U+C871-C884,U+C886-C8FB,U+C8FD-C8FF,U+C901-C910,U+C912-C987,U+C989-C98F,U+C991-C9BF,U+C9C2-C9C3,U+C9C5-C9C7,U+C9C9-C9D0,U+C9D2,U+C9D4-C9DB,U+C9DD-CC27,U+CC2A-CC2B,U+CC2D-CC37,U+CC39-CC3C,U+CC3F-CC43,U+CC46-CC97,U+CC99-CC9B,U+CC9D-CCAA,U+CCAC,U+CCAE-CCB3,U+CCB5-CD07,U+CD09-CD2B,U+CD2D-CD5B,U+CD5D-CD93,U+CD96-CD9B,U+CD9D-CDA4,U+CDA6-CDAF,U+CDB1-CE03,U+CE05-CE57,U+CE59-CE5B,U+CE5D-CE67,U+CE6A-CE73,U+CE75-CE8F,U+CE91-CE9F,U+CEA1-CEE3,U+CEE5-CEF4,U+CEF6-CEFF,U+CF01-CF53,U+CF55-CFDF,U+CFE1-D06B,U+D06D-D073,U+D075-D0A3,U+D0A5-D0A7,U+D0A9-D0BF,U+D0C2-D0D4,U+D0D6-D0DC,U+D0DE-D12F,U+D131-D14B,U+D14D-D19F,U+D1A2-D22B,U+D22D-D27F,U+D281-D2B7,U+D2BA-D2EF,U+D2F1-D304,U+D306-D30B,U+D30D-D324,U+D326-D327,U+D329-D37B,U+D37D-D397,U+D399-D3EB,U+D3ED-D45B,U+D45D-D477,U+D479-D487,U+D489-D503,U+D505-D50B,U+D50D-D53B,U+D53D-D53F,U+D541-D543,U+D545-D557,U+D55A-D55B,U+D55D-D55F,U+D561-D567,U+D56A,U+D56C,U+D56E-D573,U+D575-D587,U+D58A-D5C7,U+D5C9-D5E3,U+D5E5-D603,U+D605-D637,U+D639-D647,U+D649-D64C,U+D64E-D653,U+D656-D657,U+D659-D668,U+D66A-D68B,U+D68D-D717,U+D719-D74F,U+D752-D787,U+D789-D7A3}
@font-face{font-family:"CTT Round";font-style:normal;font-weight:800;font-display:swap;src:url("/assets/fonts/ctt-round-core.woff2?v=20261006a") format("woff2");unicode-range:U+20-21,U+25-26,U+28-29,U+2B-3A,U+3D,U+3F,U+41-5A,U+61-7A,U+7E,U+B7,U+2018-2019,U+201C-201D,U+300C-300D,U+AC00,U+AC04,U+AC10-AC11,U+AC15,U+AC1C-AC1D,U+AC70,U+AC74,U+AC8C,U+ACA8,U+ACAC,U+ACB0,U+ACB9,U+ACBD,U+ACC4,U+ACE0,U+ACF3,U+ACF5,U+ACFC,U+AD00,U+AD50,U+AD6C-AD6D,U+AD70,U+AD8C,U+ADDC,U+ADF8,U+AE08,U+AE30,U+AE40,U+AE4C,U+AED8,U+AF2C-AF2D,U+AF43,U+B05D,U+B07C,U+B098,U+B09C,U+B0A0,U+B0A8,U+B0AD,U+B0B4-B0B5,U+B0C5,U+B108,U+B110,U+B11B,U+B123-B124,U+B144,U+B150,U+B178-B179,U+B17C,U+B208,U+B274,U+B294,U+B298,U+B2C8,U+B2D0,U+B2DB,U+B2E4,U+B2E8,U+B2EC-B2ED,U+B2F4,U+B2F9,U+B300,U+B354,U+B36E,U+B3C4,U+B3CC,U+B3D9,U+B3FC,U+B418,U+B429,U+B450,U+B460,U+B4A4,U+B4DC,U+B4E0,U+B4E4,U+B514,U+B5A1,U+B5A4,U+B5BC,U+B77C-B77D,U+B78C,U+B791,U+B798-B799,U+B79C,U+B7A8,U+B7C9,U+B7EC-B7ED,U+B7F0,U+B7FD,U+B7FF,U+B807-B808,U+B80C,U+B824-B825,U+B85C-B85D,U+B871,U+B8CC,U+B958,U+B975,U+B97C,U+B984,U+B9AC,U+B9B0,U+B9BC-B9BD,U+B9C1,U+B9C8-B9C9,U+B9CC,U+B9DB,U+B9DE,U+BA38,U+BA54,U+BA70,U+BA74,U+BA85,U+BAA8-BAA9,U+BAAC,U+BAB0,U+BABD,U+BB34-BB35,U+BB38,U+BB3B-BB3C,U+BBF8,U+BBFC,U+BC00,U+BC0F,U+BC14,U+BC1B-BC1C,U+BC25,U+BC29,U+BC30,U+BC84,U+BC88,U+BC8C,U+BC95,U+BC9A,U+BCA0,U+BCA4,U+BCC0,U+BCC4,U+BCF4-BCF6,U+BCF8,U+BD80,U+BD84,U+BD88,U+BD95,U+BE0C,U+BE14,U+BE44,U+BE59,U+BE75,U+C0AC,U+C0B0,U+C0BC,U+C0C1,U+C0C8,U+C0CC,U+C0DD,U+C11C,U+C120,U+C124,U+C12F,U+C131,U+C138,U+C154,U+C158,U+C18C-C18D,U+C1A1,U+C20D,U+C218-C219,U+C21C,U+C22B,U+C22D,U+C26C,U+C2A4,U+C2B5,U+C2B9,U+C2DC-C2DD,U+C2E0,U+C2E4,U+C2EC,U+C4F0,U+C544,U+C548,U+C54A,U+C54C,U+C561,U+C57C-C57D,U+C5B4,U+C5B8,U+C5C4-C5C6,U+C5D0,U+C5EC-C5ED,U+C5F0,U+C5F4,U+C600-C601,U+C608,U+C61B,U+C624,U+C628,U+C635,U+C640,U+C655,U+C678,U+C694-C695,U+C6A9,U+C6B0,U+C6B4,U+C6B8,U+C6C0,U+C6CC,U+C6D0,U+C704,U+C720-C721,U+C73C,U+C740,U+C744,U+C74C,U+C751,U+C758,U+C774-C775,U+C778,U+C77C,U+C784-C785,U+C788,U+C790-C791,U+C794,U+C7A5,U+C7AC,U+C800-C801,U+C804,U+C808,U+C811,U+C815,U+C81C,U+C870,U+C885,U+C8FC,U+C900,U+C911,U+C988,U+C990,U+C9C0-C9C1,U+C9C4,U+C9C8,U+C9D1,U+C9D3,U+C9DC,U+CC28-CC29,U+CC2C,U+CC38,U+CC3D-CC3E,U+CC44-CC45,U+CC98,U+CC9C,U+CCAB,U+CCAD,U+CCB4,U+CD08,U+CD2C,U+CD5C,U+CD94-CD95,U+CD9C,U+CDA5,U+CDB0,U+CE04,U+CE58,U+CE5C,U+CE68-CE69,U+CE74,U+CE90,U+CEA0,U+CEE4,U+CEF5,U+CF00,U+CF54,U+CFE0,U+D06C,U+D074,U+D0A4,U+D0A8,U+D0C0-D0C1,U+D0D5,U+D0DD,U+D130,U+D14C,U+D1A0-D1A1,U+D22C,U+D280,U+D2B8-D2B9,U+D2F0,U+D305,U+D30C,U+D325,U+D328,U+D37C,U+D398,U+D3EC,U+D45C,U+D478,U+D488,U+D504,U+D50C,U+D53C,U+D540,U+D544,U+D558-D559,U+D55C,U+D560,U+D568-D569,U+D56B,U+D56D,U+D574,U+D588-D589,U+D5C8,U+D5E4,U+D604,U+D638,U+D648,U+D64D,U+D654-D655,U+D658,U+D669,U+D68C,U+D718,U+D750-D751,U+D788}
/* ==========================================================================
   커피투어트럭 · site.css (1안 민트 상세본)
   설계 = 레이아웃설계서.md · 생성기(build/build_final.py)가 맨 위에 @font-face를 붙여 site/assets/css/site.css 로 내보낸다.
   규칙: 색 6 · 서체 2 · 모서리 3값(24 / 12 / 999) · 강조색은 와인 하나 · 카카오톡 상담 버튼은 전부 카카오 노랑(.btn-kakao)
   바탕: 흰색 기본, 파스텔 민트(--mist)는 한 구간 걸러. 진한 트럭 민트(--paint)는 큰 면에 쓰지 않는다.
         첫 화면 영상 위 막·푸터·확대 보기 막은 초록기 없는 먹색(--deep, rgba(20,26,23,…)) (2026-09-22 사장님 검수 1·2차)
   2026-09-24 고객 피드백 1차: 홈은 예전 1안 시안 구성(첫 화면 트럭 영상 위 흰 글자 · 숫자 띠 · 사진 6칸 · 사진 격자) · 메뉴는 사진 없는 글자 카드 · 견적에 현수막 3자리
   층(z-index): 건너뛰기 100 · 사진 크게 보기 80 · 상단 메뉴 50 · 폰 하단 바 40 · 구간 겹침 1
   ========================================================================== */
:root{
  --paint:#B8F6DA; --mist:#EBF8F2; --mist-2:#E6F9F1; --line:#D5E7DF;
  --forest:#0B5B37; --forest-2:#0F7A4A; --deep:#141A17;
  --wine:#772E48; --ink:#1F2B26; --ink-2:#4A5F55; --ink-paint:#3D5148;
  --kakao:#FEE500; --err:#A3262E; --field:#5E7A6E;
  --r-l:24px; --r-s:12px; --r-pill:999px;
  --font-d:"CTT Round","Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --font-b:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --max:1200px; --nav-h:72px;
  --shadow:0 18px 40px rgba(20,26,23,.12);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:light;scroll-padding-top:calc(var(--nav-h) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--font-b);font-size:1.0625rem;line-height:1.7;
  word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,fieldset,legend{margin:0;padding:0}
ul,ol{list-style:none}
fieldset{border:0;min-width:0}
h1,h2,h3{font-family:var(--font-d);font-weight:800;color:var(--forest);text-wrap:balance;letter-spacing:-.01em;line-height:1.22}
p,li,dd,figcaption,summary,label{text-wrap:pretty}
b,strong{font-weight:700}
:focus-visible{outline:3px solid var(--forest);outline-offset:3px}
.hero :focus-visible,.footer :focus-visible,.lb :focus-visible{outline-color:#fff}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--forest);color:#fff;padding:12px 16px;border-radius:var(--r-s);font-weight:700}
.skip:focus{left:8px}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tn{font-variant-numeric:tabular-nums}
.nw{white-space:nowrap}

/* ---- 틀 ---- */
.wrap{width:min(100% - 40px,var(--max));margin-inline:auto}
@media (min-width:900px){.wrap{width:min(100% - 64px,var(--max))}}
.sec{padding-block:clamp(56px,5.6vw,80px)}
.tone{background:var(--mist)}
.sec-head{display:grid;gap:12px;margin-bottom:clamp(24px,2.6vw,36px);max-width:46em}
.h2{font-size:clamp(1.75rem,1.2rem + 1.9vw,2.625rem)}
.h3{font-size:1.25rem}
.lead{font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);color:var(--ink-2)}
.lead b,.fig{font-family:var(--font-d);font-weight:800;color:var(--wine);white-space:nowrap}
.note{font-size:.9375rem;color:var(--ink-2)}
.after{margin-top:clamp(24px,2.6vw,32px)}

/* ---- 버튼 · 글자 링크 ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 24px;border-radius:var(--r-pill);
  font-weight:700;font-size:1rem;line-height:1;white-space:nowrap;transition:transform .18s ease,background-color .18s ease,color .18s ease}
.btn svg{width:20px;height:20px;flex:none}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--forest);color:#fff}
.btn-primary:hover{background:var(--forest-2)}
.btn-line{color:var(--forest);box-shadow:inset 0 0 0 1.5px var(--forest)}
.btn-line:hover{background:var(--forest);color:#fff}
.btn-white{background:#fff;color:var(--forest)}
.btn-kakao{background:var(--kakao);color:#191919}
.btn-sm{min-height:44px;padding:0 20px;font-size:.9375rem}
.btn-wide{width:100%}
.btn[disabled]{opacity:.6;cursor:default;transform:none}
.tlink{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--forest);
  text-decoration:underline;text-decoration-color:var(--wine);text-decoration-thickness:2px;text-underline-offset:6px}
.tlink svg{width:18px;height:18px;transition:transform .18s ease}
.tlink:hover svg{transform:translateX(3px)}
.tlinks{display:flex;flex-wrap:wrap;gap:12px 24px}

/* ---- 상단 메뉴 ---- */
.nav{position:sticky;top:0;z-index:50;background:#fff;transition:box-shadow .18s ease}
.nav.stuck{box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;gap:20px;height:var(--nav-h)}
.brand{flex:none}
.brand img{height:42px;width:auto}
.nav-links{display:none;margin-left:auto}
.nav-links>ul{display:flex;align-items:center;gap:2px}
.nav-links a{display:block;padding:12px 12px;font-weight:600;font-size:.9375rem;border-radius:var(--r-s);white-space:nowrap}
.nav-links a:hover{color:var(--forest);background:var(--mist)}
.nav-links a[aria-current="page"]{color:var(--wine)}
.has-sub{position:relative;display:flex;align-items:center}
.has-sub>a{padding-right:2px}
.caret{width:28px;height:36px;display:grid;place-items:center;border-radius:var(--r-s);color:var(--ink-2)}
.caret svg{width:14px;height:14px;transition:transform .18s ease}
.has-sub.open .caret svg{transform:rotate(180deg)}
.sub{position:absolute;top:100%;left:0;min-width:210px;padding:8px;background:#fff;border-radius:var(--r-s);box-shadow:var(--shadow);display:none}
.has-sub:hover .sub,.has-sub:focus-within .sub,.has-sub.open .sub{display:block}
.nav-cta{display:none;flex:none}
.burger{margin-left:auto;width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-s);color:var(--forest)}
.burger svg{width:28px;height:28px}
.burger .i-x,.burger[aria-expanded="true"] .i-list{display:none}
.burger[aria-expanded="true"] .i-x{display:block}
.nav-panel{position:absolute;left:0;right:0;top:100%;max-height:calc(100dvh - var(--nav-h));overflow:auto;background:#fff;padding:8px 20px 28px;box-shadow:var(--shadow)}
.nav-panel[hidden]{display:none}
.nav-panel a{display:block;padding:12px 4px;font-weight:600}
.nav-panel .grp{border-top:1px solid var(--line)}
.nav-panel .grp-t{font-family:var(--font-d);font-weight:800;color:var(--forest);font-size:1.0625rem}
.nav-panel .grp-i{padding:8px 4px 8px 20px;font-weight:500;color:var(--ink-2)}
.nav-panel .btn{margin-top:20px}
@media (min-width:1080px){
  .nav-links,.nav-cta{display:block}
  .burger,.nav-panel{display:none!important}
}

/* ---- 사진 틀 · 비대칭 모자이크 (서비스 안내) ---- */
.mosaic{display:grid;gap:24px;grid-template-columns:1fr}
.mo{display:flex;flex-direction:column;gap:16px;min-width:0}
.ph{position:relative;display:block;width:100%;border-radius:var(--r-l);overflow:hidden;background:var(--mist-2)}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
a.ph:hover img,.mo:hover .ph img{transform:scale(1.03)}
.mo .ph{aspect-ratio:1 / 1}
.mo.big .ph{aspect-ratio:4 / 3}
.mo h3,.mo .h3{font-size:1.125rem}
.mo h3 a,.mo .h3 a{display:inline}
.mo h3 svg,.mo .h3 svg{display:inline-block;vertical-align:-.12em;margin-left:8px;width:18px;height:18px;color:var(--wine)}
@media (max-width:859px){
  .mo:not(.big){display:grid;grid-template-columns:124px 1fr;gap:16px;align-items:center}
}
.mo p{margin-top:4px;font-size:.9375rem;color:var(--ink-2)}
@media (min-width:860px){
  .mosaic{grid-template-columns:1.4fr 1fr;grid-template-rows:auto auto;gap:28px}
  .mo.big{grid-column:auto;grid-row:1 / 3}
  .mo .ph{aspect-ratio:2 / 1}
  .mo.big .ph{aspect-ratio:auto;flex:1;min-height:0}
  .mo h3,.mo .h3{font-size:1.25rem}
}

/* ---- 음료 패키지 표 (메뉴 안내 · 서비스 페이지) ---- */
.pk{width:100%;border-collapse:collapse;margin-top:clamp(32px,3.4vw,44px)}
.pk th,.pk td{text-align:left;vertical-align:top;padding:16px 20px 16px 0;border-top:1px solid var(--line);font-weight:400}
.pk thead th{border-top:0;padding-block:0 12px;font-size:.875rem;font-weight:600;color:var(--ink-2)}
.pk tbody th{font-family:var(--font-d);font-weight:800;font-size:1.25rem;color:var(--forest);white-space:nowrap}
.pk td:last-child{padding-right:0}
.pk .c-n{white-space:nowrap}
@media (max-width:760px){
  .pk,.pk tbody,.pk tr,.pk th,.pk td{display:block}
  .pk thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .pk tr{border-top:1px solid var(--line);padding:20px 0}
  .pk th,.pk td{border:0;padding:0}
  .pk td{margin-top:8px;font-size:.9375rem}
  .pk td::before{content:attr(data-l);display:block;font-size:.875rem;font-weight:600;color:var(--ink-2)}
}

/* ---- 홈 (2026-09-24 고객 요청: 예전 1안 시안 구성으로 복원 · 색은 사장님 검수 1·2차 규칙 유지) ---- */
/* 영문 눈썹 라벨 · 영문 메뉴 이름: Cormorant Garamond 기울임 (예전 시안과 고객 참고 그림의 글꼴) */
.eyebrow{display:flex;align-items:center;gap:12px;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;font-size:1.125rem;letter-spacing:.02em;color:var(--wine);font-synthesis:none}
.eyebrow .skyline{width:110px;height:16px;flex:none;color:var(--forest)}
.more{margin-top:clamp(24px,3vw,36px)}
.btn-ghost{color:var(--forest);box-shadow:inset 0 0 0 1.5px var(--forest)}
.btn-ghost:hover{background:var(--forest);color:#fff}
.btn-outline-light{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.8)}
.btn-outline-light:hover{background:#fff;color:var(--ink)}

/* ① 첫 화면: 화면 가득 트럭 영상(처음 장면부터) 위에 흰 글자. 글자 뒤 막 = 먹색(초록기 없음) */
.hero{position:relative;min-height:calc(100svh - var(--nav-h));display:flex;align-items:flex-end;overflow:hidden;color:#fff;isolation:isolate;background:var(--deep)}
.hero-media{position:absolute;inset:0;z-index:-2}
.hero-media img,.hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-media video{opacity:0;transition:opacity .8s ease}
.hero-media video.on{opacity:1}
.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(20,26,23,.84) 0%,rgba(20,26,23,.68) 36%,rgba(20,26,23,.18) 70%,rgba(20,26,23,0) 100%),linear-gradient(180deg,rgba(20,26,23,.06) 0%,rgba(20,26,23,.16) 38%,rgba(20,26,23,.82) 100%)}   /* 글자 쪽(왼쪽·아래)만 짙게: 사장님 검수 1차에 승인된 먹색 막 방식 · 트럭은 오른쪽에서 제 색 */
.hero-in{padding-block:clamp(96px,14vh,160px) clamp(128px,17vh,168px);display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.hero-eyebrow{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;font-size:1.3125rem;letter-spacing:.01em;font-synthesis:none}
.hero h1{color:#fff;font-size:clamp(2.25rem,1.1rem + 4.4vw,5.2rem);line-height:1.1;text-shadow:0 2px 24px rgba(20,26,23,.35)}
.hero h1 .l{display:block}
.hero-sub{max-width:40ch;font-size:clamp(1.0625rem,1rem + .45vw,1.3125rem);color:rgba(255,255,255,.95);text-shadow:0 1px 12px rgba(20,26,23,.35)}
.hero-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.hero-acts .btn{min-height:56px;padding-inline:26px}
.hero-foot{position:absolute;left:0;right:0;bottom:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 clamp(20px,4vw,40px);font-size:.875rem;font-weight:600;color:rgba(255,255,255,.9)}
.hero-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:var(--r-pill);background:rgba(20,26,23,.55);color:#fff;font-size:.875rem;font-weight:600}
.hero-toggle svg{width:16px;height:16px}
.hero-toggle[hidden]{display:none}
.hero-foot[hidden]{display:none}                  /* 이번 달 영상 재생 한도를 넘으면 안내 줄·버튼을 숨긴다(2026-09-29) */
@media (max-width:759px){
  .hero{min-height:calc(100svh - var(--nav-h) - 68px - env(safe-area-inset-bottom))}
  .hero-shade{background:linear-gradient(180deg,rgba(20,26,23,.12) 0%,rgba(20,26,23,.64) 15%,rgba(20,26,23,.84) 42%,rgba(20,26,23,.94) 100%)}
  .hero-in{padding-bottom:124px}
  .hero-acts{width:100%}
  .hero-acts .btn{width:100%}
  .hero-foot{bottom:44px;justify-content:flex-end}
  .hero-foot>span{display:none}
}

/* ② 숫자 띠: 첫 화면 아래 모서리를 24px 덮는 둥근 파스텔 민트 판 */
.proof{position:relative;z-index:1;margin-top:-24px;border-radius:var(--r-l) var(--r-l) 0 0;background:var(--mist);padding-block:clamp(36px,5vw,64px)}
.proof-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px 16px}
@media (min-width:700px){.proof-grid{grid-template-columns:repeat(5,1fr)}}
.stat{display:flex;flex-direction:column;gap:4px;padding-left:14px;border-left:2px solid #A9E3C9}
.stat b{font-family:var(--font-d);font-weight:800;font-size:clamp(2rem,1.2rem + 2.6vw,3.4rem);line-height:1;color:var(--forest);font-variant-numeric:tabular-nums}
.stat b small{font-size:.5em;margin-left:2px}
.stat>span{font-size:.9375rem;color:var(--ink-2)}

/* ③ 어떤 행사에 가나요: 사진 6칸 (큰 칸 2 + 작은 칸 4 · 설명은 사진 아래쪽 먹색 번짐 위 흰 글자) */
.tiles{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.tiles{grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:16px}.tiles .t-big{grid-column:span 2;grid-row:span 2}}
.tile{position:relative;display:block;overflow:hidden;border-radius:var(--r-l);min-height:180px;background:var(--mist-2)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.tile:hover img{transform:scale(1.04)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,26,23,0) 38%,rgba(20,26,23,.84) 100%)}
.tile .t-label{position:absolute;left:18px;right:18px;bottom:16px;z-index:1;display:flex;flex-direction:column;gap:2px;color:#fff;font-weight:700;font-size:1.0625rem;line-height:1.35}
.tile .t-label small{font-weight:500;font-size:.875rem;opacity:.94}
@media (max-width:640px){.tile .t-label small{display:none}.tile .t-label{font-size:1rem;left:14px;right:14px;bottom:12px}}

/* ④ 메뉴 세 갈래 글자 카드 (홈 · 메뉴 안내 · 상품 사진 없음) */
.mcats{display:grid;gap:16px}
@media (min-width:760px){.mcats{grid-template-columns:repeat(3,1fr);gap:20px}}
.mcat{display:flex;flex-direction:column;gap:6px;padding:28px 26px 24px;border-radius:var(--r-l);background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .18s ease,transform .18s ease}
.mcat:hover{box-shadow:inset 0 0 0 2px var(--forest);transform:translateY(-2px)}
.mc-en{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;font-size:1.125rem;color:var(--wine);font-synthesis:none}
.mc-t{font-size:1.625rem;color:var(--forest)}
.mc-n{font-size:.9375rem;color:var(--ink-2)}
.mc-n b{font-family:var(--font-d);font-weight:800;font-size:1.5rem;color:var(--ink);margin-right:2px}
.mc-ex{font-size:.9375rem;color:var(--ink-2)}
.mc-go{margin-top:auto;padding-top:12px;display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--forest)}
.mc-go svg{width:18px;height:18px;transition:transform .18s ease}
.mcat:hover .mc-go svg{transform:translateX(3px)}

/* ⑤ 패키지 카드 3개 (가격 없음) */
.pkg-grid{display:grid;gap:16px}
@media (min-width:760px){.pkg-grid{grid-template-columns:repeat(3,1fr);gap:20px}}
.pkg{display:flex;flex-direction:column;gap:12px;padding:24px 22px;border-radius:var(--r-l);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.pkg header{display:flex;align-items:center;gap:10px}
.kinds{display:inline-grid;place-items:center;min-width:48px;height:48px;padding:0 10px;border-radius:var(--r-s);background:var(--mist);color:var(--forest);font-family:var(--font-d);font-weight:800}
.pkg h3{font-size:1.25rem}
.pkg .drinks{font-size:.9375rem;color:var(--ink-2)}
.specs{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.specs div{display:grid;grid-template-columns:84px 1fr;gap:10px;font-size:.9375rem}
.specs dt{color:var(--ink-2)}
.specs dd{color:var(--ink)}
.pkg .btn{margin-top:auto;align-self:flex-start}

/* ⑥ 진행 방식 카드 + 상담 카드 (파스텔 민트 위 흰 카드) */
.steps{display:grid;gap:16px}
@media (min-width:640px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.steps{grid-template-columns:repeat(6,1fr);gap:14px}}
.steps li{background:#fff;border-radius:var(--r-l);padding:22px 18px 20px}
.steps li>b{display:grid;place-items:center;width:40px;height:40px;margin-bottom:14px;border-radius:var(--r-pill);background:var(--forest);color:#fff;font-family:var(--font-d);font-weight:800}
.steps h3{font-size:1.0625rem;margin-bottom:6px}
.steps p{font-size:.9375rem;color:var(--ink-2);line-height:1.55}
.cta-card{margin-top:clamp(32px,4vw,56px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:clamp(24px,4vw,40px);border-radius:var(--r-l);background:#fff;box-shadow:inset 0 0 0 1.5px var(--forest)}
.cta-card h3{font-size:clamp(1.25rem,1rem + 1vw,1.625rem)}
.cta-card p{margin-top:6px;color:var(--ink-2)}
.cta-card .acts{margin-top:0}
@media (max-width:560px){.cta-card .acts .btn{width:100%}}

/* ⑦ 현장 기록 사진 격자 (크기 섞인 벽돌 배치 · 잘림 없음 · 누르면 크게) — 홈 앞 8장 · 현장 기록 페이지 전부 */
.masonry{columns:2;column-gap:12px}
@media (min-width:720px){.masonry{columns:3;column-gap:16px}}
@media (min-width:1100px){.masonry{columns:4}}
.masonry figure{break-inside:avoid;margin:0 0 12px}
@media (min-width:720px){.masonry figure{margin-bottom:16px}}
.masonry .ph{cursor:zoom-in}
.masonry .ph img{height:auto}
.gal figure{margin-bottom:24px}

/* ⑧ 함께한 고객사 4열 */
.cl4{display:grid;gap:24px 20px;grid-template-columns:repeat(2,1fr)}
@media (min-width:800px){.cl4{grid-template-columns:repeat(4,1fr);gap:28px}}
.cl-col h3{font-family:var(--font-b);font-size:.9375rem;font-weight:800;letter-spacing:0;color:var(--wine);padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.cl-col li{padding:6px 0;font-size:.9375rem;color:var(--ink)}

/* ---- 메뉴 글자 카드 (2026-09-24 고객 참고 그림: 사진 없이 메뉴 이름 중심 · 한글·영문 이름 · 패키지 배지 · 추천) ---- */
.mlegend{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(24px,3vw,36px);font-size:.875rem;color:var(--ink-2)}
.mlegend:empty{display:none}
.lg{display:inline-flex;align-items:center;gap:8px}
.lg::before{content:"";flex:none;width:12px;height:12px;border-radius:var(--r-pill)}
.lg-rec::before{background:var(--wine)}
.lg-pb::before{background:#BDEBD6}
.lg-sb::before{background:#F1D3DF}
.mgroup+.mgroup{margin-top:clamp(40px,5vw,56px)}
.mg-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px}
.mg-t{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;font-size:1.375rem;color:var(--forest)}
.mg-t::before{content:"";flex:none;width:10px;height:10px;border-radius:var(--r-pill);background:var(--wine)}
.mg-t i{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;font-size:1.0625rem;letter-spacing:0;color:var(--wine);font-synthesis:none}
.mg-n{flex:none;font-size:.9375rem;color:var(--ink-2)}
.mcards{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:760px){.mcards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1000px){.mcards{grid-template-columns:repeat(4,minmax(0,1fr))}}
.mcard{position:relative;display:flex;flex-direction:column;gap:4px;min-height:116px;padding:18px 16px 16px;border-radius:var(--r-s);background:#fff;box-shadow:inset 0 0 0 1px #C4ECDA}
.mn{font-weight:700;font-size:1.0625rem;line-height:1.35;color:var(--forest);padding-right:48px}
.me{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:1rem;line-height:1.3;color:var(--ink-2);font-synthesis:none}
.mt{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:10px}
.mt span{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:var(--r-pill);font-size:.75rem;font-weight:700;line-height:1}
.pb{background:#DDF5EA;color:var(--forest)}
.ub{background:#EEF3F1;color:var(--ink-2)}
.sb{background:#F7E8EE;color:var(--wine)}
.rec{position:absolute;right:12px;top:12px;display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:var(--r-pill);background:var(--wine);color:#fff;font-size:.75rem;font-weight:700;line-height:1}
@media (max-width:420px){.mcard{padding:16px 12px 14px}.mn{font-size:1rem;padding-right:0}.rec{position:static;align-self:flex-start;margin-bottom:4px}}
.mband{margin-top:clamp(32px,4vw,48px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;padding:20px 24px;border-radius:var(--r-l);background:var(--mist)}
.mband p{flex:1 1 320px;font-size:.9375rem;color:var(--ink-2)}
.mband .acts{margin-top:0}
@media (max-width:560px){.mband .acts{width:100%}.mband .acts .btn{flex:1 1 auto}}
.bean{margin-top:20px;max-width:62em;font-size:.9375rem;color:var(--ink-2)}
.mstrip{margin-top:clamp(32px,4vw,56px);display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:640px){.mstrip{grid-template-columns:repeat(3,1fr)}}
.mstrip .ph{aspect-ratio:4 / 3;cursor:zoom-in}

/* 예시 버튼 (현수막 문구) */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:44px;padding:0 16px;border-radius:var(--r-pill);background:#fff;color:var(--forest);font-weight:600;font-size:.9375rem;box-shadow:inset 0 0 0 1px rgba(11,91,55,.4);transition:background-color .18s ease}
.chip:hover{background:var(--mist)}

/* 세로 단계선 (진행 방식 페이지) */
.steps-v{counter-reset:s;display:grid;gap:0;max-width:760px}
.steps-v li{counter-increment:s;position:relative;padding:0 0 36px 72px}
.steps-v li::before{content:counter(s);position:absolute;left:0;top:0;width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-pill);
  background:var(--forest);color:#fff;font-family:var(--font-d);font-weight:800;font-size:1.125rem}
.steps-v li::after{content:"";position:absolute;left:23px;top:56px;bottom:8px;width:2px;background:var(--line)}
.steps-v li:last-child{padding-bottom:0}
.steps-v li:last-child::after{display:none}
.steps-v h3{font-size:1.25rem;padding-top:8px}
.steps-v p{margin-top:8px;color:var(--ink-2)}
/* 행사 당일 일정표 */
.tt{display:grid;max-width:860px}
.tt li{display:grid;grid-template-columns:112px 1fr;gap:20px;padding:24px 0;border-top:1px solid var(--line)}
.tt .tm{font-size:1.125rem}
.tt time,.tt .tm{font-family:var(--font-d);font-weight:800;font-size:1.375rem;color:var(--wine);font-variant-numeric:tabular-nums;white-space:nowrap}
.tt h3{font-size:1.125rem}
.tt p{margin-top:4px;color:var(--ink-2);font-size:.9375rem}

figcaption{margin-top:12px;font-size:.9375rem;color:var(--ink-2)}
.cl>div{display:grid;grid-template-columns:84px 1fr;gap:16px;padding:16px 0;border-top:1px solid var(--line)}
.cl dt{font-weight:700;color:var(--wine)}

/* ---- ⑧ 상담 띠 (바로 앞 구간과 바탕을 번갈아: 앞이 흰색이면 옅은 민트, 앞이 옅은 민트면 흰색) ---- */
.cta{background:var(--mist);padding-block:clamp(48px,5vw,72px)}
.tone+.cta{background:#fff}
.cta .wrap{display:grid;gap:28px}
.cta p{margin-top:12px;color:var(--ink-paint)}
.cta .acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.cta .tlink{margin-left:8px}
@media (min-width:960px){.cta .wrap{grid-template-columns:1.15fr 1fr;align-items:center;gap:56px}.cta .acts{justify-content:flex-end}}
@media (max-width:560px){.cta .acts .btn{width:100%}.cta .tlink{margin:4px 0 0}}

/* ---- 푸터 ---- */
.footer{background:var(--deep);color:var(--mist-2);padding-block:clamp(44px,4.4vw,60px) 28px;font-size:.9375rem}
.footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.footer-grid{display:grid;gap:32px 24px;grid-template-columns:1fr 1fr}
.footer-grid>div:first-child{grid-column:1 / -1}
@media (min-width:860px){.footer-grid{grid-template-columns:1.7fr 1fr 1fr;gap:56px}.footer-grid>div:first-child{grid-column:auto}}
.footer-logo{width:150px;height:auto;margin-bottom:20px}
.biz{color:#BAC6C0;line-height:1.85}
.biz a{color:var(--mist-2)}
.footer h2{font-family:var(--font-b);font-weight:700;font-size:.9375rem;color:#fff;letter-spacing:0;margin-bottom:12px}
.footer li{padding:4px 0}
.footer li a{display:inline-block;padding:4px 0;color:#BAC6C0}
.footer-bottom{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.16);color:#BAC6C0;font-size:.875rem}
.footer-bottom a{display:inline-block;padding:8px 0;color:var(--mist-2);font-weight:600}
@media (max-width:759px){body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}}

/* ---- 폰 하단 바 ---- */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);box-shadow:0 -1px 0 var(--line)}
.bar .btn{min-height:52px;padding:0 12px;font-size:.9375rem}
@media (min-width:760px){.bar{display:none}}
@media (max-width:759px){.cc-fb-btn{bottom:calc(84px + env(safe-area-inset-bottom))!important}}

/* ---- 하위 페이지 머리 ---- */
.phead{background:#fff;padding-block:clamp(36px,5vw,64px) clamp(36px,5vw,56px)}
.crumbs{margin-bottom:16px;font-size:.875rem;color:var(--ink-2)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:4px 8px}
.crumbs li+li::before{content:"›";margin-right:8px;color:var(--ink-2)}
.crumbs a{text-decoration:underline;text-underline-offset:3px}
.phead h1{font-size:clamp(2rem,1.3rem + 2.6vw,3.25rem);line-height:1.18}
.phead .lead{margin-top:16px;max-width:44em}
.phead-photo{margin-top:clamp(28px,4vw,40px);aspect-ratio:16 / 10}
@media (min-width:760px){.phead-photo{aspect-ratio:21 / 9}}
.phead-cap{margin-top:12px;font-size:.875rem;color:var(--ink-2)}
.phead-cap:empty{display:none}
/* 2026-10-06 관리자가 새로 올린 사진(다음 배포 전까지 Firestore 에서 한 장씩 읽음): 읽는 동안·못 읽으면 옅은 바탕 */
img.up-wait,img.up-fail{background:var(--mist)}

/* 메뉴 분류 탭 (메뉴 페이지는 제목 바로 아래에 탭) */
.phead+.sec[id^="menu-"],.phead+#categories{padding-top:0}
.tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:clamp(28px,4vw,44px);padding:4px 2px}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:var(--r-pill);font-weight:600;font-size:.9375rem;color:var(--forest);box-shadow:inset 0 0 0 1.5px var(--line)}
.tabs a:hover{box-shadow:inset 0 0 0 1.5px var(--forest)}
.tabs a[aria-current="page"]{background:var(--forest);color:#fff;box-shadow:none}

/* 글 + 목록 2단 */
.two{display:grid;gap:36px}
@media (min-width:900px){.two{grid-template-columns:1.25fr 1fr;gap:72px;align-items:start}.two.even{grid-template-columns:1fr 1fr;gap:64px}}
.prose p+p{margin-top:1.1em}
.prose .first{font-family:var(--font-d);font-weight:800;font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem);color:var(--forest);line-height:1.5}
.bul li{position:relative;padding:16px 0 16px 32px;border-top:1px solid var(--line);font-weight:600}
.bul li::before{content:"";position:absolute;left:4px;top:24px;width:12px;height:7px;border-left:2.5px solid var(--wine);border-bottom:2.5px solid var(--wine);transform:rotate(-45deg)}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* 이름 │ 내용 목록 (행사 조건 · 한눈에 보기) */
.facts>div{display:grid;gap:4px 24px;padding:20px 0;border-top:1px solid var(--line)}
.facts dt{font-weight:700;color:var(--forest)}
.facts dd{color:var(--ink)}
@media (min-width:700px){.facts>div{grid-template-columns:140px 1fr}}
.facts-grid{display:grid;gap:0 56px}
@media (min-width:900px){.facts-grid{grid-template-columns:1fr 1fr}}

/* 어긋난 사진 2장 (브랜드 소개) */
.offset{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.offset .ph{aspect-ratio:3 / 4}
@media (min-width:900px){.offset .ph:nth-child(2){margin-top:64px}}
.quality{display:grid;gap:28px;margin-top:clamp(36px,5vw,56px)}
@media (min-width:800px){.quality{grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}}
.quality .ph{aspect-ratio:4 / 3}
.q-list>div{padding:16px 0;border-top:1px solid var(--line)}
.q-list dt{font-family:var(--font-d);font-weight:800;color:var(--forest);font-size:1.125rem}
.q-list dd{margin-top:4px;color:var(--ink-2)}

/* 영상 2개 */
.media{display:grid;gap:32px}
@media (min-width:800px){.media{grid-template-columns:1fr 1fr;gap:32px}}
.media .ph{aspect-ratio:16 / 9;background:var(--deep)}
.media video,.media iframe{width:100%;height:100%;border:0;object-fit:cover}
.media h3{margin-top:16px;font-size:1.125rem}
.media p{margin-top:4px;font-size:.9375rem;color:var(--ink-2)}
.yt{position:absolute;inset:0;width:100%;height:100%}
.yt img{width:100%;height:100%;object-fit:cover}
.play{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;display:grid;place-items:center;border-radius:var(--r-pill);background:rgba(20,26,23,.72);color:#fff;transition:transform .18s ease,background-color .18s ease}
.play svg{width:28px;height:28px;margin-left:4px}
.yt:hover .play{transform:scale(1.06);background:var(--forest)}

/* 현장 사진 모자이크 (서비스 상세 · 큰 1 + 오른쪽 2 + 아래 3 = 빈칸 없음) */
.shots{display:grid;gap:16px;grid-template-columns:1fr 1fr}
.shots figure{min-width:0}
.shots .ph{aspect-ratio:4 / 3;cursor:zoom-in}
.shots figure:first-child{grid-column:1 / -1}
.shots figure:first-child .ph{aspect-ratio:16 / 9}
@media (min-width:860px){
  .shots{grid-template-columns:repeat(3,1fr);gap:20px}
  .shots figure:first-child{grid-column:1 / 3;grid-row:1 / 3;display:flex;flex-direction:column}
  .shots figure:first-child .ph{aspect-ratio:auto;flex:1;min-height:0}
}
/* 자주 묻는 질문 */
.faq{border-top:1px solid var(--line);max-width:860px}
.faq:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;font-weight:700;font-size:1.0625rem;color:var(--forest);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex:none;width:20px;height:20px;color:var(--wine);transition:transform .18s ease}
.faq[open] summary svg{transform:rotate(45deg)}
.faq p{padding:0 40px 24px 0;color:var(--ink-2)}

/* 사례 */
.cases{display:grid;gap:0;max-width:980px}
.case{display:grid;gap:16px;padding:28px 0;border-top:1px solid var(--line)}
.case .ph{aspect-ratio:4 / 3}
.case h3{font-size:1.25rem}
.case p{margin-top:8px;color:var(--ink-2)}
@media (min-width:760px){.case{grid-template-columns:260px 1fr;gap:36px;align-items:center}}

/* ---- 폼 공통 ---- */
.field{display:grid;gap:8px;align-content:start}
.field label,.lab{font-weight:600;font-size:.9375rem}
.field em,.req{font-style:normal;color:var(--wine);font-weight:700}
input[type="text"],input[type="tel"],input[type="email"],input[type="date"],input[type="number"],select,textarea{
  width:100%;min-height:52px;padding:0 16px;border:1.5px solid var(--field);border-radius:var(--r-s);background:#fff;font-size:1rem}
textarea{min-height:150px;padding:16px 16px;resize:vertical;line-height:1.6}
::placeholder{color:var(--field);opacity:1}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:1px}
.err{display:none;font-size:.875rem;font-weight:600;color:var(--err)}
.bad .err{display:block}
.bad input,.bad select,.bad textarea{border-color:var(--err)}
.form-grid{display:grid;gap:20px}
@media (min-width:640px){.form-grid{grid-template-columns:1fr 1fr}.form-grid .full{grid-column:1 / -1}}
.consent{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:.9375rem;color:var(--ink-2);font-weight:400}
.consent input{width:22px;height:22px;margin:4px 0 0;accent-color:var(--forest)}
.consent a{text-decoration:underline;text-underline-offset:3px;color:var(--forest);font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{margin-top:16px;font-weight:700;min-height:1.7em}
.form-msg:empty{min-height:0;margin:0}
.form-msg.ok{color:var(--forest)}
.form-msg.no{color:var(--err)}

/* ---- 문의하기 ---- */
.contact{display:grid;gap:48px}
@media (min-width:960px){.contact{grid-template-columns:1fr 1.35fr;gap:80px;align-items:start}}
@media (max-width:959px){.contact .c-form{order:-1}}
.info>div{padding:20px 0;border-top:1px solid var(--line)}
.info dt{font-size:.875rem;font-weight:700;color:var(--wine);margin-bottom:8px}
.info .bigtel{font-family:var(--font-d);font-weight:800;font-size:1.875rem;color:var(--forest);font-variant-numeric:tabular-nums}
.info p{margin-top:8px;font-size:.9375rem;color:var(--ink-2)}
.info .tlink{margin-top:4px}

/* ---- 예상 견적 ---- */
.quote{display:grid;gap:40px}
@media (min-width:980px){.quote{grid-template-columns:1fr 360px;gap:64px;align-items:start}}
.qf{display:grid;gap:clamp(36px,5vw,52px)}
.qf legend{font-family:var(--font-d);font-weight:800;font-size:1.375rem;color:var(--forest);margin-bottom:16px}
.qf legend small{font-family:var(--font-b);font-weight:500;font-size:.9375rem;color:var(--ink-2);margin-left:12px}
.num{display:inline-grid;grid-template-columns:48px minmax(76px,112px) 48px;gap:8px;align-items:center}
.num button{width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-s);color:var(--forest);box-shadow:inset 0 0 0 1.5px var(--field);transition:background-color .18s ease}
.num button:hover{background:var(--mist-2)}
.num svg{width:18px;height:18px}
.num input{min-height:48px;padding:0 8px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield}
.num input::-webkit-outer-spin-button,.num input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.people{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.pk-opts{display:grid;gap:12px}
.pk-opt{position:relative;display:block;cursor:pointer}
.pk-opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.pk-opt .po{display:grid;gap:4px;padding:20px 20px 20px 56px;border-radius:var(--r-s);box-shadow:inset 0 0 0 1.5px var(--line);background:#fff;position:relative;transition:box-shadow .18s ease,background-color .18s ease}
.pk-opt .po::before{content:"";position:absolute;left:20px;top:22px;width:20px;height:20px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 2px var(--field);background:#fff}
.pk-opt input:checked+.po{box-shadow:inset 0 0 0 2px var(--forest);background:var(--mist)}
.pk-opt input:checked+.po::before{box-shadow:inset 0 0 0 6px var(--forest)}
.pk-opt input:focus-visible+.po{outline:3px solid var(--forest);outline-offset:3px}
.pk-opt b{font-family:var(--font-d);font-weight:800;font-size:1.125rem;color:var(--forest)}
.pk-opt small{font-size:.9375rem;color:var(--ink-2)}
.addon{border-top:1px solid var(--line)}
.addon:last-of-type{border-bottom:1px solid var(--line)}
.addon summary{display:flex;align-items:center;gap:12px;padding:16px 0;font-weight:700;cursor:pointer;list-style:none;color:var(--forest)}
.addon summary::-webkit-details-marker{display:none}
.addon summary svg{width:18px;height:18px;margin-left:auto;color:var(--wine);transition:transform .18s ease}
.addon[open] summary svg{transform:rotate(45deg)}
.addon .cnt{font-size:.875rem;font-weight:600;color:var(--wine)}
.qt{display:grid;gap:0;padding-bottom:12px}
.qt>div{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:8px 0}
.qt .nm{font-weight:600}
.qt .nm small{font-weight:500;font-size:.875rem;color:var(--ink-2);margin-left:8px}
.cond{display:grid;gap:0}
.cr{display:flex;flex-wrap:wrap;align-items:center;gap:12px 12px;padding:16px 0;border-top:1px solid var(--line)}
.cr .lab{flex:0 0 100%;color:var(--forest)}
@media (min-width:700px){.cr .lab{flex:0 0 110px}}
.pill{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:var(--r-pill);font-weight:600;font-size:.9375rem;color:var(--forest);box-shadow:inset 0 0 0 1.5px var(--field);cursor:pointer;transition:background-color .18s ease,color .18s ease}
.pill input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.pill:has(input:checked){background:var(--forest);color:#fff;box-shadow:none}
.pill:has(input:focus-visible){outline:3px solid var(--forest);outline-offset:3px}
.km{display:inline-flex;align-items:center;gap:8px;font-size:.9375rem}
.km[hidden]{display:none}
.km input{width:96px;min-height:44px;text-align:center}
/* 현수막 3자리 (2026-09-24 고객 요청: 예상 견적 안에서 정면 + 양쪽 날개 각각 문구 · 사진은 build/prep_banner3.py) */
.b3-view{position:relative;margin-bottom:20px;border-radius:var(--r-l);overflow:hidden;background:#4B86C6;box-shadow:var(--shadow)}
.b3-view img{width:100%;height:auto}
.b3-z{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);display:grid;place-items:center;padding:4% 6%;overflow:hidden}
.b3-front{padding:2% 4%}
@media (max-width:700px){.b3-z{left:var(--mx);top:var(--my);width:var(--mw);height:var(--mh)}}
.b3-t{max-width:100%;font-family:var(--font-d);font-weight:800;line-height:1.2;text-align:center;color:#fff;font-size:var(--fs,16px);word-break:keep-all;overflow-wrap:normal;text-wrap:balance}
.b3-t.brk{overflow-wrap:anywhere}
.b3-front .b3-t{color:#7DEFBC}
.b3-t.demo{opacity:.55}
.b3-t.off{visibility:hidden}
.b3-rows{display:grid;gap:12px}
.b3-row{display:grid;grid-template-columns:160px minmax(0,1fr);gap:8px 16px;align-items:center}
@media (max-width:560px){.b3-row{grid-template-columns:1fr}}
.b3-on{display:flex;align-items:center;gap:12px;min-height:48px;cursor:pointer;font-weight:700;color:var(--forest)}
.b3-on input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--forest)}
.b3-on span{display:flex;flex-direction:column;line-height:1.3}
.b3-on small{font-weight:500;font-size:.8125rem;color:var(--ink-2)}
.b3 .chips{margin-top:16px}
.b3 .note{margin-top:12px}
.q-side{position:sticky;top:calc(var(--nav-h) + 20px)}
@media (max-width:979px){.q-side{position:static}}
.q-sum{padding:28px;border-radius:var(--r-l);background:var(--mist)}
.q-sum h2{font-size:1.25rem;margin-bottom:12px}
.q-sum dl>div{display:grid;grid-template-columns:88px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:.9375rem}
.q-sum dt{color:var(--ink-2)}
.q-sum dd{font-weight:600}
.q-sum .btn{margin-top:20px}
.q-sum .note{margin-top:12px}
.gate,.result{margin-top:clamp(40px,5vw,64px);padding:clamp(24px,4vw,44px);border-radius:var(--r-l);background:var(--mist)}
.gate[hidden],.result[hidden]{display:none}
.gate h2,.result h2{font-size:clamp(1.375rem,1.2rem + .8vw,1.75rem)}
.gate .lead,.result .meta{margin:8px 0 24px}
.rt{display:grid;max-width:620px}
.rt>div{display:grid;grid-template-columns:1fr auto;gap:16px;padding:12px 0;border-top:1px solid var(--line)}
.rt dt{color:var(--ink-2)}
.rt dd{font-weight:600;text-align:right}
.amount{margin-top:24px;padding-top:24px;border-top:2px solid var(--forest);max-width:620px}
.amount .won{font-family:var(--font-d);font-weight:800;font-size:clamp(2rem,1.5rem + 2vw,2.75rem);color:var(--forest);font-variant-numeric:tabular-nums;line-height:1.2}
.amount .vat{font-size:.9375rem;color:var(--ink-2);margin-left:8px;font-family:var(--font-b);font-weight:500}
.amount p{margin-top:8px;color:var(--ink-2)}
.result .acts{margin-top:28px}

/* ---- 방침 · 404 ---- */
.doc{max-width:820px}
.doc h2{font-size:1.375rem;margin:40px 0 12px}
.doc p,.doc li{color:var(--ink)}
.doc ul{list-style:disc;padding-left:24px}
.doc li{padding:4px 0}
.doc table{width:100%;border-collapse:collapse;margin-top:12px}
.doc th,.doc td{text-align:left;vertical-align:top;padding:12px 16px 12px 0;border-top:1px solid var(--line)}
.doc th{width:120px;color:var(--forest)}
.doc .date{color:var(--ink-2);margin-bottom:20px}
.lost{min-height:56vh;display:grid;align-content:center;gap:20px}

/* ---- 사진 크게 보기 ---- */
.lb{width:100%;max-width:100%;height:100%;max-height:100%;margin:0;padding:24px;border:0;background:rgba(20,26,23,.94);color:#fff}
.lb::backdrop{background:rgba(20,26,23,.6)}
.lb[open]{display:grid;grid-template-rows:1fr auto;gap:12px;place-items:center}
.lb img{max-width:100%;max-height:calc(100vh - 120px);max-height:calc(100dvh - 120px);width:auto;height:auto;border-radius:var(--r-s);object-fit:contain}
.lb p{font-size:.9375rem;text-align:center}
.lb-x{position:absolute;right:16px;top:16px;width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-pill);background:rgba(255,255,255,.14);color:#fff}
.lb-x svg{width:22px;height:22px}

/* ---- 등장 효과 (홈 8곳 · 움직임 줄이기 설정이면 끔) ---- */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;transition:none}
  .btn,.ph img,.tlink svg,.play{transition:none}
  .hero-media video{transition:none}
}
@media print{.nav,.bar,.cta,.hero-toggle,.hero-foot{display:none}}