/* ===== RESET & BASE ===== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#2C3E50;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
main{display:block}

/* ===== SKIP TO CONTENT ===== */
.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--coral);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;z-index:10000;font-weight:700;font-size:16px;transition:top .2s}
.skip-link:focus{top:0}

/* ===== DESIGN TOKENS ===== */
:root{
  --navy:#0F1E2F;
  --navy-light:#1a2d42;
  --coral:#FF6B4A;
  --coral-hover:#e85a3a;
  --coral-glow:rgba(255,107,74,0.25);
  --mint:#4ECDC4;
  --mint-glow:rgba(78,205,196,0.2);
  --white:#FFFFFF;
  --off-white:#F8F9FA;
  --light-mint:#D4F5F3;
  --dark-gray:#2C3E50;
  --mid-gray:#5A6B7A;
  --light-gray:#E9ECEF;
  --soft-red:#E74C3C;
  --light-red:#FFF5F3;
  --red-border:#FFB8A8;
  --shadow-card:0 4px 20px rgba(0,0,0,0.06);
  --shadow-card-hover:0 16px 48px rgba(0,0,0,0.12);
  --shadow-cta:0 4px 16px rgba(255,107,74,0.35);
  --shadow-cta-lg:0 8px 32px rgba(255,107,74,0.45);
  --radius:20px;
  --radius-sm:14px;
  --radius-xs:8px;
  --content-max:740px;
  --section-pad:clamp(48px,8vw,80px);
  --grad-hero:linear-gradient(135deg,#0F1E2F 0%,#162a3f 40%,#1a3350 70%,#0F1E2F 100%);
  --grad-coral:linear-gradient(135deg,#FF6B4A,#FF8A6B);
  --grad-mint:linear-gradient(135deg,#4ECDC4,#6BE0D8);
  --grad-glass:linear-gradient(135deg,rgba(255,255,255,0.08),rgba(255,255,255,0.02));
}

/* ===== LAYOUT ===== */
.section{padding:var(--section-pad) 24px}
.section__inner{max-width:var(--content-max);margin:0 auto}
.bg-navy{background:var(--navy);color:var(--white)}
.bg-white{background:var(--white)}
.bg-off{background:var(--off-white)}

/* ===== TYPOGRAPHY (Fluid) ===== */
.h1{font-size:clamp(28px,5vw,48px);font-weight:800;line-height:1.2;letter-spacing:-0.02em}
.h2{font-size:clamp(24px,4vw,36px);font-weight:800;line-height:1.25;color:var(--navy);letter-spacing:-0.01em}
.h3{font-size:clamp(18px,3vw,24px);font-weight:700;line-height:1.35}
.body-lg{font-size:clamp(16px,2.5vw,20px);font-weight:500;line-height:1.6}
.body{font-size:clamp(15px,2vw,17px);font-weight:400;line-height:1.7}
.caption{font-size:clamp(12px,1.8vw,14px);font-weight:400;color:var(--mid-gray);line-height:1.5}
.num-accent{font-size:clamp(44px,9vw,80px);font-weight:900;background:var(--grad-coral);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}
.text-center{text-align:center}
.text-white{color:var(--white)}
.text-coral{color:var(--coral)}
.text-mint{color:var(--mint)}
.text-navy{color:var(--navy)}
.text-red{color:var(--soft-red)}
.text-muted{color:var(--mid-gray)}

/* ===== SPACERS ===== */
.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-40{margin-top:40px}.mt-48{margin-top:48px}
.mb-16{margin-bottom:16px}.mb-24{margin-bottom:24px}

/* ===== DECORATIVE SECTION DIVIDERS ===== */
.section-divider{position:relative;height:4px;background:linear-gradient(90deg,transparent,var(--mint),var(--coral),transparent);opacity:0.3}

/* ===== SCROLL PROGRESS BAR ===== */
.scroll-progress{position:fixed;top:0;left:0;width:0%;height:3px;background:linear-gradient(90deg,var(--coral),var(--mint));z-index:9999;border-radius:0 2px 2px 0}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:inherit;font-weight:700;border:none;cursor:pointer;transition:all .3s cubic-bezier(0.25,0.46,0.45,0.94);gap:8px;position:relative;overflow:hidden;min-height:48px}
.btn-primary{background:var(--grad-coral);color:var(--white);padding:18px 44px;border-radius:var(--radius-sm);font-size:18px;box-shadow:var(--shadow-cta);min-width:280px}
.btn-primary:hover{box-shadow:var(--shadow-cta-lg);transform:translateY(-3px) scale(1.02)}
.btn-primary:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.btn-large{padding:22px 52px;font-size:clamp(17px,2.5vw,20px);border-radius:var(--radius);min-width:320px;box-shadow:var(--shadow-cta-lg)}
.btn-outline{background:transparent;color:var(--coral);border:2px solid var(--coral);padding:14px 32px;border-radius:var(--radius-xs);font-size:16px;font-weight:600;min-height:48px}
.btn-outline:hover{background:var(--coral);color:var(--white)}
.btn-outline:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.btn-outline-white{background:transparent;color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.3);padding:14px 32px;border-radius:var(--radius-xs);font-size:16px;font-weight:400;min-height:48px}
.btn-outline-white:hover{border-color:rgba(255,255,255,.6);color:var(--white);background:rgba(255,255,255,.05)}
.btn-outline-white:focus-visible{outline:3px solid rgba(255,255,255,.6);outline-offset:3px}
.btn-kakao{background:#FEE500;color:#191919;padding:16px 36px;border-radius:12px;font-size:16px;font-weight:600;min-height:48px;display:inline-flex;align-items:center;gap:8px;border:none;transition:background .2s,transform .2s,box-shadow .2s}
.btn-kakao:hover{background:#F5DC00;transform:translateY(-2px);box-shadow:0 4px 16px rgba(254,229,0,.4);color:#191919}
.btn-kakao:focus-visible{outline:3px solid #FEE500;outline-offset:3px}
.btn-kakao.btn-large{padding:20px 48px;font-size:clamp(17px,2.5vw,19px);border-radius:14px;min-width:320px}
.btn-kakao svg{flex-shrink:0}

/* ===== RIPPLE ===== */
.btn .ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,0.3);transform:scale(0);animation:rippleEffect 0.6s ease-out forwards;pointer-events:none}
@keyframes rippleEffect{0%{transform:scale(0);opacity:1}100%{transform:scale(4);opacity:0}}

/* ===== CARDS (Glassmorphism Enhanced) ===== */
.card{background:var(--white);border:1px solid rgba(0,0,0,0.06);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:32px;transition:transform .35s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .35s ease;position:relative}
.card::before{content:'';position:absolute;inset:-1px;border-radius:var(--radius);background:linear-gradient(135deg,rgba(78,205,196,0.15),transparent 50%,rgba(255,107,74,0.1));z-index:-1;opacity:0;transition:opacity .35s}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-card-hover)}
.card:hover::before{opacity:1}

