/*
Theme Name: Simone
Theme URI: https://simonesays.co
Description: The Simone brand on Twenty Twenty-Five: the brand's colours and type as given (ADR-0118), self-hosted (ADR-0140), and the home page ported from Cloudflare Pages (Q-14). Installed by the marketing server build; edit the site in the Site Editor, not here.
Author: Simone Says
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 8.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: simone
Update URI: false
*/

/* Update URI: false keeps WordPress from asking wordpress.org about a theme
   called "simone" there, which is not this one. */

/* What theme.json cannot say. Colours come from its palette as
   --wp--preset--color--<slug>; nothing here invents a colour the brand does
   not have, bar the translucent inks the Pages site already used. */

:root {
	/* Read by the consent plugin's banner and legal links (Q-12). */
	--simone-ink: var(--wp--preset--color--contrast);
	--simone-heading: var(--wp--preset--color--heading);
	--simone-cream: var(--wp--preset--color--cream);
	--simone-ink-quiet: rgba(51, 51, 51, 0.55);
	--simone-rule: rgba(51, 51, 51, 0.15);
	--simone-shadow: 0 30px 60px -32px rgba(51, 51, 51, 0.35);
}

html { scroll-behavior: smooth; }
/* The Pages site sized every box border-box; these drawings were made that way. */
.simone-dayview, .simone-dayview *, .simone-weekstrip, .simone-signal, .simone-letter, .simone-step-num { box-sizing: border-box; }
body { -webkit-font-smoothing: antialiased; }

/* ---------- the type rules (ADR-0118) ---------- */

/* Serif headings show only their first letter capitalised, whatever was
   typed; .verbatim keeps a word as written ("Simone", a price). */
h1, h2, h3,
.wp-block-post-title,
.wp-block-query-title {
	text-transform: lowercase;
}
h1::first-letter, h2::first-letter, h3::first-letter,
.wp-block-post-title::first-letter,
.wp-block-query-title::first-letter {
	text-transform: uppercase;
}
.verbatim { text-transform: none; }

/* Eyebrows: ALL CAPS, DM Sans medium, 2px tracking. */
.simone-eyebrow,
.simone-eyebrow a {
	font-family: var(--wp--preset--font-family--body);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--subheading);
	margin: 0 0 14px;
}

/* Headings set in DM Sans capitals: the band and the contact heading. */
.simone-caps-heading {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 400;
	line-height: 1.65;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.simone-line { display: block; }

strong, b { font-weight: 600; }
.simone-quiet, .simone-quiet a { font-size: 15px; color: var(--wp--preset--color--subheading); }

a:focus-visible, summary:focus-visible, button:focus-visible {
	outline: 2px solid var(--wp--preset--color--heading);
	outline-offset: 3px;
}

/* ---------- buttons ---------- */

.wp-element-button,
.wp-block-button__link {
	transition: background 0.18s ease, color 0.18s ease;
}
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--heading);
	border: 1px solid var(--wp--preset--color--heading);
	padding: 14px 30px;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--heading);
	color: var(--wp--preset--color--cream);
}
.wp-block-button.simone-btn-small > .wp-block-button__link {
	padding: 9px 22px;
	font-size: 14px;
}

/* ---------- page frame ---------- */

.wp-site-blocks > main,
.wp-site-blocks > footer { margin-block-start: 0; }

.wp-site-blocks > header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0);
	z-index: 50;
}
.simone-header {
	background: var(--wp--preset--color--white);
	border-bottom: 1px solid rgba(51, 51, 51, 0.08);
	padding-top: 18px;
	padding-bottom: 18px;
}
.simone-nav-logo { margin: 0; }
.simone-nav-logo img { height: 16px; width: auto; display: block; }

.simone-nav { gap: 34px; }
.simone-nav .wp-block-navigation-item__content {
	text-decoration: none;
	position: relative;
	padding-bottom: 3px;
}
.simone-nav .wp-block-navigation-link .wp-block-navigation-item__content::after {
	content: '';
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.2s ease;
}
.simone-nav .wp-block-navigation-link .wp-block-navigation-item__content:hover::after { transform: scaleX(1); }
.simone-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

