/* ==========================================================================
   Arch Deco Co — Design System
   A ground-up visual redesign for a premium interior design studio.
   Loaded after the legacy stylesheets so it takes over the visual layer;
   the underlying PHP/HTML structure this sits on top of is unchanged.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Jost:wght@300;400;500;600&display=swap');

:root{
	/* Palette — warm, neutral, editorial. One accent, used sparingly. */
	--c-bg:          #FAF7F2;
	--c-bg-alt:      #F1ECE3;
	--c-ink:         #211E1A;
	--c-ink-soft:    #5B564E;
	--c-line:        #E1D9CB;
	--c-dark:        #17140F;
	--c-dark-soft:   #2A251E;
	--c-cream-on-dark: #EDE7DC;
	--c-muted-on-dark: #A79E8E;
	--c-accent:      #A9714B;
	--c-accent-soft: #C79A6F;

	/* Type */
	--f-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--f-sans:  'Jost', 'Helvetica Neue', Arial, sans-serif;

	/* Rhythm */
	--container: 1320px;
	--gutter: clamp(20px, 5vw, 64px);
	--section-y: clamp(64px, 10vw, 140px);
	--radius: 2px;
	--ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset / base ---------- */
*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body.ads-redesign{
	background:var(--c-bg);
	color:var(--c-ink);
	font-family:var(--f-sans);
	font-weight:300;
	font-size:16px;
	line-height:1.7;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	overflow-x:hidden;
	margin:0;
}
.ads-redesign img{ max-width:100%; display:block; }
.ads-redesign a{ color:inherit; text-decoration:none; }
.ads-redesign ul{ list-style:none; margin:0; padding:0; }
.ads-redesign h1,.ads-redesign h2,.ads-redesign h3,.ads-redesign h4{
	font-family:var(--f-serif);
	font-weight:500;
	letter-spacing:.01em;
	margin:0;
	color:var(--c-ink);
}
.ads-redesign b, .ads-redesign strong{ font-weight:500; }

.ads-container{
	max-width:var(--container);
	margin:0 auto;
	padding-left:var(--gutter);
	padding-right:var(--gutter);
}

.ads-eyebrow{
	font-family:var(--f-sans);
	font-size:12px;
	font-weight:500;
	letter-spacing:.28em;
	text-transform:uppercase;
	color:var(--c-accent);
	display:inline-block;
	margin-bottom:18px;
}
.ads-eyebrow.on-dark{ color:var(--c-accent-soft); }

.ads-h1{ font-size:clamp(40px, 6vw, 76px); line-height:1.06; font-weight:400; }
.ads-h2{ font-size:clamp(30px, 4vw, 48px); line-height:1.14; }
.ads-h3{ font-size:clamp(22px, 2.4vw, 28px); line-height:1.3; }
.ads-lede{ font-family:var(--f-serif); font-size:clamp(18px,2vw,22px); font-weight:400; color:var(--c-ink-soft); line-height:1.6; }

