/*
Theme Name: Nicole Nagl
Theme URI: https://nicole-nagl.de
Author: Nicole Nagl
Description: Modernes WordPress-Theme – Yoga, Laufen & Coaching.
Version: 2.3.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nicole-nagl
*/

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
    --font-body:    'Manrope', ui-sans-serif, system-ui, sans-serif;
    --font-heading: 'Cormorant Garamond', ui-serif, Georgia, serif;

    --color-bg:          #f4d8c4;
    --color-surface:     #f5f5f4;
    --color-surface-alt: #eedcce;
    --color-footer-bg:   #f5f5f4;

    --color-border:      rgba(92, 60, 36, 0.15);
    --color-border-dark: #1c1917;

    --color-text:        #2c1a0e;
    --color-text-muted:  #57534e;
    --color-text-faint:  #78716c;

    --color-accent:      #4d7c0f;
    --color-accent-dark: #365314;

    --max-width:  1320px;
    --gap-x:      1.75rem;
    --gap-x-lg:   3rem;
    --transition: 160ms ease-in-out;

    --text-xs:   0.9375rem;
    --text-sm:   1.0625rem;
    --text-base: 1.1875rem;
    --text-md:   1.3125rem;
    --text-lg:   1.5rem;
    --text-xl:   1.75rem;
    --text-2xl:  2.125rem;
    --text-3xl:  2.75rem;
    --text-4xl:  3.5rem;
    --text-5xl:  4.375rem;
    --text-6xl:  5.375rem;
}

/* ============================================================
   RESET  (box-sizing only — Tailwind preflight handles the rest)
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

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

body {
    font-family:      var(--font-body);
    font-size:        var(--text-base);
    line-height:      1.8;
    color:            var(--color-text);
    background-color: var(--color-bg);
}

img, video { max-width: 100%; height: auto; display: block; }
a          { color: inherit; text-decoration: none; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6, .font-heading {
    font-family:   var(--font-heading);
    font-weight:   600;
    line-height:   1.15;
    color:         var(--color-text);
    margin-bottom: 0.45em;
}

h1 { font-size: clamp(var(--text-3xl), 5.5vw + 0.5rem, var(--text-6xl)); }
h2 { font-size: clamp(var(--text-2xl), 4vw   + 0.5rem, var(--text-5xl)); }
h3 { font-size: clamp(var(--text-xl),  2.5vw + 0.5rem, var(--text-4xl)); }
h4 { font-size: clamp(var(--text-lg),  2vw   + 0.25rem,var(--text-3xl)); }
h5 { font-size: var(--text-lg); }
h6 { font-size: var(--text-md); }

p {
    font-size:     var(--text-base);
    line-height:   1.9;
    margin-bottom: 1.35rem;
}

/* ============================================================
   LAYOUT SHELL
   ============================================================ */
.site-container {
    min-height:     100vh;
    display:        flex;
    flex-direction: column;
    background:     var(--color-bg);
}

/* Generic container for inner page content */
.container {
    max-width: var(--max-width);
    margin:    0 auto;
    padding:   0 var(--gap-x);
    width:     100%;
}

@media (min-width: 1024px) {
    .container { padding: 0 var(--gap-x-lg); }
}

.page-wrap {
    padding:   5rem 0;
    flex-grow: 1;
}

@media (min-width: 1024px) {
    .page-wrap { padding: 7rem 0; }
}

/* ============================================================
   HEADER  — pure CSS, zero Tailwind dependency
   ============================================================ */
.site-header {
    position:            sticky;
    top:                 0;
    z-index:             200;
    background-color:    rgba(250, 250, 249, 0.96); /* stone-50/96 */
    border-bottom:       1px solid rgba(28, 25, 23, 0.1);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter:         blur(10px);
}

/* Inner row — boxed + flex */
.site-header-inner {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    gap:             1.5rem;
    /*max-width:       var(--max-width);*/
    margin:          0 auto;
    padding:         1.25rem var(--gap-x);
    width:           100%;
}

