/* --- Ultra Pro Hire Section --- */

.ultra-title {
    font-size: 4rem;
    font-weight: 900;
    line-height: 1.1;
    color: #3a3d74;
}

.red-glow {
    color: #e31e24;
    text-shadow: 0 0 20px rgba(227, 30, 36, 0.2);
}

.ultra-desc {
    font-size: 18px;
    color: #555;
    margin-top: 25px;
    max-width: 90%;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-top: 40px;
}

.f-item {
	background: #f8f9fa;
    padding: 15px;
    border-radius: 15px;
    text-align: center;
    transition: 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.f-item i {
    display: block;
    font-size: 24px;
    color: #3a3d74;
    margin-bottom: 10px;
}

.f-item span {
    font-weight: 700;
    font-size: 13px;
}

.f-item:hover {
    background: #3a3d74;
    color: #fff;
    transform: translateY(-5px);
}

.f-item:hover i { color: #fff; }

/* Neon Button */
.premium-btn-neon {
    background: #3a3d74 ;
    color: #fff !important;
    text-decoration: none;
    padding: 18px 40px;
    border-radius: 15px;
    font-weight: 800;
    display: inline-block;
    box-shadow: 0 10px 30px rgba(227, 30, 36, 0.3);
    transition: 0.4s;
}

.premium-btn-neon:hover {
    transform: scale(1.05);
    background: #e31e24;
    box-shadow: 0 10px 30px rgba(227, 30, 36, 0.3);
}

/* 3D Visual Section */
.three-d-stack {
    position: relative;
    perspective: 1000px;
}

.main-visual-box {
    border-radius: 40px;
    overflow: hidden;
    transform: rotateY(-10deg) rotateX(5deg);
    box-shadow: 25px 25px 50px rgba(0,0,0,0.1);
    transition: 0.5s;
    z-index: 2;
    position: relative;
}

.main-visual-box:hover {
    transform: rotateY(0deg) rotateX(0deg);
}

.main-visual-box img { width: 100%; display: block; }

/* Glass Cards */
.neon-glass-card {
    position: absolute;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    z-index: 3;
}

.top-right {
    top: -30px;
    right: -20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.bottom-left {
    bottom: -30px;
    left: -20px;
}

.bottom-left h5 { font-weight: 900; margin: 0; color: #e31e24; }
.bottom-left p { margin: 0; font-size: 12px; color: #777; }

.dot { width: 10px; height: 10px; border-radius: 50%; }
.green { background: #28a745; box-shadow: 0 0 10px #28a745; }

.glow-sphere {
    position: absolute;
    top: 50%; left: 50%;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(58, 61, 116, 0.1) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    z-index: 1;
}

/* Responsive */
@media (max-width: 991px) {
    .ultra-title { font-size: 2.5rem; }
    .main-visual-box { transform: none; margin-top: 50px; }
    .top-right, .bottom-left { position: static; margin-top: 20px; width: fit-content; display: inline-block; }
}

/* --- Hire Digital Marketing Premium Section --- */
.hire-marketing-premium {
    padding: 100px 0;
    background: #ffffff;
    overflow: hidden;
}

.strategy-badge {
    color: #e31e24;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.marketing-title {
    font-size: 3.8rem;
    font-weight: 900;
    color: #3a3d74;
    line-height: 1.1;
}

.blue-shine {
    color: #e31e24;
    position: relative;
    z-index: 1;
}

.marketing-text {
    font-size: 18px;
    color: #666;
    margin: 25px 0 40px;
    line-height: 1.7;
}

/* Service List Items */
.m-service-item {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    padding: 15px;
    border-radius: 15px;
    transition: 0.3s;
}

.m-service-item:hover {
    background: #f8f9fa;
    transform: translateX(10px);
}

.m-icon {
    width: 55px;
    height: 55px;
    background: #3a3d74;
    color: #fff;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.m-info h6 { margin: 0; font-weight: 800; color: #3a3d74; }
.m-info p { margin: 0; font-size: 14px; color: #888; }

/* Marketing Button */
.marketing-btn {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 18px 35px;
    border-radius: 10px;
    font-weight: 700;
    display: inline-block;
    transition: 0.4s;
}

.marketing-btn:hover {
    background: #e31e24;
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(227, 30, 36, 0.2);
}

/* Visual Components (Right Side) */
.marketing-visual-wrap {
    position: relative;
    padding: 20px;
}

.marketing-img-box {
    border-radius: 30px;
    overflow: hidden;
    z-index: 2;
    position: relative;
}

.marketing-img-box img { width: 100%; transition: 0.5s; }

.performance-card {
    position: absolute;
    top: 10%;
    right: -20px;
    background: #fff;
    padding: 20px;
    border-radius: 20px;
    z-index: 3;
    min-width: 180px;
}

.p-header { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; }
.performance-card h3 { margin: 10px 0; font-weight: 900; color: #3a3d74; }
.p-bar { height: 6px; background: #eee; border-radius: 10px; }
.p-fill { width: 85%; height: 100%; background: #28a745; border-radius: 10px; }

.trust-card {
    position: absolute;
    bottom: 5%;
    left: -20px;
    background: #3a3d74;
    color: #fff;
    padding: 15px 25px;
    border-radius: 20px;
    z-index: 3;
}

.avatars-group img { width: 35px; height: 35px; border-radius: 50%; border: 2px solid #fff; margin-right: -10px; }
.trust-card p { margin: 10px 0 0; font-size: 12px; font-weight: 600; }

/* Animations */
.animate-up-down { animation: upDown 4s ease-in-out infinite; }
.animate-down-up { animation: downUp 4s ease-in-out infinite; }

@keyframes upDown { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } }
@keyframes downUp { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(20px); } }

/* Responsive */
@media (max-width: 991px) {
    .marketing-title { font-size: 2.8rem; }
    .performance-card, .trust-card { position: static; margin-top: 20px; width: fit-content; }
}

/* --- Storyteller Content Section --- */
.hire-content-storyteller {
    padding: 100px 0;
    background-color: #ffffff;
    overflow: hidden;
}

.creative-badge {
    color: #e31e24;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 13px;
    margin-bottom: 20px;
}

.story-title {
    font-size: 3.5rem;
    font-weight: 900;
    color: #3a3d74;
    line-height: 1;
}

.ink-effect {
    color: #e31e24;
    position: relative;
    display: inline-block;
}

.ink-effect::after {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 100%;
    height: 15px;
    background: rgba(227, 30, 36, 0.1);
    z-index: -1;
    transform: skewX(-15deg);
}

.story-desc {
    font-size: 19px;
    color: #555;
    margin: 30px 0;
    line-height: 1.8;
}

/* Perk Cards */
.writer-perks {
    display: flex;
    gap: 30px;
}

.perk-card {
    display: flex;
    align-items: center;
    gap: 15px;
}

.perk-number {
    font-size: 32px;
    font-weight: 900;
    color: rgba(58, 61, 116, 0.1);
}

.perk-info h6 { margin: 0; font-weight: 800; color: #3a3d74; }
.perk-info p { margin: 0; font-size: 13px; color: #888; }

/* Ink Button */
.ink-button {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 20px 40px;
    border-radius: 10px 40px 10px 40px;
    font-weight: 800;
    display: inline-block;
    transition: 0.4s;
}

.ink-button:hover {
    background: #e31e24;
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(227, 30, 36, 0.2);
}

/* Right Side Visual Stack */
.story-visual-wrap {
    position: relative;
    padding: 40px;
}

.ink-blob {
    position: absolute;
    top: 50%; left: 50%;
    width: 120%; height: 120%;
    background: radial-gradient(circle, rgba(227, 30, 36, 0.05) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    z-index: 1;
}

.writer-main-img {
    position: relative;
    z-index: 3;
    border-radius: 40px;
    overflow: hidden;
    transform: rotate(-3deg);
    transition: 0.5s;
}

.writer-main-img img { width: 100%; border-radius: 40px; }

.writer-main-img:hover {
    transform: rotate(0deg) scale(1.02);
}

/* Writing Cards */
.writing-card {
    position: absolute;
    background: #fff;
    padding: 15px 25px;
    border-radius: 15px;
    z-index: 4;
    min-width: 180px;
}

.card-top { top: 10%; right: -20px; animation: float 3s infinite; }
.card-bottom { bottom: 10%; left: -20px; animation: float 3s infinite 1.5s; }

.line { height: 4px; background: #eee; border-radius: 2px; margin-bottom: 8px; }
.mid { width: 60%; }
.long { width: 90%; }
.short { width: 40%; }

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.floating-particle {
    position: absolute;
    width: 10px; height: 10px;
    background: #e31e24;
    border-radius: 50%;
    z-index: 2;
}

.p1 { top: 20%; left: 10%; animation: float 4s infinite; }
.p2 { bottom: 20%; right: 10%; background: #3a3d74; animation: float 5s infinite; }

/* Responsive */
@media (max-width: 991px) {
    .story-title { font-size: 2.8rem; }
    .writer-perks { flex-direction: column; }
    .writing-card { display: none; }
}

/* --- Hire Android Ultra Modern --- */

.ultra-heading {
    font-size: 4.5rem;
    font-weight: 900;
    line-height: 1;
    color: #3a3d74;
}

.ultra-text {
    font-size: 1.2rem;
    color: #555;
    margin: 30px 0;
    line-height: 1.8;
}

.tech-stack-icons { display: flex; gap: 15px; }
.t-icon {
    width: 50px; height: 50px;
    background: #f8f9fa;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; color: #3a3d74;
    transition: 0.3s;
}
.t-icon:hover { background: #e31e24; color: #fff; transform: translateY(-5px); }

/* Neon Button */
.neon-btn {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 20px 40px;
    border-radius: 15px;
    font-weight: 800;
    transition: 0.4s;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
.neon-btn:hover {
    background: #e31e24;
    box-shadow: 0 10px 30px rgba(227, 30, 36, 0.4);
    transform: translateY(-5px);
}

/* Right Side Stack */
.visual-3d-stack {
    position: relative;
    padding: 40px;
}

.glow-blur {
    position: absolute;
    top: 50%; left: 50%;
    width: 400px; height: 400px;
    background: rgba(227, 30, 36, 0.1);
    filter: blur(80px);
    transform: translate(-50%, -50%);
    z-index: 1;
}

.android-master-card {
    position: relative;
    z-index: 2;
    border-radius: 40px;
    overflow: hidden;
    transform: perspective(1000px) rotateY(-10deg) rotateX(5deg);
    transition: 0.5s;
}
.android-master-card:hover { transform: perspective(1000px) rotateY(0deg) rotateX(0deg); }
.android-master-card img { width: 100%; border-radius: 40px; }

.floating-component {
    position: absolute;
    background: #fff;
    padding: 15px 25px;
    border-radius: 20px;
    display: flex; align-items: center; gap: 12px;
    font-weight: 800; font-size: 14px;
    z-index: 4;
}
.c1 { top: 10%; right: -20px; animation: float-y 4s infinite; }
.c2 { bottom: 10%; left: -20px; animation: float-y 4s infinite 2s; }

@keyframes float-y {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}

@media (max-width: 991px) {
    .ultra-heading { font-size: 3rem; }
    .android-master-card { transform: none; }
    .floating-component { position: static; margin-top: 15px; }
}

/* --- Hire iOS Premium Section --- */

.ios-title {
    font-size: 4.2rem;
    font-weight: 900;
    color: #3a3d74; /* Apple Dark */
    line-height: 1.1;
}
.ios-gradient{
    color: #e31e24;
}

.ios-desc {
    font-size: 19px;
    color: #555;
    margin: 30px 0;
    line-height: 1.8;
}

/* Feature List */
.ios-feature-list {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.ios-f-item {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f5f5f7;
    padding: 10px 20px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 14px;
    color: #1d1d1f;
}

.ios-f-item i { color: #0071e3; }

/* Apple Style Button */
.ios-btn-dark {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 18px 40px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 18px;
    display: inline-block;
    transition: 0.4s;
}

.ios-btn-dark:hover {
    background: #e31e24;
    transform: scale(1.02);
}

.app-store-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    color: #888;
}

.app-store-badge i { font-size: 24px; color: #000; }

/* Visual Side Styling */
.ios-visual-wrap {
    position: relative;
    padding: 40px;
    text-align: center;
}

.ios-glow-circle {
    position: absolute;
    top: 50%; left: 50%;
    width: 450px; height: 450px;
    background: radial-gradient(circle, rgba(0, 113, 227, 0.05) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    z-index: 1;
}

.iphone-frame {
    width: 270px;
    height: 540px;
    border-radius: 45px;
    border: 8px solid #1d1d1f;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    background: #000;
}

.iphone-frame img { width: 100%; height: 100%; object-fit: cover; }

.shadow-ultra {
    box-shadow: 0 40px 100px rgba(0,0,0,0.15);
}

/* Glass Badges */
.ios-glass-badge {
    position: absolute;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(15px);
    padding: 15px 25px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    z-index: 3;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.top-badge { top: 15%; right: 0; }
.bottom-badge { bottom: 15%; left: 0; }

.i-icon { font-size: 22px; color: #000; }
.i-txt strong { display: block; font-size: 15px; color: #1d1d1f; }
.i-txt p { margin: 0; font-size: 11px; color: #888; text-transform: uppercase; letter-spacing: 1px; }

/* Float Animation */
@keyframes float-y {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.animate-float { animation: float-y 4s infinite; }
.animate-float-delayed { animation: float-y 4s infinite 2s; }

/* Responsive */
@media (max-width: 991px) {
    .ios-title { font-size: 2.8rem; }
    .ios-visual-wrap { margin-top: 50px; }
    .ios-glass-badge { position: static; margin-top: 15px; width: fit-content; margin-left: auto; margin-right: auto; }
}


/* --- Hire WordPress Developer Section --- */

.wp-title {
    font-size: 4rem;
    font-weight: 900;
    color: #3a3d74;
    line-height: 1.1;
}

.blue-glow {
    color: #e31e24;
    position: relative;
}

.wp-desc {
    font-size: 18px;
    color: #666;
    margin-top: 25px;
    line-height: 1.8;
}

/* Feature Boxes */
.wp-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-top: 35px;
}

.wp-f-box {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 15px;
    text-align: center;
    border: 1px solid #eee;
    transition: 0.3s;
}

.wp-f-box:hover {
    background: #21759b;
    color: #fff;
    transform: translateY(-5px);
}

.wp-f-box i { font-size: 24px; margin-bottom: 10px;}
.wp-f-box h6 { font-weight: 800; margin: 0; font-size: 14px; }

/* WP Button */
.wp-main-btn {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 18px 40px;
    border-radius: 12px;
    font-weight: 800;
    display: inline-block;
    transition: 0.4s;
}

.wp-main-btn:hover {
    background: #e31e24;
    box-shadow: 0 10px 20px rgba(33, 117, 155, 0.3);
}

.trusted-tag { font-weight: 700; color: #888; font-size: 14px; }

/* Visual Side */
.wp-visual-box {
    position: relative;
    padding: 40px;
}

.wp-bg-shape {
    position: absolute;
    top: 50%; left: 50%;
    width: 120%; height: 120%;
    background: radial-gradient(circle, rgba(33, 117, 155, 0.05) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    z-index: 1;
}

.wp-site-card {
    position: relative;
    z-index: 2;
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #ddd;
}

.wp-card-header {
    background: #f1f1f1;
    padding: 10px 15px;
    display: flex;
    gap: 8px;
}

.dot { width: 10px; height: 10px; border-radius: 50%; }
.red { background: #ff5f56; }
.yellow { background: #ffbd2e; }
.green { background: #27c93f; }

.wp-site-card img { width: 100%; height: 350px; object-fit: cover; }

/* Floating Tool Cards */
.tool-card {
    position: absolute;
    background: #fff;
    padding: 15px 25px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 800;
    z-index: 3;
    font-size: 14px;
}

.t-left { top: 10%; left: -20px; animation: float-up-down 3s infinite; }
.t-right { bottom: 10%; right: -20px; animation: float-up-down 3s infinite 1.5s; }

@keyframes float-up-down {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

/* Responsive */
@media (max-width: 991px) {
    .wp-title { font-size: 2.8rem; }
    .wp-features-grid { grid-template-columns: 1fr; }
    .wp-visual-box { margin-top: 50px; }
}

/* --- Hire PHP Minimalist Luxury --- */

.minimal-title {
    font-size: 5rem;
    font-weight: 900;
    color: #3a3d74;
    line-height: 1;
}

.text-red {
    color: #e31e24;
}

.minimal-desc {
    font-size: 20px;
    color: #555;
    margin-top: 30px;
    line-height: 1.8;
    max-width: 85%;
}

.tech-stack-minimal {
    margin-top: 30px;
    display: flex;
    gap: 15px;
}

.tech-stack-minimal span {
    font-weight: 800;
    color: #3a3d74;
    font-size: 14px;
    box-shadow: 0 5px 15px rgba(58, 61, 116, 0.1);
    padding: 10px 20px;
    border-radius: 12px;
    transition: 0.3s;
}

/* Minimalist Button */
.minimal-btn {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 22px 45px;
    border-radius: 12px;
    font-weight: 800;
    font-size: 18px;
    display: inline-block;
    transition: 0.4s;
}

.minimal-btn:hover {
    background: #e31e24;
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(227, 30, 36, 0.2);
}

/* Visual Styling */
.minimal-visual-wrap {
    position: relative;
    padding: 40px;
}

.img-container-premium {
    width: 100%;
    height: 450px;
    border-radius: 30px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.img-container-premium img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s;
}

.img-container-premium:hover img {
    transform: scale(1.05);
}

.floating-performance {
    position: absolute;
    bottom: 10%;
    left: -20px;
    background: #fff;
    padding: 20px 30px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    z-index: 3;
}

.p-icon {
    width: 45px;
    height: 45px;
    background: #fff3cd;
    color: #ffc107;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.p-info strong { display: block; font-size: 16px; color: #1a1a1a; }
.p-info p { margin: 0; font-size: 12px; color: #888; }

.bg-blur-circle {
    position: absolute;
    top: -30px;
    right: -30px;
    width: 300px;
    height: 300px;
    background: rgba(58, 61, 116, 0.05);
    border-radius: 50%;
    z-index: 1;
}

/* Responsive */
@media (max-width: 991px) {
    .minimal-title { font-size: 3rem; }
    .img-container-premium { height: 350px; }
    .floating-performance { position: static; margin-top: 20px; }
}

/* --- Hire SEO Expert Premium Section --- */

.seo-title {
    font-size: 4.5rem;
    font-weight: 900;
    color: #3a3d74;
    line-height: 1.1;
}

.red-glow-text {
    color: #e31e24;
    text-shadow: 0 0 20px rgba(227, 30, 36, 0.1);
}

.seo-desc {
    font-size: 19px;
    color: #666;
    margin-top: 25px;
    line-height: 1.8;
}

/* Checklist */
.seo-checklist {
    margin-top: 35px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

.check-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 700;
    color: #3a3d74;
}

.check-item i { color: #28a745; font-size: 18px; }

/* SEO Button */
.seo-action-btn {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 18px 40px;
    border-radius: 50px;
    font-weight: 800;
    display: inline-block;
    transition: 0.4s;
}

.seo-action-btn:hover {
    background: #e31e24;
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(227, 30, 36, 0.3);
}

.client-success { border-left: 2px solid #eee; padding-left: 20px; }
.client-success strong { display: block; font-size: 24px; color: #3a3d74; }
.client-success small { color: #888; font-weight: 700; }

/* Visual Side: Google Mockup */
.seo-visual-stack {
    position: relative;
    padding: 20px;
}

.google-mockup {
    background: #fff;
    border-radius: 20px;
    border: 1px solid #eee;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.g-header {
    background: #f8f9fa;
    padding: 15px 25px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.g-logo { font-weight: 900; color: #4285F4; font-size: 18px; }
.g-search-bar { 
    background: #fff; border: 1px solid #ddd; padding: 5px 20px; 
    border-radius: 50px; font-size: 12px; color: #888; flex: 1;
}

.result-item { margin-bottom: 20px; }
.active-rank { border-left: 4px solid #4285F4; padding-left: 15px; }
.r-link { font-size: 12px; color: #006621; }
.r-title { font-size: 18px; color: #1a0dab; font-weight: 600; cursor: pointer; }
.r-title:hover { text-decoration: underline; }
.r-desc { font-size: 14px; color: #545454; }

/* Floating Analytics Card */
.analytics-card {
    position: absolute;
    bottom: -20px;
    right: -20px;
    background: #fff;
    padding: 20px;
    border-radius: 15px;
    z-index: 3;
    min-width: 200px;
}

.progress-wrap { height: 8px; background: #eee; border-radius: 50px; overflow: hidden; margin-top: 10px; }
.progress-bar-seo { width: 85%; height: 100%; background: #28a745; animation: grow 3s infinite; }

.seo-bg-orb {
    position: absolute;
    top: 50%; left: 50%;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(227, 30, 36, 0.05) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    z-index: 1;
}

/* Animation */
@keyframes grow { 0% { width: 0%; } 100% { width: 85%; } }
@keyframes float-y { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }
.animate-float { animation: float-y 4s infinite; }

@media (max-width: 991px) {
    .seo-title { font-size: 2.8rem; }
    .seo-checklist { grid-template-columns: 1fr; }
    .analytics-card { position: static; margin-top: 20px; }
}

/* --- Hire Branding Expert Section --- */
.studio-title {
    font-size: 4.5rem;
    font-weight: 900;
    color: #3a3d74;
    line-height: 1.1;
}
.studio-gradient{
    color: #e31e24;
}
.studio-desc {
    font-size: 19px;
    color: #555;
    margin-top: 30px;
    line-height: 1.8;
}

/* Service Pills */
.branding-services {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.s-pill {
    background: #f8f9fa;
    padding: 8px 20px;
    border-radius: 50px;
    font-weight: 700;
    color: #3a3d74;
    border: 1px solid #eee;
    font-size: 14px;
    transition: 0.3s;
}

.s-pill:hover { background: #3a3d74; color: #fff; border-color: #3a3d74; }

/* Studio Button */
.studio-btn {
    background: #3a3d74;
    color: #fff !important;
    text-decoration: none;
    padding: 20px 40px;
    border-radius: 0 25px 0 25px; /* Unique Creative Cut */
    font-weight: 800;
    display: inline-block;
    transition: 0.4s;
}

.studio-btn:hover {
    background: #e31e24;
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(227, 30, 36, 0.2);
}

.award-tag { display: flex; align-items: center; gap: 10px; color: #888; font-weight: 700; }
.award-tag i { color: #ffc107; font-size: 20px; }

/* Right Side: Visuals */
.visual-identity-stack {
    position: relative;
    padding: 60px;
}

.abstract-circle {
    position: absolute;
    top: 0; right: 0;
    width: 100%; height: 100%;
    background: radial-gradient(circle, rgba(58, 61, 116, 0.03) 0%, transparent 70%);
    z-index: 1;
}

.identity-card {
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    position: relative;
    z-index: 2;
    border: 1px solid #eee;
    max-width: 350px;
    margin: 0 auto;
}

.card-top { display: flex; align-items: center; gap: 15px; margin-bottom: 25px; }
.brand-logo-mock {
    width: 50px; height: 50px; background: #3a3d74; color: #fff;
    display: flex; align-items: center; justify-content: center;
    border-radius: 12px; font-weight: 900; font-size: 24px;
}

.color-palette { display: flex; gap: 10px; margin-bottom: 25px; }
.c-box { flex: 1; height: 40px; border-radius: 8px; }

.typo-sample {
    font-size: 40px; font-weight: 900; color: #3a3d74;
    border-top: 1px solid #eee; padding-top: 15px;
}

.floating-badge {
    position: absolute;
    background: #fff;
    padding: 15px 25px;
    border-radius: 15px;
    display: flex; align-items: center; gap: 12px;
    font-weight: 800; font-size: 14px;
    z-index: 3;
}

.fb-1 { top: 10%; right: 0; color: #3a3d74; }
.fb-2 { bottom: 10%; left: 0; color: #e31e24; }

.animate-float { animation: float-y 4s infinite; }
.animate-float-delayed { animation: float-y 4s infinite 2s; }

@keyframes float-y {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

@media (max-width: 991px) {
    .studio-title { font-size: 2.8rem; }
    .identity-card { margin-top: 40px; }
    .floating-badge { position: static; margin-top: 20px; }
}

section {
    scroll-margin-top: 120px;
}

/* --- Services Tagline Styling --- */
.services-tagline-section {
    background: #fdfdfd;
    padding: 60px 0;
}

.main-tagline {
    font-size: 42px;
    font-weight: 900;
    color: #3a3d74;
    letter-spacing: -0.5px;
    line-height: 1.2;
}

.main-tagline .red-text {
    color: #e31e24;
}

.tagline-badge {
    display: inline-block;
    background: rgba(227, 30, 36, 0.1);
    color: #e31e24;
    padding: 6px 20px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.tagline-divider {
    width: 80px;
    height: 4px;
    background: #3a3d74;
    margin-top: 25px;
    border-radius: 10px;
}

/* મોબાઈલ માટે રિસ્પોન્સિવ */
@media (max-width: 768px) {
    .main-tagline {
        font-size: 28px;
        padding: 0 15px;
    }
}


/* =========================
   TABLET + MOBILE
========================= */
@media (max-width: 991px) {

  .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  section {
    padding: 60px 0 !important;
  }

  /* all major headings */
  .ultra-title,
  .marketing-title,
  .story-title,
  .ultra-heading,
  .ios-title,
  .wp-title,
  .minimal-title,
  .seo-title,
  .studio-title {
    font-size: 2.2rem !important;
    line-height: 1.3 !important;
    word-break: break-word;
  }

  /* all text */
  .ultra-desc,
  .marketing-text,
  .story-desc,
  .ultra-text,
  .ios-desc,
  .wp-desc,
  .minimal-desc,
  .seo-desc,
  .studio-desc {
    font-size: 15px !important;
    line-height: 1.7 !important;
    max-width: 100% !important;
  }

  /* grid to single column */
  .feature-grid,
  .wp-features-grid,
  .seo-checklist {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 15px !important;
  }

  /* flex to column */
  .writer-perks,
  .tech-stack-minimal,
  .ios-feature-list,
  .branding-services,
  .action-section,
  .mt-5.d-flex {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 15px !important;
  }

  /* buttons */
  .premium-btn-neon,
  .marketing-btn,
  .ink-button,
  .neon-btn,
  .ios-btn-dark,
  .wp-main-btn,
  .minimal-btn,
  .seo-action-btn,
  .studio-btn {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    padding: 14px 18px !important;
    font-size: 14px !important;
  }

  /* remove transform causing left-right issue */
  .main-visual-box,
  .android-master-card,
  .writer-main-img {
    transform: none !important;
  }

  /* floating cards reset */
  .top-right,
  .bottom-left,
  .performance-card,
  .trust-card,
  .writing-card,
  .floating-component,
  .ios-glass-badge,
  .tool-card,
  .floating-performance,
  .analytics-card,
  .floating-badge {
    position: static !important;
    width: 100% !important;
    margin-top: 20px !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    min-width: unset !important;
  }

  /* image sections */
  .main-visual-box,
  .marketing-img-box,
  .writer-main-img,
  .android-master-card,
  .wp-site-card,
  .img-container-premium,
  .identity-card {
    width: 100% !important;
    margin-top: 25px !important;
    border-radius: 20px !important;
  }

  .iphone-frame {
    width: 220px !important;
    height: 440px !important;
    margin: 25px auto !important;
  }

  /* hide large decorative effects */
  .glow-sphere,
  .mesh-gradient,
  .ink-blob,
  .glow-blur,
  .ios-glow-circle,
  .wp-bg-shape,
  .bg-blur-circle,
  .seo-bg-orb,
  .abstract-circle {
    display: none !important;
  }
}

/* =========================
   SMALL MOBILE
========================= */
@media (max-width: 576px) {

  .ultra-title,
  .marketing-title,
  .story-title,
  .ultra-heading,
  .ios-title,
  .wp-title,
  .minimal-title,
  .seo-title,
  .studio-title {
    font-size: 1.8rem !important;
  }

  .creative-badge {
    font-size: 11px !important;
    letter-spacing: 1px !important;
  }

  .iphone-frame {
    width: 190px !important;
    height: 380px !important;
  }
}