:root{
  --bg:#F5FBF8;
  --surface:#FFFFFF;
  --surface-2:#E6F5EE;
  --ink:#12302A;
  --muted:#4B6660;
  --muted-2:#7F958F;
  --primary:#1A8C6B;
  --primary-strong:#0E6A50;
  --primary-soft:#DDF3EA;
  --accent:#F2B233;
  --accent-strong:#C98A10;
  --accent-soft:#FFF1CC;
  --line:#D5EAE1;
  --shadow: 0 18px 40px -24px rgba(26,140,107,.35);
  --radius-lg: 20px;
  --radius-md: 12px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0A1512; --surface:#11201C; --surface-2:#16261F; --ink:#E9F3EF;
    --muted:#9FB4AC; --muted-2:#7C9089; --primary:#4FC3A1; --primary-strong:#7FD8BD;
    --primary-soft:#173029; --accent:#F2B233; --accent-strong:#F5C97C; --accent-soft:#2E2410;
    --line:#213631; --shadow: 0 18px 40px -20px rgba(0,0,0,.55);
  }
}
:root[data-theme="dark"]{
    --bg:#0A1512; --surface:#11201C; --surface-2:#16261F; --ink:#E9F3EF;
    --muted:#9FB4AC; --muted-2:#7C9089; --primary:#4FC3A1; --primary-strong:#7FD8BD;
    --primary-soft:#173029; --accent:#F2B233; --accent-strong:#F5C97C; --accent-soft:#2E2410;
    --line:#213631; --shadow: 0 18px 40px -20px rgba(0,0,0,.55);
}

/* 군산: 밝은 풍경 테마 (연민트 강변 + 금빛 해) — 패널(상단바·상담박스·CTA·배너)은 밝게, 글자는 진하게. 다크모드에서도 패널은 밝게 유지 */
:root{
  --panel-ink:#0F3D31; --panel-muted:#587A70;
  --topbar-ink:#0F3D31; --on-dark-ink:#0F3D31; --on-dark:#2B5248; --on-dark-muted:#587A70;
  --cta-big-text:#2B5248; --banner-bg:#E4F5EC; --banner-glow:#FFF1CC; --banner-text:#2B5248; --banner-apply:#F2B233;
  --pbox-shadow:rgba(26,140,107,.25);
  --band-top:#E2F4EA; --band-bottom:#A9DCC5; --band-hi:#F2B233; --band-soft:#FFFFFF; --band-ink:#3B8F72;
  --panel:#E4F5EC; --panel-2:#CFEBDD; --on-accent:#3A2A00; --banner-mark:#0E6A50;
  --b-hero-bg:#E7F6EF; --b-fade:rgba(245,251,248,.96); --b-fade-mid:rgba(245,251,248,.82);
  --b-ink:#12302A; --b-lead:#4B6660; --b-brand:#1A8C6B; --b-brand-strong:#0E6A50;
  --b-shadow:rgba(26,140,107,.45); --b-line:#D5EAE1; --b-line-strong:#A5D6C1; --b-section:#EAF6F0;
  --b-ph-art:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 110'%3E%3Ccircle cx='560' cy='28' r='17' fill='#F7C65A'/%3E%3Cpath d='M0 110 C 100 94 180 84 260 86 C 340 76 420 80 600 84 V110 Z' fill='#C8E8D8'/%3E%3Cg fill='#3B8F72'%3E%3Cpath d='M400 100 V70 L440 54 L480 70 V100 Z'/%3E%3Crect x='435' y='40' width='10' height='16'/%3E%3Cpath d='M432 40 L440 32 L448 40 Z'/%3E%3Cpath d='M488 100 V78 L508 68 L528 78 V100 Z'/%3E%3Cpath d='M334 100 V80 L352 72 L370 80 V100 Z'/%3E%3C/g%3E%3Cg fill='none' stroke='#3B8F72' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M250 40 l5 -4 l5 4'/%3E%3Cpath d='M272 30 l5 -4 l5 4'/%3E%3Cpath d='M292 42 l4 -3 l4 3'/%3E%3C/g%3E%3C/svg%3E");
  --b-ph-ground:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40 V24 C 360 14 720 28 1080 18 C 1260 14 1380 20 1440 18 V40 Z' fill='#A9DCC5'/%3E%3Cpath d='M0 34 H1440 V40 H0 Z' fill='#D4EDC6'/%3E%3C/svg%3E");
  --tip-bg:#EAF7F0; --tip-line:#BCE3CF; --tip-ink:#0E6A50; --card-bg:#F1F7F4; --check:#1A8C6B;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --panel:#E4F5EC; --panel-2:#CFEBDD; --on-accent:#3A2A00; } }
:root[data-theme="dark"]{ --panel:#E4F5EC; --panel-2:#CFEBDD; --on-accent:#3A2A00; }
*{box-sizing:border-box;}
html{background:var(--bg);}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Noto Sans KR', -apple-system, sans-serif;
  -webkit-font-smoothing:antialiased; padding-inline:20px;
}
h1,h2,h3{font-family:'Gowun Batang','Noto Sans KR',serif; text-wrap:balance; margin:0; letter-spacing:-.01em;}
p{line-height:1.7; color:var(--muted); margin:0;}
.wrap{max-width:1120px; margin-inline:auto;}
.mono{font-family:'Space Mono', monospace;}
a{color:inherit; text-decoration:none;}
img{max-width:100%;}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--primary-strong);}
.eyebrow::before{content:""; width:16px; height:2px; background:var(--accent); display:inline-block; border-radius:2px;}

