/* Influencer landing overrides layered on the shared brand editorial system. */
body[data-landing-role="influencer"]:not(.influencer-editorial)>.top-nav,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.inf-hero,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.trust-section,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.core-services-section,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.process-section,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.system-features-section,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.value-section,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.inf-faq,
body[data-landing-role="influencer"]:not(.influencer-editorial)>.inf-cta{
    visibility:hidden;
}

body.influencer-editorial #scrollToTop{display:none!important}
body.influencer-editorial .fp-hero-media video{object-position:center 16%;filter:none}
body.influencer-editorial .fp-hero-copy{
    left:50%;
    width:min(980px,calc(100% - 48px));
    text-align:center;
    transform:translateX(-50%);
}
body.influencer-editorial .fp-hero-description{
    width:min(680px,calc(100% - 40px))!important;
    margin:44px auto 0!important;
}
body.influencer-editorial .fp-hero-web-links{
    left:50%;
    bottom:208px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:10px;
    width:auto;
    transform:translateX(-50%);
}
body.influencer-editorial .fp-hero-web-entry{
    display:inline-flex;
    min-width:150px;
    min-height:50px;
    align-items:center;
    justify-content:center;
    padding:0 22px;
    border:1px solid rgba(255,255,255,.72);
    border-radius:10px;
    color:#fff;
    background:rgba(18,18,18,.36);
    font-size:14px;
    font-weight:800;
    line-height:1.2;
    text-decoration:none;
}
body.landing-page.brand-editorial.influencer-editorial .fp-hero-action.fp-hero-web-links .fp-hero-web-entry.primary{
    border-color:#111!important;
    color:#fff!important;
    background:#111!important;
}
body.landing-page.brand-editorial.influencer-editorial .fp-hero-action.fp-hero-web-links .fp-hero-web-entry.primary:hover{
    border-color:#000!important;
    color:#fff!important;
    background:#000!important;
}
body.influencer-editorial .fp-hero-web-entry:focus-visible{
    outline:2px solid #fff;
    outline-offset:4px;
}
body.influencer-editorial .fp-feature-backdrop{
    background:
        radial-gradient(circle at 16% 58%,rgba(178,132,78,.52),transparent 36%),
        radial-gradient(circle at 76% 16%,rgba(66,48,38,.72),transparent 40%),
        linear-gradient(90deg,#4a3727,#181b19 74%);
}
body.influencer-editorial .fp-influencer-feature-image{
    width:100%;
    height:260px;
    margin-top:28px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:18px;
    object-fit:contain;
    object-position:center;
    background:#f7f7f5;
    box-shadow:0 18px 46px rgba(0,0,0,.18);
}
body.influencer-editorial .fp-creator-start-cta .fp-influencer-cta-media{
    right:-2%;
    width:62%;
    background-image:url('/static/images/landing-phone-creator-product.webp');
    background-size:contain;
    background-position:right center;
    background-repeat:no-repeat;
    opacity:.46;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.22) 24%,#000 62%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.22) 24%,#000 62%);
}
body.influencer-editorial .fp-creator-income-cta{background:#090909}
body.influencer-editorial .fp-creator-income-cta .fp-fulfillment-copy p{max-width:560px}
body.influencer-editorial .fp-footer-card .footer-social{display:none!important}

@media(min-width:769px){
    body.influencer-editorial .fp-footer-card .footer-bottom{
        grid-template-columns:minmax(0,1fr) auto;
    }
    body.influencer-editorial .fp-footer-card .footer-payment-badge{
        grid-column:2;
        justify-self:end;
    }
}

@media(max-width:768px){
    body.influencer-editorial .fp-hero-copy{
        top:112px;
        left:50%;
        width:calc(100% - 40px);
        padding:0;
        transform:translateX(-50%);
    }
    body.influencer-editorial .fp-hero-copy h1{font-size:39px;line-height:1.02;letter-spacing:-.045em}
    body.influencer-editorial .fp-hero-copy h1 span{word-break:keep-all}
    body.influencer-editorial .fp-hero-description{width:100%!important;max-width:320px;margin-top:28px!important}
    body.influencer-editorial .fp-hero-web-links{
        bottom:130px;
        display:flex;
        flex-wrap:wrap;
        flex-direction:row;
        gap:8px;
        width:calc(100% - 40px);
        max-width:342px;
    }
    body.influencer-editorial .fp-hero-media video{object-position:center}
    body.influencer-editorial .fp-feature-card{height:auto;min-height:450px}
    body.influencer-editorial .fp-feature-card header,
    body.influencer-editorial .fp-feature-card>p,
    body.influencer-editorial .fp-feature-card>.fp-influencer-feature-image{flex-shrink:0}
    body.influencer-editorial .fp-influencer-feature-image{height:220px;margin-top:24px;border-radius:16px}
    body.influencer-editorial .fp-creator-start-cta .fp-influencer-cta-media{
        right:-16%;
        bottom:6%;
        width:96%;
        opacity:.36;
        background-position:right bottom;
    }
}

/* 인플루언서 하단 CTA를 낮고 넓은 단일 검은색 배너로 구성한다. */
body.influencer-editorial .fp-bottom-banner-row{
    grid-template-columns:minmax(0,1fr);
    gap:0;
    width:min(1280px,calc(100% - 16px));
}
body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta{
    width:100%;
    min-height:390px;
    color:#fff;
    background:#090909;
}
body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta::after{
    background:linear-gradient(90deg,rgba(9,9,9,.99) 0%,rgba(9,9,9,.96) 48%,rgba(9,9,9,.58) 76%,rgba(9,9,9,.32) 100%);
}
body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-media{
    right:2%;
    width:30%;
    background-size:90% auto;
    opacity:.34;
    filter:saturate(.58) contrast(.96) brightness(.86);
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.38) 30%,#000 66%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.38) 30%,#000 66%);
}
body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta .fp-influencer-cta-content{
    display:flex;
    justify-content:center;
    min-height:390px;
    width:min(900px,62%);
    padding:40px 64px;
}
body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content h2{
    color:#fff;
    font-size:clamp(40px,2.7vw,52px);
}
body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content>span{
    margin-top:20px;
    color:rgba(255,255,255,.66);
}
body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content>a{
    align-self:flex-start;
    margin-top:26px;
    border-color:#fff;
    color:#111;
    background:#fff;
}
body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content>a:hover{
    color:#111;
    background:#e8e8e8;
}
@media(max-width:768px){
    body.influencer-editorial .fp-bottom-banner-row{width:100%}
    body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta{min-height:400px}
    body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta .fp-influencer-cta-content{
        justify-content:flex-start;
        min-height:400px;
        width:100%;
        padding:38px 26px;
    }
    body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content h2{font-size:38px}
    body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-media{
        right:-22%;
        bottom:-6%;
        width:66%;
        opacity:.2;
    }
}

