.r8ct *{box-sizing:border-box;}
.r8ct{--font:'Calibri','Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --bg:#fff; --panel:#fff; --ink:#231f20; --text:#2b2a2b; --muted:#6f6a61;
  --gold:#c59b4a; --gold-deep:#9c7a2e; --gold-soft:#f4efe4; --line:#e7e1d5; --line-2:#d7cfbf; --tile:#f3efe6;
  background:#fff; color:var(--text); font-family:var(--font); line-height:1.6;}
.r8ct .shell{max-width:1120px; margin:0 auto; padding:0 26px;}
.r8ct section{padding:36px 0 52px;}
.r8ct h1,.r8ct h2,.r8ct h3{color:var(--ink); font-weight:700; margin:0;}

/* HERO (igual que servicios) */
.r8ct .r8hero{position:relative; min-height:320px; background:linear-gradient(180deg, rgba(18,14,6,.60), rgba(18,14,6,.74)), url('https://realesdea8.com/wp-content/uploads/2024/10/hero-cabecera-8reales-1.jpg') center/cover; display:flex; align-items:center; justify-content:center; text-align:center;}
.r8ct .r8hero .in{width:100%; padding:46px 24px; color:#fff;}
.r8ct .r8hero h1{color:#fff; font-size:clamp(30px,6vw,50px); letter-spacing:-.01em; margin:0; line-height:1.08;}
.r8ct .r8hero .rule{width:60px; height:3px; background:var(--gold); margin:16px auto;}
.r8ct .r8hero p{margin:0 auto; font-size:clamp(15px,2.3vw,19px); color:#e9dfc9; max-width:52ch;}

.r8ct .grid{display:grid; grid-template-columns:1fr 1fr; column-gap:46px; row-gap:34px; align-items:start; grid-template-areas:"chat methods" "chat form";}
.r8ct .b-chat{grid-area:chat;} .r8ct .b-methods{grid-area:methods;} .r8ct .b-form{grid-area:form;}
.r8ct .eyebrow{display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--gold-deep); margin:0 0 12px;}
.r8ct .eyebrow::before{content:""; width:20px; height:2px; background:var(--gold);}
.r8ct .col h2{font-size:clamp(22px,2.8vw,28px); line-height:1.14; letter-spacing:-.005em; margin:0 0 10px;}
.r8ct .col > p{margin:0 0 20px; font-size:16px; color:var(--muted); max-width:46ch;}

/* efecto + asistente (calco del widget r8c) */
.r8ct .assistwrap{position:relative;}
.r8ct .assistwrap::before{content:""; position:absolute; inset:-4px; border-radius:15px; background:linear-gradient(120deg, var(--gold), #e6c37e, var(--gold-deep), var(--gold)); background-size:300% 300%; filter:blur(10px); opacity:.5; z-index:0; animation:r8glow 6s ease infinite;}
@keyframes r8glow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.r8ct .r8c-embed{position:relative; z-index:1; width:100%; height:480px; margin:0 !important; padding:0 !important; background:#fff; border:1px solid rgba(197,155,74,.28); border-radius:10px; box-shadow:0 24px 70px rgba(0,0,0,.14); overflow:hidden; display:flex; flex-direction:column; font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Arial,sans-serif; color:#231F20; text-align:left;}
.r8ct .r8c-embed *{margin:0;}
.r8ct .r8c-head{background:#231F20; color:#fff; padding:15px 16px; margin:0 !important; text-align:left !important; display:flex; align-items:center; gap:12px; border-bottom:1px solid rgba(197,155,74,.28);}
.r8ct .r8c-brand{display:flex; align-items:center; gap:10px; min-width:0;}
.r8ct .r8c-avatar{width:34px; height:34px; border-radius:50%; background:#231F20; border:1px solid rgba(197,155,74,.8); display:grid; place-items:center; flex:0 0 auto; box-shadow:inset 0 0 0 3px rgba(255,255,255,.04);}
.r8ct .r8c-avatar img{width:21px; height:21px; object-fit:contain; filter:brightness(0) invert(1);}
.r8ct .r8c-title{font-weight:700; font-size:15px; line-height:1.15; color:#fff;}
.r8ct .r8c-sub{font-size:12px; color:#d9d5cb; margin-top:3px;}
.r8ct .r8c-status{display:flex; align-items:center; gap:6px; margin-top:5px; font-size:11px; line-height:1; color:#9ff0b6; font-weight:700;}
.r8ct .r8c-status-dot{width:7px; height:7px; border-radius:50%; background:#35d36f; box-shadow:0 0 0 0 rgba(53,211,111,.55); animation:r8cOnlinePulse 1.8s ease-out infinite;}
@keyframes r8cOnlinePulse{0%{box-shadow:0 0 0 0 rgba(53,211,111,.55)}70%,100%{box-shadow:0 0 0 8px rgba(53,211,111,0)}}
.r8ct .r8c-log{flex:1; overflow:auto; padding:16px; background:#F5F3EE; display:flex; flex-direction:column; gap:10px;}
.r8ct .r8c-msg{max-width:86%; border-radius:8px; padding:11px 13px; font-size:14px; line-height:1.5; box-shadow:0 1px 2px rgba(35,31,32,.04);}
.r8ct .r8c-msg strong{font-weight:600;} .r8ct .r8c-msg a{color:#8b6722; text-decoration:underline; text-underline-offset:2px;}
.r8ct .r8c-user{align-self:flex-end; background:#231F20; color:#fff; border-bottom-right-radius:3px;}
.r8ct .r8c-bot{align-self:flex-start; background:#fff; border:1px solid rgba(35,31,32,.08); color:#231F20; border-bottom-left-radius:3px;}
.r8ct .r8c-thinking{display:flex; align-items:center; gap:5px; min-width:58px;} .r8ct .r8c-thinking span{width:6px; height:6px; border-radius:50%; background:#C59B4A; animation:r8cThink 1s ease-in-out infinite;} .r8ct .r8c-thinking span:nth-child(2){animation-delay:.15s;} .r8ct .r8c-thinking span:nth-child(3){animation-delay:.3s;}
@keyframes r8cThink{0%,80%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.r8ct .r8c-quick{display:flex; flex-wrap:wrap; gap:8px; align-self:flex-start; max-width:100%;}
.r8ct .r8c-chip{border:1px solid rgba(197,155,74,.65); background:#fff; color:#231F20; border-radius:999px; padding:9px 11px; font-size:12px; line-height:1; cursor:pointer; white-space:nowrap; box-shadow:0 2px 8px rgba(35,31,32,.05); transition:background .16s,border-color .16s,transform .16s,color .16s;}
.r8ct .r8c-chip:hover{background:#231F20; border-color:#C59B4A; color:#fff; transform:translateY(-1px);}
.r8ct .r8c-form{display:flex; gap:8px; padding:12px; margin:0 !important; max-width:none !important; border-top:1px solid rgba(35,31,32,.08); background:#fff;}
.r8ct .r8c-input{flex:1; border:1px solid #d8d1c3; border-radius:8px; padding:11px 12px; font-size:14px; min-width:0; background:#fff; color:#231F20; outline:none; font-family:inherit;}
.r8ct .r8c-input:focus{border-color:#C59B4A; box-shadow:0 0 0 3px rgba(197,155,74,.16);}
.r8ct .r8c-send{border:0; border-radius:8px; background:#C59B4A; color:#231F20; font-weight:700; padding:0 14px; min-width:76px; cursor:pointer; font-size:14px; font-family:inherit;}

/* otras formas de contacto */
.r8ct .cmethods{display:flex; flex-direction:column; gap:12px; margin:0 0 26px;}
.r8ct .cmethod{display:flex; align-items:center; gap:14px; padding:15px 17px; border:1px solid var(--line); border-radius:12px; text-decoration:none; color:var(--ink); background:#fff; transition:border-color .15s, transform .15s;}
.r8ct .cmethod:hover{border-color:var(--gold); transform:translateX(2px);}
.r8ct .cmethod .ic{width:44px; height:44px; border-radius:11px; background:var(--gold-soft); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); flex:0 0 auto;}
.r8ct .cmethod b{font-size:15.5px; display:block; line-height:1.2;} .r8ct .cmethod span{font-size:13px; color:var(--muted);}

/* formulario */
.r8ct .col > .cform-h{font-size:clamp(22px,2.8vw,28px); font-weight:700; color:var(--ink); line-height:1.14; letter-spacing:-.005em; margin:0 0 8px; max-width:none;}
.r8ct .cfh-mobile{display:none;}
.r8ct .col > .cform-s{font-size:16px; color:var(--muted); margin:0 0 18px; max-width:none;}
.r8ct .cform{display:grid; gap:0;}
.r8ct .cform .fields{display:grid; gap:13px;}
.r8ct .cform .two{display:grid; grid-template-columns:1fr 1fr; gap:13px;}
.r8ct .cform label{display:block; font-size:12.5px; font-weight:700; color:var(--ink); margin:0 0 5px;}
.r8ct .cform input, .r8ct .cform textarea{width:100%; border:1px solid var(--line-2); border-radius:9px; padding:11px 13px; font:inherit; font-size:14.5px; color:var(--ink); background:#fff; outline:none;}
.r8ct .cform input:focus, .r8ct .cform textarea:focus{border-color:var(--gold); box-shadow:0 0 0 3px rgba(197,155,74,.14);}
.r8ct .cform textarea{min-height:110px; resize:vertical;}
.r8ct .cform .check{display:flex; gap:9px; align-items:flex-start; font-size:12.5px; color:var(--muted); line-height:1.45;}
.r8ct .cform .check input{width:16px; height:16px; margin-top:2px; flex:0 0 auto;}
.r8ct .cform .check a{color:var(--gold-deep); font-weight:600;}
.r8ct .cform .send{border:none; cursor:pointer; background:var(--gold); color:#231f20; font-weight:700; font-size:15px; padding:13px 22px; border-radius:9px; justify-self:start; transition:filter .15s, transform .12s;}
.r8ct .cform .send:hover{filter:brightness(1.05); transform:translateY(-1px);}
.r8ct .cform .ok{display:none; background:#e8f3ec; border:1px solid #2f7a4f; color:#1c5334; border-radius:9px; padding:13px 15px; font-size:14px; font-weight:600;}
.r8ct .cform.sent .ok{display:block;} .r8ct .cform.sent .fields{display:none;}

/* proteger mi form de las reglas globales del popup */
.r8ct form{margin:0; max-width:none;}

/* quitar el padding del tema SOLO en esta página */
body.page-id-11378 .site-content{padding:0 !important; margin:0 !important;}
body.page-id-11378 .site-main{padding:0 !important; margin:0 !important;}

@media (max-width:900px){ .r8ct .grid{grid-template-columns:1fr; column-gap:0; row-gap:34px; grid-template-areas:"methods" "chat" "form";} .r8ct .eyebrow{display:none;} .r8ct .cfh-desktop{display:none;} .r8ct .cfh-mobile{display:inline;} }
@media (max-width:640px){
  .r8ct section{padding:28px 0 40px;} .r8ct .shell{padding:0 18px;}
  .r8ct .r8hero{min-height:230px;} .r8ct .r8hero .in{padding:32px 18px;}
  .r8ct .cform .two{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce){ .r8ct *{animation:none !important; transition:none !important;} }