.wp-block-social-links.is-style-logos-only .wp-social-link {
	color: var(--wp--preset--color--heading);
	transition: color 0.18s ease, transform 0.18s ease;
}
.wp-block-social-links.is-style-logos-only .wp-social-link:hover {
	color: var(--wp--preset--color--subheading);
	transform: translateY(-1px);
}
.wp-block-social-links.is-style-logos-only .wp-social-link svg { width: 18px; height: 18px; }

/* The content of the front page and of "full width" pages is a run of
   full-bleed sections; they meet edge to edge. */
.simone-main > .wp-block-post-content > .alignfull { margin-block-start: 0; margin-block-end: 0; }
.simone-main section.alignfull { padding-top: 70px; padding-bottom: 70px; }
.simone-blog, .simone-post, .simone-404 { padding-top: 70px; padding-bottom: 70px; }

.simone-deep { background: var(--wp--preset--color--base-deep); }
.simone-white { background: var(--wp--preset--color--white); }

/* ---------- hero ---------- */

.simone-main section.simone-hero { padding-top: 76px; padding-bottom: 40px; }
.simone-brandmark { margin: 0 auto 72px; }
.simone-brandmark img { max-width: 360px; width: 100%; height: auto; }
.simone-hero-grid { gap: 60px; }
.simone-hero-grid > .wp-block-column:first-child { flex-grow: 1.1; }
.simone-hero-grid > .wp-block-column:last-child { flex-grow: 0.9; }
.simone-hero-title {
	font-size: 44px;
	line-height: 1.18;
	max-width: 11ch;
	font-weight: 400;
}
/* The Pages site's hero line is all lower case; this one heading keeps it. */
.simone-hero-title::first-letter { text-transform: lowercase; }
.simone-lede { font-size: 19px; line-height: 1.6; }
.simone-price-note { font-size: 14px; color: var(--wp--preset--color--subheading); margin: 22px 0 26px; }
.simone-weekstrip {
	background: var(--wp--preset--color--white);
	border-radius: 18px;
	padding: 26px 22px;
	box-shadow: 0 1px 0 rgba(51, 51, 51, 0.06);
	max-width: 380px;
	margin: 0 auto;
}
.simone-calendar-shot { margin: 0; }
.simone-calendar-shot img { width: 100%; height: auto; display: block; border-radius: 10px; }

@media (max-width: 900px) {
	.simone-hero-title { max-width: none; font-size: 36px; }
}

/* ---------- statistics ---------- */

.simone-stats { text-align: center; }
/* The heading runs the full width, as on the Pages site; the copy stays narrow. */
.simone-stats > h2.wp-block-heading { max-width: var(--wp--style--global--wide-size); }
.simone-setup { max-width: 560px; margin-left: auto; margin-right: auto; }
.simone-stats .simone-setup:first-of-type { margin-bottom: 50px; }
.simone-stat-grid { gap: 40px; max-width: 760px; margin-left: auto; margin-right: auto; }
.simone-stat { padding: 0 20px; }
.simone-stat + .simone-stat { border-left: 1px solid var(--simone-rule); }
.simone-stat-num {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--stat);
	color: var(--wp--preset--color--heading);
	line-height: 1;
	margin: 0;
}
.simone-stat-cap { font-size: 15px; margin-top: 14px; line-height: 1.55; }
.simone-source { font-size: 12px; color: var(--simone-ink-quiet); margin: 50px auto 0; max-width: 560px; }
@media (max-width: 781px) {
	.simone-stat + .simone-stat { border-left: none; border-top: 1px solid var(--simone-rule); padding-top: 34px; }
}

/* ---------- the three signals ---------- */