/* ===== BADGES ===== */
.badge{display:inline-block;background:linear-gradient(135deg,var(--light-mint),#e8faf8);color:var(--navy);font-size:13px;padding:6px 14px;border-radius:20px;font-weight:500;border:1px solid rgba(78,205,196,0.15)}

/* ===== ANIMATIONS ===== */
.fade-up{opacity:0;transform:translateY(35px);transition:opacity .7s cubic-bezier(0.25,0.46,0.45,0.94),transform .7s cubic-bezier(0.25,0.46,0.45,0.94)}
.fade-up.visible{opacity:1;transform:translateY(0)}
.fade-up.delay-1{transition-delay:.1s}.fade-up.delay-2{transition-delay:.2s}.fade-up.delay-3{transition-delay:.3s}.fade-up.delay-4{transition-delay:.4s}

.slide-left{opacity:0;transform:translateX(-50px);transition:opacity .7s cubic-bezier(0.25,0.46,0.45,0.94),transform .7s cubic-bezier(0.25,0.46,0.45,0.94)}
.slide-left.visible{opacity:1;transform:translateX(0)}
.slide-right{opacity:0;transform:translateX(50px);transition:opacity .7s cubic-bezier(0.25,0.46,0.45,0.94),transform .7s cubic-bezier(0.25,0.46,0.45,0.94)}
.slide-right.visible{opacity:1;transform:translateX(0)}
.scale-in{opacity:0;transform:scale(0.88);transition:opacity .6s cubic-bezier(0.25,0.46,0.45,0.94),transform .6s cubic-bezier(0.25,0.46,0.45,0.94)}
.scale-in.visible{opacity:1;transform:scale(1)}
.section-reveal{opacity:0;transition:opacity .8s ease}.section-reveal.visible{opacity:1}

/* ===== HERO ===== */
.hero{padding:clamp(70px,12vw,100px) 24px clamp(50px,8vw,70px);text-align:center;position:relative;overflow:hidden;background:var(--grad-hero)}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 20%,rgba(78,205,196,.1) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(255,107,74,.08) 0%,transparent 50%);pointer-events:none}
.hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(to top,rgba(15,30,47,0.5),transparent);pointer-events:none}

/* Hero particles */
.hero-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-particle{position:absolute;border-radius:50%;animation:floatParticle 6s ease-in-out infinite}
.hero-particle:nth-child(1){width:4px;height:4px;background:rgba(78,205,196,0.4)}
.hero-particle:nth-child(2){width:6px;height:6px;background:rgba(255,107,74,0.25);animation-duration:8s;animation-delay:1s}
.hero-particle:nth-child(3){width:3px;height:3px;background:rgba(78,205,196,0.3);animation-duration:7s;animation-delay:2s}
.hero-particle:nth-child(4){width:5px;height:5px;background:rgba(255,255,255,0.12);animation-duration:9s;animation-delay:.5s}
.hero-particle:nth-child(5){width:4px;height:4px;background:rgba(78,205,196,0.25);animation-duration:6.5s;animation-delay:3s}
.hero-particle:nth-child(6){width:7px;height:7px;background:rgba(255,107,74,0.18);animation-duration:10s;animation-delay:1.5s}
.hero-particle:nth-child(7){width:3px;height:3px;background:rgba(255,255,255,0.08);animation-duration:7.5s;animation-delay:4s}
.hero-particle:nth-child(8){width:5px;height:5px;background:rgba(78,205,196,0.2);animation-duration:8.5s;animation-delay:2.5s}
@keyframes floatParticle{0%{transform:translateY(0) translateX(0);opacity:0}10%{opacity:1}50%{transform:translateY(-130px) translateX(35px);opacity:.7}90%{opacity:.15}100%{transform:translateY(-260px) translateX(-25px);opacity:0}}

