/* ==========================================================================
   IPI Diamonds — values mirror the Claude Design source 1:1.
   Desktop ≥ 861px, mobile ≤ 860px (same breakpoint as the design).
   ========================================================================== */

:root {
	--ipi-ivory: #F7F4EF;
	--ipi-cream: #F5F1EB;
	--ipi-ink: #111111;
	--ipi-text: #14120F;
	--ipi-gold: #C9A96A;
	--ipi-taupe: #7E6857;
	--ipi-stone: #5A534C;
	--ipi-line: #D8D6D2;
	--ipi-serif: 'Cormorant Garamond', Baskerville, 'Times New Roman', serif;
	--ipi-sans: Manrope, 'Helvetica Neue', Arial, sans-serif;
	--ipi-gutter: clamp(24px, 5vw, 80px);
	--ipi-section: clamp(84px, 11vw, 164px);
	--ipi-ease: cubic-bezier(.22, .61, .36, 1);
}

html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--ipi-ivory);
	color: var(--ipi-text);
	font-family: var(--ipi-sans);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
.ipi-site { background: var(--ipi-ivory); font-family: var(--ipi-sans); overflow-x: clip; }
.ipi-site a { color: var(--ipi-ink); text-decoration: none; }
.ipi-site a:hover { color: var(--ipi-gold); }
::selection { background: var(--ipi-gold); color: #FFFFFF; }
.ipi-site button { font: inherit; color: inherit; }
.ipi-site input, .ipi-site textarea { font-family: var(--ipi-sans); }
input::placeholder, textarea::placeholder { color: #A79E94; }
input:focus, textarea:focus { outline: none; border-color: var(--ipi-gold) !important; }
@keyframes subReveal { from { opacity: 0; transform: translateY(-7px); } to { opacity: 1; transform: none; } }
@keyframes subHide { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-7px); } }
@keyframes drawerIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes drawerOut { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-10px); } }

/* The header wrapper must not create a box (keeps the bar sticky page-wide). */
.ipi-header { display: contents; }
.ipi-main { margin: 0; }
.ipi-main > * { margin-block: 0; }

/* ---------- Shared type ---------- */
.ipi-eyebrow {
	font-size: 9.5px; font-weight: 500; letter-spacing: 0.38em;
	text-transform: uppercase; color: var(--ipi-taupe);
}
.ipi-label {
	font-size: 9px; font-weight: 500; letter-spacing: 0.32em;
	text-transform: uppercase; color: var(--ipi-taupe);
}
.ipi-h1 {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	color: var(--ipi-ink); text-wrap: balance;
}
.ipi-h2 {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(36px, 4.2vw, 68px); line-height: 1.02; letter-spacing: -0.018em;
	color: var(--ipi-ink); text-wrap: balance;
}
.ipi-h3 {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(26px, 2.6vw, 40px); line-height: 1.15; color: var(--ipi-ink);
}
.ipi-lead, .ipi-lead p {
	margin: 0; font-size: clamp(15px, 1.1vw, 17.5px); font-weight: 300;
	line-height: 1.9; color: var(--ipi-stone); text-wrap: pretty;
}
.ipi-lead.is-accent { color: var(--ipi-taupe); font-style: italic; }
.ipi-rule { display: block; width: 56px; height: 1px; background: var(--ipi-gold); }

.ipi-btn, .ipi-site .ipi-btn {
	display: inline-block; background: var(--ipi-ink); color: var(--ipi-ivory);
	border: 1px solid var(--ipi-ink); padding: 18px 34px; cursor: pointer;
	font-family: var(--ipi-sans); font-size: 10px; font-weight: 500; line-height: normal;
	letter-spacing: 0.24em; text-transform: uppercase;
	transition: background 0.5s ease, color 0.5s ease, border-color 0.5s ease;
}
.ipi-btn:hover, .ipi-site .ipi-btn:hover { background: var(--ipi-gold); color: var(--ipi-ink); border-color: var(--ipi-gold); }

/* Hover zoom for cover images */
.ipi-tile img, .ipi-zoom, .ipi-hero__media img {
	transition: transform 1.7s var(--ipi-ease);
}
.ipi-tile img:hover, .ipi-zoom:hover { transform: scale(1.04); }