/* 인플루언서 랜딩 로그인은 앱 로그인 화면의 아이디·SNS 5종 구조를 따른다. */
body.influencer-editorial .login-modal{
    display:flex;
    flex-direction:column;
    width:480px;
}

body.influencer-editorial .inf-hero.inf-hero--banner .hero-signup-cta{
    min-width:190px;
    min-height:58px;
    justify-content:center;
    padding:0 32px;
    border-color:#111;
    color:#fff;
    background:#111;
    font-size:19px;
    font-weight:700;
    line-height:1.2;
}
body.influencer-editorial .inf-hero.inf-hero--banner .hero-signup-cta:hover{
    border-color:#000;
    color:#fff;
    background:#000;
}
body.influencer-editorial .login-modal-logo{
    display:flex;
    order:1;
    margin-bottom:20px;
}
body.influencer-editorial .login-modal-wordmark{
    width:210px;
    height:auto;
    filter:none;
}
body.influencer-editorial .login-modal-header{
    order:2;
    margin-bottom:28px;
    text-align:left;
}
body.influencer-editorial .login-modal-title{
    margin:0;
}
body.influencer-editorial .login-modal-form{
    display:block;
    order:3;
}
body.influencer-editorial #loginModalSnsButtons{
    order:4;
}
body.influencer-editorial .login-modal-register-bar{
    order:5;
    margin-top:24px;
}

@media(min-width:769px){
    body.influencer-editorial .login-modal{
        justify-content:flex-start;
        max-height:calc(100vh - 48px);
        overflow-y:auto;
        padding-top:40px;
        padding-bottom:32px;
        box-sizing:border-box;
    }
}

