/* v27 mobile refinement. Desktop v26 rules are intentionally untouched. */
@media (max-width:680px){
  :root{--mobile-edge:14px}
  html{scroll-padding-top:56px}
  body{font-size:16px;line-height:1.62;overflow-x:hidden}

  .site-header{
    width:calc(100% - 28px);
    height:62px;
    gap:10px;
  }
  .logo{gap:8px}
  .logo>b{width:36px;height:36px;font-size:18px}
  .logo strong{font-size:19px}
  .logo small{font-size:8px}
  .header-actions{min-width:0;gap:6px}
  .site-header .kakao-easy-start,
  .site-header .header-cta{min-height:40px;padding:0 11px;font-size:12px;white-space:nowrap}
  .site-header .header-cta{display:none}

  .category-bar{height:50px}
  .category-scroll{width:100%;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  .category-scroll a,.category-scroll button{
    flex:0 0 auto;
    min-width:130px;
    height:50px;
    gap:7px;
    padding:0 11px;
    font-size:12px;
    scroll-snap-align:start;
  }
  .category-scroll i{width:22px;height:22px;flex:0 0 22px;font-size:9px}

  .hero{min-height:0;padding:31px var(--mobile-edge) 36px}
  .eyebrow{font-size:11px;letter-spacing:.06em}
  .hero h1{margin:14px 0 15px;font-size:34px;line-height:1.12;letter-spacing:-.062em}
  .hero-copy>p{font-size:15.5px;line-height:1.68}
  .hero-actions{display:grid;grid-template-columns:1.15fr .85fr;gap:8px;margin-top:21px}
  .hero-actions .button{min-width:0;min-height:50px;padding:0 12px;gap:8px;font-size:13px;line-height:1.25}
  .button span,.quick-check-submit span,.benefit-card button span,.consult-form>button span,.partner-cta .button span{font-size:18px}
  .hero-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:16px}
  .hero-proof li,.hero-proof li:last-child{
    grid-column:auto;
    min-width:0;
    min-height:64px;
    padding:9px 8px;
    align-items:flex-start;
    justify-content:center;
  }
  .hero-proof b{font-size:14px}
  .hero-proof span{font-size:11px;line-height:1.35}

  .quick-check{margin-top:24px;padding:18px var(--mobile-edge) 19px}
  .quick-check-visual{height:138px;margin:-18px calc(var(--mobile-edge) * -1) 17px}
  .quick-check-visual figcaption{left:14px;right:14px;bottom:12px}
  .quick-check-visual figcaption strong{font-size:17px}
  .quick-check-visual figcaption small{font-size:11.5px}
  .quick-check-head{gap:10px;padding-bottom:14px}
  .quick-check-head h2{font-size:20px;line-height:1.34}
  .quick-check-head>b{width:42px;height:42px;flex:0 0 42px;font-size:12px}
  .quick-check fieldset{margin-top:14px}
  .quick-check legend{margin-bottom:8px;font-size:14px}
  .quick-choice-grid{gap:7px}
  .quick-choice-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
  .quick-choice-grid.services{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick-choice-grid button{min-height:48px;padding:8px 6px;font-size:13px;line-height:1.35}
  .quick-region{margin-top:14px;font-size:14px}
  .quick-region input{height:49px;margin-top:6px;font-size:16px}
  .quick-check-submit{height:54px;margin-top:13px;font-size:15px}
  .quick-check>p{font-size:12px}

  .assurance-strip{width:100%;grid-template-columns:1fr}
  .assurance-strip article{min-height:0;padding:17px var(--mobile-edge)}
  .assurance-strip small{font-size:11px}
  .assurance-strip strong{margin-top:5px;font-size:18px}
  .assurance-strip span{margin-top:4px;font-size:14px;line-height:1.5}
  .metrics{grid-template-columns:1fr 1fr;padding:0 var(--mobile-edge)}
  .metrics>div{min-height:84px;padding:13px;border-color:#2a3443}
  .metrics strong{font-size:20px}
  .metrics span{margin-top:5px;font-size:11.5px}

  .section{width:calc(100% - 28px);padding:54px 0}
  .section-heading{display:block;margin-bottom:24px}
  .section-heading>div>span,.why-copy>span,.partner-cta>div>span,.consult-copy>span{font-size:11px;letter-spacing:.1em}
  .section-heading h2,.why-copy h2,.partner-cta h2,.consult-copy h2{
    margin-top:9px;
    font-size:30px;
    line-height:1.17;
  }
  .section-heading>p{margin-top:13px;font-size:15px;line-height:1.67}
  .comparison-section{padding-top:54px}

  .point-grid{grid-template-columns:1fr;gap:8px}
  .point-grid article{min-height:0;padding:19px 18px}
  .point-grid small{padding:6px 9px;font-size:10px}
  .point-grid b{margin-top:18px;font-size:19px}
  .point-grid span{margin-top:7px;font-size:14.5px;line-height:1.58}

  .comparison-board{margin:18px calc(var(--mobile-edge) * -1) 0;border-left:0;border-right:0}
  .comparison-board>header{display:block;padding:22px 18px}
  .comparison-board>header h3{font-size:23px;line-height:1.3}
  .comparison-board>header p{margin-top:7px;font-size:13px}
  .scope-row{padding:16px 18px;border-bottom-width:6px}
  .scope-row>*{padding:4px 0}
  .scope-row th[scope="row"]{font-size:18px}
  .scope-row td{font-size:14px;line-height:1.5}
  .scope-row td:before{width:78px;font-size:11px}
  .scope-row .service-select{
    min-height:48px;
    margin-top:9px;
    padding:0 13px;
    border-color:var(--blue)!important;
    background:var(--blue)!important;
    color:#fff!important;
    font-size:14px;
  }
  .comparison-board>footer{padding:18px}
  .comparison-board>footer p{font-size:12.5px}
  .comparison-board>footer .button{min-height:50px;margin-top:13px;font-size:14px}

  .service-section{padding-bottom:54px}
  .service-grid.eight-services{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .service-grid.eight-services .service-card{min-width:0}
  .service-grid.eight-services .service-image{height:108px}
  .service-grid.eight-services .service-image small{font-size:10px}
  .service-grid.eight-services .service-image i{font-size:9px}
  .service-grid.eight-services .service-body{padding:12px 11px 11px}
  .service-grid.eight-services .service-body h3{font-size:16px;line-height:1.3}
  .service-grid.eight-services .service-body>p{
    display:-webkit-box;
    margin:6px 0 7px;
    overflow:hidden;
    font-size:12.5px;
    line-height:1.5;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  .service-grid.eight-services .service-highlight{
    display:-webkit-box;
    min-height:48px;
    overflow:hidden;
    padding:7px;
    font-size:11.5px;
    line-height:1.45;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  .service-grid.eight-services .service-details{display:none}
  .service-grid.eight-services .service-detail-action{padding-top:9px;font-size:13px}

  .repair-section{padding-top:42px;padding-bottom:42px}
  .repair-panel{display:block;padding:23px 19px}
  .repair-mark{width:58px;height:58px;margin-bottom:18px;font-size:28px}
  .repair-copy>span{font-size:11px}
  .repair-copy h2{margin:9px 0 10px;font-size:28px;line-height:1.19}
  .repair-copy p{font-size:14.5px;line-height:1.62}
  .repair-copy ul{grid-template-columns:1fr 1fr;gap:7px;margin:15px 0 11px}
  .repair-copy li{min-height:42px;padding:8px;font-size:11.5px}
  .repair-copy>small{font-size:11px;line-height:1.5}
  .repair-cta{width:100%;min-height:52px;margin-top:19px;font-size:15px}

  .offer-section .section{padding-top:54px;padding-bottom:54px}
  .benefit-grid.eight-benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .benefit-grid.eight-benefits .benefit-card{
    min-height:236px;
    padding:15px 13px 13px;
  }
  .benefit-grid.eight-benefits .benefit-card header small,
  .benefit-grid.eight-benefits .benefit-card header b{font-size:10px}
  .benefit-grid.eight-benefits .benefit-card h3{margin-top:17px;font-size:16px;line-height:1.38}
  .benefit-grid.eight-benefits .benefit-card p{font-size:13px;line-height:1.5}
  .benefit-grid.eight-benefits .benefit-card button{min-height:46px;padding-top:9px;font-size:13px}
  .benefit-disclaimer{font-size:12.5px}

  .trust-rule-grid{grid-template-columns:1fr;gap:7px}
  .trust-rule-grid article{min-height:0;padding:18px}
  .trust-rule-grid b{font-size:11px}
  .trust-rule-grid strong{margin-top:15px;font-size:19px}
  .trust-rule-grid span{margin-top:7px;font-size:14.5px}
  .field-grid{grid-template-columns:1fr;gap:8px}
  .field-grid figure,.field-grid figure:first-child{display:grid;grid-template-columns:42% 58%;grid-column:auto;min-height:154px}
  .field-grid img,.field-grid figure:first-child img{width:100%;height:100%;min-height:154px}
  .field-grid figcaption{display:flex;flex-direction:column;justify-content:center;padding:14px}
  .field-grid small{font-size:10.5px}
  .field-grid strong{margin-top:7px;font-size:16px;line-height:1.38}
  .field-grid span{margin-top:6px;font-size:13px;line-height:1.5}
  .partner-strip{margin-top:8px;padding:18px}
  .partner-strip strong{font-size:17px}
  .partner-strip ul{grid-template-columns:1fr 1fr;gap:6px;margin-top:12px}
  .partner-strip li{padding:8px 6px;font-size:12px}

  .why-free{padding:54px var(--mobile-edge)}
  .why-copy p{font-size:15px;line-height:1.65}
  .why-visual{height:172px;margin:19px 0}
  .why-list{margin-top:30px}
  .why-list article{grid-template-columns:34px 1fr;gap:11px;padding:16px 0}
  .why-list strong{font-size:17px}
  .why-list p{font-size:14px;line-height:1.55}

  .process-grid{grid-template-columns:1fr}
  .process-grid article{min-height:0;padding:19px 18px}
  .process-grid strong{margin-top:17px;font-size:18px}
  .process-grid p{font-size:14.5px}
  .audience-section .section{padding-top:54px;padding-bottom:54px}
  .audience-grid{grid-template-columns:1fr;gap:8px}
  .audience-grid article{min-height:0;padding:20px 18px}
  .audience-grid strong{font-size:18px;line-height:1.42}
  .audience-grid p{font-size:14.5px}

  .faq-list summary{min-height:58px;padding:14px 4px;font-size:16px;line-height:1.45}
  .faq-list details p{padding:0 4px 17px;font-size:14.5px}
  .partner-cta{display:block;margin-top:42px;margin-bottom:42px;padding:28px 22px}
  .partner-cta p{font-size:14.5px}
  .partner-tags{gap:6px}
  .partner-tags i{font-size:11.5px}
  .partner-cta .button{width:100%;min-height:52px;margin-top:20px;font-size:14px}

  .consult-section{display:block;padding:54px var(--mobile-edge)}
  .consult-copy>p{font-size:15px;line-height:1.65}
  .consult-copy li{font-size:14px}
  .consult-visual{height:172px;margin:19px 0}
  .button-kakao{min-height:52px;font-size:14px}
  .consult-form{margin-top:28px;padding:22px 16px}
  .consult-form-head{margin:-22px -16px 20px;padding:18px 16px}
  .consult-form-head strong{font-size:19px}
  .consult-form label{font-size:15px}
  .consult-form input,.consult-form select,.consult-form textarea{font-size:16px}
  .consult-service-checks>div{grid-template-columns:1fr 1fr}
  .consult-service-checks label span{min-height:48px;font-size:13px}
  .consult-form>button{height:56px;font-size:15px}
  footer{padding:42px var(--mobile-edge) calc(42px + env(safe-area-inset-bottom))}
  footer>p{font-size:13px}
  footer nav{gap:13px;font-size:12px}

  .mobile-bar{
    min-height:calc(58px + env(safe-area-inset-bottom));
    padding:6px 8px calc(6px + env(safe-area-inset-bottom));
    gap:6px;
  }
  .mobile-bar>button,.mobile-bar>a{height:46px;min-height:46px;padding:0 6px;font-size:13px}

  body.sponsor-dock-ready{padding-bottom:calc(130px + env(safe-area-inset-bottom))!important}
  body.sponsor-dock-ready.has-mobile-action{padding-bottom:calc(188px + env(safe-area-inset-bottom))!important}
  .sponsor-dock{height:128px;padding:4px 0 6px}
  body.has-mobile-action .sponsor-dock{bottom:calc(58px + env(safe-area-inset-bottom))}
  .sponsor-dock-head{height:20px;padding:0 8px;font-size:8.5px}
  .sponsor-dock-head b{font-size:8.5px}
  .sponsor-dock-viewport{padding-left:5px}
  .sponsor-dock-track{gap:5px}
  .sponsor-dock-card{flex-basis:calc((100vw - 15px)/2);height:94px}
  .sponsor-dock-card::after{top:6px;right:6px;padding:3px 5px;font-size:7px}
  .sponsor-dock-card-content{padding:8px 9px 9px}
  .sponsor-dock-card small{font-size:7.5px}
  .sponsor-dock-card strong{font-size:15.5px}
  .sponsor-dock-card span{font-size:9.5px}
}

@media (max-width:380px){
  .hero h1{font-size:31px}
  .hero-actions .button{font-size:12px}
  .hero-proof span{font-size:10px}
  .quick-choice-grid button{font-size:12px}
  .section-heading h2,.why-copy h2,.partner-cta h2,.consult-copy h2{font-size:28px}
  .service-grid.eight-services .service-body h3{font-size:15px}
  .service-grid.eight-services .service-body>p{font-size:12px}
  .benefit-grid.eight-benefits .benefit-card{min-height:228px;padding:14px 11px 12px}
  .benefit-grid.eight-benefits .benefit-card h3{font-size:15px}
  .field-grid figure,.field-grid figure:first-child{grid-template-columns:39% 61%}
}

@media (prefers-reduced-motion:reduce){
  .quick-check-visual img{animation:none}
}