/*! ------------------------------------------------ * Project Name: Rayo - Digital Agency & Personal Portfolio Next.Js Template * Project Description: Elevate your digital presence with Rayo - dynamic and stylish Next.Js template designed for creative agencies and personal brands. With modern layouts, smooth interactions and a polished aesthetic, Rayo template helps showcase projects, services and expertise with clarity and impact. * Tags: ib-themes, resume, portfolio, personal page, cv, template, one page, responsive, Next.js, css3, creative, clean, agency, studio * Version: 1.0.0 * Build Date: October 2025 * Last Update: November 06 2025 * This product is available exclusively on Themeforest * Author: ib-themes * Author URI: https://themeforest.net/user/ib-themes /*! File name: plugins.css * ------------------------------------------------ * * ------------------------------------------------ * Table of Contents * ------------------------------------------------ * 01. custom css for Nextjs * ------------------------------------------------ * Table of Contents End * ------------------------------------------------ */html{scroll-behavior:smooth}.mxd-nav__wrap{display:block;pointer-events:none}.mxd-nav__wrap.active_menu{pointer-events:all}.mxd-menu__wrapper{display:block;pointer-events:none}.mxd-menu__wrapper.active_menu{pointer-events:all}.mxd-menu__wrapper .fade-in-elm{transition:all .6s ease;visibility:hidden;opacity:0}.mxd-menu__wrapper.active_menu .fade-in-elm{visibility:visible;opacity:1}.mxd-menu__wrapper .fade-in-up-elm{transition:all .6s ease;visibility:hidden;opacity:0;transform:translateY(25px)}.mxd-menu__wrapper.active_menu .fade-in-up-elm{visibility:visible;opacity:1;transform:translateY(0)}.submenu{display:block;height:0;padding-top:0}.submenu,.videoModal__bodyOpen{overflow:hidden}.videoModal__overlay{position:fixed;inset:0;background:rgba(0,0,0,.8);display:grid;place-items:center;overflow:hidden;z-index:111}.videoModal__content{background:transparent;border:none;outline:none;overflow:hidden}.videoModal__playerWrap{max-width:1200px;width:min(90vw,1600px);aspect-ratio:16/9;position:relative}.swiper-navigation-icon{display:none}.hamburger__line{transition:all .3s ease}.nav-open .hamburger__line:first-child{translate:none;rotate:none;scale:none;transform:translateY(5px) rotate(45deg)}.nav-open .hamburger__line:last-child{translate:none;rotate:none;scale:none;transform:translateY(-5px) rotate(-45deg)}.loading__fade,.loading__item{opacity:0}:root{--accent--light:#0d6fd1;--accent-rgb--light:13,111,209;--accent--dark:#0d6fd1;--accent-rgb--dark:13,111,209;--additional--light:#333333;--additional-rgb--light:51,51,51;--additional--dark:#989795;--additional-rgb--dark:152,151,149;--accent-gradient:linear-gradient(135deg,#0d6fd1,#0a3c7c 35%,#020617 90%);--pt-base-dark:#020617;--pt-purple-dark-rgb:13,111,209;--pt-st-dark-bright:#0a1633;--pt-st-light-bright:#ffffff;--pt-t-dark-bright:#ffffff;--pt-t-light-bright:#0a0a0a}:root,:root[color-scheme=light]{--base--light:#f5f5f5;--base-rgb--light:245,245,245;--base-tint--light:#ffffff;--base-shade--light:#e6e6e6;--base-opp--light:#020617;--base-opp-tint--light:#0c142c;--t-bright--light:#020617;--t-medium--light:#333333;--t-muted--light:#5c5c5c;--t-muted-extra--light:#6f6f6f;--t-opp-bright--light:#ffffff;--t-opp-medium--light:#e6e6e6;--t-opp-muted--light:#cfd0d0;--st-bright--light:#020617;--st-medium--light:#646464;--st-muted--light:#e6e6e6;--neutral-transparent--light:rgba(13,111,209,0.12)}:root[color-scheme=dark]{--base--dark:#020617;--base-rgb--dark:2,6,23;--base-tint--dark:#0b122b;--base-shade--dark:#01040d;--base-opp--dark:#ffffff;--base-opp-tint--dark:#f5f5f5;--t-bright--dark:#ffffff;--t-medium--dark:#d6d6d6;--t-muted--dark:#a3a2a0;--t-muted-extra--dark:#8a8a8a;--t-opp-bright--dark:#020617;--t-opp-medium--dark:#333333;--t-opp-muted--dark:#646464;--st-bright--dark:#ffffff;--st-medium--dark:#989795;--st-muted--dark:#333333;--neutral-transparent--dark:rgba(13,111,209,0.16)}.hero-03-headline__text{display:inline-block;font-size:inherit;line-height:inherit;letter-spacing:inherit;color:inherit}.mxd-locale-switcher span{position:relative;font-size:1.4rem;font-weight:600;letter-spacing:.04em}.mxd-locale-switcher:hover:before{background-color:var(--neutral-transparent)}