/*
Theme Name: Zayro Shipping
Theme URI: https://zayroshipping.com/
Author: Zayro Shipping
Description: A custom native WordPress theme for Zayro Shipping and integrated logistics services.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: zayro
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-logo, custom-menu, featured-images, one-column, translation-ready
*/

:root{--navy:#071d32;--navy-2:#092638;--teal:#04afa8;--mist:#f1f6f7;--text:#102c3c;--muted:#667780;--white:#fff;--wrap:1280px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);font-family:Arial,"Helvetica Neue",sans-serif;font-size:16px;line-height:1.65;background:#fff}body.admin-bar .site-header{top:32px}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.container{width:min(calc(100% - 48px),var(--wrap));margin-inline:auto}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 28px;background:var(--teal);color:#fff;font-size:13px;font-weight:700;letter-spacing:.01em;border:1px solid var(--teal);transition:.25s ease}.btn:hover,.btn:focus{background:#078f8a;border-color:#078f8a;transform:translateY(-2px)}.eyebrow{margin:0 0 10px;color:var(--teal);font-size:10px;font-weight:700;letter-spacing:.3em;text-transform:uppercase}.section-title{margin:0 0 26px;font-size:36px;line-height:1.15;letter-spacing:-.025em}.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}.reveal.is-visible{opacity:1;transform:none}
.site-header{position:absolute;z-index:20;inset:0 0 auto;padding:24px 0;color:#fff}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:32px}.custom-logo-link,.brand-link{display:block;width:104px}.custom-logo{max-height:42px;width:auto;filter:brightness(0) invert(1)}.brand-link img{width:104px;filter:brightness(0) invert(1)}.primary-nav{margin-left:auto}.primary-nav ul{display:flex;align-items:center;gap:40px;margin:0;padding:0;list-style:none}.primary-nav a{font-size:13px;color:rgba(255,255,255,.88);transition:.2s}.primary-nav a:hover{color:#fff}.header-cta{min-height:38px;padding:0 23px;background:#fff;border-color:#fff;color:var(--navy);font-size:12px}.menu-toggle{display:none;width:44px;height:40px;background:transparent;border:0;padding:8px}.menu-toggle span{display:block;height:2px;margin:6px 0;background:#fff}
.hero{position:relative;min-height:900px;display:flex;align-items:center;background-position:center;background-size:cover;color:#fff}.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,30,55,.64) 0%,rgba(8,37,72,.25) 55%,rgba(4,19,38,.34) 100%),linear-gradient(0deg,rgba(3,27,42,.83) 0%,transparent 52%)}.hero-content{position:relative;z-index:1;padding-top:100px;max-width:720px}.hero h1{margin:0 0 18px;font-size:68px;line-height:1.14;letter-spacing:-.035em;text-transform:uppercase}.hero p{max-width:600px;margin:0 0 28px;font-size:24px;line-height:1.35;color:rgba(255,255,255,.9)}
.about{display:grid;grid-template-columns:1fr 1fr;min-height:570px}.about-media{background-size:cover;background-position:center}.about-content{display:flex;align-items:center;padding:72px clamp(48px,8vw,150px)}.about-copy{max-width:590px}.about-copy p{color:var(--muted);margin:0 0 28px}
.services{padding:105px 0 115px;background:var(--mist)}.services-grid{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:55px}.service-card{padding:40px 44px;margin-top:25px;background:#fff;box-shadow:0 10px 40px rgba(8,35,50,.03)}.service-icon{width:44px;height:44px;margin-bottom:20px;color:#89dfbd}.service-icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.5}.service-card h3{margin:0 0 12px;font-size:21px}.service-card p{margin:0;color:var(--muted);font-size:13px}.services-visual{perspective:1200px;transform-style:preserve-3d;outline:none}.container-float{position:relative;width:100%;animation:zayro-container-float 5.5s ease-in-out infinite;will-change:transform}.container-object{--tilt-x:0deg;--tilt-y:0deg;--shift-x:0px;--shift-y:0px;position:relative;transform:translate3d(var(--shift-x),var(--shift-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transform-style:preserve-3d;transform-origin:50% 58%;transition:transform .55s cubic-bezier(.2,.8,.2,1);will-change:transform}.container-shell{position:relative;z-index:1;width:100%;filter:drop-shadow(0 25px 22px rgba(7,31,56,.22)) drop-shadow(0 7px 7px rgba(7,31,56,.1));transform:translateZ(0);will-change:transform}.container-interior{position:absolute;z-index:2;left:7.2%;top:13.3%;width:29.6%;height:64.8%;overflow:hidden;clip-path:polygon(0 12%,100% 0,100% 98%,0 100%);background:#17222a;transform:translateZ(1px);box-shadow:inset 0 12px 24px rgba(0,0,0,.48),inset 0 -8px 20px rgba(0,0,0,.32)}.container-interior img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.92) contrast(1.05) brightness(.78);transform:scale(1.05);transition:filter 1s ease,transform 1.1s cubic-bezier(.16,.78,.22,1)}.container-door{position:absolute;z-index:3;inset:0;pointer-events:none;background:url('assets/images/container.png') center/100% 100% no-repeat;backface-visibility:hidden;transform-style:preserve-3d;transition:transform 1.05s cubic-bezier(.33,.02,.18,1),filter 1.05s ease;will-change:transform}.container-door-left{clip-path:polygon(7.2% 21.1%,21.8% 17.1%,21.8% 77.6%,7.2% 78.1%);transform-origin:7.2% 50%}.container-door-right{clip-path:polygon(21.8% 17.1%,36.8% 13.3%,36.8% 77.1%,21.8% 77.6%);transform-origin:36.8% 50%}.services-visual.is-open .container-door-left{transform:translate3d(-1.2%,0,8px) rotateY(-103deg);filter:drop-shadow(12px 9px 9px rgba(0,0,0,.28))}.services-visual.is-open .container-door-right{transform:translate3d(1.2%,0,8px) rotateY(103deg);filter:drop-shadow(-12px 9px 9px rgba(0,0,0,.28))}.services-visual.is-open .container-interior img{filter:saturate(.98) contrast(1.03) brightness(.94);transform:scale(1)}.container-reflection{position:absolute;z-index:4;inset:0;pointer-events:none;background:linear-gradient(108deg,transparent 25%,rgba(255,255,255,.02) 39%,rgba(255,255,255,.3) 48%,rgba(255,255,255,.04) 56%,transparent 70%);background-size:240% 100%;background-position:140% 0;mix-blend-mode:screen;-webkit-mask:url('assets/images/container.png') center/contain no-repeat;mask:url('assets/images/container.png') center/contain no-repeat;animation:zayro-container-reflection 7s cubic-bezier(.4,0,.2,1) infinite;transform:translateZ(2px);will-change:background-position}.services-visual.is-interacting .container-object{transition-duration:.12s}@keyframes zayro-container-float{0%,100%{transform:translate3d(0,-2px,0)}50%{transform:translate3d(0,2px,0)}}@keyframes zayro-container-reflection{0%,22%{background-position:140% 0}68%,100%{background-position:-120% 0}}
.purpose{position:relative;padding:125px 0;background-position:center;background-size:cover;color:#fff}.purpose::before{content:"";position:absolute;inset:0;background:rgba(5,34,45,.79)}.purpose-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:980px;margin:auto}.purpose-card{min-height:230px;padding:38px 40px;border:1px solid rgba(255,255,255,.28);border-radius:8px;background:rgba(255,255,255,.1);backdrop-filter:blur(5px)}.purpose-card h3{display:flex;align-items:center;gap:14px;margin:0 0 20px;font-size:18px}.purpose-card h3 span{font-size:30px;color:#70dcc0}.purpose-card p{margin:0;color:rgba(255,255,255,.78);font-size:14px;line-height:1.5}
.principles{padding:120px 0 130px}.principles-head{margin-bottom:55px}.principles-grid{display:grid;grid-template-columns:repeat(3,1fr)}.principle{padding:10px 44px 10px 0}.principle+.principle{padding-left:44px;border-left:1px solid #dce5e8}.principle-number{display:block;margin-bottom:26px;color:var(--teal);font-family:Georgia,serif;font-size:30px}.principle h3{margin:0 0 16px;font-size:17px}.principle p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}
.cta{overflow:hidden;background:#051d4a;color:#fff}.cta-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:405px}.cta h2{margin:0 0 8px;font-size:35px;line-height:1.2;text-transform:uppercase}.cta p{margin:0 0 24px;color:rgba(255,255,255,.75)}.cta-art{align-self:end}.cta-art img{width:100%;max-height:390px;object-fit:contain;object-position:bottom right}
.site-footer{padding:62px 0 20px;background:#092433;color:rgba(255,255,255,.7)}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:48px}.footer-brand img{width:110px;margin-bottom:23px;filter:brightness(0) invert(1)}.footer-brand p{max-width:250px;margin:0;font-size:12px;line-height:1.7}.footer-col h3{margin:0 0 20px;color:var(--teal);font-size:10px;letter-spacing:.22em;text-transform:uppercase}.footer-col ul{margin:0;padding:0;list-style:none}.footer-col li,.footer-col p{margin:0 0 7px;font-size:12px}.footer-bottom{display:flex;justify-content:space-between;margin-top:55px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);font-size:11px;color:rgba(255,255,255,.45)}
.content-area{padding:140px 0 90px}.content-area h1{font-size:48px}.content-area a{color:var(--teal)}
@media (max-width:900px){body.admin-bar .site-header{top:46px}.container{width:min(calc(100% - 36px),var(--wrap))}.site-header{padding:17px 0}.primary-nav{display:none;position:absolute;top:78px;left:18px;right:18px;padding:22px;background:var(--navy)}.primary-nav.is-open{display:block}.primary-nav ul{display:block}.primary-nav li{margin:10px 0}.header-cta{display:none}.menu-toggle{display:block}.hero{min-height:760px;background-position:64% center}.hero-content{padding-top:80px;max-width:580px}.hero h1{font-size:48px}.hero p{font-size:20px}.about{grid-template-columns:1fr}.about-media{min-height:420px}.about-content{padding:70px 28px}.services-grid{grid-template-columns:1fr}.services-visual{order:-1}.purpose-grid{grid-template-columns:1fr}.principles-grid{grid-template-columns:1fr}.principle,.principle+.principle{padding:25px 0;border-left:0;border-top:1px solid #dce5e8}.principle:first-child{border-top:0}.cta-grid{grid-template-columns:1fr}.cta-copy{padding-top:70px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media (max-width:560px){.hero{min-height:680px}.hero h1{font-size:39px}.hero p{font-size:17px}.section-title{font-size:31px}.about-media{min-height:300px}.services{padding:75px 0}.service-card{padding:30px 26px}.purpose{padding:75px 0}.purpose-card{padding:28px 24px}.principles{padding:80px 0}.cta h2{font-size:29px}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}}
.services-visual.is-open .container-door,.services-visual:hover .container-door{transition-delay:.08s}.services-visual:hover .container-door-left{transform:translate3d(-1.2%,0,8px) rotateY(-103deg);filter:drop-shadow(12px 9px 9px rgba(0,0,0,.28))}.services-visual:hover .container-door-right{transform:translate3d(1.2%,0,8px) rotateY(103deg);filter:drop-shadow(-12px 9px 9px rgba(0,0,0,.28))}.services-visual:hover .container-interior img{filter:saturate(.98) contrast(1.03) brightness(.94);transform:scale(1)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.btn{transition:none}.container-float,.container-reflection{animation:none}.container-object{transform:none!important;transition:none}.container-door,.container-interior img{transition:none}}

/* Zayro motion language: transform and opacity driven, with no layout changes. */
html.motion-ready [data-motion]{opacity:0;transition:opacity .78s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1),clip-path 1.05s cubic-bezier(.22,1,.36,1);transition-delay:var(--motion-delay,0ms);will-change:opacity,transform}
html.motion-ready [data-motion="up"]{transform:translate3d(0,24px,0)}html.motion-ready [data-motion="left"]{transform:translate3d(28px,0,0)}html.motion-ready [data-motion="right"]{transform:translate3d(-28px,0,0)}html.motion-ready [data-motion="scale"]{transform:scale(.975)}html.motion-ready [data-motion="mask"]{clip-path:inset(0 12% 0 0);transform:scale(1.025)}html.motion-ready [data-motion].is-motion-visible{opacity:1;transform:translate3d(0,0,0) scale(1);clip-path:inset(0 0 0 0)}
.site-header{transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}html.motion-ready:not(.page-entered) .site-header{opacity:0;transform:translate3d(0,-12px,0)}.hero-content{--hero-parallax:0px;transform:translate3d(0,var(--hero-parallax),0)!important}.hero-content h1,.hero-content p,.hero-content .btn{transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}html.motion-ready:not(.page-entered) .hero-content h1,html.motion-ready:not(.page-entered) .hero-content p,html.motion-ready:not(.page-entered) .hero-content .btn{opacity:0;transform:translate3d(0,22px,0)}.hero-content p{transition-delay:.11s}.hero-content .btn{transition-delay:.2s}
.service-card,.purpose-card,.principle{position:relative;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,border-color .45s ease}.service-card::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1)}.service-card h3,.service-card p{transition:transform .42s cubic-bezier(.22,1,.36,1)}.service-icon{transition:color .4s ease,transform .5s cubic-bezier(.22,1,.36,1)}.purpose-card h3 span,.principle-number{display:inline-block;transition:transform .48s cubic-bezier(.22,1,.36,1),color .4s ease}
@media (hover:hover) and (pointer:fine){.service-card:hover{transform:translate3d(0,-8px,0) scale(1.012);box-shadow:0 20px 48px rgba(7,38,53,.11)}.service-card:hover::after{transform:scaleX(1)}.service-card:hover h3,.service-card:hover p{transform:translate3d(0,-4px,0)}.service-card:hover .service-icon{color:var(--teal)}.service-card:nth-of-type(1):hover .service-icon{transform:translate3d(5px,-2px,0) rotate(6deg) scale(1.06)}.service-card:nth-of-type(2):hover .service-icon{transform:translate3d(0,-3px,0) rotate(8deg) scale(1.06)}.purpose-card:hover{transform:translate3d(0,-7px,0);border-color:rgba(112,220,192,.55);box-shadow:0 18px 44px rgba(0,0,0,.16)}.purpose-card:hover h3 span{transform:translate3d(3px,-2px,0) rotate(7deg) scale(1.05)}.principle:hover{transform:translate3d(0,-6px,0)}.principle:hover .principle-number{transform:translate3d(3px,-2px,0);color:#078f8a}}
.btn{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 0 0 rgba(4,175,168,0);transition:background-color .3s ease,border-color .3s ease,transform .38s cubic-bezier(.22,1,.36,1),box-shadow .38s ease}.btn::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(105deg,transparent 25%,rgba(255,255,255,.2) 50%,transparent 75%);transform:translate3d(-120%,0,0);transition:transform .65s cubic-bezier(.22,1,.36,1)}.btn::after{content:"→";position:absolute;right:13px;opacity:0;transform:translate3d(-6px,0,0);transition:opacity .3s ease,transform .35s cubic-bezier(.22,1,.36,1)}@media (hover:hover) and (pointer:fine){.btn:hover{transform:translate3d(0,-3px,0);box-shadow:0 10px 22px rgba(4,125,122,.2)}.btn:hover::before{transform:translate3d(120%,0,0)}.btn:hover::after{opacity:.85;transform:translate3d(0,0,0)}}.btn:active{transform:translate3d(0,-1px,0) scale(.985);box-shadow:0 4px 10px rgba(4,125,122,.16)}
.about-media{transform-origin:center;will-change:clip-path,transform}.services-visual,.cta-art img{transition:filter .7s ease}.cta-art{overflow:hidden}.cta-art img{--image-parallax:0px;transform:translate3d(0,var(--image-parallax),0) scale(1.015);will-change:transform}.footer-col a{position:relative;transition:color .3s ease,transform .3s ease}.footer-col a:hover{color:#fff}
@media (max-width:900px){html.motion-ready [data-motion="left"],html.motion-ready [data-motion="right"]{transform:translate3d(0,18px,0)}html.motion-ready [data-motion="mask"]{clip-path:inset(0 6% 0 0);transform:scale(1.012)}.service-card,.purpose-card,.principle{transition-duration:.35s}.container-float{animation-duration:6.5s}.container-object{--tilt-x:0deg!important;--tilt-y:0deg!important;--shift-x:0px!important;--shift-y:0px!important}}
@media (prefers-reduced-motion:reduce){html.motion-ready [data-motion],html.motion-ready [data-motion].is-motion-visible,html.motion-ready:not(.page-entered) .site-header,html.motion-ready:not(.page-entered) .hero-content h1,html.motion-ready:not(.page-entered) .hero-content p,html.motion-ready:not(.page-entered) .hero-content .btn{opacity:1;transform:none;clip-path:none;transition:none}.hero-content,.cta-art img{transform:none!important}.service-card,.purpose-card,.principle,.service-icon,.btn,.btn::before,.btn::after{transition:none!important}}

/* Vision & Mission cinematic motion — intentionally scoped to this section. */
#zayro-vision-motion{--vision-parallax:0px;overflow:hidden;isolation:isolate;background:none}#zayro-vision-motion .purpose-motion-bg{position:absolute;z-index:0;inset:-9% -2%;background-position:center;background-size:cover;opacity:.72;transform:translate3d(0,calc(var(--vision-parallax) + 18px),0) scale(1.08);transform-origin:center;transition:opacity 1.15s cubic-bezier(.22,1,.36,1),transform 1.2s cubic-bezier(.22,1,.36,1);will-change:transform,opacity}#zayro-vision-motion.is-cinematic .purpose-motion-bg{opacity:1;transform:translate3d(0,var(--vision-parallax),0) scale(1.05)}#zayro-vision-motion::before{z-index:2}#zayro-vision-motion .purpose-motion-light{position:absolute;z-index:1;inset:-20%;pointer-events:none;background:linear-gradient(108deg,transparent 35%,rgba(104,220,204,.08) 48%,rgba(255,255,255,.055) 52%,transparent 65%);opacity:0;transform:translate3d(-38%,0,0) rotate(-2deg);mix-blend-mode:screen;will-change:transform,opacity}#zayro-vision-motion.is-cinematic .purpose-motion-light{opacity:.72;animation:zayro-vision-light 8.5s cubic-bezier(.4,0,.2,1) .7s infinite}#zayro-vision-motion .purpose-grid{z-index:3}#zayro-vision-motion .purpose-card{transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s ease,border-color .5s ease,background-color .5s ease,backdrop-filter .5s ease}#zayro-vision-motion .purpose-card p{transition:color .45s ease,transform .48s cubic-bezier(.22,1,.36,1)}@media (hover:hover) and (pointer:fine){#zayro-vision-motion .purpose-card:hover{transform:translate3d(0,-8px,0);border-color:rgba(112,220,192,.62);background:rgba(255,255,255,.125);backdrop-filter:blur(7px);box-shadow:0 22px 48px rgba(0,0,0,.2)}#zayro-vision-motion .purpose-card:hover h3 span{transform:translate3d(3px,-2px,0) rotate(6deg) scale(1.05)}#zayro-vision-motion .purpose-card:hover p{color:rgba(255,255,255,.9);transform:translate3d(0,-2px,0)}}@keyframes zayro-vision-light{0%,18%{transform:translate3d(-38%,0,0) rotate(-2deg);opacity:0}38%{opacity:.72}72%,100%{transform:translate3d(38%,0,0) rotate(-2deg);opacity:0}}@media (max-width:900px){#zayro-vision-motion .purpose-motion-bg{inset:-7% -3%;transform:translate3d(0,calc(var(--vision-parallax) + 10px),0) scale(1.065)}#zayro-vision-motion.is-cinematic .purpose-motion-bg{transform:translate3d(0,var(--vision-parallax),0) scale(1.035)}#zayro-vision-motion .purpose-motion-light{display:none}}@media (prefers-reduced-motion:reduce){#zayro-vision-motion .purpose-motion-bg,#zayro-vision-motion.is-cinematic .purpose-motion-bg{opacity:1;transform:scale(1.02);transition:none}#zayro-vision-motion .purpose-motion-light{display:none}#zayro-vision-motion .purpose-card,#zayro-vision-motion .purpose-card p{transition:none}}