.ads-btn{
	display:inline-flex;
	align-items:center;
	gap:12px;
	font-family:var(--f-sans);
	font-size:12px;
	font-weight:500;
	letter-spacing:.2em;
	text-transform:uppercase;
	padding:16px 30px;
	border:1px solid var(--c-ink);
	color:var(--c-ink);
	background:transparent;
	position:relative;
	overflow:hidden;
	transition:color .45s var(--ease), border-color .45s var(--ease);
	cursor:pointer;
}
.ads-btn::before{
	content:"";
	position:absolute; top:0; right:0; bottom:0; left:0;
	background:var(--c-ink);
	transform:translateY(101%);
	transition:transform .45s var(--ease);
	z-index:0;
}
.ads-btn span{ position:relative; z-index:1; display:inline-flex; align-items:center; gap:10px; transition:color .45s var(--ease); }
.ads-btn:hover{ border-color:var(--c-ink); }
.ads-btn:hover::before{ transform:translateY(0); }
.ads-btn:hover span{ color:var(--c-bg); }
.ads-btn.light{ border-color:rgba(255,255,255,.55); color:#fff; }
.ads-btn.light::before{ background:#fff; }
.ads-btn.light:hover span{ color:var(--c-dark); }

/* ---------- Reveal-on-scroll ----------
   Content is always visible by default - this is a purely additive
   progressive enhancement, never a requirement for visibility. JS adds
   the "is-armed" class only once it has successfully created a working
   IntersectionObserver for a given element, immediately followed by
   observation; if JS never runs, throws, or the observer is unsupported,
   elements simply stay at their normal, fully visible state. */
.ads-reveal.is-armed{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.ads-reveal.is-armed.is-visible{ opacity:1; transform:translateY(0); }
.ads-reveal.d1{ transition-delay:.08s; } .ads-reveal.d2{ transition-delay:.16s; } .ads-reveal.d3{ transition-delay:.24s; } .ads-reveal.d4{ transition-delay:.32s; }

/* ==========================================================================
   NAV
   ========================================================================== */
.ads-nav{
	position:fixed; top:0; left:0; right:0; z-index:1000;
	display:flex; align-items:center; justify-content:space-between;
	padding-top:26px; padding-bottom:26px; padding-left:var(--gutter); padding-right:var(--gutter);
	transition:background .4s var(--ease), padding .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
	border-bottom:1px solid transparent;
}
.ads-nav::before{
	content:""; position:absolute; top:0; left:0; right:0; height:160px; z-index:-1;
	background:linear-gradient(180deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 100%);
	pointer-events:none; transition:opacity .4s var(--ease);
}
.ads-nav.is-scrolled::before{ opacity:0; }
.ads-nav.on-light{ background:var(--c-bg); border-bottom-color:var(--c-line); }
.ads-nav.is-scrolled{ padding-top:16px; padding-bottom:16px; background:rgba(250,247,242,.92); backdrop-filter:blur(10px); border-bottom-color:var(--c-line); box-shadow:0 8px 30px rgba(23,20,15,.05); }
.ads-nav.is-scrolled .ads-logo, .ads-nav.is-scrolled .ads-navlink{ color:var(--c-ink) !important; }
.ads-nav.is-scrolled .ads-burger span{ background:var(--c-ink) !important; }

.ads-nav .ads-logo{
	font-family:var(--f-serif); font-size:22px; letter-spacing:.06em; font-weight:500;
	color:#fff;
	display:flex; align-items:center; gap:12px;
}
.ads-nav.on-light .ads-logo{ color:var(--c-ink); }
.ads-logo-mark{ height:26px; width:auto; display:block; flex-shrink:0; }
.ads-footer-brand .ads-logo{ display:flex; align-items:center; gap:12px; }
.ads-footer-brand .ads-logo-mark{ height:24px; }
.ads-logo em{ font-style:normal; color:var(--c-accent-soft); }

.ads-navlinks{ display:flex; align-items:center; gap:42px; }
.ads-navlink{
	font-size:12px; letter-spacing:.18em; text-transform:uppercase; font-weight:500;
	color:#fff; position:relative; padding:4px 0;
}
.ads-nav .ads-navlink{ color:#fff; }
.ads-nav.on-light .ads-navlink{ color:var(--c-ink); }
.ads-navlink::after{
	content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
	background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .4s var(--ease);
}
.ads-navlink:hover::after, .ads-navlink.is-active::after{ transform:scaleX(1); transform-origin:left; }
.ads-navdrop{ position:relative; }
.ads-navdrop-panel{
	position:absolute; top:calc(100% + 18px); left:50%; transform:translateX(-50%);
	background:var(--c-bg); border:1px solid var(--c-line); padding:14px 0; min-width:180px;
	opacity:0; visibility:hidden; transform:translate(-50%,6px); transition:all .3s var(--ease);
	box-shadow:0 20px 40px rgba(23,20,15,.12);
}
.ads-navdrop:hover .ads-navdrop-panel{ opacity:1; visibility:visible; transform:translate(-50%,0); }
.ads-navdrop-panel a{ display:block; padding:10px 24px; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--c-ink); }
.ads-navdrop-panel a:hover{ color:var(--c-accent); }

.ads-navlang{ display:flex; align-items:center; gap:10px; margin-left:8px; }
.ads-navlang img{ height:16px; opacity:.55; transition:opacity .3s; border-radius:1px; }
.ads-navlang a:hover img{ opacity:1; }

.ads-burger{ display:none; flex-direction:column; justify-content:center; width:30px; height:20px; cursor:pointer; z-index:1200; background:none; border:0; padding:0; }
.ads-burger span{ display:block; height:1px; width:100%; background:#fff; transition:all .35s var(--ease); margin-top:8px; }
.ads-burger span:first-child{ margin-top:0; }
.ads-nav.on-light .ads-burger span{ background:var(--c-ink); }

.ads-mobilepanel{
	position:fixed; top:0; right:0; bottom:0; left:0; background:var(--c-dark); z-index:1100;
	display:flex; flex-direction:column; justify-content:center; padding:0 40px;
	transform:translateY(-100%); transition:transform .55s var(--ease);
}
.ads-mobilepanel.is-open{ transform:translateY(0); }
.ads-mobilepanel a{ font-family:var(--f-serif); font-size:34px; color:var(--c-cream-on-dark); padding:14px 0; display:block; border-bottom:1px solid rgba(255,255,255,.08); }
.ads-mobilepanel .ads-mob-sub{ padding-left:20px; }
.ads-mobilepanel .ads-mob-sub a{ font-size:20px; color:var(--c-muted-on-dark); border-bottom:none; padding:8px 0; }
.ads-mobilepanel .ads-navlang{ margin-top:30px; }
.ads-mobilepanel .ads-navlang img{ height:20px; }

body.ads-nav-open{ overflow:hidden; }

/* ==========================================================================
   HERO
   ========================================================================== */
.ads-hero{
	position:relative; min-height:100vh; box-sizing:border-box;
	display:flex; align-items:flex-end;
	padding-top:150px; /* guaranteed clearance under the fixed nav, regardless
	                       of viewport height or content length - the cause of
	                       the kicker/nav collision previously seen here */
	background:var(--c-dark); overflow:hidden;
}

/* ---- Image: starts slightly zoomed in, slowly settles out (Ken Burns) ---- */
.ads-hero-media{
	position:absolute; top:0; right:0; bottom:0; left:0;
	background-size:cover; background-position:center; opacity:.85;
	transform:scale(1.14);
	animation:adsHeroZoomOut 9s cubic-bezier(.25,.46,.45,.94) .3s forwards;
}
.ads-hero-media::after{
	content:""; position:absolute; top:0; right:0; bottom:0; left:0;
	background:linear-gradient(180deg, rgba(23,20,15,.15) 0%, rgba(23,20,15,.35) 55%, rgba(23,20,15,.86) 100%);
}
@keyframes adsHeroZoomOut{ from{ transform:scale(1.14); } to{ transform:scale(1); } }

/* ---- Curtain: elegant single-wipe reveal over the image on load ---- */
.ads-hero-curtain{
	position:absolute; top:0; right:0; bottom:0; left:0; z-index:3;
	background:var(--c-dark);
	animation:adsCurtainReveal 1.5s cubic-bezier(.76,0,.24,1) .15s forwards;
}
@keyframes adsCurtainReveal{ from{ transform:translateX(0); } to{ transform:translateX(101%); } }

.ads-hero-inner{ position:relative; z-index:2; padding-left:var(--gutter); padding-right:var(--gutter); padding-bottom:96px; width:100%; }

/* ---- Choreographed text sequence: kicker -> headline -> line -> sub -> cta ---- */
.ads-hero-kicker{ color:var(--c-accent-soft); font-size:12px; letter-spacing:.32em; text-transform:uppercase; margin-bottom:22px; opacity:0; animation:adsFadeUp .9s var(--ease) .95s forwards; }
.ads-hero h1{ color:#fff; opacity:0; animation:adsHeadlineIn 1.1s var(--ease) 1.2s forwards; max-width:16ch; }
.ads-hero-line{ display:block; width:0; height:1px; background:var(--c-accent-soft); margin:28px 0 24px; animation:adsLineExpand .9s var(--ease) 1.95s forwards; }
.ads-hero-sub{ color:var(--c-cream-on-dark); font-family:var(--f-serif); font-size:clamp(17px,1.6vw,20px); max-width:46ch; opacity:0; animation:adsFadeUp 1s var(--ease) 2.25s forwards; }
.ads-hero-cta{ margin-top:40px; opacity:0; animation:adsFadeUp 1s var(--ease) 2.6s forwards; display:flex; gap:18px; flex-wrap:wrap; }
.ads-hero-scroll{
	position:absolute; right:var(--gutter); bottom:40px; z-index:2; color:var(--c-muted-on-dark);
	font-size:11px; letter-spacing:.2em; text-transform:uppercase; display:flex; align-items:center; gap:12px;
	opacity:0; animation:adsFadeUp 1.1s var(--ease) 2.9s forwards;
}
.ads-hero-scroll .line{ width:1px; height:40px; background:rgba(255,255,255,.35); position:relative; overflow:hidden; }
.ads-hero-scroll .line::after{ content:""; position:absolute; top:-100%; left:0; width:100%; height:100%; background:#fff; animation:adsScrollLine 2.2s ease-in-out infinite; }
@keyframes adsScrollLine{ 0%{top:-100%;} 60%{top:100%;} 100%{top:100%;} }
@keyframes adsFadeUp{ from{ opacity:0; transform:translateY(22px);} to{ opacity:1; transform:translateY(0);} }
@keyframes adsHeadlineIn{ from{ opacity:0; transform:translateY(38px);} to{ opacity:1; transform:translateY(0);} }
@keyframes adsLineExpand{ from{ width:0; } to{ width:120px; } }

@media (prefers-reduced-motion: reduce){
	.ads-hero-media, .ads-hero-curtain, .ads-hero-kicker, .ads-hero h1, .ads-hero-line, .ads-hero-sub, .ads-hero-cta, .ads-hero-scroll{
		animation:none !important; opacity:1 !important; transform:none !important; width:auto !important;
	}
	.ads-hero-curtain{ display:none; }
}

/* ==========================================================================
   PAGE HEADER (interior pages: about/contact/press/projects)
   ========================================================================== */
.ads-pagehead{
	position:relative; padding-top:210px; padding-bottom:90px; padding-left:var(--gutter); padding-right:var(--gutter); background:var(--c-dark); overflow:hidden;
}
.ads-pagehead-media{ position:absolute; top:0; right:0; bottom:0; left:0; background-size:cover; background-position:center; opacity:.38; }
.ads-pagehead-media::after{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(180deg, rgba(23,20,15,.55), rgba(23,20,15,.92)); }
.ads-pagehead-inner{ position:relative; z-index:2; }
.ads-pagehead h1{ color:#fff; }
.ads-pagehead-sub{ color:var(--c-muted-on-dark); font-family:var(--f-serif); font-size:19px; margin-top:16px; max-width:60ch; }
.ads-crumb{ color:var(--c-muted-on-dark); font-size:12px; letter-spacing:.14em; text-transform:uppercase; margin-top:26px; }
.ads-crumb a{ color:var(--c-accent-soft); }

/* ==========================================================================
   SECTIONS / GENERIC
   ========================================================================== */
.ads-section{ padding:var(--section-y) 0; }
.ads-section.on-dark{ background:var(--c-dark); color:var(--c-cream-on-dark); }
.ads-section.on-dark h1,.ads-section.on-dark h2,.ads-section.on-dark h3{ color:#fff; }
.ads-section.alt{ background:var(--c-bg-alt); }
.ads-section-head{ max-width:760px; margin-bottom:64px; }
.ads-section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.ads-section-foot{ margin-top:56px; display:flex; justify-content:center; }

.ads-divider{ height:1px; background:var(--c-line); border:0; margin:0; }

/* ---------- Split intro (About teaser on home) ---------- */
.ads-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,110px); align-items:center; }
.ads-split-media{ position:relative; overflow:hidden; background-size:cover; background-position:center; transition:transform 1.2s var(--ease); }
.ads-split-media::before{ content:""; display:block; padding-top:125%; }
.ads-split-media:hover{ transform:scale(1.03); }
.ads-split-media .ads-frame{ position:absolute; inset:22px; border:1px solid rgba(255,255,255,.5); pointer-events:none; z-index:2; }
.ads-split-num{ position:absolute; bottom:24px; left:24px; z-index:2; font-family:var(--f-serif); font-size:14px; color:#fff; letter-spacing:.1em; }
.ads-split-text p{ color:var(--c-ink-soft); margin:22px 0 0; }
.ads-stat-row{ display:flex; gap:48px; margin-top:44px; }
.ads-stat b{ display:block; font-family:var(--f-serif); font-size:40px; color:var(--c-accent); font-weight:500; }
.ads-stat span{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--c-ink-soft); }

/* ---------- Project grid (home + project pages) ---------- */
.ads-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--gutter); }
.ads-card{ position:relative; display:block; overflow:hidden; background:var(--c-bg-alt); }
.ads-card-media{ position:relative; overflow:hidden; background-size:cover; background-position:center; transition:transform 1.1s var(--ease), filter .6s; filter:saturate(.94); }
.ads-card-media::before{ content:""; display:block; padding-top:125%; }
.ads-card:hover .ads-card-media{ transform:scale(1.08); filter:saturate(1.05); }
.ads-card-media::after{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(180deg, rgba(23,20,15,0) 45%, rgba(23,20,15,.82) 100%); opacity:0; transition:opacity .5s var(--ease); }
.ads-card:hover .ads-card-media::after{ opacity:1; }
.ads-card-info{ position:absolute; left:0; right:0; bottom:0; padding:26px; z-index:2; }
.ads-card-tag{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--c-accent-soft); opacity:0; transform:translateY(8px); transition:all .5s var(--ease) .05s; }
.ads-card-title{ font-family:var(--f-serif); font-size:23px; color:#fff; margin-top:8px; opacity:0; transform:translateY(8px); transition:all .5s var(--ease) .1s; }
.ads-card:hover .ads-card-tag, .ads-card:hover .ads-card-title{ opacity:1; transform:translateY(0); }
.ads-card-static{ padding:22px 4px 0; }
.ads-card-static .name{ font-family:var(--f-serif); font-size:19px; }
.ads-card-static .meta{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--c-ink-soft); margin-top:6px; }

/* Featured grid on homepage: first item spans 2 cols on desktop for editorial rhythm */
.ads-grid.featured > a:first-child{ grid-column:span 2; }
.ads-grid.featured > a:first-child .ads-card-media::before{ padding-top:62.5%; }

/* ---------- Services / approach ---------- */
.ads-approach{ display:grid; grid-template-columns:repeat(3,1fr); gap:56px; }
.ads-approach-item .num{ font-family:var(--f-serif); font-size:15px; color:var(--c-accent); margin-bottom:18px; display:block; }
.ads-approach-item h3{ margin-bottom:14px; }
.ads-approach-item p{ color:var(--c-ink-soft); font-size:15px; }
.on-dark .ads-approach-item p{ color:var(--c-muted-on-dark); }

/* ---------- CTA band ---------- */
.ads-cta{ position:relative; padding-top:120px; padding-bottom:120px; padding-left:var(--gutter); padding-right:var(--gutter); text-align:center; background:var(--c-dark); overflow:hidden; }
.ads-cta-media{ position:absolute; top:0; right:0; bottom:0; left:0; background-size:cover; background-position:center; opacity:.25; }
.ads-cta-media::after{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:radial-gradient(ellipse at center, rgba(23,20,15,.55), rgba(23,20,15,.94)); }
.ads-cta-inner{ position:relative; z-index:2; max-width:680px; margin:0 auto; }
.ads-cta h2{ color:#fff; }
.ads-cta p{ color:var(--c-muted-on-dark); margin-top:18px; font-family:var(--f-serif); font-size:18px; }
.ads-cta .ads-btn{ margin-top:36px; }

/* ==========================================================================
   PAGE-SPECIFIC: ABOUT
   ========================================================================== */
.ads-about-lede{ max-width:900px; }
.ads-about-body{ display:grid; grid-template-columns:220px 1fr; gap:80px; margin-top:70px; }
.ads-about-body .label{ font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--c-accent); padding-top:6px; }
.ads-about-copy p{ color:var(--c-ink-soft); margin:0 0 26px; font-size:16px; max-width:70ch; }
.ads-about-copy b{ color:var(--c-ink); font-family:var(--f-serif); font-size:20px; font-weight:500; display:block; margin-bottom:14px; }

.ads-founder{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(30px,6vw,100px); align-items:center; margin-top:var(--section-y); }

/* ==========================================================================
   PAGE-SPECIFIC: CONTACT
   ========================================================================== */
.ads-contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,110px); align-items:start; }
.ads-contact-list{ margin-top:36px; }
.ads-contact-item{ padding:26px 0; border-top:1px solid var(--c-line); }
.ads-contact-item:last-child{ border-bottom:1px solid var(--c-line); }
.ads-contact-item .label{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--c-ink-soft); margin-bottom:8px; }
.ads-contact-item .value{ font-family:var(--f-serif); font-size:21px; }
.ads-contact-item a.value:hover{ color:var(--c-accent); }
.ads-contact-map{ position:relative; overflow:hidden; background:var(--c-bg-alt); background-size:cover; background-position:center; filter:grayscale(.4) contrast(1.05); }
.ads-contact-map::before{ content:""; display:block; padding-top:77.5%; }
.ads-social{ display:flex; gap:16px; margin-top:34px; }
.ads-social a{ width:42px; height:42px; border:1px solid var(--c-line); display:flex; align-items:center; justify-content:center; transition:all .3s var(--ease); }
.ads-social a:hover{ background:var(--c-ink); border-color:var(--c-ink); color:#fff; }

/* ==========================================================================
   PAGE-SPECIFIC: PRESS
   ========================================================================== */
.ads-press-grid{ column-count:3; column-gap:var(--gutter); }
.ads-press-item{ break-inside:avoid; margin-bottom:var(--gutter); position:relative; overflow:hidden; cursor:pointer; }
.ads-press-item img{ width:100%; transition:transform 1s var(--ease), filter .5s; }
.ads-press-item:hover img{ transform:scale(1.045); filter:saturate(1.08); }
.ads-press-item::after{ content:"+"; position:absolute; top:20px; right:20px; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.9); color:var(--c-ink); display:flex; align-items:center; justify-content:center; font-size:18px; opacity:0; transform:scale(.7); transition:all .35s var(--ease); }
.ads-press-item:hover::after{ opacity:1; transform:scale(1); }

