/* ==========================================================================
   RABTORA MEDIA — "Pressed & Embossed" gifting theme
   Loaded AFTER main.css. Re-themes the advertising template into a
   corporate-gifting identity.

   Core idea: the page behaves like the material we brand. Panels are
   pressed INTO the board or raised OUT of it, because deboss / emboss /
   engrave is literally the service being sold.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,100..900&family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;450;500;600&display=swap");

/* ---------- Tokens ------------------------------------------------------ */
:root {
	/* Ground: a warm grey board. Mid-light on purpose — a deboss needs a
	   surface with room for both a light edge and a dark well. */
	--board:        #E6E2D9;
	--board-lift:   #EFECE5;
	--board-deep:   #D8D3C8;
	--board-well:   #CFC9BC;

	--ink:          #1A1815;
	--ink-soft:     #6A645A;
	--ink-faint:    #97907F;

	/* Oxblood ribbon — the one saturated note on the page. */
	--ribbon:       #8E2B37;
	--ribbon-deep:  #6E2029;

	/* Antique brass. Reserved for the foil sample only. */
	--brass:        #A98B5D;
	--brass-hi:     #E3CFA4;

	/* Retheme the template's own accent so inherited rules follow along. */
	--primary-color: #8E2B37;

	--rule: rgba(26, 24, 21, .12);

	--font-display: "Archivo", "Sen", system-ui, sans-serif;
	--font-body:    "IBM Plex Sans", "Sen", system-ui, sans-serif;
	--font-util:    "IBM Plex Mono", ui-monospace, monospace;

	/* Pressed-surface shadow recipes */
	--press-in:  inset 2px 2px 5px rgba(72, 64, 48, .30),
	             inset -2px -2px 4px rgba(255, 255, 255, .75);
	--press-in-deep: inset 3px 3px 9px rgba(72, 64, 48, .38),
	             inset -2px -2px 5px rgba(255, 255, 255, .70);
	--press-out: 4px 4px 10px rgba(72, 64, 48, .22),
	             -4px -4px 9px rgba(255, 255, 255, .80);
	--press-out-sm: 2px 2px 5px rgba(72, 64, 48, .18),
	             -2px -2px 5px rgba(255, 255, 255, .75);
}

/* ---------- Base -------------------------------------------------------- */
body {
	font-family: var(--font-body);
	background: var(--board);
	color: var(--ink);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5,
.section-title__title,
.hero-section .hero-content h1 {
	font-family: var(--font-display);
	color: var(--ink);
	font-stretch: 112%;
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.05;
}

p { color: var(--ink-soft); }

a { color: var(--ribbon); }
a:hover { color: var(--ribbon-deep); }

::selection { background: var(--ribbon); color: #fff; }

:focus-visible {
	outline: 2px solid var(--ribbon);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Utility voice — spec-plate labels. Used for eyebrows, tags, step numbers. */
.eyebrow,
.project-one__tag p,
.premium-step-number,
.finish__meta,
.spec__key {
	font-family: var(--font-util);
	text-transform: uppercase;
	letter-spacing: .16em;
	font-size: 11px;
	font-weight: 500;
}

.eyebrow {
	color: var(--ink-faint);
	display: block;
	margin-bottom: 18px;
}
.eyebrow::before {
	content: "";
	display: inline-block;
	width: 26px;
	height: 1px;
	background: var(--ink-faint);
	vertical-align: middle;
	margin-right: 12px;
}

/* ---------- Pressed primitives ------------------------------------------ */
.press-in {
	background: var(--board);
	box-shadow: var(--press-in);
	border-radius: 3px;
}
.press-out {
	background: var(--board-lift);
	box-shadow: var(--press-out);
	border-radius: 3px;
}

/* ---------- Header ------------------------------------------------------ */
.header,
.navbar-area {
	background: var(--board);
	box-shadow: 0 1px 0 var(--rule);
}
.sticky {
	background: var(--board) !important;
	box-shadow: 0 2px 14px rgba(72, 64, 48, .14) !important;
}
#nav li a {
	font-family: var(--font-util);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--ink) !important;
	font-weight: 500;
}
#nav li a:hover,
#nav li a.active {
	color: var(--ribbon) !important;
}
.navbar-brand img { max-height: 46px; width: auto; }

/* ---------- Hero -------------------------------------------------------- */
/* Replaces the stock-video skyline: the subject is the branded object,
   seated in a recessed well like a gift in its foam insert. */
