.elementor-kit-7{--e-global-color-primary:#1A1A1A;--e-global-color-secondary:#54595F;--e-global-color-text:#4A4A4A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Noto Sans JP";--e-global-typography-primary-font-size:32px;--e-global-typography-primary-font-weight:700;--e-global-typography-primary-line-height:0px;--e-global-typography-primary-letter-spacing:1.3px;--e-global-typography-secondary-font-family:"Noto Sans JP";--e-global-typography-secondary-font-size:18px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-letter-spacing:1.2px;--e-global-typography-text-font-family:"Noto Sans JP";--e-global-typography-text-font-size:19px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:0px;--e-global-typography-text-letter-spacing:1.7px;--e-global-typography-text-word-spacing:0px;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* =====================================
   HEADER FIXO RAIZE.id - DESKTOP/TABLET
   ===================================== */

.raize-header {
  width: 100%;
  height: 70px;              /* altura fixa do cabeçalho */
  padding: 0;
  background: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  border-bottom: 1px solid #eaeaea;
  display: flex;
  align-items: center;       /* centraliza verticalmente logo e menu */
}

/* CONTEÚDO GERAL – cria espaço abaixo do header */
body {
  margin: 0;
  padding-top: 70px;         /* mesmo valor da height do header */
}

.raize-container {
  max-width: 1200px;
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
}

.raize-logo {
  font-size: 32px;
  font-weight: 700;
  color: #000;
  text-decoration: none;
  letter-spacing: -1px;
}

.raize-logo span {
  color: #ff0044;
}

.raize-nav {
  display: flex;
  align-items: center;
}

.raize-nav a {
  margin-left: 28px;
  text-decoration: none;
  color: #111;
  font-size: 16px;
  font-weight: 500;
  transition: 0.2s;
}

.raize-nav a:hover {
  color: #ff0044;
}

/* Se estiver logado no WP e aparecer a barra preta no topo */
.admin-bar .raize-header {
  top: 32px;
}
.admin-bar body {
  padding-top: 102px; /* 70 + 32 */
}


/* ==================
   FOOTER RAIZE.id
   ================== */

.raize-footer {
  background: #0f0f0f;
  color: #fff;
  padding: 60px 20px 30px 20px;
  font-family: 'Inter', sans-serif;
}

.raize-footer-container {
  max-width: 1200px;
  margin: auto;
  display: flex;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}

/* Logo */
.raize-footer-logo {
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
}

.raize-footer-logo span {
  color: #ff0044;
}

/* Descrição */
.footer-desc {
  margin-top: 10px;
  line-height: 1.6;
  opacity: 0.85;
}

/* Colunas */
.footer-col h4 {
  font-size: 18px;
  margin-bottom: 15px;
  border-left: 3px solid #ff0044;
  padding-left: 8px;
}

.footer-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-col ul li {
  margin-bottom: 10px;
}

.footer-col ul li a {
  color: #fff;
  text-decoration: none;
  opacity: 0.85;
  transition: 0.2s;
}

.footer-col ul li a:hover {
  opacity: 1;
  color: #ff0044;
}

/* Bottom */
.footer-bottom {
  text-align: center;
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.1);
  opacity: 0.7;
}


/* ===========================
   CONTROLES DO MENU HAMBÚRGUER
   (escondidos no desktop/tablet)
   =========================== */

.raize-menu-toggle,
.raize-menu-icon {
  display: none;
}


/* ==========================================
   MOBILE GERAL (SMARTPHONE) - ATÉ 767px
   Header, menu, footer, hero, pricing, CTA
   ========================================== */