/* ==========================================================================
   Header
   ========================================================================== */
.ipi-logo-row {
	display: flex; justify-content: center;
	padding: clamp(26px, 3vw, 42px) var(--ipi-gutter) clamp(22px, 2.4vw, 32px);
}
.ipi-logo-link { display: flex; padding: 0; }
.ipi-logo-link svg, .ipi-logo-link img { display: block; }

.ipi-bar {
	position: sticky; top: 0; z-index: 60;
	background: rgba(247, 244, 239, 0.94);
	backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
	border-top: 1px solid rgba(17, 17, 17, 0.07);
	border-bottom: 1px solid rgba(17, 17, 17, 0.07);
}
.admin-bar .ipi-bar { top: var(--wp-admin--admin-bar--height, 32px); }

.ipi-nav {
	max-width: 1520px; margin: 0 auto; padding: 0 var(--ipi-gutter);
	display: flex; justify-content: center; align-items: stretch;
	gap: clamp(20px, 3.2vw, 52px);
}
.ipi-site .ipi-nav__item, .ipi-nav__item {
	background: none; border: 0; cursor: pointer; padding: 17px 0 16px;
	font-family: var(--ipi-sans); font-size: 10.5px; font-weight: 500; line-height: normal;
	letter-spacing: 0.26em; text-transform: uppercase; color: var(--ipi-ink);
	position: relative; display: flex; align-items: center; gap: 9px;
}
.ipi-site .ipi-nav__item:hover { color: var(--ipi-gold); }
.ipi-nav__caret { font-size: 8px; color: #B39B88; }
.ipi-nav__item.is-current::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--ipi-gold);
}

.ipi-mbar { display: none; }

.ipi-panel {
	position: absolute; left: 0; right: 0; top: 100%;
	background: var(--ipi-cream); border-bottom: 1px solid rgba(17, 17, 17, 0.07);
	box-shadow: 0 22px 48px -28px rgba(17, 17, 17, 0.28);
	animation: subReveal 0.4s var(--ipi-ease);
}
.ipi-panel[hidden] { display: none; }
.ipi-panel.is-closing { animation: subHide 0.28s var(--ipi-ease) forwards; pointer-events: none; }
.ipi-panel__inner {
	max-width: 1520px; margin: 0 auto;
	padding: clamp(30px, 3.4vw, 46px) var(--ipi-gutter);
	display: flex; flex-direction: column; align-items: center; gap: 22px;
}
.ipi-panel__links { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(28px, 4vw, 64px); }
.ipi-site .ipi-panel__links a {
	font-family: var(--ipi-serif); font-size: clamp(21px, 1.9vw, 27px); font-weight: 300;
	color: var(--ipi-ink); transition: color 0.4s ease; line-height: normal;
}
.ipi-site .ipi-panel__links a:hover { color: var(--ipi-gold); }

