:root{
  --topco-blue:#0b5fd8;
  --topco-blue-deep:#173f78;
  --topco-cyan:#5fc8ef;
  --topco-orange:#ff6a00;
  --topco-ink:#132139;
  --topco-text:#53647b;
  --topco-muted:#8492a6;
  --topco-line:#dbe6f2;
  --topco-canvas:#f7faff;
  --topco-soft:#f1f6fb;
  --topco-white:#ffffff;
  --topco-shadow:0 24px 60px rgba(26,63,116,.08);
  --topco-shell:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{margin:0;background:#fff;color:var(--topco-ink);font-family:'Pretendard','Apple SD Gothic Neo',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.topco_shell{width:min(calc(100% - 48px),var(--topco-shell));margin-inline:auto}
.topco_skip{position:fixed;top:-80px;left:16px;z-index:9999;padding:10px 14px;border-radius:10px;background:#11233e;color:#fff}
.topco_skip:focus{top:14px}


/* 공용 Pretendard 정의를 사용하며 제목·주요 동작은 700~900, 본문·보조 표기는 400~600으로 구분함 */
h1,h2,h3,h4,h5,h6,strong,b,.fw-bold,.fw-bolder,.topco_eyebrow,.topco_chapterIndex,.topco_navLink,.topco_headerCta,.topco_mobileNav nav a,.topco_button,.topco_textLink,.topco_materialStoryCase>span{font-family:'Pretendard','Apple SD Gothic Neo',sans-serif;font-weight:700}
/* 제목과 강조 단계별 굵기를 900·800·700으로 구분함 */
h1,h2,h3,h4{font-weight:900}
h5,h6{font-weight:800}
strong,b{font-weight:700}
button,input,select,textarea{font-family:inherit}
.topco_eyebrow,.topco_chapterIndex{font-weight:700}

/* Header */
.topco_header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(219,230,242,.9)}
.topco_headerInner{min-height:78px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px}
.topco_brand img{width:142px;height:auto}
.topco_nav{display:flex;justify-content:center;gap:32px}
.topco_navLink{position:relative;padding:28px 0 25px;color:#26364f;font-size:14px;font-weight:700}
.topco_navLink::after{content:"";position:absolute;left:0;right:100%;bottom:18px;height:2px;border-radius:999px;background:var(--topco-blue);transition:right .18s ease}
.topco_navLink:hover::after,.topco_navLink.is-active::after{right:0}
.topco_headerCta{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:0 18px;border-radius:11px;background:var(--topco-blue);color:#fff;font-size:13px;font-weight:700;box-shadow:0 12px 24px rgba(11,95,216,.18)}
.topco_mobileNav{display:none;position:relative}
.topco_mobileNav summary{width:44px;height:44px;display:grid;place-content:center;gap:5px;list-style:none;cursor:pointer}
.topco_mobileNav summary::-webkit-details-marker{display:none}
.topco_mobileNav summary span{width:23px;height:2px;background:#15253d}
.topco_mobileNav nav{position:absolute;right:0;top:50px;min-width:240px;padding:12px;display:grid;border:1px solid var(--topco-line);border-radius:14px;background:#fff;box-shadow:var(--topco-shadow)}
.topco_mobileNav nav a{padding:11px 12px;border-radius:8px;font-weight:700}
.topco_mobileCta{margin-top:6px;background:var(--topco-blue);color:#fff}

/* Typography */
.topco_eyebrow{margin:0 0 11px;color:#7f9abf;font-size:10px;font-weight:700;letter-spacing:.28em;text-transform:uppercase}
.topco_eyebrow--orange{color:var(--topco-orange)}
h1,h2,h3,p{word-break:keep-all}
.topco_sceneHead{max-width:760px;margin-bottom:34px}
.topco_sceneHead--center{max-width:860px;margin-left:auto;margin-right:auto;text-align:center}
.topco_sceneHead h2{margin:0;color:var(--topco-ink);font-size:clamp(34px,3.2vw,52px);line-height:1.14;letter-spacing:-.055em}
.topco_sceneHead p:last-child{margin:10px 0 0;color:#73839a;font-size:15px}

/* Buttons */
.topco_actions{display:flex;gap:11px;flex-wrap:wrap}
.topco_button{display:inline-flex;align-items:center;justify-content:center;min-height:45px;padding:0 18px;border:1px solid transparent;border-radius:11px;font-size:13px;font-weight:700}
.topco_button--primary{background:var(--topco-blue);color:#fff;box-shadow:0 12px 24px rgba(11,95,216,.18)}
.topco_button--ghost{background:#fff;color:var(--topco-blue);border-color:#a9c4ed}
.topco_button--orange{background:var(--topco-orange);color:#fff}
.topco_button--light{background:#fff;color:var(--topco-blue)}

/* Hero */
.topco_hero{overflow:hidden;background:linear-gradient(90deg,#fff 0%,#fbfdff 42%,#eef7ff 100%)}
.topco_heroGrid{display:grid;grid-template-columns:43% 57%;min-height:570px;align-items:stretch}
.topco_heroCopy{align-self:center;padding:70px 16px 70px 4px;position:relative;z-index:2}
.topco_hero h1{margin:0;color:#0e1b31;font-size:clamp(56px,5vw,80px);line-height:1.03;letter-spacing:-.068em}
.topco_heroLead{margin:24px 0 20px;color:#63748b;font-size:18px;line-height:1.7}
.topco_heroProducts{display:flex;gap:28px;margin-bottom:20px}
.topco_heroProducts span{display:grid}
.topco_heroProducts small{font-size:9px;font-weight:600;color:#9baabd;letter-spacing:.14em}
.topco_heroProducts strong{font-size:19px;color:var(--topco-blue)}
.topco_heroProducts .is-orange strong{color:var(--topco-orange)}
.topco_heroStage{position:relative;min-height:570px;background:radial-gradient(circle at 62% 42%,rgba(168,220,255,.28),transparent 38%)}
.topco_filmPlane{position:absolute;border:1px solid rgba(71,164,236,.5);background:linear-gradient(135deg,rgba(255,255,255,.7),rgba(171,219,255,.08));box-shadow:inset 0 0 40px rgba(255,255,255,.25)}
.topco_filmPlane::after{content:"";position:absolute;inset:22px;background-image:radial-gradient(circle at 1px 1px,rgba(88,178,239,.38) 1.2px,transparent 1.4px);background-size:16px 16px}
.topco_filmPlane--back{right:9%;top:12%;width:54%;height:30%;transform:skew(-17deg) rotate(-7deg)}
.topco_filmPlane--front{right:2%;top:27%;width:62%;height:33%;transform:skew(-16deg) rotate(7deg)}
.topco_heroPanel{position:absolute;right:14%;top:23%;width:min(49%,500px);filter:drop-shadow(0 22px 28px rgba(28,77,132,.16))}
.topco_heroRoll{position:absolute;right:4%;bottom:7%;width:min(43%,390px);filter:drop-shadow(0 24px 30px rgba(31,69,112,.17))}

/* Shared scenes */
.topco_scene{padding:82px 0}
.topco_scene--soft{background:var(--topco-canvas)}
.topco_scene--technology{background:#f4f8fc}
.topco_scene--records{background:#f8fbfe}

/* Mosaic */
.topco_mosaic{display:grid;grid-template-columns:1.25fr .75fr .75fr;grid-template-rows:300px 300px;gap:17px}
.topco_mosaicItem{position:relative;overflow:hidden;border-radius:20px;background:#eaf1f8;box-shadow:var(--topco-shadow)}
.topco_mosaicItem img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.topco_mosaicItem:hover img{transform:scale(1.025)}
.topco_mosaicItem::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(6,23,45,.72))}
.topco_mosaicItem span,.topco_mosaicItem strong{position:absolute;left:22px;z-index:2;color:#fff}
.topco_mosaicItem span{bottom:49px;font-size:9px;font-weight:600;letter-spacing:.22em}
.topco_mosaicItem strong{bottom:20px;font-size:19px}
.topco_mosaicItem--hero{grid-row:1/3}
.topco_mosaicItem--wide{grid-column:2/4}

/* Product chapters */
.topco_productChapter{padding:92px 0;background:#fff}
.topco_productChapter--lgp{background:linear-gradient(180deg,#fff,#f5faff)}
.topco_productChapter--bubble{background:linear-gradient(180deg,#fff,#fff9f4)}
.topco_productChapterGrid{display:grid;grid-template-columns:.92fr 1.08fr;gap:66px;align-items:center}
.topco_productChapterGrid--reverse{grid-template-columns:1.08fr .92fr}
.topco_productChapterGrid--reverse .topco_chapterCopy{order:2}
.topco_chapterIndex{display:block;margin-bottom:30px;color:#a1b1c5;font-size:11px;font-weight:700;letter-spacing:.18em}
.topco_chapterCopy h2{margin:0;color:#132139;font-size:clamp(46px,4vw,66px);line-height:1.03;letter-spacing:-.06em}
.topco_chapterCopy>p:not(.topco_eyebrow){margin:20px 0;color:#66778f;font-size:16px}
.topco_dataRow{display:grid;gap:8px;margin:25px 0;color:#506078;font-size:13px}
.topco_dataRow span{padding-top:8px;border-top:1px solid #dce6f1}
.topco_textLink{display:inline-block;color:var(--topco-blue);font-size:14px;font-weight:700}
.topco_textLink--orange{color:var(--topco-orange)}
.topco_chapterMedia{position:relative;overflow:hidden;min-height:500px;border-radius:28px;background:#eaf4ff;box-shadow:var(--topco-shadow)}
.topco_chapterMedia>img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.topco_chapterMedia--bubble{background:linear-gradient(145deg,#fff,#fff1e8)}
.topco_bubblePeel{opacity:.98}
.topco_bubbleRoll{width:44%!important;height:auto!important;left:auto!important;top:auto!important;right:5%!important;bottom:7%!important;border-radius:16px;box-shadow:0 20px 38px rgba(96,62,36,.12)}

/* Tech flow */
.topco_techFlow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.topco_techFlow article{padding:24px;border:1px solid var(--topco-line);border-radius:18px;background:#fff}
.topco_techFlow span{color:#8ba5c7;font-size:10px;font-weight:600}
.topco_techFlow strong{display:block;margin-top:14px;color:var(--topco-blue);font-size:25px}
.topco_techFlow p{margin:6px 0 0;color:#7a899d;font-size:13px}

/* Contact */
.topco_contactScene{padding:0 0 42px}
.topco_contactPanel{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:28px 34px;border-radius:20px;background:linear-gradient(105deg,#0b5fd8,#4ca8fb);color:#fff;box-shadow:0 18px 36px rgba(25,100,216,.18)}
.topco_contactPanel .topco_eyebrow{color:rgba(255,255,255,.72)}
.topco_contactPanel strong{display:block;font-size:25px;letter-spacing:-.03em}
.topco_contactPanel span{display:block;margin-top:4px;font-size:13px;opacity:.88}

/* Sub heroes */
.topco_subHero{padding:70px 0;background:linear-gradient(180deg,#fff,#f4f8fd)}
.topco_subHeroGrid{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.topco_subHero h1,.topco_productHero h1{margin:0;color:#111f36;font-size:clamp(50px,4.7vw,72px);line-height:1.04;letter-spacing:-.06em}
.topco_subHero p:not(.topco_eyebrow),.topco_productHero p:not(.topco_eyebrow){margin:20px 0 0;color:#6b7c94;font-size:16px}
.topco_subHeroMedia{overflow:hidden;border-radius:26px;box-shadow:var(--topco-shadow);background:#eef3f8}
.topco_subHeroMedia img{width:100%;height:390px;object-fit:cover}
.topco_subHero--center{text-align:center}
.topco_subHero--center .topco_shell{max-width:950px}
.topco_subHero--center p:not(.topco_eyebrow){max-width:800px;margin-left:auto;margin-right:auto}

/* Company */
.topco_capabilityGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.topco_capabilityGrid article,.topco_companyPhilosophy article{padding:24px;border:1px solid var(--topco-line);border-radius:18px;background:#fff}
.topco_capabilityGrid span{font-size:10px;color:#90a5c1;font-weight:600}
.topco_capabilityGrid h3,.topco_companyPhilosophy h3{margin:13px 0 7px;font-size:18px}
.topco_capabilityGrid p,.topco_companyPhilosophy p{margin:0;color:#77879c;font-size:13px}
.topco_portfolioGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.topco_portfolioGrid>*{padding:24px;border:1px solid var(--topco-line);border-radius:18px;background:#fff}
.topco_portfolioGrid span{font-size:9px;color:#93a8c4;font-weight:600;letter-spacing:.14em}
.topco_portfolioGrid strong{display:block;margin-top:13px;color:var(--topco-blue);font-size:28px;letter-spacing:-.04em}
.topco_portfolioGrid .is-orange strong{color:var(--topco-orange)}
.topco_portfolioGrid p{margin:7px 0 0;color:#7a899d;font-size:13px}
.topco_companyPhilosophy{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* Product hero */
.topco_productHero{padding:68px 0;background:linear-gradient(180deg,#fff,#eef7ff)}
.topco_productHero--bubble{background:linear-gradient(180deg,#fff,#fff6f0)}
.topco_productHeroGrid{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.topco_productHero figure{margin:0;overflow:hidden;border-radius:26px;background:#fff;box-shadow:var(--topco-shadow)}
.topco_productHero figure img{width:100%;height:430px;object-fit:cover}
.topco_productHero .topco_button{margin-top:24px}

/* LGP */
.topco_lgpMechanism{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.topco_lgpMechanism h2,.topco_processGrid h2,.topco_bubbleDataGrid h2{margin:0;color:#132139;font-size:clamp(38px,3.3vw,54px);line-height:1.08;letter-spacing:-.055em}
.topco_lgpMechanism p:not(.topco_eyebrow){color:#6e7e94}
.topco_mechanismFlow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:14px;align-items:center}
.topco_mechanismFlow span{min-height:140px;display:grid;place-content:center;text-align:center;border:1px solid #cbddef;border-radius:999px;background:#f9fcff}
.topco_mechanismFlow b{color:var(--topco-blue);font-size:20px}
.topco_mechanismFlow small{color:#8797aa}
.topco_mechanismFlow i{font-style:normal;color:#91afd1}
.topco_infoPair{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.topco_infoPanel{padding:28px;border:1px solid var(--topco-line);border-radius:20px;background:#fff}
.topco_infoPanel h3{margin:0;color:#17253c;font-size:26px}
.topco_infoPanel>p:not(.topco_eyebrow){color:#7c8da3}
.topco_colorChips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.topco_colorChips span,.topco_mediaChips span{padding:7px 11px;border-radius:999px;border:1px solid #d6e2ef;background:#fff;font-size:10px;font-weight:600}
.topco_colorChips .red{background:#ef5151;color:#fff;border-color:#ef5151}
.topco_colorChips .yellow{background:#ffd653;border-color:#ffd653}
.topco_colorChips .green{background:#2ca56f;color:#fff;border-color:#2ca56f}
.topco_colorChips .blue{background:#3977d8;color:#fff;border-color:#3977d8}
.topco_steps{list-style:none;margin:0;padding:0}
.topco_steps li{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid #edf2f7}
.topco_steps li:last-child{border-bottom:0}
.topco_steps b{color:#22324a}
.topco_steps span{color:#8090a5;font-size:13px}
.topco_priceGrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.topco_priceGrid article{padding:25px;border:1px solid var(--topco-line);border-radius:18px;background:#fff}
.topco_priceGrid span{font-size:9px;color:#91a6c3;font-weight:600;letter-spacing:.14em}
.topco_priceGrid h3{margin:12px 0 10px;font-size:17px}
.topco_priceGrid strong{display:block;color:var(--topco-blue);font-size:32px}
.topco_priceGrid p{margin:5px 0 0;color:#8594a8;font-size:12px}
.topco_recordGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.topco_recordGrid article{padding:20px;border:1px solid var(--topco-line);border-radius:17px;background:#fff}
.topco_recordGrid span{font-size:10px;color:#8ea7c7;font-weight:600}
.topco_recordGrid strong{display:block;margin-top:10px;font-size:14px}

/* Bubble */
.topco_seriesGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}
.topco_seriesGrid article{padding:26px;border:1px solid #f0dfd1;border-radius:19px;background:#fff}
.topco_seriesGrid span{font-size:10px;color:var(--topco-orange);font-weight:600}
.topco_seriesGrid h3{margin:13px 0 7px;font-size:21px}
.topco_seriesGrid p{margin:0;color:#7a899c;font-size:13px}
.topco_bubbleDataGrid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.topco_mediaChips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.topco_specStack{display:grid;gap:12px}
.topco_specStack>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border:1px solid #dde7f2;border-radius:14px;background:#fff}
.topco_specStack strong{font-size:14px}
.topco_specStack span{color:#7d8da1}
.topco_specStack .is-price{border-color:#f3d7c5;background:#fffaf5}
.topco_specStack .is-price span{color:var(--topco-orange);font-weight:600}
.topco_applicationTypes{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.topco_applicationTypes article{padding:22px;border:1px solid var(--topco-line);border-radius:18px;background:#fff}
.topco_applicationTypes span{font-size:10px;color:#a2b1c3;font-weight:600}
.topco_applicationTypes strong{display:block;margin-top:9px;font-size:18px}
.topco_applicationTypes p{margin:5px 0 0;color:#7d8b9d;font-size:13px}
.topco_processGrid{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.topco_processImage{overflow:hidden;border-radius:24px;background:#fff2e7;box-shadow:var(--topco-shadow)}
.topco_processImage img{width:100%;height:420px;object-fit:cover}
.topco_steps--orange b{color:#33271f}

/* Applications */
.topco_applicationStories{display:grid;gap:26px}
.topco_applicationStories article{display:grid;grid-template-columns:1.08fr .92fr;gap:34px;align-items:center;padding:20px;border:1px solid var(--topco-line);border-radius:22px;background:#fff;box-shadow:var(--topco-shadow)}
.topco_applicationStories article.is-reverse{grid-template-columns:.92fr 1.08fr}
.topco_applicationStories article.is-reverse figure{order:2}
.topco_applicationStories figure{margin:0;overflow:hidden;border-radius:18px;background:#eef3f8}
.topco_applicationStories figure img{width:100%;height:360px;object-fit:cover}
.topco_applicationStories h2{margin:0;color:#15233a;font-size:34px;letter-spacing:-.04em}
.topco_applicationStories p:not(.topco_eyebrow){color:#73839a}
.topco_applicationStories a{color:var(--topco-blue);font-weight:600}
.topco_publishedGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.topco_publishedGrid article{overflow:hidden;border:1px solid var(--topco-line);border-radius:17px;background:#fff}
.topco_publishedGrid img{width:100%;height:150px;object-fit:cover}
.topco_publishedGrid span,.topco_publishedGrid strong{display:block;padding-left:16px;padding-right:16px}
.topco_publishedGrid span{padding-top:13px;color:#93a8c5;font-size:10px;font-weight:600}
.topco_publishedGrid strong{padding-top:5px;padding-bottom:18px;font-size:13px}

/* Footer */
.topco_footer{padding:30px 0 20px;border-top:1px solid #e0e9f3;background:#fff}
.topco_footerTop{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;padding-bottom:22px}
.topco_footerLogo{width:145px;height:auto}
.topco_footerNav{display:flex;flex-wrap:wrap;gap:10px 22px;color:#5e6f86;font-size:12px;font-weight:600}
.topco_footerGrid{display:grid;grid-template-columns:1fr 280px;gap:50px;padding:24px 0;border-top:1px solid #edf2f6}
.topco_footerTitle{display:block;margin-bottom:13px;font-size:16px}
.topco_businessInfo{margin:0;display:grid;grid-template-columns:120px 1fr;gap:5px 12px;color:#6e7d90;font-size:12px}
.topco_businessInfo dt{font-weight:600;color:#40516a}
.topco_businessInfo dd{margin:0}
.topco_customer{display:grid;align-content:start}
.topco_customer>strong{font-size:15px}
.topco_customerPhone{margin-top:4px;color:var(--topco-blue);font-size:25px;font-weight:600}
.topco_customer a:last-child{color:#5d6e84;font-size:13px}
.topco_footerBottom{padding-top:15px;border-top:1px solid #edf2f6;color:#98a5b6;font-size:11px}

/* Responsive */
@media(max-width:1040px){
  .topco_nav,.topco_headerCta{display:none}
  .topco_mobileNav{display:block;justify-self:end}
  .topco_headerInner{grid-template-columns:auto 1fr auto}
  .topco_heroGrid,.topco_subHeroGrid,.topco_productHeroGrid,.topco_productChapterGrid,.topco_productChapterGrid--reverse,.topco_lgpMechanism,.topco_bubbleDataGrid,.topco_processGrid{grid-template-columns:1fr}
  .topco_productChapterGrid--reverse .topco_chapterCopy{order:0}
  .topco_heroStage{min-height:430px}
  .topco_mosaic{grid-template-columns:1fr 1fr;grid-template-rows:330px 260px 260px}
  .topco_mosaicItem--hero{grid-column:1/3;grid-row:auto}
  .topco_mosaicItem--wide{grid-column:1/3}
  .topco_techFlow,.topco_capabilityGrid,.topco_portfolioGrid,.topco_applicationTypes,.topco_recordGrid,.topco_publishedGrid{grid-template-columns:1fr 1fr}
  .topco_companyPhilosophy,.topco_seriesGrid{grid-template-columns:1fr}
  .topco_applicationStories article,.topco_applicationStories article.is-reverse{grid-template-columns:1fr}
  .topco_applicationStories article.is-reverse figure{order:0}
  .topco_infoPair{grid-template-columns:1fr}
  .topco_mechanismFlow{grid-template-columns:1fr;max-width:300px}
  .topco_mechanismFlow i{transform:rotate(90deg);text-align:center}
  .topco_contactPanel{align-items:flex-start;flex-direction:column}
}
@media(max-width:680px){
  .topco_shell{width:min(calc(100% - 28px),var(--topco-shell))}
  .topco_brand img{width:122px}
  .topco_heroCopy{padding:50px 0 30px}
  .topco_hero h1,.topco_subHero h1,.topco_productHero h1{font-size:41px}
  .topco_heroLead{font-size:16px}
  .topco_heroProducts{gap:18px}
  .topco_heroStage{min-height:330px}
  .topco_filmPlane--back{right:16%;top:8%;width:62%;height:32%}
  .topco_filmPlane--front{right:4%;top:27%;width:72%;height:35%}
  .topco_heroPanel{right:11%;top:21%;width:58%}
  .topco_heroRoll{right:1%;bottom:3%;width:48%}
  .topco_scene{padding:58px 0}
  .topco_mosaic{grid-template-columns:1fr;grid-template-rows:none}
  .topco_mosaicItem,.topco_mosaicItem--hero,.topco_mosaicItem--wide{grid-column:auto;grid-row:auto;min-height:270px}
  .topco_chapterCopy h2{font-size:42px}
  .topco_chapterMedia{min-height:340px}
  .topco_techFlow,.topco_capabilityGrid,.topco_portfolioGrid,.topco_applicationTypes,.topco_recordGrid,.topco_publishedGrid,.topco_priceGrid{grid-template-columns:1fr}
  .topco_footerTop{align-items:flex-start;flex-direction:column}
  .topco_footerGrid{grid-template-columns:1fr}
  .topco_businessInfo{grid-template-columns:1fr;gap:1px}
  .topco_businessInfo dd{margin-bottom:7px}
  .topco_productHero figure img,.topco_subHeroMedia img,.topco_processImage img{height:300px}
  .topco_applicationStories figure img{height:260px}
}


body.topco_theme01{
  --topco-canvas:#f7faff;
}
.topco_theme01 .topco_hero{background:linear-gradient(90deg,#fff 0%,#fbfdff 43%,#edf6ff 100%)}
.topco_theme01 .topco_scene--applications{background:#fff}
.topco_theme01 .topco_productChapter--lgp{border-top:1px solid #e8f0f8;border-bottom:1px solid #e8f0f8}


/* ============================================================
   v0.8.1 layout correction
   ============================================================ */

/* Published records: low-resolution images are intentionally not rendered.
   Data is preserved as a compact editorial rail. */
.topco_scene--published{
  padding-top:64px;
  padding-bottom:64px;
}
.topco_recordRail{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid var(--topco-line);
  border-bottom:1px solid var(--topco-line);
}
.topco_recordRail article{
  min-width:0;
  display:grid;
  grid-template-columns:34px 1fr;
  gap:12px;
  padding:22px 18px;
  border-right:1px solid var(--topco-line);
}
.topco_recordRail article:last-child{border-right:0}
.topco_recordRail article>span{
  color:#8ba3c2;
  font-size:10px;
  font-weight:600;
}
.topco_recordRail small{
  display:block;
  color:#90a2b9;
  font-size:9px;
  font-weight:600;
  letter-spacing:.10em;
}
.topco_recordRail strong{
  display:block;
  margin-top:8px;
  color:#213149;
  font-size:14px;
  line-height:1.45;
}
.topco_recordRail p{
  margin:7px 0 0;
  color:#8a98aa;
  font-size:11px;
}

/* Application stories: prevent fixed-card whitespace and over-stretching. */
.topco_applicationStories article{
  min-height:0;
  align-items:stretch;
}
.topco_applicationStories figure{
  min-height:0;
  align-self:stretch;
}
.topco_applicationStories figure img{
  height:100%;
  min-height:280px;
  max-height:380px;
}
.topco_applicationStories article>div{
  align-self:center;
  padding:14px 12px;
}

/* ============================================================
   Theme 02 — Premium Material
   A different layout system rather than a recolored Theme 01.
   ============================================================ */
.topco_theme02 .topco_premiumHero{
  background:
    radial-gradient(circle at 80% 24%,rgba(125,205,255,.15),transparent 34%),
    linear-gradient(180deg,#fff 0%,#fafcff 100%);
  padding:74px 0 88px;
  overflow:hidden;
}
.topco_theme02 .topco_premiumHeroGrid{
  display:grid;
  grid-template-columns:.76fr 1.24fr;
  gap:76px;
  align-items:center;
}
.topco_theme02 .topco_premiumHeroCopy h1{
  margin:0;
  color:#0f1d33;
  font-size:clamp(66px,6.2vw,108px);
  line-height:.88;
  letter-spacing:-.072em;
}
.topco_theme02 .topco_premiumHeroCopy h1 em{
  display:block;
  color:#1377ed;
  font-style:normal;
}
.topco_theme02 .topco_premiumHeroCopy>p:not(.topco_eyebrow){
  max-width:500px;
  margin:26px 0 28px;
  color:#74849a;
  font-size:16px;
}
.topco_premiumProductLinks{
  display:flex;
  gap:28px;
  margin-top:28px;
}
.topco_premiumProductLinks a{
  display:grid;
  padding-bottom:7px;
  border-bottom:1px solid #a9c6ea;
}
.topco_premiumProductLinks small{
  color:#93a5bb;
  font-size:9px;
  font-weight:600;
  letter-spacing:.16em;
}
.topco_premiumProductLinks strong{
  margin-top:4px;
  color:var(--topco-blue);
  font-size:18px;
}
.topco_premiumProductLinks .is-orange{
  border-color:#f1bf9d;
}
.topco_premiumProductLinks .is-orange strong{
  color:var(--topco-orange);
}
.topco_premiumHeroVisual{
  position:relative;
  min-height:600px;
}
.topco_premiumHeroMain{
  position:absolute;
  inset:0 6% 5% 0;
  margin:0;
  overflow:hidden;
  border-radius:34px;
  background:#eef5fb;
}
.topco_premiumHeroMain img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.topco_premiumHeroInset{
  position:absolute;
  right:0;
  bottom:0;
  width:41%;
  margin:0;
  overflow:hidden;
  border:14px solid #fff;
  border-radius:28px;
  background:#fff8f2;
  box-shadow:0 26px 54px rgba(35,62,99,.11);
}
.topco_premiumHeroInset img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}

.topco_materialIntro{
  padding:110px 0 46px;
  background:#fff;
}
.topco_materialIntro h2{
  max-width:900px;
  margin:0;
  color:#142139;
  font-size:clamp(42px,4vw,68px);
  line-height:1.05;
  letter-spacing:-.06em;
}
.topco_materialStory{
  padding:54px 0 110px;
  background:#fff;
}
.topco_materialStory--warm{
  padding-top:110px;
  background:#fffdf9;
}
.topco_materialStoryGrid{
  display:grid;
  grid-template-columns:1.18fr .82fr;
  gap:74px;
  align-items:center;
}
.topco_materialStoryGrid--reverse{
  grid-template-columns:.82fr 1.18fr;
}
.topco_materialStoryGrid--reverse figure{order:2}
.topco_materialStory figure{
  margin:0;
  overflow:hidden;
  border-radius:30px;
  background:#eff5fa;
}
.topco_materialStory figure img{
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
}
.topco_materialStory span{
  color:#9aacc1;
  font-size:10px;
  font-weight:600;
  letter-spacing:.18em;
}
.topco_materialStory h2{
  margin:18px 0 16px;
  color:#132138;
  font-size:clamp(42px,4vw,64px);
  line-height:1.02;
  letter-spacing:-.06em;
}
.topco_materialStory p{
  margin:0;
  color:#74849a;
  font-size:15px;
}
.topco_materialStory a{
  display:inline-block;
  margin-top:26px;
  color:var(--topco-blue);
  font-weight:600;
}
.topco_materialStory--warm a{color:var(--topco-orange)}

.topco_premiumApplications{
  padding:110px 0;
  background:#f5f8fb;
}
.topco_premiumApplications header{
  display:grid;
  grid-template-columns:.5fr 1.5fr;
  gap:40px;
  align-items:end;
  margin-bottom:38px;
}
.topco_premiumApplications h2{
  margin:0;
  color:#15243b;
  font-size:clamp(38px,3.4vw,56px);
  letter-spacing:-.05em;
}
.topco_premiumApplicationGrid{
  display:grid;
  grid-template-columns:1.2fr .9fr .9fr;
  gap:20px;
}
.topco_premiumApplicationGrid a{
  position:relative;
  min-height:420px;
  overflow:hidden;
  border-radius:26px;
  background:#eaf0f6;
}
.topco_premiumApplicationGrid img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.topco_premiumApplicationGrid a::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 58%,rgba(8,25,48,.63));
}
.topco_premiumApplicationGrid span{
  position:absolute;
  z-index:2;
  left:22px;
  bottom:20px;
  color:#fff;
  font-size:11px;
  font-weight:600;
  letter-spacing:.14em;
}

.topco_premiumTechnology{
  padding:120px 0;
  background:#fff;
}
.topco_premiumTechnologyGrid{
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:92px;
  align-items:start;
}
.topco_premiumTechnology h2{
  margin:0;
  color:#142139;
  font-size:clamp(50px,4.6vw,78px);
  line-height:.95;
  letter-spacing:-.06em;
}
.topco_premiumTechnology dl{
  margin:0;
  border-top:1px solid #dbe5ef;
}
.topco_premiumTechnology dl>div{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:20px;
  padding:20px 0;
  border-bottom:1px solid #dbe5ef;
}
.topco_premiumTechnology dt{
  color:#94a7be;
  font-size:11px;
  font-weight:600;
}
.topco_premiumTechnology dd{
  margin:0;
}
.topco_premiumTechnology dd strong{
  display:block;
  color:#1c2c44;
  font-size:20px;
}
.topco_premiumTechnology dd span{
  display:block;
  margin-top:3px;
  color:#8090a4;
  font-size:13px;
}

.topco_premiumContact{
  padding:0 0 50px;
  background:#fff;
}
.topco_premiumContact>.topco_shell{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:34px 38px;
  border:1px solid #d8e5f4;
  border-radius:24px;
  background:#edf5ff;
}
.topco_premiumContact strong{
  display:block;
  color:#244b78;
  font-size:25px;
}
.topco_premiumContact span{
  display:block;
  margin-top:5px;
  color:#7489a2;
  font-size:13px;
}

/* Theme 02 subpages: bigger whitespace and fewer card-like boxes */
.topco_theme02 .topco_subHero,
.topco_theme02 .topco_productHero{
  padding-top:92px;
  padding-bottom:96px;
}
.topco_theme02 .topco_subHeroGrid,
.topco_theme02 .topco_productHeroGrid{
  grid-template-columns:.78fr 1.22fr;
  gap:78px;
}
.topco_theme02 .topco_subHeroMedia,
.topco_theme02 .topco_productHero figure{
  border-radius:32px;
  box-shadow:none;
}
.topco_theme02 .topco_capabilityGrid{
  grid-template-columns:1.35fr .65fr .65fr 1.35fr;
}
.topco_theme02 .topco_capabilityGrid article{
  box-shadow:none;
  border-radius:22px;
}
.topco_theme02 .topco_portfolioGrid{
  gap:24px;
}
.topco_theme02 .topco_portfolioGrid>*{
  min-height:220px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  box-shadow:none;
  border-radius:24px;
}
.topco_theme02 .topco_infoPanel{
  box-shadow:none;
  border-radius:24px;
}
.topco_theme02 .topco_seriesGrid article{
  min-height:210px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  border-radius:24px;
}
.topco_theme02 .topco_applicationTypes article{
  box-shadow:none;
  border-radius:24px;
  min-height:190px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

/* responsive */
@media(max-width:1040px){
  .topco_theme02 .topco_premiumHeroGrid,
  .topco_materialStoryGrid,
  .topco_materialStoryGrid--reverse,
  .topco_premiumTechnologyGrid{
    grid-template-columns:1fr;
  }
  .topco_materialStoryGrid--reverse figure{order:0}
  .topco_premiumHeroVisual{min-height:520px}
  .topco_premiumApplications header{grid-template-columns:1fr}
  .topco_premiumApplicationGrid{grid-template-columns:1fr 1fr}
  .topco_premiumApplicationGrid a:first-child{grid-column:1/3}
  .topco_theme02 .topco_subHeroGrid,
  .topco_theme02 .topco_productHeroGrid{grid-template-columns:1fr}
  .topco_theme02 .topco_capabilityGrid{grid-template-columns:1fr 1fr}
  .topco_recordRail{grid-template-columns:1fr 1fr}
  .topco_recordRail article:nth-child(2){border-right:0}
}
@media(max-width:680px){
  .topco_theme02 .topco_premiumHero{padding-top:52px}
  .topco_theme02 .topco_premiumHeroCopy h1{font-size:52px}
  .topco_premiumHeroVisual{min-height:360px}
  .topco_premiumHeroMain{right:0}
  .topco_premiumHeroInset{width:46%;border-width:8px}
  .topco_premiumProductLinks{flex-direction:column;gap:12px}
  .topco_materialIntro{padding-top:72px}
  .topco_materialStory,
  .topco_materialStory--warm{padding-top:40px;padding-bottom:72px}
  .topco_materialStory h2{font-size:40px}
  .topco_premiumApplicationGrid{grid-template-columns:1fr}
  .topco_premiumApplicationGrid a,
  .topco_premiumApplicationGrid a:first-child{grid-column:auto;min-height:290px}
  .topco_premiumTechnology{padding:80px 0}
  .topco_premiumContact>.topco_shell{align-items:flex-start;flex-direction:column}
  .topco_recordRail{grid-template-columns:1fr}
  .topco_recordRail article{border-right:0;border-bottom:1px solid var(--topco-line)}
  .topco_recordRail article:last-child{border-bottom:0}
}


/* =============================================================
   v0.8.4 — density / application-case restoration
   ============================================================= */
.topco_scene{padding:66px 0}
.topco_productChapter{padding:76px 0}
.topco_contactScene{padding-bottom:34px}
.topco_subHero{padding:58px 0}
.topco_productHero{padding:58px 0}

/* Application stories: photo is flush to the card edge; copy owns its own padding. */
.topco_applicationStories{gap:20px}
.topco_applicationStories article,
.topco_applicationStories article.is-reverse{
  gap:0;
  padding:0;
  overflow:hidden;
  align-items:stretch;
}
.topco_applicationStories figure{
  border-radius:0;
  min-height:300px;
  align-self:stretch;
}
.topco_applicationStories figure img{
  width:100%;
  height:100%;
  min-height:300px;
  max-height:380px;
  object-fit:cover;
}
.topco_applicationStories article>div{
  align-self:center;
  padding:32px 34px;
}

/* Restored application cases: no inner blank margin, image fills the whole tile. */
.topco_scene--cases{background:#f7faff}
.topco_caseGallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.topco_caseGallery article{
  position:relative;
  overflow:hidden;
  aspect-ratio:16/9;
  border-radius:20px;
  background:#dfe8f3;
  box-shadow:0 16px 38px rgba(28,65,116,.08);
}
.topco_caseGallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.003);
}
.topco_caseGallery article::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 54%,rgba(5,19,39,.78));
  pointer-events:none;
}
.topco_caseGallery article>div{
  position:absolute;
  z-index:2;
  left:22px;
  right:22px;
  bottom:19px;
  color:#fff;
}
.topco_caseGallery small{
  display:block;
  margin-bottom:5px;
  color:rgba(255,255,255,.72);
  font-size:9px;
  font-weight:600;
  letter-spacing:.15em;
}
.topco_caseGallery strong{
  display:block;
  font-size:17px;
  line-height:1.35;
}

/* 02 remains Premium Material, but removes excessive air between scenes. */
.topco_theme02 .topco_premiumHero{padding:58px 0 68px}
.topco_theme02 .topco_premiumHeroVisual{min-height:520px}
.topco_materialIntro{padding:76px 0 26px}
.topco_materialStory{padding:34px 0 76px}
.topco_materialStory--warm{padding:76px 0}
.topco_premiumApplications{padding:78px 0}
.topco_premiumTechnology{padding:84px 0}
.topco_theme02 .topco_subHero,
.topco_theme02 .topco_productHero{padding-top:66px;padding-bottom:70px}
.topco_theme02 .topco_scene{padding-top:68px;padding-bottom:68px}

/* Theme 02 case gallery has a broader editorial composition. */
.topco_theme02 .topco_caseGallery{
  grid-template-columns:1.12fr .88fr;
  gap:22px;
}
.topco_theme02 .topco_caseGallery article:nth-child(1),
.topco_theme02 .topco_caseGallery article:nth-child(4){aspect-ratio:16/8.5}
.topco_theme02 .topco_caseGallery article:nth-child(2),
.topco_theme02 .topco_caseGallery article:nth-child(3){aspect-ratio:16/10}

@media(max-width:1040px){
  .topco_caseGallery,.topco_theme02 .topco_caseGallery{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .topco_scene{padding:50px 0}
  .topco_applicationStories article>div{padding:24px 22px}
  .topco_caseGallery,.topco_theme02 .topco_caseGallery{grid-template-columns:1fr}
  .topco_caseGallery article,.topco_theme02 .topco_caseGallery article{aspect-ratio:16/10!important}
  .topco_theme02 .topco_premiumHero{padding:46px 0 56px}
  .topco_materialIntro{padding-top:62px}
  .topco_materialStory,.topco_materialStory--warm{padding:30px 0 58px}
}


/* ============================================================
   v0.9.1 official-case rebuild + vanilla motion
   ============================================================ */
.topco_js [data-topco-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.topco_js [data-topco-reveal].is-visible{opacity:1;transform:none}
.topco_reducedMotion [data-topco-reveal]{opacity:1!important;transform:none!important;transition:none!important}
[data-topco-tilt]{transform:perspective(1200px) rotateX(var(--topco-tilt-x,0deg)) rotateY(var(--topco-tilt-y,0deg));transition:transform .18s ease}
.topco_heroStage--photo{position:relative;overflow:hidden;min-height:560px;border-radius:34px;background:#e9f2fb;box-shadow:0 34px 90px rgba(23,63,120,.16)}
.topco_heroPhoto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.topco_heroStage--photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(8,27,54,.62))}
.topco_heroProof{position:absolute;z-index:2;left:28px;right:28px;bottom:26px;color:#fff}
.topco_heroProof small{display:block;margin-bottom:5px;font-size:9px;font-weight:600;letter-spacing:.2em;opacity:.72}
.topco_heroProof strong{font-size:21px}
.topco_homeCaseTeaser{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:260px 260px;gap:16px}
.topco_homeCaseTeaser a{position:relative;overflow:hidden;border-radius:22px;background:#eaf1f8;box-shadow:var(--topco-shadow)}
.topco_homeCaseTeaser .is-lead{grid-row:1/3}
.topco_homeCaseTeaser img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.topco_homeCaseTeaser a:hover img{transform:scale(1.025)}
.topco_homeCaseTeaser a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(4,20,42,.68))}
.topco_homeCaseTeaser span{position:absolute;z-index:2;left:20px;bottom:18px;color:#fff;font-size:16px;font-weight:600}
.topco_featureCaseGrid{display:grid;grid-template-columns:1.18fr .82fr;grid-template-rows:280px 280px 260px;gap:18px;margin-top:34px}
.topco_featureCase{position:relative;overflow:hidden;border-radius:24px;background:#eaf1f8;box-shadow:var(--topco-shadow);min-width:0}
.topco_featureCase--lead{grid-row:1/3}
.topco_featureCase--wide{grid-column:1/3}
.topco_featureCase img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.topco_featureCase:hover img{transform:scale(1.02)}
.topco_featureCase::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(4,20,42,.76))}
.topco_featureCase>div{position:absolute;z-index:2;left:22px;right:22px;bottom:20px;color:#fff}
.topco_featureCase small{display:block;font-size:9px;font-weight:600;letter-spacing:.18em;opacity:.75}
.topco_featureCase strong{display:block;margin-top:5px;font-size:21px;line-height:1.3}
.topco_featureCase p{margin:7px 0 0;max-width:430px;font-size:12px;opacity:.82}
.topco_scene--shield{padding-top:54px;background:#f7f9fc}
.topco_sceneHead--compact h2{font-size:clamp(34px,3vw,46px)}
.topco_shieldCaseGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:28px}
.topco_shieldCaseGrid article{overflow:hidden;padding-bottom:18px;border:1px solid #e1e8f0;border-radius:16px;background:#fff}
.topco_caseMedia{position:relative;height:145px;background:linear-gradient(135deg,#eff4f9,#e6edf5);overflow:hidden}
.topco_caseMedia img{width:100%;height:100%;object-fit:cover}
.topco_shieldCaseGrid small,.topco_shieldCaseGrid strong,.topco_shieldCaseGrid span{display:block;padding-inline:15px}
.topco_shieldCaseGrid small{padding-top:13px;color:#7793b5;font-size:8px;font-weight:600;letter-spacing:.16em}
.topco_shieldCaseGrid strong{margin-top:5px;font-size:14px}
.topco_shieldCaseGrid span{margin-top:4px;color:#7c899a;font-size:11px}

@media(max-width:1040px){.topco_featureCaseGrid{grid-template-columns:1fr 1fr;grid-template-rows:360px 250px 250px}.topco_featureCase--lead{grid-column:1/3;grid-row:auto}.topco_featureCase--wide{grid-column:1/3}.topco_shieldCaseGrid{grid-template-columns:1fr 1fr}.topco_homeCaseTeaser{grid-template-columns:1fr 1fr;grid-template-rows:340px 240px}.topco_homeCaseTeaser .is-lead{grid-column:1/3;grid-row:auto}}
@media(max-width:680px){.topco_heroStage--photo{min-height:390px}.topco_featureCaseGrid{grid-template-columns:1fr;grid-template-rows:none}.topco_featureCase,.topco_featureCase--lead,.topco_featureCase--wide{grid-column:auto;grid-row:auto;min-height:280px}.topco_shieldCaseGrid{grid-template-columns:1fr 1fr;gap:10px}.topco_caseMedia{height:118px}.topco_homeCaseTeaser{grid-template-columns:1fr;grid-template-rows:none}.topco_homeCaseTeaser .is-lead{grid-column:auto;min-height:330px}.topco_homeCaseTeaser a{min-height:240px}}


/* ============================================================
   v0.9.1 — official case modal + resilient official-image state
   ============================================================ */
[data-topco-case],[data-topco-official-media]{position:relative}
.topco_caseOpen{position:absolute;z-index:5;inset:0;border-radius:inherit;cursor:pointer}
.topco_caseOpen:focus-visible{outline:3px solid #0b72ff;outline-offset:-5px}
.topco_featureCase,.topco_shieldCaseGrid article,.topco_homeCaseTeaser a,.topco_premiumApplicationGrid a{cursor:pointer}
.topco_featureCase::before,.topco_shieldCaseGrid article::before,.topco_homeCaseTeaser a::before,.topco_premiumApplicationGrid a::before{content:"";position:absolute;z-index:4;inset:auto 14px 14px auto;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.9) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2313233a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/15px no-repeat;box-shadow:0 8px 24px rgba(10,29,54,.16);opacity:0;transform:translateY(5px);transition:opacity .22s ease,transform .22s ease}
.topco_featureCase:hover::before,.topco_shieldCaseGrid article:hover::before,.topco_homeCaseTeaser a:hover::before,.topco_premiumApplicationGrid a:hover::before{opacity:1;transform:none}
.topco_homeCaseTeaser span small,.topco_premiumApplicationGrid span small{display:block;margin-top:4px;font-size:9px;font-weight:600;letter-spacing:.03em;opacity:.72}
.topco_heroProof a{display:inline-flex;margin-top:12px;padding:8px 12px;border:1px solid rgba(255,255,255,.38);border-radius:999px;color:#fff;font-size:11px;font-weight:600}

/* 공식 이미지 오류 시 엉뚱한 대체사진을 쓰지 않고 카드 자체의 정보만 남김. */
.is-image-unavailable{background:linear-gradient(135deg,#edf3f9,#dfe9f3)!important}
.is-image-unavailable::after{content:"공식 시공 이미지";position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);color:#8a9aad;font-size:10px;font-weight:600;letter-spacing:.12em;white-space:nowrap}
.topco_featureCase.is-image-unavailable::after{background:none;inset:auto;left:50%;top:50%;right:auto;bottom:auto;color:#70839a}
.topco_caseMedia.is-image-unavailable::after{content:"공식 시공 이미지"}

.topco_caseDialog{width:min(1040px,calc(100vw - 36px));max-height:min(760px,calc(100vh - 36px));padding:0;border:0;border-radius:28px;background:#fff;color:#15233a;box-shadow:0 38px 110px rgba(5,24,48,.32);overflow:auto}
.topco_caseDialog::backdrop{background:rgba(7,20,38,.68);backdrop-filter:blur(7px)}
.topco_caseDialog[open]{animation:topcoDialogIn .28s cubic-bezier(.2,.75,.25,1)}
.topco_caseDialog[open]::backdrop{animation:topcoBackdropIn .22s ease}
@keyframes topcoDialogIn{from{opacity:0;transform:translateY(18px) scale(.975)}to{opacity:1;transform:none}}
@keyframes topcoBackdropIn{from{opacity:0}to{opacity:1}}
.topco_caseDialogClose{position:sticky;z-index:5;top:18px;float:right;margin:18px 18px -58px 0;width:40px;height:40px;border:1px solid rgba(14,34,60,.1);border-radius:50%;background:rgba(255,255,255,.93);color:#24344a;font-size:26px;line-height:1;cursor:pointer;box-shadow:0 8px 26px rgba(11,31,57,.12)}
.topco_caseDialogGrid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);min-height:560px}
.topco_caseDialogGrid figure{position:relative;min-height:560px;margin:0;background:#eaf0f6;overflow:hidden}
.topco_caseDialogGrid figure img{width:100%;height:100%;object-fit:contain}
.topco_caseDialogCopy{padding:68px 52px 46px;align-self:center}
.topco_caseDialogCopy h2{margin:0;font-size:clamp(34px,4vw,52px);line-height:1.06;letter-spacing:-.045em}
.topco_caseDialogLead{margin:22px 0 26px;color:#64758a;font-size:15px;line-height:1.85}
.topco_caseDialogCopy dl{display:grid;gap:0;margin:0;border-top:1px solid #e5ebf1}
.topco_caseDialogCopy dl div{display:grid;grid-template-columns:92px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid #e5ebf1}
.topco_caseDialogCopy dt{color:#8a9aab;font-size:11px;font-weight:600}
.topco_caseDialogCopy dd{margin:0;color:#2b3b50;font-size:13px;font-weight:600}
.topco_caseDialogActions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.topco_caseDialogActions .topco_button{min-height:42px;padding:0 17px;font-size:12px}
.topco_caseDialog figure.is-image-unavailable::after{content:"공식 시공 이미지 연결을 확인해 주세요";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#75879b;font-size:12px;font-weight:600;white-space:nowrap}
@media(max-width:760px){.topco_caseDialog{width:min(94vw,620px);border-radius:22px}.topco_caseDialogGrid{grid-template-columns:1fr;min-height:0}.topco_caseDialogGrid figure{min-height:260px;max-height:42vh}.topco_caseDialogCopy{padding:34px 24px 30px}.topco_caseDialogCopy dl div{grid-template-columns:78px 1fr}.topco_caseDialogClose{top:12px;margin:12px 12px -52px 0}.topco_featureCase::before,.topco_shieldCaseGrid article::before,.topco_homeCaseTeaser a::before,.topco_premiumApplicationGrid a::before{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.topco_caseDialog[open],.topco_caseDialog[open]::backdrop{animation:none}}

/* ============================================================
   v0.9.1 final — official 8-case rail / modal / local-first images
   ============================================================ */
.topco_dialogOpen{overflow:hidden}
.topco_homeShieldRailWrap{margin-top:34px;padding-top:26px;border-top:1px solid rgba(117,143,172,.2)}
.topco_homeShieldRailHead{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:14px}
.topco_homeShieldRailHead h3{margin:3px 0 0;font-size:clamp(20px,2vw,28px);letter-spacing:-.03em}
.topco_homeShieldRailHead>a{color:#55718f;font-size:11px;font-weight:600;white-space:nowrap}
.topco_homeShieldRail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.topco_homeShieldRail>a{position:relative;display:grid;grid-template-columns:88px 1fr;min-height:92px;overflow:hidden;border:1px solid #e2e9f0;border-radius:14px;background:#fff;color:#1e3047;box-shadow:0 8px 26px rgba(21,48,81,.055)}
.topco_homeShieldRail>a>img{width:88px;height:100%;min-height:92px;object-fit:cover;background:#edf3f8}
.topco_homeShieldRail>a>span{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:12px}
.topco_homeShieldRail>a small{color:#7690ad;font-size:7px;font-weight:600;letter-spacing:.14em}
.topco_homeShieldRail>a strong{margin-top:4px;font-size:12px;line-height:1.25}
.topco_homeShieldRail>a em{margin-top:4px;overflow:hidden;color:#7c8997;font-size:9px;font-style:normal;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
.topco_homeShieldRail>a::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 68%,rgba(11,95,216,.035));pointer-events:none}
.topco_homeShieldRail>a:hover{transform:translateY(-2px);border-color:#c9d8e9;box-shadow:0 13px 32px rgba(21,48,81,.09)}
.topco_materialStoryCase{position:relative;display:block;color:inherit;overflow:hidden;border-radius:24px}
.topco_materialStoryCase figure{height:100%;margin:0}
.topco_materialStoryCase>span{position:absolute;left:18px;bottom:18px;z-index:2;padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.92);color:#23384f;font-size:10px;font-weight:700;box-shadow:0 8px 26px rgba(10,31,55,.14)}
.topco_materialStoryCase::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(3,20,38,.28));pointer-events:none}

/* 모달은 게시판의 여러 장이 합성된 공식 사례 원본 전체를 보여 주므로 crop하지 않음. */
.topco_caseDialogGrid figure{display:flex;align-items:center;justify-content:center;padding:18px;background:#e8eef4}
.topco_caseDialogGrid figure img{width:100%;height:100%;max-height:690px;object-fit:contain;background:#fff}
.topco_caseDialogCopy dl div{grid-template-columns:100px 1fr}

/* 공식 원본을 모두 실패한 경우에만 중립 상태를 표시하며 다른 사진을 끼워 넣지 않음. */
.is-image-unavailable{background:linear-gradient(135deg,#edf3f9,#dfe9f3)!important}
.is-image-unavailable::after{content:"공식 시공 이미지 연결 확인 필요";position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);color:#7f91a5;font-size:10px;font-weight:600;letter-spacing:.05em;white-space:nowrap}

@media(max-width:980px){.topco_homeShieldRail{grid-template-columns:1fr 1fr}.topco_homeShieldRail>a{grid-template-columns:102px 1fr}.topco_homeShieldRail>a>img{width:102px}}
@media(max-width:680px){.topco_homeShieldRailHead{align-items:flex-start;flex-direction:column;gap:7px}.topco_homeShieldRail{grid-template-columns:1fr}.topco_homeShieldRail>a{grid-template-columns:104px 1fr}.topco_homeShieldRail>a>img{width:104px}.topco_caseDialogGrid figure{padding:10px;min-height:240px}.topco_caseDialogGrid figure img{max-height:48vh}}


/* v0.9.1 dedicated brand hero — not an application-case reuse */
.topco_heroStage--brand{position:relative;overflow:hidden;min-height:570px;border-radius:34px;background:#eef5fb;box-shadow:0 34px 90px rgba(23,63,120,.13);transform:perspective(1200px) rotateX(var(--topco-tilt-x,0deg)) rotateY(var(--topco-tilt-y,0deg));transition:transform .24s ease,box-shadow .3s ease}
.topco_heroBrandVisual{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.topco_heroStage--brand::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(12,34,62,.22));pointer-events:none}
.topco_brandHeroLegend{position:absolute;z-index:2;left:22px;right:22px;bottom:20px;display:flex;gap:8px;justify-content:flex-end;pointer-events:none}
.topco_brandHeroLegend span{display:grid;min-width:150px;padding:11px 14px;border:1px solid rgba(255,255,255,.62);border-radius:13px;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);box-shadow:0 10px 30px rgba(23,48,79,.09)}
.topco_brandHeroLegend small{color:#6f8caa;font-size:8px;font-weight:600;letter-spacing:.16em}
.topco_brandHeroLegend strong{margin-top:2px;color:#126dd8;font-size:13px}
.topco_brandHeroLegend .is-warm strong{color:#d85f12}
.topco_premiumHeroMain--brand{inset:0;margin:0;border-radius:34px;box-shadow:0 26px 70px rgba(35,62,99,.1)}
.topco_premiumHeroMain--brand img{object-position:center center}
.topco_theme02 .topco_premiumHeroVisual{transform:perspective(1400px) rotateX(var(--topco-tilt-x,0deg)) rotateY(var(--topco-tilt-y,0deg));transform-origin:center;transition:transform .28s ease}
.topco_premiumHeroLegend{position:absolute;z-index:3;left:26px;right:26px;bottom:24px;display:flex;gap:10px;justify-content:flex-end;pointer-events:none}
.topco_premiumHeroLegend span{display:grid;min-width:180px;padding:12px 15px;border:1px solid rgba(255,255,255,.7);border-radius:15px;background:rgba(255,255,255,.86);backdrop-filter:blur(14px);box-shadow:0 12px 30px rgba(29,53,86,.1)}
.topco_premiumHeroLegend small{color:#91a1b6;font-size:8px;font-weight:600;letter-spacing:.13em}
.topco_premiumHeroLegend strong{margin-top:2px;color:#1b497f;font-size:14px}
.topco_js img[data-topco-official]{opacity:0;transition:opacity .22s ease}
.topco_js img[data-topco-official].is-topco-image-ready{opacity:1}
.topco_reducedMotion img[data-topco-official]{transition:none}
@media(max-width:1040px){.topco_heroStage--brand{min-height:500px}.topco_brandHeroLegend{justify-content:flex-start}.topco_premiumHeroLegend{left:18px;right:18px;bottom:18px}}
@media(max-width:680px){.topco_heroStage--brand{min-height:390px;border-radius:24px}.topco_brandHeroLegend,.topco_premiumHeroLegend{left:12px;right:12px;bottom:12px;gap:6px}.topco_brandHeroLegend span,.topco_premiumHeroLegend span{min-width:0;flex:1;padding:9px 10px}.topco_brandHeroLegend strong,.topco_premiumHeroLegend strong{font-size:11px}}

/* v0.9.1 buttonless drag/swipe loop carousel for the four official Lumi-Film cases */
.topco_caseCarousel{position:relative;margin:0 -2px 6px;overflow:hidden}
.topco_caseCarouselTrack{display:flex;gap:16px;overflow-x:auto;padding:4px 2px 18px;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-y;scroll-snap-type:x mandatory;cursor:grab;user-select:none;-webkit-user-select:none}
.topco_caseCarouselTrack::-webkit-scrollbar{display:none}
.topco_caseCarouselTrack.is-dragging{cursor:grabbing;scroll-snap-type:none}
.topco_caseCarouselSet{display:flex;flex:0 0 auto;gap:16px}
.topco_caseCarouselCard{position:relative;flex:0 0 clamp(330px,42vw,520px);aspect-ratio:16/10;overflow:hidden;border-radius:22px;background:#e8f0f8;box-shadow:0 18px 50px rgba(27,59,96,.09);scroll-snap-align:center;transform:translateZ(0)}
.topco_caseCarouselCard img{width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.topco_caseCarouselCard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,18,35,.02) 36%,rgba(4,20,42,.72) 100%);pointer-events:none}
.topco_caseCarouselCard>span{position:absolute;z-index:2;left:22px;right:22px;bottom:19px;display:grid;color:#fff;pointer-events:none}
.topco_caseCarouselCard small{font-family:'Pretendard',sans-serif;font-size:8px;font-weight:700;letter-spacing:.08em;opacity:.72}
.topco_caseCarouselCard strong{margin-top:4px;font-size:19px;line-height:1.15}
.topco_caseCarouselCard em{margin-top:5px;font-weight:400;font-family:'Pretendard',sans-serif;font-size:10px;font-style:normal;opacity:.75}
.topco_caseCarouselCard:hover img{transform:scale(1.022)}
.topco_caseCarouselHint{margin:2px 2px 0;color:#91a1b4;font-family:'Pretendard',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-align:right}
@media(max-width:680px){.topco_caseCarouselTrack{gap:10px;padding-bottom:14px}.topco_caseCarouselSet{gap:10px}.topco_caseCarouselCard{flex-basis:82vw;border-radius:18px}.topco_caseCarouselCard>span{left:16px;right:16px;bottom:15px}.topco_caseCarouselCard strong{font-size:16px}}


/* =======================================================================
   TOPCO v0.9.4 | 단일 시안 01 · Light 기본 · Dark 선택 · 스크롤 스토리
   색상은 CSS만으로 전환하며 외부 프레임워크/번들러 없이 동작한다.
   ======================================================================= */
html{color-scheme:light}
html[data-topco-theme="dark"]{color-scheme:dark;--topco-ink:#eef4ff;--topco-canvas:#111b2b}
.topco_themeToggle{justify-self:end;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;gap:0;cursor:pointer;background:#ecf3fa;color:#183350;border:1px solid #d9e4f1;border-radius:50%;font-size:21px;transition:background .25s,color .25s}
.topco_themeToggleMoon{display:none}
html[data-topco-theme="dark"] .topco_themeToggle{background:#253852;color:#f7cc78;border-color:#3d516a}
html[data-topco-theme="dark"] .topco_themeToggleSun{display:none}
html[data-topco-theme="dark"] .topco_themeToggleMoon{display:block}
.topco_headerInner{grid-template-columns:auto 1fr auto auto}
.topco_cinema{background:#090f1b;color:#fff;position:relative}
.topco_cinemaRail{height:330vh;position:relative}
.topco_cinemaSticky{height:100svh;min-height:520px;position:sticky;top:0;overflow:hidden;isolation:isolate}
.topco_cinemaMedia,.topco_cinemaShade{position:absolute;inset:0}
.topco_cinemaFrame{position:absolute;inset:0;opacity:0;transform:scale(1.12);will-change:opacity,transform}
.topco_cinemaFrame img{display:block;width:100%;height:100%;object-fit:cover}
.topco_cinemaFrame--first{opacity:1;transform:scale(1)}
.topco_cinemaShade{background:linear-gradient(90deg,rgba(5,11,22,.87) 0%,rgba(5,11,22,.57) 47%,rgba(5,11,22,.12) 100%);z-index:1}
.topco_cinemaCopy{position:absolute;z-index:2;top:50%;left:max(7vw,24px);width:min(76vw,900px);transform:translateY(-50%)}
.topco_cinemaMessage{position:absolute;top:50%;left:0;width:100%;opacity:0;transform:translateY(25px);pointer-events:none;will-change:opacity,transform}
.topco_cinemaMessage:first-child{opacity:1;transform:translateY(0)}
.topco_cinemaMessage p{margin:0 0 12px;letter-spacing:.24em;font-size:12px;color:#94c9fa;font-weight:700}
.topco_cinemaMessage h2{font-family:'Pretendard',sans-serif;font-size:clamp(40px,5.9vw,92px);line-height:1.13;letter-spacing:-.055em;margin:16px 0 24px;color:white;font-weight:900}
.topco_cinemaMessage span{display:block;font-size:clamp(15px,1.7vw,21px);color:#e0e8f5}
.topco_cinemaMessage a{display:inline-block;margin-top:28px;padding:12px 20px;color:#fff;border:1px solid #b5d1f1;border-radius:999px;pointer-events:auto}
.topco_cinemaProgress{position:absolute;z-index:3;bottom:40px;left:7vw;width:min(340px,60vw);height:2px;background:rgba(255,255,255,.26)}
.topco_cinemaProgress>span{display:block;background:#e8f4ff;height:100%;width:0}
.topco_cinemaIndex{position:absolute;z-index:3;right:7vw;bottom:31px;color:rgba(255,255,255,.65);font-size:13px;letter-spacing:.15em}
.topco_cinemaIndex b{color:white;font-size:19px}
html[data-topco-theme="dark"] body{background:#0c1421;color:#e9f1fc}
html[data-topco-theme="dark"] .topco_header{background:rgba(13,24,39,.96);border-bottom-color:#273c56}
html[data-topco-theme="dark"] .topco_navLink,html[data-topco-theme="dark"] .topco_mobileNav summary{color:#e4edfa}
html[data-topco-theme="dark"] .topco_hero{background:linear-gradient(100deg,#0b1524,#182a40)}
html[data-topco-theme="dark"] .topco_hero h1,html[data-topco-theme="dark"] .topco_sceneHead h2,html[data-topco-theme="dark"] .topco_chapterCopy h2{color:#f0f5ff}
html[data-topco-theme="dark"] .topco_heroLead,html[data-topco-theme="dark"] .topco_sceneHead p:last-child{color:#aebfd4}
html[data-topco-theme="dark"] .topco_scene,html[data-topco-theme="dark"] .topco_scene--soft,html[data-topco-theme="dark"] .topco_scene--technology,html[data-topco-theme="dark"] .topco_scene--records{background:#111d2e;color:#e9f2ff}
html[data-topco-theme="dark"] .topco_productChapter,html[data-topco-theme="dark"] .topco_productChapter--lgp,html[data-topco-theme="dark"] .topco_productChapter--bubble{background:#101a2a;color:#e9f2ff}
html[data-topco-theme="dark"] .topco_homeShieldRail>a,html[data-topco-theme="dark"] .topco_caseDialog,html[data-topco-theme="dark"] .topco_caseDialogCopy{background:#1b2b40;color:#edf3fb;border-color:#37506d}
html[data-topco-theme="dark"] .topco_homeShieldRail>a strong,html[data-topco-theme="dark"] .topco_caseDialogCopy dd,html[data-topco-theme="dark"] .topco_caseDialogCopy h2{color:#f1f5fa}
html[data-topco-theme="dark"] .topco_footer{background:#0b1523;color:#dce9f7;border-top-color:#30445d}
html[data-topco-theme="dark"] .topco_footer a,html[data-topco-theme="dark"] .topco_footer strong{color:#eef4ff}
html[data-topco-theme="dark"] .topco_caseDialogClose{background:#21354c;color:#fff;border-color:#48617e}
html[data-topco-theme="dark"] .topco_mobileNav nav{background:#152438;color:#edf5ff}
@media(max-width:780px){.topco_headerInner{gap:10px;grid-template-columns:auto 1fr auto auto}.topco_themeToggle{width:36px;height:36px;font-size:18px}.topco_cinemaRail{height:270vh}.topco_cinemaCopy{width:87vw;left:6vw}.topco_cinemaShade{background:linear-gradient(90deg,rgba(4,10,21,.85),rgba(4,10,21,.35))}.topco_cinemaMessage h2{font-size:clamp(34px,9vw,60px)}.topco_cinemaProgress{left:6vw}}
@media(prefers-reduced-motion:reduce){.topco_cinemaRail{height:auto}.topco_cinemaSticky{position:relative;height:80svh}.topco_cinemaFrame:not(:first-child),.topco_cinemaMessage:not(:first-child){display:none}.topco_cinemaFrame,.topco_cinemaMessage{will-change:auto!important}}

/* ============================================================================
 * v0.9.9 — 시안 01 전용 모션·고해상도 공식 사례 뷰어·정식 워드마크
 * 디자인 자산의 원본 픽셀을 교정 없이 사용하고, 스크롤 시 기존 요소에만 변형 적용
 * ============================================================================ */

/* 이모지/폰트 글리프의 기준선 오차를 없애기 위해 고정 좌표계의 SVG를 정중앙 배치 */
.topco_themeToggle {
  appearance:none;-webkit-appearance:none;padding:0;margin:0;
  display:grid;place-items:center;position:relative;flex:none;
  width:42px;height:42px;line-height:0;vertical-align:middle;
  font-size:0;isolation:isolate;box-sizing:border-box;
}
.topco_themeToggle svg {
  display:block;position:absolute;top:50%;left:50%;width:20px;height:20px;
  transform:translate(-50%,-50%);transform-origin:center;
  pointer-events:none;stroke-linecap:round;stroke-linejoin:round;
}
.topco_themeToggle .topco_themeToggleMoon{display:none}
html[data-topco-theme="dark"] .topco_themeToggle .topco_themeToggleSun{display:none}
html[data-topco-theme="dark"] .topco_themeToggle .topco_themeToggleMoon{display:block}
.topco_themeToggle:focus-visible,.topco_showcaseTrack:focus-visible{outline:3px solid #5d9feb;outline-offset:4px}

/* 공식 topco_logo.png의 상단 워드마크를 그대로 자른 픽셀 로고 — 텍스트로 재조판하지 않는다 */
.topco_hero h1{font-size:clamp(45px,4.8vw,72px);line-height:1.075;letter-spacing:-.065em}
.topco_inlineLogo {
  display:inline-flex;align-items:center;justify-content:flex-start;
  width:clamp(155px,3.05em,252px);max-width:100%;margin:.12em 0 .035em;
  vertical-align:middle;white-space:nowrap;
}
.topco_inlineLogo img{display:block;width:100%;height:auto;object-fit:contain;max-width:100%}
html[data-topco-theme="dark"] .topco_inlineLogo {
  background:rgba(248,251,255,.97);border-radius:13px;
  padding:9px 14px;box-shadow:0 14px 36px rgba(0,0,0,.11);
}
.topco_heroCopy{padding-block:72px}
.topco_heroGrid{min-height:650px}
.topco_heroStage--brand{min-height:615px}

/* 문서 전체 탐색 진행도: 레이아웃 재계산을 만들지 않는 transform 기반 표시 */
.topco_pageProgress{pointer-events:none;position:fixed;z-index:1010;top:0;left:0;right:0;height:3px;overflow:hidden}
.topco_pageProgress>span{display:block;height:100%;background:linear-gradient(90deg,#1e6bd3,#5cc7ef);transform:scaleX(0);transform-origin:left center;will-change:transform}

/* 기존 3장 시네마틱 이야기의 fade 중첩과 문장 위치를 바로잡는다 */
.topco_cinema{overflow:clip}
.topco_cinemaSticky{height:100svh;min-height:480px}
.topco_cinemaCopy{height:min(440px,78svh);top:50%;left:max(6vw,24px);max-width:880px;transform:translateY(-50%);display:block}
.topco_cinemaMessage{position:absolute;inset:0;top:0;left:0;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;opacity:0;transform:translateY(28px);transition:none}
.topco_cinemaMessage:first-child{opacity:1;transform:none}
.topco_cinemaMessage p{font-family:'Pretendard',sans-serif;letter-spacing:.19em;font-weight:700}
.topco_cinemaMessage h2{font-size:clamp(44px,6.1vw,88px);margin:13px 0 23px;max-width:930px;line-height:1.12}
.topco_cinemaMessage a{border-color:rgba(255,255,255,.8);background:rgba(255,255,255,.04);backdrop-filter:blur(8px)}
.topco_cinemaMessage a:hover{background:rgba(255,255,255,.16)}
.topco_cinemaFrame{will-change:transform,opacity}

/* 세 장짜리 시네마틱 영상 다음에 움직임의 강약을 달리한 순수 편집 타이포그래피 */
.topco_statement {
  display:grid;align-items:center;min-height:76svh;padding:120px 0 130px;
  background:linear-gradient(180deg,#fff 0%,#f0f5fb 100%);position:relative;overflow:hidden;
}
.topco_statementInner{position:relative;max-width:1100px}
.topco_statement .topco_eyebrow{color:#678daf;margin-bottom:20px}
.topco_statement h2 {
  margin:0;color:#132b48;font-size:clamp(48px,7.5vw,112px);
  line-height:1.17;letter-spacing:-.064em;font-weight:900;
}
.topco_statement h2 span,.topco_statement h2 em{display:inline-block;transition:none;will-change:opacity,transform}
.topco_statement h2 span{color:#2767a7}
.topco_statement h2 em{font-style:normal;color:#064fb6}
.topco_statement p{max-width:660px;margin:27px 0 0;color:#647990;font-size:clamp(15px,1.35vw,19px)}
.topco_statementRule{display:block;margin-top:38px;height:3px;width:var(--topco-statement-width,100%);max-width:620px;background:#1d65bf;border-radius:99px}

/* 사진의 크기만 키운 카드가 아니라, 한 장씩 읽는 수평 하이라이트 레일 */
.topco_showcase {
  position:relative;padding:106px 0 94px;background:#eaf0f8;
  color:#172a40;overflow:hidden;isolation:isolate;
}
.topco_showcase::before {
  content:"";position:absolute;inset:0 0 auto;height:40%;z-index:-1;
  background:radial-gradient(ellipse at 78% 0%,rgba(153,207,242,.44),transparent 54%);
  pointer-events:none;
}
.topco_showcaseHead{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:42px}
.topco_showcaseHead h2{margin:0;color:#102740;line-height:1.11;letter-spacing:-.054em;font-size:clamp(38px,5.4vw,73px)}
.topco_showcaseHead h2 span{color:#1962aa}
.topco_showcaseHead p:not(.topco_eyebrow){font-size:17px;color:#61748b;margin:20px 0 0}
.topco_showcaseHeadAside{display:flex;flex-direction:column;gap:9px;flex:none;padding-bottom:7px;text-align:right;color:#5d7590;font-size:12px}
.topco_showcaseHeadAside span:first-child{font-family:'Pretendard',sans-serif;color:#2866aa;font-size:18px;letter-spacing:.08em;font-weight:700}
.topco_showcaseViewport{width:100%;overflow:hidden;margin:0}
.topco_showcaseTrack {
  position:relative;display:flex;gap:22px;overflow-x:auto;overflow-y:hidden;
  width:100%;padding:8px max(24px,calc((100vw - 1240px)/2)) 26px;
  scroll-padding-inline:max(24px,calc((100vw - 1240px)/2));
  scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;
  touch-action:pan-y;user-select:none;cursor:grab;
}
.topco_showcaseTrack::-webkit-scrollbar{display:none}
.topco_showcaseTrack.is-dragging{cursor:grabbing;scroll-snap-type:none}
.topco_showcaseTrack .topco_caseCarouselSet{gap:22px;align-items:stretch}
.topco_showcaseTrack .topco_caseCarouselCard {
  position:relative;flex:0 0 clamp(510px,70vw,980px);width:clamp(510px,70vw,980px);
  height:clamp(475px,53vw,690px);aspect-ratio:auto;display:grid;
  grid-template-rows:minmax(0,1fr) 145px;
  padding:0;border:1px solid #d5e0ec;border-radius:26px;
  overflow:hidden;isolation:isolate;background:#fff;
  box-shadow:0 20px 48px rgba(19,46,79,.10);
  scroll-snap-align:center;transform:none;
  transition:box-shadow .25s ease,border-color .25s ease;
}
.topco_showcaseTrack .topco_caseCarouselCard::after{display:none}
.topco_showcaseTrack .topco_caseCarouselCard.is-current {
  border-color:rgba(42,103,168,.3);box-shadow:0 28px 75px rgba(19,46,79,.17)
}
.topco_showcaseTrack .topco_showcasePhoto {
  position:relative;display:flex;align-items:center;justify-content:center;
  min-height:0;padding:14px;overflow:hidden;
  background:linear-gradient(145deg,#dfebf7 0%,#f5f8fc 56%,#d9e6f3 100%);
}
.topco_showcaseTrack .topco_showcasePhoto img {
  display:block;width:100%;height:100%;object-fit:contain;object-position:center center;
  pointer-events:none;transform:none;transition:opacity .26s ease;
}
.topco_showcaseTrack .topco_caseCarouselCard:hover .topco_showcasePhoto img{transform:none}
.topco_showcaseTrack .topco_caseCarouselCard.is-image-unavailable .topco_showcasePhoto::before {
  content:"공식 시공사진 연결을 확인하고 있습니다";display:block;position:absolute;
  left:24px;right:24px;top:50%;transform:translateY(-50%);text-align:center;
  color:#61748c;font-size:14px;font-weight:400;font-family:'Pretendard',sans-serif;
}
.topco_showcaseNumber {
  position:absolute;top:22px;left:22px;z-index:2;
  padding:8px 13px;background:rgba(255,255,255,.93);border:1px solid rgba(203,216,233,.8);
  color:#284e7d;border-radius:99px;letter-spacing:.07em;font:700 12px 'Pretendard',sans-serif;
}
.topco_showcaseCaption {
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  min-width:0;padding:24px 32px 26px;background:#fff;color:#1a314c;
}
.topco_showcaseCaption>span:first-child{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.topco_showcaseCaption small{font:700 11px 'Pretendard',sans-serif;letter-spacing:.14em;color:#4d81b9}
.topco_showcaseCaption strong{margin-top:6px;font:700 clamp(21px,2.4vw,32px)/1.2 'Pretendard',sans-serif;letter-spacing:-.045em}
.topco_showcaseDetail{display:block;margin-top:8px;color:#7a8a9c;font-size:13px}
.topco_showcaseOpen {
  display:grid;place-items:center;flex:none;width:51px;height:51px;
  background:#ecf3fa;color:#1f65aa;border-radius:100%;font-size:24px;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.topco_caseCarouselCard:hover .topco_showcaseOpen{background:#1363bc;color:#fff;transform:translate(2px,-2px)}
.topco_showcaseNavigation {display:flex;align-items:center;gap:20px;margin-top:15px}
.topco_showcaseCounter{display:flex;align-items:baseline;flex:none;color:#8191a2;font:700 14px 'Pretendard',sans-serif}
.topco_showcaseCounter strong{font-size:31px;color:#1456a1}
.topco_showcaseProgress{height:3px;flex:1;background:#cbd8e6;overflow:hidden;border-radius:99px}
.topco_showcaseProgress>span{display:block;width:25%;height:100%;background:#2068b7;transition:width .35s ease}
.topco_showcaseGesture{font:700 10px 'Pretendard',sans-serif;color:#6a86a5;letter-spacing:.15em}
.topco_showcaseUnder{padding-top:56px}
.topco_showcaseLead{display:flex;align-items:center;justify-content:space-between;gap:22px;padding-bottom:32px;border-bottom:1px solid #cbd7e4}
.topco_showcaseLead .topco_eyebrow{margin:0;flex:none}
.topco_showcaseLead>p:not(.topco_eyebrow){margin:0;color:#5a6e85;font-size:13px}
.topco_showcaseLead>p strong{font-family:'Pretendard',sans-serif;color:#26486c;font-weight:700}
.topco_showcaseLead>a{flex:none;color:#1155a4;font-family:'Pretendard',sans-serif;font-weight:700;font-size:13px}
.topco_showcase .topco_homeShieldRailWrap{margin-top:35px;padding-top:0;border:0}
.topco_showcase .topco_homeShieldRailHead h3{font-size:24px;color:#273e56}
.topco_showcase .topco_homeShieldRail>a{box-shadow:0 8px 20px rgba(15,46,85,.045)}

/* 제품 챕터 — 이미지 리빌과 레이어 미세 시차, 스크롤의 진행도에 연동 */
.topco_productChapter{overflow:hidden;position:relative}
.topco_productChapter .topco_chapterMedia{position:relative;overflow:hidden}
.topco_productChapter .topco_chapterMedia>img{
  transform:translateY(var(--topco-product-offset,0px)) scale(var(--topco-product-scale,1));
  transition:none;will-change:transform;
}
.topco_productChapter--bubble .topco_bubblePeel{
  transform:translateY(var(--topco-product-peel-offset,0px)) rotate(-2deg);
}
.topco_productChapter--bubble .topco_bubbleRoll{
  transform:translateY(var(--topco-product-roll-offset,0px));
}

html[data-topco-theme="dark"] .topco_statement{background:linear-gradient(180deg,#0d1827,#14263c)}
html[data-topco-theme="dark"] .topco_statement h2{color:#e6f0fc}
html[data-topco-theme="dark"] .topco_statement h2 span{color:#9bc9ed}
html[data-topco-theme="dark"] .topco_statement h2 em{color:#63b2ff}
html[data-topco-theme="dark"] .topco_statement p{color:#afc4d8}
html[data-topco-theme="dark"] .topco_statementRule{background:#66b5ed}
html[data-topco-theme="dark"] .topco_showcase{background:#122237;color:#e9f1fc}
html[data-topco-theme="dark"] .topco_showcase::before{background:radial-gradient(ellipse at 78% 0%,rgba(30,92,159,.2),transparent 56%)}
html[data-topco-theme="dark"] .topco_showcaseHead h2{color:#edf6ff}
html[data-topco-theme="dark"] .topco_showcaseHead h2 span{color:#7abffc}
html[data-topco-theme="dark"] .topco_showcaseHead p:not(.topco_eyebrow),html[data-topco-theme="dark"] .topco_showcaseHeadAside{color:#a8c2d7}
html[data-topco-theme="dark"] .topco_showcaseTrack .topco_caseCarouselCard{background:#1a304a;border-color:#37516e}
html[data-topco-theme="dark"] .topco_showcaseTrack .topco_showcasePhoto{background:linear-gradient(125deg,#203b59,#2c4f6b,#162b44)}
html[data-topco-theme="dark"] .topco_showcaseCaption{background:#1b3048;color:#edf5ff}
html[data-topco-theme="dark"] .topco_showcaseCaption small{color:#9ec8f3}
html[data-topco-theme="dark"] .topco_showcaseDetail{color:#acc3d5}
html[data-topco-theme="dark"] .topco_showcaseOpen{background:#274966;color:#9ed4ff}
html[data-topco-theme="dark"] .topco_showcaseCounter strong{color:#8fc8fc}
html[data-topco-theme="dark"] .topco_showcaseProgress{background:#344e6d}
html[data-topco-theme="dark"] .topco_showcaseProgress>span{background:#7abffc}
html[data-topco-theme="dark"] .topco_showcaseLead{border-bottom-color:#37506a}
html[data-topco-theme="dark"] .topco_showcaseLead>p:not(.topco_eyebrow){color:#acc0d5}
html[data-topco-theme="dark"] .topco_showcaseLead>p strong{color:#ddeafb}
html[data-topco-theme="dark"] .topco_showcaseLead>a{color:#89c1ff}
html[data-topco-theme="dark"] .topco_showcase .topco_homeShieldRailHead h3{color:#f0f5ff}
html[data-topco-theme="dark"] .topco_chapterCopy>p:not(.topco_eyebrow),html[data-topco-theme="dark"] .topco_dataRow{color:#b5c8dc}
html[data-topco-theme="dark"] .topco_dataRow span{border-color:#3a5068}
html[data-topco-theme="dark"] .topco_techFlow article{background:#1c2f47;border-color:#344b68}
html[data-topco-theme="dark"] .topco_techFlow article p{color:#b1c4da}
html[data-topco-theme="dark"] .topco_scene--technology .topco_sceneHead h2{color:#edf5ff}

@media(max-width:1040px){
  .topco_heroGrid{min-height:0}
  .topco_heroCopy{padding:64px 0 44px}
  .topco_heroStage--brand{min-height:480px}
  .topco_showcaseHeadAside{display:none}
  .topco_showcaseLead{flex-wrap:wrap}
  .topco_showcaseLead>p:not(.topco_eyebrow){flex:1 1 66%}
}
@media(max-width:780px){
  .topco_themeToggle{width:38px;height:38px}
  .topco_themeToggle svg{width:19px;height:19px}
  .topco_cinemaCopy{width:88vw;left:6vw;height:min(460px,77svh)}
  .topco_cinemaMessage h2{font-size:clamp(35px,8.5vw,57px)}
  .topco_statement{padding:90px 0;min-height:62svh}
  .topco_statement h2{font-size:clamp(41px,8vw,64px)}
  .topco_showcase{padding:72px 0 68px}
  .topco_showcaseTrack{padding-inline:20px;gap:14px}
  .topco_showcaseTrack .topco_caseCarouselSet{gap:14px}
  .topco_showcaseTrack .topco_caseCarouselCard{width:calc(100vw - 45px);flex-basis:calc(100vw - 45px);height:clamp(475px,100vw,660px);grid-template-rows:minmax(0,1fr) 135px;border-radius:21px}
  .topco_showcaseHead h2{font-size:clamp(35px,8vw,55px)}
  .topco_showcaseCaption{padding:20px 22px}
  .topco_showcaseCaption strong{font-size:clamp(20px,5.5vw,28px)}
  .topco_showcaseUnder{padding-top:38px}
}
@media(max-width:480px){
  .topco_hero h1{font-size:clamp(39px,10vw,49px)}
  .topco_inlineLogo{width:175px}
  .topco_heroCopy{padding:45px 0 28px}
  .topco_heroStage--brand{min-height:330px}
  .topco_themeToggle{width:36px;height:36px}
  .topco_themeToggle svg{width:18px;height:18px}
  .topco_statement h2{font-size:clamp(36px,9.4vw,47px)}
  .topco_showcaseHead h2{font-size:clamp(33px,8.6vw,41px)}
  .topco_showcaseHead p:not(.topco_eyebrow){font-size:14px}
  .topco_showcaseTrack .topco_caseCarouselCard{height:480px;grid-template-rows:minmax(0,1fr) 132px}
  .topco_showcaseTrack .topco_showcasePhoto{padding:7px}
  .topco_showcaseNumber{top:12px;left:12px;padding:7px 10px;font-size:10px}
  .topco_showcaseCaption{padding:15px 18px}
  .topco_showcaseCaption small{font-size:9px}
  .topco_showcaseDetail{margin-top:5px;font-size:11px}
  .topco_showcaseOpen{width:40px;height:40px;font-size:19px}
  .topco_showcaseLead{gap:12px}
  .topco_showcaseLead>p:not(.topco_eyebrow){flex:1 1 100%}
  .topco_showcaseLead>a{font-size:12px}
  .topco_showcaseGesture{font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .topco_statement h2 span,.topco_statement h2 em,.topco_cinemaFrame,.topco_cinemaMessage,.topco_productChapter .topco_chapterMedia>img{opacity:1;transform:none!important;will-change:auto}
  .topco_showcaseTrack .topco_caseCarouselCard,.topco_showcaseOpen,.topco_showcaseProgress>span{transition:none}
  .topco_statementRule{width:100%}
}


/* ================================================================
 * TOPCO v0.9.9.6 — Scroll-orbit applications
 * 공식 원본 사진 4건을 변형 없이 카드 표면에만 사용한다.
 * 대형 장면의 3D 회전·원근 및 스크롤 스토리 전환만 CSS transform으로 구현한다.
 * JS 불능·저동작 환경에서는 별도 렌더러 없이 4개 원본 카드 그리드를 표시한다.
 * ================================================================ */
.topco_showcase--orbit{padding-bottom:88px;overflow:clip;background:#eaf0f8}
.topco_showcase--orbit .topco_showcaseHead{position:relative;z-index:2;margin-bottom:4px}
.topco_orbitRail{position:relative;min-height:610px}
.topco_orbitSticky{position:relative;min-height:690px;outline-offset:-8px;overflow:hidden;isolation:isolate}
.topco_orbitBackdrop{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 45% 36% at 49% 41%,rgba(126,174,222,.20),transparent 82%),linear-gradient(180deg,#eaf0f8,#f4f7fc 65%,#eaf0f8)}
.topco_orbitTopline{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:32px;font:700 11px 'Pretendard',sans-serif;letter-spacing:.12em;color:#607d9e}
.topco_orbitDeck{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;width:min(1240px,calc(100% - 48px));margin:30px auto 26px}
.topco_orbitCard.topco_caseCarouselCard{position:relative;flex:none;min-width:0;aspect-ratio:auto;display:grid;grid-template-rows:minmax(0,1fr) 114px;min-height:395px;overflow:hidden;border-radius:26px;background:#fff;border:1px solid #cfdaeb;color:#182f4b;text-decoration:none;box-shadow:0 16px 47px rgba(20,47,77,.12)}
.topco_orbitCard::after{display:none}
.topco_orbitCard .topco_showcasePhoto{position:relative;min-height:0;display:flex;align-items:center;justify-content:center;padding:12px;overflow:hidden;background:linear-gradient(147deg,#d9e7f4,#f5f8fb 60%,#d9e7f4)}
.topco_orbitCard .topco_showcasePhoto img{display:block;width:100%;height:100%;max-height:100%;object-fit:contain;object-position:center;pointer-events:none;transition:none;transform:none!important}
.topco_orbitCard .topco_showcaseCaption{padding:17px 24px 18px;gap:12px;color:#19314e;background:#fff;min-width:0}
.topco_orbitCard .topco_showcaseCaption small{font-size:10px}
.topco_orbitCard .topco_showcaseCaption strong{font-size:clamp(18px,2.3vw,25px)}
.topco_orbitCard .topco_showcaseDetail{font-size:12px}
.topco_orbitCard.is-image-unavailable .topco_showcasePhoto::before{content:'공식 시공사진을 불러오지 못했습니다';position:absolute;left:20px;right:20px;top:50%;text-align:center;transform:translateY(-50%);font-size:13px;color:#647992}
.topco_orbitBottom{display:none;position:relative;z-index:9;justify-content:space-between;align-items:center;gap:30px;padding-bottom:34px;pointer-events:none}
.topco_orbitEditorial{position:relative;flex:1;min-width:0;min-height:88px}
.topco_orbitEditorialItem{position:absolute;inset:0;opacity:0;transform:translateY(13px);transition:opacity .25s ease,transform .25s ease;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.topco_orbitEditorialItem.is-current{opacity:1;transform:none}
.topco_orbitEditorialItem small{color:#386c9e;font:700 11px 'Pretendard',sans-serif;letter-spacing:.1em}
.topco_orbitEditorialItem strong{color:#193751;font:700 clamp(22px,3.1vw,39px)/1.06 'Pretendard',sans-serif;letter-spacing:-.04em}
.topco_orbitEditorialItem>span{color:#60778f;font-size:13px}
.topco_orbitStatus{display:flex;flex-direction:column;align-items:flex-end;gap:9px;min-width:175px}
.topco_orbitStatus>div:first-child{font:700 14px 'Pretendard',sans-serif;color:#607993}
.topco_orbitStatus b{font:700 30px 'Pretendard',sans-serif;color:#17589b}
.topco_orbitProgress{width:175px;height:3px;border-radius:20px;background:#c9d7e5;overflow:hidden}
.topco_orbitProgress span{display:block;height:100%;width:25%;background:#1f68af;transform-origin:left;transform:scaleX(1);transition:width .12s linear}
.topco_orbitGesture{color:#6c85a1;font:700 10px 'Pretendard',sans-serif;letter-spacing:.15em}
.topco_orbitAccessibleHint{display:none}

/* JS 준비 후: 세로 스크롤은 4개 사례를 연속적으로 돌리고 같은 카드가 다시 앞으로 돌아온다. */
.topco_orbitReady .topco_orbitRail{height:440svh;min-height:2200px}
.topco_orbitReady .topco_orbitSticky{position:sticky;top:0;height:100svh;min-height:565px;max-height:none;overflow:hidden;perspective:1500px;perspective-origin:50% 45%;touch-action:pan-y}
.topco_orbitReady .topco_orbitBackdrop{background:radial-gradient(ellipse 55% 44% at var(--topco-orbit-glow-x,50%) 42%,rgba(106,166,229,.25),transparent 80%),linear-gradient(180deg,#eaf0f8 0%,#f4f7fc 68%,#eaf0f8 100%)}
.topco_orbitReady .topco_orbitDeck{display:block;position:absolute;left:0;top:0;width:100%;height:100%;margin:0;perspective:1400px;perspective-origin:50% 43%;transform-style:preserve-3d;pointer-events:none}
.topco_orbitReady .topco_orbitCard.topco_caseCarouselCard{position:absolute;left:50%;top:45%;width:min(58vw,770px);height:clamp(340px,59svh,620px);min-height:0;max-width:none;display:grid;grid-template-rows:minmax(0,1fr) 119px;transform-origin:center center;will-change:transform,opacity;backface-visibility:hidden;pointer-events:auto;touch-action:pan-y;cursor:grab;box-shadow:0 28px 65px rgba(26,62,102,.16),0 5px 15px rgba(22,47,76,.06);border-radius:26px}
.topco_orbitReady .topco_orbitCard:not(.is-current){cursor:pointer}
.topco_orbitReady .topco_orbitCard.is-current{border-color:#98b8dc;box-shadow:0 35px 95px rgba(25,61,101,.27),0 7px 22px rgba(14,42,69,.08)}
.topco_orbitReady .topco_orbitCard.is-dragging{cursor:grabbing}
.topco_orbitReady .topco_orbitCard .topco_showcasePhoto{padding:15px;background:linear-gradient(145deg,#d9e7f5,#f4f8fc 58%,#d6e5f4)}
.topco_orbitReady .topco_orbitCard .topco_showcaseCaption{padding:19px 27px 22px}
.topco_orbitReady .topco_orbitCard .topco_showcaseCaption strong{font-size:clamp(21px,2.35vw,30px)}
.topco_orbitReady .topco_orbitCard .topco_showcaseOpen{border-radius:100%}
.topco_orbitReady .topco_orbitBottom{display:flex;position:absolute;left:0;right:0;bottom:0;padding-bottom:clamp(20px,4.7svh,50px)}
.topco_orbitReady .topco_orbitAccessibleHint{display:block;position:absolute;z-index:2;bottom:clamp(115px,18svh,180px);left:50%;transform:translateX(-50%);margin:0;width:min(90%,550px);font-size:11px;letter-spacing:.02em;color:#69819c;text-align:center;pointer-events:none;opacity:.8}
.topco_orbitReady .topco_orbitTopline{position:absolute;z-index:9;left:0;right:0;top:0;padding-top:clamp(16px,3.8svh,41px)}
.topco_orbitReady .topco_orbitDeck.is-dragging{cursor:grabbing}
.topco_orbitReady .topco_orbitDeck.is-dragging *{user-select:none;-webkit-user-select:none}
.topco_orbitCard:focus-visible{outline:3px solid #3087d8;outline-offset:4px}

/* 명암 모드는 단순 색 반전이 아니라 같은 촬영 원본을 어두운 전시 무대 위에 올린다. */
html[data-topco-theme='dark'] .topco_showcase--orbit{background:#122237}
html[data-topco-theme='dark'] .topco_orbitBackdrop{background:radial-gradient(ellipse 55% 42% at 50% 44%,rgba(32,99,168,.23),transparent 82%),linear-gradient(180deg,#122237,#172b45 65%,#122237)}
html[data-topco-theme='dark'] .topco_orbitReady .topco_orbitBackdrop{background:radial-gradient(ellipse 54% 44% at var(--topco-orbit-glow-x,50%) 43%,rgba(55,119,190,.29),transparent 80%),linear-gradient(180deg,#122237,#172b45 65%,#122237)}
html[data-topco-theme='dark'] .topco_orbitTopline{color:#91b0cd}
html[data-topco-theme='dark'] .topco_orbitCard.topco_caseCarouselCard{background:#172c44;color:#edf4fb;border-color:#365577}
html[data-topco-theme='dark'] .topco_orbitCard .topco_showcasePhoto{background:linear-gradient(140deg,#213953,#2d435c 58%,#1f3650)}
html[data-topco-theme='dark'] .topco_orbitCard .topco_showcaseCaption{background:#1b3049;color:#e7f1fd}
html[data-topco-theme='dark'] .topco_orbitCard .topco_showcaseDetail{color:#b0c0d1}
html[data-topco-theme='dark'] .topco_orbitEditorialItem strong{color:#ecf4ff}
html[data-topco-theme='dark'] .topco_orbitEditorialItem small{color:#90c9ff}
html[data-topco-theme='dark'] .topco_orbitEditorialItem>span{color:#b7c9da}
html[data-topco-theme='dark'] .topco_orbitStatus>div:first-child{color:#a3b9ce}
html[data-topco-theme='dark'] .topco_orbitStatus b{color:#8fc9ff}
html[data-topco-theme='dark'] .topco_orbitProgress{background:#39536b}
html[data-topco-theme='dark'] .topco_orbitProgress span{background:#7cbeff}
html[data-topco-theme='dark'] .topco_orbitGesture,html[data-topco-theme='dark'] .topco_orbitAccessibleHint{color:#a9bed3}

@media(max-width:970px){
  .topco_orbitReady .topco_orbitSticky{perspective:1200px}
  .topco_orbitReady .topco_orbitCard.topco_caseCarouselCard{width:min(73vw,700px);height:clamp(365px,57svh,590px)}
  .topco_orbitReady .topco_orbitAccessibleHint{bottom:clamp(105px,16svh,153px)}
}
@media(max-width:680px){
  .topco_showcase--orbit{padding-top:66px;padding-bottom:62px}
  .topco_showcase--orbit .topco_showcaseHead{margin-bottom:18px}
  .topco_orbitTopline{font-size:9px;letter-spacing:.06em;padding-top:20px}
  .topco_orbitReady .topco_orbitRail{height:365svh;min-height:1780px}
  .topco_orbitReady .topco_orbitSticky{height:100svh;min-height:555px;perspective:950px}
  .topco_orbitReady .topco_orbitCard.topco_caseCarouselCard{top:43%;width:calc(100vw - 44px);height:clamp(348px,50svh,515px);grid-template-rows:minmax(0,1fr) 112px;border-radius:19px}
  .topco_orbitReady .topco_orbitCard .topco_showcasePhoto{padding:8px}
  .topco_orbitReady .topco_orbitCard .topco_showcaseCaption{padding:15px 18px}
  .topco_orbitReady .topco_orbitCard .topco_showcaseCaption strong{font-size:clamp(18px,5vw,24px)}
  .topco_orbitReady .topco_orbitCard .topco_showcaseCaption small{font-size:9px}
  .topco_orbitReady .topco_orbitCard .topco_showcaseDetail{font-size:11px}
  .topco_orbitReady .topco_orbitCard .topco_showcaseOpen{width:40px;height:40px;font-size:19px}
  .topco_orbitReady .topco_orbitBottom{align-items:flex-start;gap:12px;padding-bottom:15px}
  .topco_orbitEditorial{min-height:88px}
  .topco_orbitEditorialItem{gap:4px}
  .topco_orbitEditorialItem strong{font-size:clamp(17px,4.6vw,24px)}
  .topco_orbitEditorialItem small{font-size:9px}
  .topco_orbitEditorialItem>span{font-size:10px;line-height:1.35}
  .topco_orbitStatus{min-width:92px;gap:6px}
  .topco_orbitStatus b{font-size:24px}
  .topco_orbitProgress{width:92px}
  .topco_orbitGesture{font-size:7px;letter-spacing:.04em}
  .topco_orbitReady .topco_orbitAccessibleHint{bottom:109px;font-size:10px}
}
@media(max-width:440px){
  .topco_orbitDeck{grid-template-columns:1fr;width:calc(100% - 32px)}
  .topco_orbitCard.topco_caseCarouselCard{min-height:380px}
  .topco_orbitReady .topco_orbitCard.topco_caseCarouselCard{top:41.5%;height:clamp(342px,49svh,475px)}
  .topco_orbitReady .topco_orbitTopline{padding-top:12px}
  .topco_orbitReady .topco_orbitAccessibleHint{bottom:105px}
}
@media(prefers-reduced-motion:reduce){
  .topco_orbitReady .topco_orbitRail{height:auto;min-height:0}
  .topco_orbitReady .topco_orbitSticky{position:relative;height:auto;min-height:0;overflow:visible;perspective:none;touch-action:auto}
  .topco_orbitReady .topco_orbitDeck{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;left:auto;top:auto;height:auto;width:min(1240px,calc(100% - 36px));margin:24px auto;perspective:none;pointer-events:auto}
  .topco_orbitReady .topco_orbitCard.topco_caseCarouselCard{position:relative;left:auto;top:auto;width:auto;height:425px;min-height:0;opacity:1!important;transform:none!important;pointer-events:auto}
  .topco_orbitReady .topco_orbitBottom{display:none}
  .topco_orbitReady .topco_orbitAccessibleHint{display:none}
  .topco_orbitReady .topco_orbitTopline{position:relative;left:auto;right:auto;top:auto}
}
@media(prefers-reduced-motion:reduce) and (max-width:680px){
  .topco_orbitReady .topco_orbitDeck{grid-template-columns:1fr}
  .topco_orbitReady .topco_orbitCard.topco_caseCarouselCard{height:430px}
}

/* v0.9.9.6 visual QA follow-up — animated captions must never overlap as ghost text. */
.topco_orbitEditorialItem{visibility:hidden;pointer-events:none}
.topco_orbitEditorialItem.is-current{visibility:visible}
.topco_orbitSticky:focus:not(:focus-visible){outline:none}
.topco_orbitSticky:focus-visible{outline:2px solid rgba(40,118,201,.62);outline-offset:-4px}
html[data-topco-theme='dark'] .topco_brand{display:inline-flex;align-items:center;padding:3px 9px;background:rgba(255,255,255,.96);border-radius:10px}
html[data-topco-theme='dark'] .topco_mobileNav summary span{background:#eef5ff}

/* 공식 제품 이미지를 자르지 않고 전체 비율로 표시함 */
.topco_productHero figure img.topco_officialProductImage,
.topco_processImage img.topco_officialProductImage,
.topco_chapterMedia img.topco_officialProductImage{object-fit:contain;background:#fff;padding:20px}

/* 명시적인 굵기 유틸리티가 개별 컴포넌트의 굵기보다 우선하도록 적용함 */
.fw-bolder{font-weight:900!important}
.fw-bold{font-weight:800!important}
.fw-semibold{font-weight:700!important}