/* ===== Design tokens ===== */
:root{
	--bg:#FFFBEB;
	--bg-sub:#D9D0BF;
	--accent-dark:#451A03;
	--accent:#C2410C;
	--text:#1C1917;
	--radius:12px;
	--gap-img-text:16px;
	--side-pad:24px;
	--section-gap:48px;
	--touch-min:44px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
	margin:0;
	background:var(--bg);
	color:var(--text);
	font-family:'Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;
	font-size:16px;
	line-height:1.6;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3,h4{font-weight:700;margin:0 0 12px;line-height:1.35}
h1{font-size:29px}
h2{font-size:22px}
h3{font-size:18px}
h4{font-size:16px}
p{margin:0 0 16px}
.container{max-width:1120px;margin:0 auto;padding:0 var(--side-pad)}
section{padding:var(--section-gap) 0}
.eyebrow{display:block;font-weight:400;color:var(--accent);font-size:15px;margin-bottom:8px}
.section-head{margin-bottom:32px}
.section-head h2{font-weight:700}
.section-head p{font-weight:400;color:var(--accent-dark)}

@media (min-width:768px){
	h1{font-size:44px}
	h2{font-size:32px}
	h3{font-size:22px}
	:root{--side-pad:32px;--section-gap:96px}
}

/* ===== Icons ===== */
.icon{width:24px;height:24px;flex-shrink:0}

/* ===== Buttons ===== */
.btn{
	display:inline-flex;align-items:center;justify-content:center;gap:8px;
	min-height:var(--touch-min);padding:10px 20px;border-radius:var(--radius);
	font-weight:700;font-size:16px;border:1.5px solid transparent;white-space:nowrap;
}
.btn-primary{background:var(--accent);color:#fff}
.btn-outline{background:transparent;color:var(--accent-dark);border-color:var(--accent-dark)}
.btn-wide{width:100%}
.cta-group{display:flex;gap:12px;flex-wrap:wrap}

/* ===== Header ===== */
.site-header{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--bg-sub)}
.site-header-inner{
	max-width:1120px;margin:0 auto;padding:12px var(--side-pad);
	display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.site-logo img{height:32px;width:auto}
.site-nav-pc{display:none}
.site-nav-pc ul{display:flex;align-items:center;gap:28px}
.site-nav-pc a{display:flex;align-items:center;gap:6px;font-weight:600}
.site-header-right{display:flex;align-items:center;gap:12px}
.hamburger-btn{
	display:flex;align-items:center;justify-content:center;
	width:var(--touch-min);height:var(--touch-min);
	background:transparent;border:1.5px solid var(--accent-dark);border-radius:var(--radius);color:var(--accent-dark);
}
.mobile-menu{border-top:1px solid var(--bg-sub);background:var(--bg);overflow:hidden;max-height:0;transition:max-height .3s ease}
.mobile-menu.is-open{max-height:400px}
.mobile-menu ul{padding:8px var(--side-pad) 16px;display:flex;flex-direction:column;gap:4px}
.mobile-menu a{display:flex;align-items:center;gap:10px;min-height:var(--touch-min);font-weight:600}

@media (min-width:768px){
	.site-nav-pc{display:block}
	.hamburger-btn{display:none}
}

/* ===== Hero ===== */
.hero{position:relative;padding:0;overflow:hidden}
.hero-media{position:relative;min-height:420px;display:flex;align-items:flex-end}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{display:none}
.hero-content{position:relative;z-index:2;padding:32px var(--side-pad) 40px;color:var(--text);background:linear-gradient(180deg,transparent,var(--bg) 55%)}
.hero-content .eyebrow{color:var(--accent)}
.hero-content h1{font-size:29px}
.hero-content .lead{font-size:17px;color:var(--accent-dark);margin-bottom:24px}

@media (min-width:768px){
	.hero-media{min-height:560px;align-items:center}
	.hero-overlay{display:block;position:absolute;inset:0;background:rgba(26,10,3,.28);z-index:1}
	.hero-content{background:none;color:#fff;padding:0 0 0 64px;max-width:620px}
	.hero-content .lead{color:#FFFBEB}
	.hero-content h1{font-size:44px}
}

/* ===== Reason / Process / About cards — mobile slider ===== */
.card-slider{
	display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:0;
	-ms-overflow-style:none;scrollbar-width:none;margin:0 calc(var(--side-pad) * -1);
	padding:0 var(--side-pad);
}
.card-slider::-webkit-scrollbar{display:none}
.card-slider .card{flex:0 0 100%;scroll-snap-align:start;padding-right:var(--side-pad)}
.slider-dots{display:flex;justify-content:center;gap:8px;margin-top:16px}
.slider-dots .dot{width:8px;height:8px;border-radius:50%;background:var(--bg-sub)}
.slider-dots .dot.is-active{background:var(--accent)}

.card{
	background:#fff;border-radius:var(--radius);padding:24px;
	border:1px solid var(--bg-sub);
}
.card .icon{color:var(--accent);margin-bottom:var(--gap-img-text)}
.card h3{margin-bottom:8px}
.card p{margin-bottom:0;color:var(--accent-dark)}

@media (min-width:768px){
	.card-slider{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;overflow:visible;margin:0;padding:0}
	.card-slider .card{padding-right:0}
	.slider-dots{display:none}
}
.cards-6 .card-slider{grid-template-columns:repeat(3,1fr)}

/* ===== Grid cards (cases / services) ===== */
.grid-cards{display:grid;grid-template-columns:1fr;gap:var(--gap-img-text)}
@media (min-width:600px){.grid-cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:768px){.grid-cards{grid-template-columns:repeat(3,1fr);gap:24px}}
@media (min-width:600px){.services .grid-cards{grid-template-columns:repeat(2,1fr)}}

.media-card{position:relative;border-radius:var(--radius);overflow:hidden;display:block;background:var(--bg-sub)}
.media-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.media-card .media-card-overlay{
	position:absolute;inset:0;background:linear-gradient(0deg,rgba(26,10,3,.78),transparent 60%);
	display:flex;align-items:flex-end;padding:16px;color:#fff;
}
.media-card .media-card-title{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px;font-weight:700}
.media-card .link-indicator{
	width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;
	display:flex;align-items:center;justify-content:center;flex-shrink:0;
}

/* ===== Steps (process) ===== */
.step-card{position:relative}
.step-num{
	display:inline-flex;align-items:center;justify-content:center;
	width:36px;height:36px;border-radius:50%;background:var(--accent-dark);color:#fff;
	font-weight:700;margin-bottom:var(--gap-img-text);
}

/* ===== FAQ ===== */
.faq-item{border-bottom:1px solid var(--bg-sub)}
.faq-q{
	width:100%;text-align:left;background:none;border:0;padding:20px 0;
	display:flex;align-items:center;justify-content:space-between;gap:16px;
	font-weight:700;font-size:16px;color:var(--text);min-height:var(--touch-min);
}
.faq-q .icon{color:var(--accent);transition:transform .25s ease}
.faq-item.is-open .faq-q .icon{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-item.is-open .faq-a{max-height:400px}
.faq-a p{padding:0 0 20px;color:var(--accent-dark)}

/* ===== Consult CTA (pre-footer) ===== */
.consult-cta{background:var(--accent-dark);color:#fff;border-radius:var(--radius);padding:40px var(--side-pad);text-align:center}
.consult-cta h2{color:#fff}
.consult-cta p{color:var(--bg-sub)}
.consult-cta .cta-group{justify-content:center}
.consult-cta .btn-outline{color:#fff;border-color:#fff}

/* ===== Footer ===== */
.site-footer{background:var(--bg-sub);margin-top:var(--section-gap)}
.site-footer-inner{max-width:1120px;margin:0 auto;padding:32px var(--side-pad);display:flex;flex-direction:column;gap:24px}
.site-footer-brand{font-weight:700;font-size:18px;margin-bottom:8px}
.site-footer-info p{color:var(--accent-dark);margin-bottom:4px;font-size:14px}
.site-footer-nav ul{display:flex;gap:20px;flex-wrap:wrap}
.site-footer-nav a{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600}
@media (min-width:768px){
	.site-footer-inner{flex-direction:row;align-items:flex-start;justify-content:space-between}
}

/* ===== Fade in ===== */
.fade-in{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.fade-in.is-visible{opacity:1;transform:none}

/* ===== Page hero (inner pages) ===== */
.page-hero{background:var(--bg-sub);padding:40px 0}
.page-hero .eyebrow{color:var(--accent)}
.page-content{max-width:820px}
.page-content p{color:var(--text)}
.page-content h2{margin-top:40px}

/* ===== Sitemap page ===== */
.sitemap-list a{display:block;padding:14px 0;border-bottom:1px solid var(--bg-sub);font-weight:600}

/* ===== Utility ===== */
.text-center{text-align:center}
.mt-0{margin-top:0}