/* ==========================================================================
   PAGE-SPECIFIC: PROJECT LISTING
   ========================================================================== */
.ads-projtabs{ display:flex; gap:14px; margin-bottom:52px; flex-wrap:wrap; }
.ads-projtab{
	font-size:11px; letter-spacing:.18em; text-transform:uppercase; padding:12px 26px;
	border:1px solid var(--c-line); color:var(--c-ink-soft); transition:all .3s var(--ease);
}
.ads-projtab.is-active, .ads-projtab:hover{ background:var(--c-ink); border-color:var(--c-ink); color:#fff; }
.ads-empty{ padding:60px 0; color:var(--c-ink-soft); font-family:var(--f-serif); font-size:19px; }

/* ==========================================================================
   LIGHTBOX
   ========================================================================== */
.ads-lightbox{
	position:fixed; top:0; right:0; bottom:0; left:0; z-index:2000; background:rgba(15,13,10,.97);
	display:flex; align-items:center; justify-content:center;
	opacity:0; visibility:hidden; transition:opacity .4s var(--ease);
}
.ads-lightbox.is-open{ opacity:1; visibility:visible; }
.ads-lightbox-stage{ position:relative; max-width:88vw; max-height:82vh; }
.ads-lightbox-stage img{ max-width:88vw; max-height:82vh; width:auto; height:auto; object-fit:contain; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.ads-lightbox-cap{ text-align:center; color:var(--c-muted-on-dark); font-family:var(--f-serif); font-size:16px; margin-top:20px; }
.ads-lightbox-close, .ads-lightbox-prev, .ads-lightbox-next{
	position:absolute; background:none; border:1px solid rgba(255,255,255,.25); color:#fff; cursor:pointer;
	display:flex; align-items:center; justify-content:center; transition:all .3s var(--ease);
	font-family:var(--f-sans); font-size:18px;
}
.ads-lightbox-close:hover, .ads-lightbox-prev:hover, .ads-lightbox-next:hover{ background:#fff; color:var(--c-ink); border-color:#fff; }
.ads-lightbox-close{ top:28px; right:28px; width:46px; height:46px; }
.ads-lightbox-prev, .ads-lightbox-next{ top:50%; transform:translateY(-50%); width:52px; height:52px; }
.ads-lightbox-prev{ left:20px; } .ads-lightbox-next{ right:20px; }
.ads-lightbox-count{ position:absolute; top:32px; left:32px; color:var(--c-muted-on-dark); font-size:12px; letter-spacing:.16em; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.ads-footer{ background:var(--c-dark); color:var(--c-muted-on-dark); padding:96px 0 0; }
.ads-footer-top{ display:grid; grid-template-columns:1.4fr .8fr .8fr 1fr; gap:50px; padding-bottom:70px; border-bottom:1px solid rgba(255,255,255,.09); }
.ads-footer-brand .ads-logo{ color:#fff; }
.ads-footer-brand p{ margin-top:20px; max-width:34ch; font-family:var(--f-serif); font-size:16px; color:var(--c-muted-on-dark); }
.ads-footer h4{ color:#fff; font-family:var(--f-sans); font-size:12px; letter-spacing:.18em; text-transform:uppercase; font-weight:500; margin-bottom:24px; }
.ads-footer-links a{ display:block; padding:7px 0; font-size:14px; color:var(--c-muted-on-dark); transition:color .3s; }
.ads-footer-links a:hover{ color:#fff; }
.ads-footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding:28px 0; font-size:12px; letter-spacing:.03em; flex-wrap:wrap; gap:12px; }
.ads-footer-bottom a{ color:var(--c-muted-on-dark); }
.ads-footer-bottom a:hover{ color:#fff; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1024px){
	.ads-navlinks{ display:none; }
	.ads-burger{ display:flex; }
	.ads-split, .ads-founder{ grid-template-columns:1fr; }
	.ads-founder{ gap:40px; }
	.ads-about-body{ grid-template-columns:1fr; gap:20px; }
	.ads-grid{ grid-template-columns:repeat(2,1fr); }
	.ads-grid.featured > a:first-child{ grid-column:span 2; }
	.ads-approach{ grid-template-columns:1fr 1fr; row-gap:40px; }
	.ads-footer-top{ grid-template-columns:1fr 1fr; row-gap:44px; }
	.ads-press-grid{ column-count:2; }
}

@media (max-width:760px){
	:root{ --section-y:64px; }
	.ads-nav{ padding-top:20px; padding-bottom:20px; padding-left:var(--gutter); padding-right:var(--gutter); }
	.ads-hero{ min-height:100svh; align-items:flex-end; padding-top:110px; }
	.ads-hero-inner{ padding-bottom:64px; }
	.ads-hero h1{ max-width:none; }
	.ads-hero-scroll{ display:none; }
	.ads-pagehead{ padding-top:150px; padding-bottom:60px; padding-left:var(--gutter); padding-right:var(--gutter); }
	.ads-grid{ grid-template-columns:1fr; gap:38px; }
	.ads-grid.featured > a:first-child{ grid-column:span 1; }
	.ads-grid.featured > a:first-child .ads-card-media::before{ padding-top:125%; }
	.ads-card-info{ padding:20px; }
	.ads-card-tag, .ads-card-title{ opacity:1; transform:none; }
	.ads-approach{ grid-template-columns:1fr; gap:36px; }
	.ads-contact-grid{ grid-template-columns:1fr; gap:50px; }
	.ads-stat-row{ gap:32px; }
	.ads-stat b{ font-size:32px; }
	.ads-footer-top{ grid-template-columns:1fr; gap:38px; padding-bottom:44px; }
	.ads-footer{ padding-top:64px; }
	.ads-footer-bottom{ flex-direction:column; align-items:flex-start; }
	.ads-press-grid{ column-count:1; }
	.ads-cta{ padding-top:80px; padding-bottom:80px; padding-left:var(--gutter); padding-right:var(--gutter); }
	.ads-lightbox-stage{ max-width:94vw; max-height:70vh; }
	.ads-lightbox-stage img{ max-width:94vw; max-height:70vh; }
	.ads-lightbox-prev, .ads-lightbox-next{ width:42px; height:42px; }
	.ads-lightbox-prev{ left:8px; } .ads-lightbox-next{ right:8px; }
	.ads-lightbox-close{ top:16px; right:16px; }
	.ads-lightbox-count{ top:18px; left:18px; }
	.ads-projtabs{ gap:10px; }
	.ads-projtab{ padding:10px 18px; font-size:10px; }
}

@media (max-width:400px){
	.ads-h1{ font-size:34px; }
	.ads-hero-inner{ padding-bottom:48px; }
	.ads-btn{ padding:14px 22px; font-size:11px; }
}