/* "Collections in preparation": categories listed but not linked */
.ipi-panel__links.is-soon span {
	font-family: var(--ipi-serif); font-size: clamp(21px, 1.9vw, 27px); font-weight: 300;
	color: #8F8980; line-height: normal; cursor: default;
}
.ipi-drawer__sub.is-soon span { font-size: 15px; font-weight: 300; color: #A39C93; line-height: normal; }
.ipi-site .ipi-soon-note {
	margin: 0; font-size: 10px; font-weight: 500; letter-spacing: 0.32em;
	text-transform: uppercase; color: var(--ipi-taupe);
}
.ipi-drawer__sub .ipi-soon-note { margin-top: 4px; font-size: 9px; }

/* Mobile drawer */
.ipi-drawer {
	position: fixed; inset: 0; z-index: 70; background: var(--ipi-ivory);
	display: flex; flex-direction: column; padding: 22px 24px 40px; overflow-y: auto;
}
.ipi-drawer { animation: drawerIn 0.45s var(--ipi-ease); }
.ipi-drawer[hidden] { display: none; }
.ipi-drawer.is-closing { animation: drawerOut 0.3s var(--ipi-ease) forwards; pointer-events: none; }
.admin-bar .ipi-drawer { top: var(--wp-admin--admin-bar--height, 46px); }
.ipi-drawer__top { display: flex; justify-content: flex-end; }
.ipi-site .ipi-drawer__close {
	background: none; border: 0; cursor: pointer; font-size: 26px; line-height: 1; color: var(--ipi-ink); padding: 4px 6px;
}
.ipi-drawer__nav { display: flex; flex-direction: column; gap: 2px; margin-top: 22px; }
.ipi-drawer__group { border-bottom: 1px solid #E4E0D9; }
.ipi-site .ipi-drawer__toggle {
	background: none; border: 0; cursor: pointer; width: 100%;
	display: flex; justify-content: space-between; align-items: center; text-align: left; padding: 20px 2px;
}
.ipi-drawer__label, .ipi-site .ipi-drawer__link {
	font-family: var(--ipi-serif); font-size: 28px; font-weight: 300; color: var(--ipi-ink); line-height: normal;
}
.ipi-site .ipi-drawer__link { display: block; border-bottom: 1px solid #E4E0D9; padding: 20px 2px; }
.ipi-drawer__chev { font-size: 11px; color: #B39B88; }
.ipi-drawer__sub {
	display: flex; flex-direction: column; gap: 14px; padding: 2px 2px 20px;
	animation: subReveal 0.35s var(--ipi-ease);
}
.ipi-drawer__sub[hidden] { display: none; }
.ipi-site .ipi-drawer__sub a { font-size: 15px; font-weight: 300; color: var(--ipi-stone); line-height: normal; }
.ipi-drawer__foot { margin-top: auto; padding-top: 40px; display: flex; flex-direction: column; gap: 10px; }
.ipi-site .ipi-drawer__foot a { font-size: 13.5px; font-weight: 300; color: var(--ipi-stone); }

/* ==========================================================================
   Hero
   ========================================================================== */
.ipi-hero { padding: clamp(36px, 5vw, 72px) 0 0 var(--ipi-gutter); }
.ipi-hero__row {
	display: grid; grid-template-columns: minmax(300px, 1fr) minmax(0, 1.8fr);
	align-items: stretch; gap: clamp(32px, 4vw, 72px);
}
.ipi-hero__text {
	display: flex; flex-direction: column; justify-content: center;
	gap: clamp(24px, 2.6vw, 38px); padding: clamp(16px, 3vw, 56px) 0; min-width: 0;
}
.ipi-hero__title {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(46px, 5.6vw, 92px); line-height: 0.97; letter-spacing: -0.022em;
	color: var(--ipi-ink); text-wrap: balance;
}
.ipi-hero__title em { font-style: italic; font-weight: 300; }
.ipi-hero__lead { max-width: 480px; }
.ipi-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 4px; }
.ipi-hero__media { min-width: 0; overflow: hidden; min-height: clamp(420px, 68vh, 800px); }
.ipi-hero__media img {
	display: block; width: 100%; height: 100%; object-fit: cover;
	transition-duration: 1.8s;
}
.ipi-hero__media img:hover { transform: scale(1.035); }

/* ==========================================================================
   Mosaic + copy sections
   ========================================================================== */
.ipi-feature { padding: var(--ipi-section) var(--ipi-gutter); }
.ipi-feature.is-cream { background: var(--ipi-cream); }
.ipi-feature.is-offset { margin-top: var(--ipi-section) !important; }
.ipi-feature__row {
	max-width: 1520px; margin: 0 auto; display: flex; flex-wrap: wrap;
	gap: clamp(36px, 4vw, 80px); align-items: center;
}
.ipi-mosaic {
	display: grid; gap: clamp(10px, 1.2vw, 18px);
}
.ipi-feature .ipi-mosaic { flex: 1.2 1 380px; min-width: 0; max-width: 780px; }
.ipi-tile { overflow: hidden; height: 100%; }
.ipi-tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ipi-feature__copy {
	flex: 1 1 300px; display: flex; flex-direction: column;
	gap: clamp(20px, 2.2vw, 30px); max-width: 480px; margin: 0 auto;
}
.ipi-feature.is-text-left .ipi-feature__copy { align-items: flex-end; text-align: right; order: 1; }
.ipi-feature.is-text-left .ipi-mosaic { order: 2; }

/* ==========================================================================
   Inner pages
   ========================================================================== */
.ipi-page { padding: clamp(60px, 8vw, 120px) var(--ipi-gutter) var(--ipi-section); }
.ipi-wrap { max-width: 1520px; margin: 0 auto; }
.ipi-intro { margin: 0 auto; text-align: center; display: flex; flex-direction: column; align-items: center; }

/* Bespoke */
.ipi-intro--bespoke { max-width: 820px; gap: clamp(22px, 2.4vw, 34px); }
.ipi-intro--bespoke .ipi-h1 { font-size: clamp(42px, 6.4vw, 98px); line-height: 0.98; letter-spacing: -0.02em; }
.ipi-bespoke__grid {
	margin-top: clamp(56px, 7vw, 110px); display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: clamp(32px, 5vw, 88px); align-items: center;
}
.ipi-bespoke__media { overflow: hidden; }
.ipi-bespoke__media img { display: block; width: 100%; height: auto; }
.ipi-bespoke__list { display: flex; flex-direction: column; }
.ipi-bespoke__item {
	display: flex; flex-direction: column; gap: 10px;
	padding: clamp(24px, 2.4vw, 34px) 0; border-top: 1px solid var(--ipi-line);
}
.ipi-bespoke__item.is-last { border-bottom: 1px solid var(--ipi-line); }
.ipi-bespoke__btn { align-self: flex-start; margin-top: clamp(30px, 3vw, 44px); }

/* About */
.ipi-intro--about { max-width: 1000px; gap: clamp(24px, 2.6vw, 38px); }
.ipi-intro--about .ipi-h1 { font-size: clamp(44px, 7vw, 108px); line-height: 0.96; letter-spacing: -0.022em; }
.ipi-about__lead {
	margin: 0; max-width: 680px; font-size: clamp(16px, 1.25vw, 19px); font-weight: 300;
	line-height: 1.9; color: #4A443E; text-wrap: pretty;
}
.ipi-about__body {
	max-width: 720px; margin: clamp(48px, 6vw, 88px) auto 0; display: flex; flex-direction: column;
	gap: clamp(20px, 2.2vw, 28px); font-size: clamp(15px, 1.1vw, 17.5px); font-weight: 300;
	line-height: 1.9; color: var(--ipi-stone);
}
.ipi-about__body p { margin: 0; text-wrap: pretty; }
.ipi-about__mosaic { margin-top: clamp(56px, 7vw, 110px); }

/* Contact */
.ipi-contact__row {
	max-width: 1520px; margin: 0 auto; display: flex; flex-wrap: wrap;
	gap: clamp(36px, 4vw, 80px); align-items: center;
}
.ipi-contact__text { flex: 1 1 300px; display: flex; flex-direction: column; gap: clamp(26px, 2.8vw, 40px); }
.ipi-contact__head { display: flex; flex-direction: column; gap: clamp(18px, 2vw, 28px); }
.ipi-contact__head .ipi-h1 { font-size: clamp(42px, 5.6vw, 86px); line-height: 0.99; letter-spacing: -0.02em; }
.ipi-contact__details { display: flex; flex-wrap: wrap; gap: clamp(28px, 3vw, 52px); }
.ipi-contact__detail { display: flex; flex-direction: column; gap: 8px; }
.ipi-site .ipi-contact__detail a { font-size: 15px; font-weight: 300; color: var(--ipi-ink); }
.ipi-site .ipi-contact__detail a:hover { color: var(--ipi-gold); }
.ipi-form { display: flex; flex-direction: column; gap: 20px; max-width: 520px; margin-top: 6px; scroll-margin-top: 120px; }
.ipi-form label { display: flex; flex-direction: column; gap: 9px; }
.ipi-form input, .ipi-form textarea {
	background: none; border: 0; border-bottom: 1px solid var(--ipi-line); border-radius: 0;
	padding: 10px 0; font-size: 15px; font-weight: 300; color: var(--ipi-ink); margin: 0;
}
.ipi-form textarea { line-height: 1.7; resize: vertical; }
.ipi-site .ipi-form__submit, .ipi-form__submit { align-self: flex-start; margin-top: 10px; padding: 18px 40px; }
.ipi-form__note { margin: 0; font-size: 14px; font-weight: 300; line-height: 1.7; color: var(--ipi-taupe); }
.ipi-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.ipi-contact__media { flex: 1.45 1 400px; min-width: 0; overflow: hidden; aspect-ratio: 1/1.02; }
.ipi-contact__media img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Text page (Warranty & Authenticity) */
.ipi-textpage__wrap { max-width: 820px; margin: 0 auto; }
.ipi-intro--text { gap: clamp(22px, 2.4vw, 34px); }
.ipi-intro--text .ipi-h1 { font-size: clamp(38px, 5.6vw, 84px); line-height: 0.98; letter-spacing: -0.02em; }
.ipi-textpage__lead { max-width: 620px; }
.ipi-textpage__sections { margin-top: clamp(56px, 7vw, 96px); display: flex; flex-direction: column; gap: clamp(40px, 5vw, 64px); }
.ipi-textpage__section {
	display: flex; flex-direction: column; gap: 16px;
	border-top: 1px solid var(--ipi-line); padding-top: clamp(28px, 3vw, 40px);
}
.ipi-textpage__section p {
	margin: 0; font-size: clamp(14.5px, 1.05vw, 16.5px); font-weight: 300;
	line-height: 1.9; color: var(--ipi-stone); text-wrap: pretty;
}
.ipi-textpage__section ul {
	margin: 0; padding-left: 1.2em; display: flex; flex-direction: column; gap: 8px;
	font-size: clamp(14.5px, 1.05vw, 16.5px); font-weight: 300; line-height: 1.7; color: var(--ipi-stone);
}

/* ==========================================================================
   Catalogue
   ========================================================================== */
.ipi-catalogue { padding: clamp(48px, 6vw, 88px) var(--ipi-gutter) var(--ipi-section); }
.ipi-catalogue__inner { max-width: 1520px; margin: 0 auto; display: flex; flex-direction: column; gap: clamp(40px, 4.5vw, 64px); }
.ipi-catalogue__head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(18px, 2vw, 26px); }
.ipi-catalogue__title {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(38px, 5.6vw, 84px); line-height: 0.98; letter-spacing: -0.02em; color: var(--ipi-ink);
}
.ipi-catalogue__cats { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(14px, 2.4vw, 36px); margin-top: 6px; }
.ipi-site .ipi-catalogue__cat {
	border-bottom: 1px solid transparent; padding: 6px 2px; line-height: normal;
	font-size: 10px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase;
	color: #8C8479; transition: color 0.4s ease, border-color 0.4s ease;
}
.ipi-site .ipi-catalogue__cat:hover { color: var(--ipi-ink); }
.ipi-site .ipi-catalogue__cat.is-current { color: var(--ipi-ink); border-bottom-color: var(--ipi-gold); }
.ipi-catalogue__grid {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: clamp(30px, 3.4vw, 52px) clamp(14px, 2vw, 32px);
}
.ipi-card { display: flex; flex-direction: column; gap: 8px; text-align: left; min-width: 0; }
.ipi-card__media { overflow: hidden; width: 100%; aspect-ratio: 1/1.15; background: #EFEBE4; margin-bottom: 8px; }
.ipi-card__media img {
	display: block; width: 100%; height: 100%; object-fit: cover;
	transition: transform 1.5s var(--ipi-ease), opacity 0.6s var(--ipi-ease);
}
.ipi-card__media img.is-loading, .ipi-product__main img.is-loading { opacity: 0; }
.ipi-card__media img:hover { transform: scale(1.045); }
.ipi-card__name { font-family: var(--ipi-serif); font-size: clamp(19px, 1.5vw, 24px); font-weight: 300; line-height: 1.2; color: var(--ipi-ink); }
.ipi-card__price { font-size: 10px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ipi-taupe); }
.ipi-site a.ipi-card:hover { color: inherit; }

/* Product */
.ipi-product { padding: clamp(28px, 3.5vw, 52px) var(--ipi-gutter) var(--ipi-section); }
.ipi-product__inner { max-width: 1520px; margin: 0 auto; display: flex; flex-direction: column; gap: clamp(24px, 3vw, 44px); }
.ipi-crumbs {
	display: flex; align-items: center; gap: 12px;
	font-size: 10px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase; color: #8C8479;
}
.ipi-crumbs__sep { color: var(--ipi-gold); }
.ipi-site .ipi-crumbs a { color: var(--ipi-ink); transition: color 0.4s ease; }
.ipi-site .ipi-crumbs a:hover { color: var(--ipi-gold); }
.ipi-product {
	/* Gallery width: max 560px, and narrower on short screens so photo + thumbnails fit in view. */
	--ipi-gallery-w: min(560px, calc((100vh - 230px) * 0.926));
}
.ipi-product__grid {
	display: grid; grid-template-columns: minmax(0, var(--ipi-gallery-w)) minmax(0, 1fr);
	gap: clamp(32px, 5vw, 96px); align-items: start;
}
.ipi-product__gallery { display: flex; flex-direction: column; gap: clamp(10px, 1.2vw, 16px); min-width: 0; }
.ipi-product__main { position: relative; overflow: hidden; aspect-ratio: 1/1.08; background: #EFEBE4; }
.ipi-product__main img { display: block; width: 100%; height: 100%; object-fit: cover; transition: opacity 0.6s var(--ipi-ease); }
.ipi-product__main img.is-incoming { position: absolute; inset: 0; z-index: 1; }
.ipi-product__main img[hidden] { display: none; }
/* Gallery arrows */
.ipi-site .ipi-gallery-arrow {
	position: absolute; top: 50%; z-index: 2; width: 46px; height: 46px; margin-top: -23px; padding: 0;
	display: flex; align-items: center; justify-content: center;
	border: 0; border-radius: 50%; cursor: pointer;
	background: rgba(255, 255, 255, 0.78); color: var(--ipi-ink);
	backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
	box-shadow: 0 8px 22px -14px rgba(17, 17, 17, 0.35);
	opacity: 0.72;
	transition: opacity 0.5s var(--ipi-ease), background 0.4s ease, color 0.4s ease, transform 0.5s var(--ipi-ease);
}
.ipi-gallery-arrow.is-prev { left: clamp(10px, 1.4vw, 20px); }
.ipi-gallery-arrow.is-next { right: clamp(10px, 1.4vw, 20px); }
.ipi-gallery-arrow svg { display: block; }
.ipi-product__main:hover .ipi-gallery-arrow, .ipi-site .ipi-gallery-arrow:focus-visible { opacity: 1; }
.ipi-site .ipi-gallery-arrow:hover { background: #FFFFFF; color: var(--ipi-gold); }
.ipi-site .ipi-gallery-arrow.is-prev:hover { transform: translateX(-2px); }
.ipi-site .ipi-gallery-arrow.is-next:hover { transform: translateX(2px); }
.ipi-site .ipi-gallery-arrow:focus-visible { outline: 1px solid var(--ipi-gold); outline-offset: 2px; }
@media (hover: none) { .ipi-site .ipi-gallery-arrow { opacity: 0.9; } }
@media (max-width: 860px) { .ipi-site .ipi-gallery-arrow { width: 40px; height: 40px; margin-top: -20px; } }
.ipi-product__thumbs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(8px, 0.9vw, 12px); }
.ipi-site .ipi-thumb {
	background: none; border: 0; padding: 0; cursor: pointer; overflow: hidden; aspect-ratio: 1/1;
	opacity: 0.55; outline: 1px solid transparent; outline-offset: -1px; transition: opacity 0.4s ease;
}
.ipi-site .ipi-thumb.is-active { opacity: 1; outline-color: var(--ipi-gold); }
.ipi-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ipi-product__info { display: flex; flex-direction: column; gap: clamp(18px, 2vw, 26px); padding-top: clamp(0px, 1.5vw, 24px); min-width: 0; }
.ipi-product__title {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(34px, 3.8vw, 60px); line-height: 1.04; letter-spacing: -0.018em;
	color: var(--ipi-ink); text-wrap: balance;
}
.ipi-product__price { display: flex; align-items: baseline; gap: 12px; }
.ipi-product__from { font-size: 10px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase; color: var(--ipi-taupe); }
.ipi-product__amount { font-family: var(--ipi-serif); font-size: clamp(24px, 2.2vw, 34px); font-weight: 300; color: var(--ipi-ink); }
.ipi-product__desc { display: flex; flex-direction: column; gap: 1em; }
.ipi-product__details { margin: 0; font-size: 12.5px; font-weight: 400; letter-spacing: 0.06em; line-height: 1.8; color: var(--ipi-taupe); }
.ipi-product__actions { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 14px; }

/* Default pages (classic editor content), index, 404 */
.ipi-basic { padding: clamp(60px, 8vw, 120px) var(--ipi-gutter) var(--ipi-section); }
.ipi-basic__inner { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: clamp(40px, 5vw, 64px); }
.ipi-basic .ipi-intro .ipi-h1 { font-size: clamp(38px, 5.6vw, 84px); line-height: 0.98; letter-spacing: -0.02em; }
.ipi-basic__content { font-size: clamp(14.5px, 1.05vw, 16.5px); font-weight: 300; line-height: 1.9; color: var(--ipi-stone); }
.ipi-basic__content > * { margin: 0 0 1.2em; }
.ipi-basic__content h2, .ipi-basic__content h3 { font-family: var(--ipi-serif); font-weight: 300; color: var(--ipi-ink); line-height: 1.15; margin-top: 1.6em; }
.ipi-basic__content h2 { font-size: clamp(26px, 2.6vw, 40px); }
.ipi-basic__content h3 { font-size: clamp(21px, 1.9vw, 27px); }
.ipi-site .ipi-basic__content a { text-decoration: underline; text-underline-offset: 3px; }
.ipi-basic__item { border-top: 1px solid var(--ipi-line); padding-top: 28px; display: flex; flex-direction: column; gap: 12px; }
.ipi-404 .ipi-intro { gap: clamp(22px, 2.4vw, 34px); min-height: 40vh; justify-content: center; }

/* ==========================================================================
   Coming soon
   ========================================================================== */
.ipi-cs { padding: clamp(32px, 3.6vw, 52px) 0 36px; }
.ipi-cs__head {
	padding: 0 var(--ipi-gutter); display: flex; flex-direction: column; align-items: center;
	text-align: center; gap: clamp(16px, 1.6vw, 22px);
}
.ipi-cs__title {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(30px, 3.4vw, 50px); line-height: 1; letter-spacing: -0.01em; color: var(--ipi-ink);
}
.ipi-cs__media {
	position: relative; overflow: hidden; margin-top: clamp(32px, 3.6vw, 52px);
	height: clamp(420px, 72vh, 860px); background: #EFEBE4;
}
.ipi-cs__media img, .ipi-cs__media video {
	display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%;
}
.ipi-cs__logo {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none;
	/* Soft shade behind the logo keeps it legible over light photos / video. */
	background: radial-gradient(ellipse 34% 26% at 50% 50%, rgba(17, 17, 17, 0.26), rgba(17, 17, 17, 0) 100%);
}
.ipi-cs__logo svg { filter: drop-shadow(0 1px 14px rgba(17, 17, 17, 0.3)); }
@media (max-width: 860px) {
	.ipi-cs__logo { background: radial-gradient(ellipse 60% 22% at 50% 50%, rgba(17, 17, 17, 0.3), rgba(17, 17, 17, 0) 100%); }
}
.ipi-cs__cols {
	max-width: 1520px; margin: 0 auto; padding: clamp(64px, 8vw, 120px) var(--ipi-gutter) clamp(64px, 8vw, 110px);
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(48px, 6vw, 120px); align-items: start;
}
.ipi-cs__col { display: flex; flex-direction: column; gap: clamp(26px, 2.8vw, 40px); }
.ipi-cs__h2 {
	margin: 0; font-family: var(--ipi-serif); font-weight: 300;
	font-size: clamp(34px, 3.8vw, 60px); line-height: 1.04; letter-spacing: -0.018em; color: var(--ipi-ink);
}
.ipi-cs__here { align-items: flex-end; text-align: right; }
.ipi-cs__details { display: flex; flex-direction: column; gap: 24px; align-items: flex-end; }
.ipi-cs__copy {
	margin: 0; text-align: center; font-size: 9.5px; font-weight: 400; letter-spacing: 0.24em;
	text-transform: uppercase; color: #989087;
}
@media (max-width: 860px) {
	.ipi-cs__media { height: clamp(320px, 62vh, 560px); }
	.ipi-cs__cols { grid-template-columns: minmax(0, 1fr); }
	.ipi-cs__here, .ipi-cs__details { align-items: flex-start; text-align: left; }
}

/* ==========================================================================
   Footer
   ========================================================================== */
.ipi-footer { background: #0E0E0E; color: var(--ipi-cream); padding: clamp(56px, 7vw, 88px) var(--ipi-gutter) 36px; }
.ipi-footer__inner { max-width: 1520px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: clamp(30px, 3.4vw, 46px); }
.ipi-footer__logo { display: flex; justify-content: center; }
.ipi-footer__links {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
	gap: clamp(18px, 2.4vw, 34px); font-size: 13.5px; font-weight: 300; letter-spacing: 0.02em;
}
.ipi-site .ipi-footer__links a { color: var(--ipi-line); transition: color 0.4s ease; }
.ipi-site .ipi-footer__links a:hover { color: var(--ipi-gold); }
.ipi-footer__dot { color: #4E4741; }
.ipi-footer__copy { font-size: 9.5px; font-weight: 400; letter-spacing: 0.24em; text-transform: uppercase; color: #989087; }

/* ==========================================================================
   Mobile (≤ 860px) — mirrors the design's isMobile branch
   ========================================================================== */
@media (max-width: 860px) {
	.ipi-logo-row, .ipi-nav, .ipi-panel { display: none !important; }
	.ipi-mbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 14px 20px; }
	.ipi-site .ipi-burger {
		background: none; border: 0; cursor: pointer; padding: 8px 0;
		display: flex; flex-direction: column; gap: 5px; width: 26px; justify-self: start;
	}
	.ipi-burger span { display: block; width: 24px; height: 1px; background: var(--ipi-ink); }
	.ipi-mbar__logo { justify-self: center; }

	.ipi-hero { padding: 0; }
	.ipi-hero__row { display: flex; flex-direction: column-reverse; gap: 28px; }
	.ipi-hero__text { padding: 8px 24px 0; }
	.ipi-hero__media { min-height: clamp(320px, 58vw, 560px); }

	.ipi-catalogue__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ipi-product__grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
	[data-mosaic] { grid-template-columns: 1fr 1fr !important; grid-template-rows: none !important; aspect-ratio: auto !important; }
	/* Roles and order come from ipi_mosaic_tiles(): big → full width first, sq → square pairs, wide → odd one out. */
	[data-mosaic] > div { grid-column: auto !important; grid-row: auto !important; aspect-ratio: 1/1; order: var(--mo, 0); }
	[data-mosaic] > div[data-mob="big"] { grid-column: 1 / -1 !important; aspect-ratio: 3/4; }
	[data-mosaic] > div[data-mob="wide"] { grid-column: 1 / -1 !important; aspect-ratio: 16/10; }
	[data-mosaic] > div[data-mob="hide"] { display: none !important; }
	[data-copy] { display: contents !important; }
	[data-copy] > * { width: 100%; text-align: left; margin: 0; }
	[data-copy] > h2 { order: -10; }
	[data-copy] > span, [data-copy] > p { order: 99; }
	[data-copy] > span { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.ipi-panel, .ipi-drawer, .ipi-drawer__sub { animation: none !important; }
	.ipi-card__media img, .ipi-product__main img { transition: none; }
}