/*
Theme Name: CWI CounterWise
Theme URI: https://mynewtops.com
Author: CounterWise, Inc.
Description: Custom theme for CounterWise, Inc. (CWI), Rock Springs, Wyoming. Countertops and cabinets.
Version: 1.2.3
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: cwi
*/

/* Shared pieces */
.eyebrow { font-family: var(--wp--preset--font-family--mono); font-size: .78rem !important; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin-bottom: 0; }
.cwi-band .eyebrow, .cwi-hero .eyebrow, .cwi-dark .eyebrow { color: #a9b2b4; }
.cwi-section { padding-top: clamp(48px, 8vw, 88px) !important; padding-bottom: clamp(48px, 8vw, 88px) !important; }
.cwi-alt { background: var(--wp--preset--color--surface); border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); }
.cwi-dark, .cwi-hero, .cwi-band { background: var(--wp--preset--color--band); color: var(--wp--preset--color--band-ink); }
.cwi-hero { padding-top: clamp(40px, 7vw, 80px) !important; padding-bottom: clamp(40px, 7vw, 80px) !important; }
.cwi-band { padding-top: clamp(36px, 6vw, 64px) !important; padding-bottom: clamp(36px, 6vw, 64px) !important; }
.cwi-hero .sub, .cwi-band .sub, .cwi-dark .sub { color: #a9b2b4; }
.sub { font-size: 1.12rem; color: var(--wp--preset--color--muted); }
.cwi-hero h1 strong, .cwi-hero h1 mark { color: var(--wp--preset--color--accent-light); background: none; font-weight: inherit; }
.cwi-phone { font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 1.5rem; letter-spacing: .03em; margin: 0; }
.cwi-phone a { text-decoration: none; }
.cwi-tags p { display: inline-block; font-family: var(--wp--preset--font-family--mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; border: 1px solid #4a5357; color: #a9b2b4; padding: 4px 10px; border-radius: 2px; margin: 0 6px 6px 0 !important; }
.cwi-tags { display: block !important; }

/* Photos: fill their box */
.cwi-photo { margin: 0 !important; }
.cwi-photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 3px; display: block; }
.cwi-photo.is-tall img { aspect-ratio: 4 / 5; }
.cwi-photo.is-wide img { aspect-ratio: 4 / 3; }
.cwi-photo.is-short img { aspect-ratio: 4 / 3; }
.cwi-photo.is-portrait img { aspect-ratio: 3 / 4; }
.cwi-photo figcaption { font-size: .95rem; color: var(--wp--preset--color--muted); text-align: left; margin-top: 10px; }
.cwi-photo figcaption strong { display: block; font-family: var(--wp--preset--font-family--mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--ink); font-weight: 500; }
.cwi-diagram img { width: 100%; height: auto; }

/* Cards */
.cwi-card { background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--line); border-radius: 4px; padding: 24px !important; height: 100%; }
.cwi-alt .cwi-card { background: var(--wp--preset--color--bg); }
.cwi-card .more { margin-top: auto; font-weight: 700; }
.cwi-card .more a { text-decoration: none; }
.cwi-card .more a::after { content: " \2192"; color: var(--wp--preset--color--accent); }
.cwi-card h3 { margin-top: 8px; }

/* Countertops-only callout */
.cwi-callout { border: 2px solid var(--wp--preset--color--accent); border-radius: 4px; padding: 24px !important; background: var(--wp--preset--color--accent-soft); }

/* Steps */
.cwi-steps .wp-block-column { border-top: 3px solid var(--wp--preset--color--accent); padding-top: 18px; }
.cwi-steps .step-num { font-family: var(--wp--preset--font-family--mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--accent-light); margin: 0; }

/* Spec lists */
.cwi-spec { list-style: none; padding: 0 !important; border-top: 1px solid var(--wp--preset--color--line); }
.cwi-spec li { padding: 12px 0; border-bottom: 1px solid var(--wp--preset--color--line); }
.cwi-spec li strong { display: inline-block; min-width: 150px; font-family: var(--wp--preset--font-family--mono); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--wp--preset--color--muted); font-weight: 500; }

