/*
Theme Name: BK Kreative Buildings
Theme URI: https://bkreative.com.ar
Author: BK Kreative Buildings
Description: Tema a medida para estudio de arquitectura — diseño, dirección y ejecución de obra. Minimalista, editorial, sobrio.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: bk-arquitectura
*/

/* =========================================================
   VARIABLES DE MARCA
   ========================================================= */
:root{
	--bk-blanco: #FFFFFF;
	--bk-negro: #111110;
	--bk-gris-claro: #F1EFEA;
	--bk-gris-medio: #D8D4CC;
	--bk-gris-oscuro: #3A3833;
	--bk-sepia: #A9895C;
	--bk-sepia-oscuro: #8A6D45;
	--bk-font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
	--bk-font-body: 'Futura Medium', 'Futura', 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--bk-max-width: 1320px;
	--bk-transition: all .35s ease;
}

/* =========================================================
   RESET BÁSICO
   ========================================================= */
*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
	margin:0;
	font-family: var(--bk-font-body);
	color: var(--bk-negro);
	background: var(--bk-blanco);
	font-size: 17px;
	line-height: 1.7;
	font-weight: 500;
	-webkit-font-smoothing: antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color: inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button, input, textarea, select{ font-family: inherit; }
.bk-container{ max-width: var(--bk-max-width); margin:0 auto; padding:0 32px; }

h1,h2,h3,h4,h5{
	font-family: var(--bk-font-heading);
	font-weight: 500;
	line-height: 1.15;
	margin: 0 0 .5em;
	letter-spacing: -0.01em;
}
h1{ font-size: clamp(2.6rem, 5vw, 4.6rem); font-weight: 400; }
h2{ font-size: clamp(1.9rem, 3.4vw, 2.8rem); }
h3{ font-size: clamp(1.3rem, 2vw, 1.7rem); }
p{ margin: 0 0 1.2em; }

.bk-eyebrow{
	display:block;
	font-family: var(--bk-font-body);
	text-transform: uppercase;
	letter-spacing: .18em;
	font-size: .78rem;
	color: var(--bk-sepia-oscuro);
	font-weight: 600;
	margin-bottom: 1em;
}

.bk-btn{
	display:inline-flex;
	align-items:center;
	gap:10px;
	padding: 16px 34px;
	border: 1px solid var(--bk-negro);
	background: var(--bk-negro);
	color: var(--bk-blanco);
	font-size: .85rem;
	text-transform: uppercase;
	letter-spacing: .12em;
	font-weight: 600;
	transition: var(--bk-transition);
	cursor:pointer;
}
.bk-btn:hover{ background: var(--bk-sepia); border-color: var(--bk-sepia); color:var(--bk-blanco); }
.bk-btn.bk-btn-outline{ background:transparent; color: var(--bk-negro); }
.bk-btn.bk-btn-outline:hover{ background: var(--bk-negro); color: var(--bk-blanco); }
.bk-btn.bk-btn-light{ border-color: var(--bk-blanco); color: var(--bk-blanco); background:transparent; }
.bk-btn.bk-btn-light:hover{ background: var(--bk-blanco); color: var(--bk-negro); }

/* =========================================================
   HEADER
   ========================================================= */
.bk-header{
	position: fixed; top:0; left:0; right:0; z-index: 999;
	background: rgba(255,255,255,.92);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid rgba(17,17,16,.08);
	transition: var(--bk-transition);
}
.bk-header-inner{
	display:flex; align-items:center; justify-content:space-between;
	padding: 20px 32px;
	max-width: var(--bk-max-width); margin:0 auto;
}
.bk-logo{ font-family: var(--bk-font-heading); font-size:1.5rem; letter-spacing:.03em; display:flex; align-items:center; gap:10px; }
.bk-logo .bk-logo-mark{
	width:38px;height:38px;border-radius:50%;background:var(--bk-negro);color:var(--bk-blanco);
	display:flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:600;font-family:var(--bk-font-heading);
}
.bk-logo span{ color: var(--bk-sepia); }
.bk-logo-img{ width:44px;height:44px;object-fit:cover;border-radius:8px;flex-shrink:0; }
.bk-nav ul{ display:flex; gap:38px; }
.bk-nav a{
	font-size:.82rem; text-transform:uppercase; letter-spacing:.1em; font-weight:600;
	position:relative; padding-bottom:4px;
}
.bk-nav a::after{
	content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background: var(--bk-sepia); transition: var(--bk-transition);
}
.bk-nav a:hover::after, .bk-nav .current-menu-item a::after{ width:100%; }
.bk-header-cta{ display:flex; align-items:center; gap:24px; }
.bk-menu-toggle{ display:none; background:none; border:none; cursor:pointer; }
.bk-menu-toggle span{ display:block; width:26px; height:2px; background:var(--bk-negro); margin:6px 0; }