.simone-main section.simone-signals-section { padding-bottom: 24px; }
.simone-prose { max-width: 640px; }
.simone-signals { gap: 30px; margin-top: 44px; }
.simone-signal {
	padding: 30px 26px;
	border-radius: 20px;
	background: var(--wp--preset--color--white);
	display: flex;
	flex-direction: column;
}
.simone-signal h3 {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 400;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	font-size: 19px;
	margin: 0 0 10px;
}
/* The dot sits above its word, never instead of it (ADR-0118). */
.simone-signal h3::before {
	content: '';
	display: block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	margin-bottom: 18px;
}
.simone-signal-green h3::before { background: var(--wp--preset--color--green); }
.simone-signal-yellow h3::before { background: var(--wp--preset--color--yellow); }
.simone-signal-red h3::before { background: var(--wp--preset--color--red); }
.simone-signal p:not(.simone-signal-callout) { font-size: 15px; margin: 0; min-height: 108px; }
.simone-signal-callout {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-weight: 500;
	font-size: 20px;
	line-height: 1.3;
	margin: 0;
	padding-top: 20px;
}
.simone-signal-green .simone-signal-callout { color: var(--wp--preset--color--green); }
.simone-signal-yellow .simone-signal-callout { color: var(--wp--preset--color--yellow); }
.simone-signal-red .simone-signal-callout { color: var(--wp--preset--color--red); }
.simone-note { font-size: 14px; color: var(--wp--preset--color--subheading); margin-top: 28px; }

/* ---------- benefits ---------- */

.simone-main section.simone-benefits-section { padding-top: 24px; }
.simone-benefits-section > h2 { margin-bottom: 40px; }
.simone-two-col { gap: 64px; }
.simone-benefits {
	list-style: none;
	margin: 26px 0 0;
	padding: 0;
	display: grid;
	gap: 14px;
	max-width: 560px;
}
.simone-benefits li { padding-left: 22px; position: relative; font-size: 16px; }
.simone-benefits li::before {
	content: '';
	position: absolute;
	left: 0; top: 11px;
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--wp--preset--color--subheading);
}
.simone-benefits-section .simone-quiet { margin-top: 22px; }
.simone-benefits-section .wp-block-buttons { margin-top: 28px; }

/* The day view and the invite: a drawing, hidden from assistive technology. */
.simone-dayview { position: relative; max-width: 320px; margin: 0 auto; padding-bottom: 64px; }
.simone-dayview-card {
	background: var(--wp--preset--color--white);
	border-radius: 20px;
	padding: 26px 22px;
	box-shadow: 0 20px 40px -26px rgba(51, 51, 51, 0.28);
}
.simone-dayview-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.simone-dayview-date { font-family: var(--wp--preset--font-family--display); font-size: 22px; line-height: 1.15; }
.simone-dayview-dot { width: 22px; height: 22px; border-radius: 50%; background: var(--wp--preset--color--green); flex: none; margin-top: 2px; }
.simone-dayview-divider { height: 1px; background: rgba(51, 51, 51, 0.12); margin: 18px 0; }
.simone-dayview-events { display: flex; flex-direction: column; gap: 12px; }
.simone-dayview-row { display: flex; gap: 10px; align-items: center; }
.simone-dayview-time { width: 40px; flex: none; font-size: 11.5px; color: rgba(51, 51, 51, 0.5); }
.simone-dayview-event {
	flex: 1;
	border-left: 3px solid rgba(51, 51, 51, 0.22);
	border-radius: 9px;
	padding: 11px 13px;
	font-size: 13.5px;
	background: rgba(51, 51, 51, 0.04);
}
.simone-dayview-event.is-green { border-left-color: var(--wp--preset--color--green); background: rgba(86, 158, 86, 0.12); }
.simone-dayview-event.is-red { border-left-color: var(--wp--preset--color--red); background: rgba(193, 39, 45, 0.08); }
.simone-dayview-event.is-free { border: 1px dashed rgba(51, 51, 51, 0.22); background: transparent; color: rgba(51, 51, 51, 0.4); }
.simone-invite {
	background: var(--wp--preset--color--white);
	border-radius: 20px;
	padding: 22px 22px 24px;
	width: 106%;
	margin: -38px 0 0 -8%;
	position: relative;
	z-index: 2;
	box-shadow: 0 -10px 26px -14px rgba(51, 51, 51, 0.35), 0 30px 54px -20px rgba(51, 51, 51, 0.4);
}
@media (max-width: 781px) {
	.simone-invite { width: 100%; margin-left: 0; }
}
.simone-invite-eyebrow { font-size: 12px; letter-spacing: 2px; text-transform: uppercase; font-weight: 500; color: var(--wp--preset--color--subheading); margin-bottom: 10px; }
.simone-invite-title { font-size: 19px; font-weight: 500; margin-bottom: 6px; }
.simone-invite-time { font-size: 13.5px; color: rgba(51, 51, 51, 0.6); margin-bottom: 18px; }
.simone-invite-actions { display: flex; gap: 10px; }
.simone-invite-actions span { padding: 9px 18px; border-radius: 100px; font-size: 13.5px; font-weight: 500; border: 1px solid rgba(51, 51, 51, 0.22); }
.simone-invite-actions .is-yes { background: var(--wp--preset--color--heading); color: var(--wp--preset--color--cream); border-color: var(--wp--preset--color--heading); }

