/**
 * Shared responsive ranges:
 * mobile < 768px; tablet 768–1023px; laptop 1024–1279px;
 * desktop 1280–1599px; large desktop >= 1600px.
 */

/* Mobile: below 768px. */
@media (max-width: 767px) {
	:root {
		--layout-gutter: var(--space-4);
	}

	.section {
		padding-block: var(--space-8);
	}

	.site-header__brand-inner {
		position: relative;
		min-height: 4rem;
		grid-template-columns: 1fr auto 1fr;
	}

	.site-header.is-scrolled .site-header__brand-inner {
		min-height: 4rem;
	}

	.site-title {
		font-size: 1.5rem;
		letter-spacing: 0.14em;
	}

	.custom-logo,
	.site-header.is-scrolled .custom-logo {
		max-height: 2.5rem;
	}

	.js .menu-toggle {
		z-index: calc(var(--z-overlay) + 1);
		display: inline-flex;
		grid-column: 1;
		grid-row: 1;
		justify-self: start;
	}

	.site-header__mobile-whatsapp {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.75rem;
		height: 2.75rem;
		min-width: 44px;
		min-height: 44px;
		grid-column: 3;
		grid-row: 1;
		justify-self: end;
		color: var(--color-navy);
		text-decoration: none;
		border-radius: var(--radius-soft);
		transition: color var(--transition-micro), transform var(--transition-micro);
	}

	.site-header__mobile-whatsapp:hover,
	.site-header__mobile-whatsapp:focus-visible {
		color: var(--color-gold);
		transform: scale(1.06);
	}

	.site-header__mobile-whatsapp svg {
		width: 1.375rem;
		height: 1.375rem;
		display: block;
	}

	.primary-navigation {
		width: 100%;
		border-top: 1px solid var(--color-border);
	}

	.primary-navigation__inner {
		display: flex;
		min-height: auto;
		align-items: stretch;
		flex-direction: column;
		justify-content: flex-start;
		padding-block: var(--space-6);
	}

	.js .primary-navigation {
		position: fixed;
		z-index: var(--z-overlay);
		top: 4rem;
		right: 0;
		bottom: 0;
		left: 0;
		border-top: 1px solid var(--color-border);
		background: var(--color-white);
		opacity: 0;
		pointer-events: none;
		transform: translateY(calc(-1 * var(--space-3)));
		transition: opacity var(--transition-micro), transform var(--transition-micro), visibility 0s linear var(--duration-micro);
		visibility: hidden;
	}

	.js .primary-navigation.is-open {
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0);
		transition-delay: 0s;
		visibility: visible;
	}

	.menu {
		align-items: stretch;
		flex-direction: column;
		gap: 0;
		justify-content: flex-start;
	}

	.menu a {
		min-height: var(--space-8);
		border-bottom: 1px solid var(--color-border);
		font-family: var(--font-family-heading);
		font-size: clamp(1.75rem, 7vw, 2.25rem);
		font-weight: 500;
		letter-spacing: -0.015em;
		text-transform: none;
	}

	.menu a::after {
		display: none;
	}

	.menu-item-has-children > a {
		padding-inline-end: var(--space-5);
	}

	.menu-item-has-children > a::before {
		right: var(--space-1);
		font-family: var(--font-family-body);
		font-size: 0.65em;
	}

	.sub-menu {
		position: static;
		display: grid;
		min-width: 0;
		padding: 0 0 var(--space-3) var(--space-4);
		border: 0;
		border-bottom: 1px solid var(--color-border);
		box-shadow: none;
		opacity: 1;
		pointer-events: auto;
		transform: none;
		visibility: visible;
	}

	.sub-menu a {
		min-height: 2.75rem;
		border-bottom: 0;
		font-family: var(--font-family-body);
		font-size: var(--font-size-sm);
		font-weight: 500;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	.hero__frame {
		display: grid;
		width: 100%;
		min-height: 0;
		grid-template-columns: 1fr;
	}

	.hero-carousel {
		position: relative;
		inset: auto;
		height: clamp(12.5rem, 54vw, 14.5rem);
		grid-row: 1;
	}

	.hero-carousel__viewport,
	.hero-carousel__placeholder {
		height: 100%;
		min-height: 0;
	}

	.hero-carousel__image {
		object-position: center center;
	}

	.hero-carousel__image--m-center {
		object-position: center center;
	}

	.hero-carousel__image--m-top-center {
		object-position: center top;
	}

	.hero-carousel__image--m-center-right {
		object-position: center right;
	}

	.hero-carousel__image--m-center-left {
		object-position: center left;
	}

	.hero-carousel__slide.is-active .hero-carousel__image {
		animation: none;
		transform: none;
	}

	.hero__content-container {
		position: static;
		width: 100%;
		grid-row: 2;
		padding: 0;
	}

	.hero__panel {
		position: static;
		width: 100%;
		transform: none;
		background: var(--color-ivory);
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		border: 0;
		box-shadow: none;
	}

	.hero__panel-inner {
		width: min(100% - (2 * var(--space-5)), 32rem);
		padding: var(--space-5) 0 var(--space-6);
		margin-inline: auto;
		align-items: center;
		justify-items: center;
		gap: var(--space-3);
		text-align: center;
	}

	.hero__panel .eyebrow {
		justify-content: center;
		text-align: center;
		font-size: var(--font-size-xs);
	}

	.hero__panel h1 {
		max-width: 11ch;
		margin-inline: auto;
		font-size: clamp(2rem, 8.8vw, 2.6rem);
		line-height: 0.96;
		text-align: center;
	}

	.hero__title-first,
	.hero__title-break {
		display: block;
	}

	.hero__title-first {
		white-space: nowrap;
	}

	.hero__copy {
		max-width: 21rem;
		margin-inline: auto;
		font-size: 0.875rem;
		line-height: 1.45;
		text-align: center;
	}

	.hero__cta {
		min-height: 2.625rem;
		padding: var(--space-3) var(--space-5);
		margin-block-start: var(--space-1);
	}

	.hero-carousel__controls {
		position: absolute;
		right: auto;
		bottom: var(--space-3);
		left: 50%;
		transform: translateX(-50%);
		z-index: 3;
	}


	.brand-statement__inner {
		gap: var(--space-5);
	}

	.bridal-spotlight__layout,
	.vip-bride__layout {
		grid-template-columns: 1fr;
		gap: var(--space-6);
	}

	.bridal-spotlight__media {
		grid-column: 1;
		aspect-ratio: 4 / 3;
	}

	.bridal-spotlight__content {
		grid-column: 1;
		gap: var(--space-4);
	}

	.bridal-spotlight__actions {
		align-items: flex-start;
		flex-direction: column;
	}

	.vip-bride__content {
		gap: var(--space-4);
	}

	.vip-bride__media {
		aspect-ratio: 4 / 3;
	}

	.portfolio-preview__grid {
		margin-block-start: var(--space-7);
		grid-template-columns: 1fr;
		gap: var(--space-7);
	}

	.portfolio-card__media {
		aspect-ratio: 4 / 3;
	}

	.brand-strip {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.brand-strip li,
	.brand-strip li:nth-child(4n + 1),
	.brand-strip li:nth-last-child(-n + 4) {
		border: 0;
		border-top: 1px solid var(--color-border);
		border-right: 1px solid var(--color-border);
	}

	.brand-strip li:nth-child(2n + 1) {
		border-left: 1px solid var(--color-border);
	}

	.brand-strip li:nth-last-child(-n + 2) {
		border-bottom: 1px solid var(--color-border);
	}

	.services__grid {
		margin-block-start: var(--space-7);
		grid-template-columns: 1fr;
		gap: 0;
	}

	.service-story,
	.service-story:nth-child(2),
	.service-story:nth-child(3),
	.service-story:nth-child(4) {
		padding-block: var(--space-5);
		margin-block-start: 0;
		align-items: start;
		border-top: 1px solid var(--color-border);
		grid-column: 1;
		grid-template-columns: minmax(7rem, 2fr) minmax(0, 3fr);
		gap: var(--space-4);
	}

	.service-story:last-child {
		border-bottom: 1px solid var(--color-border);
	}

	.service-story__media,
	.service-story:nth-child(2) .service-story__media,
	.service-story:nth-child(3) .service-story__media {
		aspect-ratio: 4 / 5;
	}

	.service-story__content {
		grid-template-columns: 1fr;
		gap: var(--space-3);
	}

	.service-story__content h3 {
		grid-row: auto;
	}

	.service-story__content p {
		font-size: var(--font-size-sm);
	}

	.studio__layout {
		display: block;
	}

	.studio__media {
		aspect-ratio: 4 / 3;
	}

	.studio__content {
		padding: var(--space-6);
	}

	.client-diaries__entries {
		margin-block-start: var(--space-7);
		grid-template-columns: 1fr;
	}

	.diary-entry {
		min-height: auto;
		padding: var(--space-6) 0;
		border-top: 1px solid var(--color-border);
		border-left: 0;
		gap: var(--space-6);
	}

	.diary-entry:last-child {
		border-right: 0;
		border-bottom: 1px solid var(--color-border);
	}

	.page-hero__layout,
	.page-hero__layout--reverse,
	.vip-page-hero__layout {
		min-height: auto;
		padding-block: var(--space-7);
		grid-template-columns: 1fr;
		gap: var(--space-6);
	}

	.page-hero__media,
	.vip-page-hero__media {
		min-height: 0;
		aspect-ratio: 4 / 3;
	}

	.page-hero--simple {
		padding-block: var(--space-8);
	}

	.service-index {
		margin-block-end: var(--space-7);
	}

	.service-index__item {
		min-height: 4.75rem;
		grid-template-columns: 2.75rem minmax(0, 1fr) auto;
	}

	.portfolio-landing__grid {
		grid-template-columns: 1fr;
		gap: var(--space-7);
	}

	.blog-index__grid {
		grid-template-columns: 1fr;
		gap: var(--space-7);
	}

	.site-footer {
		padding-block: 1.625rem 1.125rem;
	}

	.site-footer__grid {
		display: flex;
		flex-direction: column;
		gap: 1.125rem;
		margin-block-end: 0.875rem;
	}

	.site-footer__brand-block {
		padding-inline-end: 0;
		gap: 0.625rem;
	}

	.site-footer__logo {
		height: 2.375rem;
	}

	.site-footer__tagline {
		font-size: 0.82rem;
		line-height: 1.45;
		max-width: 100%;
		color: #b5bfcf;
	}

	.site-footer__cta-wrap {
		margin-block-start: 0.125rem;
	}

	.site-footer__btn-book {
		font-size: 0.72rem;
		letter-spacing: 0.11em;
		padding: 0.625rem 1.125rem;
		width: auto;
		align-self: flex-start;
		white-space: nowrap;
	}

	.site-footer__col-title {
		font-size: 0.7rem;
		letter-spacing: 0.14em;
		margin-block-end: 0.625rem;
	}

	.site-footer__explore-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0.5rem 1.5rem;
	}

	.site-footer__explore-grid a {
		font-size: 0.84rem;
		color: #c9d2e0;
		white-space: nowrap;
		display: inline-block;
		padding: 0.125rem 0;
	}

	.site-footer__contact-group {
		display: grid;
		grid-template-columns: 1.05fr 0.95fr;
		gap: 0.625rem 1rem;
	}

	.site-footer__address {
		font-size: 0.8rem;
		line-height: 1.45;
		color: #c9d2e0;
	}

	.site-footer__connect-list {
		gap: 0.375rem;
		font-size: 0.8rem;
	}

	.site-footer__connect-list a {
		white-space: nowrap;
	}

	.site-footer__meta {
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 0.375rem 0.75rem;
		padding-block-start: 0.75rem;
		margin-block-start: 0;
		font-size: 0.7rem;
	}

	.site-footer__legal-links {
		gap: 0.5rem;
	}

	/* Home V2 Editorial Monograph Mobile */
	.monograph-folio,
	.campaign-folio {
		flex-wrap: wrap;
		gap: var(--space-1) var(--space-2);
	}

	.campaign-folio {
		margin-block-end: var(--space-6);
	}

	/* S1: The Artist’s Atelier Mobile */
	.atelier-statement {
		padding-block: 0 var(--space-8);
	}

	/* Full-bleed edge-to-edge mobile portrait */
	.atelier-statement__mobile-media {
		display: block;
		width: 100%;
		height: clamp(210px, 55vw, 280px);
		margin: 0 0 var(--space-6) 0;
		overflow: hidden;
		border-bottom: 1px solid var(--color-border);
		position: relative;
	}

	.atelier-statement__mobile-image {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 50% 16%;
		display: block;
	}

	/* Hide desktop portrait column completely on mobile */
	.atelier-statement__portrait-col {
		display: none !important;
	}

	.atelier-statement__grid {
		display: block;
	}

	.atelier-statement__narrative-col {
		display: flex;
		flex-direction: column;
		max-width: 100%;
		padding-inline: 0;
	}

	/* 2. Quieter, editorial eyebrow */
	.atelier-statement__eyebrow {
		display: inline-flex;
		align-items: center;
		gap: var(--space-2);
		margin: 0 0 var(--space-3) 0;
	}

	.atelier-statement__eyebrow-accent {
		width: 22px;
		height: 1px;
		background: var(--color-gold);
		opacity: 0.7;
	}

	.atelier-statement__eyebrow-text {
		font-family: var(--font-family-body);
		font-size: clamp(0.72rem, 2.2vw, 0.78rem);
		letter-spacing: 0.22em;
		font-weight: 600;
		text-transform: uppercase;
		color: var(--color-gold);
	}

	/* 1. Lighter, high-contrast serif headline with natural wrapping */
	.atelier-statement__title {
		font-family: var(--font-family-heading);
		font-size: clamp(2.45rem, 11vw, 3.3rem);
		font-weight: 400;
		line-height: 1.02;
		letter-spacing: -0.025em;
		color: var(--color-deep-navy);
		margin: 0 0 var(--space-4) 0;
	}

	.atelier-statement__title-line {
		display: inline;
	}

	.atelier-statement__title em {
		font-style: italic;
		font-family: var(--font-family-heading);
		font-weight: 400;
		color: var(--color-navy);
	}

	/* 3. Refined body copy with comfortable measure */
	.atelier-statement__body {
		font-family: var(--font-family-body);
		font-size: clamp(1rem, 2.8vw, 1.0625rem);
		line-height: 1.7;
		font-weight: 400;
		color: var(--color-text-muted);
		max-width: 38ch;
		margin: 0 0 var(--space-6) 0;
	}

	/* 4 & 5. Centered CTA button with generous vertical gap */
	.atelier-statement__action {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--space-3);
		justify-content: center;
		width: 100%;
		margin: 0;
	}

	.atelier-statement__action .button--atelier-cta,
	.atelier-statement__action .button--atelier-secondary {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: var(--space-2);
		width: 100%;
		min-width: 220px;
		max-width: 280px;
		min-height: 3rem;
		padding: 0.8125rem 1.75rem;
		text-align: center;
	}

	.bridal-services {
		padding-block: var(--space-8);
	}

	.bridal-services__desktop-wrap,
	.bridal-services__desktop-grid {
		display: none;
	}

	.bridal-services__mobile-wrap {
		display: block;
	}

	/* S3: Beauty Services Mobile (2-col grid + full-width lesson) */
	.beauty-services-section {
		padding-block: var(--space-8);
	}

	.beauty-header {
		margin-block-end: var(--space-6);
	}

	.beauty-title {
		font-size: 2.15rem;
	}

	.beauty-primary-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
		margin-block-end: var(--space-6);
	}

	.beauty-card:hover {
		transform: none;
	}

	.beauty-card__media {
		aspect-ratio: 4 / 5;
	}

	.beauty-card__body {
		padding: 14px 12px 14px;
	}

	.beauty-card__title {
		font-size: 1.15rem;
		line-height: 1.2;
		margin-bottom: 4px;
	}

	.beauty-card__condition {
		font-size: 0.5625rem;
		padding: 2px 5px;
		letter-spacing: 0.1em;
		margin-bottom: 6px;
	}

	.beauty-card__desc {
		display: none;
	}

	.beauty-card__highlights {
		margin-bottom: 8px;
		gap: 3px;
	}

	.beauty-card__highlight {
		font-size: 0.6875rem;
		line-height: 1.35;
		padding-left: 10px;
	}

	.beauty-card__highlight::before {
		font-size: 0.625rem;
	}

	.bridal-card__highlights {
		margin-bottom: 12px;
		gap: 4px;
	}

	.bridal-card__highlight {
		font-size: 0.75rem;
		line-height: 1.38;
		padding-left: 12px;
	}

	.beauty-card__footer {
		margin-top: auto;
		padding-top: 10px;
		border-top: 1px solid var(--color-border-subtle);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
	}

	.beauty-card__price,
	.bridal-price {
		margin: 0;
		white-space: nowrap;
	}

	.price-amount {
		font-size: 1.35rem;
	}

	.price-prefix {
		font-size: 0.625rem;
	}

	.price-suffix {
		font-size: 0.6875rem;
	}

	.price-custom {
		font-size: 1.05rem;
	}

	.beauty-text-cta {
		font-size: 0.6875rem;
		letter-spacing: 0.14em;
		gap: 6px;
		min-height: 44px;
		padding: 4px 0;
	}

	.bridal-text-cta {
		min-height: 44px;
	}

	.beauty-lesson-feature {
		grid-template-columns: 1fr;
	}

	.beauty-lesson__media {
		aspect-ratio: 16 / 10;
		min-height: 180px;
	}

	.beauty-lesson__body {
		padding: 22px 18px 24px;
		gap: 12px;
	}

	.beauty-lesson__title {
		font-size: 1.55rem;
	}

	.beauty-lesson__desc {
		font-size: 0.8125rem;
		line-height: 1.55;
	}

	.beauty-lesson__highlights {
		gap: 6px;
	}

	.beauty-lesson__highlight {
		font-size: 0.775rem;
		line-height: 1.4;
		padding-left: 14px;
	}

	.beauty-lesson__footer {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.beauty-button-outlined {
		width: 100%;
		min-height: 44px;
	}

	/* Portfolio Carousel (Mobile < 768px) — Vertical 9:16 Primary Format */
	.portfolio-section {
		padding-block: var(--space-7);
	}

	.portfolio-header {
		margin-bottom: var(--space-5);
		text-align: center;
	}

	.portfolio-header__title {
		font-size: 1.85rem;
	}

	.portfolio-header__copy {
		font-size: var(--font-size-sm);
	}

	.portfolio-carousel__stage {
		height: clamp(520px, 75vh, 620px);
	}

	.portfolio-slide {
		padding: 0 4px;
	}

	.portfolio-slide.is-prev {
		transform: scale(0.86) translate3d(8px, 0, 0);
		opacity: 0.35;
		filter: blur(3px);
	}

	.portfolio-slide.is-next {
		transform: scale(0.86) translate3d(-8px, 0, 0);
		opacity: 0.35;
		filter: blur(3px);
	}

	.portfolio-slide.is-distant {
		transform: scale(0.72) translateZ(0);
		opacity: 0.08;
		filter: blur(6px);
	}

	/* Enlarged Active Portrait Frame: 76–84vw (80vw target), 9:16 aspect ratio */
	.portfolio-card,
	.portfolio-card--portrait,
	.portfolio-card--video {
		width: clamp(280px, 80vw, 360px);
		aspect-ratio: 9 / 16;
		height: auto;
		max-height: calc(100% - 16px);
	}

	.portfolio-card--landscape {
		width: clamp(280px, 80vw, 360px);
		aspect-ratio: 9 / 16;
		height: auto;
		max-height: calc(100% - 16px);
	}

	.portfolio-card__category {
		top: 12px;
		left: 12px;
		padding: 4px 8px;
		font-size: 0.5625rem;
	}

	.portfolio-carousel__controls {
		gap: var(--space-4);
		margin-top: var(--space-5);
		padding-inline: var(--space-4);
		max-width: 160px;
	}

	.portfolio-carousel__arrow {
		width: 44px;
		height: 44px;
		min-width: 44px;
		min-height: 44px;
	}

	.portfolio-video-audio-btn {
		width: 42px;
		height: 42px;
		min-width: 42px;
		min-height: 42px;
		bottom: 34px;
		right: 12px;
	}

	.portfolio-video-timeline {
		bottom: 8px;
		left: 10px;
		right: 10px;
		height: 32px;
	}

	.portfolio-video-timeline__track {
		height: 3px;
	}

	.portfolio-video-timeline__handle {
		width: 12px;
		height: 12px;
		transform: translate(-50%, -50%) scale(1);
	}

	.portfolio-lightbox {
		padding: 16px;
	}

	.portfolio-lightbox__close {
		top: 16px;
		right: 16px;
		width: 34px;
		height: 34px;
	}

	.portfolio-lightbox__img {
		max-width: 94vw;
		max-height: 80vh;
	}

	/* Testimonials Carousel (Mobile < 768px) */
	.testimonials-section {
		padding-block: var(--space-8);
	}

	.testimonials-header {
		margin-bottom: var(--space-5);
	}

	.testimonials-header__title {
		font-size: 1.85rem;
	}

	.testimonials-carousel__track {
		gap: var(--space-4);
	}

	.testimonial-card {
		flex: 0 0 100%;
		min-width: 100%;
	}

	.testimonial-card__inner {
		padding: var(--space-5);
	}

	.testimonial-card__quote {
		font-size: 1.0625rem;
	}

	.testimonials-carousel__controls {
		margin-top: var(--space-5);
		gap: var(--space-3);
	}

	/* Location & Map Section (Mobile < 768px) */
	.location-section {
		padding-block: var(--space-8);
	}

	.location-header {
		margin-bottom: var(--space-6);
	}

	.location-header__title {
		font-size: 1.85rem;
	}

	.location-grid {
		grid-template-columns: 1fr;
		gap: var(--space-6);
	}

	.location-card {
		padding: var(--space-5);
	}

	.location-map {
		min-height: 280px;
	}

	.location-map__frame,
	.location-map__iframe {
		min-height: 280px;
	}

	/* Instagram Section (Mobile < 768px) */
	.instagram-section {
		padding-block: var(--space-8);
	}

	.instagram-layout {
		grid-template-columns: 1fr;
		gap: var(--space-7);
		text-align: center;
	}

	.instagram-narrative {
		align-items: center;
		text-align: center;
		max-width: 100%;
	}

	.instagram-narrative .monograph-folio {
		justify-content: center;
	}

	.instagram-narrative__title {
		font-size: 1.85rem;
	}

	.instagram-badge {
		margin-inline: auto;
	}

	.instagram-narrative__action {
		display: none;
	}

	.instagram-phone-mockup {
		width: 90vw;
		max-width: 395px;
		aspect-ratio: 9 / 19.5;
		margin-inline: auto;
	}

	.instagram-device-cta {
		display: flex;
		justify-content: center;
		margin-top: var(--space-6);
	}
}


