/*─────────────────────────────────────────────────────────
    Base
─────────────────────────────────────────────────────────*/
    #wrap{position:relative; overflow-x:clip;}
    .w_custom{position: relative; width: calc(100% - 60px); max-width: 1600px; margin-inline: auto; z-index: 1;}
    main{position: relative; z-index: 1; padding-block: var(--row-gap140); background: var(--white);}
    main > .w_custom:has(.full-sec){width: 100%; max-width: 100%;}
    main:has(.pt-dn){padding-top: 0;}
    main:has(.pd-dn){padding-bottom: 0;}

    .link{position: absolute; inset: 0; z-index: 3;}
    .section{padding-block:var(--section)}
    .section--dark{background:var(--ink);color:var(--white)}
    .section--gray{background:var(--gray-50)}

    /* ---------- type ---------- */
    .label{font-family:var(--font-en);font-size: var(--text-20);font-weight:500;letter-spacing:.04em;color:var(--accent);margin-bottom:20px}
    .label--white{color:rgba(255,255,255,.7)}
    .section__title{font-size: var(--text-52);font-weight:700;line-height:1.4;letter-spacing:-.03em;text-wrap:balance;color:#111}
    .section--dark .section__title{color:var(--white)}
    .section__desc{font-size:18px;line-height:1.8;color:rgba(255,255,255,.7)}
    .section__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:72px}
    @media (max-width:1023px){.section__desc{font-size:16px}}
    @media (max-width:767px){
    .label{margin-bottom:12px}
    .section__title br,.cta__title br,.intro__about-title br,.panel__desc br,.cta__sub br{display:none}
    .section__desc{font-size:16px}
    .section__head{flex-direction:column;align-items:flex-start;gap:20px;margin-bottom:36px}
    }

    /* ---------- pill button (POSCO-style) ---------- */
    .pill{display:inline-flex;align-items:center;gap: clamp(10px, 1.2vw, 12px);padding: clamp(15px, 2.5vw, 20px) clamp(20px, 3.2vw, 32px);border-radius: 100px;border:1px solid var(--ink);font-size: var(--text-18);font-weight:600;line-height:1;color:var(--ink);transition: all 0.4s;}
    /* paper-plane icon (from the logo) replaces the arrow */
    .pill__arrow{display:inline-block;width: clamp(12px, 1.7vw, 15px);height: auto;aspect-ratio: auto 1;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M2 13.5 30 2 18.5 30 14.5 18.5Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M2 13.5 30 2 18.5 30 14.5 18.5Z'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .4s var(--ease)}
    .pill .pill__arrow{color:var(--accent);background:var(--accent)}
    .pill--accent .pill__arrow,.pill--white:hover .pill__arrow{background:currentColor}
    .pill:hover{background:var(--ink);color:var(--white)}
    /* hover: the plane flies out to the top-right and re-enters from the bottom-left (mask-position keeps it clipped to its own box) */
    .pill:hover .pill__arrow,.textlink:hover .pill__arrow,.ncard:hover .pill__arrow{animation:planeFly .7s cubic-bezier(.4,0,.2,1)}
    @keyframes planeFly{
    0%{-webkit-mask-position:0 0;mask-position:0 0}
    45%{-webkit-mask-position:22px -22px;mask-position:22px -22px}
    50%{-webkit-mask-position:-22px 22px;mask-position:-22px 22px}
    100%{-webkit-mask-position:0 0;mask-position:0 0}
    }
    .pill--white{border-color:rgba(255,255,255,.6);color:var(--white)}
    .pill--white:hover{background:var(--white);border-color:var(--white);color:var(--ink)}
    .pill--accent{background:var(--accent);border-color:var(--accent);color:var(--white)}
    .pill--accent:hover{background:var(--white);border-color:var(--white);color:var(--ink)}
    .textlink{display:inline-flex;align-items:center;gap:10px;font-size:16px;font-weight:600;color:var(--accent)}


    @media (max-width:1600px) {
        br.for_pc{display:none;}
    }
    @media (max-width:1024px) {
        br.for_pct{display:none;}
    }
    @media (max-width:860px) {
        .w_custom{width: calc(100% - 40px);}
    }
    @media (max-width:479px) {
        br.for_pcm{display:none;}
    }
    @media (max-width:360px) {
        .w_custom{width: calc(100% - 30px);}
    }

/*─────────────────────────────────────────────────────────
    FAQ
─────────────────────────────────────────────────────────*/
    .pf-faq-wrap { padding-bottom: 3rem; }
    .pf-faq { margin-top: 2.5rem; }
    .pf-faq-title { font-size: 1.125rem; font-weight: 700; color: #0f172a; margin-bottom: 1rem; }
    .pf-faq-title-sub { color: #94a3b8; font-size: .875rem; font-weight: 400; }
    .pf-faq-list { display: flex; flex-direction: column; gap: .5rem; }
    .pf-faq-item { border: 1px solid #e2e8f0; overflow: hidden; background: #fff; }
    .pf-faq-toggle { width: 100%; text-align: left; padding: 1rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; background: transparent; border: 0; cursor: pointer; transition: background-color .15s; }
    .pf-faq-q { display: flex; align-items: center; gap: .75rem; min-width: 0; }
    .pf-faq-badge { flex-shrink: 0; width: 1.75rem; height: 1.75rem; display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; color: #fff; }
    .pf-faq-badge--q { background: #1b1b1b; }
    .pf-faq-badge--a { background: #707070; }
    .pf-faq-question { font-weight: 500; font-size: .875rem; color: #0f172a; }
    .pf-faq-arrow { width: 1.25rem; height: 1.25rem; color: #94a3b8; flex-shrink: 0; transition: transform .2s; }
    .pf-faq-item.is-open .pf-faq-arrow { transform: rotate(180deg); }
    .pf-faq-answer { display: none; }
    .pf-faq-a { display: flex; gap: .75rem; border-top: 1px solid #e2e8f0; padding: 1rem 1.25rem; background: rgba(248, 250, 252, .6); }
    .pf-faq-answer-text { flex: 1; font-size: .875rem; color: #0f172a; line-height: 1.625; white-space: pre-line; }
    .pf-faq-answer-text.db-user-content { white-space: normal; }
    .pf-faq-prefix { font-size: .75rem; background: #e2e8f0; color: #334155; padding: .125rem .375rem; border-radius: .25rem; margin-right: .25rem; }

        @media (hover:hover) and (pointer: fine){
            .pf-faq-toggle:hover { background: rgba(248, 250, 252, .6); }
        }

/*─────────────────────────────────────────────────────────
    Header
─────────────────────────────────────────────────────────*/
    #header{position:fixed;inset:0 0 auto 0;z-index:100;background:transparent;transition:all 0.4s}
        #header.scr{transform:translateY(-100%)}
        #header.on{background:var(--white);box-shadow:inset 0 -1px 0 var(--line);}
    #header .w_custom{position:relative;display:flex;align-items:center;justify-content:space-between;max-width: 1740px;height:var(--header-h);}

    #header .logo{height: 100%;display: flex;align-items: center;}
    #header .logo a{position: relative;display:flex;align-items: center;height: min(clamp(36px, 5vw, 50px), 100%);}
    #header .logo__svg{display:block;width:172px;height:23px;fill:currentColor}
    #header .logo__img{display:block;transition: all 0.4s;}
    #header .logo__img--dark{opacity: 0;position: absolute;top: 0;left: 0;}
    #header .logo__img--light{display:block}
        #header.on .logo__img--dark{opacity: 1;}
        #header.on .logo__img--light{opacity: 0;}
    #header .logo__svg .lg-plane{fill:var(--accent)}
    .db-lang{display:inline-flex;align-items:center;gap:12px;}
    .db-lang li{font-family:var(--font-en);font-size: 18px;font-weight:600;letter-spacing:.04em;color: var(--black-color01);display: inline-flex;align-items: center;gap: 12px;}
    .db-lang li::after{display: inline-flex;content:'';width: 1px;height: clamp(10px, 1.4vw, 12px);background:currentColor; opacity: 0.5; transition: all 0.4s;}
    .db-lang li:last-child::after{display: none;}
    .db-lang a{transition:all 0.4s;color: rgb(255 255 255 / 50%);}
    .db-lang li.on a{opacity:1;color:var(--accent)}

        #header:not(.on) .db-lang li::after{filter: var(--filter-white);}
        #header.on .db-lang a:not(.on){color: var(--black-color09);}

        

    #header .gnb{position:absolute;left:50%;top:0;transform:translateX(-50%);display:flex;justify-content: center;gap: clamp(30px, 4.7vw, 90px);width: calc(100% - 480px);height:100%;text-align: center;}
    #header .gnb > li{position:relative}
    #header .gnb > li > a{display:flex;align-items:center;height:100%;font-family:var(--font-en);font-size: clamp(14px, 1vw, 19px);font-weight:600;color: var(--black-color01);letter-spacing:.02em;position:relative;transition:all 0.4s;}
    #header .gnb .dep02{position:absolute;top:calc(50% + 28px);left:50%;width: max-content;min-width: 170px;max-width: 300px;padding:14px 0;background:var(--white);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.08);opacity:0;visibility:hidden;transform:translate(-50%,-8px);transition:all 0.4s;}
    #header .gnb .dep02::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
    #header .gnb .dep02 > li > a{display:block;padding:7px 10px;font-size:16px;font-weight:600;line-height:24px;color:var(--ink-2);transition:color .25s}
    
    #header .header__util{display:flex;align-items:center;gap:28px}
    #header .burger{display:none;position:relative;width:28px;height:22px}
    #header .burger{&::before, &::after{position:absolute; content:'';top:4px; left:0;width:100%;height:2px;background:currentColor;transition:all 0.4s}}
    #header .burger::after{top:16px;width:70%}
    #header .burger.on::before{top:10px;transform:rotate(45deg)}
    #header .burger.on::after{top:10px;width:100%;transform:rotate(-45deg)}

        #header:not(.on) .gnb > li > a{filter: var(--filter-white);}
        #header:not(.on) .burger{filter: var(--filter-white);}

        @media (hover:hover) and (pointer: fine) {
            #header .gnb > li:hover .dep02{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
            #header .gnb .dep02 > li > a:hover{color:var(--navy);}
            #header .db-lang li:hover{opacity:1}
        }

    @media (max-width:1024px) {
        #header .gnb{display: none;}
        #header .db-lang{display: none;}
        #header .burger{display: block;}
    }

/*─────────────────────────────────────────────────────────
    Header
─────────────────────────────────────────────────────────*/
    #aside{position:fixed;inset:0;z-index:90;background:var(--ink);color:var(--white);transform:translateX(100%);transition:all 0.5s;overflow-y:auto;visibility:hidden}
        body:has(#burger.on) #aside{transform:none;visibility:visible}
        body:has(#burger.on){overflow: clip;}
    #aside .w_custom{max-width: 1740px; min-height:100%;display:flex;flex-direction:column;justify-content:space-between;padding-block: calc(var(--header-h) + 32px) 40px;}
    #aside .gnb > li > a{position: relative;display:flex;width:100%;align-items:center;justify-content:space-between;padding-block: 18px;padding-right: 40px;font-family:var(--font-en);font-size:26px;font-weight:700;letter-spacing:.02em;border-bottom:1px solid var(--line-dark);transition: all 0.4s;}
        #aside .gnb > li > a.on{color: var(--accent);}
        #aside .gnb > li:has(.dep02) > a{&::before, &::after{position: absolute;content:'';width: 14px;height: 2px;background:currentColor;top: 50%;right: 0;translate: 0 -50%;}}
        #aside .gnb > li:has(.dep02) > a::after{width: 2px;height:14px;right: 5px;translate: -50% -50%;}
        #aside .gnb > li:has(.dep02) > a.on::after{opacity: 0;}
    
    #aside .gnb .dep02{display: none;}
    #aside .gnb .dep02 > li > a{display:block;padding:10px 0;font-size:16px;color:rgba(255,255,255,.7)}
    #aside .gnb .dep02 > li:first-child > a{padding-top:16px}
    #aside .gnb .dep02 > li:last-child > a{padding-bottom:20px}
    #aside .btm-sec{margin-top:48px;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
    #aside .cs{font-family:var(--font-en);font-size:16px;line-height:1.7;color:rgba(255,255,255,.6);text-align:right}
    #aside .db-lang li::after{filter: var(--filter-white);}

/*─────────────────────────────────────────────────────────
    Main
─────────────────────────────────────────────────────────*/
    /* 인트로 */
        .intro{position:relative;height:340vh;--p:0;--p1:0;--p2:0;--p3:0;--card:320px}
        .intro__sticky{position:sticky;top:0;height:100vh;overflow:hidden;background:var(--white)}
        .intro__hero{position:absolute;left:50%;top:50%;z-index:2;overflow:hidden;background:var(--ink);
        width:calc(100% - (100% - var(--card)) * var(--p1));
        height:calc(100vh - (100vh - var(--card)) * var(--p1));
        border-radius:calc(var(--radius) * var(--p1));
        transform:translate(-50%,calc(-50% - 6vh * var(--p1) - 30vh * var(--p3)));
        opacity:calc(1 - var(--p3) * 2);will-change:width,height,transform,opacity}
        .intro__hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:calc(50% - 25% * var(--p1)) 0;transform:scale(calc(1.12 + .2 * var(--p1)));transform-origin:50% 0;background:var(--ink)} 
        .intro__hero .intro__shade{opacity:calc(1 - var(--p1) * 1.6);background:rgba(0,21,63,.28)}
        .intro__shade{position:absolute;inset:0;z-index:1;pointer-events:none;
        background:linear-gradient(180deg,rgba(0,21,63,.55) 0%,rgba(0,21,63,.32) 45%,rgba(0,21,63,.05) 100%)} 

        .intro__heroText{position:absolute;left:0;right:0;top:47%;z-index:3;color:var(--white);text-align:center; opacity:calc(1 - var(--p1) * 2.4);transform:translateY(calc(-50% - 40px * var(--p1)));pointer-events:none}
        .intro:not(.is-shrunk) .intro__heroText{pointer-events:auto}
        .intro__en{margin-bottom:24px;font-family:var(--font-en);font-size: var(--text-20);font-weight:500;letter-spacing:.02em;color:rgba(255,255,255,.85)} 
        .intro__title{font-size: var(--text-64);font-weight:700;line-height:1.4;letter-spacing:-.035em}
        .intro__title em{font-style:normal;color:var(--accent)}
        .intro__title .line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
        .intro__title .line>span{display:block;transform:translateY(110%);animation:rise 1s var(--ease) .2s forwards}
        .intro__title .line:nth-child(2)>span{animation-delay:.32s}
        @keyframes rise{to{transform:translateY(0)}}

        .intro__collage{position:absolute;inset:0;z-index:1}
        .intro__img{position:absolute;overflow:hidden;border-radius:var(--radius);
        transform:translate(calc(var(--fx) * (1 - var(--p1))),calc(var(--fy) * (1 - var(--p1)) - 30vh * var(--p3)));
        opacity:calc(var(--p1) * 1.4 - var(--p3) * 2);will-change:transform,opacity}
        .intro__img img{width:100%;height:100%;object-fit:cover}
        .intro__img--1{left:14%;top:12%;width:15vw;aspect-ratio:3/4}
        .intro__img--2{left:6%;bottom:8%;width:17vw;aspect-ratio:5/4}
        .intro__img--4{right:14%;bottom:10%;width:14vw;aspect-ratio:3/4}
        .intro__tagline{position:absolute;left:50%;top:50%;z-index:3;width:max-content;max-width:90vw;text-align:center;
        transform:translate(-50%,calc(var(--card) / 2 - 6vh + 36px - 30vh * var(--p3)));
        font-size:32px;font-weight:700;line-height:1.5;letter-spacing:-.03em;color:var(--ink);
        opacity:calc(var(--p2) - var(--p3) * 2);pointer-events:none}
        .intro__tagline em{font-family:var(--font-en);font-style:normal;font-weight:600;color:var(--accent)}

        .intro__grow{position:absolute;z-index:4;overflow:hidden;background:var(--ink);--gx:6%;--gy:11%;--gw:21vw;--gh:14vw;
        right:calc(var(--gx) * (1 - var(--p3)));top:calc(var(--gy) * (1 - var(--p3)));
        width:calc(var(--gw) + (100% - var(--gw)) * var(--p3));height:calc(var(--gh) + (100% - var(--gh)) * var(--p3));
        border-radius:calc(var(--radius) * (1 - var(--p3)));
        transform:translate(calc(var(--fx) * (1 - var(--p1))),calc(var(--fy) * (1 - var(--p1))));
        opacity:calc(var(--p1) * 1.4);will-change:transform,width,height}
        .intro__grow>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
        .intro__grow .intro__shade{opacity:var(--p3)}
        .intro__about{position:absolute;left:0;right:0;top:calc(var(--header-h) + 10vh);z-index:3;color:var(--white);
        opacity:calc(var(--p3) * 2 - 1);transform:translateY(calc(30px * (1 - var(--p3))));pointer-events:none}
        .intro.is-about .intro__about{pointer-events:auto}
        .intro__about-title{font-size: var(--text-52);font-weight:700;line-height:1.28;letter-spacing:-.03em} 
        .intro__about-sub{margin:30px 0 0;font-size: var(--text-19);line-height:1.8;color:rgba(255,255,255,.85)} 
        .intro__about .pill{margin-top: var(--row-gap40);background:rgba(255,255,255,.12);backdrop-filter:blur(10px);border-color:rgba(255,255,255,.25)} 
        

        .intro__scroll{position:absolute;left:50%;bottom:28px;z-index:3;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--font-en);font-size:16px;letter-spacing:.03em;color:rgba(255,255,255,.8);opacity:calc(1 - var(--p1) * 3)}
        .intro__scroll i{width:1px;height:40px;background:rgba(255,255,255,.3);position:relative;overflow:hidden}
        .intro__scroll i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:var(--white);animation:scrollLine 1.8s var(--ease) infinite}
        @keyframes scrollLine{0%{top:-100%}60%{top:100%}100%{top:100%}}

            @media (hover:hover) and (pointer: fine) {
                .intro__about .pill:hover{background:var(--white);border-color:var(--white)}
            }

        @media (max-width:1024px){
            .intro__tagline{font-size:24px}
            .intro__img--1{width:22vw;left:8%}.intro__img--2{width:26vw;left:4%}
            .intro__grow{--gx:4%;--gw:28vw;--gh:18.7vw}.intro__img--4{width:20vw;right:8%}
        }
        @media (max-width:767px){
            .intro{height:300vh;--card:220px}
            .intro__heroText{top:50%}
            .intro__en{margin-bottom:14px}
            .intro__img--1{left:4%;top:12%;width:28vw}
            .intro__img--2{left:5%;bottom:10%;width:28vw}
            .intro__grow{--gx:4%;--gy:10%;--gw:34vw;--gh:22.7vw}
            .intro__img--4{right:5%;bottom:8%;width:26vw}
            .intro__tagline{font-size:18px;transform:translate(-50%,calc(var(--card) / 2 - 6vh + 28px - 30vh * var(--p3)))}
            .intro__about{top:calc(var(--header-h) + 6vh)}
            .intro__about-sub{margin-top: 16px;}
            .intro__about-sub br{display:none}
            .intro__scroll{display:none}
        }

    /* 비즈니스 */
        .biz{background:var(--gray-50)}
        .panels{display:flex;gap:14px;height:640px}
        .panel{position:relative;flex:1;overflow:hidden;border-radius:var(--radius);color:var(--white);transition:flex 1.1s var(--ease-soft);isolation:isolate;will-change:flex}
        .panels .panel[data-aos]{transition-property:flex,opacity,transform;transition-duration:1.1s,.7s,.7s;transition-timing-function:var(--ease-soft),var(--ease),var(--ease);transition-delay:0s,var(--d,0s),var(--d,0s)}
        .panel.is-active{flex:2.1}
        .panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);filter:brightness(.6);transition:transform 1.6s var(--ease-soft),filter 1s var(--ease-soft);z-index:-1}
        .panel.is-active img{transform:scale(1);filter:brightness(.85)}
        .panel::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,21,63,.45) 0%,rgba(0,0,0,0) 32%,rgba(0,0,0,0) 50%,rgba(0,21,63,.88) 100%);z-index:0}
        .panel__top{position:absolute;left:40px;right:40px;top:40px;z-index:1;display:flex;align-items:center;gap:16px}
        .panel__no{font-family:var(--font-en);font-size:16px;font-weight:600;letter-spacing:.12em;color:var(--accent)}
        .panel__cat{font-family:var(--font-en);font-size:16px;font-weight:500;letter-spacing:.04em;color:rgba(255,255,255,.8);white-space:nowrap;opacity:0;transform:translateX(-8px);transition:opacity .6s .15s,transform .8s .15s var(--ease-soft)}
        .panel.is-active .panel__cat{opacity:1;transform:none;transition-delay:.2s}
        .panel__body{position:absolute;left:40px;right:40px;bottom:40px;z-index:1}
        .panel__title{display:block;font-size: var(--text-30);font-weight:700;letter-spacing:-.03em;line-height:1.2;white-space:nowrap;transition:font-size 1s var(--ease-soft)}
        .panel.is-active .panel__title{font-size: var(--text-40);}
        .panel__extra{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 1s var(--ease-soft),opacity .4s}
        .panel__extra>div{overflow:hidden;min-height:0}
        .panel.is-active .panel__extra{grid-template-rows:1fr;opacity:1;transition:grid-template-rows 1s var(--ease-soft),opacity .7s .3s}
        .panel__desc{margin-top: var(--row-gap20);font-size: var(--text-18);line-height:1.7;color:rgba(255,255,255,.9);max-width:520px}
        .panel__more{display:inline-flex;align-items:center;gap:10px;margin-top:26px;font-size: var(--text-18);font-weight:600;color:var(--white)}
        .panel__more .pill__arrow{background:var(--accent)}
        

            @media (hover:hover) and (pointer: fine) {
                .panel.is-active:hover .panel__more .pill__arrow{animation:planeFly .7s cubic-bezier(.4,0,.2,1)}
            }

        @media (max-width:1024px){
            .panels{height:540px;gap:10px}
            .panel__top{left:24px;right:24px;top:24px}
            .panel__body{left:24px;right:24px;bottom:24px}
            .panel__title{font-size:23px}
            .panel .panel__title{font-size: var(--text-40) !important;}
            .panels{flex-direction:column;height:auto}
            .panel{flex: none !important;height: auto;min-height: clamp(300px, 42vw, 420px);}
            .panel__cat{opacity:1;transform: none;}
            .panel__extra{grid-template-rows: 1fr !important;opacity: 1 !important;transition: grid-template-rows 1s var(--ease-soft), opacity .7s .3s !important;}
            .panel.is-active img{transform: scale(1); filter: brightness(.85);}
        }

    /* 넘버즈 */
        .numbers{position:relative;min-height:100vh;display:flex;align-items:center;padding-block:140px;overflow:hidden}
        .numbers__bg{position:absolute;inset:0;z-index:0}
        .numbers__bg img{width:100%;height:100%;object-fit:cover;opacity:.22;filter:saturate(.6)}
        .numbers::after{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 20% 40%,rgba(0,32,96,.12) 0%,rgba(0,21,63,.72) 60%,rgba(0,23,74,.92) 100%)}
        .numbers__inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:80px;align-items:center}
        .numbers__head .label{color:var(--accent)}
        .numbers__head .section__desc{margin: clamp(20px, 3vw, 30px) 0 0;font-size: var(--text-19);}
        .stats{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
        .stat{position:relative;display:flex;flex-direction:column;min-height:280px;padding:34px 34px 30px;border-radius:var(--radius);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);overflow:hidden;transition:background .3s,border-color .3s,transform .4s var(--ease)}
        .stat__label,.stat__num,.stat__note{transition:color .35s,transform .45s var(--ease)}
        .stat__img img{transition:transform .8s var(--ease)}
        .stat__img{transition:transform .8s var(--ease);transform-origin:100% 100%}
        .stat__label{font-size: var(--text-18);font-weight:600;color:rgba(255,255,255,.9)}
        .stat__num{display:flex;align-items:baseline;gap:4px;margin-top:16px;font-family:var(--font-en);font-size: var(--text-64);font-weight:500;line-height:1;letter-spacing:0;font-variant-numeric:tabular-nums}
        .stat__num em{font-style:normal;color:var(--accent)}
        .stat__num small{font-family:var(--font-ko);font-size:18px;font-weight:500;color:rgba(255,255,255,.7);margin-left:6px}
        .stat__note{margin-top:auto;padding-top:24px;font-size: var(--text-16);line-height:1.5;color:rgba(255,255,255,.6);padding-right:120px}
        .stat__img{position:absolute;right:22px;bottom:22px;width:100px;aspect-ratio:3/2;border-radius:6px;overflow:hidden}
        .stat__img img{width:100%;height:100%;object-fit:cover}

            @media (hover:hover) and (pointer: fine) {
                .stat:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);transform:translateY(-6px)}
                .stat:hover .stat__label{color:var(--white)}
                .stat:hover .stat__note{color:rgba(255,255,255,.85)}
                .stat:hover .stat__img{transform:scale(1.25)} 
                .stat:hover .stat__img img{transform:scale(1.08)}
            }

        @media (max-width:1399px){
            .stat{padding:26px 24px 24px;min-height:240px}
        }
        @media (max-width:1024px){
            .numbers{min-height:0;padding-block:100px}
            .numbers__inner{grid-template-columns:1fr;gap:48px}
            .stats{grid-template-columns:repeat(2,1fr)}
        }
        @media (max-width:767px){
            .numbers{padding-block:72px}
            .stats{grid-template-columns:1fr 1fr;gap:12px}
            .stat{min-height:190px;padding:18px 16px}
            .stat__num{margin-top:10px}
            .stat__num small{font-size:15px}
            .stat__note{padding-right:0;padding-top:14px}
            .stat__img{width:56px;right:12px;top:12px;bottom:auto;border-radius:4px}
        }
        @media (max-width:640px){
            .stat__img{position: relative;inset: auto;width: 100%;margin-top: 15px;}
        }
        @media (max-width:479px){
            .stats{grid-template-columns: 1fr;}
        }

    /* 주요실적 */
        .works__sli{position:relative}
        .works__swiper{position: relative;clip-path: inset(-200% -200% -200% 0);}
        .gallery-list{display: grid;gap: var(--row-gap60) var(--col-gap30);grid: auto / repeat(4, 1fr);}
        .gallery-list.swiper-wrapper{display: flex; gap: 0;}
        .gallery-list > li{position: relative; height: auto; display: flex; flex-direction:column; gap: 22px;}
        .gallery-list .thumb{position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:var(--radius);background:var(--gray-100);}
        .gallery-list .thumb img{width:100%;height:100%;object-fit:cover;transition:all 1s var(--ease);}
        .gallery-list .thumb:after{content:"View";position:absolute;left:50%;top:50%;width:clamp(96px, 15vw, 150px); aspect-ratio: auto 1;translate: -50% -50%;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(242,112,48,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-family:var(--font-en);font-size:18px;font-weight:600;letter-spacing:.04em;color:var(--white);opacity:0;transform:scale(.7);transition:all 0.7s var(--ease);pointer-events:none;}
        .gallery-list .info{position: relative;display: grid;gap: var(--row-gap15);}
        .gallery-list .desc{display: grid; gap: 10px;}
        .gallery-list .desc :where(dt, dd){white-space:normal; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all;}
        .gallery-list .desc dt{font-size:var(--text-22);font-weight:600;line-height:1.45;letter-spacing:-.025em;color:#111;}
        .gallery-list .desc dd{font-family:var(--font-en);font-size:var(--text-16);letter-spacing:.04em;color:var(--ink-3);}
        .gallery-list .regdate{font-size:var(--text-14);font-weight:400;color:var(--black-color09); display: none;}

            @media (hover:hover) and (pointer: fine) {
                .gallery-list > li:hover .thumb:after{opacity:1;transform:scale(1)}
                .gallery-list > li:hover .thumb img{transform:scale(1.05)}
                .gallery-list > li:hover .desc dt{color:var(--navy)}
            }

        @media (max-width:1024px){
            .gallery-list{grid: auto / repeat(2, 1fr);}
        }

    /* 새로운소식 */
        .notice{background:linear-gradient(180deg,#eef2f8 0%,#f6f8fb 45%,var(--white) 100%)} 
        .notice__inner{display:grid;grid-template-columns:440px minmax(0,1fr);gap:120px;align-items:start} 
        .notice__actions{display:flex;align-items:flex-start;gap:20px;margin-top:40px}
        .board-list{position: relative; border-top:1px solid var(--line);}
        .board-list > li{position: relative;border-bottom:1px solid var(--line);padding: clamp(18px, 3vw, 30px) clamp(14px, 2.4vw, 24px);transition:all 0.4s}
        .board-list .desc{display:flex;align-items:center;justify-content: space-between;gap: clamp(14px, 2.4vw, 24px);}
        .board-list .desc dt{font-size: var(--text-20);font-weight:600;color:#111;letter-spacing:-.02em;line-height:1.5;white-space:normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
        .board-list .desc dd{font-family:var(--font-en);font-size: var(--text-16);font-weight:500;letter-spacing:.04em;color:var(--ink-3);flex-shrink: 0;}

            @media (hover:hover) and (pointer: fine) {
                .board-list > li:hover{background:rgba(0,32,96,.05)}
                .board-list > li:hover .desc dt{color:var(--navy);}
            }
        
        @media (max-width:1024px){
            .notice__inner{grid-template-columns:1fr;gap:40px}
            .notice__actions{flex-direction:row;align-items:center;gap:28px;margin-top:28px}
        }
        @media (max-width:767px){
            .notice__actions{flex-direction:column;align-items:flex-start;gap:16px}
            .board-list .desc{flex-wrap:wrap;}
            .board-list .desc dd{width:100%; flex-shrink:unset;}
        }

    /* 문의 */
        .cta{padding:0 0 var(--section);background:var(--white)}
        .cta__banner{position:relative;overflow:hidden;border-radius:var(--radius);padding:clamp(48px,6.5vw,120px);color:var(--white);isolation:isolate}
        .cta__banner .db-img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 1.4s var(--ease)}
        .cta__banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,21,63,.55) 0%,rgba(0,21,63,.3) 55%,rgba(0,21,63,.08) 100%)}
        .cta__body{position:relative;max-width:720px}
        .cta__title{font-size:44px;font-weight:700;line-height:1.35;letter-spacing:-.03em}
        .cta__sub{margin-top:18px;font-size:19px;line-height:1.7;color:rgba(255,255,255,.85)}
        .cta__btn{display:inline-flex;align-items:center;gap:12px;margin-top:40px;padding:20px 32px;line-height:1;border-radius:999px;background:rgba(0,0,0,.12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.25);font-size:18px;font-weight:700;color:var(--white);transition:all 0.4s var(--ease)}
        .cta__btn .pill__arrow{background:currentColor}

            @media (hover:hover) and (pointer: fine) {
                .cta__banner:hover .db-img{transform:scale(1.06)}
                .cta__btn:hover{background:var(--accent);border-color:var(--accent);transform:translateX(4px)}
                .cta__btn:hover .pill__arrow{animation:planeFly .7s cubic-bezier(.4,0,.2,1)}
            }
        @media (max-width:1024px){
            .cta__title{font-size:32px}
        }
        @media (max-width:767px){
            .cta__banner{padding:40px 24px}
            .cta__banner::before{background:linear-gradient(180deg,rgba(0,21,63,.35) 0%,rgba(0,21,63,.6) 100%)}
            .cta__title{font-size:26px}
            .cta__sub{font-size:16px;margin-top:14px}
            .cta__btn{padding:15px 24px;font-size:16px;margin-top:28px}
        }


/*─────────────────────────────────────────────────────────
    Footer
─────────────────────────────────────────────────────────*/
    /* 하단 */
        #footer{position:sticky;bottom:0;z-index:0;background:#f8f8f8;color:var(--ink-2);font-size:16px;padding:clamp(48px,4.5vw,72px) 0 clamp(30px,3vw,48px)}
        #footer .logo{max-width: clamp(170px, 21vw, 200px);}
        .footer__top{display:flex;justify-content:space-between;align-items:center;gap:32px}
        .footer__dl{display:inline-flex;align-items:center;gap:12px;padding:18px 30px;border-radius:999px;border:1px solid var(--navy);font-size:17px;font-weight:600;line-height:1;color:var(--navy);transition:all 0.4s}
        .footer__dl:hover{background:var(--navy);color:var(--white)}
        .footer__dl-icon{width:17px;height:17px;flex:none;order:2;background:var(--accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M6 10l6 6 6-6M4 20h16'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M6 10l6 6 6-6M4 20h16'/%3E%3C/svg%3E") center/contain no-repeat;transition:background .3s}
        .footer__dl:hover .footer__dl-icon{background:var(--white)}
        .footer__list{display:flex;flex-wrap:wrap;gap:14px 48px;margin-top:36px}
        .footer__list li{display:flex;gap:12px;font-size: var(--text-17);color:var(--ink-2);line-height:1.6}
        .footer__list li:nth-child(odd):not(:last-child){width:300px}
        .footer__list li:nth-child(even){flex:1 1 calc(100% - 348px)} 
        .footer__list li:last-child{width:100%}
        .footer__list strong{flex:0 0 120px;font-weight:700;color:var(--text)}
        .footer__bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:30px;padding-top:30px;border-top:1px solid var(--line);font-size: var(--text-15);color:var(--ink-3)}
        .footer__copy{margin:0}
        .footer__copy strong{font-weight:700;color:var(--ink-2)}
        .footer__by{color:var(--ink-3)}
        .footer__links{display:flex;align-items:center;gap: clamp(15px, 2vw, 20px);font-size: var(--text-16);color:var(--text)}
        .footer__links .is-strong{font-weight:600}
        .footer__links li{position: relative;}
        .footer__links li:first-child > a{font-weight: 600;}
        .footer__links li + li{padding-left: clamp(15px, 2vw, 20px);}
        .footer__links li + li::before{content:"";position:absolute;left:0;top:50%;width:1px;height: clamp(8px, 1.3vw, 11px);background:var(--line);transform:translateY(-50%)}
        @media (max-width:767px){
            #footer{position:relative}
            .footer__top{flex-direction:column;align-items:flex-start;gap:20px}
            .footer__dl{font-size:15px;padding:13px 20px}
            .footer__list{margin-top:28px;gap:8px 0}
            .footer__list li{width:100%}
            .footer__list li:nth-child(odd):not(:last-child){width:100%}
            .footer__list li:nth-child(even){flex:0 0 100%}
            .footer__list strong{flex-basis:96px}
            .footer__bottom{flex-direction:column;align-items:flex-start;gap:12px;}
        }

    /* 탑버튼 */
        .totop{position:fixed;right:clamp(15px, 3.2vw, 32px);bottom:clamp(15px, 3.2vw, 32px);z-index:80;width:clamp(48px, 6vw, 60px);aspect-ratio: auto 1;border-radius:50%;background:var(--white);color:var(--navy);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(100%);transition:opacity .3s,transform .3s var(--ease),visibility 0s .3s,color .2s}
        .totop.is-visible{opacity:1;visibility:visible;transform:none;transition-delay:0s}
        .totop__ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none}
        .totop__track{stroke:var(--gray-300);stroke-width:3}
        .totop__progress{stroke:var(--navy);stroke-width:3;stroke-linecap:round;stroke-dasharray:170;stroke-dashoffset:170;transition:stroke-dashoffset .15s linear}
        .totop__arrow{position:relative;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}