/* ---------- how it works ---------- */

.wp-block-columns.simone-steps { gap: 0; margin-top: 50px; position: relative; }
.simone-steps::before {
	content: '';
	position: absolute;
	top: 19px; left: 5%; right: 5%;
	height: 1px;
	background: repeating-linear-gradient(to right, rgba(51, 51, 51, 0.25) 0 6px, transparent 6px 12px);
}
.simone-step { padding: 0 18px; position: relative; }
.simone-step-num {
	width: 38px; height: 38px;
	border-radius: 50%;
	background: var(--wp--preset--color--heading);
	border: 1px solid var(--wp--preset--color--cream);
	color: var(--wp--preset--color--cream);
	display: flex; align-items: center; justify-content: center;
	font-family: var(--wp--preset--font-family--display);
	font-size: 17px;
	margin: 0 0 20px;
	position: relative;
	z-index: 2;
}
.simone-step h3 { margin: 0 0 8px; }
.simone-step p:not(.simone-step-num) { font-size: 14.5px; margin: 0; }
@media (max-width: 781px) {
	.wp-block-columns.simone-steps { gap: 34px; }
	.simone-steps::before { display: none; }
	.simone-step { padding: 0; }
}

/* ---------- the founder's letter ---------- */

.simone-letter {
	background: var(--wp--preset--color--white);
	border-radius: 20px;
	padding: 56px 52px;
	box-shadow: var(--simone-shadow);
}
.simone-letter p { font-size: 16.5px; }
.simone-letter .simone-eyebrow { font-size: 13px; }
.simone-letter-lead {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	color: var(--wp--preset--color--heading);
	line-height: 1.5;
	margin: 0 0 20px;
}
.simone-letter p.simone-letter-lead { font-size: 22px; }
.simone-letter p.simone-signature {
	margin-top: 30px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 19px;
	color: var(--wp--preset--color--heading);
}
@media (max-width: 600px) {
	.simone-letter { padding: 36px 28px; }
}

/* ---------- the team ---------- */

.simone-main section.simone-team { padding-top: 24px; }
.simone-team > h2 { margin-bottom: 40px; }
.wp-block-columns.simone-team-grid { gap: 40px 28px; }
.simone-team-member { text-align: center; display: flex; flex-direction: column; align-items: center; }
.simone-team-photo { margin: 0 0 18px; }
.simone-team-photo img { width: 150px; height: 150px; border-radius: 50%; object-fit: cover; display: block; }
.simone-team-member h3.simone-team-name {
	font-size: 20px;
	font-weight: 500;
	text-transform: none;
	margin: 0 0 2px;
}
.simone-team-role { font-size: 14px; color: var(--wp--preset--color--subheading); margin: 0 0 12px; }
.simone-team-member .wp-block-social-links { justify-content: center; margin: 0; }
.simone-team-member .wp-social-link svg { width: 20px; height: 20px; }
@media (max-width: 781px) {
	.wp-block-columns.simone-team-grid { flex-wrap: wrap; }
	.wp-block-columns.simone-team-grid:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: calc(50% - 14px) !important; }
	.simone-team-photo img { width: 120px; height: 120px; }
}

