@font-face {
  font-family: 'DM Sans';
  src: url('assets/fonts/dm-sans-400-CwMReqGs.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: 'Passion One';
  src: url('assets/fonts/passion-one-400-C7RmGj-T.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Passion One';
  src: url('assets/fonts/passion-one-700-mj7ARuld.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --moovz-orange: #f07e33;
  --moovz-purple: #5f4a99;
  --moovz-pink: #e72471;
  --moovz-yellow: #dbdb00;
  --moovz-offwhite: #e5e4e3;
  --moovz-black: #23272a;
  --background: var(--moovz-offwhite);
  --foreground: var(--moovz-black);
  --primary: var(--moovz-orange);
  --secondary: var(--moovz-purple);
  --accent: var(--moovz-pink);
  --border: rgba(35, 39, 42, 0.17);
  --font-display: 'Passion One', sans-serif;
  --font-body: 'DM Sans', sans-serif;
  --container: 1170px;
  --radius-card: 24px;
  --radius-button: 999px;
  --shadow-md: 0 18px 44px rgba(35, 39, 42, 0.18);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--background); color: var(--foreground); font-family: var(--font-body); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 400; line-height: .98; text-wrap: balance; }
h1 { font-size: clamp(3.65rem, 7.1vw, 7.1rem); letter-spacing: -.015em; }
h2 { font-size: clamp(3rem, 5.3vw, 5rem); letter-spacing: -.01em; }
h3 { font-size: clamp(1.8rem, 2.5vw, 2.35rem); }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { padding-block: clamp(5rem, 9vw, 9rem); }
.section-dark { background: var(--moovz-black); color: var(--moovz-offwhite); }
.section-light { background: var(--moovz-offwhite); color: var(--moovz-black); }
.section-orange { background: var(--moovz-orange); color: var(--moovz-black); }
.section-purple { background: var(--moovz-purple); color: var(--moovz-offwhite); }
.eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; color: #ad4e18; font-size: .78rem; font-weight: 700; letter-spacing: .14em; line-height: 1; text-transform: uppercase; }
.eyebrow span { display: block; width: 28px; height: 3px; background: currentColor; }
.eyebrow--light { color: var(--moovz-orange); }
.eyebrow--dark { color: var(--moovz-black); }
.shadcn-button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; gap: 12px; border: 1px solid transparent; border-radius: var(--radius-button); padding: 14px 23px; font-size: .8rem; font-weight: 700; letter-spacing: .08em; line-height: 1; text-align: center; text-decoration: none; text-transform: uppercase; transition: transform .18s var(--ease), box-shadow .18s ease, background-color .18s ease; }
.shadcn-button:hover, .shadcn-button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(35, 39, 42, .18); }
.shadcn-button--primary { background: var(--moovz-orange); color: var(--moovz-black); }
.shadcn-button--outline { border-color: currentColor; color: inherit; }
.shadcn-button--light { background: var(--moovz-offwhite); color: var(--moovz-black); }
.text-link { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; text-decoration: none; }
.text-link span { font-size: 1.2em; transition: transform .18s var(--ease); }
.text-link:hover span, .text-link:focus-visible span { transform: translateY(3px); }
.text-link--light { color: var(--moovz-offwhite); }
.site-header { position: absolute; z-index: 5; top: 0; width: 100%; padding-top: 25px; color: var(--moovz-offwhite); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand img { width: 186px; height: auto; }
.site-nav { display: flex; align-items: center; gap: 28px; font-size: .9rem; font-weight: 600; }
.site-nav a:not(.shadcn-button) { text-decoration: none; opacity: .8; }
.site-nav a:not(.shadcn-button):hover, .site-nav a:not(.shadcn-button):focus-visible { opacity: 1; }
.mobile-cta { display: none; width: 46px; height: 46px; place-items: center; border-radius: 50%; background: var(--moovz-orange); color: var(--moovz-black); font-size: 1.6rem; text-decoration: none; }
.hero { position: relative; min-height: 780px; overflow: hidden; padding: 176px 0 0; }
.hero__grid { display: grid; min-height: 545px; grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr); align-items: center; gap: 4vw; }
.hero__copy { position: relative; z-index: 2; max-width: 710px; }
.hero h1 { max-width: 710px; }
.hero__intro { max-width: 620px; margin-top: 30px; color: rgba(229, 228, 227, .78); font-size: clamp(1.15rem, 1.7vw, 1.45rem); }
.hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 23px; margin-top: 38px; }
.hero__visual { position: relative; min-height: 500px; }
.hero__shape { position: absolute; border: 2px solid var(--moovz-black); border-radius: 30px; transform: rotate(-8deg); }
.hero__shape--back { inset: 48px 25px 14px 40px; background: var(--moovz-yellow); box-shadow: 16px 16px 0 var(--moovz-orange); }
.hero__shape--front { inset: 24px 50px 48px 18px; background: var(--moovz-offwhite); opacity: .95; transform: rotate(5deg); }
.hero__kit { position: absolute; z-index: 2; top: 90px; right: 12%; width: min(82%, 360px); height: auto; filter: drop-shadow(14px 22px 0 rgba(35, 39, 42, .18)); transform: rotate(-3deg); }
.hero__monitor { position: absolute; z-index: 3; right: 4%; bottom: -20px; width: 150px; padding: 13px 13px 0; border: 2px solid var(--moovz-black); border-radius: 22px; background: var(--moovz-purple); box-shadow: 10px 11px 0 var(--moovz-pink); transform: rotate(9deg); }
.hero__monitor img { width: 100%; height: auto; }
.hero__stamp { position: absolute; z-index: 4; right: 20px; bottom: 14px; padding: 10px 14px; background: var(--moovz-orange); color: var(--moovz-black); font-size: .7rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; transform: rotate(-7deg); }
.hero__bottom-line { display: flex; justify-content: space-between; gap: 16px; padding: 28px 0 22px; border-top: 1px solid rgba(229, 228, 227, .18); color: rgba(229, 228, 227, .72); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.intro-grid, .section-heading--split, .experience-grid, .cta-section__inner { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(280px, .88fr); gap: 64px; align-items: end; }
.section-intro h2, .section-heading h2 { max-width: 790px; }
.section-lead, .section-heading > p:last-child, .section-heading--split > p { max-width: 530px; color: rgba(35, 39, 42, .68); font-size: 1.08rem; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 58px; }
.shadcn-card { border: 1px solid var(--border); border-radius: var(--radius-card); }
.benefit-card { min-height: 270px; padding: 30px; background: rgba(229, 228, 227, .58); }
.benefit-card--orange { border-top: 5px solid var(--moovz-orange); }
.benefit-card--purple { border-top: 5px solid var(--moovz-purple); }
.benefit-card--pink { border-top: 5px solid var(--moovz-pink); }
.card-number, .process-card__number { display: block; margin-bottom: 54px; color: var(--moovz-orange); font-size: .8rem; font-weight: 700; letter-spacing: .14em; }
.benefit-card h3 { max-width: 260px; }
.benefit-card p { margin-top: 21px; color: rgba(35, 39, 42, .7); }
.process-section { padding-bottom: clamp(5rem, 9vw, 8.5rem); }
.section-heading--split { align-items: end; }
.section-heading--split > p { color: rgba(35, 39, 42, .78); }
.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 60px; }
.process-card { min-height: 310px; padding: 26px 24px; border: 1px solid rgba(35, 39, 42, .25); border-radius: var(--radius-card); background: rgba(229, 228, 227, .2); }
.process-card__number { color: var(--moovz-black); margin-bottom: 18px; }
.process-card__icon { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: 30px; border-radius: 16px; color: var(--moovz-black); font-size: 2rem; line-height: 1; }
.process-card__icon--cream { background: var(--moovz-offwhite); }
.process-card__icon--purple { background: var(--moovz-purple); color: var(--moovz-offwhite); }
.process-card__icon--pink { background: var(--moovz-pink); color: var(--moovz-offwhite); }
.process-card__icon--yellow { background: var(--moovz-yellow); }
.process-card h3 { font-size: 2.15rem; }
.process-card p { margin-top: 15px; color: rgba(35, 39, 42, .72); }
.experience-grid { align-items: center; }
.experience-copy > p:not(.eyebrow) { max-width: 570px; margin-top: 27px; color: rgba(229, 228, 227, .78); font-size: 1.1rem; }
.check-list { display: grid; gap: 14px; margin: 34px 0 0; padding: 0; list-style: none; color: rgba(229, 228, 227, .88); }
.check-list li { display: flex; gap: 12px; align-items: flex-start; }
.check-list li span { flex: 0 0 auto; display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; background: var(--moovz-orange); color: var(--moovz-black); font-size: .8rem; font-weight: 700; }
.product-figure { position: relative; margin: 0; }
.product-figure__frame { position: relative; max-width: 430px; margin-left: auto; overflow: hidden; border: 2px solid var(--moovz-offwhite); border-radius: 28px; box-shadow: 18px 18px 0 var(--moovz-orange); transform: rotate(4deg); }
.product-figure__frame img { width: 100%; height: 520px; object-fit: cover; object-position: center; }
.product-figure figcaption { max-width: 310px; margin: 38px 0 0 auto; color: rgba(229, 228, 227, .7); font-size: .85rem; text-align: right; }
.segment-section { padding-bottom: clamp(5rem, 9vw, 8rem); }
.section-heading > p:last-child { margin-top: 24px; }
.segment-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 52px; }
.segment-card { position: relative; min-height: 245px; display: flex; flex-direction: column; align-items: flex-start; padding: 26px; border: 1px solid var(--border); border-radius: var(--radius-card); text-decoration: none; transition: transform .18s var(--ease), box-shadow .18s ease; }
.segment-card:hover, .segment-card:focus-visible { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.segment-card > span { margin-bottom: 34px; font-size: .8rem; font-weight: 700; letter-spacing: .12em; }
.segment-card h3 { font-size: 2.15rem; }
.segment-card p { margin-top: 12px; color: rgba(35, 39, 42, .7); }
.segment-card b { position: absolute; right: 25px; bottom: 22px; font-size: 1.3rem; }
.segment-card--orange { background: rgba(240, 126, 51, .18); }
.segment-card--purple { background: rgba(95, 74, 153, .16); }
.segment-card--pink { background: rgba(231, 36, 113, .14); }
.segment-card--yellow { background: rgba(219, 219, 0, .25); }
.faq-section { padding-top: 0; }
.faq-grid { display: grid; grid-template-columns: minmax(0, .88fr) minmax(360px, 1.12fr); gap: 72px; align-items: start; }
.faq-intro { max-width: 460px; margin-top: 24px; color: rgba(35, 39, 42, .68); font-size: 1.05rem; }
.faq-list { border-top: 1px solid var(--border); }
.faq-list details { border-bottom: 1px solid var(--border); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 23px 0; cursor: pointer; font-size: 1.08rem; font-weight: 700; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: '+'; color: var(--moovz-orange); font-size: 1.7rem; font-weight: 400; }
.faq-list details[open] summary::after { content: '−'; }
.faq-list details p { max-width: 600px; padding: 0 44px 24px 0; color: rgba(35, 39, 42, .68); }
.cta-section__inner { align-items: center; }
.cta-section h2 { max-width: 710px; }
.cta-section__inner > div > p:last-child { max-width: 570px; margin-top: 24px; color: rgba(229, 228, 227, .8); }
.cta-section .shadcn-button { justify-self: end; }
.site-footer { background: var(--moovz-black); color: var(--moovz-offwhite); padding: 64px 0 22px; }
.site-footer__top { display: flex; justify-content: space-between; gap: 40px; }
.site-footer img { width: 186px; height: auto; }
.site-footer p { margin-top: 20px; color: rgba(229, 228, 227, .68); }
.footer-links { display: flex; flex-direction: column; align-items: flex-end; gap: 13px; font-size: .9rem; }
.footer-links a { color: rgba(229, 228, 227, .8); text-decoration: none; }
.footer-links a:hover, .footer-links a:focus-visible { color: var(--moovz-orange); }
.site-footer__bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 56px; padding-top: 18px; border-top: 1px solid rgba(229, 228, 227, .16); color: rgba(229, 228, 227, .46); font-size: .75rem; }
.floating-whatsapp { position: fixed; z-index: 8; right: 22px; bottom: 22px; display: grid; width: 58px; height: 58px; place-items: center; border: 4px solid var(--moovz-offwhite); border-radius: 50%; background: #20bd5a; color: #fff; box-shadow: var(--shadow-md); text-decoration: none; transition: transform .18s var(--ease); }
.floating-whatsapp:hover, .floating-whatsapp:focus-visible { transform: translateY(-4px); }
.floating-whatsapp svg { width: 28px; height: 28px; }

@media (max-width: 900px) {
  .site-nav a:not(.shadcn-button) { display: none; }
  .hero { min-height: auto; padding: 140px 0 0; }
  .hero__grid, .intro-grid, .section-heading--split, .experience-grid, .faq-grid, .cta-section__inner { grid-template-columns: 1fr; gap: 42px; }
  .hero__grid { min-height: 0; }
  .hero__visual { min-height: 475px; max-width: 560px; width: 100%; margin-inline: auto; }
  .hero__bottom-line { flex-wrap: wrap; }
  .benefit-grid { grid-template-columns: 1fr; }
  .benefit-card { min-height: 0; }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .segment-grid { grid-template-columns: repeat(2, 1fr); }
  .cta-section .shadcn-button { justify-self: start; }
  .product-figure__frame { margin-inline: 0 auto; }
  .product-figure figcaption { margin-left: 0; margin-right: auto; text-align: left; }
}

@media (max-width: 580px) {
  .container { width: min(calc(100% - 40px), var(--container)); }
  .site-header { padding-top: 18px; }
  .brand img { width: 148px; }
  .site-nav .shadcn-button { display: none; }
  .mobile-cta { display: grid; }
  .hero { padding-top: 118px; }
  h1 { font-size: clamp(3.45rem, 17vw, 5.5rem); }
  h2 { font-size: clamp(2.9rem, 13.5vw, 4.6rem); }
  .hero__intro { font-size: 1.06rem; }
  .hero__actions { align-items: stretch; flex-direction: column; }
  .hero__actions .shadcn-button { width: 100%; }
  .hero__visual { min-height: 375px; }
  .hero__shape--back { inset: 40px 5px 8px 20px; }
  .hero__shape--front { inset: 18px 26px 35px 3px; }
  .hero__kit { top: 84px; right: 7%; width: 76%; }
  .hero__monitor { right: 0; bottom: -5px; width: 112px; padding: 10px 10px 0; }
  .hero__stamp { right: 0; bottom: 7px; font-size: .58rem; }
  .hero__bottom-line { display: grid; grid-template-columns: 1fr; gap: 8px; padding-bottom: 24px; font-size: .69rem; }
  .section { padding-block: 68px; }
  .eyebrow { font-size: .7rem; }
  .process-grid, .segment-grid { grid-template-columns: 1fr; }
  .process-card { min-height: 250px; }
  .product-figure__frame { width: calc(100% - 14px); }
  .product-figure__frame img { height: 420px; }
  .site-footer__top, .site-footer__bottom { flex-direction: column; }
  .footer-links { align-items: flex-start; }
  .site-footer__bottom { gap: 8px; margin-top: 40px; }
  .floating-whatsapp { right: 15px; bottom: 15px; width: 53px; height: 53px; }
  .floating-whatsapp svg { width: 25px; height: 25px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}