.gift-hero {
	background: var(--board);
	padding: 96px 0 104px;
	position: relative;
	overflow: hidden;
}
.gift-hero::after {
	/* faint pressed rule anchoring the section */
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 2px;
	background: linear-gradient(180deg, rgba(72,64,48,.16), rgba(255,255,255,.7));
}
.gift-hero__grid {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: 64px;
	align-items: center;
}
.gift-hero h1 {
	font-size: clamp(38px, 5.4vw, 74px);
	font-stretch: 118%;
	font-weight: 800;
	letter-spacing: -0.035em;
	margin-bottom: 22px;
}
.gift-hero h1 .press-word {
	/* the headline's key phrase, engraved into the board */
	color: var(--board-well);
	text-shadow: 0 1px 0 rgba(255, 255, 255, .85),
	             0 -1px 1px rgba(72, 64, 48, .45);
}
.gift-hero__lead {
	font-size: 17px;
	max-width: 46ch;
	margin-bottom: 32px;
}
.gift-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }

.gift-hero__figure {
	position: relative;
	padding: 22px;
	border-radius: 4px;
	background: var(--board);
	box-shadow: var(--press-in-deep);
}
.gift-hero__figure img {
	display: block;
	width: 100%;
	height: 420px;
	object-fit: cover;
	border-radius: 2px;
	box-shadow: 0 10px 24px rgba(72, 64, 48, .28);
}
.gift-hero__stamp {
	position: absolute;
	right: -14px;
	bottom: -14px;
	background: var(--ribbon);
	color: #fff;
	font-family: var(--font-util);
	font-size: 10px;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: 12px 16px;
	border-radius: 2px;
	box-shadow: 3px 3px 10px rgba(72, 64, 48, .3);
	line-height: 1.5;
}
.gift-hero__stamp b { display: block; font-size: 15px; letter-spacing: .05em; }

/* ---------- Buttons ----------------------------------------------------- */
.thm-btn,
.main-btn,
.about-four__btn,
.trust-one__btn {
	font-family: var(--font-util);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .14em;
	background: var(--ribbon);
	color: #fff;
	padding: 17px 34px;
	border-radius: 2px;
	box-shadow: 3px 3px 8px rgba(72, 64, 48, .25),
	            inset 0 1px 0 rgba(255, 255, 255, .18);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.thm-btn:hover,
.main-btn:hover,
.about-four__btn:hover,
.trust-one__btn:hover {
	background: var(--ribbon-deep);
	color: #fff;
	/* the button presses in */
	transform: translate(2px, 2px);
	box-shadow: 1px 1px 4px rgba(72, 64, 48, .3),
	            inset 0 1px 0 rgba(255, 255, 255, .12);
}
.thm-btn--ghost {
	background: var(--board);
	color: var(--ink);
	box-shadow: var(--press-out-sm);
}
.thm-btn--ghost:hover {
	background: var(--board);
	color: var(--ribbon);
	box-shadow: var(--press-in);
}

/* ---------- Section titles ---------------------------------------------- */
.section-title__title,
.section-title h2 {
	font-size: clamp(27px, 3.3vw, 42px);
	margin-bottom: 14px;
}
.section-title p { color: var(--ink-soft); }

/* ==========================================================================
   SIGNATURE — One logo, four finishes
   The same mark rendered as deboss, foil, engrave and embroidery. Built by
   masking the real logo, so this is the actual client mark, not an mockup.
   ========================================================================== */
.finishes {
	padding: 96px 0;
	background: var(--board);
	border-top: 1px solid rgba(255, 255, 255, .5);
}
.finishes__head { max-width: 620px; margin-bottom: 52px; }
.finishes__head h2 { font-size: clamp(26px, 3.2vw, 40px); margin-bottom: 14px; }

.finishes__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
}
.finish {
	background: var(--board);
	border-radius: 3px;
	padding: 0;
	border: 0;
	text-align: left;
	box-shadow: var(--press-out-sm);
	transition: box-shadow .25s ease, transform .25s ease;
	overflow: hidden;
}
.finish:hover { transform: translateY(-3px); box-shadow: var(--press-out); }