@media (max-width: 767px) {

  /* -------- HEADER + MENU -------- */

  /* Header mais compacto */
  .raize-header {
    height: 60px;
  }

  body {
    padding-top: 60px;
  }

  /* Logo um pouco menor */
  .raize-logo {
    font-size: 24px;
  }

  .raize-container {
    padding: 0 16px;
  }

  /* Mostra o ícone de hambúrguer no mobile */
  .raize-menu-toggle {
    display: block;
    position: absolute;
    right: 16px;
    width: 28px;
    height: 24px;
    opacity: 0;
    cursor: pointer;
    z-index: 100001;
  }

  .raize-menu-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    position: absolute;
    right: 16px;
    width: 28px;
    height: 24px;
    cursor: pointer;
    z-index: 100000;
  }

  .raize-menu-icon span {
    display: block;
    height: 2px;
    width: 100%;
    background: #111;
    border-radius: 2px;
    transition: 0.2s ease;
  }

  /* Menu escondido por padrão no mobile */
  .raize-nav {
    position: absolute;
    top: 60px;           /* mesma altura do header */
    left: 0;
    right: 0;
    background: #ffffff;
    flex-direction: column;
    align-items: flex-start;
    border-bottom: 1px solid #eaeaea;
    display: none;
  }

  .raize-nav a {
    width: 100%;
    margin: 0;
    padding: 12px 20px;
    border-top: 1px solid #f3f3f3;
    font-size: 15px;
  }

  /* Quando o checkbox é marcado → mostra o menu */
  .raize-menu-toggle:checked ~ .raize-nav {
    display: flex;
  }

  /* Animação X no ícone */
  .raize-menu-toggle:checked + .raize-menu-icon span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
  }
  .raize-menu-toggle:checked + .raize-menu-icon span:nth-child(2) {
    opacity: 0;
  }
  .raize-menu-toggle:checked + .raize-menu-icon span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
  }

  /* -------- FOOTER MOBILE -------- */

  .raize-footer-container {
    flex-direction: column;
    gap: 20px;
  }


 /* ====== SERVICE PAGE – MOBILE (ATÉ 767px) ====== */
