/* ==========================================================================
   Peptide Web Design — design layer
   Elementor Global Colors / Fonts carry the core styling. This file only adds
   what Elementor can't express efficiently: brand motifs, hairline grids,
   hover states, motion and third-party widget skins.
   Breakpoints follow Elementor: tablet ≤1024px, mobile ≤767px.
   ========================================================================== */

:root {
	--pwd-ink: #0F1714;
	--pwd-ink-2: #17221E;
	--pwd-graphite: #2B3330;
	--pwd-slate: #66706B;
	--pwd-paper: #F5F2EB;
	--pwd-bone: #EAE5DA;
	--pwd-rule: #D8D2C4;
	--pwd-rule-dark: rgba(245, 242, 235, .14);
	--pwd-teal: #1F5A50;
	--pwd-mint: #CFE3DA;
	--pwd-signal: #E4572E;
	--pwd-signal-dark: #C9461F;

	--pwd-serif: "Newsreader", Georgia, "Times New Roman", serif;
	--pwd-sans: "Geist", "Helvetica Neue", Arial, sans-serif;
	--pwd-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

	--pwd-ease: cubic-bezier(.2, .7, .1, 1);
	--pwd-fast: .25s;
	--pwd-slow: .9s;
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
::selection { background: var(--pwd-signal); color: var(--pwd-ink); }
:focus-visible { outline: 2px solid var(--pwd-signal); outline-offset: 3px; }
img { height: auto; }

/* Skip link (Hello's) */
.skip-link.screen-reader-text:focus { background: var(--pwd-paper); color: var(--pwd-ink); z-index: 100000; }

/* --------------------------------------------------------------------------
   Type helpers
   -------------------------------------------------------------------------- */

/* Mono section label: "01 — Services" with a bonded node */
.pwd-eyebrow .elementor-heading-title {
	display: inline-flex; align-items: center; gap: 12px;
	font-family: var(--pwd-mono); font-size: 12px; font-weight: 500;
	letter-spacing: .14em; text-transform: uppercase; line-height: 1.2;
}
.pwd-eyebrow .elementor-heading-title::before {
	content: ""; width: 28px; height: 7px; flex: none;
	background:
		radial-gradient(circle at 3.5px 3.5px, currentColor 3px, transparent 3.5px) left center / 7px 7px no-repeat,
		linear-gradient(currentColor, currentColor) 7px center / 21px 1px no-repeat;
	opacity: .9;
}
.pwd-eyebrow--signal .elementor-heading-title { color: var(--pwd-signal); }

/* Italic serif accent inside headings: <em> */
.elementor-heading-title em, .pwd-display em {
	font-family: var(--pwd-serif); font-style: italic; font-weight: 300;
	color: var(--pwd-signal);
}
.pwd-on-light .elementor-heading-title em { color: var(--pwd-teal); }

.pwd-lede, .pwd-lede p { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.55; }
.pwd-mono, .pwd-mono p { font-family: var(--pwd-mono); font-size: 13px; letter-spacing: .04em; }
.pwd-muted, .pwd-muted p { color: var(--pwd-slate); }
.pwd-on-dark .pwd-muted, .pwd-on-dark .pwd-muted p { color: rgba(245, 242, 235, .62); }

/* Long-form text inside text-editor widgets */
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.elementor-widget-text-editor a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.elementor-widget-text-editor a:hover { color: var(--pwd-signal); }

/* --------------------------------------------------------------------------
   Surfaces
   -------------------------------------------------------------------------- */

.pwd-on-dark { color: var(--pwd-paper); }
.pwd-on-dark .elementor-heading-title { color: var(--pwd-paper); }

/* Ink hero with fine lab-grid and a single chain line-drawing */
.pwd-hero { position: relative; isolation: isolate; overflow: hidden; }
.pwd-hero::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background-image:
		linear-gradient(var(--pwd-rule-dark) 1px, transparent 1px),
		linear-gradient(90deg, var(--pwd-rule-dark) 1px, transparent 1px);
	background-size: 96px 96px;
	background-position: center top;
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, #000 30%, transparent 75%);
	        mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, #000 30%, transparent 75%);
	opacity: .55;
}
.pwd-hero--chain::after {
	content: ""; position: absolute; right: -6%; bottom: -36px; width: 52%; height: 150px; z-index: -1; pointer-events: none;
	background: url("../img/art/chain-line.svg") right center / contain no-repeat;
	opacity: .5;
	animation: pwd-drift 24s ease-in-out infinite alternate;
}
@keyframes pwd-drift { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-3%, -6px, 0); } }

