/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/**
 * CSS Boilerplate for WordPress/Elementor Sites
 * 
 * Includes:
 * - Fluid typography using clamp()
 * - Responsive padding utilities
 * - Common layout helpers
 * - Transparent/sticky header styles
 */

/* ============================================
   FLUID TYPOGRAPHY
   ============================================ */

/* Base heading sizes - responsive between mobile and desktop */
h1 { 
    font-size: clamp(2.125rem, 1.79891rem + 1.373vw, 3rem); /* 34px - 48px */
    line-height: 1em !important;
}

h2 { 
    font-size: clamp(1.75rem, 1.5638rem + 0.784vw, 2.25rem); /* 28px - 36px */
    line-height: 1em !important;
}

h3 { 
    font-size: clamp(1.375rem, 1.32845rem + 0.196vw, 1.5rem); /* 22px - 24px */
    line-height: 1.1em !important;
}

h4 { 
    font-size: clamp(1.25rem, 1.20345rem + 0.196vw, 1.375rem); /* 20px - 22px */
    line-height: 1.1em !important;
}

h5 { 
    font-size: clamp(1.1875rem, 1.16803rem + 0.082vw, 1.25rem); /* 19px - 20px */
    line-height: 1.1em !important;
}

p, body { 
    font-size: clamp(1rem, 1rem + 0vw, 1rem); /* 16px - 16px */
}

/* Paragraph size variants */
.para-xxl p { 
    font-size: clamp(2.5rem, 1.84806rem + 2.745vw, 4.25rem); /* 40px - 68px */
    line-height: 1.1em;
    font-weight: 300;
}

.para-xl p { 
    font-size: clamp(1.75rem, 1.5638rem + 0.784vw, 2.25rem); /* 28px - 36px */
    line-height: 1em !important;
}

.para-lg p { 
    font-size: clamp(1.1875rem, 1.16803rem + 0.082vw, 1.25rem); /* 19px - 20px */
    line-height: 1.1em !important;
}

.para-m p { 
    font-size: clamp(1.0625rem, 1.04303rem + 0.082vw, 1.125rem); /* 17px - 18px */
    line-height: 1.1em;
    font-weight: 300;
}

.p-sm p { 
    font-size: 14px;
}

/* Blog post specific heading sizes */
.single-post h2 { 
    font-size: clamp(1.375rem, 1.32845rem + 0.196vw, 1.5rem); /* 22px - 24px */
    line-height: 1.1em !important;
}

.single-post h3 { 
    font-size: clamp(1.25rem, 1.20345rem + 0.196vw, 1.375rem); /* 20px - 22px */
    line-height: 1.1em !important;
}


/* ============================================
   SECTION WRAPPER PADDING
   ============================================ */

/* Hero section - homepage */
.wrapper-hero {
    padding-top: clamp(3.75rem, 2.81853rem + 3.922vw, 6.25rem); /* 60px - 100px */
}

/* Hero section - internal pages */
.wrapper-hero-internal {
    padding-top: clamp(5.625rem, 3.99504rem + 6.863vw, 10rem); /* 90px - 160px */
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    padding-bottom: clamp(3.125rem, 2.54099rem + 2.459vw, 5rem) !important; /* 50px - 80px */
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
}

/* Page title section */
.wrapper-pagetitle {
    padding-top: clamp(5.625rem, 3.99504rem + 6.863vw, 10rem); /* 90px - 160px */
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    padding-bottom: 30px;
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
}

/* Standard section padding */
.wrapper-main {
    padding-top: clamp(2.5rem, 1.56853rem + 3.922vw, 5rem) !important; /* 40px - 80px */
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    padding-bottom: clamp(3.125rem, 2.54099rem + 2.459vw, 5rem) !important; /* 50px - 80px */
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
}

/* Wrapper variants - remove specific padding */
.wrapper-no-top {
    padding-top: 0 !important;
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    padding-bottom: clamp(3.125rem, 2.54099rem + 2.459vw, 5rem) !important; /* 50px - 80px */
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
}

.wrapper-no-bottom {
    padding-top: clamp(2.5rem, 1.56853rem + 3.922vw, 5rem) !important; /* 40px - 80px */
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    padding-bottom: 0 !important;
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
}

/* For flush images at top and bottom of section */
.wrapper-no-topbottom {
    padding-top: 0 !important;
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    padding-bottom: 0 !important;
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
}