@media (min-width: 1024px) {
    .site-header-inner { padding: 1.25rem var(--gap-x-lg); }
}

/* Branding */
.site-branding a {
    display:     inline-flex;
    align-items: center;
    color:       var(--color-border-dark);
    white-space: nowrap;
    gap:         0;
}

.brand-name {
    font-family:    var(--font-heading);
    font-size:      clamp(1.375rem, 2.2vw, 1.875rem);
    font-weight:    600;
    letter-spacing: -0.01em;
    line-height:    1;
    color:          var(--color-border-dark);
}

.brand-divider {
    color:       #a8a29e;
    margin:      0 0.5rem;
    font-weight: 300;
    font-size:   1.25rem;
}

.brand-tagline {
    font-size:   clamp(0.875rem, 1.3vw, 1.0625rem);
    font-weight: 400;
    color:       var(--color-text-muted);
}

.custom-logo      { max-height: 3rem; width: auto; }
.custom-logo-link { display: inline-flex; align-items: center; }

/* ── Desktop nav: hidden on mobile, flex on ≥1024px ── */
.main-navigation {
    display:     none;
    align-items: center;
    gap:         2rem;
}

@media (min-width: 1024px) {
    .main-navigation { display: flex; }
}

/* Nav <ul> */
.main-navigation .nav-menu,
.main-navigation ul {
    display:     flex;
    align-items: center;
    gap:         2rem;
    list-style:  none;
    margin:      0;
    padding:     0;
}

.main-navigation li { position: relative; margin: 0; padding: 0; }

.main-navigation li a {
    font-size:      var(--text-sm);
    font-weight:    500;
    color:          var(--color-text-muted);
    letter-spacing: 0.02em;
    white-space:    nowrap;
    padding-bottom: 2px;
    border-bottom:  2px solid transparent;
    transition:     color var(--transition), border-color var(--transition);
}

.main-navigation li a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
    color:        var(--color-border-dark);
    border-color: var(--color-accent);
}

/* Header Kontakt button — shared by desktop + mobile */
.header-btn {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    border:          1px solid var(--color-border-dark);
    background:   var(--color-accent);
    border-color: var(--color-accent);
    color:        #fff;
    font-family:     var(--font-body);
    font-size:       var(--text-xs);
    font-weight:     500;
    letter-spacing:  0.06em;
    text-transform:  uppercase;
    padding:         0.6rem 1.25rem;
    white-space:     nowrap;
    transition:      background var(--transition),
                     border-color var(--transition),
                     color var(--transition);
}

.header-btn:hover {
    background:   var(--color-accent);
    border-color: var(--color-accent);
    color:        #fff;
}

/* ── Mobile controls: visible on mobile, hidden ≥1024px ── */
.mobile-controls {
    display:     flex;
    align-items: center;
    gap:         0.625rem;
}

@media (min-width: 1024px) {
    .mobile-controls { display: none; }
}

/* Hamburger button */
.mobile-menu-toggle {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           2.75rem;
    height:          2.75rem;
    border:          1px solid var(--color-border-dark);
    background:      transparent;
    color:           var(--color-border-dark);
    cursor:          pointer;
    padding:         0;
    flex-shrink:     0;
    transition:      background var(--transition),
                     border-color var(--transition),
                     color var(--transition);
}

.mobile-menu-toggle:hover {
    background:   var(--color-accent);
    border-color: var(--color-accent);
    color:        #fff;
}

/* Hamburger icon lines */
.hamburger-icon {
    display:         flex;
    flex-direction:  column;
    justify-content: center;
    align-items:     center;
    gap:             5px;
    width:           20px;
    height:          20px;
    pointer-events:  none;
}

.hamburger-icon span {
    display:          block;
    width:            100%;
    height:           1.75px;
    background:       currentColor;
    transition:       transform 250ms ease, opacity 250ms ease;
    transform-origin: center;
}