/* Hero text reveal */
.hero__headline{margin-bottom:24px;position:relative;z-index:1}
.hero__headline .num-accent{font-size:clamp(44px,9vw,80px)}
.hero__headline .h1{display:inline}
.hero__headline .num-accent,.hero__headline .h1{opacity:0;display:inline-block;transform:translateY(40px)}
.hero.animated .hero__headline .num-accent:first-child{animation:heroTextReveal .8s cubic-bezier(0.16,1,0.3,1) .2s forwards}
.hero.animated .hero__headline .h1:nth-child(2){animation:heroTextReveal .8s cubic-bezier(0.16,1,0.3,1) .35s forwards}
.hero.animated .hero__headline .h1:nth-child(3){animation:heroTextReveal .8s cubic-bezier(0.16,1,0.3,1) .5s forwards}
.hero.animated .hero__headline .num-accent:nth-child(4){animation:heroTextReveal .8s cubic-bezier(0.16,1,0.3,1) .65s forwards}
.hero.animated .hero__headline .h1:nth-child(5){animation:heroTextReveal .8s cubic-bezier(0.16,1,0.3,1) .8s forwards}
@keyframes heroTextReveal{0%{opacity:0;transform:translateY(40px)}100%{opacity:1;transform:translateY(0)}}

.hero__sub{font-size:clamp(16px,2.5vw,24px);font-weight:500;color:rgba(255,255,255,.85);margin-bottom:16px;line-height:1.5;position:relative;z-index:1}
.hero.animated .hero__sub{animation:heroFadeUp .7s cubic-bezier(0.16,1,0.3,1) 1s both}
.hero__desc{font-size:clamp(14px,2vw,17px);color:rgba(255,255,255,.65);margin-bottom:40px;line-height:1.7;position:relative;z-index:1}
.hero.animated .hero__desc{animation:heroFadeUp .7s cubic-bezier(0.16,1,0.3,1) 1.2s both}
@keyframes heroFadeUp{0%{opacity:0;transform:translateY(24px)}100%{opacity:1;transform:translateY(0)}}

/* Hero badges (glassmorphism) */
.hero__badges{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:40px;position:relative;z-index:1}
.hero__badge{display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-sm);padding:14px 18px;min-width:155px;text-align:left;background:var(--grad-glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transform:translateY(20px) scale(0.95);transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),border-color .3s,background .3s}
.hero.animated .hero__badge:nth-child(1){animation:badgeSlideIn .5s cubic-bezier(0.16,1,0.3,1) 1.4s forwards}
.hero.animated .hero__badge:nth-child(2){animation:badgeSlideIn .5s cubic-bezier(0.16,1,0.3,1) 1.55s forwards}
.hero.animated .hero__badge:nth-child(3){animation:badgeSlideIn .5s cubic-bezier(0.16,1,0.3,1) 1.7s forwards}
.hero.animated .hero__badge:nth-child(4){animation:badgeSlideIn .5s cubic-bezier(0.16,1,0.3,1) 1.85s forwards}
@keyframes badgeSlideIn{0%{opacity:0;transform:translateY(20px) scale(0.95)}100%{opacity:1;transform:translateY(0) scale(1)}}
.hero__badge:hover{transform:translateY(-3px)!important;border-color:rgba(78,205,196,.5);background:rgba(78,205,196,.08)}
.hero__badge-icon{width:32px;height:32px;flex-shrink:0;color:var(--mint)}
.hero__badge-icon svg{width:32px;height:32px}
.hero__badge-text{font-size:13px;color:rgba(255,255,255,.7);line-height:1.3}
.hero__badge-text strong{display:block;color:var(--white);font-size:14px;font-weight:600}
.hero__cta-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;position:relative;z-index:1}
.hero.animated .hero__cta-wrap{animation:heroFadeUp .7s cubic-bezier(0.16,1,0.3,1) 2.1s both}
.hero__caption{font-size:14px;color:rgba(255,255,255,.5)}

/* CTA pulse */
@keyframes ctaPulse{0%{box-shadow:0 4px 16px rgba(255,107,74,.35)}50%{box-shadow:0 4px 32px rgba(255,107,74,.55),0 0 0 10px rgba(255,107,74,.08)}100%{box-shadow:0 4px 16px rgba(255,107,74,.35)}}
.btn-primary.cta-pulse{animation:ctaPulse 2.5s ease-in-out infinite}
.btn-primary.cta-pulse:hover{animation:none}

