/*
Theme Name: LT SEO & Virtual Services
Theme URI: https://www.linkedin.com/in/ryan-lopez-415a8013/
Author: Ryan Lopez
Author URI: https://www.linkedin.com/in/ryan-lopez-415a8013/
Description: Custom WordPress theme for LT SEO & Virtual Services. Black & gold digital marketing agency theme with a Services custom post type, homepage, services archive and single service templates, and full theme options (logo, company info, colors) via the Customizer. Layout uses flexbox only.
Version: 1.0.0
Requires PHP: 7.4
Text Domain: lt-seo
*/

/* =============================================
   CSS VARIABLES (defaults - overridden inline by Customizer output in header.php)
============================================= */
:root{
	--color-primary:#D4AF37; /* gold */
	--color-dark:#141414;    /* near-black */
	--color-dark-2:#1e1e1e;
	--color-bg-alt:#F6F2E9;  /* cream */
	--color-text:#2b2b2b;
	--color-text-light:#6b6b6b;
	--color-white:#ffffff;
	--radius:14px;
	--container:1200px;
}

/* =============================================
   PARALLAX
============================================= */
@media (min-width:900px){
	.hero,.page-hero{ background-attachment:fixed; }
}
@media (prefers-reduced-motion:reduce){
	.hero,.page-hero{ background-attachment:scroll !important; }
	.feature-row .feature-media img,
	.about-media .media-main img,
	.about-media .media-overlap img{ transform:none !important; }
}

/* =============================================
   RESET / BASE
============================================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
	margin:0;
	font-family:'Segoe UI',Helvetica,Arial,sans-serif;
	color:var(--color-text);
	background:var(--color-white);
	line-height:1.6;
	font-size:16px;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4,p{margin:0;}
button{font-family:inherit;cursor:pointer;}
.container{
	max-width:var(--container);
	margin:0 auto;
	padding:0 24px;
	width:100%;
}
.section{padding:90px 0;}
.section-alt{background:var(--color-bg-alt);}
.eyebrow{
	color:var(--color-primary);
	font-weight:700;
	font-size:.8rem;
	letter-spacing:.06em;
	text-transform:uppercase;
	margin-bottom:10px;
	display:block;
}
.section-head{text-align:center;max-width:720px;margin:0 auto 50px;}
.section-head h2{font-size:2.1rem;margin-bottom:14px;}
.section-head p{color:var(--color-text-light);}
.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:14px 26px;
	border-radius:8px;
	font-weight:700;
	font-size:.95rem;
	border:2px solid transparent;
	transition:.2s ease;
}
.btn-primary{background:var(--color-primary);color:var(--color-dark);}
.btn-primary:hover{opacity:.88;}
.btn-outline{border-color:var(--color-white);color:var(--color-white);background:transparent;}
.btn-outline:hover{background:var(--color-white);color:var(--color-dark);}
.btn-dark{border-color:var(--color-dark);color:var(--color-dark);background:transparent;}
.btn-dark:hover{background:var(--color-dark);color:var(--color-white);}
.btn-block{width:100%;}

/* =============================================
   HEADER
============================================= */
.site-header{
	background:var(--color-dark);
	position:sticky;
	top:0;
	z-index:999;
}
.site-header .container{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:24px;
	padding-top:16px;
	padding-bottom:16px;
}
.site-logo{display:flex;align-items:center;gap:10px;color:var(--color-white);}
.site-logo img{max-height:42px;width:auto;}
.site-logo .logo-text{font-weight:700;font-size:.85rem;letter-spacing:.03em;line-height:1.2;color:var(--color-white);}
.site-logo .logo-text span{color:var(--color-primary);}

