:root{ --bg-color:#FCFCFC; --text-dark:#111111; --text-muted:#666666; --text-light:#999999; --accent:#111111; --border-light:rgba(0, 0, 0, 0.05); --white:#FFFFFF; --font-main:'Inter', sans-serif; --font-serif:'Newsreader', serif; --transition:all 0.4s cubic-bezier(0.16, 1, 0.3, 1); --max-width:1200px; }*{ margin:0; padding:0; box-sizing:border-box;}html{ scroll-behavior:smooth; font-size:16px;}body{ font-family:var(--font-main); background-color:var(--bg-color); color:var(--text-dark); line-height:1.6; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-x:hidden;}a{ color:var(--text-dark); text-decoration:none; transition:var(--transition);}img{ max-width:100%; height:auto; display:block;}h1,h2,h3,h4,h5,h6{ font-weight:500; line-height:1.1; letter-spacing:-0.02em; color:var(--text-dark);}p{ margin-bottom:1.5rem; color:var(--text-muted);}.italic-serif{ font-family:var(--font-serif); font-style:italic; font-weight:400;}.container{ width:100%; max-width:var(--max-width); margin:0 auto; padding:0 5%;}section{ padding:5rem 0; min-height:auto; display:flex; flex-direction:column; justify-content:center;}.section-header-centered{ text-align:center; margin-bottom:4rem;}@media (max-width:768px){ .section-header-centered{ margin-bottom:3rem; }}.section-title-small{ font-family:'Newsreader', serif; font-style:italic; font-size:2.5rem; color:var(--text-dark); font-weight:400; letter-spacing:-0.02em; text-transform:none;}.reading-progress-container{ position:fixed; top:0; left:0; width:100%; height:4px; background:transparent; z-index:9999;}.reading-progress-bar{ height:100%; background:#10B981; width:0%; border-top-right-radius:4px; border-bottom-right-radius:4px; transition:width 0.1s ease-out;}.article-toc{ background:#f8f9fa; border:1px solid #eaeaea; border-radius:8px; padding:25px; margin:20px 0 40px 0; box-shadow:0 4px 15px rgba(0, 0, 0, 0.02);}.toc-title{ font-size:1.2rem; font-weight:700; color:var(--text-dark); margin-bottom:15px; text-transform:uppercase; letter-spacing:0.5px;}.toc-list{ list-style-type:none !important; padding-left:0 !important; margin:0 !important;}.toc-list li{ margin-bottom:10px !important; line-height:1.4 !important;}.toc-list li:last-child{ margin-bottom:0 !important;}.toc-list a{ color:#444; text-decoration:none; font-size:1rem; transition:color 0.2s, padding-left 0.2s; display:inline-block;}.toc-list a:hover{ color:var(--primary); padding-left:5px;}.article-faqs h3{ font-family:inherit; font-weight:700; color:var(--text-dark);}.faq-item{ transition:transform 0.2s, box-shadow 0.2s;}.faq-item:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0, 0, 0, 0.04);}.nav-wrapper{ position:fixed; top:1.5rem; left:0; width:100%; display:flex; justify-content:center; z-index:1000; padding:0 5%; pointer-events:none; }.site-nav{ pointer-events:auto; display:flex; align-items:center; background-color:rgba(255, 255, 255, 0.85); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid var(--border-light); border-radius:50px; padding:0.5rem 0.5rem 0.5rem 1.5rem; box-shadow:0 4px 20px rgba(0, 0, 0, 0.03);}.logo{ color:var(--text-dark);}.nav-links{ display:flex; list-style:none; gap:2rem; margin:0 2rem;}.nav-links li a{ font-size:0.9rem; font-weight:500; color:var(--text-dark);}.nav-links li a:hover{ color:var(--text-dark);}.nav-btn{ background-color:var(--text-dark); color:var(--white); padding:0.6rem 1.2rem; border-radius:50px; font-size:0.85rem; font-weight:500; transition:var(--transition);}.nav-btn:hover{ background-color:#333; color:var(--white);}.mobile-menu-btn{ display:none; background:none; border:none; cursor:pointer; font-size:1.2rem; color:var(--text-dark); padding:0.5rem; margin-left:1rem;}.hero{ min-height:80vh; display:flex; align-items:center; padding-top:100px; background-color:var(--bg-color); text-align:center;}.hero-content-centered{ max-width:900px; margin:0 auto;}.hero-avatar{ margin-bottom:2rem;}.hero-avatar img{ width:80px; height:80px; border-radius:50%; object-fit:cover; margin:0 auto;}.hero-greeting{ font-size:1.2rem; color:var(--text-muted); margin-bottom:1rem;}.hero-text-centered h1{ font-size:clamp(2.5rem, 5vw, 4.5rem); line-height:1.15; margin-bottom:2rem; color:#000;}.hero-text-centered .subtitle{ font-size:1.2rem; color:var(--text-muted); margin-bottom:3rem; max-width:600px; margin-left:auto; margin-right:auto;}.btn-pill{ display:inline-flex; align-items:center; gap:10px; padding:0.8rem 1.5rem; background-color:var(--white); border:1px solid var(--border-light); border-radius:50px; font-weight:500; font-size:0.9rem; box-shadow:0 4px 15px rgba(0, 0, 0, 0.02); transition:var(--transition);}.btn-pill:hover{ border-color:rgba(0, 0, 0, 0.15); box-shadow:0 4px 20px rgba(0, 0, 0, 0.05); transform:translateY(-2px);}.status-dot{ width:8px; height:8px; background-color:#10B981; border-radius:50%; display:inline-block;}.about{ background-color:var(--white); border-top:1px solid var(--border-light);}.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:start;}.lead-text p{ font-size:1.3rem; line-height:1.7; color:var(--text-dark);}.about-stats-clean{ display:flex; flex-direction:column; gap:2rem;}.stat-item-clean{ display:flex; flex-direction:column; gap:0.5rem;}.stat-item-clean .stat-title{ font-size:0.85rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted);}.stat-item-clean .stat-value{ font-size:1.2rem; font-weight:500;}.services{ background-color:var(--bg-color);}.expertise-disks-wrapper{ display:flex; flex-direction:column; background:#fdfdfd; border:1px solid #e0e0e0; border-radius:12px; overflow:hidden; box-shadow:0 4px 20px rgba(0, 0, 0, 0.02);}.expertise-disks{ display:grid; grid-template-columns:repeat(4, 1fr); position:relative; border-bottom:1px solid #e0e0e0;}.expertise-disk{ position:relative; aspect-ratio:1 / 1; border-right:1px solid #e0e0e0; display:flex; align-items:center; justify-content:center;}.expertise-disk:last-child{ border-right:none;}.disk-tick{ position:absolute; top:15px; left:50%; transform:translateX(-50%); width:2px; height:12px; background:#fff; z-index:2;}.expertise-disk::after{ content:""; position:absolute; top:5%; left:5%; right:5%; bottom:5%; background:var(--disk-bg, #ebebeb); border-radius:50%; z-index:1; transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), background 0.4s ease;}.expertise-disk:hover::after{ transform:scale(1.03); }.disk-animated-elements{ position:absolute; top:5%; left:5%; right:5%; bottom:5%; border-radius:50%; pointer-events:none; opacity:0; transition:opacity 0.4s ease; z-index:2; overflow:hidden;}.expertise-disk:hover .disk-animated-elements{ opacity:1;}.disk-hand{ position:absolute; top:50%; left:50%; width:2px; height:48%; background:white; transform-origin:top center; filter:drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.5)); }.disk-ring{ position:absolute; top:0; left:0; width:100%; height:100%; overflow:visible;}.disk-ring text{ font-family:var(--font-primary); font-size:8px; fill:#fff; letter-spacing:2px; text-transform:uppercase; font-weight:500; filter:drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.5));}.disk-content{ position:relative; z-index:3; display:flex; align-items:center; gap:12px;}.disk-letter{ display:flex; align-items:center; justify-content:center; width:32px; height:32px; background:#fff; border-radius:50%; font-size:0.9rem; font-weight:500; color:#888; box-shadow:0 2px 8px rgba(0, 0, 0, 0.05);}.disk-title{ font-family:var(--font-primary); font-size:1.1rem; font-weight:400; color:#444; margin:0;}.expertise-footer{ display:flex; justify-content:space-between; padding:1.5rem 2rem; background:#fdfdfd;}.weapons-of-choice,.projects-built{ display:flex; align-items:center; gap:1rem;}.footer-label{ font-size:0.9rem; color:#888; font-weight:500;}.weapons-icons,.projects-icons{ display:flex; gap:0.6rem;}.weapon-icon{ display:flex; align-items:center; justify-content:center; width:40px; height:40px; background:#f2f2f2; border-radius:8px; color:#555; font-size:1.2rem; border:1px solid #eaeaea;}@media (max-width:992px){ .expertise-disks{ grid-template-columns:repeat(2, 1fr); } .expertise-disk:nth-child(2){ border-right:none; } .expertise-disk:nth-child(1), .expertise-disk:nth-child(2){ border-bottom:1px solid #e0e0e0; }}@media (max-width:576px){ .expertise-disks{ grid-template-columns:1fr; } .expertise-disk{ border-right:none !important; border-bottom:1px solid #e0e0e0; min-height:250px; } .expertise-disk:last-child{ border-bottom:none; } .expertise-footer{ flex-direction:column; align-items:center; gap:1.5rem; padding:2rem 1rem; text-align:center; } .weapons-of-choice, .projects-built{ flex-direction:column; gap:0.8rem; }}.certificates-wrapper{ margin-top:3rem; text-align:center; position:relative; z-index:10;}.cert-title{ margin-bottom:2.5rem; font-size:2.2rem; }@media (max-width:768px){ .cert-title{ font-size:1.8rem; margin-bottom:1.5rem; }}.cert-list{ display:flex; justify-content:center; align-items:center; gap:0; max-width:1200px; margin:0 auto;}.cert-badge{ display:block; position:relative; overflow:visible; box-shadow:none; background:transparent; padding:0; margin:0 -4%; z-index:1; transition:transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), z-index 0s;}.cert-badge:hover{ transform:translateY(-5px) scale(1.08); z-index:10;}.cert-badge img{ width:100%; max-width:550px; height:auto; display:block; margin:0 auto; transform:scale(1.35); }@media (max-width:768px){ .cert-list{ grid-template-columns:1fr; max-width:450px; }}.portfolio{ background-color:var(--white); border-top:1px solid var(--border-light);}.portfolio-grid-large{ display:grid; grid-template-columns:1fr; gap:4rem;}@media (min-width:900px){ .portfolio-grid-large{ grid-template-columns:repeat(2, 1fr); }}.portfolio-item-large{ position:relative; overflow:hidden; border-radius:16px; background:#f0f0f0;}.portfolio-item-large a{ display:block; position:relative;}.portfolio-img-large{ position:relative; padding-top:75%; overflow:hidden;}.portfolio-img-large img{ position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; transition:transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);}.portfolio-item-large:hover .portfolio-img-large img{ transform:scale(1.03);}.portfolio-info-overlay{ padding:1.5rem 0;}.portfolio-info-content h4{ font-size:1.3rem; margin-bottom:0.5rem;}.portfolio-tech{ font-size:0.85rem; color:var(--text-muted);}.view-project-btn{ font-size:0.9rem; color:var(--text-muted);}.portfolio-info-overlay .portfolio-tech{ margin-bottom:0;}.portfolio{ background-color:var(--white); border-top:1px solid var(--border-light); overflow:hidden;}.marquee-container{ width:100%; overflow:hidden; padding:1rem 0;}.marquee-row{ width:100%; overflow:hidden; margin-bottom:2rem; display:flex;}.marquee-track{ display:flex; align-items:flex-start; gap:24px; width:max-content; }.marquee-row:hover .marquee-track{ animation-play-state:paused;}.marquee-left .marquee-track{ animation:scroll-left 90s linear infinite;}.marquee-right .marquee-track{ animation:scroll-right 90s linear infinite;}.marquee-reviews .marquee-track{ animation-duration:150s;}@keyframes scroll-left{ 0%{ transform:translateX(0); } 100%{ transform:translateX(calc(-50% - 12px)); }}@keyframes scroll-right{ 0%{ transform:translateX(calc(-50% - 12px)); } 100%{ transform:translateX(0); }}.marquee-item{ width:400px; height:300px; flex-shrink:0; border-radius:16px; overflow:hidden; background:#f0f0f0; position:relative;}@media (max-width:480px){ .marquee-item{ width:280px; height:210px; }}.marquee-item img{ width:100%; height:100%; object-fit:cover; transition:transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), filter 0.6s ease; filter:brightness(0.95);}.marquee-item:hover img{ transform:scale(1.05); filter:brightness(1.05);}.blog-section{ background-color:var(--white); padding:4rem 0;}.blog-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:2rem; margin-top:2rem;}.blog-card{ background:var(--white); border:1px solid rgba(0, 0, 0, 0.05); border-radius:16px; padding:2.5rem; display:flex; flex-direction:column; transition:all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); box-shadow:0 4px 15px rgba(0, 0, 0, 0.02);}.blog-card:hover{ transform:translateY(-6px); box-shadow:0 15px 35px rgba(0, 0, 0, 0.06); border-color:rgba(0, 0, 0, 0.08);}.blog-date{ font-size:0.85rem; font-weight:500; text-transform:uppercase; letter-spacing:1px; color:#10a37f; margin-bottom:1rem; display:block;}.blog-title{ font-family:var(--font-primary); font-weight:500; font-style:normal; font-size:1.25rem; line-height:1.3; margin-bottom:1rem;}.blog-title a{ color:var(--text-dark); text-decoration:none; transition:color 0.3s ease;}.blog-title a:hover{ color:var(--text-muted);}.blog-excerpt{ font-size:1rem; color:var(--text-muted); line-height:1.6; margin-bottom:1.5rem; flex-grow:1;}.blog-read-more{ display:inline-flex; align-items:center; font-weight:600; font-size:0.9rem; color:var(--text-dark); text-decoration:none; transition:transform 0.3s ease;}.blog-read-more:hover{ transform:translateX(4px);}.recommendations{ background-color:var(--bg-color); border-top:1px solid var(--border-light); overflow:hidden;}.marquee-reviews .marquee-item,.egebese-review-card{ width:320px; height:auto; flex-shrink:0; background:var(--white); padding:1.5rem; border-radius:12px; border:1px solid var(--border-light); box-shadow:0 10px 10px -5px rgba(0, 0, 0, 0.03); display:flex; flex-direction:column; justify-content:flex-start; gap:1.5rem;}.egebese-review-card .section-title-small{ font-size:0.85rem; font-weight:600; text-transform:uppercase; letter-spacing:2px; color:var(--text-dark); margin-bottom:2rem; opacity:0.6;}.egebese-review-card .review-quote{ font-size:1rem; line-height:1.5; color:var(--text-muted); margin-bottom:0; font-family:var(--font-body); font-style:normal;}.egebese-review-card .review-author{ display:flex; align-items:center; gap:1rem;}.hero-actions{ display:flex; justify-content:center; gap:1.5rem; margin-bottom:0;}.hero-signature{ font-family:'Newsreader', serif; font-style:italic; font-size:2.5rem; margin-top:1.5rem; opacity:0.8;}.egebese-review-card .review-avatar img{ width:44px; height:44px; border-radius:50%; object-fit:cover;}.egebese-review-card .review-meta strong{ display:block; font-size:0.9rem; color:var(--text-muted); font-weight:600; line-height:1.2; margin-bottom:0.2rem;}.egebese-review-card .review-meta span{ display:block; font-size:0.8rem; color:var(--text-muted); line-height:1.3;}.contact{ background-color:var(--white); border-top:1px solid var(--border-light);}.contact-grid-clean{ display:grid; grid-template-columns:1fr 1fr; gap:6rem;}.available-badge-wrapper{ display:inline-flex; align-items:center; gap:10px; background:#f0fdf4; border:1px solid #bbf7d0; padding:0.4rem 1rem; border-radius:50px; margin-bottom:1.5rem;}.available-text{ font-size:0.9rem; font-weight:500; color:#166534;}.pulsing-green-dot{ width:10px; height:10px; background-color:#22c55e; border-radius:50%; box-shadow:0 0 0 0 rgba(34, 197, 94, 0.7); animation:pulse-green 2s infinite;}@keyframes pulse-green{ 0%{ box-shadow:0 0 0 0 rgba(34, 197, 94, 0.7); } 70%{ box-shadow:0 0 0 10px rgba(34, 197, 94, 0); } 100%{ box-shadow:0 0 0 0 rgba(34, 197, 94, 0); }}.contact-heading{ font-size:clamp(2rem, 4vw, 3.5rem); line-height:1.1; margin-bottom:2rem;}.contact-sub{ font-size:1.2rem; margin-bottom:3rem;}.social-links-large{ display:flex; flex-direction:column; gap:1rem;}.social-links-large a{ font-size:1.1rem; font-weight:500; display:inline-block;}.social-links-large a:hover{ opacity:0.6;}.contact-detail-item{ display:flex; align-items:center; gap:14px; margin-bottom:20px;}.contact-detail-item i{ width:40px; height:40px; display:flex; align-items:center; justify-content:center; background:#f0f0f0; border-radius:10px; color:#1a1f24; font-size:1rem; flex-shrink:0;}.contact-detail-item a{ color:#1a1f24; text-decoration:none; font-weight:500; transition:color 0.2s;}.contact-detail-item a:hover{ color:#10a37f;}.contact-detail-item span{ color:#888; font-size:0.85rem; display:block;}.contact-form-minimal{ display:flex; flex-direction:column; gap:1.5rem;}.form-group label{ display:block; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); margin-bottom:0.5rem;}.contact-form-minimal .form-control{ width:100%; padding:1rem 0; border:none; border-bottom:1px solid #cccccc; background:transparent; font-family:var(--font-main); font-size:1.1rem; color:var(--text-dark); transition:border-color 0.3s ease; border-radius:0; }.contact-form-minimal .form-control:focus{ outline:none; border-bottom-color:var(--text-dark);}.contact-form-minimal textarea.form-control{ resize:vertical; min-height:100px;}.contact-form-minimal .btn-primary{ align-self:flex-start; background-color:var(--text-dark); color:var(--white); border-radius:50px; padding:1rem 2rem; font-size:1rem; font-weight:500; border:none; cursor:pointer; transition:var(--transition); margin-top:1rem;}.contact-form-minimal .btn-primary:hover{ background-color:#333;}.footer{ padding:3rem 0; background-color:var(--white); text-align:center; border-top:1px solid var(--border-light);}.footer p{ margin:0; font-size:0.85rem; color:var(--text-muted);}.fade-up{ opacity:0; transform:translateY(30px); transition:opacity 0.8s ease-out, transform 0.8s ease-out;}.fade-up.visible{ opacity:1; transform:translateY(0);}.fade-up-stagger{ opacity:0; transform:translateY(30px); transition:opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);}.fade-up-stagger.visible{ opacity:1; transform:translateY(0);}.delay-1{ transition-delay:0.1s;}.delay-2{ transition-delay:0.2s;}.delay-3{ transition-delay:0.3s;}.delay-4{ transition-delay:0.4s;}.delay-5{ transition-delay:0.5s;}.delay-6{ transition-delay:0.6s;}@media (max-width:991px){ .about-grid, .contact-grid-clean{ grid-template-columns:1fr; gap:4rem; } .blog-grid{ grid-template-columns:repeat(2, 1fr); } .hero-text-centered h1{ font-size:2.5rem; }}@media (max-width:768px){ section{ padding:5rem 0; } .nav-wrapper{ top:1rem; padding:0 1rem; } .site-nav{ width:100%; justify-content:space-between; padding:0.5rem 1rem; } .nav-links{ display:none; position:absolute; top:100%; left:0; width:100%; background:rgba(255, 255, 255, 0.95); backdrop-filter:blur(10px); flex-direction:column; padding:2rem; border:1px solid var(--border-light); border-radius:12px; margin:1rem 0 0 0; text-align:center; } .nav-links.show{ display:flex; } .nav-btn{ display:none; } .mobile-menu-btn{ display:block; pointer-events:auto; } .blog-grid{ grid-template-columns:1fr; }}@media (max-width:480px){ .hero{ min-height:auto; padding-top:80px; padding-bottom:2rem; } .hero-text-centered h1{ font-size:1.8rem; word-break:break-word; overflow-wrap:break-word; } .hero-text-centered .subtitle{ font-size:1rem; } .hero-signature{ font-size:1.8rem; } .container{ padding:0 1.2rem; } section{ padding:3rem 0; } .section-title-small{ font-size:1.8rem; } .expertise-disks{ display:flex; flex-direction:column; align-items:center; gap:1.5rem; } .expertise-disk{ width:260px !important; height:260px !important; } .marquee-reviews .marquee-item, .egebese-review-card{ width:280px; } .hero-avatar img{ width:90px; height:90px; } .section-title{ font-size:2rem; } .btn-pill{ padding:0.8rem 1.5rem; font-size:0.95rem; } .blog-card{ padding:1.5rem; } .blog-title{ font-size:1.3rem; } .contact-heading{ font-size:1.8rem; } .contact-grid-clean{ gap:2rem; } .cert-list{ flex-direction:column; gap:1rem; } .cert-badge{ margin:0; } .cert-badge img{ transform:scale(1); max-width:100%; }}#scroll-top-btn{ position:fixed; bottom:2rem; right:2rem; width:44px; height:44px; background:var(--text-dark); color:var(--white); border:none; border-radius:50%; cursor:pointer; font-size:1.2rem; display:flex; align-items:center; justify-content:center; opacity:0; transform:translateY(10px); transition:opacity 0.3s ease, transform 0.3s ease; z-index:999; box-shadow:0 4px 20px rgba(0, 0, 0, 0.15);}#scroll-top-btn.visible{ opacity:1; transform:translateY(0);}#scroll-top-btn:hover{ background:#333;}
/* Blog Image Enhancement */
.blog-card-image {
    width: calc(100% + 5rem);
    margin-left: -2.5rem;
    margin-top: -2.5rem;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    margin-bottom: 1.5rem;
    border-radius: 16px 16px 0 0;
    background: #f4f5f6;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-card-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0.75rem;
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.blog-card:hover .blog-card-image img {
    transform: scale(1.03);
}

.blog-card {
    display: flex;
    flex-direction: column;
}

.blog-card header {
    flex-shrink: 0;
}

.blog-excerpt {
    flex-grow: 1;
}

@media (max-width: 768px) {
    .blog-card-image {
        width: calc(100% + 3rem);
        margin-left: -1.5rem;
        margin-top: -1.5rem;
        aspect-ratio: 16 / 10;
        margin-bottom: 1.2rem;
    }
}

/* ═══════════════════════════════════════════════════════════════
   Dreams & Stars — Promotional Banner (Toast Style)
   ═══════════════════════════════════════════════════════════════ */

.ds-toast-banner {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 100px; /* Restored to pill shape since text is short */
    padding: 1.5rem 2.5rem 1.5rem 1.5rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0,0,0,0.02);
    gap: 2.5rem;
    width: 900px;
    max-width: 100%;
    margin: 0 auto;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ds-toast-banner:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06), 0 6px 15px rgba(0,0,0,0.03);
}