/* ===== SECTION 2: PAIN POINTS ===== */
.pain__card{background:var(--off-white);border-radius:var(--radius-sm);padding:24px;display:flex;gap:16px;align-items:flex-start;border:1px solid transparent;transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .3s,background .3s,border-color .3s}
.pain__card+.pain__card{margin-top:16px}
.pain__card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.06);background:var(--white);border-color:rgba(231,76,60,.12)}
.pain__icon{width:44px;height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--soft-red);background:var(--light-red);border-radius:12px;transition:transform .4s cubic-bezier(0.34,1.56,0.64,1)}
.pain__icon svg{width:24px;height:24px}
.pain__card:hover .pain__icon{transform:scale(1.15)}
.pain__card h3{font-size:18px;font-weight:700;color:var(--dark-gray);margin-bottom:6px}
.pain__card p{font-size:15px;color:var(--dark-gray);line-height:1.6}
.pain__loss{font-size:14px;font-weight:700;color:var(--soft-red);margin-top:6px}
.divider-text{display:flex;align-items:center;gap:24px;margin:40px 0 28px}
.divider-text::before,.divider-text::after{content:'';flex:1;height:2px;background:linear-gradient(90deg,transparent,var(--light-gray),transparent)}
.divider-text span{font-size:clamp(16px,3vw,24px);font-weight:700;color:var(--navy);white-space:nowrap;text-align:center}
.solution-list{list-style:none;display:flex;flex-direction:column;gap:14px}
.solution-list li{display:flex;align-items:center;gap:12px;font-size:clamp(16px,2.5vw,20px);font-weight:600;color:var(--dark-gray)}
.solution-list li svg{width:24px;height:24px;flex-shrink:0;color:var(--mint)}
.warning-box{background:var(--light-red);border:1px solid var(--red-border);border-radius:var(--radius-sm);padding:20px 24px;font-size:16px;font-weight:600;text-align:center;margin-top:40px;line-height:1.5}
.warning-box .highlight{font-weight:800;color:var(--soft-red)}
@keyframes subtleShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-3px)}40%{transform:translateX(3px)}60%{transform:translateX(-2px)}80%{transform:translateX(2px)}}
.warning-box.visible{animation:subtleShake .5s ease .8s}

/* ===== SECTION 3A: 5대 스킬 ===== */
.skill-card{margin-top:20px}
.skill-card__header{display:flex;align-items:center;gap:20px;margin-bottom:14px}
.skill-card__icon{width:56px;height:56px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--coral);background:linear-gradient(135deg,rgba(255,107,74,.1),rgba(255,107,74,.04));border-radius:14px;transition:transform .4s cubic-bezier(0.34,1.56,0.64,1)}
.skill-card__icon svg{width:28px;height:28px}
.card:hover .skill-card__icon{transform:rotate(-8deg) scale(1.12)}
.skill-card__label{font-size:12px;font-weight:600;color:var(--coral);margin-bottom:2px;letter-spacing:.05em;text-transform:uppercase}
.skill-card__title{font-size:clamp(16px,2.5vw,20px);font-weight:700;color:var(--navy)}
.skill-card__body{font-size:15px;line-height:1.7;color:var(--dark-gray);margin-bottom:14px}
.skill-card__tags{display:flex;flex-wrap:wrap;gap:8px}
.skill-card__example{font-size:13px;color:var(--mid-gray);margin-top:10px;font-style:italic;padding-left:12px;border-left:3px solid var(--light-gray)}

/* SEDA badges */
.seda-badges{display:flex;gap:10px;margin-top:14px}
.seda-badge{width:68px;height:68px;background:var(--navy);color:var(--white);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:22px;font-weight:800;line-height:1.2;transition:transform .3s cubic-bezier(0.34,1.56,0.64,1),background .3s}
.seda-badge span{font-size:11px;font-weight:400;margin-top:3px;opacity:.8}
.seda-badge:hover{transform:translateY(-5px) scale(1.08);background:var(--coral)}

/* GEO dual */
.geo-dual{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:start;margin-top:14px}
.geo-dual__plus{font-size:28px;font-weight:800;background:var(--grad-coral);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;align-self:center}
.geo-col h4{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:8px}
.geo-col ul{list-style:none;font-size:14px;color:var(--dark-gray)}
.geo-col ul li{padding:3px 0;padding-left:16px;position:relative}
.geo-col ul li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--mint)}

/* ===== SECTION 3B: 15개 AI 에이전트 ===== */
.timeline{position:relative;padding-left:28px}
.timeline::before{content:'';position:absolute;left:5px;top:8px;bottom:8px;width:2px;background:var(--light-gray)}
.timeline__line-progress{position:absolute;left:5px;top:8px;width:2px;height:0;background:var(--grad-coral);z-index:1;border-radius:2px}
.timeline__phase{margin-bottom:28px}
.timeline__phase-title{font-size:14px;font-weight:800;color:var(--navy);margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--light-gray);letter-spacing:.03em;text-transform:uppercase}
.timeline__item{display:flex;align-items:center;gap:12px;padding:7px 0;position:relative;transition:opacity .4s}
.timeline__item::before{content:'';position:absolute;left:-23px;width:12px;height:12px;background:var(--light-gray);border-radius:50%;transition:background .4s,transform .4s cubic-bezier(0.34,1.56,0.64,1),box-shadow .4s}
.timeline__item.active::before{background:var(--coral);transform:scale(1.3);box-shadow:0 0 0 5px var(--coral-glow)}
.timeline__item:not(.active){opacity:.4}
.timeline__item.active{opacity:1}
.timeline__item-name{font-size:15px;font-weight:600;color:var(--dark-gray)}
.timeline__item-role{display:inline-block;background:var(--light-mint);color:var(--navy);font-size:12px;padding:3px 10px;border-radius:20px;font-weight:500}

