/* Stable internet UI refinements, isolated from later 3D experiments. */
/* Internet page stable stylesheet: isolated from later universal 3D patches. Snapshot of pre-redesign verified GitHub branch. */
/* Consolidated visual layer; old overlapping experiments removed 2026-10-21. */
:root{--jjs-fine-shadow:0 12px 32px rgba(24,30,39,.092)}
body.experience-ui{color:#23252a}
.experience-ui :is(.home-shortcuts>a,.home-product-card,.product-card,.guide-steps>*,.faq-item,.consult-card,.consult-summary){box-shadow:var(--jjs-fine-shadow)}
.experience-ui .tools-main .faq-item .faq-answer p{font-size:14px;line-height:1.85;color:#444b55}
.experience-ui .tools-main .faq-item summary{font-size:16px;font-weight:700;color:#232831}
/* 2026-10-21 corrective pass: restore the approved orange/charcoal cards. */
.experience-ui .home-offer-grid .home-offer-phone{background:#d96532!important;border-color:transparent!important;color:#fff!important;}
.experience-ui .home-offer-grid .home-offer-internet{background:#292825!important;border-color:transparent!important;color:#fff!important;}
.experience-ui .home-offer-grid .home-offer :is(h3,p,b,i,.offer-arrow){color:#fff!important;text-shadow:none!important;}
.experience-ui .home-offer-grid .home-offer p{color:rgba(255,255,255,.83)!important;}
.experience-ui .home-offer-grid .home-offer .offer-number{color:rgba(255,255,255,.8)!important;}
.experience-ui .home-offer-grid .home-offer::after{background-image:none!important;background:none!important;opacity:1!important;inset:auto!important;top:11%!important;right:-8%!important;width:215px!important;height:215px!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:50%!important;filter:none!important;transform:none!important;z-index:0!important;}
.experience-ui .home-offer-grid .home-offer{min-height:245px;box-shadow:0 11px 23px rgba(29,34,39,.15),0 3px 5px rgba(29,34,39,.07)!important;transform-style:preserve-3d;transition:transform .28s ease,box-shadow .28s ease!important;}
@media(hover:hover){.experience-ui .home-offer-grid .home-offer:hover{transform:translateY(-3px)!important;box-shadow:0 23px 40px rgba(29,34,39,.20),0 7px 12px rgba(29,34,39,.08)!important;}}
/* Remove the redundant category chip (e.g. '가입 안내'), keep the actual FAQ question and answer. */
.experience-ui .tools-main .faq-item .faq-category{display:none!important;}
.experience-ui .tools-main .faq-item .faq-answer{display:block!important;padding:0 22px 20px!important;}
/* Staff consultation: deliberately stronger than generic ui-polish/ui-consistency selectors. */
body.experience-ui .consult-workspace{max-width:1200px;padding:38px 22px 70px;}
body.experience-ui .consult-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(315px,.85fr);gap:26px;align-items:start;}
body.experience-ui .consult-form-column{display:grid;gap:18px;min-width:0;}
body.experience-ui .consult-workspace .consult-card{margin:0;padding:clamp(21px,2.2vw,30px);border:1px solid #dce1e7!important;border-radius:19px!important;background:#fff!important;box-shadow:0 10px 26px rgba(31,40,49,.10)!important;}
body.experience-ui .consult-workspace .consult-summary{position:sticky;top:22px;border:1px solid #d9dfe6!important;border-radius:19px!important;background:#fff!important;box-shadow:0 14px 32px rgba(31,40,49,.13)!important;padding:26px!important;}
body.experience-ui .consult-workspace .consult-card-heading{gap:13px;margin-bottom:22px;padding-bottom:17px;border-bottom:1px solid #edf0f3;}
body.experience-ui .consult-workspace .consult-card-heading>span{flex:0 0 35px;height:35px;padding:0;display:grid;place-items:center;background:#fff1e8;border:1px solid #f4d6c5;border-radius:11px;color:#f06b24;font-size:12px;}
body.experience-ui .consult-workspace .consult-card-heading h2{font-size:19px!important;color:#222a33!important;font-weight:750;line-height:1.4;}
body.experience-ui .consult-workspace .consult-card-heading p{margin-top:6px;color:#56616f!important;font-size:13px!important;line-height:1.7;}
body.experience-ui .consult-workspace .consult-fields-grid{gap:18px 15px;}
body.experience-ui .consult-workspace :is(.consult-fields-grid label,.consult-device-select label){color:#354151!important;font-size:13px!important;line-height:1.5;}
body.experience-ui .consult-workspace :is(.consult-search,.consult-fields-grid select,.consult-fields-grid input:not([type=checkbox]),.consult-device-select select){min-height:47px!important;border:1px solid #cbd3dd!important;border-radius:11px!important;background:#fff;color:#242b34;font-size:14px!important;padding:0 13px;}
body.experience-ui .consult-workspace .consult-choice-section{border-top:1px solid #e5e9ee;margin-top:25px;padding-top:23px;}
body.experience-ui .consult-workspace .consult-choice-section h3{font-size:16px;font-weight:750;color:#252e39;}
body.experience-ui .consult-workspace .consult-choice-section>p{font-size:13px;color:#56616f;line-height:1.7;}
body.experience-ui .consult-workspace .consult-device-preview{margin-top:20px;padding:17px;border:1px solid #e1e6ec;border-radius:14px;background:#fafbfc;}
body.experience-ui .consult-workspace .consult-summary h2{font-size:20px!important;color:#232c37!important;font-weight:750;}
body.experience-ui .consult-workspace .consult-summary .consult-monthly{border-radius:14px!important;font-weight:800;}
body.experience-ui .consult-workspace .consult-summary .consult-breakdown{font-size:14px!important;color:#4d5967!important;line-height:1.9;}
body.experience-ui .consult-workspace .consult-progress li{font-size:13px!important;}
@media(max-width:960px){body.experience-ui .consult-layout{grid-template-columns:minmax(0,1fr);}body.experience-ui .consult-workspace .consult-summary{position:static;}}
@media(max-width:600px){body.experience-ui .consult-workspace{padding:22px 14px 46px;}body.experience-ui .consult-workspace .consult-card,body.experience-ui .consult-workspace .consult-summary{padding:18px!important;}body.experience-ui .consult-workspace .consult-card-heading h2{font-size:17px!important;}body.experience-ui .consult-workspace .consult-progress li{font-size:11px!important;}}


/* Unified card lift: one subtle motion, safe breathing room, no clipped top edge. */
.experience-ui :is(.home-shortcuts,.internet-home-shortcuts,.home-offer-grid,.home-guide-steps,.guide-steps,.internet-speed-grid,.product-grid){padding-top:10px!important;padding-bottom:9px!important;overflow:visible!important;}
.experience-ui .home-shortcuts>a,.experience-ui .internet-home-shortcuts>a,.experience-ui .home-guide-steps article,.experience-ui .guide-steps article,.experience-ui .product-card,.experience-ui .home-product-card,.experience-ui .faq-item,.experience-ui .consult-card{
  transform:translateY(0);transform-origin:center center;
  transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease!important;
  will-change:auto;
}
/* Use existing intersection-observer reveal only, not the old second keyframe animation. */
.experience-ui :is(.home-shortcuts>a,.internet-home-shortcuts>a,.home-guide-steps article,.guide-steps article,.product-card,.home-product-card,.faq-item,.consult-card){animation:none!important}
@media(hover:hover) and (pointer:fine){
 .experience-ui :is(.home-shortcuts>a,.internet-home-shortcuts>a,.home-guide-steps article,.guide-steps article,.product-card,.home-product-card,.faq-item,.consult-card):hover{
  transform:translateY(-3px)!important;
  box-shadow:0 16px 34px rgba(28,36,46,.15)!important;
 }
}
/* Prevent the hoverable card from touching clipped track edges. */
.experience-ui .product-carousel-track{padding-top:9px!important;padding-bottom:17px!important;}
@media(max-width:760px){
 .experience-ui :is(.home-shortcuts,.internet-home-shortcuts){overflow-x:auto!important;overflow-y:hidden!important;padding-top:10px!important;padding-bottom:18px!important;}
 .experience-ui .product-carousel-track{overflow-x:auto!important;overflow-y:hidden!important;}
}
/* Increase contrast slightly without changing typography family or weight in buttons. */
.experience-ui :is(.home-shortcuts b,.internet-home-shortcuts b,.home-guide-steps b,.guide-steps b,.product-card h3,.home-product-card h3){color:#222831!important;font-weight:700!important;}
.experience-ui :is(.home-shortcuts small,.internet-home-shortcuts small,.home-guide-steps p,.guide-steps p,.home-product-card p,.product-card p){color:#4d5662!important;font-weight:500;}
.experience-ui .home-guide-heading :is(h2,p),.experience-ui .home-offers .home-section-heading :is(h2,p){color:#222831;}
@media(prefers-reduced-motion:reduce){.experience-ui :is(.home-shortcuts>a,.internet-home-shortcuts>a,.home-guide-steps article,.guide-steps article,.product-card,.home-product-card,.faq-item,.consult-card){transform:none!important;transition:none!important;animation:none!important}.jjs-motion-ready .jjs-reveal{opacity:1!important;translate:none!important}}


/* Shared expandable price panel: staff + public device page, one circular rotating arrow. */
.experience-ui .consult-summary .consult-estimate-kicker{display:block;margin-top:20px;color:#f06b24;font-size:11px;font-weight:750}
.experience-ui .consult-summary .consult-estimate-heading{margin:9px 0 5px;font-size:21px;font-weight:800;color:#202a35}
.experience-ui .consult-summary .consult-estimate-caption{font-size:13px;line-height:1.6;color:#52606e;margin:0 0 13px}
body.experience-ui .consult-workspace .consult-summary .consult-monthly{display:block;margin:12px 0!important;padding:0!important;border:0!important;background:none!important;color:#f06b24!important;font-size:clamp(28px,2.65vw,36px)!important;line-height:1.35}
.experience-ui .consult-summary .consult-estimate-split{display:grid;grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr);align-items:center;gap:5px;padding:15px 10px;border:1px solid #e1e5eb;border-radius:15px;background:#f6f7f9;margin:16px 0 8px}
.experience-ui .consult-estimate-split>div{min-width:0;display:grid;gap:8px}
.experience-ui .consult-estimate-split span{color:#607080;font-size:12px;line-height:1.5}
.experience-ui .consult-estimate-split b{font-size:clamp(15px,1.55vw,19px);font-weight:800;color:#1f2c39;overflow-wrap:anywhere;line-height:1.5}
.experience-ui .consult-estimate-plus{font-size:13px;text-align:center}
.experience-ui .consult-estimate-note{font-size:12px;color:#5d6876;line-height:1.7;margin:10px 0 18px}
.experience-ui .consult-estimate-details{border:1px solid #e1e5eb;border-radius:18px;background:#fff;overflow:hidden;margin:15px 0 20px}
.experience-ui .consult-estimate-details>summary,.experience-ui .estimate-card .estimate-details>summary{display:flex;align-items:center;justify-content:space-between;gap:13px;cursor:pointer;list-style:none;padding:17px 18px}
.experience-ui .consult-estimate-details>summary::-webkit-details-marker,.experience-ui .estimate-card .estimate-details>summary::-webkit-details-marker{display:none}
.experience-ui .consult-estimate-details-copy,.experience-ui .estimate-card .estimate-details-copy{display:grid;gap:5px}
.experience-ui .consult-estimate-details-copy b,.experience-ui .estimate-card .estimate-details-copy b{font-weight:800;font-size:14px;color:#1f2937}
.experience-ui .consult-estimate-details-copy small,.experience-ui .estimate-card .estimate-details-copy small{font-size:12px;color:#647183;line-height:1.5}
.experience-ui .consult-estimate-toggle,.experience-ui .estimate-card .estimate-details-toggle{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border:1px solid #e1e6ec;border-radius:50%;background:#fff;transform:rotate(0deg);transition:transform .32s cubic-bezier(.2,.8,.2,1),background .25s,border-color .25s}
.experience-ui .consult-estimate-toggle::before,.experience-ui .estimate-card .estimate-details-toggle::before{content:"";display:block;width:8px;height:8px;border-right:1.5px solid #df6235;border-bottom:1.5px solid #df6235;transform:translateY(-2px) rotate(45deg)}
.experience-ui .consult-estimate-details[open]>summary .consult-estimate-toggle,.experience-ui .estimate-card .estimate-details[open]>summary .estimate-details-toggle{transform:rotate(180deg)}
.experience-ui .consult-estimate-details-content{padding:0 14px 16px}
.experience-ui .consult-estimate-group{background:#f6f7f9;border:1px solid #e2e6ed;border-radius:15px;padding:16px}
.experience-ui .consult-estimate-group h4{display:flex;align-items:center;gap:10px;color:#24303c;margin:0 0 12px;font-size:14px;font-weight:750}
.experience-ui .consult-estimate-group h4 span{display:grid;place-items:center;width:26px;height:26px;border-radius:9px;background:white;color:#f06b24;font-size:10px}
.experience-ui .consult-estimate-group .consult-breakdown{margin:0;line-height:1.9!important;font-size:13px!important;color:#455365!important;overflow-wrap:anywhere}
.experience-ui .consult-estimate-footnote{font-size:12px;line-height:1.8;color:#5d6a78;margin:14px 3px 0}
@media(max-width:540px){.experience-ui .consult-estimate-split{padding:13px 8px}.experience-ui .consult-estimate-split b{font-size:15px}.experience-ui .consult-estimate-details>summary{padding:15px}}
@media(prefers-reduced-motion:reduce){.experience-ui .consult-estimate-toggle,.experience-ui .estimate-card .estimate-details-toggle{transition:none!important}}

/* Existing general details rotation targeted all summary spans; never rotate the text. */
.experience-ui .estimate-card .estimate-details[open]>summary>.estimate-details-copy{transform:none!important}
.experience-ui .estimate-card .estimate-details[open]>summary>.estimate-details-toggle{transform:rotate(180deg)!important}

/* Itemized staff estimate matches the public two-section breakdown. */
.experience-ui .consult-estimate-details-content{display:grid;gap:13px}
.experience-ui .consult-estimate-rows{display:grid;gap:0}
.experience-ui .consult-estimate-rows>div{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #e2e6ec}
.experience-ui .consult-estimate-rows>div:last-child{border-bottom:0}
.experience-ui .consult-estimate-rows>div>span{flex:1;min-width:0;font-size:13px;line-height:1.6;color:#526070}
.experience-ui .consult-estimate-rows>div>b{text-align:right;font-size:13px;line-height:1.6;color:#202b38;font-weight:750;overflow-wrap:anywhere;max-width:55%}
.experience-ui .consult-estimate-rows>.is-total{margin-top:3px;padding-top:14px;border-top:1px solid #d6dce4}
.experience-ui .consult-estimate-rows>.is-total>b{font-weight:800;color:#172635}
.experience-ui .consult-estimate-rows [id="staffPublicSupport"],.experience-ui .consult-estimate-rows [id="staffExtraSupport"],.experience-ui .consult-estimate-rows [id="staffContractDiscount"],.experience-ui .consult-estimate-rows [id="staffBundleDiscount"],.experience-ui .consult-estimate-rows [id="staffCardDiscount"]{color:#f06b24}

/* One shared card motion for internet and phone detail: same lift, same ease. */
.experience-ui :is(.internet-check-card,.mobile-info-card,.selected-plan-summary,.activation-step,.device-information-details>article){
  position:relative;
  transform:translateY(0);
  transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease!important;
}
/* Breathing room preserves shadows and prevents clipping during hover. */
 .experience-ui :is(.internet-benefits,.mobile-info-grid,.activation-timeline,.device-information-details){
  padding-top:10px!important;
  padding-bottom:11px!important;
  overflow:visible!important;
}
@media(hover:hover) and (pointer:fine){
  .experience-ui :is(.internet-check-card,.mobile-info-card,.selected-plan-summary,.activation-step,.device-information-details>article):hover{
    transform:translateY(-3px)!important;
    box-shadow:0 16px 34px rgba(28,36,46,.15)!important;
    border-color:#d7dce3!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .experience-ui :is(.internet-check-card,.mobile-info-card,.selected-plan-summary,.activation-step,.device-information-details>article){
    transition:none!important;
    transform:none!important;
  }
}
