/* ==========================================================================
   Component: Timeline v1.0
   Horizontal desktop, vertical mobile. Large numbered nodes, connecting line.
   ========================================================================== */
.seo-process{padding:90px 0;background:var(--white);}
.seo-process h2{text-align:center;font-size:2.2rem;color:var(--navy-950);margin-bottom:12px;}

.seo-timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:0;position:relative;padding-top:36px;}
.seo-timeline::before{content:'';position:absolute;top:62px;left:8%;right:8%;height:2px;background:var(--gray-300);z-index:0;}

.seo-step{position:relative;z-index:1;text-align:center;padding:0 10px;}
.seo-step-num{
    width:56px;height:56px;border-radius:50%;
    background:var(--white);border:2px solid var(--teal-500);
    color:var(--teal-500);font-size:1.2rem;font-weight:800;
    display:flex;align-items:center;justify-content:center;
    margin:0 auto 18px;position:relative;
    box-shadow:0 4px 14px rgba(19,167,179,.15);transition:background .2s,color .2s;
}
.seo-step:hover .seo-step-num{background:var(--teal-500);color:var(--white);}
.seo-step-icon{display:block;margin:0 auto 10px;color:var(--teal-500);opacity:.7;}
.seo-step h3{color:var(--navy-950);font-size:.9rem;font-weight:700;margin-bottom:8px;}
.seo-step p{color:var(--gray-700);font-size:.78rem;line-height:1.5;margin:0;}

/* Floating card effect */
.seo-step-card{
    background:var(--white);border:1px solid var(--gray-300);border-radius:12px;
    padding:16px 14px;margin-top:4px;box-shadow:0 4px 16px rgba(0,31,49,.06);
    transition:transform .22s ease,box-shadow .22s ease;
}
.seo-step:hover .seo-step-card{transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,31,49,.1);}

@media (max-width:1024px){
    .seo-timeline{grid-template-columns:repeat(3,1fr);gap:32px;row-gap:40px;}
    .seo-timeline::before{display:none;}
}
@media (max-width:768px){
    .seo-timeline{grid-template-columns:1fr;gap:24px;padding-top:0;}
    .seo-step{display:grid;grid-template-columns:56px 1fr;gap:16px;text-align:left;padding:0;}
    .seo-step-num{margin:0;}
    .seo-step-card{margin-top:0;}
}