/* ===== SECTION 4: PORTFOLIO ===== */
.portfolio-card{background:var(--off-white);border-radius:var(--radius);padding:28px;margin-top:20px;border:1px solid rgba(0,0,0,.04);transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .3s}
.portfolio-card:hover{transform:translateY(-5px);box-shadow:0 12px 36px rgba(0,0,0,.08)}
.portfolio-card__header{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.portfolio-card__icon{width:36px;height:36px;color:var(--coral);transition:transform .4s cubic-bezier(0.34,1.56,0.64,1)}
.portfolio-card__icon svg{width:28px;height:28px}
.portfolio-card:hover .portfolio-card__icon{transform:rotate(12deg) scale(1.1)}
.portfolio-card__cat{font-size:18px;font-weight:700;color:var(--navy)}
.metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.metric{text-align:center;padding:16px;background:var(--white);border-radius:12px;border:1px solid rgba(0,0,0,.04)}
.metric__value{font-size:clamp(22px,4vw,28px);font-weight:800;background:var(--grad-coral);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.metric__label{font-size:13px;color:var(--mid-gray);margin-top:4px;font-weight:500}
.metric__detail{font-size:12px;color:var(--dark-gray);margin-top:2px}

/* Testimonials */
.testimonials{margin-top:40px}
.testimonial{background:var(--off-white);border-radius:var(--radius-sm);padding:24px 24px 24px 48px;margin-top:16px;position:relative;border:1px solid rgba(0,0,0,.04);transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .3s}
.testimonial:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.06)}
.testimonial__quote{font-size:48px;color:var(--coral);position:absolute;top:8px;left:16px;line-height:1;opacity:.4}
.testimonial__text{font-size:16px;font-style:italic;color:var(--dark-gray);line-height:1.6}
.testimonial__author{font-size:13px;color:var(--mid-gray);text-align:right;margin-top:10px;font-weight:500}

/* Stats box */
.stats-box{background:var(--grad-hero);border-radius:var(--radius);padding:44px 24px;margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;text-align:center;border:1px solid rgba(78,205,196,.1);position:relative;overflow:hidden}
.stats-box::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(78,205,196,.08),transparent 70%);pointer-events:none}
.stat__value{font-size:clamp(28px,5vw,42px);font-weight:900;background:var(--grad-coral);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transition:text-shadow .3s}
.stat__label{font-size:14px;color:rgba(255,255,255,.7);margin-top:6px;font-weight:500}

/* ===== SECTION 5: PRICING ===== */
.compare-table{width:100%;border-collapse:separate;border-spacing:0;margin-top:32px;font-size:14px;border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow-card)}
.compare-table th,.compare-table td{padding:16px 12px;text-align:center;border-bottom:1px solid var(--light-gray)}
.compare-table th{background:var(--off-white);font-weight:700;color:var(--navy);font-size:14px}
.compare-table th:last-child{background:var(--coral);color:var(--white)}
.compare-table td:last-child{font-weight:700;color:var(--coral);background:rgba(255,107,74,.03)}
.compare-table td:first-child{text-align:left;font-weight:600;color:var(--dark-gray)}
.compare-table tr:last-child td{border-bottom:none}
.compare-table tbody tr{transition:background .2s}
.compare-table tbody tr:hover{background:rgba(78,205,196,.04)}

.reason-card{margin-top:20px;padding:24px;background:var(--white);border-radius:var(--radius-sm);border:1px solid var(--light-gray);transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .3s,border-color .3s}
.reason-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.06);border-color:var(--coral)}
.reason-card h4{font-size:17px;font-weight:700;color:var(--navy);margin-bottom:10px;display:flex;align-items:center;gap:10px}
.reason-card h4::before{content:'';width:4px;height:20px;background:var(--grad-coral);border-radius:2px;flex-shrink:0}
.reason-card p{font-size:15px;line-height:1.7}

.savings-box{background:var(--grad-hero);border-radius:var(--radius);padding:36px;margin-top:36px;text-align:center;color:var(--white);position:relative;overflow:hidden;border:1px solid rgba(78,205,196,.1)}
.savings-box::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 100%,rgba(255,107,74,.1),transparent 60%);pointer-events:none}
.savings-box__title{font-size:18px;font-weight:700;margin-bottom:20px;position:relative}
.savings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px;position:relative}
.savings-item{padding:16px;background:rgba(255,255,255,.04);border-radius:12px;border:1px solid rgba(255,255,255,.06)}
.savings-item__label{font-size:13px;color:rgba(255,255,255,.5);font-weight:500}
.savings-item__price{font-size:22px;font-weight:800;margin-top:6px}
.savings-item--highlight{background:rgba(255,107,74,.12);border-color:rgba(255,107,74,.3)}
.savings-item--highlight .savings-item__price{color:var(--coral)}
.savings-result{font-size:clamp(20px,4vw,30px);font-weight:900;background:var(--grad-coral);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative}
.savings-result small{display:block;font-size:16px;font-weight:400;color:rgba(255,255,255,.6);margin-top:6px;-webkit-text-fill-color:rgba(255,255,255,.6)}
@keyframes savingsGlow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.3)}}
.savings-result.animated{animation:savingsGlow 2s ease-in-out .5s 2}

