/*
Theme Name: Regard
Theme URI: https://helloregard.com
Author: Regard
Description: Marketing site and blog for Regard — digital business cards and profiles. Block theme: edit pages, header and footer in Appearance → Editor. Brand tokens live in theme.json.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.0.0
License: Proprietary
Text Domain: regard
*/

/* Small layer on top of theme.json — only what blocks can't express. */

html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* Header: sticky, translucent */
.regard-header {
	position: sticky; top: 0; z-index: 50;
	background: color-mix(in srgb, var(--wp--preset--color--paper) 82%, transparent);
	backdrop-filter: saturate(1.4) blur(14px);
	-webkit-backdrop-filter: saturate(1.4) blur(14px);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--line) 70%, transparent);
}
body.admin-bar .regard-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .regard-header { top: 46px; } }
.regard-wordmark a { text-decoration: none; color: inherit; }

/* Eyebrow label above headings */
.regard-eyebrow {
	text-transform: uppercase; letter-spacing: .12em; font-weight: 600;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--accent);
}

/* Headline accent word */
.regard-hero h1 em, .regard-section h2 em { font-style: italic; color: var(--wp--preset--color--accent); }

/* Hero visual */
.regard-hero-visual img { filter: drop-shadow(0 30px 60px rgb(18 20 23 / .16)); }

/* Cards / tiles */
.regard-tile {
	border: 1px solid var(--wp--preset--color--line);
	transition: transform .2s ease, box-shadow .2s ease;
}
.regard-tile:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgb(18 20 23 / .07); }

.regard-icon {
	display: inline-grid; place-items: center;
	width: 44px; height: 44px; border-radius: 999px;
	background: var(--wp--preset--color--accent-soft); color: var(--wp--preset--color--accent);
	margin-bottom: var(--wp--preset--spacing--20);
}
.regard-icon svg { width: 22px; height: 22px; }

/* Numbered steps */
.regard-step-num {
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--xx-large); line-height: 1;
	color: var(--wp--preset--color--accent);
}

/* Privacy levels */
.regard-level { border-left: 3px solid var(--wp--preset--color--line); }
.regard-level.is-everyone { border-left-color: #1F9D6B; }
.regard-level.is-connections { border-left-color: var(--wp--preset--color--accent); }
.regard-level.is-private { border-left-color: var(--wp--preset--color--muted); }

/* Store buttons on dark band */
.regard-cta-band .wp-block-button.is-style-outline .wp-block-button__link { border-color: rgb(255 255 255 / .4); color: #fff; }
.regard-cta-band .wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: #fff; background: rgb(255 255 255 / .06); }

/* Buttons */
.wp-block-button__link { transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease; }
.wp-block-button__link:hover { transform: translateY(-1px); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--surface); }

/* Blog cards */
.regard-post-card .wp-block-post-featured-image img { border-radius: 14px; aspect-ratio: 16/10; object-fit: cover; }
.regard-post-card .wp-block-post-title a { text-decoration: none; }
.regard-post-card .wp-block-post-title a:hover { color: var(--wp--preset--color--accent); }

/* Long-form reading */
.regard-prose > * + * { margin-top: 1.1em; }
.regard-prose blockquote { border-left: 3px solid var(--wp--preset--color--accent); padding-left: 1.2em; font-style: italic; }

/* Mobile */
@media (max-width: 781px) {
	.regard-hero .wp-block-columns { gap: var(--wp--preset--spacing--50); }
	.regard-hero-visual { max-width: 420px; margin-inline: auto; }
}

/* Footer links: quiet until hovered */
.regard-footer a { color: inherit; text-decoration: none; }
.regard-footer a:hover { color: var(--wp--preset--color--accent); }