@media (max-width: 767px) {

  /* HERO
     Container principal da hero tem ID: hero-service */
  @media (max-width: 767px) {

  /* HERO – mesma largura visual dos outros cards (Sample Douga) */
  #hero-service {
    margin: 0 auto !important;
    padding: 16px 0 40px 0 !important;   /* sem padding lateral */
    box-sizing: border-box;
  }

  /* Pílula azul centralizada */
  #hero-service .elementor-widget-html p:first-child {
    text-align: center;
    margin-bottom: 12px;
  }

  /* Botão verde centralizado */
  #hero-service .elementor-widget-html a {
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
  }

  /* Vídeo um pouquinho maior */
  #hero-service .elementor-widget-video iframe,
  #hero-service .elementor-widget-video video {
    display: block;
    width: 106%;
    margin-left: -3%;
    border-radius: 24px;
  }

  /* Título e texto mais confortáveis */
  #hero-service h1,
  #hero-service h2 {
    font-size: 1.45rem;
    line-height: 1.4;
  }

  #hero-service p {
    font-size: 0.95rem;
    line-height: 1.7;
  }
}


  /* HTML (card) + vídeo ocupando 100% da largura interna */
  #hero-service .elementor-widget-html,
  #hero-service .elementor-widget-video {
    width: 100% !important;
    margin: 0;
  }

  /* Pílula azul (primeiro elemento do card) centralizada */
  #hero-service .elementor-widget-html > *:first-child {
    text-align: center;
    margin-bottom: 12px;
  }

  /* Botão verde centralizado */
  #hero-service .elementor-widget-html a {
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto;
  }

  /* Vídeo centralizado */
  #hero-service .elementor-widget-video iframe,
  #hero-service .elementor-widget-video video {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
  }

  /* Título um pouco menor para não estourar nas laterais */
   /* HERO – reduzir um pouco o título para caber melhor */
  #hero-service h1,
  #hero-service h2 {
    font-size: 1.45rem;
    line-height: 1.4;
  }

  /* Texto dos parágrafos um tiquinho menor e mais respirado */
  #hero-service p {
    font-size: 0.95rem;
    line-height: 1.7;
  }

  /* 料金プラン – SE a seção tiver classe service-pricing */
  .service-pricing {
    padding: 32px 16px;
    text-align: center;
  }

  .service-pricing .elementor-widget-html {
    max-width: 720px;
    margin: 0 auto;
  }

  /* CTA final – SE a seção tiver classe service-cta */
  .service-cta {
    padding: 32px 16px 40px 16px;
    text-align: center;
  }

  .service-cta .elementor-widget-html {
    max-width: 720px;
    margin: 0 auto;
  }

  .service-cta .elementor-widget-html a {
    display: inline-block;
  }
}
/* HERO - Forçar largura EXATAMENTE igual aos cards da seção Sample Douga */
@media (max-width: 767px) {

  /* Remover padding interno escondido */
  #hero-service .elementor-widget-html,
  #hero-service .elementor-widget-container {
    padding: 0 !important;
  }

  /* Forçar largura precisa do contêiner */
  #hero-service {
    width: calc(100vw - 32px) !important;  /* mesmo espaço lateral dos cards abaixo */
    max-width: calc(100vw - 32px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  /* Pílula azul 100% centralizada */
  #hero-service .elementor-widget-html p:first-child {
    text-align: center !important;
    width: 100% !important;
    margin: 0 auto 12px auto !important;
  }

  /* Título centralizado corretamente */
  #hero-service h1,
  #hero-service h2 {
    margin: 0 auto !important;
    text-align: left !important;
    width: calc(100% - 8px) !important; /* corrige o puxão pra esquerda */
    font-size: 1.45rem !important;
    line-height: 1.35 !important;
  }

  /* Texto ok */
  #hero-service p {
    width: 100% !important;
    margin: 12px 0 !important;
    line-height: 1.65 !important;
  }

  /* Botão LINE centralizado */
  #hero-service a {
    display: block !important;
    margin: 24px auto 0 auto !important;
    width: fit-content !important;
  }

  /* Vídeo maior — equilibrado */
  #hero-service .elementor-widget-video iframe,
  #hero-service .elementor-widget-video video {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 20px auto 0 auto !important;
  }
}
/* Centralizar apenas a pílula azul no mobile */
#hero-service .raize-eyebrow {
    display: block;
    width: 100%;
    text-align: center;
    margin: 0 auto 14px auto;
}
/* Ajuste da largura da seção "RAIZEが選ばれる理由" no DESKTOP */
@media (min-width: 1025px) {

  .raize-reasons {
    max-width: 1200px !important;    /* mesmo tamanho visual do pricing */
    width: 100%;
    margin: 0 auto !important;
  }

  /* Garante que o conteúdo dentro da seção não fique espremido */
  .raize-reasons .raize-list,
  .raize-reasons h2 {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
  }
}
/* Forçando largura desktop da seção RAIZEが選ばれる理由 */
.raize-reasons {
    max-width: 1100px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Forçando o container interno também */
.raize-reasons .raize-list,
.raize-reasons h2 {
    max-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/* ===========================
   ESPAÇAMENTO GLOBAL RAIZE
   =========================== */

/* Desktop / Tablet */
.raize-section {
  /* centraliza e dá espaço padrão */
  margin: 100px auto;  /* 100px em cima e embaixo */
}

/* primeira seção abaixo do HERO um pouquinho mais perto */
.raize-section:first-of-type {
  margin-top: 80px;
}

/* MOBILE */
@media (max-width: 767px) {
  .raize-section {
    margin: 50px auto;   /* metade do desktop mais ou menos */
  }

  .raize-section:first-of-type {
    margin-top: 40px;
  }
}

/* ===========================
   MODIFICADORES OPCIONAIS
   (pra quando quiser mais ou menos espaço
   em uma seção específica)
   =========================== */

/* Seção mais "justa" (menos espaço) */
.raize-section.raize-section--tight {
  margin-top: 60px;
  margin-bottom: 60px;
}

@media (max-width: 767px) {
  .raize-section.raize-section--tight {
    margin-top: 35px;
    margin-bottom: 35px;
  }
}

/* Seção mais "solta" (mais espaço) */
.raize-section.raize-section--loose {
  margin-top: 130px;
  margin-bottom: 130px;
}

@media (max-width: 767px) {
  .raize-section.raize-section--loose {
    margin-top: 70px;
    margin-bottom: 70px;
  }
}
/* ==========================
   HOME – centralizar botões no MOBILE
   ========================== */
@media (max-width: 767px) {

  /* HERO da home: botões em coluna e centralizados */
  .raize-home-hero-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
  }

  .raize-home-hero-actions .raize-btn {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  /* CTA final da home (seção que usa raize-home-center) */
  .raize-home-center .raize-btn {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
}/* End custom CSS */