/* ==========================================================================
   Paulina Basch — Terapia · Psicanálise
   ========================================================================== */

:root {
	--color-navy: #283D57;
	--color-navy-dark: #0B131E;
	--color-blue: #2D668C;
	--color-blue-light: #5886BF;
	--color-blue-bright: #166AD3;
	--color-gold: #F5D27A;
	--color-text: #404957;
	--color-text-light: #5C738F;
	--color-bg: #FFFFFF;
	--color-bg-soft: #F5F9FF;
	--color-bg-soft2: #ECEFF5;
	--color-border: #CFD2D5;

	--font-heading: "Lora", serif;
	--font-body: "Lato", sans-serif;

	--container: 1200px;
	--radius: 10px;
	--transition: 0.3s ease;
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--color-text);
	background: var(--color-bg);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3 { font-family: var(--font-heading); color: var(--color-navy); font-weight: 600; margin: 0 0 20px; line-height: 1.25; }
p { margin: 0 0 16px; }
.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }

.eyebrow {
	display: block;
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2.5px;
	color: var(--color-blue);
	text-transform: uppercase;
	margin-bottom: 14px;
}
.eyebrow.center { text-align: center; }

/* ---- Buttons ---- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px 32px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	border-radius: 4px;
	white-space: nowrap;
	transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}
.btn-primary {
	background: var(--color-blue);
	color: #fff;
}
.btn-primary:hover {
	background: var(--color-navy);
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(40, 61, 87, 0.25);
}

/* ---- Icons (inline SVG via mask, no external deps) ---- */
.icon {
	display: inline-block;
	width: 18px;
	height: 18px;
	background-color: currentColor;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	flex-shrink: 0;
}
.icon-facebook  { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 12a10 10 0 1 0-11.6 9.9v-7H7.9V12h2.5V9.8c0-2.5 1.5-3.9 3.8-3.9 1.1 0 2.2.2 2.2.2v2.4h-1.2c-1.2 0-1.6.8-1.6 1.6V12h2.8l-.4 2.9h-2.4v7A10 10 0 0 0 22 12Z'/%3E%3C/svg%3E"); }
.icon-instagram { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2c3.2 0 3.6 0 4.9.1 1.2.1 2 .3 2.4.5.6.2 1 .5 1.5 1 .4.4.7.9 1 1.5.2.5.4 1.2.5 2.4.1 1.3.1 1.7.1 4.9s0 3.6-.1 4.9c-.1 1.2-.3 2-.5 2.4-.3.6-.6 1-1 1.5-.4.4-.9.7-1.5 1-.5.2-1.2.4-2.4.5-1.3.1-1.7.1-4.9.1s-3.6 0-4.9-.1c-1.2-.1-2-.3-2.4-.5-.6-.3-1-.6-1.5-1-.4-.4-.7-.9-1-1.5-.2-.5-.4-1.2-.5-2.4C2 15.6 2 15.2 2 12s0-3.6.1-4.9c.1-1.2.3-2 .5-2.4.3-.6.6-1 1-1.5.4-.4.9-.7 1.5-1 .5-.2 1.2-.4 2.4-.5C8.4 2.2 8.8 2.2 12 2.2Zm0 1.8c-3.1 0-3.5 0-4.7.1-1 .1-1.6.2-2 .4-.5.2-.8.4-1.2.8-.4.4-.6.7-.8 1.2-.1.4-.3 1-.4 2C3 9.5 3 9.9 3 13s0 3.5.1 4.7c.1 1 .2 1.6.4 2 .2.5.4.8.8 1.2.4.4.7.6 1.2.8.4.1 1 .3 2 .4 1.2.1 1.6.1 4.7.1s3.5 0 4.7-.1c1-.1 1.6-.2 2-.4.5-.2.8-.4 1.2-.8.4-.4.6-.7.8-1.2.1-.4.3-1 .4-2 .1-1.2.1-1.6.1-4.7s0-3.5-.1-4.7c-.1-1-.2-1.6-.4-2-.2-.5-.4-.8-.8-1.2-.4-.4-.7-.6-1.2-.8-.4-.1-1-.3-2-.4C15.5 4 15.1 4 12 4Zm0 3.4a5.6 5.6 0 1 1 0 11.2 5.6 5.6 0 0 1 0-11.2Zm0 1.8a3.8 3.8 0 1 0 0 7.6 3.8 3.8 0 0 0 0-7.6Zm5.8-2a1.3 1.3 0 1 1 0 2.6 1.3 1.3 0 0 1 0-2.6Z'/%3E%3C/svg%3E"); }
.icon-twitter   { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 5.9c-.7.3-1.5.6-2.3.7a4 4 0 0 0 1.8-2.2c-.8.5-1.6.8-2.6 1a4 4 0 0 0-6.9 3.7A11.4 11.4 0 0 1 3.7 4.9a4 4 0 0 0 1.3 5.4c-.7 0-1.3-.2-1.9-.5v.1a4 4 0 0 0 3.3 4 4 4 0 0 1-1.9.1 4 4 0 0 0 3.8 2.8A8 8 0 0 1 2 18.5a11.3 11.3 0 0 0 6.2 1.8c7.4 0 11.5-6.2 11.5-11.5v-.5c.8-.6 1.5-1.3 2-2.2Z'/%3E%3C/svg%3E"); }
.icon-youtube   { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M23 12s0-3.4-.4-5a2.9 2.9 0 0 0-2-2C18.9 4.5 12 4.5 12 4.5s-6.9 0-8.6.5a2.9 2.9 0 0 0-2 2C1 8.6 1 12 1 12s0 3.4.4 5a2.9 2.9 0 0 0 2 2c1.7.5 8.6.5 8.6.5s6.9 0 8.6-.5a2.9 2.9 0 0 0 2-2c.4-1.6.4-5 .4-5ZM9.8 15.5v-7l6 3.5-6 3.5Z'/%3E%3C/svg%3E"); }
.icon-linkedin  { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.9 8.4H3.6V20h3.3V8.4ZM5.3 3.6a2 2 0 1 0 0 3.9 2 2 0 0 0 0-3.9ZM20.4 20h-3.3v-6.2c0-1.5-.5-2.5-1.8-2.5-1 0-1.6.7-1.9 1.3-.1.2-.1.6-.1.9V20H10s0-10.6 0-11.6h3.3v1.6c.4-.7 1.2-1.7 3-1.7 2.2 0 3.9 1.5 3.9 4.6V20Z'/%3E%3C/svg%3E"); }
.icon-phone     { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.7 3.6 4.9 6.3 6.3l2.1-2.1c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.9 21 3 13.1 3 3.4c0-.6.4-1 1-1h3.6c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1L6.6 10.8Z'/%3E%3C/svg%3E"); }
.icon-whatsapp  { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2Zm5.8 14.2c-.2.6-1.3 1.2-1.8 1.3-.5.1-1 .1-1.6-.1-.4-.1-.9-.3-1.5-.6-2.7-1.2-4.5-3.9-4.6-4.1-.1-.2-1.1-1.5-1.1-2.8 0-1.3.7-2 .9-2.2.2-.2.5-.3.7-.3h.5c.2 0 .4 0 .6.4.2.5.7 1.8.8 1.9.1.2.1.4 0 .6-.1.2-.2.3-.3.5-.2.2-.3.3-.5.5-.2.2-.4.4-.2.7.2.4.9 1.5 2 2.4 1.3 1.2 2.4 1.5 2.8 1.7.4.2.6.1.8-.1.2-.2.9-1 1.1-1.4.2-.4.4-.3.7-.2.3.1 1.8.9 2.1 1 .3.2.5.2.6.4.1.2.1.9-.1 1.5Z'/%3E%3C/svg%3E"); }
.icon-mail      { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1Zm1.4 2 7.6 6.2L19.6 7H4.4ZM4 8.2V17h16V8.2l-8 6.5-8-6.5Z'/%3E%3C/svg%3E"); }
.icon-pin       { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.3 7 13 7 13s7-7.7 7-13a7 7 0 0 0-7-7Zm0 9.7a2.7 2.7 0 1 1 0-5.4 2.7 2.7 0 0 1 0 5.4Z'/%3E%3C/svg%3E"); }
.icon-arrow-up  { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4 4 12l1.4 1.4L11 8v12h2V8l5.6 5.4L20 12Z'/%3E%3C/svg%3E"); }
.icon-close     { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' stroke='%23fff' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); }
.icon-chevron-left  { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 4 7 12l8 8' stroke='%23fff' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.icon-chevron-right { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 4l8 8-8 8' stroke='%23fff' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.icon { mask-image: var(--svg); -webkit-mask-image: var(--svg); }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
	position: sticky;
	top: 0;
	z-index: 200;
	background: #fff;
	box-shadow: 0 2px 20px rgba(11, 19, 30, 0.06);
}
.header-inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: 16px 24px;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 20px;
}
.social-list { display: flex; gap: 16px; }
.social-list a {
	color: var(--color-blue);
	transition: color var(--transition);
}
.social-list a:hover { color: var(--color-navy); }
.logo { justify-self: center; }
.logo img { height: 42px; width: auto; }
.header-right {
	justify-self: end;
	display: flex;
	align-items: center;
	gap: 28px;
}
.header-phone {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 700;
	color: var(--color-navy);
	white-space: nowrap;
}
.header-phone .icon { color: var(--color-blue-light); }

.mobile-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 32px;
	height: 32px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}
.mobile-toggle span {
	display: block;
	height: 2px;
	width: 100%;
	background: var(--color-navy);
	transition: transform var(--transition), opacity var(--transition);
}
.mobile-panel {
	display: none;
	flex-direction: column;
	gap: 18px;
	padding: 20px 24px 26px;
	border-top: 1px solid var(--color-bg-soft2);
}
.mobile-panel .social-list { gap: 20px; }
.mobile-panel .btn { width: 100%; }

.site-header.is-open .mobile-panel { display: flex; }
.site-header.is-open .mobile-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-header.is-open .mobile-toggle span:nth-child(2) { opacity: 0; }
.site-header.is-open .mobile-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
	position: relative;
	min-height: 640px;
	display: flex;
	align-items: center;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(255,255,255,0.4) 20%, rgba(40,61,87,0.7) 100%);
}
.hero .container {
	position: relative;
	z-index: 1;
	width: 100%;
}
.hero-content {
	max-width: 240px;
	text-align: left;
}
.hero-title {
	color: #fff;
	font-size: clamp(38px, 5.5vw, 58px);
	margin-bottom: 18px;
}
.hero .eyebrow { color: #000; }
.hero-subtitle {
	color: #fff;
	font-size: 18px;
	max-width: 420px;
	margin-bottom: 32px;
}
/* ==========================================================================
   About
   ========================================================================== */
.about {
	padding: 110px 0;
	position: relative;
}
.about-decor {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
}
.about-decor::before,
.about-decor::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
}
.about-decor::before {
	top: -90px;
	left: -140px;
	width: 480px;
	height: 320px;
	background-image: url("../images/texture_right1-gold.svg");
	transform: scaleX(-1);
}
.about-decor::after {
	bottom: -80px;
	right: -150px;
	width: 520px;
	height: 240px;
	background-image: url("../images/texture_left1-gold.svg");
	transform: scaleX(-1);
}
.about-grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 60px;
	align-items: start;
}
.about-text h2 { font-size: clamp(26px, 3vw, 36px); max-width: 100%; margin-bottom: 30px; }
.about-columns {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
}
.about-columns p { font-size: 15px; }
.about-photo {
	position: sticky;
	top: 110px;
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: 0 30px 60px rgba(11, 19, 30, 0.15);
}
.about-photo img { width: 100%; height: 100%; object-fit: cover; }

/* ==========================================================================
   CV / Trajetória
   ========================================================================== */
.cv {
	padding: 110px 0;
	background: #FEFAF1;
	position: relative;
	overflow: hidden;
}
.cv::before,
.cv::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}
.cv::before {
	top: -90px;
	left: -140px;
	width: 480px;
	height: 320px;
	background-image: url("../images/texture_right1-blue.svg");
	transform: scaleX(-1);
}
.cv::after {
	bottom: -80px;
	right: -150px;
	width: 520px;
	height: 240px;
	background-image: url("../images/texture_left1-blue.svg");
	transform: scaleX(-1);
}
.cv-header, .cv-grid { position: relative; z-index: 1; }
.cv-header { text-align: center; max-width: 640px; margin: 0 auto 64px; }
.cv-header h2 { font-size: clamp(28px, 3.5vw, 40px); margin-bottom: 10px; }
.cv-header p { color: #000; font-size: 14px; margin: 0; }
.cv-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 70px;
}
.cv-grid-single {
	grid-template-columns: 1fr;
	max-width: 620px;
	margin: 0 auto;
}
.timeline {
	position: relative;
}
.timeline-list {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0;
	list-style: none;
}
.timeline-svg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	pointer-events: none;
	overflow: visible;
}
.timeline-line {
	fill: none;
	stroke: var(--color-border);
	stroke-width: 2;
	stroke-linejoin: round;
	stroke-linecap: round;
}
.timeline-item {
	position: relative;
	z-index: 1;
	padding-left: 32px;
	padding-bottom: 34px;
	margin-left: calc(var(--i, 0) * 26px);
	transition: margin-left 0.2s ease;
}
.timeline-item:last-child { padding-bottom: 0; }
.timeline-dot {
	position: absolute;
	top: 4px;
	left: 0;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--color-gold);
	border: 3px solid #fff;
	box-shadow: 0 0 0 2px var(--color-border);
	z-index: 2;
}
.timeline-year {
	display: block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--color-blue);
	margin-bottom: 6px;
}
.timeline-item h4 {
	font-family: var(--font-heading);
	color: var(--color-navy);
	font-size: 17px;
	font-weight: 600;
	margin: 0 0 4px;
	line-height: 1.35;
}
.timeline-place {
	font-size: 13.5px;
	color: var(--color-text-light);
	margin: 0;
	line-height: 1.5;
}
.timeline-skills {
	font-size: 12.5px;
	color: var(--color-text-light);
	margin: 4px 0 0;
	line-height: 1.5;
}
.timeline-skills strong { color: var(--color-navy); font-weight: 600; }

/* ==========================================================================
   Services strip
   ========================================================================== */
.services-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}
.service-card {
	position: relative;
	min-height: 340px;
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}
.service-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(11,19,30,0.15) 0%, rgba(11,19,30,0.85) 100%);
	transition: background var(--transition);
}
.service-card:hover::before { background: linear-gradient(180deg, rgba(45,102,140,0.35) 0%, rgba(11,19,30,0.9) 100%); }
.service-card-inner {
	position: relative;
	z-index: 1;
	padding: 32px 28px;
	color: #fff;
}
.service-card h3 {
	color: #fff;
	font-size: 22px;
	margin-bottom: 0;
	transition: margin var(--transition);
}
.service-card p {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	font-size: 14px;
	margin: 0;
	transition: max-height var(--transition), opacity var(--transition), margin var(--transition);
}
.service-link {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--color-gold);
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height var(--transition), opacity var(--transition), margin var(--transition);
}
.service-card:hover h3 { margin-bottom: 12px; }
.service-card:hover p { max-height: 80px; opacity: 1; margin-bottom: 14px; }
.service-card:hover .service-link { max-height: 30px; opacity: 1; margin-top: 4px; }