/* ---------- mission ---------- */

.simone-main section.simone-mission { padding-top: 24px; }

/* ---------- the call to action band ---------- */

.simone-main section.simone-band,
section.simone-band {
	background: var(--wp--preset--color--heading);
	color: var(--wp--preset--color--cream);
	text-align: center;
	padding-top: 90px;
	padding-bottom: 90px;
}
.simone-band > h2.wp-block-heading { color: var(--wp--preset--color--cream); font-size: 34px; max-width: var(--wp--style--global--wide-size); }
.simone-band p { max-width: 480px; margin: 0 auto 30px; font-size: 16.5px; opacity: 0.92; }
.simone-band .wp-block-button__link {
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--heading);
	border-color: var(--wp--preset--color--cream);
}
.simone-band .wp-block-button__link:hover { background: transparent; color: var(--wp--preset--color--cream); }

/* ---------- questions ---------- */

.simone-faq .wp-block-details { max-width: 720px; border-bottom: 1px solid var(--simone-rule); padding: 22px 0; margin: 0; }
.simone-faq .wp-block-details:first-of-type { border-top: 1px solid var(--simone-rule); margin-top: 1.2rem; }
.simone-faq summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 19px;
	color: var(--wp--preset--color--heading);
}
.simone-faq summary::-webkit-details-marker { display: none; }
.simone-faq summary::after {
	content: '+';
	font-family: var(--wp--preset--font-family--body);
	font-size: 22px;
	font-weight: 300;
	color: var(--wp--preset--color--subheading);
}
.simone-faq details[open] summary::after { content: '–'; }
.simone-faq details p { margin: 14px 0 0; font-size: 15.5px; max-width: 560px; }

/* ---------- contact ---------- */

.simone-main section.simone-contact { padding-top: 24px; }
.simone-contact > h2.simone-caps-heading { font-size: 32px; max-width: var(--wp--style--global--wide-size); }
@media (max-width: 420px) {
	.simone-contact .simone-caps-heading { font-size: 26px; }
}
.simone-contact .simone-quiet { font-size: 14px; margin-top: 18px; }

/* ---------- newsletter signup ---------- */

section.simone-signup { background: var(--wp--preset--color--base-deep); padding-top: 70px; padding-bottom: 70px; }
.simone-signup .ff-el-form-control {
	padding: 13px 16px;
	border-radius: 10px;
	border: 1px solid rgba(51, 51, 51, 0.2);
	font-family: var(--wp--preset--font-family--body);
	font-size: 15px;
	background: var(--wp--preset--color--white);
}
.simone-signup .ff-btn-submit {
	background: var(--wp--preset--color--heading) !important;
	color: var(--wp--preset--color--cream) !important;
	border-radius: 100px;
	padding: 13px 40px;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 500;
}

/* ---------- the blog ---------- */

.simone-post-list .wp-block-post-template { display: grid; gap: 56px; }
.simone-post-list .wp-block-post-title { font-size: var(--wp--preset--font-size--x-large); margin: 18px 0 6px; }
.simone-post-list .wp-block-post-title a { text-decoration: none; }
.simone-post .wp-block-post-featured-image img { border-radius: 20px; }
.simone-post-list .wp-block-post-featured-image img { border-radius: 18px; }

/* ---------- footer ---------- */

.simone-footer { padding-top: 60px; padding-bottom: 40px; }
.simone-footer-top { padding-bottom: 40px; border-bottom: 1px solid rgba(51, 51, 51, 0.12); gap: 24px 30px; }
.simone-footer .simone-legal-links { margin: 0; font-weight: 300; color: var(--wp--preset--color--contrast); }
.simone-footer .wp-social-link svg { width: 20px; height: 20px; }
.simone-footer-bottom { font-size: 13px; color: var(--simone-ink-quiet); margin-top: 24px; }
.simone-footer-bottom p { margin: 0; }
.simone-footer-bottom a { text-decoration: none; }