/* ==========================================================================
   CMDJ Classic — fő stíluslap
   A pxl-* csúszka-widgetek stílusa a pxl-widgets.css-ben van (Maiko-kivonat).
   ========================================================================== */

:root{
	--primary-color:#121c27;
	--secondary-color:#111111;
	--third-color:#666666;
	--four-color:#f5f2e5;
	--navy:#090052;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
	margin:0;padding:0;
	font-family:"DM Sans",sans-serif;
	font-size:15px;line-height:1.67;color:var(--third-color);
	background:#fff;
	-webkit-font-smoothing:antialiased;
	overflow-x:hidden;
}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3{font-family:"Founders Grotesk",sans-serif;font-weight:500;color:#111;margin:0 0 20px}

.cmdj-container{max-width:1320px;margin:0 auto;padding:0 15px}

/* Scroll-animációk (wow utánpótlás — a main.js IntersectionObservere kezeli) */
.wow{animation-fill-mode:both}

/* A Maiko-kivonat a téma carousel.js-ére várva opacity:0-ról indítaná a csúszkákat;
   nálunk a main.js végzi az init-et, ezért alapból láthatóak */
.pxl-swiper-slider{opacity:1!important}
/* A csúszka-nyilak a kivonatban fehérek és rejtettek (sötét háttérre szánták) */
.cm-copy .pxl-swiper-arrow{opacity:1;color:#111;transition:color .3s}
.cm-copy .pxl-swiper-arrow:hover{color:#090052}

/* ==========================================================================
   Fejléc
   ========================================================================== */
.cmdj-header{position:relative;z-index:1000}

/* Top bar: fehér sáv, középen dőlt mondat (mobilon rejtett) */
.cmdj-topbar{
	background:#fff;height:75px;
	display:flex;align-items:center;justify-content:center;
	padding:0 35px;
}
.cmdj-topbar p{
	margin:0;font-size:15px;font-style:italic;color:#111;text-align:center;
}

/* Menüsor: a főoldalon a hero fölött lebeg (absolute), máshol sötét, statikus */
.cmdj-menubar{
	position:absolute;top:75px;left:0;right:0;z-index:900;
	background:transparent;
	transition:background .3s;
}
body:not(.is-front-page) .cmdj-menubar{position:static;background:#111}
.cmdj-menubar-inner{
	display:flex;align-items:center;
	min-height:108px;padding:0 35px;
}
.cmdj-logo{display:none;line-height:0}
.cmdj-logo img{width:60px;height:60px}

/* Asztali menü: fehér, nagybetűs, „/” elválasztókkal, teljes szélességben */
.cmdj-nav{flex:1}
.cmdj-menu{display:flex;align-items:center;width:100%}
.cmdj-menu li{flex:1;display:flex;align-items:center;justify-content:center}
.cmdj-menu li + li::before{
	content:"/";color:rgba(255,255,255,.5);margin:0 20px;
	font-family:"Founders Grotesk",sans-serif;font-size:15px;
}
.cmdj-menu a{
	display:inline-block;padding:10px 0;
	font-family:"Founders Grotesk",sans-serif;font-size:15px;font-weight:500;
	text-transform:uppercase;letter-spacing:1.5px;color:#fff;
	white-space:nowrap;
	transition:opacity .3s;
}
.cmdj-menu a:hover{opacity:.7}
.cmdj-menu .current-menu-item > a,.cmdj-menu .current_page_item > a{
	text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:2px;
}

/* Sticky állapot: görgetésre fix sötét sáv */
.cmdj-header.is-sticky .cmdj-menubar{
	position:fixed;top:0;left:0;right:0;
	background:#111;box-shadow:0 2px 18px rgba(0,0,0,.25);
	animation:cmdj-sticky-in .4s ease both;
}
.cmdj-header.is-sticky .cmdj-menubar-inner{min-height:70px}
@keyframes cmdj-sticky-in{from{transform:translateY(-100%)}to{transform:translateY(0)}}

/* Hamburger (csak mobil) */
.cmdj-burger{
	display:none;margin-left:auto;
	background:none;border:0;padding:10px;cursor:pointer;
}
.cmdj-burger span{
	display:block;width:26px;height:2px;background:#fff;margin:6px 0;
	transition:transform .3s,opacity .3s;
}

/* Mobil drawer */
.cmdj-drawer{
	position:fixed;inset:0;z-index:1200;background:#111;
	padding:30px 35px 40px;overflow-y:auto;
	opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
}
.cmdj-drawer.active{opacity:1;visibility:visible}
.cmdj-drawer .cmdj-logo{display:inline-block;margin-bottom:40px}
.cmdj-drawer .cmdj-logo img{width:48px;height:48px}
.cmdj-drawer-close{
	position:absolute;top:18px;right:22px;
	background:none;border:0;color:#fff;font-size:34px;line-height:1;
	cursor:pointer;padding:6px;
}
.cmdj-drawer-menu li{border-bottom:1px solid rgba(255,255,255,.08)}
.cmdj-drawer-menu a{
	display:block;padding:16px 0;
	font-family:"Founders Grotesk",sans-serif;font-size:16px;font-weight:500;
	text-transform:uppercase;letter-spacing:1.5px;color:#fff;
}
.cmdj-drawer-backdrop{
	position:fixed;inset:0;z-index:1100;background:rgba(0,0,0,.5);
	opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
}
.cmdj-drawer-backdrop.active{opacity:1;visibility:visible}

/* ==========================================================================
   Főoldali törzs (a korábbi „Főoldal másolat” sablon stílusai)
   ========================================================================== */
.cm-copy{font-family:"DM Sans",sans-serif;font-size:15px;line-height:1.67;color:#666}
.cm-copy h1,.cm-copy h2,.cm-copy h3{font-family:"Founders Grotesk",sans-serif;font-weight:500;color:#111;margin:0 0 20px}
.cm-copy h2{font-size:40px;line-height:1.25}
.cm-copy p{margin:0 0 15px}
.cm-copy img{max-width:100%;height:auto;display:block}
.cm-copy a{color:inherit;text-decoration:none}
.cm-copy ul{margin:0;padding:0;list-style:none}
.cm-copy-container{max-width:1320px;margin:0 auto;padding:0 15px}
.cm-copy section{padding:90px 0;scroll-margin-top:80px}

/* Hero — eredeti cmdj-head-nagy kép, TELJES magasságban (nincs vágás):
   a section magasságát az aspect-ratio adja, a kép 100% szélességben tölti ki.
   A vágási vonal a kép 55.57%-ánál van — a hero szöveg ehhez igazodik.
   A menüsor absolute-pozicionált, a hero a top bar alatt kezdődik. */
.cm-copy .cm-copy-hero{position:relative;overflow:hidden;aspect-ratio:3000/967;padding:0;background:#090052 url("https://ceremoniamesteresdj.hu/wp-content/uploads/2026/09/cmdj-head-nagy-scaled.jpg") center top/100% auto no-repeat}
.cm-copy .cm-copy-hero::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(10,10,25,.25)}

/* Közösségi ikonok a főmenü alatt, a hero képen */
.cm-copy .cm-copy-social{position:absolute;top:125px;left:0;right:0;display:flex;gap:14px;justify-content:center;z-index:3}
.cm-copy .cm-copy-social-link{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.8);border-radius:50%;color:#fff;font-size:17px;transition:all .3s}
.cm-copy .cm-copy-social-link:hover{background:#fff;color:#090052}

/* Hero szöveg: egyetlen mondat, a kötőjel a kép vágási vonalára (55.57%) esik —
   a bal span jobbra, a jobb span balra zárt, így a kettő egy folyamatos sor */
.cm-copy .cm-copy-hero-title{position:absolute;left:0;right:0;bottom:8%;display:flex;margin:0;z-index:2}
.cm-copy .cm-copy-hero-title span{font-size:38px;line-height:1.2;text-transform:uppercase;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.6)}
.cm-copy .cm-copy-hero-title .cm-copy-hero-left{width:55.57%;text-align:right;padding-right:12px}
.cm-copy .cm-copy-hero-title .cm-copy-hero-right{flex:1;text-align:left;padding-left:12px}

/* Futószalag (CSS marquee) */
.cm-copy .cm-copy-marquee{padding:35px 0;overflow:hidden;white-space:nowrap;border-bottom:1px solid #eee}
.cm-copy .cm-copy-marquee-track{display:inline-block;animation:cm-marquee 40s linear infinite}
.cm-copy .cm-copy-marquee span{font-family:"Founders Grotesk",sans-serif;font-size:17px;font-weight:500;text-transform:uppercase;color:#111;padding:0 18px}
.cm-copy .cm-copy-marquee i{font-style:normal;color:#bbb}
@keyframes cm-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Rácsok */
.cm-copy .cm-copy-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:40px}

/* Rólam */
.cm-copy .cm-copy-rolam{background:#F1F2EB}
.cm-copy .cm-copy-rolam-img img{width:100%;height:100%;object-fit:cover}
.cm-copy .cm-copy-rolam-txt h3{font-size:19px;margin:25px 0 5px}
.cm-copy .cm-copy-lead{font-size:17px;color:#333}

/* Miért engem */
.cm-copy .cm-copy-duallist li{margin-bottom:18px;padding-left:20px;position:relative}
.cm-copy .cm-copy-duallist li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;background:#090052;border-radius:50%}
.cm-copy .cm-copy-duallist strong{color:#111}

/* Szolgáltatások */
.cm-copy .cm-copy-szolg-list li{margin-bottom:18px;padding-left:28px;position:relative}
.cm-copy .cm-copy-szolg-list li::before{content:"→";position:absolute;left:0;top:0;color:#090052;font-weight:700}
.cm-copy .cm-copy-szolg-list strong{color:#111}
.cm-copy .cm-copy-szolg-img img{width:100%;height:100%;object-fit:cover}

/* Előnyök */
.cm-copy .cm-copy-elonyok{background:#090052;color:#fff}
.cm-copy .cm-copy-elonyok .cm-copy-bigtitle{font-size:100px;line-height:1;color:#fff;margin-bottom:10px}
.cm-copy .cm-copy-elonyok-sub{font-size:20px;color:#fff;margin-bottom:40px}
.cm-copy .cm-copy-checklist li{position:relative;padding-left:30px;margin-bottom:18px;color:#fff}
.cm-copy .cm-copy-checklist li::before{content:"✓";position:absolute;left:0;top:0;color:#fff;font-weight:700}

/* Galéria */
.cm-copy .cm-copy-galeria-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:20px}
.cm-copy .gallery{display:grid!important;grid-template-columns:repeat(2,1fr);gap:12px;margin:0}
.cm-copy .gallery .gallery-item{margin:0;position:relative}
.cm-copy .gallery .gallery-icon img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}

/* Videó: kattintásra töltődő YouTube (mint az eredeti) */
.cm-copy .cm-copy-galeria-video .cmdj-video{position:relative;padding-bottom:75%;height:0;overflow:hidden;background:#000;cursor:pointer}
.cm-copy .cm-copy-galeria-video .cmdj-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cmdj-video-play{
	position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
	width:72px;height:72px;border-radius:50%;border:1px solid rgba(255,255,255,.8);
	background:rgba(0,0,0,.35);color:#fff;font-size:22px;cursor:pointer;
	transition:all .3s;
}
.cmdj-video-play:hover{background:#fff;color:#090052}

/* Blog kártyák képaránya (az eredeti 410x505-ös cropot utánozza) */
.cm-copy .pxl-post--featured img{aspect-ratio:410/505;object-fit:cover;width:100%}
.cm-copy .pxl-post--featured{position:relative}

/* Kapcsolat */
.cm-copy .cm-copy-kapcsolat{padding:40px 0 90px}
.cm-copy .cm-copy-kapcsolat-box{background:#090052;color:#fff;text-align:center;padding:90px 30px}
.cm-copy .cm-copy-kapcsolat-box h2{color:#fff;font-size:40px;margin-bottom:30px}
.cm-copy .cm-copy-kapcsolat-bar{display:inline-flex;gap:40px;background:#fff;color:#111;padding:18px 40px}
.cm-copy .cm-copy-kapcsolat-bar a{color:#111;font-size:16px}

/* ==========================================================================
   Lábléc
   ========================================================================== */
.cmdj-footer{font-family:"DM Sans",sans-serif}
.cmdj-footer-top{background:#090052;padding:70px 0 50px}
.cmdj-footer-hero{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap}
.cmdj-footer-bigtitle{
	font-size:100px;line-height:1;color:#fff;margin:0;
	font-family:"Founders Grotesk",sans-serif;font-weight:500;
}
.cmdj-footer-quote{
	font-size:20px;line-height:30px;color:#fff;font-style:italic;
	padding:0 60px;text-align:right;max-width:480px;
	transition:opacity .3s;
}
.cmdj-footer-quote:hover{opacity:.7}
.cmdj-footer-mid{background:#090052;border-top:1px solid rgba(255,255,255,.15);padding:50px 0}
.cmdj-footer-cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}
.cmdj-footer-col{color:rgba(255,255,255,.75);font-size:15px}
.cmdj-footer-col h3{
	color:#fff;font-size:19px;margin:0 0 18px;
	font-family:"Founders Grotesk",sans-serif;font-weight:500;
}
.cmdj-footer-col p{margin:0 0 15px}
.cmdj-footer-col a{color:rgba(255,255,255,.75);transition:color .3s}
.cmdj-footer-col a:hover{color:#fff}
.cmdj-footer-col ul li{margin-bottom:10px}
.cmdj-footer-logo{display:inline-block;line-height:0;margin-bottom:20px}
.cmdj-footer-logo img{width:60px;height:60px}
.cmdj-footer-bottom{background:#111;border-top:1px solid rgba(255,255,255,.15);padding:15px 0 12px}
.cmdj-footer-bottom p{margin:0;color:rgba(255,255,255,.6);font-size:14px;text-align:center}

/* ==========================================================================
   Lightbox (saját, a galériához)
   ========================================================================== */
.cmdj-lightbox{
	position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.92);
	display:flex;align-items:center;justify-content:center;
	opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
}
.cmdj-lightbox.open{opacity:1;visibility:visible}
.cmdj-lightbox img{max-width:88vw;max-height:86vh;box-shadow:0 10px 60px rgba(0,0,0,.5)}
.cmdj-lightbox-close{
	position:absolute;top:20px;right:26px;background:none;border:0;
	color:#fff;font-size:36px;line-height:1;cursor:pointer;padding:6px;
}
.cmdj-lightbox-prev,.cmdj-lightbox-next{
	position:absolute;top:50%;transform:translateY(-50%);
	width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.6);
	background:rgba(0,0,0,.3);color:#fff;font-size:18px;cursor:pointer;
	transition:all .3s;
}
.cmdj-lightbox-prev:hover,.cmdj-lightbox-next:hover{background:#fff;color:#111}
.cmdj-lightbox-prev{left:20px}
.cmdj-lightbox-next{right:20px}

/* ==========================================================================
   Oldalak / blog (nem főoldal)
   ========================================================================== */
.cmdj-page{padding:70px 0 90px;min-height:50vh}
.cmdj-page-title{font-size:40px;line-height:1.25;margin-bottom:30px}
.cmdj-post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.cmdj-post-card{border:1px solid #eee;background:#fff}
.cmdj-post-card-thumb{display:block;line-height:0}
.cmdj-post-card-thumb img{width:100%;aspect-ratio:410/505;object-fit:cover}
.cmdj-post-card-body{padding:22px}
.cmdj-post-card-body h2{font-size:22px;margin:0 0 10px}
.cmdj-post-card-date{font-size:13px;color:#999;margin:0 0 6px;text-transform:uppercase;letter-spacing:1px}
.cmdj-single{max-width:900px}
.cmdj-single-thumb{margin-bottom:30px}
.cmdj-single-content{font-size:16px}
.cmdj-single-content img{height:auto}
.cmdj-backlink{font-weight:500;color:#111;text-decoration:underline}
.nav-links{display:flex;gap:15px;margin-top:40px}

/* ==========================================================================
   Mobil
   ========================================================================== */
@media (max-width:991px){
	.cmdj-topbar{display:none}

	.cmdj-menubar{top:0}
	.cmdj-menubar-inner{min-height:80px;padding:0 20px}
	.cmdj-logo{display:inline-block}
	.cmdj-logo img{width:48px;height:48px}
	.cmdj-nav{display:none}
	.cmdj-burger{display:block}

	.cm-copy section{padding:60px 0;scroll-margin-top:70px}
	.cm-copy .cm-copy-hero{aspect-ratio:auto;min-height:560px;background-size:cover;background-position:center}
	.cm-copy .cm-copy-hero-title{flex-direction:column;gap:14px;bottom:6%}
	.cm-copy .cm-copy-hero-title span{font-size:28px;width:auto!important;padding:0 25px}
	.cm-copy .cm-copy-hero-title .cm-copy-hero-left,.cm-copy .cm-copy-hero-title .cm-copy-hero-right{text-align:center}
	.cm-copy .cm-copy-social{top:110px}
	.cm-copy .cm-copy-social-link{width:38px;height:38px;font-size:15px}
	.cm-copy .cm-copy-grid-2,.cm-copy .cm-copy-galeria-grid{grid-template-columns:1fr}
	.cm-copy .cm-copy-elonyok .cm-copy-bigtitle{font-size:56px}
	.cm-copy .cm-copy-kapcsolat-bar{flex-direction:column;gap:10px;padding:20px 25px}
	.cm-copy h2{font-size:30px}

	.cmdj-footer-bigtitle{font-size:56px}
	.cmdj-footer-quote{padding:0;text-align:left}
	.cmdj-footer-cols{grid-template-columns:1fr}

	.cmdj-post-list{grid-template-columns:1fr}
	.cmdj-page-title{font-size:30px}
}