/*
Theme Name: Zonar Child Theme
Theme URI: https://themeforest.net/item/zonar-personal-portfolio-wordpress-theme/29496846
Description: Child theme of Zonar
Author: webRedox WordPress team
Author URI: http://webredox.net/
Template: zonar
Version: 1.2 4/29/26
Text Domain: zonar-child
*/

/*******Add Your Css Below This Line*********/

/* ========================================================================== 
   GLOBAL SITE ELEMENTS (HEADER, NAVIGATION, FOOTER UI) 
   ========================================================================== */
/* 1. Logo Alignment (Forces vertical centering in Top Frame) */ 
.logo-holder { 
    position: absolute !important; 
    left: 40px !important; 
    top: 50% !important; 
    transform: translateY(-50%) !important; 
    height: 70px !important; 
    display: flex !important; 
    align-items: center !important; 
	z-index: 1001 !important;
} 

.logo-holder img { 
    height: 70px !important; 
    width: auto !important; 
    max-height: none !important; 
}

/* 2. Primary Call-To-Action ("Let's Talk About Your Project!") */ 
.header-contacts li a { 
    font-size: 18px !important; 
    font-weight: 800 !important; 
    color: #ffa500 !important; 
    text-transform: uppercase !important; 
    line-height: 1 !important; 
    display: inline-block !important; 
}

/* 3. Social Media Icons (Standardizes color and size) */ 
.share-container ul li a i { 
    color: #ffffff !important; 
    font-size: 22px !important; 
}

/* 3a. Sidebar Social Media Icons Override */
.left-header_social li a,
.left-header_social li a i {
    color: #ffffff !important;
}

/* 3b. Sidebar Social Media Anchoring (Locks icons below the orange dot) */
html body .left-header_social {
    bottom: auto !important; /* Disables the theme's bottom anchor */
    top: 120px !important; /* VERTICAL LEVER: Adjust this number to sit perfectly below the orange dot */
}

/* 3c. Hide Theme's Disconnected Orange Bar */
html body .left-header::after {
    display: none !important; 
}

/* 3d. Create Smart Caboose Bar (Automatically trails social icons) */
html body .left-header_social::after {
    content: '' !important;
    position: absolute !important;
    bottom: -30px !important; /* LEVER: Adjust this to change distance from the last icon */
    width: 60px !important;
    height: 8px !important;
    left: 50% !important;
    transform: translateX(-50%) !important; /* Perfectly centers the bar under the icons */
    background: var(--zr-main-color) !important; /* Pulls your exact theme orange */
}

/* 4. IMDb Custom Link (Replaces the default Dribbble icon with "IMDb" text) */ 
.fa-dribbble:before { 
    display: none !important; 
} 

.fa-dribbble:after { 
    content: "IMDb" !important; 
    font-family: "Helvetica Neue", Arial, sans-serif !important; 
    font-size: 13px !important; 
    font-weight: 900 !important; 
    color: #ffffff !important; 
    line-height: 50px !important; 
    display: block !important; 
}

/* 5. Social Media Hover States (Orange background, dark text) */ 
.share-container ul li a:hover { 
    background-color: #ffa500 !important; 
    border-radius: 4px; 
} 

.share-container ul li a:hover i, 
.share-container ul li a:hover .fa-dribbble:after { 
    color: #292929 !important; 
}

/* 6. Hidden Theme Elements (Removes bouncing mouse, coordinates, slider UI) */ 
.mouse-icon, 
.scroll-down-wrap, 
.sc-next, 
.sc-prev, 
.sw-pagination-container, 
.slider-pagination, 
.header-titl-container span:not(.header-titl) { 
    display: none !important; 
    visibility: hidden !important; 
    opacity: 0 !important; 
}

/* 7. Secondary Call-To-Action (Explore Button Text - Bottom right "New Test" link) */ 
.start-btn { 
    font-size: 18px !important; 
}

/* 8. Custom Menu Button Text Color and Size (EXPLORE) */
.menu-button-text {
    color: #ffa500 !important; /* Changes the color to your theme's orange. Replace with any hex code! */
    font-size: 14px !important; /* Adjust this number to make it larger or smaller */
}

/* 9. Expanded Menu Link Text Size (Catches All Links) */
a.nav,
.menu-item a {
    font-size: 20px !important; /* Adjust this number to make all menu items larger or smaller */
}