/* Tablet: 768–1023px. */
@media (min-width: 768px) and (max-width: 1023px) {
	:root {
		--layout-gutter: var(--space-5);
	}

	.section {
		padding-block: var(--space-9);
	}

	.container {
		max-width: 60rem;
	}

	.site-header__brand-inner {
		min-height: 5rem;
	}

	.site-header.is-scrolled .site-header__brand-inner {
		min-height: 4.25rem;
	}

	.custom-logo {
		max-height: 3.25rem;
	}

	.primary-navigation__inner {
		min-height: 3rem;
	}

	.menu {
		gap: var(--space-5);
	}

	.hero__frame {
		min-height: 30rem;
	}

	.hero__panel {
		width: min(27rem, 44vw);
	}

	.hero__panel-inner {
		padding: var(--space-6);
		gap: var(--space-4);
	}

	.hero__panel h1 {
		font-size: clamp(2rem, 3.8vw, 2.75rem);
	}

	.hero-carousel__placeholder {
		min-height: 30rem;
	}


	.bridal-spotlight__layout {
		gap: var(--space-6);
	}

	.bridal-spotlight__media {
		grid-column: 1 / 7;
	}

	.bridal-spotlight__content {
		grid-column: 7 / 13;
	}

	.vip-bride__layout {
		gap: var(--space-6);
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	}

	.portfolio-preview__grid {
		gap: var(--space-4);
	}

	.brand-strip {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.services__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-8) var(--space-5);
	}

	.service-story,
	.service-story:nth-child(2),
	.service-story:nth-child(3),
	.service-story:nth-child(4) {
		margin-block-start: 0;
		grid-column: span 1;
	}

	.service-story__media,
	.service-story:nth-child(2) .service-story__media,
	.service-story:nth-child(3) .service-story__media {
		aspect-ratio: 4 / 5;
	}

	.service-story__content {
		grid-template-columns: 1fr;
	}

	.service-story__content h3 {
		grid-row: auto;
	}

	.studio__media {
		grid-column: 1 / 9;
	}

	.studio__content {
		padding: var(--space-6);
		grid-column: 7 / 13;
	}

	.page-hero__layout,
	.page-hero__layout--reverse {
		min-height: 30rem;
		padding-block: var(--space-8);
		gap: var(--space-6);
	}

	.vip-page-hero__layout {
		gap: var(--space-6);
	}

	.portfolio-landing__grid {
		gap: var(--space-4);
	}

	.diary-entry {
		padding: var(--space-6);
	}

	.site-footer__grid {
		grid-template-columns: 1.3fr 1fr 1fr 1fr;
		gap: var(--space-5);
	}

	/* Home V2 S1: The Artist’s Atelier Tablet */
	.atelier-statement__grid {
		grid-template-columns: 1fr 1fr;
		gap: var(--space-6);
		align-items: center;
	}

	.atelier-statement__portrait-col {
		max-width: none;
		justify-self: stretch;
	}

	.atelier-statement__portrait .editorial-media-wrapper {
		aspect-ratio: 4 / 5;
	}

	.bridal-services__desktop-wrap,
	.bridal-services__desktop-grid {
		display: none;
	}

	.bridal-services__mobile-wrap {
		display: block;
	}

	.beauty-primary-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-5);
	}

	.beauty-lesson-feature {
		grid-template-columns: 1fr;
	}

	/* Portfolio Carousel (Tablet 768–1023px) */
	.portfolio-carousel__stage {
		height: 520px;
	}

	.portfolio-card,
	.portfolio-card--portrait,
	.portfolio-card--video {
		width: 310px;
		height: 500px;
		max-height: 510px;
		aspect-ratio: 9 / 16;
	}

	.portfolio-card--landscape {
		width: 520px;
		height: 292px;
	}

	/* Testimonials (Tablet 768–1023px) */
	.testimonial-card {
		flex: 0 0 calc((100% - var(--space-6)) / 2);
	}

	/* Location (Tablet 768–1023px) */
	.location-grid {
		grid-template-columns: 1fr;
		gap: var(--space-7);
	}

	.location-map {
		min-height: 350px;
	}

	/* Instagram (Tablet 768–1023px) */
	.instagram-layout {
		grid-template-columns: 1fr;
		gap: var(--space-7);
		text-align: center;
	}

	.instagram-narrative {
		align-items: center;
		text-align: center;
		max-width: 580px;
		margin-inline: auto;
	}

	.instagram-narrative .monograph-folio {
		justify-content: center;
	}

	.instagram-narrative__action {
		display: none;
	}

	.instagram-phone-mockup {
		width: min(90vw, 380px);
		aspect-ratio: 9 / 19.5;
		margin-inline: auto;
	}

	.instagram-device-cta {
		display: flex;
		justify-content: center;
		margin-top: var(--space-6);
	}
}


