/* Anonymous homepage only. Protected slides, intro, footer and fixed controls are excluded. */
.kn-tutors-home.tutor-container{background:#fff!important}
.kn-board-home.recruit-container{background:#eef4f9!important}
:is(.kn-tutors-home,.kn-board-home) :is(.kn-tutors-heading,.kn-board-home__heading){padding:20px 16px;border:1px solid #244761;border-radius:14px;background:linear-gradient(115deg,#0a2744,#123f66);box-shadow:0 6px 18px #0a274414}
:is(.kn-tutors-home,.kn-board-home) :is(.kn-tutors-heading h2,.kn-board-home__heading h2){color:#fff}
:is(.kn-tutors-home,.kn-board-home) :is(.kn-tutors-eyebrow,.kn-board-home__eyebrow){color:#7ce3ff;font-size:12px;letter-spacing:.16em}
:is(.kn-tutors-home,.kn-board-home) :is(.kn-tutors-heading>p:last-child,.kn-board-home__heading>p:last-child){color:#ebf3fa}
.kn-tutors-home .kn-tutors-count{border-color:#7ce3ff;background:#fff;color:#0065af}
.kn-tutors-home .kn-tutor-card .university{background:none;color:#123b5c}
.kn-tutors-home .kn-tutor-card__action,.kn-tutors-home .kn-tutor-card__link:hover .kn-tutor-card__action{color:#fff;background:linear-gradient(110deg,#0068c5,#004d9d);box-shadow:0 3px 8px #005eb82b}
.kn-tutors-home .kn-tutor-card__link:hover .kn-tutor-card__action{background:linear-gradient(110deg,#0059ad,#003f85)}
.kn-tutors-home .kn-tutors-cta a,.kn-board-home .kn-board-home__cta a.kn-board-home__primary{background:linear-gradient(110deg,#0068c5,#004d9d);border-color:#0058a8;box-shadow:0 4px 12px #005eb82e;color:#fff}
.kn-board-home .kn-board-home__cta a.kn-board-home__secondary{background:linear-gradient(110deg,#007ca8,#00618c);border-color:#00658f;box-shadow:0 4px 12px #00658f24;color:#fff}
.kn-tutors-home .kn-tutors-cta a:hover,.kn-board-home .kn-board-home__cta a.kn-board-home__primary:hover{background:linear-gradient(110deg,#0059ad,#003f85)}
.kn-board-home .kn-board-home__cta a.kn-board-home__secondary:hover{background:linear-gradient(110deg,#00698f,#004f76)}
.kn-tutors-home .kn-tutors-cta a:active,.kn-board-home .kn-board-home__cta a:active{transform:none;box-shadow:inset 0 2px 4px #09243e40}
.kn-carousel-hint{display:flex;align-items:center;justify-content:center;gap:12px;margin:8px 0 0;padding:0;color:#0065af;font-size:12px;font-weight:700;line-height:1.6;letter-spacing:.06em}
.kn-carousel-hint span{color:#007ca8;font-size:20px;line-height:1}
.kn-tutors-home .tutor-list-wrapper,.kn-board-home .slick-list{cursor:grab}
.kn-tutors-home .tutor-list-wrapper:active,.kn-board-home .slick-list:active{cursor:grabbing}
:is(#features,#usageflow,#boutfees)>.tab-btn{background:#f0f5fa;border-color:#9bb6cc;box-shadow:0 2px 8px #0a27440a}
:is(#features,#usageflow,#boutfees)>.tab-btn .btn{color:#29465f;font-weight:700}
:is(#features,#usageflow,#boutfees)>.tab-btn .btn.btn-01.is-active{background:linear-gradient(110deg,#0068c5,#004d9d);border-color:#0058a8;color:#fff;box-shadow:0 3px 8px #005eb82b}
:is(#features,#usageflow,#boutfees)>.tab-btn .btn.btn-02.is-active{background:linear-gradient(110deg,#007ca8,#00618c);border-color:#00658f;color:#fff;box-shadow:0 3px 8px #00658f2b}
:is(#features,#usageflow,#boutfees)>.tab-btn .btn:not(.is-active):hover{background:#fff;color:#005eb8}
:is(#features,#usageflow,#boutfees)>.tab-btn .btn:active{box-shadow:inset 0 2px 4px #09243e26}
:is(#features,#usageflow,#boutfees,#voice) :is(.kn-guidance-eyebrow,.kn-commerce-eyebrow){color:#0065af;letter-spacing:.18em}
#features .features-flex>.flex-con{border-color:#9bb6cc;background:#fff;box-shadow:0 4px 16px #0a27440d}
#features .features-flex .flex-con h4{color:#005eb8;font-weight:800}
#features .features-flex-02 .point-title p{color:#005eb8}
#usageflow .flow-con h5{color:#fff!important;background:linear-gradient(110deg,#0a2744,#12518a);border-color:#244761;box-shadow:0 3px 10px #0a27441a}
#usageflow .flow-list>li{border-color:#abc1d2;background:#fff}
#usageflow .flow-list p strong{color:#005eb8;border-color:#9bb6cc}
#usageflow .flow-list p span{color:#a33b00;background:#fff5eb}
#boutfees .fees-con-02 h5{color:#005eb8;background:#e8f3ff;border-color:#a4bed3;font-weight:800}
#boutfees .kn-fee-detail p+p{border-color:#a4bed3}
#voice.kn-home-commerce .voice-list .voice-con{background:#fff;border-color:#a4bed3;box-shadow:0 5px 18px #0a274412}
#voice.kn-home-commerce .voice-con .v-kotei span{color:#fff;background:#0a2744;border-color:#0a2744}
#voice.kn-home-commerce .voice-con>p strong{color:#005eb8}
:is(.kn-tutors-home,.kn-board-home,#features,#usageflow,#boutfees,#voice) :is(a,button,[role=tab],summary):focus-visible{outline:3px solid #007ca8;outline-offset:3px}
@media(max-width:768px){
 :is(.kn-tutors-home,.kn-board-home) :is(.kn-tutors-heading,.kn-board-home__heading){padding:18px 12px;border-radius:12px}
 #usageflow.kn-home-guidance .flow-route{border-color:#91adc4;background:#eef4f9;box-shadow:0 3px 12px #0a27440a}
 #usageflow.kn-home-guidance .flow-route+.flow-route{background:#eef4f9}
 #usageflow.kn-home-guidance .flow-route-head h3{color:#0a2744;font-weight:800}
 #usageflow.kn-home-guidance .flow-route-head h3 span{color:#fff;background:#0a2744;border-color:#0a2744}
 #usageflow.kn-home-guidance .flow-route-head small{color:#fff;background:#0065af;font-weight:700}
 #usageflow.kn-home-guidance .flow-step-card{background:#fff;border-color:#91adc4;box-shadow:0 5px 16px #0a274419}
 #usageflow.kn-home-guidance .flow-step-ribbon{background:linear-gradient(110deg,#0a2744,#12518a);color:#fff;font-weight:800;letter-spacing:.1em}
 #usageflow.kn-home-guidance .flow-step-card h4{color:#005eb8;font-weight:800}
 #usageflow.kn-home-guidance .flow-step-card b{background:#0a2744;color:#fff;letter-spacing:.08em}
 #usageflow.kn-home-guidance .flow-card-dots{gap:7px;padding:8px 10px;border:1px solid #bdcddd;border-radius:20px;background:#fff}
 #usageflow.kn-home-guidance .flow-card-dots li{width:7px;height:7px;background:#71879a}
 #usageflow.kn-home-guidance .flow-card-dots li.is-active{width:22px;background:#005eb8}
 #usageflow.kn-home-guidance .kn-flow-controls button:not(:disabled){color:#fff;border-color:#0058a8;background:linear-gradient(110deg,#0068c5,#004d9d);box-shadow:0 3px 8px #005eb826}
 #usageflow.kn-home-guidance .kn-flow-controls button:not(:disabled):hover{background:#004d9d}
 #usageflow.kn-home-guidance .kn-flow-controls button:disabled{color:#617689;border-color:#a8bdcc;background:#fff}
 #usageflow.kn-home-guidance .kn-flow-controls button:active{transform:none;box-shadow:inset 0 2px 4px #09243e40}
 #usageflow.kn-home-guidance .flow-swipe-hint{color:#0065af;font-size:12px;font-weight:700}
 #usageflow.kn-home-guidance .flow-note-box{background:#fff;border-color:#ec6a0b;border-top-width:3px;box-shadow:0 4px 14px #b94c0012}
 #usageflow.kn-home-guidance .flow-note-label{background:#fff1e5;color:#9e3800;border-color:#f0a46c;font-weight:800}
 #usageflow.kn-home-guidance .flow-note-label span,#usageflow.kn-home-guidance .flow-note-box li::before{background:#bd4600;border-color:#bd4600;color:#fff}
 #usageflow.kn-home-guidance .flow-note-box li{color:#263442;font-weight:500;line-height:1.85}
 #usageflow.kn-home-guidance .flow-note-box li+li{border-color:#f1c5a4}
}
@media(prefers-reduced-motion:reduce){:is(.kn-tutors-home,.kn-board-home,#features,#usageflow,#boutfees,#voice) :is(a,button,[role=tab]){transition:none}}

/* Follow-up: compact cards and the same unboxed vertical steps on every device. */
:is(.kn-tutors-home,.kn-board-home) :is(.kn-tutors-heading,.kn-board-home__heading){border-top:4px solid #38c7e4}
.kn-tutors-home .kn-tutor-card .info .hourly-wage{color:#263442}
.kn-tutors-home .tutor-list-wrapper{padding-bottom:0}
.kn-tutors-home .tutor-list-member.kn-tutor-card{margin-bottom:0}
.kn-board-home .slick-list{padding-bottom:0!important}
.kn-board-home .ticketList.recruit-list{margin-bottom:0}
.kn-carousel-hint{margin-top:4px}
#usageflow .flow-con h5{color:#0065af!important;background:none;border:0;box-shadow:none;border-radius:0}
.kn-flow-route-tabs{display:none}
@media(max-width:768px){
 #usageflow.kn-home-guidance>.tab-contents{padding:0 16px 24px}
 #usageflow.kn-home-guidance .flow-flex{display:block!important;width:100%;max-width:640px;margin:0 auto;padding:0;background:none;border:0}
 #usageflow.kn-home-guidance .flow-con{width:100%;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
 #usageflow.kn-home-guidance .flow-con[hidden]{display:none!important}
 #usageflow.kn-home-guidance .flow-con h5{justify-content:flex-start;gap:8px;margin:20px 0 14px;padding:0;font-size:19px;line-height:1.5}
 #usageflow.kn-home-guidance .flow-con h5 img{flex:0 0 34px;width:34px;margin:0}
 #usageflow.kn-home-guidance .flow-list{margin:0;padding:0}
 #usageflow.kn-home-guidance .flow-list>li{display:flex;flex-wrap:nowrap;align-items:flex-start;gap:12px;min-height:0;margin:0!important;padding:0 0 20px;list-style:none}
 #usageflow.kn-home-guidance .flow-list>li>img{flex:0 0 48px;width:48px;max-width:48px;height:auto;margin:8px 0 0}
 #usageflow.kn-home-guidance .flow-list>li>div{display:block;flex:1;min-width:0;width:auto;margin:0}
 #usageflow.kn-home-guidance .flow-list p{margin:0;font-size:14px;line-height:1.75;overflow-wrap:anywhere}
 #usageflow.kn-home-guidance .flow-list p strong{display:block;width:auto;margin:0 0 7px;padding:6px 0;font-size:18px;line-height:1.5}
 #usageflow.kn-home-guidance .flow-list .kn-flow-caution{margin-top:8px;color:#a33b00;font-size:13px;line-height:1.7;background:none;border:0}
 #usageflow.kn-home-guidance .kn-flow-route-tabs{display:flex;gap:12px;justify-content:flex-start;margin:10px 0 18px;padding:0;border:0;background:none}
 #usageflow.kn-home-guidance .kn-flow-route-tabs button{flex:1;min-width:0;min-height:44px;margin:0;padding:8px 4px;border:0;border-bottom:2px solid #c3d5e1;border-radius:0;background:none;color:#40586b;font-size:14px;font-weight:700;line-height:1.5;cursor:pointer}
 #usageflow.kn-home-guidance .kn-flow-route-tabs button[aria-selected=true]{border-color:#0078b5;color:#0065af}
 #usageflow.kn-home-guidance .kn-flow-route-tabs button:focus-visible{outline:3px solid #007ca8;outline-offset:3px}
}

/* The tutor card uses the same solid consultation action as its detail page. */
.kn-tutors-home .kn-tutor-card__action{border-radius:10px;background:#0065af;color:#fff;box-shadow:0 4px 12px #0065af1a}
.kn-tutors-home .kn-tutor-card__link:hover .kn-tutor-card__action{background:#085482;color:#fff}
/* One continuous header surface spans the existing title and audience tabs. */
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce){display:grid;grid-template-columns:minmax(0,1fr);isolation:isolate}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)::before{content:"";display:block;grid-column:1;grid-row:1/3;align-self:stretch;justify-self:center;box-sizing:border-box;width:calc(100% - 80px);max-width:1160px;margin:34px 0 12px;border:1px solid #244761;border-top:4px solid #38c7e4;border-radius:14px;background:linear-gradient(115deg,#0a2744,#123f66);box-shadow:0 6px 18px #0a274414;z-index:-1;pointer-events:none}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.topre-title{grid-column:1;grid-row:1;box-sizing:border-box;width:calc(100% - 80px);max-width:1160px;margin:34px auto 0;padding:20px 16px 12px;background:none}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.topre-title .h2-pin{color:#fff}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.topre-title :is(.kn-guidance-eyebrow,.kn-commerce-eyebrow){color:#7ce3ff}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn{grid-column:1;grid-row:2;width:min(calc(100% - 112px),440px);margin:0 auto 24px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;gap:8px}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn .btn{border-color:transparent;background:#ffffff12;color:#edf7ff;box-shadow:none}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn .btn.btn-01.is-active{border-color:transparent;background:#fff;color:#0065af;box-shadow:0 2px 6px #00142626}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn .btn.btn-02.is-active{border-color:transparent;background:#fff;color:#006b90;box-shadow:0 2px 6px #00142626}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn .btn:not(.is-active):hover{background:#ffffff26;color:#fff}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn .btn:focus-visible{outline-color:#7ce3ff}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-contents{grid-column:1;grid-row:3;min-width:0}
:is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-contents>.content{padding-top:8px}
@media(max-width:768px){
 :is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)::before{width:calc(100% - 32px);margin:22px 0 10px;border-radius:12px}
 :is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.topre-title{width:calc(100% - 32px);margin-top:22px;padding:18px 12px 12px}
 :is(#features,#usageflow,#boutfees):is(.kn-home-guidance,.kn-home-commerce)>.tab-btn{width:min(calc(100% - 56px),440px);margin-bottom:22px}
}


/* Requested finishing touches: title surfaces, teacher pricing and mobile features. */
#voice.kn-home-commerce>.topre-title{box-sizing:border-box;width:calc(100% - 80px);max-width:1160px;margin:34px auto 20px;padding:20px 16px;border:1px solid #244761;border-top:4px solid #38c7e4;border-radius:14px;background:linear-gradient(115deg,#0a2744,#123f66);box-shadow:0 6px 18px #0a274414}
#voice.kn-home-commerce>.topre-title .h2-pin{color:#fff}
#voice.kn-home-commerce>.topre-title .kn-commerce-eyebrow{color:#7ce3ff}
#boutfees.kn-home-commerce .content.student .fees-con-02{margin-top:0;padding-top:16px}
#boutfees.kn-home-commerce .content.student .fees-con-02 .point-title p{color:#0065af}
@media(max-width:768px){
 #voice.kn-home-commerce>.topre-title{width:calc(100% - 32px);margin:24px auto 18px;padding:18px 12px;border-radius:12px}
 #boutfees.kn-home-commerce .content.student .comparison-scroll{padding-bottom:8px}
 #boutfees.kn-home-commerce .content.student .fees-con-02{margin-top:0;padding-top:12px}
 body:has(.top-slide-box) #features.features-container .content.tutor .features-flex{align-items:stretch}
 body:has(.top-slide-box) #features.features-container .content.tutor .features-flex>.flex-con:is(.con-01,.con-02,.con-03){height:auto;min-height:0;align-self:stretch}
 body:has(.top-slide-box) #features.features-container .content.tutor .features-flex>.flex-con.con-01>.features-inner-flex{flex:1 1 auto}
 body:has(.top-slide-box) #features.features-container .content.tutor .features-flex>.flex-con.con-01 .features-inner-flex .flex-con{flex:1 1 auto;height:auto;min-height:0}
 body:has(.top-slide-box) #features.features-container .content.student .features-flex>.flex-con.con-03>img:not(.popup-image){flex:0 0 auto;width:100%;height:auto;min-height:0;max-height:none;object-fit:contain;object-position:center top}
}