/* ===== SECTION 6: FAQ ===== */
.faq-item{border-bottom:1px solid var(--light-gray)}
.faq-item:last-child{border-bottom:none}
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:22px 0;cursor:pointer;gap:16px;-webkit-user-select:none;user-select:none;border:none;background:none;width:100%;text-align:left;font-family:inherit;min-height:48px;transition:color .3s}
.faq-q:hover h3{color:var(--coral)}
.faq-q:focus-visible{outline:3px solid var(--coral);outline-offset:-3px;border-radius:4px}
.faq-q h3{font-size:clamp(15px,2.5vw,18px);font-weight:600;color:var(--navy);flex:1;transition:color .3s}
.faq-q__arrow{width:24px;height:24px;flex-shrink:0;color:var(--mid-gray);transition:transform .35s cubic-bezier(0.34,1.56,0.64,1),color .3s}
.faq-item.open .faq-q__arrow{transform:rotate(180deg);color:var(--coral)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(0.4,0,0.2,1)}
.faq-item.open .faq-a{max-height:600px;transition:max-height .55s cubic-bezier(0.4,0,0.2,1)}
.faq-a__inner{padding:0 0 22px;font-size:15px;line-height:1.7;color:var(--dark-gray);opacity:0;transform:translateY(-8px);transition:opacity .3s ease .05s,transform .3s ease .05s}
.faq-item.open .faq-a__inner{opacity:1;transform:translateY(0);transition:opacity .4s ease .15s,transform .4s ease .15s}
.faq-a__inner strong{color:var(--navy)}
.faq-a__inner ul{margin-top:8px;padding-left:20px}
.faq-a__inner ul li{margin-bottom:4px}
.faq-highlight{background:linear-gradient(135deg,var(--light-mint),#e8faf8);padding:14px 18px;border-radius:10px;margin-top:10px;font-size:14px;font-weight:500;border:1px solid rgba(78,205,196,.12)}

/* ===== SECTION 7: TRUST ===== */
.specs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:32px}
.spec{text-align:center;padding:28px 16px;background:var(--white);border-radius:var(--radius-sm);border:1px solid var(--light-gray);transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .3s,border-color .3s}
.spec:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,.06);border-color:var(--mint)}
.spec__icon{width:52px;height:52px;margin:0 auto 14px;color:var(--navy);background:linear-gradient(135deg,var(--light-mint),#e8faf8);border-radius:14px;display:flex;align-items:center;justify-content:center;transition:transform .4s cubic-bezier(0.34,1.56,0.64,1)}
.spec__icon svg{width:28px;height:28px}
.spec:hover .spec__icon{transform:translateY(-4px) scale(1.1)}
.spec__title{font-size:16px;font-weight:700;color:var(--navy);margin-bottom:6px}
.spec__desc{font-size:13px;color:var(--mid-gray);line-height:1.5}

.seller-card{margin-top:44px;padding:36px;background:var(--white);border-radius:var(--radius);border:1px solid var(--light-gray);position:relative;overflow:hidden}
.seller-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--coral),var(--mint))}
.seller-card h3{font-size:20px;font-weight:800;color:var(--navy);margin-bottom:18px}
.seller-card p{font-size:15px;line-height:1.7;margin-bottom:14px}
.seller-card ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.seller-card ul li{background:linear-gradient(135deg,var(--off-white),#eef0f3);padding:8px 16px;border-radius:20px;font-size:13px;color:var(--dark-gray);font-weight:500;border:1px solid rgba(0,0,0,.04);opacity:0;transform:scale(0.8);transition:opacity .3s,transform .3s cubic-bezier(0.34,1.56,0.64,1)}
.seller-card.visible ul li:nth-child(1){transition-delay:.1s}
.seller-card.visible ul li:nth-child(2){transition-delay:.17s}
.seller-card.visible ul li:nth-child(3){transition-delay:.24s}
.seller-card.visible ul li:nth-child(4){transition-delay:.31s}
.seller-card.visible ul li{opacity:1;transform:scale(1)}

/* ===== SECTION 8: FINAL CTA ===== */
.final-cta{text-align:center;position:relative;z-index:1}
.final-cta .h2{color:var(--white);margin-bottom:24px}
.final-cta__body{font-size:clamp(15px,2.5vw,18px);color:rgba(255,255,255,.8);line-height:1.8;margin-bottom:36px}
.checklist{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;text-align:left;margin-bottom:44px}
.checklist li{display:flex;align-items:center;gap:10px;font-size:15px;color:rgba(255,255,255,.9);opacity:0;transform:translateX(-20px);transition:opacity .4s,transform .4s}
.checklist li svg{width:20px;height:20px;flex-shrink:0;color:var(--mint)}
.checklist.visible li:nth-child(1){transition-delay:.05s}.checklist.visible li:nth-child(2){transition-delay:.1s}.checklist.visible li:nth-child(3){transition-delay:.15s}.checklist.visible li:nth-child(4){transition-delay:.2s}.checklist.visible li:nth-child(5){transition-delay:.25s}.checklist.visible li:nth-child(6){transition-delay:.3s}.checklist.visible li:nth-child(7){transition-delay:.35s}.checklist.visible li:nth-child(8){transition-delay:.4s}
.checklist.visible li{opacity:1;transform:translateX(0)}
.final-cta__buttons{display:flex;flex-direction:column;align-items:center;gap:16px}
.final-cta__footer{margin-top:28px;font-size:15px;color:rgba(255,255,255,.5)}
.final-cta__last{margin-top:16px;font-size:17px;font-weight:600;color:rgba(255,255,255,.8)}

/* ===== STICKY MOBILE CTA ===== */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;background:rgba(15,30,47,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:12px 16px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:9998;transform:translateY(100%);transition:transform .4s cubic-bezier(0.25,0.46,0.45,0.94);display:flex;align-items:center;justify-content:center;gap:12px;border-top:1px solid rgba(78,205,196,.15)}
.sticky-cta.show{transform:translateY(0)}
.sticky-cta__price{color:var(--white);font-size:14px;font-weight:600}
.sticky-cta__price span{color:var(--coral);font-size:18px;font-weight:800}
.sticky-cta .btn-primary{padding:12px 28px;font-size:15px;min-width:auto;min-height:44px;border-radius:10px}
.sticky-cta .btn-kakao{padding:10px 24px;font-size:14px;min-width:auto;min-height:44px;border-radius:10px}

/* ===== RESPONSIVE ===== */
@media(max-width:767px){
  .section{padding:clamp(40px,6vw,60px) 16px}
  .hero{padding:clamp(60px,10vw,80px) 16px clamp(40px,6vw,50px)}
  .hero__badges{flex-direction:column;align-items:center}
  .hero__badge{width:100%;max-width:300px;justify-content:center}
  .btn-primary,.btn-large,.btn-kakao{min-width:auto;width:100%;max-width:340px}
  .metrics{grid-template-columns:1fr}
  .stats-box{grid-template-columns:1fr;gap:24px;padding:32px 20px}
  .savings-grid{grid-template-columns:1fr}
  .compare-table{font-size:12px}
  .compare-table th,.compare-table td{padding:12px 8px}
  .specs-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .geo-dual{grid-template-columns:1fr;text-align:center}
  .geo-dual__plus{justify-self:center}
  .seda-badges{justify-content:center}
  .checklist{grid-template-columns:1fr}
  .seller-card{padding:24px}
}
@media(min-width:768px) and (max-width:1023px){
  .hero__badges{gap:10px}
  .hero__badge{min-width:170px}
  .stats-box{padding:36px 20px}
  .metrics{gap:16px}
}
@media(min-width:1024px){
  .section__inner{max-width:800px}
  .sticky-cta{display:none}
}

/* ===== REDUCED MOTION ===== */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}
  .scroll-progress,.hero-particles{display:none}
  .fade-up,.slide-left,.slide-right,.scale-in{opacity:1;transform:none}
  .hero__headline .num-accent,.hero__headline .h1{opacity:1;transform:none}
  .hero__badge{opacity:1;transform:none}
  .checklist li,.seller-card ul li{opacity:1;transform:none}
  .timeline__item{opacity:1}
  .timeline__item::before{background:var(--coral);transform:none}
}