/* =========================================================
   HERO
   ========================================================= */
.bk-hero{
	position:relative; min-height: 100vh; display:flex; align-items:flex-end;
	background: linear-gradient(160deg, var(--bk-negro) 0%, #23211d 55%, var(--bk-sepia-oscuro) 130%);
	color: var(--bk-blanco); overflow:hidden;
}
.bk-hero::before{
	content:''; position:absolute; inset:0; opacity:.18;
	background-image: repeating-linear-gradient(115deg, rgba(255,255,255,.06) 0 2px, transparent 2px 90px);
}
.bk-hero-content{ position:relative; z-index:2; padding: 180px 0 100px; width:100%; }
.bk-hero h1{ color: var(--bk-blanco); max-width: 900px; }
.bk-hero .bk-eyebrow{ color: var(--bk-gris-medio); }
.bk-hero-sub{ max-width:560px; font-size:1.15rem; color: rgba(255,255,255,.82); margin-bottom:2.2em; }
.bk-hero-actions{ display:flex; gap:20px; flex-wrap:wrap; }
.bk-hero-scroll{
	position:absolute; right:40px; bottom:40px; z-index:2; color:rgba(255,255,255,.7);
	font-size:.75rem; text-transform:uppercase; letter-spacing:.2em; writing-mode: vertical-rl;
	display:flex; align-items:center; gap:14px;
}
.bk-hero-scroll::after{ content:''; width:1px; height:60px; background:rgba(255,255,255,.4); }

.bk-hero-logo{
	width: 132px;
	height: auto;
	margin-bottom: 40px;
	filter: drop-shadow(0 4px 10px rgba(0,0,0,.28));
	animation: bkHeroLogoIn 1.2s cubic-bezier(.19,1,.22,1) both;
}
@keyframes bkHeroLogoIn{
	from{ opacity:0; transform: translateY(18px); }
	to{ opacity:1; transform: translateY(0); }
}

/* =========================================================
   SECCIONES GENERALES
   ========================================================= */
section{ padding: 120px 0; }
.bk-section-alt{ background: var(--bk-gris-claro); }
.bk-section-dark{ background: var(--bk-negro); color: var(--bk-blanco); }
.bk-section-dark h2{ color: var(--bk-blanco); }
.bk-section-head{ max-width: 720px; margin-bottom: 64px; }
.bk-section-head.bk-center{ margin-left:auto; margin-right:auto; text-align:center; }

/* Quiénes somos / dos columnas */
.bk-split{ display:grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items:center; }
.bk-split-media{ aspect-ratio: 4/5; background: var(--bk-gris-medio); position:relative; overflow:hidden; }
.bk-split-media.bk-ph{ display:flex; align-items:center; justify-content:center; }
.bk-placeholder{
	width:100%; height:100%; display:flex; align-items:center; justify-content:center;
	background: linear-gradient(135deg, var(--bk-gris-medio), var(--bk-gris-claro));
	color: var(--bk-sepia-oscuro); font-family: var(--bk-font-heading); font-size:1rem; text-align:center; padding: 20px;
}

/* Cómo trabajamos / Proceso */
.bk-proceso{ display:grid; grid-template-columns: repeat(4,1fr); gap: 40px; }
.bk-proceso-item{ border-top: 2px solid var(--bk-negro); padding-top: 24px; }
.bk-proceso-num{ font-family: var(--bk-font-heading); font-size: 2.4rem; color: var(--bk-sepia); display:block; margin-bottom:12px; }

/* Beneficios */
.bk-beneficios{ display:grid; grid-template-columns: repeat(3,1fr); gap: 48px; }
.bk-beneficio-icon{ width:52px;height:52px;border:1px solid var(--bk-sepia); border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:20px; color: var(--bk-sepia); }

/* Proyectos - grid */
.bk-proyectos-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 4px; }
.bk-proyecto-card{ position:relative; aspect-ratio: 4/5; overflow:hidden; background: var(--bk-gris-medio); display:block; }
.bk-proyecto-card img{ width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.bk-proyecto-card:hover img{ transform: scale(1.06); }
.bk-proyecto-overlay{
	position:absolute; inset:0; background: linear-gradient(0deg, rgba(17,17,16,.82) 0%, rgba(17,17,16,0) 55%);
	display:flex; flex-direction:column; justify-content:flex-end; padding: 28px; color:#fff;
}
.bk-proyecto-overlay .bk-eyebrow{ color: var(--bk-gris-medio); margin-bottom:.4em; }
.bk-proyecto-overlay h3{ color:#fff; margin:0; }

/* Testimonios */
.bk-testimonios{ display:grid; grid-template-columns: repeat(3,1fr); gap: 40px; }
.bk-testimonio{ background: var(--bk-blanco); padding: 40px 32px; border: 1px solid var(--bk-gris-medio); }
.bk-testimonio-quote{ font-family: var(--bk-font-heading); font-size:1.15rem; font-style:italic; margin-bottom:24px; }
.bk-testimonio-autor{ font-size:.85rem; text-transform:uppercase; letter-spacing:.08em; color: var(--bk-sepia-oscuro); font-weight:600; }

/* CTA */
.bk-cta{ text-align:center; }
.bk-cta h2{ max-width:760px; margin-left:auto; margin-right:auto; }

/* Formulario contacto */
.bk-form{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; }
.bk-form .full{ grid-column: 1 / -1; }
.bk-form label{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; font-weight:600; margin-bottom:8px; }
.bk-form input, .bk-form textarea{
	width:100%; border:none; border-bottom:1px solid var(--bk-gris-medio); background:transparent; padding:12px 2px;
	font-size:1rem; color: var(--bk-negro);
}
.bk-form input:focus, .bk-form textarea:focus{ outline:none; border-color: var(--bk-sepia); }
.bk-form-msg{ padding:16px 20px; margin-bottom:24px; font-size:.9rem; }
.bk-form-msg.ok{ background:#EAF3EA; color:#2C5F2C; }
.bk-form-msg.error{ background:#FBE9E7; color:#9C3B2E; }
.bk-honeypot{ position:absolute; left:-9999px; opacity:0; }

/* Contacto: split info + form + mapa */
.bk-contact-grid{ display:grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
.bk-contact-info-item{ display:flex; gap:16px; margin-bottom: 28px; }
.bk-contact-info-item .label{ font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; color:var(--bk-sepia-oscuro); font-weight:600; display:block; margin-bottom:4px;}
.bk-map{ width:100%; height:420px; border:0; filter: grayscale(.4) contrast(1.05); margin-top: 40px; }

/* Footer */
.bk-footer{ background: var(--bk-negro); color: rgba(255,255,255,.75); padding: 90px 0 30px; }
.bk-footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 50px; margin-bottom:70px; }
.bk-footer h4{ color:#fff; font-family: var(--bk-font-body); font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:20px; }
.bk-footer a:hover{ color: var(--bk-sepia); }
.bk-footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding-top:26px; display:flex; justify-content:space-between; font-size:.78rem; flex-wrap:wrap; gap:12px; }
.bk-footer-logo{ font-family: var(--bk-font-heading); font-size:1.6rem; color:#fff; margin-bottom:16px; display:flex; align-items:center; gap:10px; }
.bk-footer-logo-img{ width:40px;height:40px;object-fit:cover;border-radius:8px;flex-shrink:0; }
.bk-footer-logo span{ color: var(--bk-sepia); }
.bk-footer li{ margin-bottom:10px; }

/* WhatsApp flotante */
.bk-whatsapp-float{
	position:fixed; bottom:26px; right:26px; z-index:9999;
	width:60px; height:60px; border-radius:50%; background:#25D366;
	display:flex; align-items:center; justify-content:center;
	box-shadow: 0 6px 20px rgba(0,0,0,.25);
	transition: var(--bk-transition);
}
.bk-whatsapp-float:hover{ transform: scale(1.08); }
.bk-whatsapp-float svg{ width:30px; height:30px; }

/* =========================================================
   PÁGINAS INTERNAS (Nosotros / Servicios / Contacto)
   ========================================================= */
.bk-page-hero{
	padding: 200px 0 90px; background: var(--bk-gris-claro); border-bottom:1px solid var(--bk-gris-medio);
}
.bk-page-hero h1{ margin-bottom: .3em; }

.bk-valores{ display:grid; grid-template-columns: repeat(4,1fr); gap: 34px; }
.bk-valor{ border-top: 2px solid var(--bk-sepia); padding-top:20px; }

.bk-servicio{ display:grid; grid-template-columns: .5fr 1fr; gap: 60px; padding: 60px 0; border-bottom:1px solid var(--bk-gris-medio); align-items:start; }
.bk-servicio:first-child{ padding-top:0; }
.bk-servicio-num{ font-family: var(--bk-font-heading); font-size:3rem; color: var(--bk-sepia); }
.bk-servicio h3{ margin-bottom:.4em; }
.bk-servicio-list{ margin-top:18px; }
.bk-servicio-list li{ padding-left:20px; position:relative; margin-bottom:8px; color: var(--bk-gris-oscuro); }
.bk-servicio-list li::before{ content:'—'; position:absolute; left:0; color: var(--bk-sepia); }

/* Single Proyecto */
.bk-proyecto-hero{ padding-top:170px; }
.bk-proyecto-meta{ display:grid; grid-template-columns: repeat(4,1fr); gap:30px; padding:40px 0; border-top:1px solid var(--bk-gris-medio); border-bottom:1px solid var(--bk-gris-medio); margin: 40px 0 60px; }
.bk-proyecto-meta .label{ font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--bk-sepia-oscuro); font-weight:600; display:block; margin-bottom:6px;}
.bk-proyecto-gallery{ display:grid; grid-template-columns: repeat(2,1fr); gap: 6px; margin: 50px 0; }
.bk-proyecto-gallery img{ width:100%; height:100%; object-fit:cover; aspect-ratio: 4/3; }
.bk-estado-badge{ display:inline-block; padding:6px 16px; background:var(--bk-negro); color:#fff; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom: 20px; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1024px){
	.bk-split, .bk-contact-grid{ grid-template-columns: 1fr; gap:50px; }
	.bk-proceso{ grid-template-columns: repeat(2,1fr); gap:36px; }
	.bk-beneficios, .bk-testimonios{ grid-template-columns: repeat(2,1fr); }
	.bk-footer-grid{ grid-template-columns: 1fr 1fr; }
	.bk-valores{ grid-template-columns: repeat(2,1fr); }
	.bk-servicio{ grid-template-columns: 1fr; gap:20px; }
	.bk-proyecto-meta{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 782px){
	.bk-nav{ position:fixed; top:0; right:0; height:100vh; width:78%; max-width:340px; background:var(--bk-negro); padding:120px 40px; transform: translateX(100%); transition: var(--bk-transition); z-index:998; }
	.bk-nav.is-open{ transform: translateX(0); }
	.bk-nav ul{ flex-direction:column; gap:26px; }
	.bk-nav a{ color:#fff; font-size:1rem; }
	.bk-menu-toggle{ display:block; }
	.bk-header-cta .bk-btn{ display:none; }
	section{ padding: 80px 0; }
	.bk-hero-content{ padding: 140px 0 70px; }
	.bk-hero-logo{ width:96px; margin-bottom:28px; }
	.bk-proceso{ grid-template-columns: 1fr; }
	.bk-beneficios, .bk-testimonios{ grid-template-columns: 1fr; }
	.bk-proyectos-grid{ grid-template-columns: 1fr 1fr; }
	.bk-footer-grid{ grid-template-columns: 1fr; gap:34px; }
	.bk-valores{ grid-template-columns: 1fr; }
	.bk-proyecto-meta{ grid-template-columns: 1fr 1fr; }
	.bk-proyecto-gallery{ grid-template-columns: 1fr; }
	.bk-form{ grid-template-columns: 1fr; }
	.bk-container{ padding: 0 20px; }
}
@media (max-width: 480px){
	.bk-proyectos-grid{ grid-template-columns: 1fr; }
}