/* =========================================================
   73studio – custom overrides (loaded after theme CSS)
   Palette: orange #FB6602 · navy #1A3380 · blue #1E75D9 · sky #A8DAF5
   ========================================================= */

/* ---------- Nav: "Interactive Demo" button ---------- */
#Top_bar .menu > li.nav-cta > a { padding: 25px 0 25px 14px; }
#Top_bar .menu > li.nav-cta > a:after { display: none; }
#Top_bar .menu > li.nav-cta > a span:not(.description) {
    background: #FB6602;
    color: #fff;
    line-height: 40px;
    padding: 0 20px;
    border: 0;
    border-radius: 4px;
    font-weight: 600;
    transition: background .2s ease;
}
#Top_bar .menu > li.nav-cta > a:hover span:not(.description) { background: #e25a00; }
#Top_bar .menu > li.nav-cta > a span:not(.description):before {
    content: "\25B6"; font-size: 9px; margin-right: 8px; position: relative; top: -1px;
}
/* sticky header is shorter */
#Top_bar.is-sticky .menu > li.nav-cta > a { padding-top: 10px; padding-bottom: 10px; }
#Top_bar.is-sticky .menu > li.nav-cta > a span:not(.description) { line-height: 40px; }

@media only screen and (max-width: 1239px) {
    #Top_bar #menu ul li.nav-cta a { padding: 8px 20px 12px; }
    #Top_bar #menu ul li.nav-cta a span {
        display: inline-block; line-height: 40px; padding: 0 18px;
        background: #FB6602; color: #fff; border-radius: 4px;
    }
}