.ds-toast-icon {
    width: 200px; 
    height: 200px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border: 1px solid rgba(0,0,0,0.05);
}

.ds-toast-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 5px;
}

.ds-toast-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
}

.ds-toast-title {
    font-weight: 600;
    font-size: 1.8rem;
    color: #111;
    line-height: 1.3;
    margin-bottom: 0.5rem;
}

.ds-toast-desc {
    font-size: 1.15rem;
    color: #555;
    line-height: 1.5;
}

.ds-toast-actions {
    display: flex;
    align-items: center;
    margin-left: 1rem;
    flex-shrink: 0;
}

.ds-toast-btn {
    background: #f2f2f2;
    color: #111;
    font-weight: 500;
    font-size: 1.15rem;
    padding: 1rem 2rem;
    border-radius: 50px;
    text-decoration: none;
    transition: background 0.2s, transform 0.2s;
    white-space: nowrap;
}

.ds-toast-btn:hover {
    background: #e2e2e2;
    transform: translateY(-2px);
}

/* Responsive */
@media (max-width: 900px) {
    .ds-toast-banner {
        border-radius: 24px;
        padding: 2rem 1.5rem;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1.5rem;
    }
    .ds-toast-icon {
        width: 120px;
        height: 120px;
    }
    .ds-toast-title {
        font-size: 1.4rem;
    }
    .ds-toast-desc {
        font-size: 1rem;
    }
    .ds-toast-actions {
        margin-left: 0;
        width: 100%;
        margin-top: 0.5rem;
    }
    .ds-toast-btn {
        width: 100%;
        text-align: center;
        font-size: 1rem;
        padding: 0.8rem 1.5rem;
    }
}