/* 페이지 최상단 지역 장식 밴드: 배경(가로로 늘어남) + 지역 모티프(비율 유지, 오른쪽 정렬) */
.band{position:relative; height:40px; overflow:hidden;}
.band svg{position:absolute; inset:0; width:100%; height:100%; display:block;}
@media (max-width:640px){ .band{height:28px;} }

.topbar{background:var(--panel); color:var(--topbar-ink); font-size:13.5px;}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; padding-block:9px; gap:12px; flex-wrap:wrap;}
.topbar a.phone{font-weight:700; color:var(--accent-strong);}

header.site{position:sticky; top:0; z-index:40; background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; padding-block:14px;}
.logo{display:flex; align-items:center; gap:9px; font-weight:800; font-size:20px;}
.logo .mark{width:34px; height:34px; border-radius:9px; background:linear-gradient(135deg, var(--primary), var(--primary-strong)); display:flex; align-items:center; justify-content:center; color:var(--accent-soft); flex:none; font-size:14px;}
nav.main{display:flex; gap:26px; font-size:14.5px; font-weight:600; color:var(--muted);}
nav.main a:hover, nav.main a[aria-current="page"]{color:var(--primary-strong);}
.cta-btn{background:var(--primary); color:#fff !important; font-weight:700; font-size:14px; padding:11px 20px; border-radius:999px; white-space:nowrap; box-shadow:var(--shadow);}
.cta-ghost{border:1.5px solid var(--line); font-weight:700; font-size:14px; padding:10px 18px; border-radius:999px;}
.navwrap{display:flex; align-items:center; gap:22px;}
.menu-btn{display:none; background:none; border:1.5px solid var(--line); border-radius:10px; width:40px; height:40px; align-items:center; justify-content:center; font-size:18px;}
.mobile-nav-wrap{display:none; max-width:1120px; margin-inline:auto;}
.mobile-nav-wrap.open{display:block;}
.mobile-nav{display:flex; flex-direction:column; gap:2px; padding:10px 0 16px; border-bottom:1px solid var(--line);}
.mobile-nav a{padding:10px 4px; font-weight:600; font-size:15px; border-radius:8px;}
.mobile-nav a:hover{background:var(--surface-2);}

.hero{padding-block:56px 48px;}
.hero .grid{display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center;}
.hero h1{font-size:clamp(30px,4.2vw,48px); line-height:1.2; margin-block:16px 18px;}
.hero h1 em{font-style:normal; color:var(--primary-strong);}
.hero p.lead{font-size:16.5px; max-width:48ch; margin-bottom:24px;}
.hero-ctas{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:24px;}
.trust-row{display:flex; gap:20px; flex-wrap:wrap; font-size:13px; color:var(--muted-2);}
.trust-row span{display:flex; align-items:center; gap:6px;}
.dot{width:6px; height:6px; border-radius:50%; background:var(--accent); flex:none;}

.page-hero{padding-block:44px 36px;}
.page-hero h1{font-size:clamp(26px,3.6vw,38px); margin-block:10px 12px;}
.page-hero p{max-width:60ch; font-size:15.5px;}

.stats{background:var(--panel); color:var(--on-dark-ink); border-radius:var(--radius-lg); margin-block:8px 56px; padding:28px 8px;}
.stats .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; text-align:center;}
.stats .num{font-size:clamp(20px,2.4vw,28px); font-weight:700; color:var(--accent-strong); font-variant-numeric:tabular-nums;}
.stats .lbl{font-size:12.5px; color:var(--on-dark-muted); margin-top:6px;}

section{padding-block:52px;}
.head-row{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:32px; flex-wrap:wrap;}
.head-row h2{font-size:clamp(22px,2.8vw,30px); margin-top:10px;}
.head-row p{max-width:52ch; font-size:14.5px;}