/* ========================================================================== 
   SLIDESHOW CONTROLS RELOCATION (PREV, PLAY/PAUSE, NEXT) 
   ========================================================================== */
/* Pin the BACK arrow left of center */ 
.hsc-prev { 
    position: fixed !important; 
    top: auto !important; 
    right: auto !important; 
    bottom: 30px !important; 
    left: 50% !important; 
    margin: 0 !important; 
    padding: 0 !important; 
    
    /* Centers the arrow on itself, THEN pushes it exactly 60px left */
    transform: translateX(calc(-50% - 60px)) !important; 
    
    display: block !important; 
    visibility: visible !important; 
    opacity: 1 !important; 
    z-index: 9999 !important; 
}

/* Pin the PLAY/PAUSE button dead center */ 
.play-pause_slider { 
    position: fixed !important; 
    top: auto !important; 
    right: auto !important; 
    bottom: 30px !important; 
    left: 50% !important; 
    margin: 0 !important; 
    transform: translateX(-50%) !important; 
    display: block !important; 
    z-index: 9999 !important; 
}

/* Pin the FORWARD arrow right of center */ 
.hsc-next { 
    position: fixed !important; 
    top: auto !important; 
    right: auto !important; 
    bottom: 30px !important; 
    left: 50% !important; 
    margin: 0 !important; 
    padding: 0 !important; 
    
    /* Centers the arrow on itself, THEN pushes it exactly 60px right */
    transform: translateX(calc(-50% + 60px)) !important; 
    
    display: block !important; 
    visibility: visible !important; 
    opacity: 1 !important; 
    z-index: 9999 !important; 
}

/* ========================================================================== 
   HOME PAGE SLIDER CSS - TYPOGRAPHY (DESKTOP) 
   ========================================================================== */
/* 1. Sub Title (Top small text above Headline. Example: "Services I Offer") */ 
.half-hero-wrap .hhw_header { 
    font-size: 18px !important; 
}

/* 2. Title>Headline (1st Orange Word) */ 
.half-hero-wrap h1 span:nth-of-type(1) { 
    font-size: 80px !important; 
}

/* 3. Title>Sub-Head 1 (2nd Orange Word) */ 
.half-hero-wrap h1 span:nth-of-type(2) { 
    font-size: 55px !important; 
}

/* 4. Title>Sub-Head 2 (3rd Orange Word) */ 
.half-hero-wrap h1 span:nth-of-type(3) { 
    font-size: 55px !important; 
}

/* 5. Standard Title Text (The white text following the Sub-Heads) */ 
.half-hero-wrap h1 { 
    font-size: 45px !important;
    line-height: 1.1 !important; 
    width: 80% !important; 
    max-width: 80% !important;
}

/* 6. Content Description Paragraph (The smaller paragraph text) */ 
.half-hero-wrap h4 { 
    font-size: 22px !important; 
    line-height: 1.0 !important; 
	color: #ffffff !important; 
    width: 80% !important; 
    max-width: 80% !important; 
}

/* Override the theme's default 50% desktop container limit */
.half-hero-wrap { 
    width: 80% !important; /* You can change this to 90% or 100% depending on how wide you want the text to stretch */
    max-width: 80% !important; 
}

/* 7. Button Text (CTA) (Example: ”Check Out My Editing Portfolio") - Global size reduction & vertical stacking support */ 
.half-hero-wrap .btn { 
    font-size: 18px !important; 
    padding: 6px 22px !important; /* Tighter Top/Bottom (6px) for stacking, standard Left/Right (22px) */
    height: auto !important; 
    line-height: normal !important; 
    margin-bottom: 10px !important; /* Creates a small gap between buttons if stacked vertically */
    display: inline-block !important; /* Ensures the margin calculates correctly */
}

/* 8. Paragraph Spacing (Pulls the text UP to reduce the gap) */ 
.half-hero-wrap h1 br { 
    content: "" !important; 
    display: block !important; 
    margin-bottom: 5px !important; 
}

/* 9. Vertical Content Placement (Desktop) - Overrides theme's absolute positioning */
.page-id-13 .half-hero-wrap { 
    top: 15% !important; /* HEIGHT LEVER: Decrease to move UP (e.g., 10%). Increase to move DOWN (e.g., 30%). */
}

/* ========================================================================== 
   HOME PAGE SLIDER CSS - TYPOGRAPHY (MOBILE & IPAD OVERRIDES) 
   ========================================================================== */