.finish__plate {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 132px;
	margin: 14px 14px 0;
	border-radius: 2px;
	box-shadow: var(--press-in);
}
/* the mark itself — logo used as a mask so each finish can be styled */
.finish__mark {
	width: 66%;
	height: 54px;
	-webkit-mask: url("../images/logo/rabtor-logo.png") center / contain no-repeat;
	mask: url("../images/logo/rabtor-logo.png") center / contain no-repeat;
}
.finish__body { padding: 16px 18px 20px; }
.finish__name {
	display: block;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 16px;
	letter-spacing: -0.01em;
	margin-bottom: 4px;
	color: var(--ink);
}
.finish__meta { color: var(--ink-faint); display: block; }

/* — deboss: mark sits below the surface — */
.finish--deboss .finish__plate { background: var(--board); }
.finish--deboss .finish__mark {
	background: var(--board-well);
	filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9))
	        drop-shadow(0 -1px 1px rgba(72, 64, 48, .55));
}

/* — foil: brass with a sheen that sweeps on hover — */
.finish--foil .finish__plate { background: #2A2622; box-shadow: inset 2px 2px 6px rgba(0,0,0,.6); }
.finish--foil .finish__mark {
	background: linear-gradient(115deg,
		var(--brass) 0%, var(--brass-hi) 26%, var(--brass) 44%,
		#8A6F45 62%, var(--brass-hi) 82%, var(--brass) 100%);
	background-size: 260% 100%;
	background-position: 0% 0;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .55));
	transition: background-position .7s ease;
}
.finish--foil:hover .finish__mark { background-position: 100% 0; }

/* — engrave: cut into brushed metal — */
.finish--engrave .finish__plate {
	background:
		repeating-linear-gradient(90deg,
			rgba(255,255,255,.5) 0 1px, rgba(0,0,0,.03) 1px 3px),
		linear-gradient(160deg, #C9C6C0, #A8A49C);
	box-shadow: inset 2px 2px 6px rgba(60,58,54,.5);
}
.finish--engrave .finish__mark {
	background: #6E6A63;
	filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .8));
}

/* — embroidery: stitched thread, sitting proud of the cloth — */
.finish--embroider .finish__plate {
	background:
		repeating-linear-gradient(45deg,
			rgba(0,0,0,.05) 0 2px, transparent 2px 4px),
		#2F3E46;
	box-shadow: inset 2px 2px 6px rgba(0,0,0,.5);
}
.finish--embroider .finish__mark {
	background:
		repeating-linear-gradient(58deg,
			#F0EBE0 0 2px, #C9C0AE 2px 4px);
	filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, .5));
}

/* ---------- Category cards (project-one) -------------------------------- */
/* Template hid the product behind a pink wash and a white title slab.
   On a gifting site the product has to be visible, so the photo leads and
   the label sits under it on its own plate. */
.project-one__single {
	background: var(--board-lift);
	border-radius: 3px;
	box-shadow: var(--press-out-sm);
	overflow: hidden;
	transition: box-shadow .25s ease, transform .25s ease;
}
.project-one__single:hover { transform: translateY(-4px); box-shadow: var(--press-out); }

.project-one__img-box::before,
.project-one__img-box::after { display: none !important; }

.project-one__img {
	margin: 12px 12px 0;
	border-radius: 2px;
	box-shadow: var(--press-in);
	overflow: hidden;
}
.project-one__img img {
	display: block;
	width: 100%;
	height: 190px;
	object-fit: cover;
	transition: transform .5s ease;
}
.project-one__single:hover .project-one__img img { transform: scale(1.05); }