/* Quote band */
.cwi-quote-band { background: var(--wp--preset--color--accent); color: #fff; padding-top: 44px !important; padding-bottom: 44px !important; }
.cwi-quote-band .wp-block-button__link { background: #fff !important; color: var(--wp--preset--color--accent) !important; }
.cwi-quote-band .cwi-phone a { color: #fff; }

/* Outline button */
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: inherit; border: 2px solid currentColor; }

/* Header */
.cwi-header { background: var(--wp--preset--color--band); color: var(--wp--preset--color--band-ink); position: sticky; top: 0; z-index: 50; }
.admin-bar .cwi-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .cwi-header { top: 46px; } }
.cwi-header .cwi-logo img { width: 132px; height: auto; }
.cwi-header .wp-block-navigation a { color: #a9b2b4; font-weight: 600; font-size: .95rem; text-decoration: none; }
.cwi-header .wp-block-navigation a:hover, .cwi-header .wp-block-navigation .current-menu-item a { color: var(--wp--preset--color--band-ink); }
.cwi-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--band) !important; color: var(--wp--preset--color--band-ink) !important; }
.cwi-header .wp-block-button__link { font-size: 1.05rem; padding: 7px 14px; }

/* Footer */
.cwi-footer { background: var(--wp--preset--color--band); color: #a9b2b4; font-size: .92rem; padding-top: 40px !important; padding-bottom: 32px !important; }
.cwi-footer h4 { font-family: var(--wp--preset--font-family--mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--band-ink); margin: 0 0 8px; }
.cwi-footer a { text-decoration: none; }
.cwi-footer .cwi-logo img { width: 132px; height: auto; }
.cwi-footer .legal { border-top: 1px solid #3a4246; padding-top: 16px; font-size: .82rem; }

/* Quote form */
.cwi-form { display: grid; gap: 16px; }
.cwi-form label { font-weight: 600; font-size: .95rem; display: flex; flex-direction: column; gap: 6px; }
.cwi-form input, .cwi-form textarea, .cwi-form select { font: inherit; padding: 12px; border: 1.5px solid var(--wp--preset--color--line); border-radius: 4px; background: #fff; color: var(--wp--preset--color--ink); width: 100%; box-sizing: border-box; }
.cwi-form textarea { min-height: 130px; }
.cwi-form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 520px) { .cwi-form .row2 { grid-template-columns: 1fr; } }
.cwi-form .hp { position: absolute; left: -9999px; }
.cwi-form button { font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 1.2rem; text-transform: uppercase; letter-spacing: .04em; background: var(--wp--preset--color--accent); color: #fff; border: 0; border-radius: 4px; padding: 12px 22px; cursor: pointer; justify-self: start; }
.cwi-notice { padding: 14px; border-radius: 4px; border: 1px solid var(--wp--preset--color--accent); background: var(--wp--preset--color--accent-soft); }
.cwi-notice.is-error { border-color: #b3261e; background: #fbe9e7; }

/* Info list on quote page */
.cwi-info p { margin: 0; }
.cwi-info .eyebrow { margin-top: 14px; }

:focus-visible { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 2px; }

/* Now hiring strip on Home */
.cwi-hiring { background: var(--wp--preset--color--accent); color: #fff; padding-top: 14px !important; padding-bottom: 14px !important; margin-top: 0 !important; }
.cwi-hiring .cwi-split { justify-content: space-between; gap: 8px 20px; }
.cwi-hiring p { margin: 0; }
.cwi-hiring a { color: #fff; font-weight: 700; white-space: nowrap; }
.cwi-hiring .more a::after { content: " \2192"; }

/* Sox animations (1.2.0) */
.cwi-brand { gap: 16px; align-items: center !important; }
.cwi-sox { display: flex; align-items: center; align-self: center; text-decoration: none; line-height: 0; }
.cwi-sox img { width: 52px; height: 52px; display: block; }
@media (max-width: 480px) { .cwi-sox img { width: 42px; height: 42px; } .cwi-brand { gap: 10px; } }
.cwi-anim { display: block; }
.cwi-anim img { display: block; width: 100%; height: auto; border-radius: 10px; }
.cwi-callout .cwi-anim-unload { max-width: 640px; margin: 18px 0 0; }
.cwi-anim-van { max-width: 460px; margin: 0 auto; }
.cwi-anim-say { text-align: center; font-weight: 800; font-style: italic; font-size: 1.4rem; margin-top: 8px !important; }
.cwi-anim-pullup { max-width: 140px; margin: 0 auto 12px; }