/* 인플루언서 모바일: 브랜드 랜딩과 동일한 타이포 위계와 버튼 폭으로 맞춘다. */
@media(max-width:768px){
    body.influencer-editorial .fp-hero-copy{top:158px}
    body.influencer-editorial .fp-hero-copy h1{
        font-size:clamp(34px,9.2vw,42px);
        line-height:1.1;
        letter-spacing:-.04em;
    }
    body.influencer-editorial .fp-hero-description{
        max-width:330px;
        margin-top:24px!important;
        font-size:15px!important;
        line-height:1.55!important;
    }
    body.influencer-editorial .fp-hero-web-links{
        bottom:120px;
        justify-content:center;
        width:auto;
        max-width:calc(100% - 40px);
    }
    body.influencer-editorial .fp-hero-web-entry{
        min-width:0;
        width:auto;
        min-height:46px;
        padding:0 24px;
        font-size:14px;
    }
    body.influencer-editorial .fp-feature-card{
        height:auto;
        min-height:0;
    }
    body.influencer-editorial .fp-influencer-feature-image{
        height:auto;
        margin-top:22px;
        border-radius:16px;
    }
    body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta,
    body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta .fp-influencer-cta-content{
        min-height:0;
    }
    body.influencer-editorial .fp-bottom-banner.fp-creator-single-cta .fp-influencer-cta-content{
        padding:38px 24px;
    }
    body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content h2{
        font-size:30px;
        line-height:1.2;
        letter-spacing:-.035em;
    }
    body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content>span{
        margin-top:16px;
        font-size:15px;
        line-height:1.55;
    }
    body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content>a{
        align-self:flex-start;
        width:auto;
        min-width:0;
        min-height:46px;
        margin-top:24px;
        padding:0 22px;
        font-size:14px;
    }
}

/* 판매방식 섹션(내 채널과 콘텐츠에 맞는)과 하단 배너도 브랜드 랜딩과 같은 겹침 규칙을 따른다.
   히어로→인트로 기준: 음수 마진 + z-index + 상단 라운딩 + 불투명 배경 + overflow 클립.
   z-index 순서는 인트로 2 → 판매방식 3 → FAQ 4 → 배너 6 → 푸터 8. */
body.influencer-editorial .fp-feature-stage{
    position:relative;
    z-index:3;
    margin-top:-40px;
    border-radius:var(--fp-r) var(--fp-r) 0 0;
    overflow:clip;
}
body.influencer-editorial .fp-feature-backdrop{
    border-radius:inherit;
}
body.influencer-editorial .fp-bottom-banner-section{
    position:relative;
    z-index:6;
    margin-top:-40px;
    border-radius:var(--fp-r) var(--fp-r) 0 0;
    overflow:hidden;
    background:var(--fp-gray);
}

@media(min-width:1101px){
    /* 데스크톱은 고정 높이 계산을 쓰므로 겹친 40px만큼 상단 패딩으로 되돌린다. */
    body.influencer-editorial .fp-feature-stage{
        padding-top:200px;
    }
    /* FAQ·푸터만 --fp-stack-lift로 끌어올려지므로 사이의 배너도 같은 스택에 합류시킨다. */
    body.influencer-editorial .fp-bottom-banner-section{
        transform:translate3d(0,var(--fp-stack-lift),0);
    }
}

@media(max-width:768px){
    body.influencer-editorial .fp-feature-nav{
        padding-top:104px;
    }
    body.influencer-editorial .fp-bottom-banner-section{
        padding-top:64px;
    }

    /* 로그인 모달: 데스크톱용 고정 폭 480px과 여백을 모바일 기준으로 되돌린다.
       (`body.influencer-editorial .login-modal`이 landing.css의 `.login-modal`보다
        특이성이 높아 미디어쿼리만으로는 480px를 못 이긴다. 같은 특이성으로 덮는다.) */
    body.influencer-editorial .login-modal{
        width:min(400px,calc(100vw - 40px));
        max-width:calc(100vw - 40px);
        margin-right:auto;
        margin-left:auto;
        padding:26px 20px 22px;
    }
    body.influencer-editorial .login-modal-logo{
        margin-bottom:10px;
    }
    body.influencer-editorial .login-modal-wordmark{
        width:150px;
        height:auto;
    }
    body.influencer-editorial .login-modal-header{
        margin-bottom:16px;
    }
    body.influencer-editorial .login-modal-register-bar{
        margin-top:14px;
    }
}

