/*! ------------------------------------------------ * 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{--pt-base-dark:#07112a;--pt-purple-dark-rgb:13,111,209;--pt-st-dark-bright:#0e1b3b;--pt-st-light-bright:#ffffff;--pt-t-dark-bright:#ffffff;--pt-t-light-bright:#0a1024;--font-fallback:system-ui,-apple-system,"Segoe UI",sans-serif;--font-display:var(--font-funnel-display),var(--font-fallback);--font-sans:var(--font-funnel-sans),var(--font-fallback);--font-mono:var(--font-plex-mono),ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--_font-default:var(--font-sans);--_font-accent:var(--font-display);--type-display:clamp(4.4rem,2.9rem + 5.4vw,9.6rem);--type-display-lh:0.94;--type-display-ls:-0.035em;--type-page:clamp(4rem,2.9rem + 3.4vw,7.6rem);--type-page-ls:-0.032em;--type-section:clamp(3.6rem,2.7rem + 2.8vw,6.6rem);--type-section-lh:0.98;--type-section-ls:-0.03em;--type-card:clamp(2.6rem,2.15rem + 1.2vw,3.8rem);--type-card-lh:1.04;--type-card-ls:-0.02em;--type-lead:clamp(1.9rem,1.66rem + 0.55vw,2.4rem);--type-lead-lh:1.42;--type-body:clamp(1.6rem,1.53rem + 0.18vw,1.75rem);--type-body-lh:1.55;--type-small:1.45rem;--type-small-lh:1.5;--type-eyebrow:clamp(1.3rem,1.18rem + 0.22vw,1.5rem);--type-meta:clamp(1.15rem,1.07rem + 0.14vw,1.3rem);--type-tag:clamp(1.2rem,1.12rem + 0.14vw,1.35rem);--type-caption:1.3rem;--type-nav:1.5rem;--measure-lead:34em;--measure-body:38em;--space-3xs:0.4rem;--space-2xs:0.8rem;--space-xs:1.2rem;--space-s:1.6rem;--space-m:2.4rem;--space-l:clamp(3.2rem,2.6rem + 1.6vw,4.8rem);--space-xl:clamp(4.4rem,3.2rem + 3.2vw,7.2rem);--space-2xl:clamp(6rem,3.8rem + 5.8vw,11.2rem);--section-space:var(--space-2xl);--section-pad:calc(var(--section-space) / 2);--section-space-tight:var(--space-xl);--heading-gap:clamp(2.8rem,2rem + 2.2vw,5.6rem);--header-height:6.4rem;--page-gutter:3rem;--radius-xs:0.6rem;--radius-s:1rem;--radius-m:1.6rem;--radius-l:clamp(2rem,1.5rem + 1.2vw,2.8rem);--radius-pill:999px;--ease-quiet:cubic-bezier(0.2,0.7,0.2,1);--dur-quick:180ms;--dur-base:320ms;--dur-slow:700ms;--line-hair:1px;--node-size:0.6rem;--motif-opacity:0.12;--motif-opacity-depth:0.2}@media (min-width:768px){:root{--header-height:7.6rem;--page-gutter:6rem}}@media (min-width:1600px){:root{--page-gutter:9rem}}:root,:root[color-scheme=light]{color-scheme:light;--canvas:#f3f2ee;--canvas-rgb:243,242,238;--surface:#faf9f6;--surface-subtle:#eae8e2;--surface-raised:#ffffff;--surface-depth:#07112a;--surface-depth-raised:#0e1b3b;--surface-inverse:#0a1024;--text-primary:#0a1024;--text-secondary:#3b4254;--text-muted:#5f6677;--text-inverse:#f3f2ee;--text-on-depth:#f1f3f8;--text-on-depth-secondary:rgba(241,243,248,0.74);--text-on-depth-muted:rgba(241,243,248,0.58);--signal:#0d6fd1;--signal-rgb:13,111,209;--signal-soft:rgba(13,111,209,0.1);--signal-strong:#0a58a8;--signal-on-depth:#7db9f5;--signal-text:var(--signal-strong);--border-subtle:rgba(10,16,36,0.09);--border-default:rgba(10,16,36,0.18);--border-strong:rgba(10,16,36,0.8);--border-on-depth:rgba(241,243,248,0.14);--focus:#0d6fd1;--danger:#b42318;--action-bg:#0a1024;--action-fg:#f3f2ee;--shadow-media:0 2.4rem 5rem rgba(10,27,61,0.14)}:root[color-scheme=dark]{color-scheme:dark;--canvas:#060b19;--canvas-rgb:6,11,25;--surface:#0b1327;--surface-subtle:#0f1931;--surface-raised:#121e3b;--surface-depth:#02060f;--surface-depth-raised:#0a1328;--surface-inverse:#edf0f6;--text-primary:#edf0f6;--text-secondary:#b3bccd;--text-muted:#8d96aa;--text-inverse:#0a1024;--text-on-depth:#edf0f6;--text-on-depth-secondary:rgba(237,240,246,0.74);--text-on-depth-muted:rgba(237,240,246,0.58);--signal:#62a9f2;--signal-rgb:98,169,242;--signal-soft:rgba(98,169,242,0.14);--signal-strong:#98c8fb;--signal-on-depth:#7db9f5;--signal-text:var(--signal);--border-subtle:rgba(214,226,255,0.08);--border-default:rgba(214,226,255,0.17);--border-strong:rgba(237,240,246,0.72);--border-on-depth:rgba(214,226,255,0.12);--focus:#7db9f5;--danger:#ff8f80;--action-bg:#edf0f6;--action-fg:#060b19;--shadow-media:0 2.4rem 5rem rgba(0,0,0,0.45)}:root{--base--light:var(--canvas);--base--dark:var(--canvas);--base-rgb--light:var(--canvas-rgb);--base-rgb--dark:var(--canvas-rgb);--base-tint--light:var(--surface-raised);--base-tint--dark:var(--surface-raised);--base-shade--light:var(--surface-subtle);--base-shade--dark:var(--surface-subtle);--base-opp--light:var(--surface-inverse);--base-opp--dark:var(--surface-inverse);--base-opp-tint--light:var(--surface-inverse);--base-opp-tint--dark:var(--surface-inverse);--t-bright--light:var(--text-primary);--t-bright--dark:var(--text-primary);--t-medium--light:var(--text-secondary);--t-medium--dark:var(--text-secondary);--t-muted--light:var(--text-muted);--t-muted--dark:var(--text-muted);--t-muted-extra--light:var(--text-muted);--t-muted-extra--dark:var(--text-muted);--t-opp-bright--light:var(--text-inverse);--t-opp-bright--dark:var(--text-inverse);--t-opp-medium--light:var(--text-inverse);--t-opp-medium--dark:var(--text-inverse);--t-opp-muted--light:var(--text-inverse);--t-opp-muted--dark:var(--text-inverse);--st-bright--light:var(--border-strong);--st-bright--dark:var(--border-strong);--st-medium--light:var(--border-default);--st-medium--dark:var(--border-default);--st-muted--light:var(--border-subtle);--st-muted--dark:var(--border-subtle);--accent--light:var(--signal);--accent--dark:var(--signal);--accent-rgb--light:var(--signal-rgb);--accent-rgb--dark:var(--signal-rgb);--additional--light:var(--text-secondary);--additional--dark:var(--text-secondary);--neutral-transparent--light:var(--signal-soft);--neutral-transparent--dark:var(--signal-soft)}:where(a,button,input,textarea,select,summary,[tabindex]):focus-visible{outline:2px solid var(--focus)!important;outline-offset:3px!important}button:focus-visible{outline:2px solid var(--focus)!important;outline-offset:3px!important}a{transition-property:color,background-color,border-color,opacity,transform,box-shadow,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,opacity,transform,box-shadow;transition-property:color,background-color,border-color,text-decoration-color,opacity,transform,box-shadow,-webkit-text-decoration-color}:where(a,button,input,textarea,select,summary,[tabindex]):focus-visible{transition-duration:0s!important}.d-skip{position:fixed;top:1rem;left:1rem;z-index:2000;padding:1rem 1.6rem;border-radius:var(--radius-s);background:var(--action-bg);font:500 1.5rem/1 var(--font-sans);transform:translateY(-200%)}.d-skip,.d-skip:focus{color:var(--action-fg)}.d-skip:focus{transform:none}html.d-menu-open{overflow:hidden}html.d-theme-switching *,html.d-theme-switching :after,html.d-theme-switching :before{transition:none!important}body{background-color:var(--canvas)}::selection{background:var(--signal);color:#ffffff}.d-card-title,.d-display,.d-section-title{margin:0;color:var(--text-primary);font-family:var(--font-display);font-weight:600;text-wrap:balance}.d-display{font-size:var(--type-display);line-height:var(--type-display-lh);letter-spacing:var(--type-display-ls)}.d-section-title{font-size:var(--type-section);line-height:var(--type-section-lh);letter-spacing:var(--type-section-ls)}.d-card-title{font-size:var(--type-card);line-height:var(--type-card-lh);letter-spacing:var(--type-card-ls)}.d-body,.d-caption,.d-lead,.d-small{margin:0;font-family:var(--font-sans);text-wrap:pretty}.d-lead{max-width:var(--measure-lead);font-size:var(--type-lead);line-height:var(--type-lead-lh)}.d-body,.d-lead{color:var(--text-secondary)}.d-body{max-width:var(--measure-body);font-size:var(--type-body);line-height:var(--type-body-lh)}.d-small{font-size:var(--type-small);line-height:var(--type-small-lh)}.d-caption,.d-small{color:var(--text-muted)}.d-caption{font-size:var(--type-caption);line-height:1.45}.d-eyebrow{margin:0;color:var(--text-secondary);font-family:var(--font-mono);font-size:var(--type-eyebrow);font-weight:500;letter-spacing:.01em;line-height:1.3}.d-eyebrow,.d-eyebrow__index{display:inline-flex;align-items:center;gap:1rem}.d-eyebrow__index{color:var(--signal-text)}.d-eyebrow__index:after{content:"";width:2.4rem;height:var(--line-hair);background:currentColor;opacity:.55}.d-meta,.d-status{margin:0;color:var(--text-muted);font-family:var(--font-mono);font-size:var(--type-meta);font-weight:500;letter-spacing:.06em;line-height:1.4;text-transform:uppercase}.d-status{display:inline-flex;align-items:center;gap:.8rem;color:var(--text-primary)}.d-status:before{content:"";flex:none;width:var(--node-size);aspect-ratio:1;border-radius:50%;background:var(--signal);box-shadow:0 0 0 .35rem var(--signal-soft)}.d-status--pending:before{background:transparent;box-shadow:inset 0 0 0 1px var(--signal)}.d-tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:0;padding:0;list-style:none}.d-tag{display:inline-flex;align-items:center;min-height:2.8rem;padding:.3rem 1rem;border:var(--line-hair) solid var(--border-default);border-radius:var(--radius-xs);color:var(--text-secondary);font-family:var(--font-mono);font-size:var(--type-tag);letter-spacing:.01em;line-height:1.2}.d-node{display:inline-block;flex:none;width:var(--node-size);aspect-ratio:1;border-radius:50%;background:var(--signal);box-shadow:0 0 0 .35rem var(--signal-soft)}.d-page-title{max-width:18ch;margin:0;color:var(--text-primary);font-family:var(--font-display);font-size:var(--type-page);font-weight:600;letter-spacing:var(--type-page-ls);line-height:.98;text-wrap:balance}.d-page-intro{padding-top:calc(var(--header-height) + var(--space-xl));padding-bottom:var(--space-xl)}.d-page-intro__grid{display:grid;grid-gap:var(--space-l);gap:var(--space-l)}.d-page-intro__lead{margin-top:var(--space-l)}@media (min-width:1200px){.d-page-intro__grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:3rem}.d-page-intro__label{grid-column:1/span 3;align-self:start;padding-top:1.4rem}.d-page-intro__body{grid-column:4/-1}}.d-section{padding-block:var(--section-space)}.d-section--tight{padding-block:var(--section-space-tight)}.d-section-head{display:grid;grid-gap:var(--space-m);gap:var(--space-m);margin-bottom:var(--heading-gap)}.d-section--rule{border-top:var(--line-hair) solid var(--border-subtle)}.d-section--after-intro{padding-top:0}.d-contact__direct{display:grid;align-content:start;grid-gap:var(--space-l);gap:var(--space-l)}.d-contact__block{display:grid;justify-items:start;grid-gap:1rem;gap:1rem;padding-top:var(--space-s);border-top:var(--line-hair) solid var(--border-default)}.d-contact__email{color:var(--text-primary);font-family:var(--font-display);font-size:var(--type-card);font-weight:500;letter-spacing:var(--type-card-ls);line-height:1.1;overflow-wrap:anywhere;text-decoration:underline;-webkit-text-decoration-color:var(--border-default);text-decoration-color:var(--border-default);text-decoration-thickness:1px;text-underline-offset:.2em}.d-contact__email:hover{color:var(--text-primary);-webkit-text-decoration-color:currentColor;text-decoration-color:currentColor}.d-contact__intro-email{margin-top:var(--space-l)}.d-contact__prompts{display:grid;grid-gap:1rem;gap:1rem;margin:0;padding:0;list-style:none}.d-contact__prompts li{display:flex;align-items:baseline;gap:1.2rem;color:var(--text-primary);font-family:var(--font-display);font-size:var(--type-lead);font-weight:500;letter-spacing:-.015em;line-height:1.25}.d-contact__prompts li:before{content:"";flex:none;width:var(--node-size);aspect-ratio:1;border-radius:50%;background:var(--signal);transform:translateY(-.2em)}.d-contact__links{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin:0;padding:0;list-style:none}.d-contact__form{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;grid-gap:var(--space-m);gap:var(--space-m)}.d-legal__updated{margin-top:var(--space-m)}.d-legal{border-top:var(--line-hair) solid var(--border-default)}.d-legal__section{padding-block:var(--space-l);border-bottom:var(--line-hair) solid var(--border-subtle)}.d-legal__body,.d-legal__section{display:grid;grid-gap:var(--space-s);gap:var(--space-s)}@media (min-width:1200px){.d-legal{margin-left:calc((100% - 3rem * 11) / 12 * 3 + 3rem * 3)}.d-legal__section{grid-template-columns:minmax(0,1fr) minmax(0,2fr);column-gap:3rem}}.d-item-title{margin:0;color:var(--text-primary);font-family:var(--font-display);font-size:var(--type-lead);font-weight:500;letter-spacing:-.02em;line-height:1.2}.d-split{display:grid;grid-gap:var(--heading-gap);gap:var(--heading-gap)}.d-split>*{min-width:0}@media (min-width:1200px){.d-split{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:3rem}.d-split__title{align-self:start;max-width:11ch}.d-split__aside,.d-split__title{grid-column:1/span 5}.d-split>:last-child{grid-column:6/-1}}.d-principles{display:grid;grid-gap:var(--space-l) 3rem;gap:var(--space-l) 3rem;margin:0;padding:0;list-style:none}@media (min-width:768px){.d-principles{grid-template-columns:repeat(2,minmax(0,1fr))}}.d-principles__item{display:grid;grid-gap:var(--space-xs);gap:var(--space-xs);padding-top:var(--space-m);border-top:var(--line-hair) solid var(--border-default)}.d-steps{margin:0;padding:0;list-style:none;counter-reset:none}.d-steps__item{display:grid;grid-template-columns:4.8rem minmax(0,1fr);grid-gap:var(--space-s);gap:var(--space-s);padding-block:var(--space-m);border-top:var(--line-hair) solid var(--border-default)}.d-steps__item:last-child{border-bottom:var(--line-hair) solid var(--border-default)}.d-steps__item .d-body{margin-top:var(--space-2xs)}.d-steps__index{padding-top:.5rem;color:var(--signal-text);font-family:var(--font-mono);font-size:var(--type-eyebrow);font-weight:500}.btn.d-btn{height:auto;min-height:5.2rem;gap:1.4rem;padding:0 1.6rem 0 2.2rem;border-width:var(--line-hair);border-style:solid;border-radius:var(--radius-pill);font:500 1.6rem/1 var(--font-sans);letter-spacing:-.005em;transition:background-color var(--dur-quick) var(--ease-quiet),border-color var(--dur-quick) var(--ease-quiet),color var(--dur-quick) var(--ease-quiet)}.btn.d-btn .btn-caption{display:inline-flex;flex-direction:column;height:1.2em;overflow:hidden;line-height:1.2}.btn.d-btn .btn-anim__block{line-height:1.2}.btn.d-btn i{font-size:1.7rem}.btn.d-btn--small{min-height:4rem;gap:1rem;padding:0 1.2rem 0 1.6rem;font-size:1.45rem}.btn.d-btn--small i{font-size:1.5rem}.btn.d-btn--primary{border-color:var(--action-bg);background:var(--action-bg);color:var(--action-fg)}.btn.d-btn--primary:hover{border-color:var(--signal);background:var(--signal);color:#ffffff}.btn.d-btn--secondary{border-color:var(--border-default);background:transparent;color:var(--text-primary)}.btn.d-btn--secondary:hover{border-color:var(--border-strong)}.d-link{display:inline-flex;align-items:center;gap:.6rem;font-size:var(--type-small);font-weight:500;text-decoration:underline;-webkit-text-decoration-color:var(--border-default);text-decoration-color:var(--border-default);text-decoration-thickness:1px;text-underline-offset:.45em;transition:-webkit-text-decoration-color var(--dur-quick) var(--ease-quiet);transition:text-decoration-color var(--dur-quick) var(--ease-quiet);transition:text-decoration-color var(--dur-quick) var(--ease-quiet),-webkit-text-decoration-color var(--dur-quick) var(--ease-quiet)}.d-link,.d-link:hover{color:var(--text-primary)}.d-link:hover{-webkit-text-decoration-color:currentColor;text-decoration-color:currentColor}.d-contour{position:absolute;inset:0;z-index:0;pointer-events:none;background-color:var(--signal);opacity:var(--motif-opacity-depth);-webkit-mask-image:var(--contour-src);mask-image:var(--contour-src);-webkit-mask-size:cover;mask-size:cover;-webkit-mask-position:var(--contour-position,center);mask-position:var(--contour-position,center);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.d-contour--field{--contour-src:url(/img/motif/contour-field.svg)}.d-contour--band{--contour-src:url(/img/motif/contour-band.svg)}.d-contour--drift{inset:-4%;animation:d-contour-drift 90s ease-in-out infinite alternate}@keyframes d-contour-drift{0%{transform:translate3d(-1.5%,1%,0)}to{transform:translate3d(1.5%,-1%,0)}}:root[color-scheme=dark] .d-contour{opacity:calc(var(--motif-opacity-depth) * .8)}@media (prefers-reduced-motion:reduce){.d-contour--drift{animation:none}}.d-locale{font-family:var(--font-mono);font-size:1.25rem;font-weight:500;letter-spacing:.04em;line-height:1}.d-locale,.d-locale__slot{display:inline-flex;align-items:center}.d-locale__sep{padding-inline:.1rem;color:var(--border-default)}.d-locale__item{display:inline-flex;align-items:center;min-width:3.2rem;min-height:4rem;justify-content:center;color:var(--text-muted);text-decoration:none;transition:color var(--dur-quick) var(--ease-quiet)}.d-locale__item.is-current,a.d-locale__item:hover{color:var(--text-primary)}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}.d-depth,.d-on-depth{--text-primary:var(--text-on-depth);--text-secondary:var(--text-on-depth-secondary);--text-muted:var(--text-on-depth-muted);--signal:var(--signal-on-depth);--signal-text:var(--signal-on-depth);--signal-soft:rgba(125,185,245,0.16);--border-subtle:rgba(214,226,255,0.07);--border-default:var(--border-on-depth);--border-strong:rgba(241,243,248,0.7);--action-bg:#f1f3f8;--action-fg:#07112a;--t-bright:var(--text-on-depth);--t-medium:var(--text-on-depth-secondary);--t-muted:var(--text-on-depth-muted);--st-bright:rgba(241,243,248,0.7);--st-muted:var(--border-on-depth);background-color:var(--surface-depth);color:var(--text-on-depth-secondary)}:root[color-scheme=dark] section.d-depth{box-shadow:inset 0 1px 0 var(--border-on-depth)}.visually-hidden-focusable:not(:focus):not(:focus-within){position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}