@media only screen and (max-width: 1366px) {
    
    /* 1. Sub Title (Top small text above Headline. Example: "Services I Offer") */ 
    .half-hero-wrap .hhw_header { 
        font-size: 14px !important; 
    }
    
    /* 2. Title>Headline (1st Orange Word) */ 
    .half-hero-wrap h1 span:nth-of-type(1) { 
        font-size: 40px !important; 
    }
    
    /* 3. Title>Sub-Head 1 (2nd Orange Word) */ 
    .half-hero-wrap h1 span:nth-of-type(2) { 
        font-size: 25px !important; 
    }
    
    /* 4. Title>Sub-Head 2 (3rd Orange Word) */ 
    .half-hero-wrap h1 span:nth-of-type(3) { 
        font-size: 25px !important; 
    }
    
   /* 5. Standard Title Text (The white text following the Sub-Heads) - Constrained to match paragraph width */ 
    .half-hero-wrap h1 { 
        font-size: 20px !important; 
        width: 80% !important; /* DECREASE THESE TO NARROW */
        max-width: 80% !important; 
        box-sizing: border-box !important; 
        padding-right: 15px !important; 
    }

    /* 6. Content Description Paragraph (The smaller paragraph text - COMBINED FIX: Sizing + Boundaries to stop overflow) */
    .half-hero-wrap h4 { 
        font-size: 20px !important; 
        line-height: 1.0 !important; 
        margin-top: 0 !important;
        margin-bottom: 10px !important;
        width: 80% !important; /* DECREASE THESE TO NARROW */
        max-width: 80% !important; 
        box-sizing: border-box !important;
        padding-right: 15px !important; 
        white-space: normal !important; 
        overflow-wrap: break-word !important; 
        word-wrap: break-word !important; 
    }
    
    /* 7. Button Text (CTA) (Example: ”Check Out My Editing Portfolio") */ 
    .half-hero-wrap .btn { 
        font-size: 18px !important; 
    }
    
    /* 8. Paragraph Spacing (Pulls the text UP to reduce the gap) */ 
    .half-hero-wrap h1 br { 
        display: block !important; 
        margin: 0 !important; 
        content: "" !important; 
    }
    
    .half-hero-wrap h1 span { 
        display: inline-block !important; 
        margin-top: 15px !important; 
    }
    
    .half-hero-wrap h1 span:first-of-type { 
        margin-top: 0 !important; 
    }

    /* 9. Vertical Content Placement & Container Width Constraint */
    .page-id-13 .hero-slider-wrap .swiper-slide { 
        display: flex !important; 
        align-items: flex-start !important; 
        /* HEIGHT LEVER: Decrease this number (e.g., to 80px or 60px) to move the text UP. Increase it to move it DOWN. */
        padding-top: 80px !important; 
    }
    
    /* Forces the container to stay within the screen on iPad - Specificity increased to override Desktop */
    .page-id-13 .half-hero-wrap { 
        position: relative !important; 
        top: 0 !important; 
        transform: none !important; 
        margin: 0 !important; 
        width: 85% !important; 
        max-width: 85% !important; 
        box-sizing: border-box !important; 
    }
	
	/* 10. Mobile Primary Call-To-Action Relocation (Viewport Absolute Centering Fix) */
    html body .header-contacts {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important; 
        
        top: 85px !important; 
        
        /* THE FIX: 'vw' forces the browser to measure the literal screen, ignoring parent boxes */
        left: 50vw !important; 
        transform: translateX(-50%) !important; 
        
        width: max-content !important; 
        right: auto !important; 
        bottom: auto !important; 
        z-index: 999999 !important; 
        margin: 0 !important;
        padding: 0 !important;
        height: auto !important;
        overflow: visible !important; 
        clip: auto !important;
    }

    /* Keeps the strict Flexbox resets to strip out invisible bullet-point indents */
    html body .header-contacts ul {
        display: flex !important;
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Resets the individual list items to sit perfectly flush */
    html body .header-contacts li,
    html body .header-contacts li a {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
    }
}

/* ========================================================================== 
   IPHONE-SPECIFIC OVERRIDES (Restores wider text specifically for phones)
   ========================================================================== */
@media only screen and (max-width: 767px) {
    /* Content Description Paragraph (iPhone Width) */
    .page-id-13 .half-hero-wrap h4 { 
        width: 95% !important; /* INCREASE THESE TO WIDEN */
        max-width: 95% !important; 
    }
    
    /* Title Text (iPhone Width) - Overrides the iPad's 85% limit to match the paragraph */
    .page-id-13 .half-hero-wrap h1 { 
        width: 95% !important; /* INCREASE THESE TO WIDEN */
        max-width: 95% !important; 
    }
    
    /* Container Width Constraint (iPhone Width) - Added .page-id-13 to beat iPad limit */
    .page-id-13 .half-hero-wrap { 
        width: 100% !important; 
        max-width: 100% !important; 
    }
    
    /* Hides the Secondary CTA/Explore Button Text on mobile to make room for slider controls */
    .start-btn { 
        display: none !important; 
    }

    /* Keep the Play/Pause button at 15px from the bottom */
    .play-pause_slider {
        bottom: 15px !important;
    }

    /* Drop the Prev and Next arrows roughly 25% lower than the play button */
    .hsc-prev,
    .hsc-next {
        bottom: 0px !important;
    }
	
	/* Primary CTA Text Width Size Constraint (iPhone) */
    html body .header-contacts li a { 
        font-size: 16px !important; /* Adjust this number to fine-tune the width */
    }
	
	/* Mobile Social Safety */
    html body .share-container { 
        left: 15px !important; 
        transform: scale(0.8) !important; /* Removed translateY because justify-content handles centering now */
    }
	
}

/* ==========================================================================
   2. PAGE 1422 PORTFOLIO: EDITING - IPHONE FINAL REFINEMENTS
   ========================================================================== */
    /* --- PAGE 1422 UNIVERSAL OVERRIDES - all devices --- */
    html body.page-id-1422 .gallery-filters a {
        color: #ffffff !important;
}

/* Hide Irrelevant Filter Categories from the Editing Portfolio Page */
html body.page-id-1422 .gallery-filters a[data-filter=".short-story"] {
    display: none !important;
}

/* --- DESKTOP & IPAD FILTER SPACING LEVER (Prevents category wrapping) --- */
@media only screen and (min-width: 768px) {
    html body.page-id-1422 .gallery-filters a {
        padding-left: 12px !important; 
        padding-right: 12px !important; 
        margin-left: 0 !important; 
        margin-right: 0 !important; 
    }
}

@media only screen and (max-width: 767px) {
    html body.page-id-1422 .fixed-bottom-panel {
        height: 35px !important; 
        bottom: 0 !important;
        top: auto !important;
    }

    /* Hides the original "Filter" text and replaces it with Orange "SORT:" */
    html body.page-id-1422 .psn_button {
        height: 35px !important;
        line-height: 35px !important;
        font-size: 0 !important; /* Hides original text */
        color: transparent !important;
    }

    html body.page-id-1422 .psn_button:before {
        content: "SORT:";
        font-size: 16px !important; /* Matched to categories */
        color: #ff9600 !important;
        font-family: "Mukta Vaani", sans-serif !important;
        font-weight: 700 !important;
        visibility: visible !important;
        padding-left: 15px !important;
        display: inline-block !important;
		line-height: 35px !important; 
        vertical-align: middle !important;
    }

    html body.page-id-1422 .to-top-btn {
        height: 35px !important;
        line-height: 35px !important;
    }

    /* Tight Menu Box */
    html body.page-id-1422 .gallery-filters {
        height: auto !important;
        width: 180px !important;
        bottom: 35px !important;
        left: 0 !important;
        background: #000 !important;
        padding: 10px 0 !important;
    }

    html body.page-id-1422 .gallery-filters a {
        font-size: 16px !important;
        padding: 3px 20px !important;
        display: block !important;
        text-align: left !important;
    }
}

/* ==========================================================================
   GLOBAL COUNTER KILL (11/11) - ALL DEVICES
   ========================================================================== */
/* This is moved out of the desktop query to ensure it kills the numbers on iPad and iPhone as well */
.folio-counter, 
[class*="folio-counter"],
.all-album,
.n_count,
.num-holder {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ==========================================================================
   PHASE C: PAGE-ID 1422 - PORTFOLIO: EDTING - PTG HEIGHT ADJUSTMENT
   ========================================================================== */

/* --- DESKTOP (Larger than 1024px) --- */
@media only screen and (min-width: 1025px) {

    /* 2. PTG POSITIONING */
    .page-id-1422 .fixed-column-wrap_title {
        bottom: auto !important; 
        top: 10% !important; /* Lowering this number (e.g., 15%) moves it higher. Increasing it (e.g., 40%) moves it lower.*/
        right: 120px !important;
        width: 471px !important;
        z-index: 999 !important;
    }

    /* 3. PARAGRAPH STYLING */
    .page-id-1422 .fixed-column-wrap_title p {
        background: rgba(0, 0, 0, 0.3) !important; /* 0.3 controls the transparency of the grey box behind the paragraph.*/ 
        padding: 20px !important;
        font-size: 18px !important;
        margin-top: 20px !important;
    }
}

/* --- TABLET & MOBILE (Smaller than 1024px) --- */
@media only screen and (max-width: 1024px) {
	
    .page-id-1422 .fixed-column-wrap_title {
        top: -10% !important; /* Even higher for mobile to clear navigation */
        right: 5% !important;
        left: 0% !important;
        width: 90% !important;
        text-align: center !important;
    }
    
    .page-id-1422 .fixed-column-wrap_title p {
        background: rgba(0, 0, 0, 0.5) !important; /* Slightly darker for mobile readability */
        padding: 15px !important;
        font-size: 16px !important;
    }

    /* --- MOBILE MENU OVERLAP FIX --- */
    html body .nav-holder nav li a {
        font-size: 14px !important;    /* Shrinks the font size on iPhone */
        line-height: 1.6 !important;   /* Pushes lines apart to stop the overlapping */
        padding: 8px 0 !important;     /* Adds safe vertical space around each link */
    }
	
} /* <--- This closing brace seals everything inside the mobile media query */

/* ==========================================================================
   INDIVIDUAL PROJECT PAGES - LAYOUT OVERRIDES (Dual-Targeted)
   ========================================================================== */

/* 1. Remove Light Grey Decorative Boxes behind text */
html body.single-portfolio .col-wc_dec,
html body.portfolio-template-default .col-wc_dec {
    display: none !important; 
}

/* 2. Pull Entire Content Column Up to Logo Level */
html body.single-portfolio .column-wrap-container,
html body.portfolio-template-default .column-wrap-container {
    padding-top: 0px !important; 
    margin-top: -60px !important; /* HOIST LEVER: Make this negative number larger (e.g., -80px, -120px) to drag the text higher up the page. */
}

/* 3. Reduce Whitespace Between Elements */
html body.single-portfolio .column-wrap-container .vc_row,
html body.portfolio-template-default .column-wrap-container .vc_row {
    margin-bottom: 0px !important; 
}

/* 4. Remove Final Grey Box Behind Section Titles */
html body.single-portfolio .section-title h3::before,
html body.portfolio-template-default .section-title h3::before {
    display: none !important;
}

/* 5. Remove Invisible Bumper Under Section Title */
html body.single-portfolio .section-title,
html body.portfolio-template-default .section-title {
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

/* 6. Increase Paragraph Text Size and Adjust Weight in WPBakery Content Blocks */
html body.single-portfolio .wpb_text_column .wpb_wrapper p,
html body.portfolio-template-default .wpb_text_column .wpb_wrapper p {
    font-size: 16px !important; 
    line-height: 1.6 !important; 
    font-weight: 300 !important; /* Standard is 400, Light is 300. Adjust based on your preference */
}

/* 7. Increase Section Subtitle Text Size */
html body.single-portfolio .section-title p,
html body.portfolio-template-default .section-title p {
    font-size: 16px !important; 
    font-weight: 300 !important; /* Change to 400 or 500 if it appears too thin */
    line-height: 1.6 !important;
}

/* 8. Increase Accordion Title and Content Text Size */
html body.single-portfolio .accordion a.toggle,
html body.portfolio-template-default .accordion a.toggle,
html body.single-portfolio .accordion .accordion-inner,
html body.portfolio-template-default .accordion .accordion-inner,
html body.single-portfolio .accordion .accordion-inner p,
html body.portfolio-template-default .accordion .accordion-inner p {
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 1.6 !important;
}

/* 9. Increase Project Details List, Vertical "Details" Text, and Button Text Size */
.project-details ul li,
.project-details ul::after,
.project-details .btn,
.project-details .btn span {
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 1.6 !important;
}

/* 10. View Project Button Fix (Corrected DOM Path) */
html body.single-portfolio .wpb_wrapper a.btn,
html body.single-portfolio .wpb_wrapper a.btn span,
html body.portfolio-template-default .wpb_wrapper a.btn,
html body.portfolio-template-default .wpb_wrapper a.btn span {
    font-size: 16px !important;
    font-weight: 300 !important;
}

/* ==========================================================================
   PAGE-ID 465 - CONTACT PAGE FINAL CUSTOMIZATIONS (RADIO BUTTON UPDATE)
   ========================================================================== */

/* --- 1. ULTRA-SPECIFIC VERTICAL RESET (ALL CONTAINERS) --- */
html body.page-id-465 .column-wrap-container,
html body.page-id-465 section.scroll_sec,
html body.page-id-465 section.scroll_sec > .container,
html body.page-id-465 .vc_row,
html body.page-id-465 .wpb_column,
html body.page-id-465 .vc_column-inner,
html body.page-id-465 .wpb_wrapper {
    padding-top: 0px !important;
    margin-top: 0px !important;
}

html body.page-id-465 .wpb_text_column.wpb_content_element {
    margin-top: 30px !important; /* Make this number more negative to pull the form higher */
}

/* --- 1a. GLOBAL LAYOUT BOUNDARIES (Prevents side-scrolling) --- */
... (Leave all remaining radio button, text field, and button styles below here exactly as they are)

/* --- 1a. GLOBAL LAYOUT BOUNDARIES (Prevents side-scrolling) --- */
html body.page-id-465 .wpcf7-form {
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}
html body.page-id-465 .wpcf7 input[type="text"],
html body.page-id-465 .wpcf7 input[type="email"],
html body.page-id-465 .wpcf7 input[type="url"],
html body.page-id-465 .wpcf7 textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* --- GREY DECORATIVE SHADOW & BACKGROUND BLOCK REMOVAL --- */
html body.page-id-465 .col-wc_dec {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}
html body.page-id-465 .column-wrap-container,
html body.page-id-465 .fixed-column-wrap,
html body.page-id-465 .wpb_wrapper,
html body.page-id-465 .vc_row {
    box-shadow: none !important;
    background-image: none !important;
}

/* --- 2. MAIN HEADER TITLE SETTINGS --- */
html body.page-id-465 .wpb_text_column .wpb_wrapper h1,
html body.page-id-465 .wpb_text_column .wpb_wrapper h1 strong {
    font-size: 38px !important; /* INCREASE this value to make the main title header larger */
    color: #111111 !important;
    font-family: "Mukta Vaani", sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    display: block !important;
    margin-bottom: 40px !important;
}

/* --- 3. STANDARD TEXT INPUT FIELDS DESIGN --- */
html body.page-id-465 .wpcf7 input[type="text"],
html body.page-id-465 .wpcf7 input[type="email"],
html body.page-id-465 .wpcf7 input[type="url"],
html body.page-id-465 .wpcf7 textarea {
    font-size: 16px !important;
    color: #1a1a1a !important;
    font-weight: 600 !important;
    border: 1px solid #777777 !important;
    background: #ffffff !important;
    padding: 12px 15px !important;
}
html body.page-id-465 .wpcf7 ::placeholder {
    color: #555555 !important;
    opacity: 1 !important;
}

/* --- 4. RADIO BUTTONS LAYOUT & TYPOGRAPHY --- */
html body.page-id-465 .form-group-radio {
    margin-bottom: 25px !important;
}
html body.page-id-465 .radio-section-title {
    display: block !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin-bottom: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}
html body.page-id-465 .wpcf7 .wpcf7-list-item {
    display: block !important; /* Stacks radio options cleanly vertically */
    margin: 0px 0px 8px 0px !important;
}
html body.page-id-465 .wpcf7 .wpcf7-list-item label {
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer !important;
}
html body.page-id-465 .wpcf7 .wpcf7-list-item input[type="radio"] {
    margin-right: 10px !important;
    width: 18px !important;
    height: 18px !important;
    cursor: pointer !important;
}
html body.page-id-465 .wpcf7 .wpcf7-list-item-label {
    font-size: 16px !important;
    color: #222222 !important;
    font-weight: 600 !important;
}

/* --- 5. SUBMIT BUTTON SETTINGS --- */
html body.page-id-465 .wpcf7 input[type="submit"],
html body.page-id-465 .wpcf7 .wpcf7-submit {
    font-size: 15px !important; /* Tune up or down to set button font scale */
    font-weight: 800 !important;
    text-transform: uppercase !important;
    padding: 12px 30px !important;
    margin-top: 15px !important;
}