/* ===== SR ONLY ===== */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ===== URGENCY BANNER ===== */
.urgency-banner{background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid rgba(255,107,74,.25);border-radius:var(--radius);padding:28px 24px;text-align:center;position:relative;overflow:hidden}
.urgency-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(255,107,74,.1),transparent 60%);pointer-events:none}
.urgency-banner__badge{display:inline-block;background:var(--coral);color:#fff;font-size:13px;font-weight:700;padding:5px 16px;border-radius:20px;margin-bottom:14px;letter-spacing:.03em;animation:urgencyPulse 2s ease-in-out infinite}
@keyframes urgencyPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,107,74,.4)}50%{box-shadow:0 0 0 10px rgba(255,107,74,0)}}
.urgency-banner__title{font-size:clamp(18px,3vw,24px);font-weight:800;color:#fff;margin-bottom:8px}
.urgency-banner__desc{font-size:15px;color:rgba(255,255,255,.7);line-height:1.6}
.urgency-banner__slots{display:flex;justify-content:center;gap:8px;margin-top:16px}
.urgency-banner__slot{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;transition:transform .3s}
.urgency-banner__slot--filled{background:rgba(255,107,74,.15);border:1px solid rgba(255,107,74,.3);color:var(--coral)}
.urgency-banner__slot--empty{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.3)}
.urgency-banner__slot--empty:first-of-type{border-color:rgba(78,205,196,.4);color:var(--mint);animation:slotBlink 1.5s ease-in-out infinite}
@keyframes slotBlink{0%,100%{opacity:1}50%{opacity:.4}}

/* ===== EASY STEPS ===== */
.easy-steps{display:flex;flex-direction:column;gap:20px;margin-top:32px}
.easy-step{display:flex;align-items:flex-start;gap:20px;padding:24px;background:var(--white);border-radius:var(--radius-sm);border:1px solid rgba(0,0,0,.06);transition:transform .3s cubic-bezier(0.25,0.46,0.45,0.94),box-shadow .3s}
.easy-step:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.06)}
.easy-step__icon{width:56px;height:56px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:14px;font-size:28px;background:linear-gradient(135deg,rgba(78,205,196,.12),rgba(78,205,196,.04))}
.easy-step__badge{font-size:12px;font-weight:700;color:var(--mint);margin-bottom:4px;letter-spacing:.05em;text-transform:uppercase}
.easy-step__title{font-size:18px;font-weight:700;color:var(--navy);margin-bottom:6px}
.easy-step__desc{font-size:15px;color:var(--dark-gray);line-height:1.6}
.easy-step__arrow{text-align:center;font-size:24px;color:var(--mint);opacity:.5}

/* ===== BLOG EMBED ===== */
.embed-card{margin-top:24px;border-radius:var(--radius);overflow:hidden;border:1px solid rgba(0,0,0,.06);background:var(--white)}
.embed-card iframe{width:100%;border:none;display:block}
.embed-card__label{padding:12px 20px;font-size:13px;color:var(--mid-gray);display:flex;align-items:center;gap:8px;background:var(--off-white)}
.embed-card__label strong{color:var(--navy);font-weight:700}