.wrapper-no-leftright {
    padding-top: clamp(2.5rem, 1.56853rem + 3.922vw, 5rem) !important; /* 40px - 80px */
    padding-right: 0 !important;
    padding-bottom: clamp(3.125rem, 2.54099rem + 2.459vw, 5rem) !important; /* 50px - 80px */
    padding-left: 0 !important;
}

/* Text column padding adjustments */
.wrapper-text-left {
    padding-right: clamp(0rem, -1.16423rem + 4.902vw, 3.125rem) !important; /* 0px - 50px */
}

.wrapper-text-right {
    padding-left: clamp(0rem, -1.16423rem + 4.902vw, 3.125rem) !important; /* 0px - 50px */
}

/* Bleeding edge layouts (image extends beyond container) */
.wrapper-bleeding-left {
    padding-top: clamp(2.5rem, 1.56853rem + 3.922vw, 5rem) !important; /* 40px - 80px */
    padding-right: clamp(1.25rem, 0.55151rem + 2.941vw, 3.125rem) !important; /* 0px - 50px */
    padding-bottom: clamp(3.125rem, 2.54099rem + 2.459vw, 5rem) !important; /* 50px - 80px */
    padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important; /* 10px - 20px */
}

.wrapper-bleeding-right {
    padding-top: clamp(2.5rem, 1.56853rem + 3.922vw, 5rem) !important; /* 40px - 80px */
    padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important; /* 10px - 20px */
    padding-bottom: clamp(3.125rem, 2.54099rem + 2.459vw, 5rem) !important; /* 50px - 80px */
    padding-left: clamp(1.25rem, 0.55151rem + 2.941vw, 3.125rem) !important; /* 0px - 50px */
}

/* Mobile text wrapping adjustments */
@media only screen and (max-width: 544px) {
    .text-wrap-left {
        padding-right: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    }
    
    .text-wrap-right {
        padding-left: clamp(1.25rem, 1.48275rem + -0.98vw, 0.625rem) !important;
    }
}


/* ============================================
   GENERAL UTILITIES
   ============================================ */

/* Hide reCAPTCHA badge */
.grecaptcha-badge { 
    visibility: hidden;
}

/* Prevent horizontal scroll */
body { 
    overflow-x: hidden;
}

/* Link styling variants */
.alink a {
    text-decoration: underline !important;
    color: black;
}

.alink a:hover {
    color: #0240FF;
}

.blog-alink a {
    color: black;
    text-decoration: underline !important;
    font-weight: 500;
}

.white-links a {
    color: white !important;
    text-decoration: underline !important;
    font-weight: 500;
}

/* List styling */
.bullets ol,
.bullets ul {
    margin: 0 0 1.5em 1em !important;
}

.bullets li {
    margin-bottom: 6px;
}

/* Colored bullet points */
.bullets-coloured ul li::marker {
    color: #a1384f;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.bullets-coloured-arrow ul li::marker {
    content: "> > ";
    color: #ffffff;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.bullets-coloured-blue ul li::marker {
    color: #0f2c4a;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}


/* ============================================
   TRANSPARENT/STICKY HEADER
   ============================================ */

/* Base transparent header */
.elementor-element.transparentheader {
    z-index: 999;
    position: absolute;
    background: transparent !important;
    border-bottom: 0px solid rgba(255, 255, 255, 0.1);
    transition: all 0.4s;
    left: 0;
    width: 100% !important;
}

/* Sticky header state */
.transparentheader.elementor-sticky--effects {
    position: fixed;
    top: 0 !important;
    background-color: rgba(247, 241, 229, 0.8) !important;
    width: 100%;
}

/* Header content container */
.transparentheader > .elementor-element {
    max-width: 1200px;
    margin: 0 auto;
}

/* Logo transition when sticky */
.transparentheader.elementor-sticky--effects .elementor-widget-image a img {
    transition: 1s ease-in-out !important;
}


/* ============================================
   POSITIONING UTILITIES
   ============================================ */

/* Center element horizontally using absolute positioning */
.centre-absolute {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 450px; /* Adjust as needed */
}

/* Wrapper for centered absolute positioning */
.centre-absolute-element-wrap {
    position: relative;
}

/* Center element both horizontally and vertically */
.centre-absolute-element {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: 0 auto;
}