/* ===== Art-Neon — modern rebuild stylesheet (no legacy theme CSS used) ===== */

:root{
	--bg:#ffffff;
	--ink:#1a1a1a;
	--ink-soft:#5c5c5c;
	--ink-faint:#8a8a8a;
	--line:#e9e7e2;
	--accent:#d9772f;
	--accent-dark:#b85f22;
	--accent-soft:#fbeee0;
	--dark:#15161a;
	--dark-soft:#22242b;
	--radius:12px;
	--maxw:1180px;
	--font-h:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
	--font-b:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
	margin:0; padding:0;
	font-family:var(--font-b);
	color:var(--ink);
	background:var(--bg);
	font-size:16px;
	line-height:1.6;
	-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ font-family:var(--font-h); font-weight:800; line-height:1.2; margin:0 0 .5em 0; }
a{ color:var(--accent-dark); text-decoration:none; }
a:hover{ color:var(--accent); }
img{ max-width:100%; display:block; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.btn{
	display:inline-flex; align-items:center; gap:8px;
	background:var(--accent); color:#fff; border:none;
	font-family:var(--font-h); font-weight:700; font-size:15px;
	padding:13px 26px; border-radius:999px; cursor:pointer;
	transition:background .15s ease, transform .15s ease;
}
.btn:hover{ background:var(--accent-dark); color:#fff; transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.5); }
.btn-ghost:hover{ background:rgba(255,255,255,.12); color:#fff; border-color:#fff; }
.btn-line{ background:transparent; color:var(--accent-dark); border:1.5px solid var(--line); }
.btn-line:hover{ background:var(--accent-soft); color:var(--accent-dark); border-color:var(--accent); }

/* ---------- top bar + header ---------- */
.topbar{ background:var(--dark); color:#c7c8cd; font-size:13px; }
.topbar .wrap{ display:flex; justify-content:space-between; align-items:center; padding:8px 24px; flex-wrap:wrap; gap:6px; }
.topbar a{ color:#c7c8cd; }
.topbar a:hover{ color:#fff; }
.topbar .phones{ display:flex; gap:14px; flex-wrap:wrap; }
@media (max-width:680px){ .topbar{ display:none; } }

header.site-header{ background:var(--dark); position:sticky; top:0; z-index:100; border-bottom:1px solid rgba(255,255,255,.07); }
.header-wrap{ max-width:1440px; margin:0 auto; }
.header-row{ display:flex; align-items:center; padding:14px 24px; }
.logo{ display:flex; align-items:center; gap:10px; color:#fff; font-family:var(--font-h); font-weight:800; font-size:19px; letter-spacing:.3px; flex-shrink:0; margin-right:40px; }
.logo img{ height:38px; width:38px; border-radius:50%; }
.logo .accent{ color:var(--accent); }

nav.mainnav{ display:flex; align-items:center; gap:2px; flex:1 1 auto; min-width:0; }
nav.mainnav > ul{ display:flex; list-style:none; margin:0; padding:0; gap:2px; }
nav.mainnav > ul > li{ position:relative; }
nav.mainnav > ul > li > a{
	display:block; color:#e7e7ea; font-family:var(--font-h); font-weight:600; font-size:14px;
	padding:12px 11px; border-radius:8px; white-space:nowrap;
}
nav.mainnav > ul > li > a:hover, nav.mainnav > ul > li.open > a{ background:rgba(255,255,255,.08); color:#fff; }

.dropdown{
	position:absolute; left:0; top:100%; margin-top:6px;
	background:#fff; border-radius:10px; box-shadow:0 18px 40px rgba(0,0,0,.18);
	min-width:260px; padding:10px; display:none; z-index:50;
}
li.open .dropdown, nav.mainnav li.has-dd:hover .dropdown{ display:block; }
.dropdown a{ display:block; padding:9px 12px; border-radius:6px; color:var(--ink); font-size:14px; }
.dropdown a:hover{ background:var(--accent-soft); color:var(--accent-dark); }
.dropdown .dd-group + .dd-group{ margin-top:2px; border-top:1px solid var(--line); padding-top:6px; }

.header-cta{ display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.header-cta .phone{ color:#fff; font-weight:700; font-family:var(--font-h); font-size:14.5px; display:none; }
.burger{ display:none; background:none; border:none; color:#fff; font-size:22px; cursor:pointer; padding:4px 6px; line-height:1; }
.nav-close{ display:none; }

@media (max-width:1360px){
	.header-row{ padding:12px 16px; gap:10px; }
	.logo{ font-size:16px; }
	.logo img{ height:32px; width:32px; }
	nav.mainnav{ display:none; }
	.header-cta .btn{ display:none; }
	.burger{ display:block; }
	body.nav-open nav.mainnav{
		display:block; position:fixed; inset:0; top:0; background:var(--dark); z-index:200;
		overflow-y:auto; padding:70px 20px 40px;
	}
	body.nav-open nav.mainnav > ul{ flex-direction:column; gap:0; }
	body.nav-open nav.mainnav > ul > li > a{ padding:14px 4px; border-bottom:1px solid rgba(255,255,255,.08); border-radius:0; font-size:16px; }
	body.nav-open .dropdown{ display:block; position:static; box-shadow:none; background:rgba(255,255,255,.04); margin:4px 0 8px; padding:6px; }
	body.nav-open .dropdown a{ color:#dcdce0; }
	body.nav-open .dropdown a:hover{ background:rgba(255,255,255,.08); color:#fff; }
	body.nav-open .nav-close{
		display:block; position:fixed; top:16px; right:16px; z-index:201;
		background:none; border:none; color:#fff; font-size:30px; line-height:1;
	}
	body.nav-open{ overflow:hidden; }
}

/* ---------- breadcrumb ---------- */
.breadcrumb{ font-size:13px; color:var(--ink-faint); padding:16px 0; }
.breadcrumb a{ color:var(--ink-faint); }
.breadcrumb a:hover{ color:var(--accent-dark); }
.breadcrumb .sep{ margin:0 6px; }

/* ---------- home hero ---------- */
.hero{
	background:linear-gradient(160deg,var(--dark) 0%,var(--dark-soft) 100%);
	color:#fff; padding:80px 0 90px; position:relative; overflow:hidden;
}
.hero::after{
	content:""; position:absolute; right:-120px; top:-120px; width:420px; height:420px; border-radius:50%;
	background:radial-gradient(circle,rgba(217,119,47,.35),transparent 70%);
}
.hero .wrap{ position:relative; }
.hero h1{ font-size:clamp(30px,4.5vw,46px); max-width:820px; color:#fff; }
.hero p{ font-size:18px; color:#c7c8cd; max-width:640px; margin-bottom:28px; }
.hero .hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- section titles ---------- */
.section{ padding:64px 0; }
.section-head{ margin-bottom:32px; }
.section-head .eyebrow{ color:var(--accent-dark); font-family:var(--font-h); font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:1.2px; margin-bottom:6px; display:block; }
.section-head h2{ font-size:clamp(24px,3vw,32px); margin:0; }
.section-alt{ background:#faf9f7; }

/* ---------- photo card grid (categories) ---------- */
.card-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.card-grid.cols-3{ grid-template-columns:repeat(3,1fr); }
.card-grid.cols-2{ grid-template-columns:repeat(2,1fr); }
@media (max-width:900px){ .card-grid, .card-grid.cols-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .card-grid, .card-grid.cols-3, .card-grid.cols-2{ grid-template-columns:1fr; } }

.photo-card{
	position:relative; display:block; border-radius:var(--radius); overflow:hidden;
	aspect-ratio:4/3; background:var(--dark-soft);
}
.photo-card img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.photo-card:hover img{ transform:scale(1.06); }
.photo-card::before{
	content:""; position:absolute; inset:0;
	background:linear-gradient(0deg,rgba(10,10,12,.82) 0%,rgba(10,10,12,.15) 55%,rgba(10,10,12,0) 100%);
}
.photo-card .label{
	position:absolute; left:0; right:0; bottom:0; padding:18px;
	color:#fff; font-family:var(--font-h); font-weight:700; font-size:16px;
}
.photo-card .label span{ display:inline-flex; align-items:center; gap:6px; }

/* ---------- about + clients ---------- */
.about-text{ max-width:760px; color:var(--ink-soft); font-size:16.5px; }
.clients-strip{ display:flex; gap:36px; overflow-x:auto; padding:8px 2px 4px; -ms-overflow-style:none; scrollbar-width:none; }
.clients-strip::-webkit-scrollbar{ display:none; }
.clients-strip img{ height:52px; width:auto; flex:0 0 auto; filter:grayscale(1); opacity:.65; transition:opacity .2s, filter .2s; }
.clients-strip img:hover{ filter:grayscale(0); opacity:1; }

/* ---------- article page ---------- */
.article-hero{ background:var(--dark); color:#fff; padding:46px 0 40px; }
.article-hero h1{ color:#fff; font-size:clamp(26px,3.6vw,36px); max-width:820px; }
.article-body{ max-width:760px; }
.article-body p{ color:var(--ink-soft); font-size:16.5px; margin:0 0 18px 0; }
.price-card{
	background:var(--accent-soft); border:1px solid #f0d8bb; border-radius:var(--radius);
	padding:18px 22px; margin:26px 0; font-family:var(--font-h); font-weight:700; color:var(--accent-dark); font-size:16px;
}
.cta-row{ margin:28px 0 8px; }

/* ---------- gallery ---------- */
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:16px; }
@media (max-width:900px){ .gallery-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
.gallery-grid a{ display:block; border-radius:8px; overflow:hidden; aspect-ratio:1/1; }
.gallery-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .3s ease; cursor:zoom-in; }
.gallery-grid a:hover img{ transform:scale(1.07); }

/* ---------- products ---------- */
.shop-intro{ color:var(--ink-soft); max-width:680px; margin-bottom:32px; }
.product-card{ display:block; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff; transition:box-shadow .2s, transform .2s; }
.product-card:hover{ box-shadow:0 14px 30px rgba(0,0,0,.08); transform:translateY(-2px); }
.product-card .thumb{ aspect-ratio:1/1; overflow:hidden; background:#f4f3f0; }
.product-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.product-card .info{ padding:14px 16px 18px; }
.product-card .name{ font-family:var(--font-h); font-weight:700; font-size:14.5px; color:var(--ink); min-height:38px; }
.product-card .price{ color:var(--accent-dark); font-family:var(--font-h); font-weight:800; margin-top:6px; }

.product-detail{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
@media (max-width:800px){ .product-detail{ grid-template-columns:1fr; } }
.product-detail .thumb{ border-radius:var(--radius); overflow:hidden; background:#f4f3f0; aspect-ratio:4/3; }
.product-detail .thumb img{ width:100%; height:100%; object-fit:cover; }
.product-detail .meta{ color:var(--ink-soft); margin:14px 0; }
.product-detail .price-big{ font-family:var(--font-h); font-weight:800; font-size:30px; color:var(--accent-dark); margin:10px 0 20px; }

/* ---------- contacts ---------- */
.contacts-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:start; }
@media (max-width:860px){ .contacts-grid{ grid-template-columns:1fr; } }
.contact-card{ background:#faf9f7; border:1px solid var(--line); border-radius:var(--radius); padding:28px; }
.contact-card h3{ font-size:18px; margin-bottom:14px; }
.contact-card .row{ display:flex; gap:10px; padding:8px 0; border-top:1px solid var(--line); font-size:15px; }
.contact-card .row:first-of-type{ border-top:none; }
.contact-card .row b{ min-width:110px; color:var(--ink-faint); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.4px; }
.contact-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.map-frame{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); }
.map-frame iframe{ width:100%; height:420px; border:0; display:block; }

/* ---------- footer ---------- */
footer.site-footer{ background:var(--dark); color:#a9aab0; padding:56px 0 26px; margin-top:60px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
.footer-grid h4{ color:#fff; font-size:14px; text-transform:uppercase; letter-spacing:.6px; margin-bottom:14px; }
.footer-grid ul{ list-style:none; margin:0; padding:0; }
.footer-grid li{ margin-bottom:9px; }
.footer-grid a{ color:#a9aab0; font-size:14.5px; }
.footer-grid a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.08); margin-top:40px; padding-top:22px; font-size:13px; color:#75767c; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.footer-bottom a{ color:#a9aab0; }

/* ---------- misc ---------- */
.top-link{ position:fixed; right:22px; bottom:22px; background:var(--dark); color:#fff; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 20px rgba(0,0,0,.25); opacity:0; pointer-events:none; transition:opacity .2s; z-index:60; }
.top-link.show{ opacity:1; pointer-events:auto; }
.icon{ width:18px; height:18px; display:inline-block; vertical-align:-3px; }
