@font-face{font-family:'Roboto';font-style:normal;font-weight:100 900;font-stretch:100%;font-display:swap;src:url(/assets/fonts/roboto-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:100 900;font-stretch:100%;font-display:swap;src:url(/assets/fonts/roboto-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Sora';font-style:normal;font-weight:100 800;font-display:swap;src:url(/assets/fonts/sora-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Sora';font-style:normal;font-weight:100 800;font-display:swap;src:url(/assets/fonts/sora-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* Shared styles for the brand detail pages (/motonline/, /hardware/, /portaldodog/) */
:root{--light:#F2F2FC;--blue:#1B75BC;--teal:#00A69D}
*,::before,::after{box-sizing:border-box}
html{line-height:1.15;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--light);color:#333;font-family:"Roboto",sans-serif;font-size:1rem;font-weight:400;line-height:1.5;-webkit-font-smoothing:antialiased}
img{border:none;height:auto;max-width:100%}
a{color:var(--blue);text-decoration:none;background-color:transparent}
a:hover{color:var(--teal)}
h1,p{margin:0}
.skip-link{position:absolute;left:-9999rem;top:-9999rem}
.skip-link:focus{left:.5rem;top:.5rem;z-index:100;padding:.5rem 1rem;background:#fff;color:#333}

.img-w{position:relative;text-align:center}
.img-w a{display:inline-block}
.img-w img{display:inline-block;vertical-align:middle}

/* hero: banner + logo + device mockup */
.sp-hero{position:relative;display:flex;flex-direction:column;margin:0 0 50px;background:center center/cover no-repeat}
.sp-hero-inner{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:20px;flex:1 1 auto;width:100%;max-width:1140px;margin:0 auto;padding:50px 0 0}
.sp-logo{margin:0 0 50px}
.sp-logo img{width:350px}
.sp-mockup{margin:0 0 -50px}
.sp-mockup img{width:500px}

/* body */
.sp-body{position:relative;display:flex;flex-direction:column;padding:0 10px}
.sp-body-inner{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;max-width:800px;margin:0 auto;padding:10px 0}
.sp-title{position:relative;text-align:center}
.sp-title h1{font-family:"Sora",sans-serif;font-size:3rem;font-weight:700;line-height:3.5rem;color:var(--blue)}
.sp-visit{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:7px;width:100%}
.sp-visit span{font-family:"Roboto",sans-serif;font-size:.9rem;font-weight:600;line-height:1rem;text-transform:uppercase;color:#9E9E9E}
.sp-visit a,.sp-visit a:hover{color:var(--blue)}
.sp-tags{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px;width:100%;padding:10px 0 0}
.tag{position:relative;padding:0 10px 2px;border-radius:20px;background:var(--blue);transition:background .3s}
.tag:hover{background:var(--teal)}
.tag span{font-family:"Roboto",sans-serif;font-size:.9rem;font-weight:500;line-height:1.1rem;color:#fff}
.sp-stats{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:40px;width:100%;padding:30px 0}
.stat{position:relative;display:flex;flex-direction:column;flex:0 1 100%;min-width:0;padding:15px;border-radius:5px;background:#fff;box-shadow:0 0 7px 0 rgba(0,2,22,.21)}
.stat-top{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px;width:100%}
.stat-icon{position:relative}
.ico{display:inline-block;font-size:40px;line-height:1;text-align:center;color:var(--blue)}
.ico svg{display:block;width:1em;height:40px;fill:var(--blue)}
.stat-num{position:relative}
.stat-num span{font-family:"Sora",sans-serif;font-size:1.6rem;font-weight:700;line-height:1.8rem;color:var(--blue)}
.stat-label{display:flex;flex-direction:column;width:100%;text-align:center;font-family:"Roboto",sans-serif;font-size:.9rem;line-height:1.1rem;color:#BDBDBD}
.sp-text{width:100%;text-align:justify;font-family:"Roboto",sans-serif;font-size:1rem;font-weight:400;line-height:1.2rem;color:#333}
.sp-text p{margin:0;padding:10px 0}

/* call to action */
.sp-cta{position:relative;display:flex;flex-direction:column;margin:0 0 50px}
.sp-cta-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:1140px;margin:0 auto;padding:50px 0}
.cta-w{position:relative}
.cta{display:inline-block;padding:15px 40px;border-radius:21px;background:var(--blue);color:#fff;fill:#fff;font-family:"Roboto",sans-serif;font-size:.9rem;font-weight:600;line-height:1rem;text-transform:uppercase;text-align:center;transition:all .3s}
.cta:hover,.cta:focus,.cta:visited{color:#fff}
.cta:hover,.cta:focus{background:var(--teal)}
.cta-wrap{display:flex;flex-direction:row;justify-content:center;gap:5px}
.cta-text{display:block}

/* entrance animations (same timing as the original Elementor setup) */
.js .anim{visibility:hidden}
.animated{animation-duration:1.25s}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
.fadeIn{animation-name:fadeIn}
.fadeInUp{animation-name:fadeInUp}
@media (prefers-reduced-motion:reduce){.animated{animation:none}}

@media (max-width:1024px){
  .sp-body{padding:0 30px}
  .sp-body-inner{padding:0}
  .sp-stats{gap:10px}
  .stat{padding:15px 5px}
}
@media (max-width:767px){
  .sp-hero{margin:0 0 40px}
  .sp-hero-inner{padding:30px 0 0}
  .sp-logo{margin:0 0 20px}
  .sp-logo img{width:240px}
  .sp-mockup{width:100%;margin:0 0 -30px}
  .sp-mockup img{width:85%}
  .sp-body{padding:0 25px}
  .sp-body-inner{max-width:767px}
  .sp-title h1{font-size:2rem;line-height:2.2rem}
  .sp-visit,.sp-tags,.sp-stats,.stat-top{flex-wrap:wrap}
  .tag span{font-size:1rem;line-height:1.2rem}
  .stat-num span{font-size:1.5rem;line-height:1.7rem}
  .stat-label{font-size:1rem;line-height:1.2rem}
}