/* ==========================================================================
   Winnicott
   ========================================================================== */
.winnicott {
	padding: 110px 0;
	background-color: var(--color-bg-soft);
	position: relative;
	overflow: hidden;
}
.winnicott::before,
.winnicott::after {
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	pointer-events: none;
}
.winnicott::before {
	top: -70px;
	right: -90px;
	width: 460px;
	height: 300px;
	background-image: url("../images/texture_right1-gold.svg");
}
.winnicott::after {
	bottom: -60px;
	left: -110px;
	width: 520px;
	height: 240px;
	background-image: url("../images/texture_left1-gold.svg");
}
.winnicott-content { position: relative; z-index: 1; max-width: 900px; margin: 0 auto; text-align: center; }
.winnicott-content h2 { font-size: clamp(28px, 3.5vw, 40px); }
.winnicott-content p { text-align: left; font-size: 15px; }

/* ==========================================================================
   Quote carousel
   ========================================================================== */
.quotes {
	padding: 100px 0;
	background-color: var(--color-bg-soft);
	background-image: url("../images/texture2-gold.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	text-align: center;
}
.quote-carousel { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; }
.quote-icon { margin: 0 auto 24px; opacity: 0.85; }
.quote-track {
	position: relative;
	min-height: 190px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.quote-slide {
	margin: 0;
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.5s ease, transform 0.5s ease, visibility 0.5s;
}
.quote-slide.is-active { opacity: 1; visibility: visible; transform: translateY(0); }
.quote-slide p {
	font-family: var(--font-heading);
	font-style: italic;
	font-size: clamp(20px, 2.6vw, 28px);
	color: var(--color-navy);
	line-height: 1.5;
}
.quote-slide cite {
	display: block;
	margin-top: 16px;
	font-style: normal;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--color-blue);
}
.quote-dots { display: flex; justify-content: center; gap: 10px; margin-top: 30px; }
.quote-dots button {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: none;
	background: var(--color-border);
	cursor: pointer;
	padding: 0;
	transition: background var(--transition), transform var(--transition);
}
.quote-dots button.is-active { background: var(--color-blue); transform: scale(1.2); }

/* ==========================================================================
   Gallery
   ========================================================================== */
.gallery-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
}
.gallery-item { display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.gallery-item:hover img { transform: scale(1.08); }

/* ==========================================================================
   Contact
   ========================================================================== */
.contact { padding: 110px 0; background: var(--color-navy); }
.contact-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: stretch;
}
.contact-text h2 { color: #fff; font-size: clamp(26px, 3vw, 36px); }
.contact-text .eyebrow { color: var(--color-gold); }
.contact-text p { color: #C4CCDA; font-size: 15px; max-width: 460px; }
.contact-list { margin: 30px 0; display: flex; flex-direction: column; gap: 16px; }
.contact-list a {
	display: flex;
	align-items: center;
	gap: 14px;
	color: #fff;
	font-size: 15px;
}
.contact-list .icon { color: var(--color-gold); width: 20px; height: 20px; }
.contact-list a span { transition: opacity var(--transition); }
.contact-list a:hover span { opacity: 0.75; }
.contact-linkedin {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: rgba(255,255,255,0.1);
	color: #fff;
}
.contact-linkedin:hover { background: var(--color-blue); }
.contact-map { border-radius: var(--radius); overflow: hidden; min-height: 340px; }
.contact-map iframe { width: 100%; height: 100%; min-height: 340px; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer {
	padding: 26px 0;
	background: var(--color-navy-dark);
	text-align: center;
}
.site-footer p { margin: 0; color: #A4ADBD; font-size: 14px; }
.site-footer a { color: #fff; font-weight: 700; }
.site-footer a:hover { color: var(--color-gold); }

/* ==========================================================================
   Lightbox
   ========================================================================== */
.lightbox {
	position: fixed;
	inset: 0;
	z-index: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(11, 19, 30, 0.92);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}
.lightbox.is-open { opacity: 1; visibility: visible; }
.lightbox-figure {
	margin: 0;
	max-width: min(90vw, 1100px);
	max-height: 86vh;
	display: flex;
}
.lightbox-figure img {
	max-width: 100%;
	max-height: 86vh;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 6px;
	box-shadow: 0 30px 70px rgba(0, 0, 0, 0.5);
	opacity: 0;
	transform: scale(0.97);
	transition: opacity 0.25s ease, transform 0.25s ease;
}
.lightbox-figure img.is-loaded { opacity: 1; transform: scale(1); }
.lightbox-close {
	position: absolute;
	top: 22px;
	right: 24px;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background var(--transition);
}
.lightbox-close:hover { background: rgba(255, 255, 255, 0.2); }
.lightbox-close .icon { width: 18px; height: 18px; color: #fff; }
.lightbox-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background var(--transition);
}
.lightbox-nav:hover { background: rgba(255, 255, 255, 0.2); }
.lightbox-nav .icon { width: 22px; height: 22px; color: #fff; }
.lightbox-prev { left: 20px; }
.lightbox-next { right: 20px; }
.lightbox-count {
	position: absolute;
	bottom: 22px;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.75);
	font-size: 13px;
	letter-spacing: 1px;
}

@media (max-width: 600px) {
	.lightbox-nav { width: 42px; height: 42px; }
	.lightbox-prev { left: 8px; }
	.lightbox-next { right: 8px; }
	.lightbox-close { top: 12px; right: 12px; }
}

/* ==========================================================================
   Floating buttons
   ========================================================================== */
.whatsapp-float {
	position: fixed;
	bottom: 24px;
	left: 24px;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #25D366;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 10px 24px rgba(37, 211, 102, 0.4);
	z-index: 150;
	transition: transform var(--transition);
}
.whatsapp-float .icon { width: 28px; height: 28px; color: #fff; }
.whatsapp-float:hover { transform: scale(1.08); }

.back-to-top {
	position: fixed;
	bottom: 24px;
	right: 24px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--color-navy);
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
	z-index: 150;
}
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top .icon { color: #fff; width: 18px; height: 18px; }

/* ==========================================================================
   Loader
   ========================================================================== */
.pxl-loader {
	position: fixed;
	inset: 0;
	background: #fff;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.4s ease, visibility 0.4s ease;
}
.pxl-loader span {
	width: 40px;
	height: 40px;
	border: 3px solid var(--color-bg-soft2);
	border-top-color: var(--color-blue);
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}
.pxl-loader.is-hidden { opacity: 0; visibility: hidden; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1024px) {
	.about-grid { grid-template-columns: 1fr; }
	.about-photo { position: static; max-width: 420px; margin: 0 auto; }
	.services-grid { grid-template-columns: repeat(2, 1fr); }
	.gallery-grid { grid-template-columns: repeat(3, 1fr); }
	.contact-grid { grid-template-columns: 1fr; }
	.contact-map { min-height: 280px; }
}

@media (max-width: 780px) {
	.header-inner { grid-template-columns: auto 1fr auto; padding: 14px 20px; }
	.social-list.header-only-desktop,
	.header-right { display: none; }
	.header-inner .social-list { display: none; }
	.logo { justify-self: start; }
	.mobile-toggle { display: flex; }

	.hero { min-height: 520px; text-align: left; }
	.about, .winnicott, .quotes, .contact, .cv { padding: 70px 0; }
	.about-columns { grid-template-columns: 1fr; }
	.cv-grid { grid-template-columns: 1fr; gap: 50px; }
	.cv-header { margin-bottom: 44px; }
	.timeline-item { margin-left: calc(var(--i, 0) * 10px) !important; }
	.cv::before { width: 280px; height: 190px; top: -50px; left: -80px; }
	.cv::after { width: 300px; height: 150px; bottom: -40px; right: -80px; }
	.services-grid { grid-template-columns: 1fr 1fr; }
	.service-card { min-height: 220px; }
	.gallery-grid { grid-template-columns: repeat(2, 1fr); }
	.winnicott::before { width: 280px; height: 180px; top: -40px; right: -60px; }
	.winnicott::after { width: 300px; height: 140px; bottom: -30px; left: -70px; }
	.about-decor::before { width: 280px; height: 190px; top: -50px; left: -80px; }
	.about-decor::after { width: 300px; height: 150px; bottom: -40px; right: -80px; }
}

@media (max-width: 480px) {
	.services-grid { grid-template-columns: 1fr; }
	.gallery-grid { grid-template-columns: repeat(2, 1fr); }
	.hero-title { font-size: 34px; }
	.btn { padding: 14px 24px; }
}