/* ===== COMING SOON ===== */
.coming-soon{position:relative}
.coming-soon__badge{display:inline-block;background:linear-gradient(135deg,var(--mint),#6BE0D8);color:var(--navy);font-size:13px;font-weight:700;padding:5px 16px;border-radius:20px;margin-bottom:20px}
.coming-soon__features{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.coming-soon__feature{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:600;color:var(--dark-gray)}
.coming-soon__feature svg{width:22px;height:22px;flex-shrink:0;color:var(--mint)}
.coming-soon__embed{margin-top:24px;border-radius:var(--radius);overflow:hidden;max-width:400px;margin-left:auto;margin-right:auto}

/* ===== COST BREAKDOWN ===== */
.cost-breakdown{margin-top:20px;padding:28px;background:var(--white);border-radius:var(--radius-sm);border:1px solid var(--light-gray)}
.cost-breakdown__item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--light-gray);font-size:15px;color:var(--dark-gray)}
.cost-breakdown__item:last-child{border-bottom:none}
.cost-breakdown__item svg{width:20px;height:20px;flex-shrink:0;color:var(--coral)}
.cost-breakdown__total{margin-top:16px;padding:16px;background:linear-gradient(135deg,rgba(255,107,74,.06),rgba(255,107,74,.02));border-radius:12px;text-align:center;font-size:17px;font-weight:700;color:var(--navy)}

/* ===== CONDITION NOTE ===== */
.condition-note{font-size:13px;color:rgba(255,255,255,.45);margin-top:8px}
.condition-note--dark{color:var(--mid-gray)}

@media(max-width:767px){
  .urgency-banner{padding:20px 16px}
  .easy-step{flex-direction:column;gap:14px;align-items:center;text-align:center}
  .coming-soon__embed{max-width:100%}
}

/* ============================================================
   가격 심리 전략 CSS
   ============================================================ */

/* 히어로 일일 단가 */
.hero__daily-price{font-size:15px;color:rgba(255,255,255,.55);margin-top:8px;letter-spacing:.02em}

/* 앵커 가격 배지 */
.anchor-price-badge{display:inline-flex;align-items:center;gap:12px;margin-top:20px;padding:14px 28px;background:linear-gradient(135deg,rgba(255,107,74,.04),rgba(78,205,196,.04));border:2px solid rgba(78,205,196,.2);border-radius:var(--radius-sm);flex-wrap:wrap;justify-content:center}
.anchor-price-badge__original{font-size:16px;color:var(--mid-gray);text-decoration:line-through;opacity:.6}
.anchor-price-badge__arrow{font-size:18px;color:var(--mid-gray);opacity:.4}
.anchor-price-badge__current{font-size:20px;font-weight:800;color:var(--coral)}
.anchor-price-badge__discount{font-size:13px;font-weight:700;color:#fff;background:var(--coral);padding:3px 10px;border-radius:20px}

/* 비교표 가격 하이라이트 */
.table-price-highlight{display:flex;flex-direction:column;align-items:center;gap:2px}
.table-price-original{font-size:13px;color:var(--mid-gray);opacity:.5}
.table-price-daily{font-size:12px;color:var(--mint);font-weight:600}

/* 의심 반박 카드 */
.doubt-cards{display:flex;flex-direction:column;gap:20px}
.doubt-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);overflow:hidden}
.doubt-card__question{display:flex;align-items:center;gap:12px;padding:20px 24px;background:rgba(255,107,74,.03);border-bottom:1px solid rgba(0,0,0,.04);font-size:16px;font-weight:700;color:var(--navy)}
.doubt-card__icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:rgba(255,107,74,.1);color:var(--coral);font-weight:800;font-size:14px;flex-shrink:0}
.doubt-card__answer{display:flex;gap:12px;padding:20px 24px;font-size:15px;color:var(--dark-gray);line-height:1.75}
.doubt-card__check{color:var(--mint);font-size:18px;font-weight:700;flex-shrink:0;margin-top:2px}
.doubt-rationalize{font-size:17px;color:var(--dark-gray);line-height:1.8}

/* 손실 회피 그리드 */
.loss-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.loss-card{text-align:center;padding:32px 24px;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius)}
.loss-card__number{font-size:clamp(32px,5vw,44px);font-weight:900;color:var(--coral);line-height:1}
.loss-card__label{font-size:15px;font-weight:700;color:var(--navy);margin-top:8px}
.loss-card__desc{font-size:14px;color:var(--dark-gray);margin-top:12px;line-height:1.7}
.loss-comparison{max-width:480px;margin:32px auto 0;padding:28px;background:var(--navy);border-radius:var(--radius);text-align:center}
.loss-comparison__row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}
.loss-comparison__label{font-size:15px;color:rgba(255,255,255,.7)}
.loss-comparison__value{font-size:22px;font-weight:800}
.loss-comparison__vs{font-size:14px;color:rgba(255,255,255,.3);padding:8px 0;font-weight:600}

/* CTA 자기합리화 */
.final-cta__rationalize{font-size:15px;color:rgba(255,255,255,.5);text-align:center;margin-top:12px;line-height:1.7}

/* 스티키 CTA 일일 단가 */
.sticky-cta__daily{font-size:11px;color:var(--mint);font-weight:600;margin-left:4px}

@media(max-width:768px){
  .loss-grid{grid-template-columns:1fr}
  .loss-comparison__row{flex-direction:column;gap:4px;text-align:center}
  .doubt-card__question{font-size:15px;padding:16px 20px}
  .doubt-card__answer{padding:16px 20px;font-size:14px}
  .anchor-price-badge{padding:12px 20px;gap:8px}
}