.services{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.svc-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:26px 24px; display:flex; flex-direction:column; gap:12px;}
.svc-card .tag{width:fit-content; font-size:12px; font-weight:700; padding:5px 11px; border-radius:999px; background:var(--primary-soft); color:var(--primary-strong);}
.svc-card h3{font-size:19px;}
.svc-card p{font-size:14px;}
.svc-card .subjects{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:10px;}
.subjects span{font-size:12px; color:var(--muted-2); background:var(--surface-2); padding:3px 9px; border-radius:8px;}

.process-track{display:grid; grid-template-columns:repeat(5,1fr); gap:0; position:relative;}
.process-track::before{content:""; position:absolute; top:20px; left:8%; right:8%; height:2px; background-image:linear-gradient(90deg, var(--line) 0 8px, transparent 8px 14px); background-size:14px 2px; background-repeat:repeat-x;}
.p-step{position:relative; padding:0 10px; text-align:left;}
.p-step .n{width:40px; height:40px; border-radius:50%; background:var(--surface); border:2px solid var(--primary); color:var(--primary-strong); font-family:'Space Mono',monospace; font-weight:700; font-size:14px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; position:relative; z-index:1;}
.p-step h4{font-size:15px; font-weight:700; margin-bottom:6px;}
.p-step p{font-size:13px;}

.trust-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;}
.trust-item{background:var(--surface); padding:26px 24px;}
.trust-item .ico{width:40px; height:40px; border-radius:11px; background:var(--accent-soft); color:var(--accent-strong); display:flex; align-items:center; justify-content:center; margin-bottom:14px; font-size:18px;}
.trust-item h4{font-size:15.5px; font-weight:700; margin-bottom:6px;}
.trust-item p{font-size:13.5px;}

.teacher-filter{display:flex; flex-direction:column; gap:14px; background:var(--surface-2); border-radius:var(--radius-lg); padding:20px; margin-bottom:8px;}
.teacher-filter .field{margin-bottom:0;}

.sample-note{font-size:12.5px; color:var(--muted-2); margin-bottom:18px; display:flex; align-items:center; gap:8px;}
.sample-note .badge{background:var(--surface-2); padding:3px 9px; border-radius:7px; font-weight:700; color:var(--muted);}
.teachers{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.t-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px; display:flex; flex-direction:column; gap:10px;}
.t-card .avatar{width:52px; height:52px; border-radius:50%; background:var(--primary-soft); color:var(--primary-strong); display:flex; align-items:center; justify-content:center; font-weight:700; font-family:'Gowun Batang',serif; font-size:18px;}
.t-card h4{font-size:16px;}
.t-card .meta{font-size:12.5px; color:var(--muted-2);}
.t-card .fit-score{margin-top:auto; display:flex; align-items:center; justify-content:space-between; font-size:12.5px; font-weight:700; color:var(--primary-strong); background:var(--primary-soft); padding:8px 12px; border-radius:10px;}
.t-card .fit-score b{font-family:'Space Mono',monospace; font-size:14px;}

.regions{display:flex; flex-wrap:wrap; gap:9px;}
.region-chip{font-size:13px; padding:8px 15px; border-radius:999px; background:var(--surface); border:1px solid var(--line); color:var(--muted);}
.region-chip strong{color:var(--ink); font-weight:700;}

.region-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
.region-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:24px;}
.region-card h3{font-size:18px; margin-bottom:4px;}
.region-card .count{font-size:12.5px; color:var(--muted-2); margin-bottom:14px;}
.school-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.school-list a{display:flex; justify-content:space-between; align-items:center; padding:10px 12px; border-radius:10px; background:var(--surface-2); font-size:13.5px; font-weight:600;}
.school-list a:hover{background:var(--primary-soft); color:var(--primary-strong);}
.school-list a .arrow{color:var(--muted-2); font-weight:400;}

.faq{max-width:760px; margin-inline:auto; display:flex; flex-direction:column; gap:10px;}
.faq details{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px 18px;}
.faq summary{cursor:pointer; font-weight:700; font-size:15px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:10px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; font-size:20px; color:var(--muted-2); flex:none;}
.faq details[open] summary::after{content:"\2212";}
.faq details p{margin-top:10px; font-size:14px;}