.mobile-menu-toggle[aria-expanded="true"] .hamburger-icon span:nth-child(1) {
    transform: translateY(6.75px) rotate(45deg);
}
.mobile-menu-toggle[aria-expanded="true"] .hamburger-icon span:nth-child(2) {
    opacity: 0; transform: scaleX(0);
}
.mobile-menu-toggle[aria-expanded="true"] .hamburger-icon span:nth-child(3) {
    transform: translateY(-6.75px) rotate(-45deg);
}

/* ── Mobile dropdown panel ── */
.mobile-menu {
    display:    none;         /* hidden by default */
    background: #fafaf9;
    border-top: 1px solid rgba(28, 25, 23, 0.1);
    padding:    1.25rem var(--gap-x);
}

.mobile-menu.is-open { display: block; }  /* toggled by navigation.js */

.mobile-nav-menu,
.mobile-menu ul {
    list-style: none;
    margin:     0;
    padding:    0;
}

.mobile-menu li { margin: 0; padding: 0; }

.mobile-menu li a {
    display:       block;
    padding:       0.75rem 0;
    font-size:     var(--text-md);
    font-weight:   500;
    color:         var(--color-border-dark);
    border-bottom: 1px solid rgba(28, 25, 23, 0.08);
    transition:    color var(--transition);
}

.mobile-menu li a:hover     { color: var(--color-accent); }
.mobile-menu li:last-child a { border-bottom: none; }

/* ============================================================
   CONTENT BACKGROUNDS  — warm peach everywhere
   ============================================================ */
main,
.site-main,
.page-content,
.post-content,
.entry-content-wrap,
.wp-block-group,
.wp-block-cover,
.wp-block-post-content {
    background-color: var(--color-bg);
}

/* ============================================================
   BUTTONS  — one rule to rule them all
   ============================================================ */
.wp-block-button__link,
.wp-block-button .wp-block-button__link,
.comment-reply-link,
.search-form .search-submit,
.post-password-form input[type="submit"] {
    display:         inline-flex !important;
    align-items:     center !important;
    justify-content: center !important;
    border:          1px solid #1c1917 !important;
    border-radius:   0 !important;
    background:      transparent !important;
    color:           #1c1917 !important;
    font-family:     var(--font-body) !important;
    font-size:       var(--text-sm) !important;
    font-weight:     500 !important;
    letter-spacing:  0.06em !important;
    text-transform:  uppercase !important;
    padding:         0.8rem 1.875rem !important;
    cursor:          pointer;
    text-decoration: none !important;
    transition:      background var(--transition),
                     border-color var(--transition),
                     color var(--transition) !important;
    -webkit-appearance: none;
}

.wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:hover,
.comment-reply-link:hover,
.search-form .search-submit:hover,
.post-password-form input[type="submit"]:hover {
    border-color:     var(--color-accent) !important;
    background-color: var(--color-accent) !important;
    color:            #ffffff !important;
}

.wp-block-button.is-style-outline .wp-block-button__link {
    border-color: #1c1917 !important;
    background:   transparent !important;
    color:        #1c1917 !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
    border-color:     var(--color-accent) !important;
    background-color: transparent !important;
    color:            var(--color-accent) !important;
}

/* Native button/input reset — minimal so WP admin stays intact */
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
    border-radius: 0;
    cursor:        pointer;
    font-family:   var(--font-body);
    transition:    background var(--transition),
                   border-color var(--transition),
                   color var(--transition);
}

/* ============================================================
   FORM INPUTS
   ============================================================ */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
textarea,
select {
    width:              100%;
    border:             1px solid var(--color-border);
    border-radius:      0;
    background:         rgba(255,255,255,0.35);
    color:              var(--color-text);
    font-family:        var(--font-body);
    font-size:          var(--text-base);
    padding:            0.875rem 1.125rem;
    line-height:        1.65;
    transition:         border-color var(--transition), box-shadow var(--transition);
    -webkit-appearance: none;
}

