/*
Theme Name: Lodiz
Theme URI: https://example.com/lodiz
Author: Studio
Author URI: https://example.com
Description: An original WordPress theme for architecture & interior design studios — full-bleed hero, filterable portfolio, team, testimonials and a manageable admin (Projects, Team, Testimonials, Services custom post types). Inspired by the visual language of modern architecture-studio portfolio sites; not a copy of any commercial template.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lodiz
*/

/* ==========================================================================
   1. Variables & reset
   ========================================================================== */
:root{
	--ink:#17130f;
	--paper:#f7f4ee;
	--paper-alt:#efeae1;
	--muted:#6d6a63;
	--line:#ddd7c9;
	--accent:#a1793f;
	--accent-dark:#7f5f30;
	--white:#ffffff;
	--font-display:'Fraunces', Georgia, 'Times New Roman', serif;
	--font-body:'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
	--container:1280px;
	--radius:2px;
	--ease:cubic-bezier(.16,.84,.44,1);
	--rail-left:170px;
	--rail-right:84px;
	--gold:#cb9a3d;
	--gold-dark:#a97c2c;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; }
body{
	margin:0;
	font-family:var(--font-body);
	color:var(--ink);
	background:var(--paper);
	line-height:1.6;
	font-size:16px;
	-webkit-font-smoothing:antialiased;
	overflow-x:hidden;
}
img{ max-width:100%; display:block; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:500; line-height:1.15; margin:0 0 .5em; letter-spacing:-0.01em; }
h1{ font-size:clamp(2.4rem,5vw,4.4rem); }
h2{ font-size:clamp(1.9rem,3.6vw,3rem); }
h3{ font-size:1.35rem; }
p{ margin:0 0 1em; color:var(--muted); }
button{ font-family:var(--font-body); cursor:pointer; background:none; border:none; color:inherit; }
input, textarea{ font-family:var(--font-body); font-size:1rem; }
.container{ max-width:var(--container); margin:0 auto; padding:0 1.5rem; }

/* ==========================================================================
   2. Reveal-on-scroll
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ==========================================================================
   3. Buttons & links
   ========================================================================== */
.btn{
	display:inline-flex; align-items:center; gap:.5rem;
	padding:.95rem 2rem; border-radius:var(--radius);
	font-size:.85rem; letter-spacing:.06em; text-transform:uppercase;
	transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
	border:1px solid transparent; white-space:nowrap;
}
.btn--fill{ background:var(--ink); color:var(--paper); }
.btn--fill:hover{ background:var(--accent); }
.btn--outline{ border-color:var(--ink); color:var(--ink); }
.btn--outline:hover{ background:var(--ink); color:var(--paper); }
.btn--ghost-light{ border-color:rgba(255,255,255,.5); color:#fff; }
.btn--ghost-light:hover{ background:#fff; color:var(--ink); }
.btn--gold{ background:var(--gold); color:var(--ink); }
.btn--gold:hover{ background:#fff; }
.btn--nav{ padding:.7rem 1.4rem; }

.text-link{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600; border-bottom:1px solid currentColor; padding-bottom:2px; }
.text-link span{ transition:transform .3s var(--ease); }
.text-link:hover span{ transform:translateX(4px); }

.eyebrow{ font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); font-weight:600; margin-bottom:.9rem; }

.section-head{ max-width:640px; margin:0 auto 3rem; text-align:center; }
.section-head--split{ display:flex; justify-content:space-between; align-items:flex-end; max-width:none; text-align:left; margin-bottom:2.5rem; gap:2rem; flex-wrap:wrap; }

/* ==========================================================================
   4. Side rails, header / navigation, nav overlay
   ========================================================================== */
.side-rail{
	position:fixed; top:0; bottom:0; z-index:120; display:flex; flex-direction:column; align-items:center;
	color:#fff;
}
.side-rail--left{
	left:0; width:var(--rail-left); background:var(--ink);
	background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.02) 0 2px, transparent 2px 14px);
	justify-content:space-between; padding:2rem 0 2.2rem;
}
.side-rail__accent{ width:14px; height:14px; background:var(--gold); align-self:flex-start; margin-left:2rem; }
.side-rail__contact{ display:flex; flex-direction:column; align-items:center; gap:2.5rem; }
.side-rail__item{
	writing-mode:vertical-rl; transform:rotate(180deg); display:flex; align-items:center; gap:.8rem;
	font-size:.72rem; letter-spacing:.12em; color:rgba(255,255,255,.7); transition:color .3s var(--ease);
}
.side-rail__item:hover{ color:var(--gold); }
.side-rail__item svg{ width:16px; height:16px; flex-shrink:0; }
.side-rail__tagline{ display:flex; gap:1.5rem; align-items:center; justify-content:center; flex:1; }
.side-rail__line{
	writing-mode:vertical-rl; transform:rotate(180deg); font-size:.72rem; letter-spacing:.22em;
	text-transform:uppercase; white-space:nowrap;
}
.side-rail__line--muted{ color:rgba(255,255,255,.45); }
.side-rail__totop{ width:34px; height:34px; border:1px solid rgba(255,255,255,.25); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; transition:.3s var(--ease); }
.side-rail__totop:hover{ background:var(--gold); border-color:var(--gold); }
.side-rail__totop svg{ width:16px; height:16px; }

.side-rail--right{ right:0; width:var(--rail-right); background:var(--gold); justify-content:space-between; padding:2.2rem 0; }
.side-rail__socials{ display:flex; flex-direction:column; align-items:center; gap:.9rem; }
.side-rail__social{ width:36px; height:36px; border-radius:50%; background:#fff; color:var(--gold-dark); display:flex; align-items:center; justify-content:center; transition:.3s var(--ease); }
.side-rail__social svg{ width:15px; height:15px; }
.side-rail__social:hover{ background:var(--ink); color:#fff; }
.side-rail__copyright{
	writing-mode:vertical-rl; transform:rotate(180deg); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
	color:rgba(23,19,15,.65);
}

.site{ margin-left:var(--rail-left); margin-right:var(--rail-right); position:relative; }

.site-header{
	position:fixed; top:0; left:var(--rail-left); z-index:100; background:var(--ink);
	transition:background .4s var(--ease);
}
.site-header__inner{ padding:1.8rem 2.5rem; display:flex; align-items:center; gap:2.5rem; }
.site-title{ font-family:var(--font-display); font-size:1.4rem; font-weight:600; color:#fff; letter-spacing:.04em; }
.custom-logo-link img{ max-height:46px; width:auto; }
.menu-toggle{ display:flex; align-items:center; gap:.9rem; margin-left:auto; color:#fff; }
.menu-toggle__label{ font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; }
.menu-toggle__icon{ display:flex; flex-direction:column; gap:5px; width:26px; }
.menu-toggle__icon span{ display:block; height:2px; background:#fff; transition:transform .3s var(--ease), opacity .3s var(--ease); }
.menu-toggle.is-active .menu-toggle__icon span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-toggle.is-active .menu-toggle__icon span:nth-child(2){ opacity:0; }
.menu-toggle.is-active .menu-toggle__icon span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.nav-overlay{
	position:fixed; inset:0; left:var(--rail-left); right:var(--rail-right); z-index:110; background:rgba(15,13,10,.98);
	display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2.5rem;
	opacity:0; visibility:hidden; transform:translateY(-12px); transition:opacity .4s var(--ease), transform .4s var(--ease), visibility .4s;
}
.nav-overlay.is-open{ opacity:1; visibility:visible; transform:none; }
.nav-overlay__close{ position:absolute; top:2rem; right:2.5rem; font-size:2rem; line-height:1; color:#fff; }
.nav-overlay .nav-menu{ display:flex; flex-direction:column; align-items:center; gap:1.4rem; }
.nav-overlay .nav-menu a{ color:#fff; font-family:var(--font-display); font-size:clamp(1.6rem,4vw,2.6rem); transition:color .3s var(--ease); }
.nav-overlay .nav-menu a:hover{ color:var(--gold); }

@media (max-width: 1100px){
	.side-rail{ display:none; }
	.site{ margin-left:0; margin-right:0; }
	.site-header{ left:0; right:0; }
	.site-header__inner{ padding:1.2rem 1.5rem; }
	.nav-overlay{ left:0; right:0; }
}

/* ==========================================================================
   5. Hero
   ========================================================================== */
.hero{
	position:relative; min-height:100vh; display:flex; flex-direction:column; justify-content:center;
	color:#fff; overflow:hidden;
}
.hero__slides{ position:absolute; inset:0; background:linear-gradient(135deg,#2b2620,#4a3f30); }
.hero-slide{
	position:absolute; inset:0; background-position:center; background-size:cover; background-repeat:no-repeat;
	opacity:0; transform:scale(1.08); transition:opacity 1.4s var(--ease), transform 7s linear;
}
.hero-slide.is-active{ opacity:1; transform:scale(1); }
.hero__scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(15,13,10,.6) 0%, rgba(15,13,10,.4) 45%, rgba(15,13,10,.8) 100%); }
.hero__inner{ position:relative; z-index:2; width:100%; padding:8rem 3rem 6rem; }
.hero .eyebrow{ color:var(--gold); letter-spacing:.28em; }
.hero__title{ display:flex; flex-direction:column; gap:.1em; }
.hero__title-line{ text-transform:uppercase; letter-spacing:.02em; }
.hero__title-line--outline{ color:transparent; -webkit-text-stroke:1.5px var(--gold); text-stroke:1.5px var(--gold); }
.hero__actions{ display:flex; align-items:center; gap:2rem; margin-top:2.2rem; flex-wrap:wrap; }
.text-link--light{ color:#fff; border-bottom-color:rgba(255,255,255,.5); font-weight:500; letter-spacing:.05em; text-transform:uppercase; font-size:.85rem; }
.text-link--light:hover{ color:var(--gold); border-bottom-color:var(--gold); }

.hero__bar{
	position:absolute; z-index:2; left:0; right:0; bottom:0; display:flex; align-items:center; gap:2.5rem; padding:1.6rem 2.5rem;
	border-top:1px solid rgba(255,255,255,.15); background:rgba(0,0,0,.2); flex-wrap:wrap;
}
.hero__progress{ display:flex; gap:.5rem; }
.hero__progress-seg{ width:34px; height:3px; background:rgba(255,255,255,.3); transition:.3s var(--ease); }
.hero__progress-seg.is-active{ background:var(--gold); }
.hero__counter{ font-size:.85rem; letter-spacing:.05em; color:rgba(255,255,255,.85); }
.hero__category{ font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-right:auto; }
.hero__nav-buttons{ display:flex; gap:1.6rem; }
.hero__nav-btn{ font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:#fff; transition:color .3s var(--ease); }
.hero__nav-btn:hover{ color:var(--gold); }

@media (max-width: 640px){
	.hero__bar{ gap:1rem; padding:1.2rem 1.5rem; }
	.hero__category{ order:4; width:100%; margin-right:0; }
}

/* ==========================================================================
   6. About
   ========================================================================== */
.about{ padding:7rem 0; }
.about__inner{ display:grid; grid-template-columns:1fr 1.1fr; gap:4.5rem; align-items:center; }
.about__media{ position:relative; }
.about__media img, .about__placeholder{ border-radius:var(--radius); aspect-ratio:4/5; object-fit:cover; }
.about__placeholder{ background:linear-gradient(135deg,var(--paper-alt),var(--line)); width:100%; }
.about__badge{
	position:absolute; bottom:-1.5rem; right:-1.5rem; background:var(--ink); color:var(--paper);
	width:130px; height:130px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center;
	font-family:var(--font-display); font-size:1.9rem;
}
.about__badge small{ font-family:var(--font-body); font-size:.62rem; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); margin-top:.3rem; text-align:center; padding:0 1rem; }
.stats-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:2.5rem; padding-top:2rem; border-top:1px solid var(--line); }
.stat__num{ display:block; font-family:var(--font-display); font-size:1.9rem; color:var(--ink); }
.stat__label{ font-size:.78rem; color:var(--muted); }

.about-hero{ position:relative; min-height:50vh; display:flex; align-items:flex-end; color:#fff; overflow:hidden; padding-bottom:4rem; }
.about-hero__media{ position:absolute; inset:0; background:var(--hero-image, linear-gradient(135deg,#2b2620,#4a3f30)) center/cover no-repeat; }
.about-hero__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,13,10,.55) 0%, rgba(15,13,10,.5) 40%, rgba(15,13,10,.9) 100%); }
.about-hero__inner{ position:relative; z-index:2; width:100%; padding:8rem 3rem 0; }
.about-hero .eyebrow{ color:var(--gold); }
.about-hero h1{ color:#fff; max-width:20ch; }
.about-hero__sub{ max-width:50ch; color:rgba(255,255,255,.8); font-size:1.05rem; }

.founder{ padding:7rem 0; background:var(--paper-alt); }
.founder__inner{ display:grid; grid-template-columns:.85fr 1.15fr; gap:4.5rem; align-items:center; }
.founder__media img, .founder__placeholder{ border-radius:var(--radius); aspect-ratio:4/5; object-fit:cover; width:100%; }
.founder__placeholder{ background:linear-gradient(135deg,var(--line),var(--paper-alt)); }
.founder__title{ color:var(--accent); font-weight:600; margin-bottom:1.2rem; }
.founder__bio{ max-width:56ch; }

/* ==========================================================================
   7. Services
   ========================================================================== */
.services{ padding:7rem 0; background:var(--paper-alt); }
.service-row{
	display:grid; grid-template-columns:80px 1fr 1.4fr; gap:2rem; align-items:baseline;
	padding:2rem 0; border-top:1px solid var(--line);
}
.services__list .service-row:last-child{ border-bottom:1px solid var(--line); }
.service-row__index{ font-family:var(--font-display); font-size:1.1rem; color:var(--accent); }
.service-row__title{ margin:0; }
.service-row__excerpt{ margin:0; }

/* ==========================================================================
   8. Portfolio
   ========================================================================== */
.projects-hero{ position:relative; min-height:56vh; display:flex; align-items:flex-end; color:#fff; overflow:hidden; padding-bottom:4.5rem; }
.projects-hero__media{ position:absolute; inset:0; background:var(--hero-image, linear-gradient(135deg,#2b2620,#4a3f30)) center/cover no-repeat; }
.projects-hero__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,13,10,.55) 0%, rgba(15,13,10,.5) 40%, rgba(15,13,10,.9) 100%); }
.projects-hero__inner{ position:relative; z-index:2; width:100%; padding:8rem 3rem 0; }
.projects-hero .eyebrow{ color:var(--gold); }
.projects-hero h1{ color:#fff; max-width:20ch; }
.projects-hero__sub{ max-width:50ch; color:rgba(255,255,255,.8); font-size:1.05rem; }
.projects-hero__stats{ display:flex; gap:2.5rem; margin-top:2rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.2); }
.projects-hero__stat{ display:flex; flex-direction:column; }
.projects-hero__stat strong{ font-family:var(--font-display); font-size:1.8rem; color:var(--gold); }
.projects-hero__stat span{ font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.7); }

.portfolio{ padding:7rem 0; }
.portfolio__filters{ display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:3rem; padding-bottom:2rem; border-bottom:1px solid var(--line); }
.filter{ padding:.6rem 1.3rem; border:1px solid var(--line); border-radius:999px; font-size:.82rem; letter-spacing:.03em; transition:.3s var(--ease); }
.filter.is-active, .filter:hover{ background:var(--gold); color:var(--ink); border-color:var(--gold); }
.portfolio__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; }
.project-card{ display:block; position:relative; }
.project-card__frame{ position:relative; display:block; overflow:hidden; border-radius:var(--radius); aspect-ratio:4/5; background:var(--paper-alt); }
.project-card__frame img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.project-card:hover .project-card__frame img{ transform:scale(1.08); }
.project-card__overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(23,19,15,0) 40%, rgba(23,19,15,.85) 100%); opacity:0; transition:opacity .4s var(--ease); }
.project-card:hover .project-card__overlay{ opacity:1; }
.project-card__index{
	position:absolute; top:1rem; left:1.2rem; font-family:var(--font-display); font-size:2.6rem;
	color:rgba(255,255,255,.35); z-index:1; transition:color .4s var(--ease);
}
.project-card:hover .project-card__index{ color:rgba(255,255,255,.7); }
.project-card__pill{
	position:absolute; top:1.2rem; right:1.2rem; background:var(--gold); color:var(--ink); font-size:.7rem;
	letter-spacing:.08em; text-transform:uppercase; padding:.35rem .8rem; border-radius:999px; font-weight:600; z-index:1;
}
.project-card__view{
	position:absolute; left:1.2rem; bottom:1.2rem; z-index:1; color:#fff; font-size:.8rem; letter-spacing:.08em;
	text-transform:uppercase; display:flex; align-items:center; gap:.5rem; opacity:0; transform:translateY(8px);
	transition:opacity .4s var(--ease), transform .4s var(--ease);
}
.project-card:hover .project-card__view{ opacity:1; transform:none; }
.project-card__meta{ display:block; margin-top:1.2rem; }
.project-card__title{ display:block; font-family:var(--font-display); font-size:1.3rem; }
.portfolio--archive{ padding-top:2rem; }

.pagination-bar{ margin-top:2rem; }
.pagination-bar .nav-links{ display:flex; justify-content:center; gap:.6rem; flex-wrap:wrap; }
.pagination-bar .page-numbers{
	display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 .8rem;
	border:1px solid var(--line); border-radius:var(--radius); font-size:.85rem; transition:.3s var(--ease);
}
.pagination-bar .page-numbers.current, .pagination-bar .page-numbers:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }

@media (max-width: 640px){
	.projects-hero__inner{ padding:6rem 1.5rem 0; }
	.projects-hero__stats{ gap:1.5rem; }
}

/* ==========================================================================
   9. Process
   ========================================================================== */
.process{ padding:7rem 0; background:var(--ink); color:var(--paper); }
.process .eyebrow{ color:#e8dcc4; }
.process h2{ color:var(--paper); }
.process__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
.process-step{ border-top:1px solid rgba(255,255,255,.18); padding-top:1.5rem; }
.process-step__num{ font-family:var(--font-display); font-size:2rem; color:var(--accent); }
.process-step h3{ color:var(--paper); margin-top:.6rem; }
.process-step p{ color:rgba(255,255,255,.65); }

/* ==========================================================================
   10. Team
   ========================================================================== */
.team{ padding:7rem 0; }
.team__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
.team-card__media{ border-radius:var(--radius); overflow:hidden; aspect-ratio:1/1; margin-bottom:1.2rem; }
.team-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.team-card:hover .team-card__media img{ transform:scale(1.06); }
.team-card__placeholder{ background:linear-gradient(135deg,var(--paper-alt),var(--line)); width:100%; height:100%; }
.team-card__name{ margin:0 0 .2rem; font-size:1.1rem; }
.team-card__role{ font-size:.85rem; color:var(--accent); margin-bottom:.7rem; }

.social-icons{ display:flex; gap:.7rem; margin-top:1rem; }
.social-icon{ width:34px; height:34px; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:.3s var(--ease); }
.social-icon svg{ width:15px; height:15px; }
.social-icon:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.social-icons--small .social-icon{ width:28px; height:28px; border-color:var(--line); }

/* ==========================================================================
   11. Testimonials
   ========================================================================== */
.testimonials{ padding:7rem 0; background:var(--paper-alt); overflow:hidden; }
.testimonials__track{ display:flex; gap:2rem; overflow-x:auto; scroll-snap-type:x mandatory; padding:0 1.5rem 1rem; scrollbar-width:none; }
.testimonials__track::-webkit-scrollbar{ display:none; }
.testimonial-card{
	scroll-snap-align:start; flex:0 0 min(420px,86vw); background:var(--paper); border:1px solid var(--line);
	border-radius:var(--radius); padding:2.6rem; margin:0; display:flex; flex-direction:column; align-items:center; text-align:center;
}
.testimonial-card__avatar{
	width:64px; height:64px; border-radius:50%; overflow:hidden; margin-bottom:1.2rem; flex-shrink:0;
}
.testimonial-card__avatar img{ width:100%; height:100%; object-fit:cover; }
.testimonial-card__avatar--placeholder{
	display:flex; align-items:center; justify-content:center; background:var(--gold); color:var(--ink);
	font-family:var(--font-display); font-size:1.4rem;
}
.star-rating{ display:flex; gap:.2rem; margin-bottom:1.2rem; }
.star-rating__star{ width:16px; height:16px; color:var(--line); }
.star-rating__star svg{ width:100%; height:100%; fill:currentColor; }
.star-rating__star.is-filled{ color:var(--gold); }
.testimonial-card__quote{ font-family:var(--font-display); font-size:1.2rem; color:var(--ink); line-height:1.5; }
.testimonial-card__author{ margin-top:1.2rem; }
.testimonial-card__author cite{ display:block; font-style:normal; font-weight:600; }
.testimonial-card__author small{ color:var(--muted); }
.testimonials__nav{ display:flex; gap:.8rem; justify-content:center; margin-top:1.5rem; }
.testimonial-arrow{ width:44px; height:44px; border:1px solid var(--line); border-radius:50%; transition:.3s var(--ease); }
.testimonial-arrow:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }

/* ==========================================================================
   12. Blog preview + blog list
   ========================================================================== */
.blog-preview{ padding:7rem 0; }
.blog-preview__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.post-card__media{ display:block; border-radius:var(--radius); overflow:hidden; aspect-ratio:1/1; margin-bottom:1.2rem; }
.post-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.post-card:hover .post-card__media img{ transform:scale(1.06); }
.post-card__placeholder{ background:linear-gradient(135deg,var(--paper-alt),var(--line)); width:100%; height:100%; }
.post-card__date{ font-size:.78rem; color:var(--accent); text-transform:uppercase; letter-spacing:.05em; margin-bottom:.3rem; }
.post-card__title{ font-size:1.15rem; margin:0 0 .5rem; }
.post-card__excerpt{ font-size:.92rem; }

.page-hero{ padding:10rem 0 3.5rem; background:var(--paper-alt); }
.page-hero--small{ padding:9rem 0 2.5rem; }
.layout-with-sidebar{ display:grid; grid-template-columns:1fr 320px; gap:4rem; padding:5rem 1.5rem; max-width:var(--container); margin:0 auto; }
body.no-sidebar .layout-with-sidebar{ grid-template-columns:1fr; }
.widget-area .widget{ margin-bottom:2.5rem; }

/* Journal (blog archive) */
.journal-hero{ position:relative; min-height:50vh; display:flex; align-items:flex-end; color:#fff; overflow:hidden; padding-bottom:4.5rem; }
.journal-hero__media{ position:absolute; inset:0; background:var(--hero-image, linear-gradient(135deg,#2b2620,#4a3f30)) center/cover no-repeat; }
.journal-hero__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,13,10,.55) 0%, rgba(15,13,10,.5) 40%, rgba(15,13,10,.9) 100%); }
.journal-hero__inner{ position:relative; z-index:2; width:100%; padding:8rem 3rem 0; }
.journal-hero .eyebrow{ color:var(--gold); }
.journal-hero h1{ color:#fff; max-width:20ch; }
.journal-hero__sub{ max-width:50ch; color:rgba(255,255,255,.8); font-size:1.05rem; }

.journal{ padding:6rem 0; }
.journal-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; }
.journal-card__media{ position:relative; display:block; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; margin-bottom:1.4rem; }
.journal-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.journal-card:hover .journal-card__media img{ transform:scale(1.06); }
.journal-card__placeholder{ background:linear-gradient(135deg,var(--paper-alt),var(--line)); width:100%; height:100%; }
.journal-card__pill{
	position:absolute; top:1rem; left:1rem; background:var(--gold); color:var(--ink); font-size:.72rem;
	letter-spacing:.08em; text-transform:uppercase; padding:.4rem .9rem; border-radius:999px; font-weight:600;
}
.journal-card__meta{ font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--accent); margin-bottom:.4rem; }
.journal-card__title{ margin:0 0 .6rem; font-size:1.3rem; }
.journal-card__title a:hover{ color:var(--gold-dark); }
.journal-card__excerpt{ font-size:.92rem; }
.journal-empty{ text-align:center; padding:4rem 0; }

.journal-pagination{ margin-top:2rem; }
.journal-pagination .nav-links{ display:flex; justify-content:center; gap:.6rem; flex-wrap:wrap; }
.journal-pagination .page-numbers{
	display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 .8rem;
	border:1px solid var(--line); border-radius:var(--radius); font-size:.85rem; transition:.3s var(--ease);
}
.journal-pagination .page-numbers.current, .journal-pagination .page-numbers:hover{ background:var(--ink); border-color:var(--ink); color:var(--paper); }

@media (max-width: 900px){
	.journal-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 640px){
	.journal-grid{ grid-template-columns:1fr; }
	.journal-hero__inner{ padding:6rem 1.5rem 0; }
}
.widget-title{ font-family:var(--font-display); font-size:1.1rem; margin-bottom:1rem; }

.post-hero{ position:relative; }
.post-hero__media{ aspect-ratio:16/7; overflow:hidden; }
.post-hero__media img{ width:100%; height:100%; object-fit:cover; }
.post-hero__scrim{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(15,13,10,.75) 0%, rgba(15,13,10,0) 55%); }
.post-hero__caption{ position:relative; width:100%; padding:2.5rem 3rem 2rem; }
.post-hero__meta{ font-size:.85rem; color:var(--muted); }
.post-single__body{ padding:3rem 1.5rem 4rem; max-width:var(--container); margin:0 auto; }
.entry-content{ max-width:70ch; margin:0 auto; }
.entry-content p{ color:var(--ink); }
.tag-list{ max-width:70ch; margin:2rem auto 0; display:flex; gap:.6rem; flex-wrap:wrap; }
.tag-list a{ font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; padding:.4rem .9rem; border:1px solid var(--line); border-radius:999px; color:var(--muted); transition:.3s var(--ease); }
.tag-list a:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.page-content{ padding:2rem 0 5rem; max-width:70ch; margin:0 auto; }

/* ==========================================================================
   13. Single project
   ========================================================================== */
.project-hero__media{ aspect-ratio:16/8; overflow:hidden; margin-top:0; }
.project-hero__media img{ width:100%; height:100%; object-fit:cover; }
.project-hero__caption{ width:100%; padding:2.5rem 3rem 0; }
.project-single__body{ display:grid; grid-template-columns:260px 1fr; gap:4rem; padding:3rem 1.5rem 5rem; }
.project-meta__row{ display:flex; flex-direction:column; padding:1rem 0; border-top:1px solid var(--line); font-size:.9rem; }
.project-meta__row span{ color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; }
.project-meta .btn{ margin-top:1.5rem; width:100%; justify-content:center; }
.project-content{ max-width:70ch; }
.project-content p{ color:var(--ink); }
.project-gallery{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; padding:0 1.5rem 5rem; max-width:var(--container); margin:0 auto; }
.project-gallery img{ border-radius:var(--radius); aspect-ratio:4/3; object-fit:cover; width:100%; }
.project-nav{ display:flex; justify-content:space-between; gap:2rem; padding:3rem 1.5rem; border-top:1px solid var(--line); }
.project-nav__link{ display:flex; flex-direction:column; gap:.3rem; max-width:45%; }
.project-nav__link--next{ text-align:right; align-items:flex-end; }
.project-nav__link span{ font-size:.8rem; color:var(--accent); text-transform:uppercase; letter-spacing:.05em; }
.project-nav__link strong{ font-family:var(--font-display); font-size:1.2rem; }

/* ==========================================================================
   14. Contact page
   ========================================================================== */
.contact-hero{
	position:relative; min-height:56vh; display:flex; align-items:flex-end; color:#fff; overflow:hidden; padding-bottom:5.5rem;
}
.contact-hero__media{
	position:absolute; inset:0; background:var(--hero-image, linear-gradient(135deg,#2b2620,#4a3f30)) center/cover no-repeat;
}
.contact-hero__scrim{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,13,10,.55) 0%, rgba(15,13,10,.5) 40%, rgba(15,13,10,.9) 100%); }
.contact-hero__inner{ position:relative; z-index:2; width:100%; padding:8rem 3rem 0; text-align:left; }
.contact-hero .eyebrow{ color:var(--gold); }
.contact-hero h1{ color:#fff; max-width:16ch; text-align:left; }
.contact-hero__sub{ max-width:46ch; color:rgba(255,255,255,.8); font-size:1.05rem; text-align:left; }

.contact-cards{
	display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;
	margin-top:-4.5rem; position:relative; z-index:3;
}
.contact-card{
	background:var(--paper); border-radius:var(--radius); padding:2rem; box-shadow:0 20px 40px -20px rgba(23,19,15,.25);
	display:flex; flex-direction:column; gap:.6rem;
}
.contact-card__icon{ width:46px; height:46px; border-radius:50%; background:var(--gold); color:var(--ink); display:flex; align-items:center; justify-content:center; }
.contact-card__icon svg{ width:20px; height:20px; }
.contact-card__label{ font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.contact-card__value{ font-family:var(--font-display); font-size:1.15rem; color:var(--ink); }
a.contact-card__value:hover{ color:var(--gold-dark); }

.contact-split{ padding:7rem 0; }
.contact-split__inner{ display:grid; grid-template-columns:1.1fr 1fr; gap:4.5rem; align-items:stretch; }
.contact-split__note{ margin-bottom:1.5rem; }
.contact-split h2{ margin-bottom:2rem; }

.contact-split__form{ position:relative; display:flex; flex-direction:column; background:var(--paper); border-radius:var(--radius); padding:3rem; box-shadow:0 30px 60px -35px rgba(23,19,15,.3); }
.contact-split__map{ display:flex; flex-direction:column; }
.contact-split__form::before{ content:''; position:absolute; top:0; left:3rem; width:56px; height:3px; background:var(--gold); }
.contact-split__form .eyebrow{ margin-top:.5rem; }

.lodiz-form{ display:flex; flex-direction:column; gap:1.8rem; }
.form-row{ position:relative; }
.form-row label{
	display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:var(--accent);
	margin-bottom:.5rem; font-weight:600;
}
.form-row input, .form-row textarea{
	width:100%; padding:.6rem .1rem; border:none; border-bottom:2px solid var(--line); border-radius:0;
	background:transparent; font-family:var(--font-body); font-size:1.02rem; color:var(--ink);
	transition:border-color .3s var(--ease);
}
.form-row textarea{ resize:vertical; min-height:70px; }
.form-row input:focus, .form-row textarea:focus{ outline:none; border-color:var(--gold); }
.form-row input::placeholder, .form-row textarea::placeholder{ color:var(--muted); opacity:.6; }
.form-notice{ padding:1.2rem; border-radius:var(--radius); }
.form-notice--success{ background:#e7f0e3; color:#33562b; }

.lodiz-form .btn--gold, .wpcf7-form input.wpcf7-submit{
	align-self:flex-start; box-shadow:0 12px 24px -12px rgba(203,154,61,.6);
	transform:translateY(0); transition:background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.lodiz-form .btn--gold:hover{ transform:translateY(-3px); box-shadow:0 16px 28px -12px rgba(203,154,61,.5); }

/* Contact Form 7 default markup, restyled to match the underline field treatment above */
.wpcf7-form{ display:flex; flex-direction:column; gap:1.8rem; }
.wpcf7-form .input-group{ display:flex; flex-direction:column; gap:1.8rem; margin:0; }
.wpcf7-form .input-group label{ width:100%; margin:0; }
.wpcf7-form label{ display:block; margin:0; }
.wpcf7-form-control{
	width:100%; padding:.6rem .1rem; border:none; border-bottom:2px solid var(--line); border-radius:0;
	background:transparent; font-family:var(--font-body); font-size:1.02rem; color:var(--ink); margin-top:0;
	transition:border-color .3s var(--ease);
}
.wpcf7-form-control::placeholder{ color:var(--muted); opacity:.6; text-transform:uppercase; font-size:.75rem; letter-spacing:.1em; }
.wpcf7-form-control:focus{ outline:none; border-color:var(--gold); }
.wpcf7-form textarea.wpcf7-form-control{ min-height:70px; resize:vertical; }
input.wpcf7-submit{
	width:auto; align-self:flex-start; display:inline-flex; align-items:center; background:var(--gold); color:var(--ink); border:none;
	padding:1.05rem 2.6rem; border-radius:var(--radius); font-size:.85rem; letter-spacing:.08em; text-transform:uppercase;
	cursor:pointer; font-weight:600;
}
input.wpcf7-submit:hover{ background:var(--ink); color:var(--paper); }
.wpcf7-not-valid-tip{ color:#b23b3b; font-size:.78rem; text-transform:none; letter-spacing:0; margin-top:.4rem; }
.wpcf7-response-output{ margin-top:.5rem; padding:1rem; border-radius:var(--radius); border:1px solid var(--line); font-size:.9rem; }
.wpcf7-spinner{ margin-left:.8rem; }

@media (max-width: 640px){
	.contact-split__form{ padding:2rem; }
}

.contact-map-frame{ border-radius:var(--radius); overflow:hidden; box-shadow:0 20px 40px -20px rgba(23,19,15,.25); flex:1; min-height:340px; }
.contact-map-frame iframe{ width:100%; height:100%; border:0; display:block; }

@media (max-width: 900px){
	.contact-cards{ grid-template-columns:1fr; margin-top:-2.5rem; }
	.contact-split__inner{ grid-template-columns:1fr; gap:3rem; }
}

/* ==========================================================================
   15. Footer
   ========================================================================== */
.site-footer{ background:var(--ink); color:var(--paper); }
.footer-cta{ padding:6rem 0; text-align:center; position:relative; overflow:hidden; }
.footer-cta::before{ content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); width:120px; height:2px; background:var(--gold); }
.footer-cta .eyebrow{ color:var(--gold); }
.footer-cta h2{ color:var(--paper); max-width:22ch; margin:0 auto 2.2rem; }
.footer-main{
	display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:3rem; padding:5.5rem 1.5rem 3.5rem;
	border-top:1px solid rgba(255,255,255,.1);
}
.footer-col p{ font-size:.92rem; color:rgba(247,244,238,.62); }
.footer-col .widget-title{
	font-family:var(--font-body); font-size:.78rem; letter-spacing:.16em; text-transform:uppercase;
	color:var(--gold); font-weight:600; margin-bottom:1.4rem;
}
.footer-menu li{ margin-bottom:.8rem; }
.footer-menu a{ color:rgba(247,244,238,.8); font-size:.92rem; transition:color .3s var(--ease); }
.footer-menu a:hover{ color:var(--gold); }
address{ font-style:normal; font-size:.92rem; color:rgba(247,244,238,.62); line-height:1.9; }
address a{ color:rgba(247,244,238,.8); transition:color .3s var(--ease); }
address a:hover{ color:var(--gold); }
.footer-bottom{
	display:flex; justify-content:space-between; align-items:center; padding:1.6rem 1.5rem;
	border-top:2px solid var(--gold); font-size:.78rem; letter-spacing:.03em; color:rgba(247,244,238,.55); flex-wrap:wrap; gap:1rem;
}
.footer-bottom__lines{ display:flex; gap:1.5rem; flex-wrap:wrap; }
.footer-bottom__lines p{ margin:0; }
.footer-bottom__lines a{ color:rgba(247,244,238,.75); text-decoration:underline; text-underline-offset:2px; transition:color .3s var(--ease); }
.footer-bottom__lines a:hover{ color:var(--gold); }
.footer-bottom__totop{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--paper); transition:color .3s var(--ease); }
.footer-bottom__totop:hover{ color:var(--gold); }

/* ==========================================================================
   16. 404
   ========================================================================== */
.error-404{ min-height:70vh; display:flex; align-items:center; padding:8rem 0; }
.error-404 .container{ max-width:640px; }

/* ==========================================================================
   17. Responsive
   ========================================================================== */
@media (max-width: 1024px){
	.about__inner, .contact__inner, .founder__inner{ grid-template-columns:1fr; }
	.portfolio__grid, .team__grid, .blog-preview__grid{ grid-template-columns:repeat(2,1fr); }
	.process__grid{ grid-template-columns:repeat(2,1fr); }
	.footer-main{ grid-template-columns:1fr 1fr; }
	.layout-with-sidebar{ grid-template-columns:1fr; }
	.project-single__body{ grid-template-columns:1fr; }
}

/* Mobile: tighten every section's rhythm so it reads like a compact app screen
   rather than a scaled-down desktop page. */
@media (max-width: 640px){
	.portfolio__grid, .team__grid, .blog-preview__grid, .process__grid, .stats-row, .footer-main{ grid-template-columns:1fr; }
	.section-head--split{ flex-direction:column; align-items:flex-start; }
	.project-gallery{ grid-template-columns:1fr; }
	.about__badge{ bottom:1rem; right:1rem; width:100px; height:100px; font-size:1.5rem; }
	.about__badge small{ font-size:.56rem; padding:0 .5rem; }

	.container{ padding:0 1.25rem; }

	/* Section padding: 7rem/6rem desktop rhythm -> compact mobile rhythm */
	.about, .founder, .services, .portfolio, .process, .team, .testimonials,
	.blog-preview, .contact-split{ padding:3.5rem 0; }
	.journal{ padding:3rem 0; }
	.footer-cta{ padding:3.5rem 0; }
	.footer-main{ padding:3rem 1.25rem 2rem; gap:2.5rem; }
	.error-404{ padding:4rem 0; min-height:50vh; }
	.page-hero{ padding:7rem 0 2.5rem; }
	.page-hero--small{ padding:6.5rem 0 2rem; }
	.layout-with-sidebar{ padding:2.5rem 1.25rem; gap:2.5rem; }
	.page-content{ padding:1.5rem 0 3rem; }

	/* Full-bleed hero headers: less top clearance and side padding needed
	   once the fixed header itself is compact on mobile. */
	.hero__inner, .about-hero__inner, .projects-hero__inner, .journal-hero__inner,
	.contact-hero__inner{ padding:5.5rem 1.25rem 0; }
	.hero__inner{ padding-bottom:4rem; }
	.post-hero__caption, .project-hero__caption{ padding:1.75rem 1.25rem 1.5rem; }
	.about-hero, .projects-hero, .journal-hero{ min-height:auto; padding:0 0 3rem; align-items:flex-start; }
	.contact-hero{ min-height:auto; padding:0 0 3.5rem; }
	.hero{ min-height:100svh; }
	.hero__actions{ gap:1rem; margin-top:1.6rem; }

	/* Grids: shorter gaps so cards feel like app list items, not desktop tiles */
	.portfolio__grid, .journal-grid, .blog-preview__grid, .team__grid{ gap:1.5rem; }
	.process__grid{ gap:2rem; }
	.contact-cards{ gap:1rem; margin-top:-2rem; }
	.contact-card{ padding:1.5rem; }
	.project-gallery{ gap:1rem; padding:0 1.25rem 3rem; }
	.project-single__body{ padding:2rem 1.25rem 3rem; gap:2rem; }
	.project-nav{ padding:2rem 1.25rem; }

	.contact-split__form{ padding:1.75rem; }
	.founder__title{ margin-bottom:.8rem; }
	.testimonial-card{ padding:1.75rem; }
	.testimonials__track{ padding:0 1.25rem 1rem; gap:1.25rem; }

	/* Compact app-style header: icon-only, no "Menu" label taking up width */
	.menu-toggle__label{ display:none; }
	.site-header__inner{ padding:1rem 1.25rem; }

	/* Footer bottom bar: tight vertical stack instead of loosely-wrapped flex gaps */
	.footer-bottom{ flex-direction:column; align-items:flex-start; gap:.7rem; padding:1.4rem 1.25rem; }
	.footer-bottom__lines{ flex-direction:column; gap:.35rem; }
}

@media (max-width: 400px){
	.contact-cards{ margin-top:-1.25rem; }
	.about-hero, .projects-hero, .journal-hero{ padding-top:5rem; }
}