.apply-wrap{background:var(--panel); border-radius:var(--radius-lg); padding:44px; color:var(--on-dark-ink); display:grid; grid-template-columns:1fr 1.1fr; gap:36px;}
.apply-wrap h2{color:#fff; font-size:clamp(22px,2.8vw,28px);}
.apply-wrap p{color:var(--on-dark-muted); font-size:14.5px; margin-top:10px;}
.apply-perks{list-style:none; padding:0; margin:22px 0 0; display:flex; flex-direction:column; gap:10px; font-size:13.5px; color:var(--on-dark);}
.apply-perks li{display:flex; gap:8px; align-items:flex-start;}
.apply-perks li::before{content:"\2713"; color:var(--accent-strong); font-weight:700;}
.form-card{background:var(--surface); border-radius:16px; padding:26px; color:var(--ink);}
.field{margin-bottom:14px;}
.field label{display:block; font-size:12.5px; font-weight:700; color:var(--muted); margin-bottom:6px;}
.field input, .field select, .field textarea{width:100%; border:1.5px solid var(--line); border-radius:10px; padding:10px 12px; font-size:14px; font-family:inherit; background:var(--bg); color:var(--ink);}
.radio-row{display:flex; flex-wrap:wrap; gap:8px;}
.radio-row label{border:1.5px solid var(--line); border-radius:999px; padding:7px 13px; font-size:12.5px; font-weight:600; display:flex; align-items:center; gap:6px; color:var(--muted); cursor:pointer;}
.radio-row input{accent-color:var(--primary); width:auto;}
.submit-btn{width:100%; background:var(--accent); color:var(--on-accent); font-weight:800; font-size:15px; padding:13px; border:none; border-radius:10px; margin-top:6px; cursor:pointer;}
.form-note{font-size:12px; color:var(--muted-2); margin-top:10px; text-align:center;}

.prose{max-width:720px; margin:0 auto;}
.prose h2{font-size:21px; margin-top:34px; margin-bottom:10px;}
.prose h3{font-size:18px; margin-top:26px; margin-bottom:8px;}
.prose p{margin-bottom:14px; font-size:15px;}
.prose strong{color:var(--ink);}

.article-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.article-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px; display:flex; flex-direction:column; gap:10px;}
.article-card .meta{font-size:12px; color:var(--muted-2); font-weight:600;}
.article-card h3{font-size:16.5px;}
.article-card p{font-size:13.5px;}
.article-card .more{margin-top:auto; font-size:13px; font-weight:700; color:var(--primary-strong);}

footer{border-top:1px solid var(--line); margin-top:20px; padding-block:36px 40px;}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px; font-size:13px; color:var(--muted-2);}
footer .fnav{display:flex; gap:18px; flex-wrap:wrap;}
footer .disclaimer{max-width:640px; line-height:1.7; margin-top:14px; font-size:12px;}

.breadcrumb{font-size:13px; color:var(--muted-2); margin-bottom:10px;}
.breadcrumb a:hover{color:var(--primary-strong);}

.mobile-cta-bar{display:none;}

@keyframes kakao-pulse{
  0%{box-shadow:0 10px 24px -8px rgba(0,0,0,.45), 0 0 0 0 rgba(254,229,0,.6);}
  70%{box-shadow:0 10px 24px -8px rgba(0,0,0,.45), 0 0 0 14px rgba(254,229,0,0);}
  100%{box-shadow:0 10px 24px -8px rgba(0,0,0,.45), 0 0 0 0 rgba(254,229,0,0);}
}
.kakao-fab{
  position:fixed; right:20px; bottom:28px; z-index:70;
  display:flex; align-items:center; gap:9px;
  background:#FEE500; color:#391B1B; font-weight:800; font-size:16px;
  padding:16px 22px; border-radius:999px;
  box-shadow:0 10px 24px -8px rgba(0,0,0,.45);
  animation:kakao-pulse 2.4s ease-out infinite;
  border:2px solid #FFF4B8;
}
.kakao-fab-ico{font-size:22px; line-height:1;}

@media (max-width:860px){
  nav.main{display:none;}
  header.site .cta-btn{display:none;}
  .menu-btn{display:flex;}
  .hero .grid{grid-template-columns:1fr;}
  .stats .wrap{grid-template-columns:repeat(2,1fr); gap:20px;}
  .services, .trust-grid, .teachers, .region-grid, .article-grid{grid-template-columns:1fr;}
  .process-track{grid-template-columns:1fr; gap:22px;}
  .process-track::before{display:none;}
  .apply-wrap{grid-template-columns:1fr; padding:26px;}

  body{padding-inline:16px; padding-bottom:76px;}
  .hero{padding-block:32px 28px;}
  .hero-ctas{flex-direction:column; align-items:stretch;}
  .hero-ctas .cta-btn, .hero-ctas .cta-ghost{text-align:center; padding-block:14px;}
  section{padding-block:36px;}
  .topbar .wrap{padding-block:8px; font-size:12.5px; gap:8px;}
  .cta-btn{padding:13px 20px;}

  .mobile-cta-bar{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:50;
    background:var(--surface); border-top:1px solid var(--line);
    box-shadow:0 -12px 24px -18px rgba(0,0,0,.3);
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    gap:10px;
  }
  .mobile-cta-bar a{flex:1; text-align:center; font-weight:700; font-size:14.5px; padding:13px 10px; border-radius:12px;}
  .mobile-cta-bar .msc-call{background:var(--surface-2); color:var(--ink);}
  .mobile-cta-bar .msc-apply{background:var(--accent); color:var(--on-accent);}

  .kakao-fab{
    bottom:104px; right:16px; width:64px; height:64px; padding:0;
    justify-content:center; border-radius:50%;
  }
  .kakao-fab-ico{font-size:28px;}
  .kakao-fab-label{display:none;}
}