/* Laptop: 1024–1279px. */
@media (min-width: 1024px) and (max-width: 1279px) {
	:root {
		--layout-gutter: var(--space-6);
	}

	.container {
		max-width: 72rem;
	}

	/* Home V2 Editorial Monograph Laptop */
	.bridal-services__desktop-grid {
		gap: var(--space-6);
	}


	.site-header__brand-inner {
		min-height: 5.5rem;
	}

	.primary-navigation__inner {
		min-height: 3.125rem;
	}

	.menu {
		gap: var(--space-6);
	}

	.hero__frame {
		min-height: 36rem;
	}

	.hero__panel {
		width: min(29.5rem, 38vw);
	}

	.hero__panel-inner {
		padding: var(--space-7);
	}

	.hero-carousel__placeholder {
		min-height: 36rem;
	}


	.service-story__content {
		grid-template-columns: 1fr;
	}

	.service-story__content h3 {
		grid-row: auto;
	}

	.studio__content {
		padding: var(--space-7);
	}
}

/* Desktop: 1280–1599px. */
@media (min-width: 1280px) and (max-width: 1599px) {
	:root {
		--layout-gutter: var(--space-6);
	}

	.container {
		max-width: var(--container-wide);
	}
}

/* Large desktop: 1600px and above. */
@media (min-width: 1600px) {
	:root {
		--layout-gutter: var(--space-7);
	}

	.container {
		max-width: var(--container-max);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hero-carousel__slide {
		transition: none;
	}

	.hero-carousel__slide.is-active .hero-carousel__image {
		animation: none;
		transform: none;
	}

	.hero-carousel__arrow,
	.hero-carousel__dot {
		transition: none;
	}

	.portfolio-carousel__track,
	.portfolio-slide,
	.portfolio-card,
	.portfolio-lightbox,
	.portfolio-lightbox__img {
		transition-duration: 0.01ms !important;
	}
}

@media (prefers-reduced-motion: reduce) and (max-width: 767px) {
	.js .primary-navigation {
		transform: none;
		transition-property: opacity, visibility;
	}
}