.project-one__content {
	position: static !important;
	opacity: 1 !important;
	transform: none !important;
	padding: 14px 16px 18px;
	background: transparent;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.project-one__tag {
	position: static !important;
	background: transparent !important;
	padding: 0 !important;
}
.project-one__tag p { color: var(--ink-faint); margin: 0; }
.project-one__title-box { position: static !important; background: transparent !important; padding: 0 !important; }
.project-one__title {
	font-size: 17px;
	font-weight: 700;
	color: var(--ink) !important;
	margin: 0;
	letter-spacing: -0.015em;
}

/* ---------- Services carousel cards ------------------------------------- */
.services-one__single {
	background: var(--board-lift);
	border-radius: 3px;
	box-shadow: var(--press-out-sm);
	overflow: hidden;
}
/* photo was opacity:0 until hover — a gift shop can't hide its products */
.services-one__content .innerImg { z-index: 0; }
.services-one__content .innerImg img { opacity: 1; }
.services-one__content {
	position: relative;
	min-height: 260px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 20px;
}
.services-one__content::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(26,24,21,0) 34%, rgba(26,24,21,.86) 100%);
	z-index: 1;
}
.services-one__title,
.services-one__icon { position: relative; z-index: 2; }
.services-one__title a,
.services-one__title {
	color: #fff !important;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.015em;
}
.services-one__icon span { color: #fff; font-size: 26px; }
.services-one__plus a {
	background: var(--ribbon);
	color: #fff;
}

/* ---------- Trust strip ------------------------------------------------- */
.trust-one { background: var(--ink); }
.trust-one__title { color: #fff; font-size: clamp(22px, 2.6vw, 32px); }
.trust-one__btn { background: var(--board); color: var(--ink); }
.trust-one__btn:hover { background: #fff; color: var(--ink); }

/* ---------- About ------------------------------------------------------- */
.about-section { background: var(--board); }
.headline { font-size: clamp(28px, 3.4vw, 44px); }
.section-tag {
	font-family: var(--font-util);
	text-transform: uppercase;
	letter-spacing: .16em;
	font-size: 11px;
	color: var(--ink-faint);
}
.main-img-wrapper img,
.image-container img {
	border-radius: 3px;
	box-shadow: var(--press-out);
}
.welcome-one__solutions-icon i { color: var(--ribbon); }

/* ---------- Features ---------------------------------------------------- */
.feature-section { background: var(--board); }
.single-feature {
	background: var(--board-lift);
	border-radius: 3px;
	padding: 26px 24px;
	box-shadow: var(--press-out-sm);
	height: 100%;
	transition: box-shadow .25s ease;
}
.single-feature:hover { box-shadow: var(--press-out); }
.single-feature .feature-icon {
	background: var(--board);
	box-shadow: var(--press-in);
	color: var(--ribbon);
	width: 52px; height: 52px;
	display: flex; align-items: center; justify-content: center;
	border-radius: 3px;
	margin-bottom: 16px;
}
.single-feature h4 { font-size: 17px; margin-bottom: 8px; }

/* ---------- Testimonials ------------------------------------------------ */
.testimonials { background: var(--board-deep); }
.testimonial-item {
	background: var(--board-lift);
	border-radius: 3px;
	box-shadow: var(--press-out-sm);
	padding: 30px 26px;
}
.testimonial-item h3 { font-size: 17px; }
.testimonial-item h4 {
	font-family: var(--font-util);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: var(--ink-faint);
}
.testimonial-item .stars i { color: var(--brass); }
.quote-icon-left, .quote-icon-right { color: var(--board-well); }

/* ---------- CTA --------------------------------------------------------- */
.cta-section { background: var(--board); }
.cta-image img { border-radius: 3px; box-shadow: var(--press-out); }

/* ---------- Inner banner ------------------------------------------------ */
.innerBanner {
	background-color: var(--ink) !important;
	background-blend-mode: multiply;
	padding: 92px 0 78px;
}
.innerBanner::after { background: rgba(26, 24, 21, .62) !important; }
.innerBanner h1 { color: #fff; font-size: clamp(32px, 4.4vw, 56px); }
.thm-breadcrumb,
.thm-breadcrumb li,
.thm-breadcrumb a {
	font-family: var(--font-util);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: rgba(255, 255, 255, .72) !important;
}
.thm-breadcrumb a:hover { color: #fff !important; }

/* ---------- Corporate-gift page (premium-*) ----------------------------- */
.premium-content-wrapper, .service-wrapper { background: var(--board); }
.premium-section { margin-bottom: 84px; }
.premium-section h2 { font-size: clamp(25px, 3vw, 38px); margin-bottom: 12px; }
.premium-section-image img {
	border-radius: 3px;
	box-shadow: var(--press-out);
	width: 100%;
	object-fit: cover;
}
.premium-icon-list { list-style: none; }
.premium-icon-list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 9px 0;
	border-bottom: 1px solid var(--rule);
	color: var(--ink-soft);
}
.premium-icon-list-icon {
	flex: 0 0 22px;
	height: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--board);
	box-shadow: var(--press-in);
	border-radius: 50%;
	color: var(--ribbon);
	font-size: 11px;
	margin-top: 2px;
}

/* process steps — a real sequence, so the numbering earns its place */
.premium-steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.premium-step {
	background: var(--board-lift);
	border-radius: 3px;
	padding: 26px 22px 24px;
	box-shadow: var(--press-out-sm);
	position: relative;
}
.premium-step-number {
	width: 34px; height: 34px;
	display: flex; align-items: center; justify-content: center;
	background: var(--board);
	box-shadow: var(--press-in);
	border-radius: 50%;
	color: var(--ribbon);
	font-size: 12px;
	margin-bottom: 16px;
}
.premium-step h3 { font-size: 16px; margin-bottom: 8px; }
.premium-step p { font-size: 14.5px; }

.premium-features-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.premium-three-col {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.premium-feature-box {
	background: var(--board-lift);
	border-radius: 3px;
	padding: 26px 22px;
	box-shadow: var(--press-out-sm);
	transition: box-shadow .25s ease, transform .25s ease;
}
.premium-feature-box:hover { transform: translateY(-3px); box-shadow: var(--press-out); }
.premium-feature-icon {
	font-size: 24px;
	width: 50px; height: 50px;
	display: flex; align-items: center; justify-content: center;
	background: var(--board);
	box-shadow: var(--press-in);
	border-radius: 3px;
	margin-bottom: 16px;
}
.premium-feature-box h3 { font-size: 16px; margin-bottom: 7px; }
.premium-feature-box p { font-size: 14.5px; }

.premium-two-col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 52px;
	align-items: center;
}

.premium-quote-section {
	background: var(--ink);
	color: #fff;
	padding: 62px 48px;
	border-radius: 3px;
	text-align: center;
}
.premium-quote-text {
	font-family: var(--font-display);
	font-size: clamp(20px, 2.5vw, 30px);
	font-weight: 600;
	font-stretch: 105%;
	letter-spacing: -0.02em;
	line-height: 1.35;
	color: #fff;
	max-width: 24ch;
	margin: 0 auto 20px;
}
.premium-quote-author {
	font-family: var(--font-util);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .16em;
	color: rgba(255, 255, 255, .6);
}

/* ---------- Footer ------------------------------------------------------ */
.footer {
	background: var(--ink);
	color: rgba(255, 255, 255, .72);
	padding-top: 72px;
}
.footer .footer-widget .desc { color: rgba(255, 255, 255, .6); font-size: 14.5px; }
.footer .footer-widget h3 {
	font-family: var(--font-util);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .16em;
	color: rgba(255, 255, 255, .45);
	margin-bottom: 18px;
}
.footer .footer-widget .links li a,
.footer .contact-item .text-content,
.footer .contact-item a { color: rgba(255, 255, 255, .78); font-size: 14.5px; }
.footer .footer-widget .links li a:hover,
.footer .contact-item a:hover { color: #fff; }
.footer .contact-item .icon { color: var(--brass); }
.footer .social-links li a {
	background: rgba(255, 255, 255, .08);
	color: #fff;
	border-radius: 3px;
}
.footer .social-links li a:hover { background: var(--ribbon); }
.footer .logo img { filter: brightness(0) invert(1); max-height: 42px; width: auto; }

/* ---------- Scroll-to-top ----------------------------------------------- */
.scroll-top {
	background: var(--ribbon);
	color: #fff;
	border-radius: 3px;
	box-shadow: 3px 3px 10px rgba(72, 64, 48, .3);
}

/* ---------- Contact form ------------------------------------------------ */
input[type="text"], input[type="email"], input[type="tel"],
select, textarea {
	background: var(--board) !important;
	border: 0 !important;
	box-shadow: var(--press-in) !important;
	border-radius: 2px !important;
	color: var(--ink) !important;
	font-family: var(--font-body) !important;
}
input:focus, select:focus, textarea:focus {
	outline: 2px solid var(--ribbon) !important;
	outline-offset: 1px;
}
label { font-family: var(--font-util); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--ink-faint) !important; }

/* ---------- 404 --------------------------------------------------------- */
.nf-code {
	font-family: var(--font-display);
	font-stretch: 125%;
	background: none !important;
	-webkit-text-fill-color: var(--board-well) !important;
	color: var(--board-well) !important;
	text-shadow: 0 2px 0 rgba(255, 255, 255, .9),
	             0 -2px 2px rgba(72, 64, 48, .5);
}
.nf-cats a {
	background: var(--board) !important;
	border: 0 !important;
	box-shadow: var(--press-out-sm);
	color: var(--ink) !important;
	font-family: var(--font-util);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .1em;
}
.nf-cats a:hover { box-shadow: var(--press-in); color: var(--ribbon) !important; }

/* ---------- Legal pages ------------------------------------------------- */
.privacy-content, .terms-content { background: var(--board); }

/* ---------- Responsive -------------------------------------------------- */
@media (max-width: 991px) {
	.gift-hero__grid { grid-template-columns: 1fr; gap: 40px; }
	.gift-hero { padding: 64px 0 72px; }
	.gift-hero__figure img { height: 300px; }
	.finishes__grid { grid-template-columns: repeat(2, 1fr); }
	.premium-steps, .premium-features-grid { grid-template-columns: repeat(2, 1fr); }
	.premium-three-col { grid-template-columns: 1fr; }
	.premium-two-col { grid-template-columns: 1fr; gap: 32px; }
	.navbar-area { background: var(--board); }
	#nav { padding: 12px 0; }
}
@media (max-width: 575px) {
	.finishes__grid { grid-template-columns: 1fr; }
	.premium-steps, .premium-features-grid { grid-template-columns: 1fr; }
	.gift-hero__stamp { right: 8px; bottom: -10px; }
	.premium-quote-section { padding: 40px 24px; }
}

/* ---------- Motion preferences ------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
	.finish:hover,
	.project-one__single:hover,
	.premium-feature-box:hover { transform: none; }
}

/* ==========================================================================
   Pass 2 — corrections after visual review
   ========================================================================== */

/* The template pulled these sections up to overlap the old video hero
   (services-one: -120px, trust-one: -360px with 433px of top padding).
   The new hero is a flow section, so that scaffolding has to go. */
.services-one {
	margin-top: 0;
	background: var(--board);
	padding-top: 88px;
}
.trust-one {
	margin-top: 0;
	padding: 84px 0;
	background-color: var(--ink);
}
.trust-one__img { display: none; }

/* Feature cards were 318px tall with the content stranded at the top. */
.single-feature {
	margin-bottom: 24px;
	padding: 28px 26px 26px;
	padding-right: 26px !important;
}
.single-feature .feature-icon {
	width: 52px;
	height: 52px;
	margin-bottom: 18px;
}
/* kill the template's pink lozenge behind the icon */
.single-feature .feature-icon::before,
.single-feature .feature-icon::after {
	display: none !important;
}
.single-feature .feature-icon i { color: var(--ribbon); font-size: 22px; }
.single-feature:hover .feature-icon i { color: var(--ribbon-deep); }
.single-feature p { font-size: 14.5px; margin: 0; }

/* Services carousel: titles were clipping and colliding with the + button. */
.services-one__single { position: relative; }
.services-one__content {
	min-height: 300px;
	padding: 22px 22px 26px;
}
.services-one__title {
	margin: 0;
	padding-right: 52px;      /* clear of the + button */
	line-height: 1.25;
}
.services-one__plus {
	position: absolute;
	top: auto;
	bottom: 20px;
	right: 18px;
	z-index: 3;
}
.services-one__plus a {
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 3px;
	box-shadow: 2px 2px 6px rgba(0, 0, 0, .35);
}
.services-one__icon { margin-bottom: 10px; }
.services-one__shape-1 { display: none; }   /* decorative texture, not needed here */

/* — Signature refinements — */

/* deboss was too faint to read as pressed */
.finish--deboss .finish__plate { box-shadow: var(--press-in-deep); }
.finish--deboss .finish__mark {
	background: #C3BCAC;
	filter: drop-shadow(0 1.5px 0 rgba(255, 255, 255, .95))
	        drop-shadow(0 -1.5px 1px rgba(60, 52, 38, .75));
}

/* brushed metal was reading as corduroy — much finer grain */
.finish--engrave .finish__plate {
	background:
		repeating-linear-gradient(90deg,
			rgba(255, 255, 255, .40) 0 0.5px,
			rgba(120, 118, 112, .16) 0.5px 1.5px),
		linear-gradient(168deg, #D3D0CA 0%, #B4B0A8 48%, #C6C2BB 100%);
	box-shadow: inset 2px 2px 7px rgba(60, 58, 54, .55),
	            inset -1px -1px 3px rgba(255, 255, 255, .5);
}
.finish--engrave .finish__mark {
	background: #625E57;
	filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .9));
}

/* ---------- Section rhythm --------------------------------------------- */
.project-one { padding: 88px 0; }
.about-section { padding: 88px 0 !important; }
.feature-section { padding: 88px 0 70px; }
.testimonials { padding: 88px 0; }
.cta-section { padding: 88px 0 96px !important; }

@media (max-width: 991px) {
	.services-one, .project-one, .about-section,
	.feature-section, .testimonials { padding: 56px 0 !important; }
	.trust-one { padding: 56px 0; }
	.finishes { padding: 56px 0; }
}