.primary-nav ul{display:flex;align-items:center;gap:30px;flex-wrap:wrap;}
.primary-nav a{color:#d9d9d9;font-weight:500;font-size:.95rem;transition:.2s;}
.primary-nav a:hover,.primary-nav .current-menu-item>a{color:var(--color-primary);}

/* Dropdown submenus (e.g. auto-populated Services list) */
.primary-nav li{position:relative;}
.primary-nav li.menu-item-has-children > a{
	display:inline-flex;align-items:center;gap:6px;
}
.primary-nav li.menu-item-has-children > a::after{
	content:'';
	width:6px;height:6px;
	border-right:2px solid currentColor;
	border-bottom:2px solid currentColor;
	transform:rotate(45deg);
	margin-top:-3px;
	opacity:.7;
}
.primary-nav .sub-menu{
	list-style:none;
	margin:0;
	padding:10px 0;
	position:absolute;
	top:100%;
	left:0;
	background:var(--color-dark);
	min-width:240px;
	box-shadow:0 14px 30px rgba(0,0,0,.35);
	border-radius:0 0 10px 10px;
	opacity:0;
	visibility:hidden;
	transform:translateY(6px);
	transition:opacity .18s ease, transform .18s ease, visibility .18s;
	z-index:20;
}
.primary-nav .sub-menu li{width:100%;}
.primary-nav .sub-menu a{
	display:block;
	padding:10px 20px;
	color:#d9d9d9;
	font-size:.9rem;
	white-space:nowrap;
}
.primary-nav .sub-menu a:hover{color:var(--color-primary);background:rgba(255,255,255,.04);}
.primary-nav .sub-menu a::after{content:none;}

@media (hover:hover){
	.primary-nav li.menu-item-has-children:hover > .sub-menu,
	.primary-nav li.menu-item-has-children:focus-within > .sub-menu{
		opacity:1;visibility:visible;transform:translateY(0);
	}
}

/* Mobile-only toggle button for expanding a submenu by tap (hover doesn't apply on touch) */
.submenu-toggle{
	display:none;
	position:absolute;
	right:0;top:0;
	width:40px;height:40px;
	background:none;border:none;
	align-items:center;justify-content:center;
}
.submenu-toggle span{
	width:9px;height:9px;
	border-right:2px solid #fff;
	border-bottom:2px solid #fff;
	transform:rotate(45deg);
	transition:transform .2s ease;
}
.primary-nav li.menu-item-has-children.is-open > .submenu-toggle span{
	transform:rotate(-135deg);
}

.header-actions{display:flex;align-items:center;gap:18px;}
.menu-toggle{
	display:none;
	background:none;border:none;flex-direction:column;gap:5px;padding:6px;
}
.menu-toggle span{width:26px;height:2px;background:var(--color-white);display:block;}

@media (max-width:900px){
	.primary-nav{
		display:none;
		position:absolute;
		top:100%;left:0;right:0;
		background:var(--color-dark);
		padding:10px 24px 24px;
	}
	.primary-nav.is-open{display:block;}
	.primary-nav ul{flex-direction:column;align-items:flex-start;gap:16px;}
	.menu-toggle{display:flex;}

	.primary-nav li{width:100%;}
	.primary-nav li.menu-item-has-children > a{width:100%;justify-content:space-between;padding-right:40px;}
	.primary-nav li.menu-item-has-children > a::after{display:none;}
	.submenu-toggle{display:flex;}

	.primary-nav .sub-menu{
		position:static;
		opacity:1;visibility:visible;transform:none;
		box-shadow:none;background:rgba(255,255,255,.04);
		border-radius:6px;
		max-height:0;
		overflow:hidden;
		padding:0;
		margin-top:6px;
		transition:max-height .25s ease, padding .25s ease;
	}
	.primary-nav li.menu-item-has-children.is-open > .sub-menu{
		max-height:600px;
		padding:6px 0;
	}
}

/* =============================================
   HERO (homepage)
============================================= */
.hero{
	background:linear-gradient(180deg,rgba(10,10,10,.75),rgba(10,10,10,.55)),var(--hero-bg,#1a1a1a) center/cover no-repeat;
	color:var(--color-white);
	padding:80px 0 60px;
}
.hero .container{
	display:flex;
	flex-wrap:wrap;
	gap:40px;
	align-items:flex-start;
}
.hero-content{flex:1 1 420px;}
.hero-content h1{font-size:2.8rem;line-height:1.15;margin-bottom:18px;font-weight:800;}
.hero-content p{color:#d8d8d8;max-width:520px;margin-bottom:26px;}
.hero-buttons{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:26px;}
.hero-trust{display:flex;gap:22px;flex-wrap:wrap;font-size:.85rem;color:#cfcfcf;}
.hero-trust li{display:flex;align-items:center;gap:6px;}
.hero-trust .dot{width:8px;height:8px;border-radius:50%;background:var(--color-primary);display:inline-block;}

/* Hero audit form card */
.audit-form{
	flex:1 1 380px;
	background:var(--color-white);
	color:var(--color-text);
	border-radius:var(--radius);
	padding:34px;
	box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.audit-form h3{font-size:1.3rem;margin-bottom:6px;}
.audit-form>p{color:var(--color-text-light);font-size:.9rem;margin-bottom:20px;}
.form-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px;}
.form-group{flex:1 1 160px;display:flex;flex-direction:column;gap:6px;}
.form-group label{font-size:.8rem;font-weight:600;}
.form-group input,.form-group select,.form-group textarea{
	padding:12px 14px;border:1px solid #e0ddd3;border-radius:8px;font-size:.9rem;font-family:inherit;
}
.form-note{font-size:.75rem;color:var(--color-text-light);margin-top:12px;text-align:center;}
.form-success{background:#eef8ee;border:1px solid #b7e0b7;color:#256a25;padding:14px;border-radius:8px;margin-bottom:16px;font-size:.9rem;}

/* Page hero (services / single service) */
.page-hero{
	background:linear-gradient(180deg,rgba(10,10,10,.72),rgba(10,10,10,.72)),var(--hero-bg,#1a1a1a) center/cover no-repeat;
	color:var(--color-white);
	padding:90px 0 60px;
	text-align:center;
}
.page-hero h1{font-size:2.5rem;margin-bottom:16px;font-weight:800;}
.page-hero p{max-width:700px;margin:0 auto;color:#dcdcdc;}
.breadcrumb{margin-top:18px;font-size:.85rem;color:#c9c9c9;}
.breadcrumb a{color:#c9c9c9;}
.breadcrumb a:hover{color:var(--color-primary);}
.breadcrumb .sep{margin:0 6px;color:var(--color-primary);}

.page-hero.single-service{text-align:left;}
.page-hero.single-service .hero-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;}
.page-hero.single-service h1{font-size:2.4rem;max-width:640px;}
.page-hero .service-tag{font-size:.8rem;color:var(--color-primary);text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-bottom:10px;display:block;}
.page-hero .hero-buttons{margin-top:0;}

/* =============================================
   STATS STRIP
============================================= */
.stats-strip{border-bottom:1px solid #eee;}
.stats-strip .container{
	display:flex;flex-wrap:wrap;
	padding:50px 24px;
	text-align:center;
}
.stat-item{flex:1 1 200px;padding:10px;}
.stat-item strong{display:block;font-size:2.2rem;color:var(--color-dark);}
.stat-item span{color:var(--color-text-light);font-size:.9rem;}

/* =============================================
   ICON CARD GRID (4-up feature boxes / services grid)
============================================= */
.card-grid{display:flex;flex-wrap:wrap;gap:24px;}
.card{
	flex:1 1 250px;
	background:var(--color-white);
	border:1px solid #eee;
	border-radius:var(--radius);
	padding:30px 26px;
	box-shadow:0 6px 20px rgba(0,0,0,.04);
}
.card .icon-box{
	width:52px;height:52px;border-radius:12px;
	background:var(--color-bg-alt);
	display:flex;align-items:center;justify-content:center;
	font-size:1.4rem;margin-bottom:18px;
}
.card h3{font-size:1.1rem;margin-bottom:10px;}
.card p{color:var(--color-text-light);font-size:.92rem;margin-bottom:14px;}
.card .learn-more{color:var(--color-primary);font-weight:700;font-size:.88rem;}

.services-index-grid .card{position:relative;padding-top:34px;}
.services-index-grid .card .num{position:absolute;top:22px;left:26px;font-weight:800;color:var(--color-primary);font-size:.85rem;}
.services-index-grid .card{padding-top:54px;}

/* =============================================
   ALTERNATING IMAGE / TEXT ROWS
============================================= */
.feature-row{
	display:flex;flex-wrap:wrap;
	align-items:center;
	gap:50px;
	padding:60px 0;
}
.feature-row:nth-of-type(even){flex-direction:row-reverse;}
.feature-row .feature-media{
	flex:1 1 420px;
	overflow:hidden;
	border-radius:var(--radius);
	height:420px;
}
.feature-row .feature-media img{
	width:100%;
	height:130%;
	object-fit:cover;
	display:block;
	will-change:transform;
}
.feature-row .feature-text{flex:1 1 380px;}
.feature-row .feature-text h2{font-size:1.9rem;margin:10px 0 16px;}
.feature-row .feature-text p{color:var(--color-text-light);margin-bottom:18px;}

/* =============================================
   ABOUT BLOCK (homepage) — text + overlapping photo pair
============================================= */
.about-section .container{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:60px;
}
.about-text{flex:1 1 420px;}
.about-text h2{font-size:2.4rem;margin:10px 0 20px;font-weight:800;}
.about-text p{color:var(--color-text-light);margin-bottom:18px;}
.about-checklist{margin:24px 0 30px;display:flex;flex-direction:column;gap:14px;}
.about-checklist li{display:flex;align-items:center;gap:12px;font-weight:600;}
.about-checklist .check{
	width:26px;height:26px;border-radius:50%;
	border:2px solid var(--color-primary);
	color:var(--color-primary);
	display:flex;align-items:center;justify-content:center;
	flex:0 0 auto;font-size:.85rem;font-weight:800;
}

.about-media{
	flex:1 1 420px;
	position:relative;
	min-height:420px;
}
.about-media .media-main{
	border-radius:var(--radius);
	overflow:hidden;
	width:100%;
	height:420px;
}
.about-media .media-main img{width:100%;height:130%;object-fit:cover;will-change:transform;}
.about-media .media-overlap{
	position:absolute;
	left:-6%;
	bottom:-40px;
	width:46%;
	height:260px;
	border-radius:var(--radius);
	overflow:hidden;
	background:var(--color-white);
	box-shadow:0 20px 40px rgba(0,0,0,.18);
	border:6px solid var(--color-white);
}
.about-media .media-overlap img{width:100%;height:130%;object-fit:cover;display:block;will-change:transform;}

@media (max-width:900px){
	.about-media{min-height:340px;}
	.about-media .media-main{height:320px;}
	.about-media .media-overlap{width:52%;bottom:-30px;height:220px;}
}
@media (max-width:640px){
	.about-media{margin-bottom:60px;}
}

/* =============================================
   PROCESS STEPS
============================================= */
.process-grid{display:flex;flex-wrap:wrap;gap:22px;}
.process-step{
	flex:1 1 220px;
	background:var(--color-white);
	border-radius:var(--radius);
	padding:28px;
	border:1px solid #eee;
}
.process-step .step-num{
	width:36px;height:36px;border-radius:50%;
	background:var(--color-dark);color:var(--color-white);
	display:flex;align-items:center;justify-content:center;
	font-weight:700;margin-bottom:16px;
}
.process-step h3{font-size:1.05rem;margin-bottom:8px;}
.process-step p{color:var(--color-text-light);font-size:.9rem;}

/* vertical process timeline (single service) */
.process-timeline{display:flex;flex-direction:column;gap:0;max-width:760px;margin:0 auto;}
.timeline-item{display:flex;gap:22px;padding-bottom:34px;position:relative;}
.timeline-item::before{
	content:'';position:absolute;left:19px;top:44px;bottom:0;width:1px;background:#e2e2e2;
}
.timeline-item:last-child::before{display:none;}
.timeline-num{
	flex:0 0 40px;height:40px;border-radius:50%;background:var(--color-dark);color:var(--color-white);
	display:flex;align-items:center;justify-content:center;font-weight:700;
}
.timeline-item h3{margin-bottom:6px;font-size:1.05rem;}
.timeline-item p{color:var(--color-text-light);font-size:.92rem;}

/* =============================================
   FAQ ACCORDION
============================================= */
.faq-list{display:flex;flex-direction:column;gap:14px;max-width:820px;margin:0 auto;}
.faq-item{background:var(--color-white);border:1px solid #eee;border-radius:10px;overflow:hidden;}
.faq-question{
	width:100%;text-align:left;background:none;border:none;
	padding:20px 22px;font-weight:700;font-size:.98rem;
	display:flex;justify-content:space-between;align-items:center;gap:14px;
}
.faq-question .icon{color:var(--color-primary);font-size:1.2rem;flex:0 0 auto;}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .25s ease;padding:0 22px;}
.faq-answer p{color:var(--color-text-light);font-size:.92rem;padding-bottom:20px;}
.faq-item.is-open .faq-answer{max-height:400px;}

/* =============================================
   RELATED SERVICES
============================================= */
.related-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;margin-bottom:36px;}
.related-head h2{font-size:1.7rem;}

/* =============================================
   CTA BANNER
============================================= */
.cta-banner{
	background:linear-gradient(120deg,#0c0c0c,#1c1a10);
	color:var(--color-white);
	border-radius:var(--radius);
	padding:60px 40px;
	text-align:center;
	margin:0 24px;
}
.cta-banner h2{font-size:1.9rem;margin-bottom:12px;}
.cta-banner p{color:#d6d6d6;margin-bottom:26px;max-width:600px;margin-left:auto;margin-right:auto;}
.cta-wrap{max-width:var(--container);margin:0 auto;padding:70px 0;}

/* =============================================
   FOOTER
============================================= */
.site-footer{background:var(--color-dark);color:#cfcfcf;padding-top:70px;}
.footer-top{
	display:flex;flex-wrap:wrap;gap:40px;
	padding-bottom:50px;border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-col{flex:1 1 220px;}
.footer-col h4{color:var(--color-white);margin-bottom:18px;font-size:1rem;}
.footer-col p{font-size:.88rem;line-height:1.7;color:#b7b7b7;}
.footer-col ul{display:flex;flex-direction:column;gap:10px;}
.footer-col a{font-size:.88rem;color:#b7b7b7;}
.footer-col a:hover{color:var(--color-primary);}
.footer-brand .site-logo{margin-bottom:16px;}
.footer-social{display:flex;gap:10px;margin-top:16px;}
.footer-social a{
	width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);
	display:flex;align-items:center;justify-content:center;font-size:.85rem;color:var(--color-white);
}
.footer-social a:hover{background:var(--color-primary);color:var(--color-dark);}
.footer-contact li{display:flex;gap:10px;align-items:flex-start;font-size:.88rem;color:#b7b7b7;margin-bottom:12px;}
.footer-contact .ic{color:var(--color-primary);}
.footer-bottom{
	display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
	padding:26px 0;font-size:.8rem;color:#8f8f8f;
}
.footer-bottom a{color:#8f8f8f;}
.footer-bottom a:hover{color:var(--color-primary);}
.footer-bottom-links{display:flex;gap:18px;}

/* =============================================
   TEAM MEMBERS
============================================= */
.team-featured-list{display:flex;flex-direction:column;gap:40px;margin-bottom:10px;}
.team-card-featured{
	display:flex;flex-wrap:wrap;gap:36px;align-items:flex-start;
	background:var(--color-white);border:1px solid #eee;border-radius:var(--radius);
	padding:32px;box-shadow:0 6px 20px rgba(0,0,0,.04);
}
.team-card-featured .team-photo{flex:0 0 160px;width:160px;height:160px;}
.team-card-featured .team-info{flex:1 1 320px;}

.team-grid{display:flex;flex-wrap:wrap;gap:26px;margin-top:10px;}
.team-card{
	flex:1 1 280px;
	background:var(--color-white);border:1px solid #eee;border-radius:var(--radius);
	padding:28px;box-shadow:0 6px 20px rgba(0,0,0,.04);
	text-align:center;
}
.team-card .team-photo{width:120px;height:120px;margin:0 auto 18px;}
.team-card .team-social{justify-content:center;}

.team-photo{
	border-radius:50%;overflow:hidden;
	background:var(--color-bg-alt);
	display:flex;align-items:center;justify-content:center;
	flex:0 0 auto;
}
.team-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.team-photo-placeholder{font-size:2.2rem;font-weight:800;color:var(--color-primary);}
.team-card-memorial .team-photo img{filter:grayscale(100%);opacity:.85;}

.team-info h3{font-size:1.15rem;margin-bottom:4px;}
.team-role{color:var(--color-primary);font-weight:700;font-size:.85rem;margin-bottom:12px;}
.team-bio p{color:var(--color-text-light);font-size:.92rem;margin-bottom:10px;}
.team-bio p:last-child{margin-bottom:0;}
.team-social{display:flex;gap:10px;margin-top:16px;}
.team-social a{
	width:32px;height:32px;border-radius:50%;background:var(--color-bg-alt);
	display:flex;align-items:center;justify-content:center;font-size:.8rem;color:var(--color-dark);
}
.team-social a:hover{background:var(--color-primary);color:var(--color-white);}

@media (max-width:640px){
	.team-card-featured{flex-direction:column;align-items:center;text-align:center;}
	.team-card-featured .team-photo{margin:0 auto;}
}

/* =============================================
   CONTACT PAGE
============================================= */
.contact-grid{display:flex;flex-wrap:wrap;gap:50px;align-items:flex-start;}
.contact-info{flex:1 1 360px;}
.contact-info h2{font-size:1.9rem;margin:10px 0 16px;}
.contact-info p{color:var(--color-text-light);margin-bottom:24px;}
.contact-info-list{display:flex;flex-direction:column;gap:16px;}
.contact-info-list li{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;}
.contact-info-list .ic{color:var(--color-primary);flex:0 0 auto;}
.contact-form-card{flex:1 1 420px;box-shadow:0 6px 24px rgba(0,0,0,.08);}

/* =============================================
   UTILITIES / RESPONSIVE
============================================= */
@media (max-width:640px){
	.hero-content h1{font-size:2.1rem;}
	.page-hero h1{font-size:1.9rem;}
	.section{padding:60px 0;}
	.cta-banner{padding:40px 22px;}
	.feature-row:nth-of-type(even){flex-direction:column;}
	.feature-row{flex-direction:column;}
}