/*
Theme Name: Charley Rose TT5 Child
Theme URI: https://example.com/
Description: Lightweight Twenty Twenty-Five child block theme for Charley Rose UGC.
Author: Pineapple Pineapple LLC
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
Text Domain: charley-rose
*/

:root {
  --cr-rose: #B27C6E;
  --cr-sand: #E8D5C4;
  --cr-green: #24361D;
  --cr-ink: #2A2421;
  --cr-muted: #463C37;
  --cr-cream: #FAF7F2;
  --cr-line: rgba(42,36,33,.15);
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.cr-section { scroll-margin-top: 88px; }
.cr-eyebrow { letter-spacing: .2em; text-transform: uppercase; font-size: .78rem; font-weight: 700; }
.cr-display, .cr-display a { font-family: Georgia, 'Times New Roman', serif; }
.cr-display em { color: var(--cr-sand); }
.cr-arch img { border-radius: 999px 999px 0 0; }
.cr-soft-arch img { border-radius: 999px 999px 2rem 2rem; }
.cr-shadow img { box-shadow: 0 24px 60px rgba(42,36,33,.18); }
.cr-card { height: 100%; }
.cr-card img { transition: transform .35s ease; }
.cr-card:hover img { transform: scale(1.025); }
.cr-package-featured { transform: translateY(-1rem); }
.cr-contact-placeholder { border: 2px dashed rgba(178,124,110,.45); }
.cr-contact-placeholder code { font-size: .85em; }

.wp-block-button__link { transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.wp-block-button__link:hover { transform: translateY(-1px); }

@media (max-width: 781px) {
  .cr-package-featured { transform: none; }
  .cr-hero { padding-top: 2rem !important; }
}
/* Contact Form 7 - Charley Rose */

.cr-form {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.cr-field {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.cr-field label {
	display: block;
	margin: 0;
	color: var(--cr-ink);
	font-size: .78rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .2em;
	text-transform: uppercase;
}

.cr-form .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

.cr-form input[type="text"],
.cr-form input[type="email"],
.cr-form textarea {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 1rem 1.25rem;

	background: var(--cr-cream);
	color: var(--cr-ink);

	border: 2px solid rgba(178,124,110,.25);
	border-radius: .75rem;

	font: inherit;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.5;

	box-shadow: none;
	outline: none;

	transition:
		border-color .2s ease,
		background-color .2s ease,
		box-shadow .2s ease;
}

.cr-form input[type="text"]::placeholder,
.cr-form input[type="email"]::placeholder,
.cr-form textarea::placeholder {
	color: var(--cr-muted);
	opacity: .55;
}

.cr-form input[type="text"]:hover,
.cr-form input[type="email"]:hover,
.cr-form textarea:hover {
	border-color: rgba(178,124,110,.55);
}

.cr-form input[type="text"]:focus,
.cr-form input[type="email"]:focus,
.cr-form textarea:focus {
	background: #fff;
	border-color: var(--cr-rose);
	box-shadow: 0 0 0 4px rgba(178,124,110,.12);
	outline: none;
}

.cr-form textarea {
	min-height: 160px;
	resize: vertical;
}

.cr-submit {
	width: 100%;
}

.cr-form .cr-button {
	display: block;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 1.2rem 1.5rem;

	background: var(--cr-green);
	color: var(--cr-cream);

	border: 0;
	border-radius: .75rem;

	font: inherit;
	font-size: .8rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .15em;
	text-align: center;
	text-transform: uppercase;

	cursor: pointer;

	box-shadow: 0 8px 20px rgba(36,54,29,.16);

	transition:
		background-color .2s ease,
		color .2s ease,
		transform .2s ease,
		box-shadow .2s ease;
}

.cr-form .cr-button:hover {
	background: var(--cr-ink);
	color: var(--cr-cream);
	transform: translateY(-1px);
	box-shadow: 0 10px 24px rgba(42,36,33,.2);
}

.cr-form .cr-button:active {
	transform: translateY(0);
}

.cr-form .cr-button:focus-visible {
	outline: 3px solid rgba(178,124,110,.4);
	outline-offset: 3px;
}

.cr-form .wpcf7-not-valid {
	border-color: var(--cr-rose) !important;
}

.cr-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: .5rem;
	color: var(--cr-rose);
	font-size: .8rem;
	font-weight: 600;
}

.cr-submit .wpcf7-spinner {
	display: block;
	margin: 1rem auto 0;
}

.wpcf7 form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: 1rem 1.25rem;
	border-radius: .75rem;
	font-size: .9rem;
	line-height: 1.5;
}

@media (max-width: 781px) {
	.cr-form {
		gap: 1.5rem;
	}

	.cr-form input[type="text"],
	.cr-form input[type="email"],
	.cr-form textarea {
		padding: .9rem 1rem;
		font-size: 16px;
	}

	.cr-form .cr-button {
		padding: 1.1rem 1.25rem;
	}
}