/* ═══════════════════════════════════════════════════════════════
   Contact Section — 3-Column Horizontal Layout (UI-UX-PRO-MAX)
   ═══════════════════════════════════════════════════════════════ */

/* Override container max-width for contact section */
.contact .container {
    max-width: 1440px;
    padding: 0 3%;
}

.contact-3col {
    display: grid;
    grid-template-columns: 1fr 1.3fr 1fr;
    gap: 2rem;
    align-items: start;
}

.contact-col {
    min-width: 0; /* prevent grid blowout */
}

.contact-calendly-col {
    border-left: 1px solid #e4e4e7;
    border-right: 1px solid #e4e4e7;
    padding: 0 1.5rem;
    overflow: hidden;
}

.contact-form-col {
    padding-top: 0;
    padding-left: 0.5rem;
}

/* Responsive: 2-col on medium screens */
@media (max-width: 1200px) {
    .contact .container {
        max-width: 100%;
        padding: 0 2%;
    }
    .contact-3col {
        gap: 1.5rem;
    }
    .contact-calendly-col {
        padding: 0 1rem;
    }
}

/* Responsive: stack on tablets and below */
@media (max-width: 992px) {
    .contact .container {
        max-width: var(--max-width);
        padding: 0 5%;
    }
    .contact-3col {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    .contact-calendly-col {
        border-left: none;
        border-right: none;
        border-top: 1px solid #e4e4e7;
        border-bottom: 1px solid #e4e4e7;
        padding: 2rem 0;
    }
    .contact-form-col {
        padding-left: 0;
    }
}

/* ═══════════════════════════════════════════════════════════════
   Expertise Disk — Text Overflow Fix
   ═══════════════════════════════════════════════════════════════ */

.disk-content {
    max-width: 80%;
    text-align: center;
    flex-direction: column;
    justify-content: center;
}

.disk-title {
    font-size: clamp(0.8rem, 1.2vw, 1.1rem);
    line-height: 1.3;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
    text-align: center;
}

@media (max-width: 992px) {
    .disk-title {
        font-size: 0.95rem;
    }
}

@media (max-width: 576px) {
    .disk-title {
        font-size: 1rem;
    }
    .disk-content {
        max-width: 70%;
    }
}