@media (max-width:420px){
  .topbar span{display:none;}
  .topbar .wrap{justify-content:center;}
  .hero h1{font-size:26px;}
}

.subj-tabs{display:flex; gap:8px; margin-top:16px; flex-wrap:wrap;}
.subj-tabs a{padding:7px 16px; border-radius:20px; background:var(--surface-2); color:var(--ink); font-size:14px; font-weight:600;}
.subj-tabs a.on{background:var(--primary); color:#fff;}
.subj-link{display:inline-block; margin:2px 8px 2px 0; font-size:14px; font-weight:600;}
.check-list{list-style:none; padding:0; margin:0 0 14px;}
.check-list li{position:relative; padding-left:24px; margin-bottom:8px; font-size:15px;}
.check-list li:before{content:"✓"; position:absolute; left:0; color:var(--primary); font-weight:700;}
.step-list{padding-left:20px; margin-bottom:14px;}
.step-list li{margin-bottom:8px; font-size:15px;}
.cmp-wrap{overflow-x:auto; margin-bottom:18px;}
.cmp{width:100%; border-collapse:collapse; font-size:14px;}
.cmp th,.cmp td{border:1px solid var(--line, #e3e3e3); padding:9px 10px; text-align:left;}
.cmp thead th{background:var(--surface-2);}
.mid-cta{background:var(--surface-2); border-radius:14px; padding:18px 20px; margin:26px 0; font-size:15px; line-height:1.9;}
.mid-cta .cta-btn{margin-left:8px;}
.related-list{padding-left:18px; font-size:14.5px;}

.prose ul,.prose ol{margin:0 0 16px; padding-left:22px;}
.prose li{margin-bottom:8px; font-size:15px; line-height:1.75;}
.prose h2{padding-left:12px; border-left:4px solid var(--primary);}
.prose p{line-height:1.85;}
.summary-box{background:var(--surface-2); border-radius:14px; padding:18px 22px; margin:0 0 24px;}
.summary-box strong{display:block; margin-bottom:8px; font-size:15px;}
.summary-box ul{margin:0; padding-left:20px;}
.callout{border-left:4px solid var(--accent-strong, #d9a400); background:var(--surface-2); border-radius:8px; padding:14px 18px; margin:0 0 16px; font-size:14.5px; line-height:1.8;}
.callout strong{display:block; margin-bottom:4px;}
.prose .cmp td:first-child{font-weight:600;}

/* 글 박스 + 강조 CTA */
.blog-prose{max-width:760px; counter-reset:pb;}
.pbox{background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:26px 28px 14px; margin:0 0 20px; box-shadow:0 10px 26px -20px var(--pbox-shadow);}
.pbox h2{counter-increment:pb; margin-top:0; border-left:0; padding-left:0; display:flex; align-items:center; gap:12px; font-size:20px;}
.pbox h2:before{content:counter(pb); flex:none; width:32px; height:32px; border-radius:50%; background:var(--primary); color:#fff; font-size:15px; font-weight:700; display:flex; align-items:center; justify-content:center;}
.pbox.faq-box{background:var(--surface-2); border-style:dashed;}
.pbox.faq-box h3{margin-top:0;}
.pbox .callout,.pbox .cmp-wrap{margin-top:6px;}
.hero-cta{margin-top:18px; display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.hero-cta span{font-size:13.5px; color:var(--muted);}
.cta-main{display:inline-block; background:var(--accent); color:var(--on-accent) !important; font-weight:800; font-size:16px; padding:15px 28px; border-radius:999px; box-shadow:0 10px 24px -10px rgba(184,123,31,.7); transition:transform .15s;}
.cta-main:hover{transform:translateY(-2px);}
.cta-big{background:linear-gradient(135deg,var(--panel),var(--panel-2)); color:#fff; border-radius:24px; padding:38px 36px; display:grid; grid-template-columns:1.2fr 1fr; gap:26px; align-items:center; box-shadow:var(--shadow);}
.cta-big h2{color:#fff; font-size:clamp(22px,3vw,28px); margin:8px 0;}
.cta-big p{color:var(--cta-big-text); font-size:15px; margin:0;}
.cta-badge{display:inline-block; background:var(--accent); color:var(--on-accent); font-weight:800; font-size:13px; padding:4px 12px; border-radius:999px;}
.cta-big-btns{display:flex; flex-direction:column; gap:10px;}
.cta-big-btns .cta-main{text-align:center; font-size:18px; padding:18px 24px;}
.cta-sub{text-align:center; background:rgba(255,255,255,.14); color:#fff !important; font-weight:600; font-size:14.5px; padding:12px; border-radius:12px; border:1px solid rgba(255,255,255,.3);}
.mid-cta{background:var(--accent-soft); border:2px solid var(--accent); border-radius:16px; padding:22px 24px; text-align:center; line-height:2;}
.mid-cta .cta-btn{margin:10px 0 0; display:inline-block; background:var(--accent); color:var(--on-accent) !important; font-size:16px; padding:14px 28px;}
@media (max-width:860px){
  .cta-big{grid-template-columns:1fr; padding:26px 22px;}
  .pbox{padding:20px 18px 8px;}
}

/* 컬러 리스트 카드 / 팁 박스 / 무료체험 강조 */
:root{--tip-bg:#EAFBF1; --tip-line:#B5EBCB; --tip-ink:#0E5A38; --card-bg:#F4F6F8; --check:#16A34A;}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--tip-bg:#12261C; --tip-line:#245B3A; --tip-ink:#8FE3B4; --card-bg:#16261F; --check:#3DD68C;}}
:root[data-theme="dark"]{--tip-bg:#12261C; --tip-line:#245B3A; --tip-ink:#8FE3B4; --card-bg:#16261F; --check:#3DD68C;}
.blog-prose ul,.blog-prose ol{list-style:none; padding:0; margin:0 0 16px; counter-reset:li;}
.blog-prose ul li,.blog-prose ol li{position:relative; background:var(--card-bg); border-radius:14px; padding:16px 18px 16px 58px; margin-bottom:10px; line-height:1.8;}
.blog-prose ul li:before{content:"✓"; position:absolute; left:16px; top:15px; width:28px; height:28px; border-radius:50%; background:var(--check); color:#fff; font-weight:800; font-size:15px; display:flex; align-items:center; justify-content:center;}
.blog-prose ol li{counter-increment:li;}
.blog-prose ol li:before{content:counter(li); position:absolute; left:16px; top:15px; width:28px; height:28px; border-radius:50%; background:var(--primary); color:#fff; font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center;}
.blog-prose .summary-box li{background:transparent; padding:6px 0 6px 34px; margin:0;}
.blog-prose .summary-box li:before{left:0; top:7px; width:22px; height:22px; font-size:12px;}
.callout{background:var(--tip-bg); border:1.5px solid var(--tip-line); border-left:1.5px solid var(--tip-line); border-radius:16px; padding:18px 22px; color:var(--ink);}
.callout strong{color:var(--tip-ink); font-size:16px;}
.callout strong:before{content:"💡 ";}
.summary-box{background:var(--tip-bg); border:1.5px solid var(--tip-line);}
.summary-box strong{color:var(--tip-ink); font-size:16px;}
.summary-box strong:before{content:"📌 ";}
mark.free{background:linear-gradient(transparent 55%, var(--accent-soft) 55%); color:var(--accent-strong); font-weight:800; padding:0 2px;}
.mid-cta mark.free,.cta-big mark.free{background:none; color:inherit;}
.blog-prose p strong{color:var(--primary); }

.intro-banner{background:radial-gradient(circle at 90% 10%,var(--banner-glow) 0,transparent 45%),var(--banner-bg); border-radius:24px; padding:34px 24px; margin:0 0 22px; text-align:center; box-shadow:var(--shadow);}
.ib-tag{display:inline-block; background:rgba(255,255,255,.12); color:var(--on-dark); font-size:12.5px; font-weight:700; padding:4px 12px; border-radius:999px; margin-bottom:12px;}
.intro-banner p{color:var(--banner-text); font-size:15.5px; line-height:1.9; margin:0 0 20px;}
.intro-banner mark.free{background:none; color:var(--banner-mark);}
.ib-btns{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}
.ib-btns a{display:inline-flex; align-items:center; gap:10px; padding:14px 22px; border-radius:999px; font-weight:800; font-size:15.5px;}
.ib-btns a i{font-style:normal; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.12); font-size:14px;}
.ib-kakao{background:#FEE500; color:#2A1F00 !important;}
.ib-apply{background:var(--banner-apply); color:#fff !important;}
.ib-apply i{background:rgba(255,255,255,.25)!important;}

.kw-chips{margin:8px 0 18px; display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
.kw-chips strong{width:100%; font-size:13.5px; color:var(--muted);}
.kw-chips span{background:var(--primary-soft); color:var(--primary-strong); font-size:13px; font-weight:600; padding:5px 12px; border-radius:999px;}

.post-cover{display:block; width:100%; max-width:520px; height:auto; margin:22px auto 8px; border-radius:20px; box-shadow:var(--shadow);}

.post-hero{text-align:center;}
.post-hero h1{margin-inline:auto;}
.post-hero .hero-cta{justify-content:center;}

/* 학교별 과외 목록 (regions.html) — 전체 학교 카드 + 검색·학교급 필터 */
.school-dir{padding-top:8px;}
.school-toolbar{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:10px;}
.school-search{flex:1 1 320px; min-width:0; border:1.5px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:14px 22px; font-size:15px; font-family:inherit;}
.school-search:focus{outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft);}
.school-chips{display:flex; gap:8px; flex-wrap:wrap;}
.school-chips .chip{border:1.5px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:9px 18px; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit;}
.school-chips .chip[aria-pressed="true"]{background:var(--primary); border-color:var(--primary); color:#fff;}
.school-count,.school-empty{font-size:13.5px; color:var(--muted-2); margin:6px 0 0;}
.school-sec-title{font-size:24px; margin:40px 0 16px; display:flex; align-items:center; gap:10px;}
.school-sec-title .tag{font-family:'Noto Sans KR',sans-serif; font-size:12.5px; font-weight:700; padding:4px 10px; border-radius:999px; background:var(--accent-soft); color:var(--accent-strong);}
.school-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px;}
.school-item{display:block; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:16px 18px; font-weight:700; font-size:15px; color:var(--ink); line-height:1.4; transition:transform .15s, box-shadow .15s, border-color .15s;}
.school-item i{display:block; font-style:normal; font-weight:500; font-size:12.5px; color:var(--muted); margin-top:6px; line-height:1.5;}
.school-item:hover{transform:translateY(-2px); border-color:var(--primary); box-shadow:0 12px 26px -18px var(--pbox-shadow, rgba(0,0,0,.3));}
.school-item[hidden],.school-sec[hidden]{display:none;}
.hl-box{margin-top:40px; background:var(--primary-soft); border-radius:16px; padding:18px 22px; font-size:15px; color:var(--ink); line-height:1.7;}
.hl-box a{color:var(--primary-strong); font-weight:800;}
@media (max-width:900px){ .school-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:640px){ .school-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;} .school-item{padding:13px 14px; font-size:14px;} .school-sec-title{font-size:20px;} }

/* =================================================================
   밝은 풍경 테마 (region.py BRIGHT = True 인 지역만 포함) — 구미 디자인 일반화
   색은 theme.css의 --b-* 변수로 지역마다 다르게
   ================================================================= */
body{overflow-x:clip;}

/* 메인 히어로: 화면 가로 전체 풍경 그림 + 왼쪽 글자 (그림이 밝아서 다크모드에서도 글자색 고정) */
.hero{position:relative; isolation:isolate; overflow:hidden; background:var(--b-hero-bg);
  margin-inline:calc(50% - 50vw); padding-inline:calc(50vw - 50%); padding-block:72px 240px;}
.hero .grid{grid-template-columns:1fr;}
.hero .grid > div:first-child{max-width:560px;}
.hero .grid > div:last-child{position:absolute; inset:0; z-index:-2;}
.hero-land{width:100%; height:100%; display:block;}
.hero::before{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(90deg, var(--b-fade) 0%, var(--b-fade-mid) 32%, transparent 60%);}
.hero h1{color:var(--b-ink);}
.hero h1 em{color:var(--b-brand);}
.hero p.lead{color:var(--b-lead);}
.hero .eyebrow{color:var(--b-brand-strong); background:#fff; padding:6px 12px 6px 10px; border-radius:999px; box-shadow:0 4px 14px -8px var(--b-shadow);}
.hero .trust-row{color:var(--b-lead);}
.hero .cta-btn{background:var(--b-brand); color:#fff !important;}
.hero .cta-ghost{background:#fff; border-color:#fff; color:var(--b-ink); box-shadow:0 6px 18px -10px var(--b-shadow);}
.eyebrow::before{width:7px; height:7px; border-radius:50%; background:var(--accent);}

/* 통계: 풍경 아래쪽에 걸쳐 떠 있는 흰 카드 */
.stats{position:relative; z-index:2; background:#fff; border:1px solid var(--b-line); margin-top:-72px;
  box-shadow:0 24px 50px -28px var(--b-shadow);}
.stats::before{display:none;}
.stats .num{color:var(--b-brand); font-family:'Space Mono',monospace; letter-spacing:-.02em;}
.stats .lbl{color:var(--b-lead);}
.stats .wrap > div + div{border-left:1px solid var(--b-line);}

/* 섹션: 연한 배경 가로 전체로 교차 */
#services,#process,#regions{margin-inline:calc(50% - 50vw); padding-inline:calc(50vw - 50%); background:var(--b-section);}

/* 카드: 테두리 대신 부드러운 그림자, 호버 시 살짝 뜸 + 이모지 아이콘 */
.svc-card,.t-card,.region-card,.article-card{border-color:transparent; box-shadow:0 12px 32px -20px var(--b-shadow); transition:transform .15s, box-shadow .15s;}
.svc-card:hover,.t-card:hover,.region-card:hover,.article-card:hover{transform:translateY(-3px); box-shadow:0 18px 40px -20px var(--b-shadow);}
.svc-card::before{font-size:30px; line-height:1;}
#grades .svc-card:nth-child(1)::before{content:"🎒";}
#grades .svc-card:nth-child(2)::before{content:"📘";}
#grades .svc-card:nth-child(3)::before{content:"🎓";}
#services .svc-card:nth-child(1)::before{content:"💻";}
#services .svc-card:nth-child(2)::before{content:"🎬";}
#services .svc-card:nth-child(3)::before{content:"📍";}
.svc-card .tag{background:var(--primary-soft); color:var(--b-brand-strong);}
.trust-item .ico{border-radius:12px; background:var(--primary-soft); color:var(--b-brand);}

/* 하위 페이지 상단: 연한 배경 + 오른쪽 아래 지역 실루엣(--b-ph-art) */
.page-hero{position:relative; margin-inline:calc(50% - 50vw); padding-inline:calc(50vw - 50%); padding-bottom:70px; margin-bottom:12px;
  background:var(--b-ph-art) right bottom / auto 110px no-repeat, var(--b-ph-ground) left bottom / 100% 40px no-repeat,
    linear-gradient(180deg, var(--b-hero-bg), var(--bg));}
.page-hero h1{color:var(--b-ink);}
.page-hero p{color:var(--b-lead);}
.page-hero .eyebrow,.breadcrumb{color:var(--b-brand-strong);}

/* 밝은 패널(상단바·상담박스·큰 CTA·블로그 배너) 위 글자 */
.topbar a.phone{color:var(--b-brand-strong);}
.apply-wrap{border:1px solid var(--b-line);}
.apply-wrap::before{display:none;}
.apply-wrap h2,.cta-big,.cta-big h2{color:var(--panel-ink);}
.apply-wrap p,.cta-big p{color:var(--on-dark);}
.apply-wrap .cta-ghost{color:var(--panel-ink) !important; border-color:var(--b-line-strong) !important; background:#fff;}
.cta-sub{background:#fff; color:var(--panel-ink) !important; border-color:var(--b-line-strong);}
.cta-big{box-shadow:0 18px 40px -26px var(--b-shadow);}
.intro-banner{border:1px solid var(--b-line); box-shadow:none;}
.ib-tag{background:#fff; color:var(--b-brand-strong);}
.intro-banner mark.free{color:var(--b-brand-strong);}
.form-card{box-shadow:0 10px 30px -18px var(--b-shadow);}

/* 블로그: 소제목 번호 원 + 포인트색 테두리, 카드 왼쪽 선 */
.pbox{border-left:3px solid var(--b-brand);}
.pbox h2:before{background:var(--b-brand); box-shadow:0 0 0 2px var(--surface), 0 0 0 3.5px var(--accent);}
mark.free{color:var(--b-brand-strong);}

/* 모바일: 글자 아래에 풍경 그림, 통계 카드는 그림 위로 살짝 */
@media (max-width:900px){
  .hero{padding-block:36px 0;}
  .hero::before{display:none;}
  .hero .grid > div:last-child{position:relative; inset:auto; z-index:0; height:230px; margin-inline:calc(50% - 50vw); margin-top:8px;}
  .stats{margin-top:-40px;}
  .stats .wrap > div + div{border-left:0;}
  .page-hero{background-size:auto 70px, 100% 30px, auto; padding-bottom:56px;}
}
/* 군산: 블로그 팁박스·체크를 초록으로, 소제목 번호 원에 금색 테두리 */
:root{--tip-bg:#EAF7F0; --tip-line:#BCE3CF; --tip-ink:#0E6A50; --card-bg:#F1F7F4; --check:#1A8C6B;}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--tip-bg:#12261C; --tip-line:#245B3A; --tip-ink:#8FE3B4; --card-bg:#16261F; --check:#3DD68C;}}
:root[data-theme="dark"]{--tip-bg:#12261C; --tip-line:#245B3A; --tip-ink:#8FE3B4; --card-bg:#16261F; --check:#3DD68C;}
.cta-main{box-shadow:0 10px 24px -10px rgba(201,138,16,.55);}