@media(max-width:768px) and (max-height:640px){
    body.influencer-editorial .login-modal-logo{
        margin-bottom:6px;
    }
    body.influencer-editorial .login-modal-header{
        margin-bottom:12px;
    }
}

/* 모바일 히어로 카피와 CTA는 svh에 연속적으로 반응해 주소창 높이 변화에도
   700px 경계에서 위치나 섹션 높이가 불연속적으로 바뀌지 않게 한다. */
@media(max-width:768px){
    body.brand-editorial.influencer-editorial .fp-brand-experience{
        opacity:1;
        transform:none;
        transition:none;
    }
    body.influencer-editorial .fp-hero-copy{
        top:calc(clamp(140px,18svh,158px) + 24px)!important;
    }
    body.influencer-editorial .fp-hero-copy h1,
    body.influencer-editorial .fp-hero-copy h1 span{
        color:#fff!important;
    }
    body.influencer-editorial .fp-hero-description{
        color:#fff!important;
        font-size:17px!important;
    }
    body.influencer-editorial .fp-hero-action.fp-hero-web-links{
        top:calc(clamp(430px,55svh,470px) - 24px);
        bottom:auto;
        left:50%;
        justify-content:center;
        width:auto;
        max-width:calc(100% - 40px);
        transform:translateX(-50%);
    }
    body.landing-page.brand-editorial.influencer-editorial .fp-hero-action.fp-hero-web-links .fp-hero-web-entry.primary,
    body.landing-page.brand-editorial.influencer-editorial .fp-hero-action.fp-hero-web-links .fp-hero-web-entry.primary:hover{
        border-color:#fff!important;
        color:#151515!important;
        background:#fff!important;
    }
}

/* 720x1280 원본의 얼굴 중심(x≈38%, 동작 범위 38~45%)을 화면 중앙에 둔다.
   가로 132%와 hero 높이 기준 9:16 폭 중 큰 값을 사용해 빈 가장자리를 막는다. */
@media(max-width:768px){
    body.influencer-editorial .fp-hero-media video{
        position:absolute;
        top:50%;
        left:50%;
        width:max(132%,calc(max(640px,100svh)*.5625));
        height:auto;
        max-width:none;
        aspect-ratio:9/16;
        object-position:center;
        transform:translate(-38%,-50%);
    }
}

/* ===== 모바일 기기별 최적화 보강 (브랜드 랜딩과 동일 기준) ===== */

/* 터치 타깃 확보 */
@media(max-width:768px){
    body.influencer-editorial .fp-feature-nav nav a{
        display:inline-flex;
        align-items:center;
        min-height:42px;
    }
    body.influencer-editorial .landing-footer .footer-links a{
        display:inline-flex;
        align-items:center;
        min-height:40px;
    }
    body.influencer-editorial .fp-footer-card .footer-legal-links a{
        min-height:40px;
        padding:9px 12px;
        font-size:12px;
    }
    body.influencer-editorial .landing-footer .footer-social a{
        min-width:40px;
        min-height:40px;
    }
    body.influencer-editorial .fp-menu-panel-label{
        font-size:12px;
    }
    body.influencer-editorial .fp-footer-card .footer-partner-logo--escrow strong{
        font-size:12px;
    }
    body.influencer-editorial .fp-footer-card .footer-partner-logo--escrow small{
        font-size:11px;
    }
    body.influencer-editorial .fp-footer-card .footer-partner-logo--escrow{
        width:auto;
        min-width:132px;
        height:auto;
        min-height:40px;
        padding:6px 10px;
    }
    body.influencer-editorial .fp-footer-card .footer-partner-logo--escrow i{
        font-size:17px;
    }
}

/* 320px 이하 초소형 화면 타이포 보정 */
@media(max-width:340px){
    body.influencer-editorial .fp-hero-copy h1{
        font-size:clamp(28px,9vw,34px);
    }
    body.influencer-editorial .fp-creator-single-cta .fp-influencer-cta-content h2{
        font-size:26px;
    }
}