  :root{
    --bg:#191e2b;
    --bg-soft:#f4f6f5;
    --panel:#ffffff;
    --text:#171a20;
    --muted:#5b626b;
    --line:#e4e8ea;
    --accent:#23aa08;
    --accent-dark:#1a8206;
  }
  *{box-sizing:border-box;}
  body{
    margin:0;
    font-family:"Noto Sans KR","Malgun Gothic","Apple SD Gothic Neo",sans-serif;
    color:var(--text);
    background:var(--bg-soft);
    line-height:1.6;
    word-break:keep-all;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1040px;margin:0 auto;padding:0 20px;}
  section{padding:64px 0;}

  /* top bar */
  .topbar{position:sticky;top:0;z-index:50;background:rgba(25,30,43,.94);backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,.08);}
  .topbar .wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;}
  .topbar .brand{color:#fff;font-weight:900;font-size:1.05rem;letter-spacing:-.02em;}
  .brand-lockup{display:flex;align-items:center;gap:8px;}
  .brand-icon{width:26px;height:26px;flex-shrink:0;}
  .brand-word{font-family:'Gamja Flower',cursive;font-size:1.55rem;color:#fff;line-height:1;}
  .topbar .call-group{display:flex;gap:8px;}
  .topbar .call{background:var(--accent);color:#fff;font-weight:700;font-size:.88rem;padding:9px 14px;border-radius:999px;white-space:nowrap;}
  .topbar .call.call-sms{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);}
  .topbar .call.call-kakao{background:#FEE500;color:#3c1e1e;}

  /* hero */
  .hero{position:relative;color:#fff;overflow:hidden;padding:0;}
  .hero-bg{position:absolute;inset:0;background:url('images/case-05-before.jpg') center/cover no-repeat;filter:brightness(.45) saturate(.9);}
  .hero-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,24,32,.6) 0%,rgba(20,24,32,.55) 40%,rgba(17,20,27,.94) 100%);}
  .hero .wrap{position:relative;padding:96px 20px 64px;}
  .hero .eyebrow{color:#7be05f;font-weight:800;font-size:1rem;letter-spacing:.02em;margin:0 0 14px;}
  .hero h1{font-size:clamp(2rem,6vw,3.4rem);font-weight:900;line-height:1.15;margin:0 0 16px;letter-spacing:-.02em;}
  .hero p{font-size:clamp(1rem,2vw,1.15rem);color:#e7eaec;max-width:580px;margin:0 0 28px;}
  .cta-row{display:flex;gap:12px;flex-wrap:wrap;}
  .btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:12px;font-weight:800;font-size:1rem;}
  .btn-primary{background:var(--accent);color:#fff;}
  .btn-ghost{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.35);}
  .btn-sms{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.4);}
  .btn-kakao{background:#FEE500;color:#3c1e1e;}
  .hero .tags{margin-top:36px;display:flex;gap:10px;flex-wrap:wrap;}
  .tag{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#f2f4f6;font-size:.82rem;padding:6px 12px;border-radius:999px;}

  h2.section-title{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:900;margin:0 0 8px;letter-spacing:-.02em;}
  .section-sub{color:var(--muted);margin:0 0 32px;font-size:.98rem;}

  /* service cards */
  .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 20px;}
  .card h3{font-size:1.02rem;font-weight:800;margin:0 0 8px;}
  .card p{color:var(--muted);font-size:.9rem;margin:0;}

  /* case studies */
  .case-bg{background:var(--bg);color:#fff;}
  .case-bg h2, .case-bg .section-sub{color:#fff;}
  .case-bg .section-sub{color:#aab0b3;}
  .case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .case-card{background:#20242f;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08);position:relative;}
  .case-card img{aspect-ratio:4/3;object-fit:cover;width:100%;}
  .case-card .cap{padding:16px 16px 18px;}
  .case-card h3{font-size:.95rem;font-weight:800;margin:0 0 4px;color:#fff;}
  .case-card p{font-size:.85rem;color:#a9afb2;margin:0;}
  .case-pair{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;}
  .case-pair img{aspect-ratio:1/1;}
  .case-pair .cap{grid-column:1 / -1;}
  .badge{position:absolute;margin:10px;background:rgba(0,0,0,.65);color:#fff;font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px;}

  /* quick nav */
  .quicknav{background:var(--panel);border-bottom:1px solid var(--line);overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;}
  .quicknav::-webkit-scrollbar{display:none;}
  .quicknav .wrap{display:flex;gap:8px;padding:14px 20px;}
  .quicknav a{flex:0 0 auto;background:var(--bg-soft);border:1px solid var(--line);color:var(--text);font-size:.85rem;font-weight:700;padding:8px 14px;border-radius:999px;}

  /* category sections (per-service before/after) */
  .cat-section{padding:52px 0;}
  .cat-section.alt{background:var(--panel);}
  .cat-kicker{color:var(--accent-dark);font-weight:800;font-size:.85rem;letter-spacing:.02em;margin:0 0 8px;}
  .cat-section h2{font-size:clamp(1.3rem,3.2vw,1.9rem);font-weight:900;margin:0 0 12px;letter-spacing:-.02em;line-height:1.3;}
  .cat-desc{color:var(--muted);font-size:.96rem;margin:0 0 20px;}
  .cat-body{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:start;}
  .cat-photos{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
  .cat-photos .ph{position:relative;}
  .cat-photos img{aspect-ratio:1/1;object-fit:cover;border-radius:14px;width:100%;}
  .cat-photos .lbl{position:absolute;margin:8px;font-size:.72rem;font-weight:800;color:#fff;background:rgba(0,0,0,.6);padding:3px 10px;border-radius:999px;}
  .field-note{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:16px;}
  .cat-section.alt .field-note{background:#eef4ee;}
  .field-note .fn-label{font-weight:800;font-size:.85rem;color:var(--accent-dark);margin-bottom:6px;}
  .field-note p{margin:0;color:var(--text);font-size:.9rem;}
  .area-tags{display:flex;flex-wrap:wrap;gap:8px;}
  .area-tag{background:transparent;border:1px solid var(--line);color:var(--muted);font-size:.78rem;padding:5px 11px;border-radius:999px;}

  @media (max-width:760px){
    .cat-body{grid-template-columns:1fr;}
    .cat-photos{order:-1;}
  }

  /* video section */
  .case-bg{background:var(--bg);color:#fff;}
  .case-bg h2, .case-bg .section-sub{color:#fff;}
  .case-bg .section-sub{color:#aab0b3;}
  .video-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .case-card{background:#20242f;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08);}
  .case-card .cap{padding:16px 16px 18px;}
  .case-card h3{font-size:.92rem;font-weight:800;margin:0 0 4px;color:#fff;}
  .case-video{aspect-ratio:9/16;width:100%;border:0;display:block;background:#000;}
  .video-thumb{position:relative;aspect-ratio:9/16;width:100%;cursor:pointer;background:#000;overflow:hidden;}
  .video-thumb img{width:100%;height:100%;object-fit:cover;display:block;opacity:.75;}
  .video-thumb .play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;background:rgba(0,0,0,.55);border:2px solid #fff;color:#fff;font-size:1.3rem;display:flex;align-items:center;justify-content:center;pointer-events:none;}
  .video-reveal{text-align:center;}
  .video-reveal-btn{cursor:pointer;border:none;}
  .video-row[hidden]{display:none;}
  @media (max-width:860px){.video-row{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.video-row{grid-template-columns:1fr;}}

  /* reviews */
  .review-empty{background:var(--panel);border:1px dashed var(--line);border-radius:16px;padding:36px 24px;text-align:center;color:var(--muted);font-size:.95rem;}
  .review-cta{text-align:center;margin-top:20px;}

  /* why */
  .why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .why-grid .card{text-align:center;}
  .why-grid .num{width:36px;height:36px;border-radius:10px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;margin:0 auto 12px;}

  /* process */
  .process-list{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:step;}
  .process-list li{list-style:none;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px 18px;position:relative;}
  .process-list li::before{counter-increment:step;content:counter(step);display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--text);color:#fff;font-weight:800;font-size:.85rem;margin-bottom:10px;}
  .process-list h3{margin:4px 0 6px;font-size:.98rem;}
  .process-list p{margin:0;color:var(--muted);font-size:.87rem;}

  /* faq */
  details{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:4px 18px;margin-bottom:10px;}
  summary{cursor:pointer;padding:16px 0;font-weight:700;font-size:1rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;}
  summary::-webkit-details-marker{display:none;}
  summary::after{content:"+";font-size:1.3rem;color:var(--accent);flex-shrink:0;}
  details[open] summary::after{content:"–";}
  details p{margin:0 0 18px;color:var(--muted);font-size:.94rem;}

  /* final cta */
  .final-cta{background:linear-gradient(135deg,#23aa08,#136b03);color:#fff;border-radius:24px;padding:56px 40px;text-align:center;}
  .final-cta h2{color:#fff;font-size:clamp(1.5rem,4vw,2.2rem);margin:0 0 12px;}
  .final-cta p{color:#e6f7e0;margin:0 0 26px;}
  .final-cta .btn-primary{background:#fff;color:var(--accent-dark);}
  .final-cta .cta-row{justify-content:center;}

  footer{background:var(--bg);color:#9aa0a3;padding:40px 0;font-size:.85rem;}
  footer .wrap{display:flex;flex-direction:column;gap:6px;}
  footer strong{color:#fff;}
  footer .partner-links{margin-top:10px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:14px;flex-wrap:wrap;}
  footer .partner-links a{color:#7be05f;}

  @media (max-width:860px){
    .grid-3{grid-template-columns:1fr 1fr;}
    .why-grid{grid-template-columns:1fr 1fr;}
    .process-list{grid-template-columns:1fr 1fr;}
    .case-grid{grid-template-columns:1fr 1fr;}
    .case-pair{grid-column:span 2;}
  }
  @media (max-width:560px){
    .grid-3, .why-grid, .process-list, .case-grid{grid-template-columns:1fr;}
    .case-pair{grid-column:span 1;grid-template-columns:1fr 1fr;}
    section{padding:44px 0;}
  }

  /* internal site nav (pages, not anchors) — reuses quicknav's pill look */
  .sitenav a.current{background:var(--accent);border-color:var(--accent);color:#fff;}

  /* simple page header for about/cases/notice (no photo, unlike the homepage hero) */
  .page-hero{background:var(--bg);color:#fff;text-align:center;padding:72px 20px 48px;}
  .page-hero .eyebrow{color:#7be05f;font-weight:800;font-size:1rem;letter-spacing:.02em;margin:0 0 12px;}
  .page-hero h1{font-size:clamp(1.8rem,5vw,2.6rem);font-weight:900;margin:0 0 14px;letter-spacing:-.02em;}
  .page-hero p{color:#c7ccd1;max-width:620px;margin:0 auto;font-size:1rem;}

  /* about page */
  .about-lead{font-size:1.05rem;color:var(--text);max-width:720px;margin:0 0 40px;}
  .info-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px 26px;}
  .info-card dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 20px;}
  .info-card dt{color:var(--muted);font-size:.88rem;font-weight:700;white-space:nowrap;}
  .info-card dd{margin:0;font-size:.95rem;}

  /* notice / empty-state page */
  .notice-empty{background:var(--panel);border:1px dashed var(--line);border-radius:16px;padding:48px 24px;text-align:center;color:var(--muted);font-size:.95rem;}
  .notice-empty p{margin:0 0 6px;}
