/* =========================================================
   CASA HOME — FORMULARIO "QUIERO RECIBIR INFORMACION", MAS PURO
   (plantillas/formulario.php, va despues de sus estilos)

   La foto del fondo y la del equipo se ven tal cual, sin velos: el
   texto se sostiene con su propia sombra. Letra Inter en tamanos
   normales. La tarjeta pasa a blanco, como las de Apple: campos sobre
   gris claro sin bordes, pestañas como control segmentado y nada de
   rayas separando partes; solo el espacio las ordena.
========================================================= */

.cgreen-form{
    font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

/* ---------- Portada: foto al natural ---------- */
.cgreen-form .cgf-hero{ box-shadow:none; }
.cgreen-form .cgf-hero::after{ display:none; }

.cgreen-form .cgf-hero-text h2,
.cgreen-form .cgf-hero-text p,
.cgreen-form .cgf-hero-kicker{
    text-shadow:0 1px 3px rgba(0,0,0,.35), 0 2px 18px rgba(0,0,0,.45);
}

.cgreen-form .cgf-hero-kicker{
    padding:0;
    border:0;
    background:none;
    backdrop-filter:none;
    margin-bottom:12px;
    font-size:13px;
    font-weight:500;
    letter-spacing:.02em;
    text-transform:none;
}
.cgreen-form .cgf-hero-kicker::before{ display:none; }

.cgreen-form .cgf-hero-text h2{
    font-size:clamp(26px,2.6vw,36px);
    font-weight:600;
    line-height:1.12;
    letter-spacing:-.02em;
}
.cgreen-form .cgf-hero-text p{
    margin-top:14px;
    color:#fff;
    font-size:15px;
    font-weight:400;
    line-height:1.6;
}

/* ---------- Tarjeta blanca ---------- */
.cgreen-form .cgf-card{
    border:0;
    border-radius:24px;
    background:#fff;
    box-shadow:0 2px 6px rgba(0,0,0,.06), 0 24px 60px rgba(0,0,0,.22);
}

/* Foto del equipo sin velo. El logo blanco solo se leia gracias al
   velo; el sitio ya lo muestra en la cabecera, asi que aqui sobra.
   Queda el aviso de asesores en una pastilla clara, abajo. */
.cgreen-form .cgf-card-photo:not(.cgf-campaign-banner) .cgf-card-photo-overlay{
    align-items:flex-end;
    justify-content:flex-start;
    padding:14px;
    background:none;
}
.cgreen-form .cgf-card-photo:not(.cgf-campaign-banner) .cgf-logo-badge-wrap{ align-items:flex-start; }
.cgreen-form .cgf-card-photo:not(.cgf-campaign-banner) .cgf-logo-panel,
.cgreen-form .cgf-card-photo:not(.cgf-campaign-banner) .cgf-company-name-fallback{ display:none; }

.cgreen-form .cgf-card-photo-badge{
    padding:6px 12px;
    border:0;
    background:rgba(255,255,255,.9);
    backdrop-filter:saturate(180%) blur(20px);
    box-shadow:0 1px 6px rgba(0,0,0,.12);
}
.cgreen-form .cgf-card-photo-badge span{
    color:#1d1d1f;
    font-size:12px;
    font-weight:500;
}
.cgreen-form .cgf-badge-dot{ background:#30d158; }

/* ---------- Encabezado ---------- */
.cgreen-form .cgf-form{ padding:24px 28px 28px; }
.cgreen-form .cgf-form-header{
    margin-bottom:18px;
    padding-bottom:0;
    border-bottom:0;
}
.cgreen-form .cgf-form-header h2{
    color:#1d1d1f;
    font-size:21px;
    font-weight:600;
    letter-spacing:-.015em;
}
.cgreen-form .cgf-form-header p{
    margin-top:4px;
    color:#86868b;
    font-size:13.5px;
    font-weight:400;
}

/* ---------- Persona / Empresa: control segmentado ---------- */
.cgreen-form .cgf-tipo-wrap{
    gap:4px;
    padding:4px;
    border-radius:12px;
    background:#f5f5f7;
}
.cgreen-form .cgf-tipo{
    height:36px;
    border:0;
    border-radius:9px;
    background:transparent;
    color:#6e6e73;
    font-size:13.5px;
    font-weight:500;
}
.cgreen-form .cgf-tipo:hover{ background:transparent; color:#1d1d1f; }
.cgreen-form .cgf-tipo.active{
    border:0;
    background:#fff;
    color:#1d1d1f !important;
    box-shadow:0 1px 3px rgba(0,0,0,.12);
}

/* ---------- Campos ---------- */
.cgreen-form .cgf-form input:not([type=checkbox]):not([type=radio]),
.cgreen-form .cgf-form select,
.cgreen-form .cgf-phone{
    height:44px;
    border:1px solid transparent;
    border-radius:10px;
    background-color:#f5f5f7;
    color:#1d1d1f;
    font-size:14.5px;
    font-weight:400;
}
.cgreen-form .cgf-form input::placeholder{ color:#86868b; font-size:14px; font-weight:400; }
.cgreen-form .cgf-form input:focus,
.cgreen-form .cgf-form select:focus,
.cgreen-form .cgf-phone:focus-within{
    border-color:transparent;
    background-color:#fff;
    box-shadow:0 0 0 2px #1d1d1f;
}
.cgreen-form .cgf-form input[readonly]{ color:#424245; }
.cgreen-form .cgf-phone span{
    border-right:0;
    padding:0 4px 0 14px;
    color:#86868b;
    font-weight:500;
    line-height:44px;
}
.cgreen-form .cgf-phone input{ box-shadow:none !important; }
.cgreen-form .cgf-doc-btn{
    border-radius:50%;
    background:#1d1d1f;
}
.cgreen-form .cgf-doc-status.ok{ color:#248a3d; }
.cgreen-form .cgf-doc-status.error{ color:#d70015; }

/* ---------- Tipo de propiedad ---------- */
.cgreen-form .cgf-section-label{
    margin:18px 0 9px;
    color:#1d1d1f;
    font-size:13.5px;
    font-weight:500;
    letter-spacing:0;
    text-transform:none;
}
.cgreen-form .cgf-tipos-grid{ gap:6px; }
.cgreen-form .cgf-tipo-prop{
    min-height:66px;
    border:0;
    border-radius:12px;
    background:#f5f5f7;
    color:#424245;
    font-size:12px;
    font-weight:500;
}
.cgreen-form .cgf-tipo-prop i{ font-size:17px; }
.cgreen-form .cgf-tipo-prop:hover{ background:#ebebef; color:#1d1d1f; transform:none; }
.cgreen-form .cgf-tipo-prop.active{
    border:0;
    background:#1d1d1f;
    color:#fff;
    box-shadow:none;
}

/* ---------- Lotes ---------- */
.cgreen-form .cgf-lotes-search-wrap::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2386868b' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
}
.cgreen-form .cgf-lotes-search-wrap input{
    height:40px;
    padding-left:36px;
    background:#f5f5f7;
    color:#1d1d1f;
    font-size:13.5px;
}
.cgreen-form .cgf-lotes-search-wrap input::placeholder{ color:#86868b; }
.cgreen-form #cgf-lotes-lista{ scrollbar-color:#d2d2d7 transparent; }
.cgreen-form #cgf-lotes-lista::-webkit-scrollbar-thumb{ background:#d2d2d7; }
.cgreen-form .cgf-proyecto-nombre{ color:#1d1d1f; font-size:13px; font-weight:600; }
.cgreen-form .cgf-proyecto-ubicacion{ color:#86868b; font-size:11.5px; }
.cgreen-form .cgf-lote-item{
    border:0;
    border-radius:12px;
    background:#f5f5f7;
}
.cgreen-form .cgf-lote-item:hover{ background:#ebebef; transform:none; }
.cgreen-form .cgf-lote-item.selected,
.cgreen-form .cgf-lote-item:has(input[type='radio']:checked){ background:#1d1d1f; }
.cgreen-form .cgf-lote-num{ color:#1d1d1f; font-size:12.5px; font-weight:600; }
.cgreen-form .cgf-lote-area{ color:#86868b; font-size:11.5px; }
.cgreen-form .cgf-lote-precio{ color:#1d1d1f; font-size:11.5px; font-weight:600; }
.cgreen-form .cgf-lote-item.selected .cgf-lote-num,
.cgreen-form .cgf-lote-item.selected .cgf-lote-precio,
.cgreen-form .cgf-lote-item:has(input:checked) .cgf-lote-num,
.cgreen-form .cgf-lote-item:has(input:checked) .cgf-lote-precio{ color:#fff; }
.cgreen-form .cgf-lote-item.selected .cgf-lote-area,
.cgreen-form .cgf-lote-item:has(input:checked) .cgf-lote-area{ color:rgba(255,255,255,.7); }
.cgreen-form .cgf-lote-check{ border:0; background:#e3e3e8; }
.cgreen-form .cgf-lote-item.selected .cgf-lote-check,
.cgreen-form .cgf-lote-item:has(input:checked) .cgf-lote-check{ background:#fff; color:#1d1d1f; }
.cgreen-form .cgf-no-proyectos{ color:#86868b; font-size:12.5px; }
.cgreen-form .cgf-lote-seleccionado{
    border:0;
    border-radius:12px;
    background:#f5f5f7;
}
.cgreen-form .cgf-cambiar-lote{
    border-radius:980px;
    background:#1d1d1f;
    color:#fff;
    font-size:12px;
    font-weight:500;
}
.cgreen-form .cgf-cambiar-lote:hover{ background:#000; transform:none; }

/* ---------- Aceptaciones y envio ---------- */
.cgreen-form .cgf-check input[type='checkbox']{ accent-color:#1d1d1f; }
.cgreen-form .cgf-check span{ color:#6e6e73; font-size:12.5px; font-weight:400; }
.cgreen-form .cgf-link,
.cgreen-form .cgf-link:hover{
    border-bottom:0;
    color:#0066cc;
    font-weight:400;
}
.cgreen-form .cgf-link:hover{ text-decoration:underline; }

.cgreen-form .cgf-btn{
    height:48px;
    border-radius:980px;
    font-size:15px;
    font-weight:600;
    box-shadow:none;
}
.cgreen-form .cgf-btn:hover:not(:disabled){ box-shadow:none; transform:none; }

.cgreen-form .cgf-error{ color:#d70015; font-weight:500; }
.cgreen-form .cgf-ok{
    border:0;
    border-radius:12px;
    background:#f5f5f7;
    color:#1d1d1f;
    font-weight:500;
}

@media (max-width:640px){
    .cgreen-form .cgf-form{ padding:20px 18px 22px; }
    .cgreen-form .cgf-hero-text h2{ font-size:clamp(23px,6.4vw,28px); letter-spacing:-.015em; }
    .cgreen-form .cgf-hero-kicker{ padding:0; font-size:12px; }
}

/* ---------- Mas compacto ----------
   Los campos iban separados de mas y las casillas de aceptacion
   heredaban la altura de los campos (44 px): quedaban por debajo de
   su texto. Ahora son casillas normales, alineadas con la primera
   linea, y todo va con el mismo paso de 8 px. */
.cgreen-form .cgf-form{ padding:22px 24px 24px; }
.cgreen-form .cgf-form-header{ margin-bottom:14px; }
.cgreen-form .cgf-tipo-wrap{ margin-bottom:10px; border-radius:10px; }
.cgreen-form .cgf-tipo{ height:34px; border-radius:8px; }
.cgreen-form .cgf-mb10{ margin-bottom:8px; }
.cgreen-form .cgf-grid-2{ gap:8px; margin-bottom:8px; }
.cgreen-form .cgf-grid-2 .cgf-mb10{ margin-bottom:0; }
.cgreen-form .cgf-doc-btn{ width:30px; height:30px; right:7px; }
.cgreen-form .cgf-section-label{ margin:14px 0 8px; }
.cgreen-form .cgf-tipo-prop{ min-height:58px; border-radius:10px; gap:5px; }
.cgreen-form .cgf-tipo-prop i{ font-size:16px; }
.cgreen-form #cgf-distrito-wrap .cgf-field{ margin-top:8px !important; }
.cgreen-form .cgf-lote-item,
.cgreen-form .cgf-lote-seleccionado{ border-radius:10px; }

.cgreen-form .cgf-checks{ margin-top:14px; }
.cgreen-form .cgf-check{ align-items:flex-start; gap:8px; margin-bottom:6px; }
.cgreen-form .cgf-check:last-child{ margin-bottom:0; }
.cgreen-form .cgf-check input[type='checkbox']{
    flex:0 0 15px;
    width:15px;
    height:15px;
    min-width:15px;
    margin:2px 0 0;
    padding:0;
    border-radius:4px;
    background:none;
    box-shadow:none;
}
.cgreen-form .cgf-check span{ font-size:12px; line-height:1.45; }
.cgreen-form .cgf-btn{ height:46px; margin-top:16px; }

/* =========================================================
   HOJA DE PAPEL, ESTILO APPLE

   La cabecera de campaña ya no es un bloque azul oscuro: la tarjeta
   es blanca de arriba abajo, con sombra muy suave y radio de 22 px.
   La campaña va como pastilla gris dentro del encabezado. Campos sin
   borde sobre #f2f2f7, foco con un anillo azul suave y boton grafito.
   Sin rayas, filetes ni degradados.
========================================================= */
.cgreen-form .cgf-card{
    border-radius:22px;
    box-shadow:0 1px 2px rgba(0,0,0,.05), 0 18px 48px rgba(0,0,0,.14);
}

/* Encabezado alineado a la izquierda, como una hoja de iOS */
.cgreen-form .cgf-form{ padding:26px 26px 26px; }
.cgreen-form .cgf-form-header{ margin-bottom:18px; text-align:left; }
.cgreen-form .cgf-form-header h2{
    margin:0;
    font-size:21px;
    line-height:1.2;
    text-align:left;
}
.cgreen-form .cgf-form-header p{
    margin:5px 0 0;
    color:#86868b;
    font-size:14px;
    text-align:left;
}

.cgreen-form .cgf-campaign-pill{
    display:inline-flex;
    align-items:center;
    gap:7px;
    max-width:100%;
    margin:0 0 12px;
    padding:5px 11px 5px 9px;
    border-radius:980px;
    background:#f2f2f7;
    color:#1d1d1f;
    font-size:12px;
    font-weight:500;
    line-height:1.3;
}
.cgreen-form .cgf-campaign-pill-dot{
    flex:0 0 7px;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#30d158;
}
.cgreen-form .cgf-campaign-pill-text{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

/* Segmentado iOS: el texto no se parte en dos lineas */
.cgreen-form .cgf-tipo-wrap{ margin-bottom:12px; background:#f2f2f7; border-radius:11px; }
.cgreen-form .cgf-tipo{ white-space:nowrap; gap:6px; }
.cgreen-form .cgf-tipo svg{ flex:0 0 auto; }

/* Campos */
.cgreen-form .cgf-form input:not([type=checkbox]):not([type=radio]),
.cgreen-form .cgf-form select,
.cgreen-form .cgf-phone{
    height:46px;
    border:0;
    border-radius:12px;
    background-color:#f2f2f7;
    transition:background-color .18s ease, box-shadow .18s ease;
}
.cgreen-form .cgf-form input:not([type=checkbox]):not([type=radio]){ padding-left:15px; }
.cgreen-form .cgf-form input:focus,
.cgreen-form .cgf-form select:focus,
.cgreen-form .cgf-phone:focus-within{
    outline:none;
    background-color:#fff;
    box-shadow:0 0 0 1px #0071e3, 0 0 0 4px rgba(0,113,227,.16);
}
.cgreen-form .cgf-phone input,
.cgreen-form .cgf-phone input:focus{ background-color:transparent !important; box-shadow:none !important; }
.cgreen-form .cgf-phone span{ line-height:46px; }
.cgreen-form .cgf-mb10{ margin-bottom:10px; }
.cgreen-form .cgf-grid-2{ gap:10px; margin-bottom:10px; }

/* Lupa del DNI dentro del campo: gris discreta, sin circulo negro */
.cgreen-form .cgf-doc-btn{
    right:6px;
    width:34px;
    height:34px;
    border-radius:50%;
    background:transparent;
    color:#6e6e73;
}
.cgreen-form .cgf-doc-btn:hover{
    filter:none;
    background:#e5e5ea;
    color:#1d1d1f;
    transform:translateY(-50%);
}
.cgreen-form .cgf-doc-btn svg{ width:16px; height:16px; }

/* Tipo de propiedad: tarjetas pequeñas */
.cgreen-form .cgf-section-label{ margin:18px 0 9px; font-size:13px; color:#6e6e73; }
.cgreen-form .cgf-tipos-grid{
    grid-template-columns:repeat(auto-fill, minmax(96px, 1fr));
    gap:8px;
}
.cgreen-form .cgf-tipo-prop{
    min-height:64px;
    border-radius:14px;
    background:#f2f2f7;
    color:#1d1d1f;
    font-size:12.5px;
    transition:background .18s ease, box-shadow .18s ease, color .18s ease;
}
.cgreen-form .cgf-tipo-prop i{ color:#6e6e73; }
.cgreen-form .cgf-tipo-prop:hover{ background:#e9e9ee; }
.cgreen-form .cgf-tipo-prop.active{
    background:#fff;
    color:#1d1d1f;
    box-shadow:0 0 0 2px #0071e3;
}
.cgreen-form .cgf-tipo-prop.active i{ color:#0071e3; }

.cgreen-form #cgf-distrito-wrap .cgf-field{ margin-top:10px !important; }
.cgreen-form .cgf-lote-item,
.cgreen-form .cgf-lote-seleccionado,
.cgreen-form .cgf-lotes-search-wrap input{ border-radius:12px; }

/* Aceptaciones y envio: boton grafito de Apple */
.cgreen-form .cgf-checks{ margin-top:16px; }
.cgreen-form .cgf-check input[type='checkbox']{ accent-color:#0071e3; }
.cgreen-form .cgf-btn{
    height:48px;
    margin-top:18px;
    border:0;
    border-radius:980px;
    background:#1d1d1f;
    color:#fff;
    transition:background .18s ease;
}
.cgreen-form .cgf-btn:hover:not(:disabled){ background:#000; }
.cgreen-form .cgf-btn:disabled{ background:#d2d2d7; color:#fff; }

@media (max-width:640px){
    .cgreen-form .cgf-card{ border-radius:20px; }
    .cgreen-form .cgf-form{ padding:22px 18px 22px; }
    .cgreen-form .cgf-form-header h2{ font-size:20px; }
    .cgreen-form .cgf-tipo{ font-size:13px; padding:0 6px; }
}