input:focus,
textarea:focus,
select:focus {
    outline:      none;
    border-color: var(--color-accent);
    box-shadow:   0 0 0 1px var(--color-accent);
    background:   rgba(255,255,255,0.5);
}

label {
    display:       block;
    font-size:     var(--text-sm);
    font-weight:   500;
    color:         var(--color-text-muted);
    margin-bottom: 0.4rem;
}

/* ============================================================
   ENTRY CONTENT
   ============================================================ */
.entry-content {
    font-size:   var(--text-base);
    line-height: 1.9;
    color:       var(--color-text);
}

/*.entry-content > * + * { margin-top: 1.75rem; }*/
.entry-content>*+* {
    margin-top: 0rem; 
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 { margin-top: 3rem; margin-bottom: 0.75rem; }

.entry-content h1 {
    font-size: 2.7rem!important;
}

.entry-content h2 { 
	font-size: 2.3rem!important;
}

.entry-content h3 {
    font-size: 1.9rem!important;
}

.entry-content p  { font-size: var(--text-base); line-height: 1.9; }
.entry-content ul { list-style: disc;    padding-left: 1.875rem; margin-bottom: 1.5rem; }
.entry-content ol { list-style: decimal; padding-left: 1.875rem; margin-bottom: 1.5rem; }
.entry-content li { margin-bottom: 0.5rem; font-size: var(--text-base); }

.entry-content a {
    color:                 #000;
    text-underline-offset: 3px;
    transition:            color var(--transition);
    text-decoration: none;
}

.entry-content a:hover {
    color: #fff;
}

.entry-content blockquote {
    border-left:  3px solid var(--color-text-faint);
    padding-left: 1.75rem;
    font-style:   italic;
    color:        var(--color-text-muted);
    margin:       2.5rem 0;
    font-size:    var(--text-md);
}

.entry-content hr { border: none; border-top: 1px solid var(--color-border); margin: 3rem 0; }

/* ============================================================
   FRONT-PAGE ALIGNMENT
   ============================================================ */

.front-page-content .entry-content img,
.front-page-content .entry-content figure {
    margin-left:  auto;
    margin-right: auto;
    text-align:   left;
}

.front-page-content .entry-content > p,
.front-page-content .entry-content > h1,
.front-page-content .entry-content > h2,
.front-page-content .entry-content > h3 {
    max-width:    44rem;
    margin-left:  auto;
    margin-right: auto;
}

.front-page-content .wp-block-buttons {
    justify-content: center !important;
    gap:             0.875rem !important;
}

.front-page-content .wp-block-columns { text-align: left; }

/* ============================================================
   GUTENBERG BLOCKS
   ============================================================ */
.wp-block-columns { gap: 2.5rem; }

/* White border frame on images */
.entry-content .wp-block-image img,
.entry-content figure img,
.wp-block-image img {
    border:     8px solid #ffffff;
    box-shadow: 0 4px 20px rgba(0,0,0,0.09);
}

.wp-block-image figcaption,
.wp-caption-text {
    font-size:   var(--text-xs);
    color:       var(--color-text-faint);
    text-align:  center;
    padding-top: 0.5rem;
}

.wp-block-separator { border: none; border-top: 1px solid var(--color-border); margin: 2.5rem auto; }

.wp-block-quote { border-left: 3px solid var(--color-border-dark); padding: 1.25rem 1.75rem; margin: 2.5rem 0; }
.wp-block-quote p    { font-style: italic; font-size: var(--text-md); margin: 0; }
.wp-block-quote cite { font-size: var(--text-sm); color: var(--color-text-muted); margin-top: 0.75rem; display: block; }

.wp-block-pullquote {
    border-top:    2px solid var(--color-border-dark);
    border-bottom: 2px solid var(--color-border-dark);
    padding:       2.5rem;
    text-align:    center;
}

.wp-block-table table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.wp-block-table td,
.wp-block-table th    { border: 1px solid var(--color-border); padding: 0.75rem 1rem; }
.wp-block-table th    { background: var(--color-surface); font-weight: 600; }

.wp-block-gallery,
.gallery {
    display:               grid;
    gap:                   0.625rem;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.gallery-item img { width: 100%; height: auto; }

.wp-block-media-text { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: center; }
@media (max-width: 768px) { .wp-block-media-text { grid-template-columns: 1fr; } }

/* Alignments */
.alignnone   { margin: 1.75rem 0; }
.aligncenter { display: block; margin: 1.75rem auto; }
.alignleft   { float: left;  margin: 0.5rem 2rem 1.75rem 0; }
.alignright  { float: right; margin: 0.5rem 0 1.75rem 2rem; }
.alignwide   { max-width: calc(var(--max-width) * 0.9); margin-left: auto; margin-right: auto; }
.alignfull   { max-width: 100%; width: 100%; }

/* ============================================================
   ENTRY HEADER
   ============================================================ */
.entry-header { margin-bottom: 3rem; }

.entry-title {
    font-family: var(--font-heading);
    font-size:   clamp(var(--text-2xl), 4vw, var(--text-4xl));
    font-weight: 600;
    line-height: 1.15;
    color:       var(--color-text);
    margin:      0 0 1.25rem;
}

.entry-meta {
    font-size:      var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    color:          var(--color-text-faint);
}

.entry-divider {
    width:      8rem;
    height:     1px;
    background: rgba(44, 26, 14, 0.3);
    margin:     1.5rem 0 0;
}

/* ============================================================
   POST THUMBNAIL
   ============================================================ */
.post-thumbnail { margin-bottom: 3rem; overflow: hidden; border: 1px solid var(--color-border); background: var(--color-surface); padding: 0.75rem; }
.post-thumbnail img       { width: 100%; height: auto; object-fit: cover; transition: transform 500ms ease; }
.post-thumbnail:hover img { transform: scale(1.02); }

/* ============================================================
   ARCHIVE / SEARCH
   ============================================================ */
.archive-header, .search-header { margin-bottom: 4rem; }
.archive-label, .search-label  { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.22em; color: var(--color-text-faint); margin-bottom: 0.875rem; display: block; }
.archive-title, .search-title  { font-family: var(--font-heading); font-size: clamp(var(--text-2xl), 4vw, var(--text-4xl)); font-weight: 600; color: var(--color-text); }

/* ============================================================
   PAGINATION
   ============================================================ */
.pagination-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.5rem; margin-top: 4rem; }
.page-numbers   { display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; height: 2.75rem; padding: 0 0.625rem; border: 1px solid var(--color-border); font-size: var(--text-sm); color: var(--color-text-muted); transition: all var(--transition); text-decoration: none; }
.page-numbers:hover   { border-color: var(--color-border-dark); color: var(--color-border-dark); }
.page-numbers.current { border-color: var(--color-border-dark); background: var(--color-border-dark); color: #fff; }

/* ============================================================
   POST NAVIGATION
   ============================================================ */
.post-navigation { display: grid; gap: 1rem; margin-top: 3rem; padding-top: 2.5rem; border-top: 1px solid var(--color-border); }
@media (min-width: 640px) { .post-navigation { grid-template-columns: 1fr 1fr; } }
.post-navigation a { display: block; padding: 1.25rem; border: 1px solid var(--color-border); transition: border-color var(--transition); }
.post-navigation a:hover { border-color: rgba(44,26,14,0.3); }
.post-navigation .nav-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.15em; color: var(--color-text-faint); }
.post-navigation .nav-title { font-size: var(--text-sm); font-weight: 500; color: var(--color-text); margin-top: 0.3rem; transition: color var(--transition); }
.post-navigation a:hover .nav-title { color: var(--color-accent); }

/* ============================================================
   SIDEBAR & WIDGETS
   ============================================================ */
.widget { border: 1px solid var(--color-border); background: var(--color-surface-alt); padding: 1.75rem; margin-bottom: 2.25rem; }
.widget-title { font-family: var(--font-heading); font-size: var(--text-xl); font-weight: 600; color: var(--color-text); margin-bottom: 1.25rem; }
.widget ul    { list-style: none; }
.widget ul li { padding: 0.45rem 0; border-bottom: 1px solid var(--color-border); font-size: var(--text-sm); }
.widget ul li:last-child { border-bottom: none; }
.widget ul li a       { color: var(--color-text-muted); transition: color var(--transition); }
.widget ul li a:hover { color: var(--color-accent); }

/* ============================================================
   SEARCH FORM
   ============================================================ */
.search-form { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.search-form label        { width: 100%; margin: 0; }
.search-form .search-field { flex: 1 1 200px; margin: 0; }

/* ============================================================
   COMMENTS
   ============================================================ */
.comments-area { margin-top: 4rem; padding-top: 3rem; border-top: 1px solid var(--color-border); }
.comments-title { font-family: var(--font-heading); font-size: var(--text-2xl); font-weight: 600; color: var(--color-text); }
.comment-list { list-style: none; margin: 2.5rem 0 0; }
.comment-list li { margin-bottom: 2rem; }
.comment-body { display: flex; gap: 1.25rem; }
.comment-author img { width: 3.25rem; height: 3.25rem; border-radius: 50%; flex-shrink: 0; }
.comment-author .fn { font-weight: 600; color: var(--color-text); font-size: var(--text-sm); }
.comment-metadata, .comment-metadata a { font-size: var(--text-xs); color: var(--color-text-faint); }
.comment-content p { font-size: var(--text-sm); }
.reply { margin-top: 0.875rem; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
    background: var(--color-footer-bg);
    border-top: 1px solid var(--color-border);
    padding:    2.75rem 0;
    margin-top: auto;
}

.footer-inner {
    display:         flex;
    flex-wrap:       wrap;
    align-items:     center;
    justify-content: space-between;
    gap:             1.75rem;
    max-width:       var(--max-width);
    margin:          0 auto;
    padding:         0 var(--gap-x);
    width:           100%;
}

@media (min-width: 1024px) {
    .footer-inner { padding: 0 var(--gap-x-lg); }
}

.footer-navigation { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.footer-navigation a { font-size: var(--text-sm); color: var(--color-text-muted); transition: color var(--transition); }
.footer-navigation a:hover { color: var(--color-accent); }
.copyright { font-size: var(--text-xs); color: var(--color-text-faint); }

/* ============================================================
   404
   ============================================================ */
.error-title { font-family: var(--font-heading); font-size: clamp(var(--text-3xl), 7vw, var(--text-6xl)); font-weight: 600; line-height: 1.1; color: var(--color-text); }

/* ============================================================
   MISC
   ============================================================ */
.sticky-badge { display: inline-flex; align-items: center; border: 1px solid var(--color-accent); padding: 0.15rem 0.6rem; font-size: var(--text-xs); font-weight: 500; color: var(--color-accent); }
.wp-caption { max-width: 100%; margin-bottom: 1.5rem; }
.wp-caption img { display: block; max-width: 100%; height: auto; }

/* ============================================================
   ACCESSIBILITY
   ============================================================ */
.sr-only, .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.screen-reader-text:focus { clip: auto; clip-path: none; background: var(--color-bg); color: var(--color-text); display: block; font-size: var(--text-sm); font-weight: 600; height: auto; left: 5px; padding: 1rem 1.5rem; top: 5px; width: auto; z-index: 100000; }

/* ============================================================
   PRINT
   ============================================================ */
@media print {
    .site-header, .site-footer, .mobile-controls { display: none; }
    body { background: #fff; color: #000; }
    a    { text-decoration: underline; }
}

.contact-form-textbox{
min-height: 33vh;
max-height: 400px;
}