/* ============================================================
   minddot — 공유 디자인 시스템
   브랜드 핵심 컬러: 로고 그대로 딥그린 + 살구/오렌지 포인트
   비주얼 언어: 수채화 워시(watercolor wash) + 종이 그레인 텍스처 + 도토리·숲 모티프
   ============================================================ */
:root{
  --forest:#1f3d2b; --forest-mid:#3d6b4a; --forest-light:#8ab092; --forest-pale:#d9e6dc;
  --canvas:#fbf7ee; --canvas-alt:#f3efe3; --card:#ffffff;
  --ink:#262420; --muted:#6b6459; --line:#e4dfd0;
  --bark:#6b4a34; --bark-light:#a3775a;
  --apricot:#e8935a; --apricot-deep:#c96a2e; --apricot-soft:#f6dcc4;
  --sage:#a9c0ab; --sky:#bcd3d6;
  --max:1160px;
  --radius-lg:28px; --radius-md:18px; --radius-sm:10px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,'Apple SD Gothic Neo','Noto Sans KR',Roboto,sans-serif;color:var(--ink);background:var(--canvas);line-height:1.68;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word;position:relative;}
a{color:inherit;text-decoration:none;}
img,svg{max-width:100%;display:block;}
ul{list-style:none;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 30px;}
section{scroll-margin-top:88px;position:relative;}
/* 기준사이트(minddot.creatorlink.net)는 세리프 없이 고딕(Pretendard) 전용 — 헤드라인은 세리프 대신 굵은 고딕으로 위계를 만든다 */
.serif{font-family:inherit;font-weight:800;letter-spacing:-0.01em;}
/* 로고 워드마크 전용 — 기준사이트 hero의 "Minddot" 워드마크는 Poppins Bold(700) */
.font-logo{font-family:'Poppins','Pretendard Variable',sans-serif;}