/* Hairline divider with chain nodes, used as a section separator */
.pwd-chain-rule { height: 9px; background: url("../img/art/chain-rule.svg") left center / auto 9px repeat-x; opacity: .45; }
.pwd-on-dark .pwd-chain-rule, .pwd-chain-rule--light { filter: invert(1); opacity: .25; }

/* Page hero (inner pages) */
.pwd-page-hero .pwd-breadcrumb, .pwd-page-hero .pwd-breadcrumb a { font-family: var(--pwd-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: rgba(245, 242, 235, .55); text-decoration: none; }
.pwd-page-hero .pwd-breadcrumb a:hover { color: var(--pwd-paper); }

/* --------------------------------------------------------------------------
   Buttons — base styling comes from Kit > Buttons; variants below
   -------------------------------------------------------------------------- */

.elementor-button { transition: background-color var(--pwd-fast) var(--pwd-ease), color var(--pwd-fast) var(--pwd-ease), border-color var(--pwd-fast) var(--pwd-ease); }
.elementor-button .elementor-button-icon svg { width: 1em; transition: transform var(--pwd-fast) var(--pwd-ease); }
.elementor-button:hover .elementor-button-icon svg { transform: translateX(4px); }

.pwd-btn-ghost .elementor-button {
	background: transparent !important; color: currentColor !important;
	box-shadow: inset 0 0 0 1px currentColor;
}
.pwd-on-dark .pwd-btn-ghost .elementor-button { color: var(--pwd-paper) !important; box-shadow: inset 0 0 0 1px rgba(245, 242, 235, .35); }
.pwd-btn-ghost .elementor-button:hover { background: var(--pwd-ink) !important; color: var(--pwd-paper) !important; box-shadow: inset 0 0 0 1px var(--pwd-ink); }
.pwd-on-dark .pwd-btn-ghost .elementor-button:hover { background: var(--pwd-paper) !important; color: var(--pwd-ink) !important; }

.pwd-btn-ink .elementor-button { background: var(--pwd-ink) !important; color: var(--pwd-paper) !important; }
.pwd-btn-ink .elementor-button:hover { background: var(--pwd-teal) !important; }

/* Text link with arrow */
.pwd-link .elementor-button {
	background: none !important; padding: 0 !important; color: currentColor !important;
	border-bottom: 1px solid currentColor; border-radius: 0; padding-bottom: 4px !important;
}
.pwd-link .elementor-button:hover { color: var(--pwd-signal) !important; }

/* --------------------------------------------------------------------------
   Hairline grids (services, values, capabilities)
   Grid containers get .pwd-grid; children are .pwd-cell.
   -------------------------------------------------------------------------- */

.pwd-grid.e-con { --gap: 0px 0px; --row-gap: 0px; --column-gap: 0px; border-top: 1px solid var(--pwd-rule); border-left: 1px solid var(--pwd-rule); }
.pwd-grid > .pwd-cell, .pwd-grid > .e-con-inner > .pwd-cell { border-right: 1px solid var(--pwd-rule); border-bottom: 1px solid var(--pwd-rule); }
.pwd-on-dark .pwd-grid.e-con, .pwd-grid--dark.e-con { border-color: var(--pwd-rule-dark); }
.pwd-on-dark .pwd-grid > .pwd-cell, .pwd-grid--dark > .pwd-cell { border-color: var(--pwd-rule-dark); }

.pwd-cell { position: relative; transition: background-color .4s var(--pwd-ease); }
.pwd-cell .pwd-index .elementor-heading-title { font-family: var(--pwd-mono); font-size: 12px; letter-spacing: .12em; color: var(--pwd-slate); }

/* Service cell: full-cell link, icon nudges, arrow appears */
.pwd-service.e-con { text-decoration: none; color: inherit; }
.pwd-service .elementor-icon svg, .pwd-service .elementor-widget-image img { transition: transform .5s var(--pwd-ease); }
.pwd-service .pwd-arrow { opacity: 0; transform: translate(-8px, 0); transition: opacity var(--pwd-fast) var(--pwd-ease), transform var(--pwd-fast) var(--pwd-ease); }
.pwd-service:hover { background-color: var(--pwd-paper); }
.pwd-on-dark .pwd-service:hover { background-color: var(--pwd-ink-2); }
.pwd-service:hover .pwd-arrow { opacity: 1; transform: none; }
.pwd-service:hover .elementor-widget-image img { transform: translateY(-3px); }
.pwd-service::after {
	content: ""; position: absolute; left: -1px; top: -1px; width: 0; height: 2px; background: var(--pwd-signal);
	transition: width .5s var(--pwd-ease);
}
.pwd-service:hover::after { width: calc(100% + 1px); }

.pwd-icon img { width: 44px; height: 44px; }
.pwd-on-dark .pwd-icon img { filter: invert(1) brightness(1.4); }

/* Rule list: rows separated by hairlines (used for "challenges", "benefits") */
.pwd-rows > .e-con, .pwd-rows > .elementor-element { border-top: 1px solid var(--pwd-rule); }
.pwd-rows > :last-child { border-bottom: 1px solid var(--pwd-rule); }
.pwd-on-dark .pwd-rows > .e-con, .pwd-on-dark .pwd-rows > .elementor-element { border-color: var(--pwd-rule-dark); }

/* Icon list as spec list */
.pwd-spec .elementor-icon-list-item { padding: 12px 0 !important; border-bottom: 1px solid var(--pwd-rule); align-items: baseline !important; }
.pwd-spec .elementor-icon-list-icon{ inset-block-start: 10px; }
.pwd-on-dark .pwd-spec .elementor-icon-list-item { border-color: var(--pwd-rule-dark); }
.pwd-spec .elementor-icon-list-icon svg { width: 10px !important; fill: var(--pwd-signal) !important; }

/* --------------------------------------------------------------------------
   Process — numbered steps on a bonded line
   -------------------------------------------------------------------------- */

.pwd-steps.e-con { position: relative; }
.pwd-step.e-con { position: relative; padding-top: 40px; }
.pwd-step::before {
	content: ""; position: absolute; top: 6px; left: 0; width: 13px; height: 13px; border-radius: 50%;
	border: 1px solid var(--pwd-signal); background: var(--pwd-ink); z-index: 1;
	transition: background-color .4s var(--pwd-ease);
}
.pwd-on-light .pwd-step::before { background: var(--pwd-paper); }
.pwd-step::after { content: ""; position: absolute; top: 12px; left: 13px; right: -24px; height: 1px; background: currentColor; opacity: .2; }
.pwd-step:last-child::after { display: none; }
.pwd-step:hover::before { background: var(--pwd-signal); }
@media (max-width: 1024px) {
	.pwd-step.e-con { padding-top: 0; padding-left: 36px; }
	.pwd-step::before { top: 4px; }
	.pwd-step::after { top: 17px; left: 6px; right: auto; bottom: -32px; width: 1px; height: auto; }
}

/* --------------------------------------------------------------------------
   Industry marquee — slow, decorative, pauses on hover
   -------------------------------------------------------------------------- */

.pwd-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.pwd-marquee__track { display: flex; width: max-content; animation: pwd-marquee 60s linear infinite; }
.pwd-marquee:hover .pwd-marquee__track { animation-play-state: paused; }
.pwd-marquee__item { display: inline-flex; align-items: center; gap: 28px; padding-right: 28px; font-family: var(--pwd-serif); font-weight: 300; font-size: clamp(28px, 3.4vw, 48px); line-height: 1.2; white-space: nowrap; }
.pwd-marquee__item::after { content: ""; width: 9px; height: 9px; border-radius: 50%; border: 1px solid var(--pwd-signal); }
@keyframes pwd-marquee { to { transform: translate3d(-50%, 0, 0); } }

/* --------------------------------------------------------------------------
   Work / concept tiles
   -------------------------------------------------------------------------- */

.pwd-work .elementor-widget-image { overflow: hidden; border-radius: 4px; background: var(--pwd-bone); }
.pwd-work .elementor-widget-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 1.1s var(--pwd-ease); }
.pwd-work:hover .elementor-widget-image img { transform: scale(1.035); }
.pwd-tag .elementor-heading-title { display: inline-block; padding: 5px 10px; border: 1px solid currentColor; border-radius: 100px; font-family: var(--pwd-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .8; }

/* Placeholder notice — visibly flags content that needs real business information */
.pwd-placeholder { position: relative; }
.pwd-placeholder::before {
	content: "Placeholder"; position: absolute; top: 14px; right: 14px; left: auto; bottom: auto; width: auto; height: auto; z-index: 2; background: none;
	font-family: var(--pwd-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
	padding: 4px 8px; border: 1px dashed currentColor; border-radius: 3px; opacity: .55;
}

/* Testimonial placeholders */
.pwd-quote .elementor-widget-text-editor { font-family: var(--pwd-serif); font-weight: 300; font-size: clamp(22px, 2.1vw, 30px); line-height: 1.3; }

/* --------------------------------------------------------------------------
   Header (Theme Builder template carries .pwd-header)
   -------------------------------------------------------------------------- */

.pwd-header { transition: background-color .35s var(--pwd-ease), box-shadow .35s var(--pwd-ease); }
.pwd-header.elementor-sticky--effects, .pwd-header.is-scrolled {
	background-color: rgba(15, 23, 20, .94) !important;
	box-shadow: 0 1px 0 var(--pwd-rule-dark);
	-webkit-backdrop-filter: saturate(140%) blur(10px); backdrop-filter: saturate(140%) blur(10px);
}
.pwd-header .elementor-nav-menu--main .elementor-item { font-family: var(--pwd-sans); font-weight: 400; font-size: 15px; letter-spacing: 0; }
.pwd-header .elementor-nav-menu--main .elementor-item.elementor-item-active { color: var(--pwd-paper) !important; }
.pwd-header .elementor-nav-menu--dropdown { border: 1px solid var(--pwd-rule-dark); border-radius: 4px; padding: 8px 0; box-shadow: 0 24px 48px -16px rgba(0, 0, 0, .45); }
.pwd-header .elementor-nav-menu--dropdown a { font-size: 15px !important; }

/* Mobile menu: full-width ink panel, large serif links */
@media (max-width: 1024px) {
	.pwd-header .elementor-nav-menu--dropdown.elementor-nav-menu__container { border: 0; border-radius: 0; box-shadow: none; border-top: 1px solid var(--pwd-rule-dark); padding: 12px 0 28px; }
	.pwd-header .elementor-nav-menu--dropdown .elementor-item { font-family: var(--pwd-serif) !important; font-weight: 300 !important; font-size: 30px !important; padding: 10px 20px !important; }
	.pwd-header .elementor-nav-menu--dropdown .sub-menu .elementor-sub-item { font-size: 17px !important; padding: 8px 20px 8px 36px !important; }
	.pwd-header .elementor-menu-toggle { background: transparent !important; }
}

/* Logo lockup: chain mark + "Peptide" (serif) + "WEB DESIGN" (mono) */
.pwd-logo .elementor-heading-title { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.pwd-logo .elementor-heading-title a { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.pwd-logo .elementor-heading-title a::before, .pwd-logo .elementor-heading-title:not(:has(a))::before {
	content: ""; width: 30px; height: 30px; flex: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none' stroke='%23F5F2EB' stroke-width='6'%3E%3Ccircle cx='20' cy='66' r='11'/%3E%3Ccircle cx='48' cy='30' r='11'/%3E%3Ccircle cx='76' cy='66' r='12' fill='%23E4572E' stroke='none'/%3E%3Cpath d='M27 57 41 39M55 39l14 18'/%3E%3C/svg%3E") center / contain no-repeat;
}
.pwd-logo .elementor-heading-title span { font-family: var(--pwd-mono); font-size: 10.5px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; opacity: .62; transform: translateY(1px); }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.pwd-footer a { text-decoration: none; transition: color var(--pwd-fast) var(--pwd-ease); }
.pwd-footer .elementor-icon-list-text { transition: color var(--pwd-fast) var(--pwd-ease); }
.pwd-footer .elementor-icon-list-item a:hover .elementor-icon-list-text { color: var(--pwd-paper) !important; }
.pwd-wordmark .elementor-heading-title { font-family: var(--pwd-serif); font-weight: 300; letter-spacing: -.035em; line-height: .9; font-size: clamp(56px, 12.5vw, 196px); }
.pwd-wordmark .elementor-heading-title em { color: var(--pwd-signal); }

/* --------------------------------------------------------------------------
   Blog: Elementor Pro Posts / Archive Posts (classic skin) + shortcodes
   -------------------------------------------------------------------------- */

.pwd-posts .elementor-post { border-top: 1px solid var(--pwd-rule); padding-top: 22px; }
.pwd-posts .elementor-post__thumbnail__link { margin-bottom: 22px !important; display: block; overflow: hidden; border-radius: 4px; }
.pwd-posts .elementor-post__thumbnail { padding-bottom: 62% !important; }
.pwd-posts .elementor-post__thumbnail img { transition: transform 1.1s var(--pwd-ease); }
.pwd-posts .elementor-post:hover .elementor-post__thumbnail img { transform: translate(-50%, -50%) scale(1.04) !important; }
.pwd-posts .elementor-post__title a { font-family: var(--pwd-serif); font-weight: 400; font-size: 26px; line-height: 1.15; letter-spacing: -.01em; color: var(--pwd-ink); text-decoration: none; }
.pwd-posts .elementor-post__title a:hover { color: var(--pwd-teal); }
.pwd-posts .elementor-post__meta-data { font-family: var(--pwd-mono); font-size: 11px !important; letter-spacing: .1em; text-transform: uppercase; color: var(--pwd-slate) !important; order: -1; margin: 0 0 10px !important; }
.pwd-posts .elementor-post__text { display: flex; flex-direction: column; }
.pwd-posts .elementor-post__excerpt p { color: var(--pwd-graphite); font-size: 16px; line-height: 1.55; }
.pwd-posts .elementor-post__read-more { font-family: var(--pwd-sans); font-weight: 500; font-size: 14px !important; color: var(--pwd-ink) !important; text-transform: none; border-bottom: 1px solid currentColor; padding-bottom: 3px; }
.pwd-posts .elementor-post__read-more:hover { color: var(--pwd-signal) !important; }
.pwd-posts .elementor-pagination { margin-top: 64px; font-family: var(--pwd-mono); font-size: 14px; }
.pwd-posts .elementor-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; margin: 0 2px; border: 1px solid var(--pwd-rule); border-radius: 4px; color: var(--pwd-ink); text-decoration: none; }
.pwd-posts .elementor-pagination .page-numbers.current, .pwd-posts .elementor-pagination a.page-numbers:hover { background: var(--pwd-ink); border-color: var(--pwd-ink); color: var(--pwd-paper); }
.pwd-posts .elementor-pagination .page-numbers.prev, .pwd-posts .elementor-pagination .page-numbers.next { padding: 0 16px; }

/* [pwd_archive_heading] */
.pwd-archive-title { font-family: var(--pwd-serif); font-weight: 300; font-size: clamp(38px, 5.3vw, 68px); line-height: 1.03; letter-spacing: -.022em; color: var(--pwd-paper); margin: 0 0 22px; max-width: 16ch; }
.pwd-archive-title em { font-style: italic; color: var(--pwd-signal); }
.pwd-archive-intro { font-size: clamp(18px, 1.5vw, 21px); font-weight: 300; line-height: 1.5; color: rgba(245, 242, 235, .62); max-width: 620px; margin: 0; }

/* Single post hero meta */
.pwd-post-meta .elementor-post-info__terms-list-item, .pwd-post-meta a { color: var(--pwd-signal) !important; text-decoration: none; }
.pwd-post-author .elementor-icon-list-text { color: var(--pwd-paper); }
.pwd-post-author img { border-radius: 50%; }
.pwd-reading { font-family: var(--pwd-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: rgba(245, 242, 235, .55); }
.pwd-post-feature img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

/* [pwd_featured_post] */
.pwd-feature { display: grid; grid-template-columns: 1.25fr 1fr; gap: 56px; align-items: center; text-decoration: none; color: inherit; }
.pwd-feature__media { overflow: hidden; border-radius: 4px; background: var(--pwd-bone); aspect-ratio: 16 / 10; }
.pwd-feature__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--pwd-ease); }
.pwd-feature:hover .pwd-feature__media img { transform: scale(1.03); }
.pwd-feature__meta { font-family: var(--pwd-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--pwd-slate); display: flex; gap: 14px; flex-wrap: wrap; }
.pwd-feature__meta span + span::before { content: "/"; margin-right: 14px; opacity: .5; }
.pwd-feature__title { font-family: var(--pwd-serif); font-weight: 300; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; letter-spacing: -.02em; margin: 18px 0 18px; color: var(--pwd-ink); }
.pwd-feature:hover .pwd-feature__title { color: var(--pwd-teal); }
.pwd-feature__excerpt { font-size: 18px; line-height: 1.55; color: var(--pwd-graphite); margin: 0 0 26px; }
.pwd-feature__more { font-weight: 500; font-size: 15px; border-bottom: 1px solid currentColor; padding-bottom: 3px; }
.pwd-feature__label { display: inline-block; font-family: var(--pwd-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--pwd-signal); margin-bottom: 18px; }
@media (max-width: 1024px) { .pwd-feature { grid-template-columns: 1fr; gap: 28px; } }

/* [pwd_category_nav] */
.pwd-cats { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.pwd-cats a { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border: 1px solid var(--pwd-rule); border-radius: 100px; font-size: 14px; color: var(--pwd-ink); text-decoration: none; transition: all var(--pwd-fast) var(--pwd-ease); }
.pwd-cats a small { font-family: var(--pwd-mono); font-size: 11px; color: var(--pwd-slate); }
.pwd-cats a:hover, .pwd-cats a[aria-current] { background: var(--pwd-ink); border-color: var(--pwd-ink); color: var(--pwd-paper); }
.pwd-cats a:hover small, .pwd-cats a[aria-current] small { color: rgba(245, 242, 235, .6); }
@media (max-width: 767px) {
	.pwd-cats { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -20px; padding: 0 20px; }
	.pwd-cats::-webkit-scrollbar { display: none; }
	.pwd-cats a { white-space: nowrap; }
}

/* --------------------------------------------------------------------------
   Single post — article typography, TOC, author box
   -------------------------------------------------------------------------- */

.pwd-article { font-size: 18px; line-height: 1.7; color: var(--pwd-graphite); }
.pwd-article > * { max-width: 720px; }
.pwd-article h2 { font-family: var(--pwd-serif); font-weight: 400; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.12; letter-spacing: -.015em; color: var(--pwd-ink); margin: 56px 0 18px; scroll-margin-top: 110px; }
.pwd-article h3 { font-family: var(--pwd-sans); font-weight: 500; font-size: 21px; line-height: 1.3; color: var(--pwd-ink); margin: 36px 0 12px; scroll-margin-top: 110px; }
.pwd-article p { margin: 0 0 1.25em; }
.pwd-article a { color: var(--pwd-teal); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pwd-article ul, .pwd-article ol { padding-left: 1.2em; margin: 0 0 1.4em; }
.pwd-article li { margin-bottom: .5em; }
.pwd-article li::marker { color: var(--pwd-signal); font-family: var(--pwd-mono); }
.pwd-article blockquote { margin: 40px 0; padding: 4px 0 4px 28px; border-left: 2px solid var(--pwd-signal); font-family: var(--pwd-serif); font-weight: 300; font-size: 26px; line-height: 1.35; color: var(--pwd-ink); }
.pwd-article .pwd-note { padding: 20px 24px; background: var(--pwd-bone); border-radius: 4px; font-size: 15px; line-height: 1.6; }
.pwd-article img { border-radius: 4px; }

.pwd-toc .elementor-toc__header { border: 0 !important; padding: 0 0 14px !important; }
.pwd-toc .elementor-toc__header-title { font-family: var(--pwd-mono) !important; font-size: 11px !important; letter-spacing: .14em; text-transform: uppercase; color: var(--pwd-slate) !important; }
.pwd-toc .elementor-toc__body { padding: 0 !important; }
.pwd-toc .elementor-toc__list-item-text { font-size: 14px; line-height: 1.4; color: var(--pwd-graphite) !important; padding: 6px 0; display: inline-block; }
.pwd-toc .elementor-toc__list-item-text.elementor-item-active, .pwd-toc .elementor-toc__list-item-text:hover { color: var(--pwd-ink) !important; text-decoration: none !important; }
.pwd-toc .elementor-toc__list-item-text-wrapper::before { color: var(--pwd-signal) !important; font-family: var(--pwd-mono); font-size: 12px; }

.pwd-author .elementor-author-box__name { font-family: var(--pwd-serif) !important; font-weight: 400 !important; }
.pwd-reading-progress { position: fixed; left: 0; top: 0; height: 2px; width: 100%; transform-origin: 0 50%; transform: scaleX(var(--p, 0)); background: var(--pwd-signal); z-index: 10000; pointer-events: none; }

/* --------------------------------------------------------------------------
   Forms — Elementor Pro Form, underline fields
   -------------------------------------------------------------------------- */

.pwd-form .elementor-field-group { margin-bottom: 26px !important; }
.pwd-form .elementor-field-label { font-family: var(--pwd-mono); font-size: 11px !important; letter-spacing: .12em; text-transform: uppercase; color: var(--pwd-slate) !important; margin-bottom: 6px; }
.pwd-form .elementor-field-textual, .pwd-form .elementor-select-wrapper select {
	background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--pwd-rule) !important; border-radius: 0 !important;
	padding: 10px 0 !important; font-size: 18px !important; color: var(--pwd-ink) !important; transition: border-color var(--pwd-fast) var(--pwd-ease);
}
.pwd-form .elementor-field-textual:focus, .pwd-form select:focus { border-bottom-color: var(--pwd-ink) !important; outline: none; box-shadow: 0 1px 0 0 var(--pwd-ink) !important; }
.pwd-form .elementor-field-textual::placeholder { color: #9AA19D; }
.pwd-form .elementor-field-type-checkbox .elementor-field-subgroup { display: flex; flex-wrap: wrap; gap: 8px; }
.pwd-form .elementor-field-type-checkbox .elementor-field-option { margin: 0 !important; }
.pwd-form .elementor-field-type-checkbox .elementor-field-option input { position: absolute; opacity: 0; }
.pwd-form .elementor-field-type-checkbox .elementor-field-option label { display: inline-flex; align-items: center; height: 40px; padding: 0 16px; border: 1px solid var(--pwd-rule); border-radius: 100px; font-size: 14px; cursor: pointer; transition: all var(--pwd-fast) var(--pwd-ease); }
.pwd-form .elementor-field-type-checkbox .elementor-field-option input:checked + label { background: var(--pwd-ink); border-color: var(--pwd-ink); color: var(--pwd-paper); }
.pwd-form .elementor-field-type-checkbox .elementor-field-option input:focus-visible + label { outline: 2px solid var(--pwd-signal); outline-offset: 2px; }
.pwd-form .elementor-field-type-acceptance label { font-size: 14px; color: var(--pwd-slate); }
.pwd-form .elementor-message-success { font-family: var(--pwd-serif); font-size: 22px; color: var(--pwd-teal); }

/* --------------------------------------------------------------------------
   Nested accordion (FAQ)
   -------------------------------------------------------------------------- */

.pwd-faq .e-n-accordion-item { border-top: 1px solid var(--pwd-rule); }
.pwd-faq .e-n-accordion-item:last-child { border-bottom: 1px solid var(--pwd-rule); }
.pwd-faq .e-n-accordion-item-title { padding: 24px 0 !important; background: none !important; border: 0 !important; }
.pwd-faq .e-n-accordion-item-title-text { font-family: var(--pwd-serif); font-weight: 400; font-size: 22px; line-height: 1.3; color: var(--pwd-ink); }
.pwd-faq .e-n-accordion-item-title-icon svg { fill: var(--pwd-signal) !important; width: 14px; }
.pwd-faq .e-n-accordion-item > .e-con { border: 0 !important; padding: 0 64px 28px 0 !important; }

/* --------------------------------------------------------------------------
   Motion — only when JS is present, never in the editor, never with reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {
	.pwd-js body:not(.elementor-editor-active) .pwd-reveal { opacity: 0; transform: translate3d(0, 28px, 0); transition: opacity var(--pwd-slow) var(--pwd-ease), transform var(--pwd-slow) var(--pwd-ease); transition-delay: var(--pwd-delay, 0s); }
	.pwd-js body:not(.elementor-editor-active) .pwd-reveal.is-in { opacity: 1; transform: none; }

	/* Clip the image, not the observed wrapper: IntersectionObserver ignores fully clipped elements. */
	.pwd-js body:not(.elementor-editor-active) .pwd-reveal-img img { clip-path: inset(0 0 100% 0); transition: clip-path 1.2s var(--pwd-ease); transition-delay: var(--pwd-delay, 0s); }
	.pwd-js body:not(.elementor-editor-active) .pwd-reveal-img.is-in img { clip-path: inset(0 0 0 0); }

	/* Staggered children: add .pwd-stagger to a grid/flex container */
	.pwd-js body:not(.elementor-editor-active) .pwd-stagger > .e-con, .pwd-js body:not(.elementor-editor-active) .pwd-stagger > .elementor-element { opacity: 0; transform: translate3d(0, 24px, 0); transition: opacity .8s var(--pwd-ease), transform .8s var(--pwd-ease), background-color .4s var(--pwd-ease); }
	.pwd-js body:not(.elementor-editor-active) .pwd-stagger.is-in > .e-con, .pwd-js body:not(.elementor-editor-active) .pwd-stagger.is-in > .elementor-element { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.pwd-marquee__track, .pwd-hero--chain::after { animation: none; }
}

/* --------------------------------------------------------------------------
   Small screens
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
	.pwd-hero::before { background-size: 64px 64px; }
	.pwd-hero--chain::after { width: 130%; right: -40%; bottom: -48px; opacity: .25; }
	.pwd-article { font-size: 17px; }
	.pwd-faq .e-n-accordion-item > .e-con { padding-right: 0 !important; }
	.pwd-faq .e-n-accordion-item-title-text { font-size: 19px; }
	.pwd-placeholder::before { top: 10px; right: 10px; }
}

/* Service cells: index + icon at top, title/description pinned to the bottom so rows align */
.pwd-service > .e-con:last-child { margin-top: auto; }

/* Work: featured concept row */
.pwd-work--feature .elementor-widget-image img { aspect-ratio: 16 / 11; }
