/*
Theme Name:   NatProInsurance
Description:  A child theme of Twenty Twenty-Five with self-hosted Garet typography and a warm terracotta brand palette.
Author:       TechWebUX for 2ndCousin Inc.
Author URI:   https://techwebux.com
Template:     twentytwentyfive
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  twentytwentyfive-child
Tags:         block-themes, custom-colors, custom-typography
*/

@font-face {
	font-family: 'Garet';
	src: url('assets/fonts/garet/garet-book.woff2') format('woff2'),
	     url('assets/fonts/garet/garet-book.woff')  format('woff');
	font-weight: 300;
	font-style:  normal;
	font-display: swap;
}

@font-face {
	font-family: 'Garet';
	src: url('assets/fonts/garet/garet-regular.woff2') format('woff2'),
	     url('assets/fonts/garet/garet-regular.woff')  format('woff');
	font-weight: 400;
	font-style:  normal;
	font-display: swap;
}

/* =========================================================
   CSS CUSTOM PROPERTIES — Brand Tokens
   ========================================================= */
:root {
	/* Palette */
	--color-base:         #FDF3EB;
	--color-accent3:      #723A3A;
	--color-accent3-dark: #5a2e2e;
	--color-text:         #000000;

	/* Typography */
	--font-family-garet:    'Garet', sans-serif;
	--font-weight-light:    300;
	--font-weight-regular:  400;
	--font-weight-bold:     400;

	/* Size scale */
	--font-size-base: 1rem;
	--font-size-h1:   2.5rem;
	--font-size-h2:   2rem;
	--font-size-h3:   1.75rem;
	--font-size-h4:   1.5rem;
	--font-size-h5:   1.25rem;
	--font-size-h6:   1rem;

	/* Line heights */
	--lh-body: 1.5;
	--lh-h1:   1.3;
	--lh-h2:   1.3;
	--lh-h3:   1.5;
	--lh-h4:   1.4;
	--lh-h5:   1.5;
	--lh-h6:   1.5;

	/* Map onto TT5's CSS custom properties so parent templates inherit brand */
	--wp--preset--color--base:     #FDF3EB;
	--wp--preset--color--contrast: #000000;
}

/* =========================================================
   GLOBAL BASE
   ========================================================= */
body {
	font-family:      var(--font-family-garet);
	font-size:        var(--font-size-base);
	font-weight:      var(--font-weight-light);
	line-height:      var(--lh-body);
	letter-spacing:   0;
	color:            var(--color-text);
	background-color: var(--color-base);
}

/* =========================================================
   HEADINGS
   ========================================================= */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family:    var(--font-family-garet);
	font-weight:    var(--font-weight-regular);
	letter-spacing: 0;
	color:          var(--color-accent3);
}

h1 { font-size: var(--font-size-h1); line-height: var(--lh-h1); }
h2 { font-size: var(--font-size-h2); line-height: var(--lh-h2); }
h3 { font-size: var(--font-size-h3); line-height: var(--lh-h3); }
h4 { font-size: var(--font-size-h4); line-height: var(--lh-h4); }
h5 { font-size: var(--font-size-h5); line-height: var(--lh-h5); }
h6 { font-size: var(--font-size-h6); line-height: var(--lh-h6); }

/* =========================================================
   BUTTONS
   ========================================================= */
.wp-block-button__link,
.wp-element-button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	font-family:      var(--font-family-garet);
	font-size:        var(--font-size-base);
	font-weight:      var(--font-weight-regular);
	line-height:      var(--lh-body);
	letter-spacing:   0;
	background-color: var(--color-accent3);
	color:            var(--color-base);
	border:           none;
	cursor:           pointer;
	transition:       background-color 0.2s ease, color 0.2s ease;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
	background-color: var(--color-accent3-dark);
	color:            var(--color-base);
}

/* =========================================================
   LINKS
   ========================================================= */
a {
	color:           var(--color-accent3);
}

a:hover,
a:focus {
	color: var(--color-accent3-dark);
}

/* =========================================================
   BLOCK EDITOR — force Garet on common blocks that
   TwentyTwentyFive may declare with its own font stack
   ========================================================= */
.wp-block-site-title,
.wp-block-site-title a,
.wp-block-navigation,
.wp-block-navigation a,
.wp-block-post-title,
.wp-block-query-title,
.wp-block-widget-title,
.wp-block-pullquote,
.wp-block-pullquote p,
.wp-block-quote,
.wp-block-quote p,
.wp-block-paragraph {
	font-family: var(--font-family-garet);
}