/* ---------- Hero ---------- */
.flv_rev_3 { color: #1A3380 !important; font-weight: 400; }
.hero-ctas { white-space: nowrap; }
.hero-btn {
    display: inline-block;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
    padding: 13px 24px;
    border-radius: 4px;
    text-decoration: none !important;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
    vertical-align: middle;
}
.hero-btn + .hero-btn { margin-left: 12px; }
.hero-btn--primary { background: #FB6602; color: #fff !important; border: 2px solid #FB6602; }
.hero-btn--primary:hover { background: #e25a00; border-color: #e25a00; }
.hero-btn--ghost { background: transparent; color: #1A3380 !important; border: 2px solid #1A3380; }
.hero-btn--ghost:hover { background: #1A3380; color: #fff !important; }

/* ---------- Real-time block ---------- */
.rt-preview { position: relative; display: block; }
.rt-play {
    position: absolute; left: 50%; top: 50%;
    width: 76px; height: 76px; margin: -38px 0 0 -38px;
    border-radius: 50%;
    background: rgba(251,102,2,.92);
    color: #fff; font-size: 28px; line-height: 76px; text-align: center;
    box-shadow: 0 6px 24px rgba(0,0,0,.25);
    transition: transform .2s ease;
}
.rt-play i { margin-left: 4px; }
.rt-preview:hover .rt-play, .pf-card:hover .rt-play { transform: scale(1.08); }

.column_offer .offer .offer_li .desc_wrapper.rt-desc { margin: 40px 20px 30px 40px; width: calc(50% - 60px); }
.rt-preview img { float: none !important; width: 100%; height: auto; }
.rt-lead { font-size: 22px; line-height: 1.35; color: #1A3380; margin: 0 0 10px; }
.rt-sub  { font-size: 15px; color: #1E75D9; margin: 0 0 26px; }
.rt-cta  { margin-bottom: 30px; }

.rt-download { border-top: 1px solid rgba(26,51,128,.15); padding-top: 16px; font-size: 14px; }
.rt-download summary { cursor: pointer; color: #1A3380; list-style-position: inside; }
.rt-download summary:hover { color: #FB6602; }
.rt-download-body { padding: 14px 0 0 2px; }
.rt-download-link { font-weight: 600; }
.rt-download ol { margin: 12px 0 0 18px; color: #1A3380; }
.rt-download ol li { margin-bottom: 6px; list-style: decimal; }

/* ---------- Portfolio link cards (landing) ---------- */
.pf-links { padding: 40px 0 70px; }
.pf-links .section_wrapper { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.pf-links .fancy_heading { text-align: center; margin-bottom: 36px; }
.pf-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.pf-card {
    display: block; background: #fff; border-radius: 6px; overflow: hidden;
    box-shadow: 0 4px 18px rgba(26,51,128,.12);
    text-decoration: none !important;
    transition: transform .2s ease, box-shadow .2s ease;
}
.pf-card:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(26,51,128,.2); }
.pf-card-img { position: relative; display: block; padding-top: 56.25%; background-size: cover; background-position: center; }
.pf-card-body { display: block; padding: 22px 26px 26px; }
.pf-card-title { display: block; font-size: 24px; color: #1A3380; margin-bottom: 6px; }
.pf-card-text  { display: block; font-size: 15px; color: #1E75D9; margin-bottom: 14px; }
.pf-card-link  { display: block; font-size: 15px; font-weight: 600; color: #FB6602; }

@media only screen and (max-width: 767px) {
    .pf-cards { grid-template-columns: 1fr; }
    .column_offer .offer .offer_li .desc_wrapper.rt-desc { margin: 24px 20px; width: auto; }
}

/* =========================================================
   portfolio.html
   ========================================================= */
.pf-page-head { text-align: center; padding: 60px 20px 10px; }
.pf-page-head h1 { color: #1A3380; font-size: 42px; margin: 0 0 10px; }
.pf-page-head p { color: #1E75D9; font-size: 17px; margin: 0; }

.pf-section { max-width: 1320px; margin: 0 auto; padding: 40px 20px 30px; }
.pf-section h2 { color: #1A3380; text-align: center; margin-bottom: 22px; }

.pf-filters { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 26px; }
.pf-filters button {
    font: inherit; font-size: 14px; cursor: pointer;
    padding: 8px 18px; border-radius: 20px;
    border: 2px solid #1A3380; background: transparent; color: #1A3380;
}
.pf-filters button:hover { border-color: #FB6602; color: #FB6602; }
.pf-filters button.is-active { background: #1A3380; color: #fff; border-color: #1A3380; }

.pf-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.pf-item {
    position: relative; display: block; overflow: hidden; border-radius: 4px;
    aspect-ratio: 16 / 10; background: #8fc6e6; cursor: zoom-in; padding: 0; border: 0;
}
.pf-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.pf-item:hover img { transform: scale(1.04); }
.pf-item-cap {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 10px; text-align: left;
    background: linear-gradient(transparent, rgba(10,20,50,.7));
    color: #fff; font-size: 13px; opacity: 0; transition: opacity .25s ease;
}
.pf-item:hover .pf-item-cap, .pf-item:focus .pf-item-cap { opacity: 1; }
.pf-item.is-hidden { display: none; }

@media only screen and (max-width: 959px) { .pf-grid { grid-template-columns: repeat(2, 1fr); } }
@media only screen and (max-width: 560px) { .pf-grid { grid-template-columns: 1fr; } .pf-item-cap { opacity: 1; } }

.pf-reel { max-width: 1180px; margin: 0 auto; }
.pf-reel .pf-video { position: relative; padding-top: 56.25%; background: #000; border-radius: 4px; overflow: hidden; }
.pf-reel .pf-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.pf-cta-band { text-align: center; padding: 40px 20px 70px; }
.pf-cta-band p { color: #1A3380; font-size: 20px; margin-bottom: 18px; }

/* Lightbox */
.lb { position: fixed; inset: 0; z-index: 10000; background: rgba(5,10,25,.94); display: none; align-items: center; justify-content: center; }
.lb.is-open { display: flex; }
.lb img { max-width: 92vw; max-height: 84vh; box-shadow: 0 10px 40px rgba(0,0,0,.5); }
.lb-cap { position: absolute; bottom: 18px; left: 0; right: 0; text-align: center; color: #fff; font-size: 14px; }
.lb button {
    position: absolute; background: none; border: 0; color: #fff; cursor: pointer;
    font-size: 40px; line-height: 1; padding: 16px; opacity: .8;
}
.lb button:hover { opacity: 1; color: #FB6602; }
.lb-close { top: 8px; right: 12px; }
.lb-prev { left: 8px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 8px; top: 50%; transform: translateY(-50%); }

/* Real-time: single item, hide the theme's slider controls */
#Real-time ~ .section .offer .slider_prev, #Real-time ~ .section .offer .slider_next, #Real-time ~ .section .offer .slider_pagination, .column_offer .offer .slider_prev, .column_offer .offer .slider_next, .column_offer .offer .slider_pagination { display: none !important; }

@media only screen and (max-width: 767px) {
    .pf-page-head { padding-top: 20px; }
    .pf-page-head h1 { font-size: 34px; }
}

/* Hero description: readable weight/contrast (theme used Roboto 300) */
.tp-caption.mfnrs_home_small, .mfnrs_home_small, .mfnrs_home_small .flv_rev_3 { font-weight: 400 !important; color: #1A3380 !important; }

/* "Choose your product" subtitle */
.platform-sub { text-align: center; color: #1E75D9; font-size: 17px; margin: 8px 0 0; }

/* Real-time: download block */
.rt-alt { color: #1A3380; font-size: 15px; margin: 0 0 12px; }
.rt-size { font-weight: 400; font-size: 12px; opacity: .85; margin-left: 6px; }
.rt-download { border-top: 0; padding-top: 0; }
.column_offer .offer .slick-list { height: auto !important; }

/* Portfolio: renders are 3:2; tighter spacing between grid and reel */
.pf-item { aspect-ratio: 3 / 2; }
#renders { padding-bottom: 10px; }
#reel { padding-top: 20px; padding-bottom: 70px; }
.pf-reel { max-width: none; }