/* ── 종이 그레인 텍스처: 전체 사이트에 은은하게 깔림 ── */
.grain{position:fixed;inset:0;z-index:2000;pointer-events:none;opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ── 숨겨진 SVG 필터 정의(수채화 워시 왜곡) — 각 페이지 body 상단에 svgdefs 삽입 ── */
.svgdefs{position:absolute;width:0;height:0;overflow:hidden;}

/* ── 수채화 워시 블롭 배경 ── */
.wash-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.wash{position:absolute;border-radius:50%;filter:url(#wc-wash) blur(2px);mix-blend-mode:multiply;opacity:.55;}
.wash.forest{background:radial-gradient(circle at 35% 30%, var(--forest-light), transparent 70%);}
.wash.apricot{background:radial-gradient(circle at 60% 40%, var(--apricot), transparent 72%);}
.wash.sage{background:radial-gradient(circle at 40% 60%, var(--sage), transparent 70%);}
.wash.sky{background:radial-gradient(circle at 50% 50%, var(--sky), transparent 70%);}

/* ── nav (전 페이지 공통) ── */
header.site-header{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(251,247,238,.9);backdrop-filter:blur(8px);z-index:100;}
.nav{display:flex;align-items:center;justify-content:space-between;padding:18px 30px;max-width:var(--max);margin:0 auto;}
.logo{font-size:19px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:8px;color:var(--forest);}
.logo span{color:var(--apricot);}
.logo .lmark{width:17px;height:17px;flex-shrink:0;}
.nav-links{display:flex;gap:30px;font-size:13.5px;color:var(--muted);}
.nav-links a{position:relative;padding-bottom:4px;white-space:nowrap;}
.nav-links a:hover,.nav-links a.active{color:var(--ink);}
.nav-links a.active{border-bottom:1.5px solid var(--apricot);color:var(--ink);}
.nav-cta{background:var(--forest);color:#fff;padding:10px 22px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;}
.nav-cta:hover{background:#16301f;}
.nav-toggle{display:none;}

/* ── 버튼 ── */
.btn{display:inline-block;padding:14px 30px;border-radius:999px;font-size:14px;font-weight:600;cursor:pointer;border:1.5px solid transparent;font-family:inherit;transition:transform .15s ease;}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--forest);color:#fff;}
.btn-primary:hover{background:#16301f;}
.btn-ghost{border:1.5px solid var(--forest);background:transparent;color:var(--forest);}
.btn-ghost:hover{background:var(--forest-pale);}
.btn-outline{border:1.5px solid var(--line);background:transparent;color:var(--ink);}
.btn-outline:hover{border-color:var(--forest);color:var(--forest);}

/* ── page hero (서브페이지 공통 상단) ── */
.page-hero{padding:64px 0 56px;border-bottom:1px solid var(--line);position:relative;overflow:hidden;}
.page-hero .wrap{position:relative;z-index:2;}
.breadcrumb{font-size:12px;color:var(--muted);margin-bottom:16px;letter-spacing:.02em;}
.breadcrumb a:hover{color:var(--forest);}
.page-hero h1{font-size:clamp(28px,4vw,42px);font-weight:800;line-height:1.3;margin-bottom:16px;letter-spacing:-.01em;}
.page-hero p{color:var(--muted);font-size:15px;max-width:56ch;}

/* 핵심 컬러는 그린 — 오렌지/살구는 로고의 "점"처럼 아주 작은 포인트로만 (넓은 텍스트·배경에 쓰지 않음) */
.eyebrow{color:var(--forest-mid);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;margin-bottom:20px;display:flex;align-items:center;gap:8px;}
.eyebrow .dotmini{width:6px;height:6px;border-radius:50%;background:var(--apricot);flex-shrink:0;}

.section-head{max-width:640px;margin:0 auto 48px;}
.section-head h2{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:-.01em;margin-top:8px;}
.section-head p{color:var(--muted);font-size:14.5px;margin-top:12px;}

/* ── 카드 컴포넌트 (그림자 대신 헤어라인 + 수채화 느낌 텍스처) ── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-md);padding:30px;position:relative;overflow:hidden;}
.card::before{content:'';position:absolute;top:-30%;right:-20%;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,var(--forest-pale),transparent 70%);filter:blur(6px);opacity:.6;pointer-events:none;}

/* ── 프로그램 상세페이지 공용 컴포넌트 ── */
.detail-section{padding:64px 0;border-top:1px solid var(--line);}
.detail-section.alt{background:var(--canvas-alt);}
.model-badge{display:inline-flex;align-items:center;gap:8px;background:var(--forest-pale);color:var(--forest);font-size:12px;font-weight:700;padding:8px 16px;border-radius:999px;margin-bottom:18px;}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;}
.step-card{border:1px solid var(--line);border-radius:var(--radius-md);padding:24px 22px;background:var(--card);}
.step-card .num{width:30px;height:30px;border-radius:50%;background:var(--forest);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;margin-bottom:14px;}
.step-card h4{font-size:15px;font-weight:800;margin-bottom:8px;}
.step-card p{font-size:12.8px;color:var(--muted);line-height:1.7;}
.process-list{counter-reset:proc;display:flex;flex-direction:column;gap:0;}
.process-item{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:20px 0;border-bottom:1px solid var(--line);}
.process-item:last-child{border-bottom:none;}
.process-item .pnum{counter-increment:proc;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--forest);color:var(--forest);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;}
.process-item .pnum::before{content:counter(proc);}
.process-item h4{font-size:15px;font-weight:800;margin-bottom:6px;}
.process-item p{font-size:13px;color:var(--muted);line-height:1.7;}
.price-box{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--card);padding:28px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
.price-box .label{font-size:13px;color:var(--muted);}
.price-box .amount{font-size:22px;font-weight:800;color:var(--forest);}
.price-box .amount .orig{font-size:14px;color:var(--muted);text-decoration:line-through;font-weight:600;margin-right:8px;}
.price-box .discount{display:inline-block;background:var(--apricot-soft);color:var(--apricot-deep);font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;margin-left:8px;vertical-align:middle;}
.appointly-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px;}

/* 상세페이지(detail-section) 내부의 section-head는 위 히어로와 같은 좌측 기준선에 맞춘다 —
   기본 .section-head는 홈/센터소개처럼 "가운데 정렬 인트로" 용도라 max-width:640px+margin:0 auto로
   가운데 정렬되는데, 상세페이지는 히어로가 좌측 정렬이라 그대로 두면 위치가 어중간해진다 */
.detail-section .section-head{margin-left:0;margin-right:0;}

/* ── 3단 요금제 (1회 / 6회 / 10회) ── */
.fee-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.fee-tier{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--card);padding:24px 20px;text-align:center;}
.fee-tier.featured{border-color:var(--forest);background:var(--forest-pale);}
.fee-tier .tname{font-size:11.5px;font-weight:700;color:var(--forest-mid);letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px;}
.fee-tier .tprice{font-size:21px;font-weight:800;color:var(--forest);margin-bottom:6px;}
.fee-tier .tnote{font-size:11.5px;color:var(--muted);line-height:1.6;}
.fee-tier .tnote .strike{text-decoration:line-through;margin-right:3px;}
.fee-tier .tnote .pct{display:inline-block;background:var(--apricot-soft);color:var(--apricot-deep);font-size:9.5px;font-weight:800;padding:2px 6px;border-radius:999px;margin-left:5px;vertical-align:middle;}
@media (max-width:640px){.fee-tiers{grid-template-columns:1fr;}}

/* ── 프로그램/상담 상세페이지 간 이동(뒤로가기·다른 프로그램) 서브내비 ── */
.detail-subnav{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px;}
.detail-subnav a{font-size:12.5px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:7px 15px;white-space:nowrap;background:var(--card);}
.detail-subnav a:hover{border-color:var(--forest);color:var(--forest);}
.detail-subnav a.active{background:var(--forest);border-color:var(--forest);color:#fff;}
.detail-subnav a.back{color:var(--forest);font-weight:700;background:transparent;border-color:transparent;padding-left:4px;}
.detail-subnav a.back:hover{background:transparent;}

/* ── 코치에게 보내기 / 무료 신청 폼 공용 ── */
.mf-label{display:block;font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:14px;}
.mf-label input,.mf-label textarea{display:block;width:100%;margin-top:6px;padding:11px 13px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:13.5px;box-sizing:border-box;background:#fff;}
.mf-label textarea{resize:vertical;}
.mf-consent{display:flex;gap:8px;align-items:flex-start;font-size:11.5px;color:var(--muted);margin:2px 0 16px;line-height:1.6;}
.mf-consent input{margin-top:2px;flex-shrink:0;}
.mf-note{font-size:11px;color:var(--muted);margin-top:10px;}
.mf-sent{display:none;font-size:13px;color:var(--forest);font-weight:700;margin-top:12px;}

.modal-overlay{position:fixed;inset:0;background:rgba(31,61,43,.45);display:flex;align-items:center;justify-content:center;z-index:999;padding:20px;}
.modal-overlay[hidden]{display:none;}
.modal-box{background:#fff;border-radius:var(--radius-lg);padding:36px 32px;max-width:440px;width:100%;position:relative;max-height:90vh;overflow-y:auto;}
.modal-close{position:absolute;top:14px;right:16px;background:none;border:none;font-size:22px;line-height:1;color:var(--muted);cursor:pointer;padding:4px;}
.modal-box h3{font-size:19px;font-weight:800;margin-bottom:8px;}
.modal-desc{font-size:13px;color:var(--muted);margin-bottom:22px;line-height:1.6;}
.appointly-note{font-size:11.5px;color:var(--muted);margin-top:10px;}

footer.site-footer{padding:40px 0;border-top:1px solid var(--line);margin-top:40px;}
.footer-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;font-size:12.5px;color:var(--muted);}
.footer-links{display:flex;gap:20px;}
.footer-links a:hover{color:var(--forest);}

@media (max-width:900px){
  .nav-links{display:none;}
}