@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

:root {
    --blue: #0082C8;
    --darkblue: #135A8C;
    --green: #4CAF50;
    --darkgreen: #3D8B40;
    --white: #FFFFFF;
    --black: #1A1A1A;
    --darkgrey: #4A4A4A;
    --lightestgrey: #F5F8FB;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--white);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'DM Sans', 'Inter', Arial, Helvetica, sans-serif;
    margin-top: .5rem;
    margin-bottom: 1rem;
    font-weight: 700;
    color: var(--black);
    text-transform: uppercase;
    letter-spacing: -.01em;
    line-height: 1.05;
}

.Normal {
    font-size: 17px;
    line-height: 1.6;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    color: var(--black);
}

.jumbo {
    font-size: 6rem;
}

.large {
    font-size: 4rem;
}

p {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: var(--blue);
    text-decoration: none;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

a:hover {
    text-decoration: none;
    color: var(--darkblue);
}

a:visited {
    color: var(--blue);
}

a:visited:hover {
    text-decoration: none;
    color: var(--darkblue);
}

.bi {
    font-size: 1.4em;
    padding: 0 10px;
}

.container-fluid {
    padding-left: 0;
    padding-right: 0;
}

.container-fluid .row {
    margin-right: 0;
    margin-left: 0;
}

s, strike {
    text-decoration: none;
    position: relative;
    color: var(--darkgrey);
}

s::before, strike::before {
    top: 40%;
    background: var(--green);
    opacity: .8;
    content: '';
    width: 110%;
    position: absolute;
    height: .1em;
    border-radius: .1em;
    left: -5%;
    white-space: nowrap;
    display: block;
    transform: rotate(-15deg);
}

.grecaptcha-badge {
    opacity: 0;
}

/*------------------------------------------------*/
/* HEADER */
/*------------------------------------------------*/

#TopBanner {
    background-color: var(--darkblue);
    position: relative;
    z-index: 500;
    padding-top: 5px;
    padding-bottom: 5px;
    text-transform: uppercase;
}

#TopBanner p {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
    color: var(--white);
    font-weight: 700;
    letter-spacing: .05em;
}

#TopBanner p a {
    color: var(--white);
}

#TopBanner p a:hover {
    color: var(--white);
}

#TopBanner p a:visited {
    color: var(--white);
}

#TopBanner p a:visited:hover {
    color: var(--white);
}

#TopBanner .bi {
    font-size: 18px;
}

#TopBanner .white-button {
    padding: 0px 10px;
    margin-top: 0;
    margin-bottom: 0;
}

#TopBanner {
    display: none;
}

/*------------------------------------------------*/
/* NAVBAR */
/*------------------------------------------------*/

.navbar {
    padding: 0;
    letter-spacing: .5px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    box-shadow: 0 2px 8px rgba(26, 123, 192, 0.08);
}

.bg-light {
    padding: .5rem 1rem;
    background-color: var(--white) !important;
    border-bottom: 1px solid var(--lightestgrey);
}

#dnn_dnnLOGO_imgLogo {
    max-height: 70px;
    margin-left: 20px;
    margin-right: 5px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.nav-minimize #dnn_dnnLOGO_imgLogo {
    max-height: 55px;
}

.nav-item {
    text-align: center;
}

.nav-link {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: var(--black) !important;
    display: inline-block;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    line-height: 20px;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.nav-link:hover {
    text-decoration: none;
    color: var(--darkblue) !important;
    border-bottom: 2px solid var(--darkblue);
}

.nav-link:visited {
    color: var(--black);
    border-bottom: 2px solid transparent;
}

.nav-link:visited:hover {
    text-decoration: none;
    color: var(--darkblue) !important;
    border-bottom: 2px solid var(--darkblue);
}

.dropdown-menu {
    background-color: var(--white);
    margin: 0;
    min-width: 12rem;
    border: 1px solid var(--lightestgrey);
    box-shadow: 0 4px 12px rgba(26, 123, 192, 0.12);
}

.dropdown-menu .active {
    border-radius: 0px;
}

#dnn_NavButton h6 {
    margin-top: 0;
    margin-bottom: 0;
}

/* Sticky CTA "Get a Free Bucket" - accent green per brief */
#dnn_NavButton .nav-button {
    display: inline-block;
    margin: 0;
    padding: 8px 18px;
    border-radius: 6px;
    background-color: var(--green);
    color: var(--white) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#dnn_NavButton .nav-button:hover {
    color: var(--white) !important;
    background-color: var(--darkgreen);
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(76, 175, 80, 0.4);
}

/*------------------------------------------------*/
/* HERO */
/*------------------------------------------------*/

/* Base hero container - shared properties */
.hero-bg {
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    height: 500px;
}

/* Home page hero */
.PageType_Home .hero-bg {
    background-image: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.85) 100%), url('/portals/196/7X2A4794.jpg');
    height: 70vh;
    min-height: 520px;
    box-shadow: 0 8px 24px rgba(26, 123, 192, 0.12);
}

/* Interior pages */
.PageType_Normal .hero-bg {
    background-image: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.85) 100%), url('/portals/196/about-bg.png');
    height: 340px;
}

/* lessons */
.Id4066 .hero-bg {
    background-image: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.85) 100%), url('/portals/196/lessons.png');
    height: 340px;
}

/* events */
.Id4068 .hero-bg {
    background-image: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.85) 100%), url('/portals/196/events.png');
    height: 340px;
}

/* about */
.Id4069 .hero-bg {
    background-image: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.85) 100%), url('/portals/196/about-us.png');
    height: 340px;
}

/* contact */
.Id4070 .hero-bg {
    background-image: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.85) 100%), url('/portals/196/contact-us.png');
    height: 340px;
}

/* Free Bucket page - no hero */
.Id4088 .hero-bg {
    display: none;
}

/* Hero video (home only) */
.hero-video {
    display: none;
}

.PageType_Home .hero-video {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

/* Dark overlay over video so text stays readable */
.PageType_Home #HeroBG::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(26, 26, 26, 0.45) 0%, rgba(0, 0, 0, 0.6) 100%);
    z-index: 2;
    pointer-events: none;
}

/* Hero text - above everything */
.hero-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 3;
}

.hero-text h1,
.hero-text h2,
.hero-text h3,
.hero-text h4,
.hero-text h5,
.hero-text h6 {
    color: var(--white);
    margin-top: 1.5rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .3);
}

.hero-text h1,
.hero-text h2 {
    font-weight: 600;
    text-transform: uppercase;
}

.hero-text h2,
.hero-text h3,
.hero-text h4,
.hero-text h5,
.hero-text h6 {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-weight: 500;
}

.PageType_Normal .hero-text h1 {
    color: var(--white) !important;
}

.header-logo {
    max-width: 200px;
    width: 100%;
}

/*------------------------------------------------*/
/* MAIN CONTENT */
/*------------------------------------------------*/

#MainContent {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

#MainContent li {
    list-style-type: disc;
}

/* Section background utility classes */

.blue {
    background-color: var(--darkblue);
    border-radius: 8px;
    margin: 10px auto;
    padding: 2%;
}

.blue p,
.blue li,
.blue h1,
.blue h2,
.blue h3,
.blue h4,
.blue h5,
.blue h6 {
    color: var(--white) !important;
}

.darkblue {
    background-color: var(--darkblue);
    border-radius: 8px;
    margin: 10px auto;
    padding: 2%;
}

.darkblue p,
.darkblue li,
.darkblue h1,
.darkblue h2,
.darkblue h3,
.darkblue h4,
.darkblue h5,
.darkblue h6 {
    color: var(--white) !important;
}

.lightblue {
    background-color: var(--white);
    border-radius: 8px;
    margin: 10px auto;
    padding: 2%;
}

.lightblue p,
.lightblue li,
.lightblue h1,
.lightblue h2,
.lightblue h3,
.lightblue h4,
.lightblue h5,
.lightblue h6 {
    color: var(--black) !important;
}

.white {
    background-color: var(--white);
    border-radius: 8px;
    margin: 10px auto;
    padding: 2%;
}

.white p,
.white li,
.white h1,
.white h2,
.white h3,
.white h4,
.white h5,
.white h6 {
    color: var(--black) !important;
}

.lightestgrey {
    background-color: var(--lightestgrey);
    border-radius: 8px;
    margin: 10px auto;
    padding: 2%;
}

.lightestgrey p,
.lightestgrey h1,
.lightestgrey h2,
.lightestgrey h3,
.lightestgrey h4,
.lightestgrey h5,
.lightestgrey h6,
.lightestgrey li {
    color: var(--black) !important;
}

/*------------------------------------------------*/
/* BUTTONS */
/*------------------------------------------------*/

.white-button {
    display: inline-block;
    margin: 10px 0;
    padding: 12px 30px 10px;
    border: 2px solid var(--white);
    border-radius: 6px;
    background-color: rgba(0, 0, 0, .25);
    color: var(--white) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.white-button:hover {
    background-color: var(--white);
    color: var(--black) !important;
    text-decoration: none;
}

.blue-button {
    display: inline-block;
    margin: 10px 0;
    padding: 12px 30px 10px;
    border-radius: 6px;
    background-color: var(--darkblue);
    border: 2px solid var(--darkblue);
    color: var(--white) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.blue-button:hover {
    background-color: var(--darkblue);
    color: var(--white) !important;
    border: 2px solid var(--darkblue);
    text-decoration: none;
    transform: translateY(-1px);
}

.green-button {
    display: inline-block;
    margin: 10px 0;
    padding: 12px 30px 10px;
    border-radius: 6px;
    background-color: var(--green);
    color: var(--white) !important;
    border: 2px solid var(--green);
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.green-button:hover {
    background-color: var(--darkgreen);
    border: 2px solid var(--darkgreen);
    color: var(--white) !important;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(76, 175, 80, 0.4);
}

.black-button {
    display: inline-block;
    margin: 10px 0;
    padding: 10px 30px;
    border-radius: 6px;
    background-color: var(--black);
    color: var(--white) !important;
    border: 2px solid var(--black);
    border: none;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.black-button:hover {
    color: var(--white) !important;
    background-color: var(--darkgrey);
    text-decoration: none;
}

.black-outline-button {
    display: inline-block;
    margin: 10px 0;
    padding: 10px 30px;
    border-radius: 6px;
    background-color: transparent;
    color: var(--black) !important;
    border: 2px solid var(--black);
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.black-outline-button:hover {
    color: var(--white) !important;
    background-color: var(--black);
    text-decoration: none;
}

/* Free bucket badge - accent green per brief */
.free-bucket-badge {
    display: inline-block;
    background-color: var(--green);
    color: var(--white);
    padding: .35rem 1rem;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .06em;
}

/*------------------------------------------------*/
/* FORMS / SUB WIDGET */
/*------------------------------------------------*/

.sub-widget {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.sub-widget .form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    background-color: transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--white);
    background-clip: padding-box;
    border: 1px solid var(--lightestgrey);
    border-radius: 4px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.sub-widget .form-control::placeholder {
    color: var(--grey);
}

.sub-widget .form-control:focus {
    color: var(--white);
    border-color: var(--green);
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(26, 123, 192, .15);
}

#signup_button {
    display: inline-block;
    margin: 10px 0;
    padding: 12px 30px 10px;
    border-radius: 6px;
    background-color: var(--green);
    color: var(--white) !important;
    border: 2px solid var(--green);
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#signup_button:hover {
    background-color: var(--darkgreen);
    border: 2px solid var(--darkgreen);
    color: var(--white) !important;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(76, 175, 80, 0.4);
}

/* Membership tabs only show on the CGC Pass page */
body:not(.Id4067 ) #MembershipNarrow,
body:not(.Id4067 ) #MembershipTabs {
    display: none;
}

/*------------------------------------------------*/
/* PAGE: HOME */
/*------------------------------------------------*/

.PageType_Home #MainContent {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* "How CGC Works" 3-step section - white with subtle blue tint */
.PageType_Home #TopContentNarrowTwo {
    background-color: var(--darkblue);
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.PageType_Home #TopContentNarrowTwo p,
.PageType_Home #TopContentNarrowTwo li,
.PageType_Home #TopContentNarrowTwo h1,
.PageType_Home #TopContentNarrowTwo h2,
.PageType_Home #TopContentNarrowTwo h3,
.PageType_Home #TopContentNarrowTwo h4,
.PageType_Home #TopContentNarrowTwo h5,
.PageType_Home #TopContentNarrowTwo h6 {
    color: var(--lightestgrey) !important;
}

/* why golfers love cgc */

.PageType_Home #FullWidthContentOne,
.PageType_Home #ThreeColumnNarrow {
    padding-top: 2rem;
    padding-bottom: 2rem;
    background-color: var(--darkgreen);
}

.PageType_Home #FullWidthContentOne p,
.PageType_Home #FullWidthContentOne li,
.PageType_Home #FullWidthContentOne h1,
.PageType_Home #FullWidthContentOne h2,
.PageType_Home #FullWidthContentOne h3,
.PageType_Home #FullWidthContentOne h4,
.PageType_Home #FullWidthContentOne h5,
.PageType_Home #FullWidthContentOne h6,
.PageType_Home #ThreeColumnNarrow p,
.PageType_Home #ThreeColumnNarrow li,
.PageType_Home #ThreeColumnNarrow h1,
.PageType_Home #ThreeColumnNarrow h2,
.PageType_Home #ThreeColumnNarrow h3,
.PageType_Home #ThreeColumnNarrow h4,
.PageType_Home #ThreeColumnNarrow h5,
.PageType_Home #ThreeColumnNarrow h6 {
    color: var(--white) !important;
}

/* reviews */

.PageType_Home #FullWidthContentThree {
    padding-top: 2rem;
    padding-bottom: 2rem;
    background-color: var(--darkblue);
}

.PageType_Home #FullWidthContentThree p,
.PageType_Home #FullWidthContentThree li,
.PageType_Home #FullWidthContentThree h1,
.PageType_Home #FullWidthContentThree h2,
.PageType_Home #FullWidthContentThree h3,
.PageType_Home #FullWidthContentThree h4,
.PageType_Home #FullWidthContentThree h5,
.PageType_Home #FullWidthContentThree h6 {
    color: var(--white) !important;
}

/* marquee */

.PageType_Home #dnn_FullWidthFour {
    padding-left: 0;
    padding-right: 0;
}

/* upcoming events */

.PageType_Home #FullNarrowOne {
    padding-top: 4rem;
    padding-bottom: 3rem;
}

/* faqs */

.PageType_Home #FullWidthContentTwo {
    background-color: var(--lightestgrey);
    background-size: cover;
    background-position: center;
    padding-top: 8rem;
    padding-bottom: 5rem;
}

.PageType_Home #TwoColumnFive {
    background-color: var(--darkgreen) !important;
}

.PageType_Home #dnn_TwoColumnFiveLeft {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.PageType_Home #dnn_TwoColumnFiveLeft p,
.PageType_Home #dnn_TwoColumnFiveLeft li,
.PageType_Home #dnn_TwoColumnFiveLeft h1,
.PageType_Home #dnn_TwoColumnFiveLeft h2,
.PageType_Home #dnn_TwoColumnFiveLeft h3,
.PageType_Home #dnn_TwoColumnFiveLeft h4,
.PageType_Home #dnn_TwoColumnFiveLeft h5,
.PageType_Home #dnn_TwoColumnFiveLeft h6 {
    color: var(--white) !important;
}

.PageType_Home #dnn_TwoColumnFiveRight {
    background-image: url('/Portals/196/7X2A4705.jpg');
    background-size: cover;
    background-position: center;
}

.PageType_Home #FullBottomContent {
    background-color: var(--darkblue) !important;
    padding-top: 3rem;
    padding-bottom: 3rem;
    border-bottom: 2px solid var(--lightestgrey);
}

.PageType_Home #FullBottomContent p,
.PageType_Home #FullBottomContent li,
.PageType_Home #FullBottomContent h1,
.PageType_Home #FullBottomContent h2,
.PageType_Home #FullBottomContent h3,
.PageType_Home #FullBottomContent h4,
.PageType_Home #FullBottomContent h5,
.PageType_Home #FullBottomContent h6 {
    color: var(--white) !important;
}

.Id4068 #FullBottomContent,
.Id4070 #FullBottomContent {
    background-color: var(--darkblue) !important;
    padding-top: 3rem;
    padding-bottom: 3rem;
    border-bottom: 2px solid var(--lightestgrey);
}

.Id4068 #FullBottomContent p,
.Id4068 #FullBottomContent li,
.Id4068 #FullBottomContent h1,
.Id4068 #FullBottomContent h2,
.Id4068 #FullBottomContent h3,
.Id4068 #FullBottomContent h4,
.Id4068 #FullBottomContent h5,
.Id4068 #FullBottomContent h6,
.Id4070 #FullBottomContent p,
.Id4070 #FullBottomContent li,
.Id4070 #FullBottomContent h1,
.Id4070 #FullBottomContent h2,
.Id4070 #FullBottomContent h3,
.Id4070 #FullBottomContent h4,
.Id4070 #FullBottomContent h5,
.Id4070 #FullBottomContent h6 {
    color: var(--white) !important;
}

/* Image hover-zoom utility for card sections */
.zoom-button {
    cursor: pointer;
    width: 100%;
    overflow: hidden;
    position: relative;
    text-align: center;
    border-radius: 8px;
}

.zoom-button img {
    width: 100%;
    transition: transform .5s ease;
}

.zoom-button:hover img {
    transform: scale(1.15);
}

.text-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.text-overlay h2 {
    text-shadow: 2px 2px 8px rgba(0, 0, 0, .6);
    color: var(--white);
}

.text-overlay a {
    color: var(--white) !important;
    text-decoration: none;
}

/*------------------------------------------------*/
/* PAGE: CGC PASS / MEMBERSHIP */
/*------------------------------------------------*/

.Id4067 #MembershipTabs {
    display: none;
}

.Id4067 #MainContent {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.Id4067 #MembershipTabs {
    padding-top: 3rem;
    padding-bottom: 3rem;
    background-color: var(--darkblue);
}

.Id4067 #dnn_ctr16651_ContentPane p,
.Id4067 #dnn_ctr16651_ContentPane li,
.Id4067 #dnn_ctr16651_ContentPane h1,
.Id4067 #dnn_ctr16651_ContentPane h2,
.Id4067 #dnn_ctr16651_ContentPane h3,
.Id4067 #dnn_ctr16651_ContentPane h4,
.Id4067 #dnn_ctr16651_ContentPane h5,
.Id4067 #dnn_ctr16651_ContentPane h6,
.Id4067 #dnn_ctr16776_ContentPane p,
.Id4067 #dnn_ctr16776_ContentPane li,
.Id4067 #dnn_ctr16776_ContentPane h1,
.Id4067 #dnn_ctr16776_ContentPane h2,
.Id4067 #dnn_ctr16776_ContentPane h3,
.Id4067 #dnn_ctr16776_ContentPane h4,
.Id4067 #dnn_ctr16776_ContentPane h5,
.Id4067 #dnn_ctr16776_ContentPane h6,
.Id4067 #dnn_ctr16778_ContentPane p,
.Id4067 #dnn_ctr16778_ContentPane li,
.Id4067 #dnn_ctr16778_ContentPane h1,
.Id4067 #dnn_ctr16778_ContentPane h2,
.Id4067 #dnn_ctr16778_ContentPane h3,
.Id4067 #dnn_ctr16778_ContentPane h4,
.Id4067 #dnn_ctr16778_ContentPane h5,
.Id4067 #dnn_ctr16778_ContentPane h6 {
    color: var(--white) !important;
}

.Id4067 #FullWidthContentOne {
    background-color: var(--darkblue);
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.Id4067 #FullWidthContentOne p,
.Id4067 #FullWidthContentOne li,
.Id4067 #FullWidthContentOne h1,
.Id4067 #FullWidthContentOne h2,
.Id4067 #FullWidthContentOne h3,
.Id4067 #FullWidthContentOne h4,
.Id4067 #FullWidthContentOne h5,
.Id4067 #FullWidthContentOne h6 {
    color: var(--white) !important;
}

.Id4067 #FullWidthContentThree {
    background-color: var(--black);
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.Id4067 #FullWidthContentThree p,
.Id4067 #FullWidthContentThree li,
.Id4067 #FullWidthContentThree h1,
.Id4067 #FullWidthContentThree h2,
.Id4067 #FullWidthContentThree h3,
.Id4067 #FullWidthContentThree h4,
.Id4067 #FullWidthContentThree h5,
.Id4067 #FullWidthContentThree h6 {
    color: var(--white) !important;
}

.Id4067 #FullWidthContentFour {
    display: none;
    background-color: var(--lightestgrey);
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.Id4067 #FullNarrowOne {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

@media screen and (min-width: 996px) {
    .Id4067 #MainContent .mainContentRow {
        padding-left: 5%;
        padding-right: 5%;
    }
}

.free-bucket-pill {
    display: inline-block;
    padding: .5rem 1rem;
    background-color: var(--green);
    color: var(--white);
    text-transform: uppercase;
    border-radius: 18px;
    font-weight: 600;
}

.pass-price-callout {
    display: inline-block;
    background-color: var(--white);
    border-radius: 12px;
    padding: 1.5rem 3rem;
    margin: 1.5rem auto 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.pass-price-amount {
    font-family: 'Inter', sans-serif;
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--blue);
    margin: 0;
    line-height: 1;
}

.pass-price-amount span {
    font-size: 1rem;
    color: var(--darkgrey);
    font-weight: 500;
    margin-left: .25rem;
}

.pass-price-bonus {
    display: inline-block;
    background-color: var(--green);
    color: var(--white);
    padding: .35rem 1rem;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: .85rem 0 0 0;
}

.monthly-schedule {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.schedule-row {
    display: flex;
    align-items: baseline;
    gap: 2rem;
    padding: 1.25rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.schedule-month {
    flex: 0 0 140px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--green);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.schedule-deal {
    flex: 1;
    color: var(--white);
    font-family: 'Inter', sans-serif;
    font-size: 1.05rem;
    line-height: 1.5;
}

@media screen and (max-width: 768px) {
    .schedule-row {
        flex-direction: column;
        gap: 0.25rem;
        padding: 1rem 0.5rem;
    }

    .schedule-month {
        flex: none;
        font-size: 1.1rem;
    }

    .schedule-deal {
        font-size: 1rem;
    }
}

.bucket-card {
    background-color: var(--white);
    border-radius: 8px;
    border: 2px solid var(--green);
    padding: 1.5rem 1rem;
    text-align: center;
    margin-bottom: 1rem;
    box-shadow: 0 4px 12px rgba(26, 123, 192, 0.1);
}

.bucket-card .bucket-balls {
    font-size: .9rem;
    color: var(--darkgrey);
    margin: 0 0 1rem 0;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.bucket-card .walk-up-price {
    margin: 0;
    color: var(--darkgrey);
    font-size: .95rem;
}

.bucket-card .pass-price {
    font-size: 2.5rem;
    color: var(--blue);
    font-weight: 700;
    margin: .25rem 0 0 0;
}

.bucket-card .pass-label {
    font-size: .85rem;
    color: var(--darkgrey);
    margin: 0 0 .75rem 0;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.bucket-card .savings {
    display: inline-block;
    background-color: var(--green);
    color: var(--white);
    padding: .25rem .75rem;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.bucket-showcase {
    padding: 3rem 1rem;
}

.bucket-tile {
    text-align: center;
    padding: 1.5rem 1rem;
}

.bucket-illustration {
    margin: 0 auto 1rem;
}

.bucket-illustration img {
    width: 100%;
    max-width: 200px;
}

.bucket-size {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: .95rem;
    color: var(--darkgrey);
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 0;
}

.bucket-price {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 2.75rem;
    color: var(--blue);
    margin: .25rem 0;
    line-height: 1;
}

.bucket-balls {
    color: var(--green);
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: .95rem;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .bucket-price {
        font-size: 2.25rem;
    }

    .bucket-illustration {
        max-width: 110px;
    }
}

.range-cards-section {
    color: var(--white);
}

.range-cards-eyebrow {
    font-family: 'Inter', sans-serif;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .15em;
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0 .25rem 0;
}

.range-cards-heading {
    color: var(--white);
    font-size: 3rem;
    line-height: 1;
    margin-bottom: 2rem;
    text-transform: uppercase;
}

.range-cards-heading .accent {
    color: var(--white);
}

/* Table */
.range-card-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
}

.range-card-table thead th {
    text-align: left;
    padding: 1rem .5rem;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: rgba(255, 255, 255, 0.6);
    border-bottom: 2px solid #f4c542; /* yellow underline like the poster */
}

.range-card-table thead th:not(:first-child) {
    color: #f4c542;
    text-align: right;
}

.range-card-table tbody tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.range-card-table tbody td {
    padding: 1.25rem .5rem;
    vertical-align: middle;
    font-family: 'Inter', sans-serif;
}

.range-card-table .pkg-name {
    color: var(--white);
    font-weight: 700;
    font-size: 1.4rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.range-card-table .pkg-pay {
    color: var(--white);
    font-weight: 700;
    font-size: 1.6rem;
    text-align: right;
}

.range-card-table .pkg-gets {
    color: #f4c542; /* yellow */
    font-weight: 700;
    font-size: 1.6rem;
    text-align: right;
}

.range-card-table .pkg-bonus {
    color: rgba(255, 255, 255, 0.7);
    font-weight: 600;
    font-size: 1.15rem;
    text-align: right;
}

/* Featured row - Ace */
.range-card-table .pkg-featured {
    background-color: #f4c542;
    border-radius: 999px; /* pill effect */
}

.range-card-table .pkg-featured td {
    color: var(--blue) !important;
    padding: 1.5rem 1rem;
}

.range-card-table .pkg-featured .pkg-name,
.range-card-table .pkg-featured .pkg-pay,
.range-card-table .pkg-featured .pkg-gets,
.range-card-table .pkg-featured .pkg-bonus {
    color: var(--blue) !important;
}

.range-card-table .pkg-featured .pkg-name {
    font-size: 1.75rem;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.range-card-table .pkg-featured .pkg-bonus {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

/* "Best Value" pill next to Ace */
.pkg-badge {
    display: inline-block;
    background-color: var(--white);
    color: var(--blue);
    padding: .35rem .85rem;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-left: .75rem;
    vertical-align: middle;
}

.pkg-badge .bi {
    color: #f4c542;
    font-size: .8rem;
    padding: 0 .25rem 0 0;
}

/* Fine print under Senior/Junior/Military */
.pkg-fine-print {
    display: block;
    color: rgba(255, 255, 255, 0.5);
    font-size: .75rem;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    margin-top: .25rem;
}

/* Right column - Range Card visual */
.range-card-visual {
    padding: 2rem;
}

.range-card-image {
    max-width: 320px;
    width: 100%;
    height: auto;
    margin: 1rem auto 2rem;
    border-radius: 12px;
}

.range-card-benefits {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.range-card-benefits li {
    color: var(--white);
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    padding: .5rem 0;
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    gap: .6rem;
}

.range-card-benefits .bi {
    color: var(--green);
    font-size: .7rem;
    padding: 0;
    margin-top: .5rem;
    flex-shrink: 0;
}

/* Mobile */
@media screen and (max-width: 768px) {
    .range-cards-heading {
        font-size: 2rem;
    }

    .range-card-table .pkg-name {
        font-size: 1rem;
    }

    .range-card-table .pkg-pay,
    .range-card-table .pkg-gets {
        font-size: 1.15rem;
    }

    .range-card-table .pkg-bonus {
        font-size: .95rem;
    }

    .pkg-badge {
        display: block;
        margin-left: 0;
        margin-top: .35rem;
        width: fit-content;
    }
}

/*------------------------------------------------*/
/* PAGE: LESSONS */
/*------------------------------------------------*/

.Id4066 #MainContent {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.Id4066 #TopContentNarrow {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.Id4066 #FullNarrowOne,
.Id4066 #FourColumnOne {
    background-color: var(--lightestgrey);
}

.Id4066 #FullNarrowOne {
    padding-top: 3rem;
}

.Id4066 #FourColumnOne {
    padding-bottom: 3rem;
}

.Id4066 #TwoColumnOne {
    background-color: var(--darkblue);
    padding-top: 3rem;
    padding-bottom: 3rem;
    align-items: center;
}

.Id4066 #TwoColumnOne p,
.Id4066 #TwoColumnOne li,
.Id4066 #TwoColumnOne h1,
.Id4066 #TwoColumnOne h2,
.Id4066 #TwoColumnOne h3,
.Id4066 #TwoColumnOne h4,
.Id4066 #TwoColumnOne h5,
.Id4066 #TwoColumnOne h6 {
    color: var(--white) !important;
}

.Id4066 #TwoColumnTwo {
    background-color: var(--white);
    padding-top: 3rem;
    padding-bottom: 3rem;
    align-items: center;
}

/* Instructor cards section */
.Id4066 #FullNarrowThree {
    background-color: var(--darkgreen);
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.Id4066 #FullNarrowThree p,
.Id4066 #FullNarrowThree li,
.Id4066 #FullNarrowThree h1,
.Id4066 #FullNarrowThree h2,
.Id4066 #FullNarrowThree h3,
.Id4066 #FullNarrowThree h4,
.Id4066 #FullNarrowThree h5,
.Id4066 #FullNarrowThree h6 {
    color: var(--white) !important;
}

@media screen and (min-width: 996px) {
    .Id4066 #MainContent .mainContentRow {
        padding-left: 5%;
        padding-right: 5%;
    }
}

.featured-instructor-section {
    background-color: var(--white);
    border-radius: 12px;
    padding: 3rem 2.5rem;
    margin: 2rem auto;
    max-width: 1000px;
    box-shadow: 0 4px 12px rgba(26, 123, 192, 0.08);
}

.caligolf-logo {
    max-width: 280px;
    height: auto;
    margin-bottom: 1.5rem;
}

.featured-instructor-card {
    padding: 1rem;
}

.featured-instructor-photo {
    width: 180px;
    height: 180px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid var(--blue);
    margin-bottom: 1rem;
}

.featured-instructor-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--blue);
    margin: 0;
}

.featured-instructor-title {
    color: var(--darkgrey);
    font-style: italic;
    margin: .25rem 0 .75rem 0;
    font-size: .95rem;
}

.featured-instructor-credential {
    display: inline-block;
    background-color: var(--green);
    color: var(--white);
    padding: .35rem 1rem;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Mobile: stack the columns */
@media screen and (max-width: 768px) {
    .featured-instructor-section {
        padding: 2rem 1.5rem;
    }

    .caligolf-logo {
        max-width: 220px;
    }

    .featured-instructor-photo {
        width: 140px;
        height: 140px;
    }
}

.instructor-card {
    background-color: var(--white);
    border-radius: 8px;
    padding: 1.75rem 1.25rem;
    text-align: center;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 12px rgba(26, 123, 192, 0.08);
    transition: transform .3s ease, box-shadow .3s ease;
    height: calc(100% - 1.5rem);
}

.instructor-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(26, 123, 192, 0.15);
}

.instructor-photo {
    width: 140px;
    height: 140px;
    margin: 0 auto 1.25rem;
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--lightestgrey);
    border: 3px solid var(--blue);
}

.instructor-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.instructor-card h3 {
    color: var(--blue);
    font-size: 1.4rem;
    margin: 0 0 .25rem 0;
}

.instructor-card .instructor-credential {
    color: var(--darkgrey);
    font-family: 'Inter', sans-serif;
    font-size: .9rem;
    font-style: italic;
    margin: 0 0 1rem 0;
}

.instructor-card .instructor-contact {
    margin: 0;
    font-family: 'Inter', sans-serif;
    font-size: .95rem;
    line-height: 1.8;
}

.instructor-card .instructor-contact a {
    color: var(--blue);
    font-weight: 600;
}

.instructor-card .instructor-contact a:hover {
    color: var(--darkblue);
    text-decoration: underline;
}

/*------------------------------------------------*/
/* PAGE: EVENTS */
/*------------------------------------------------*/

.Id4068 #MainContent {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.Id4068 #TopContent {
    padding-top: 3rem;
    background-color: var(--darkblue);
}

.Id4068 #ThreeColumnOne {
    padding-bottom: 3rem;
    background-color: var(--darkblue);
}

.Id4068 #TopContent p,
.Id4068 #TopContent li,
.Id4068 #TopContent h1,
.Id4068 #TopContent h2,
.Id4068 #TopContent h3,
.Id4068 #TopContent h4,
.Id4068 #TopContent h5,
.Id4068 #TopContent h6,
.Id4068 #ThreeColumnOne p,
.Id4068 #ThreeColumnOne li,
.Id4068 #ThreeColumnOne h1,
.Id4068 #ThreeColumnOne h2,
.Id4068 #ThreeColumnOne h3,
.Id4068 #ThreeColumnOne h4,
.Id4068 #ThreeColumnOne h5,
.Id4068 #ThreeColumnOne h6 {
    color: var(--white) !important;
}

.Id4068 #TwoColumnOne {
    padding-top: 3rem;
    padding-bottom: 3rem;
    background-color: var(--white);
}

.Id4068 #FullNarrowOne {
    padding-top: 3rem;
    padding-bottom: 3rem;
    background-color: var(--lightestgrey);
}

.Id4068 #FullNarrowThree {
    padding-top: 4rem;
    padding-bottom: 3rem;
}

@media screen and (min-width: 996px) {
    .Id4068 #MainContent .mainContentRow {
        padding-left: 5%;
        padding-right: 5%;
    }
}

/*------------------------------------------------*/
/* PAGE: ABOUT */
/*------------------------------------------------*/

.Id4069 #MainContent {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}


.Id4069 #TopContentNarrow {
    padding-top: 3rem;
    padding-bottom: 3rem;
    text-align: center;
}

.Id4069 #TopContent {
    padding-top: 3rem;
    padding-bottom: 3rem;
    background-color: var(--darkblue);
}

.Id4069 #TopContent p,
.Id4069 #TopContent li,
.Id4069 #TopContent h1,
.Id4069 #TopContent h2,
.Id4069 #TopContent h3,
.Id4069 #TopContent h4,
.Id4069 #TopContent h5,
.Id4069 #TopContent h6 {
    color: var(--white) !important;
}

@media screen and (min-width: 996px) {
    .Id4069 #MainContent .mainContentRow {
        padding-left: 5%;
        padding-right: 5%;
    }
}

/*------------------------------------------------*/
/* PAGE: CONTACT */
/*------------------------------------------------*/

.Id4070 #MainContent {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.Id4070 #MainContent .bi {
    color: var(--darkblue);
}

.Id4070 #TwoColumnOne {
    padding-top: 3rem;
    padding-bottom: 3rem;
    align-items: center;
}

@media screen and (min-width: 996px) {
    .Id4070 #MainContent .mainContentRow {
        padding-left: 5%;
        padding-right: 5%;
    }
}

/*------------------------------------------------*/
/* FOOTER */
/*------------------------------------------------*/

footer {
    background-color: var(--black);
    color: var(--white);
    padding-top: 3rem;
    padding-bottom: 3rem;
}

footer p,
footer li,
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6 {
    color: var(--white);
}

footer p {
    font-size: .9rem;
}

footer .section-heading {
    color: var(--green);
}

footer a:hover {
    text-decoration: none;
    color: var(--white);
}

footer a:visited {
    color: var(--green);
}

footer a:visited:hover {
    text-decoration: none;
    color: var(--white);
}

footer .footer-nav {
    color: var(--white);
    text-decoration: none;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

footer .footer-nav:hover {
    text-decoration: none;
    color: var(--green);
}

footer .footer-nav:visited {
    color: var(--white);
}

footer .footer-nav:visited:hover {
    text-decoration: none;
    color: var(--green);
}

footer .bi {
    font-size: 2rem;
}

/*------------------------------------------------*/
/* MEDIA QUERIES */
/*------------------------------------------------*/

@media screen and (min-width: 996px) {
    .dropdown-menu {
        border-radius: 0;
    }

    .hero-text h1,
    .video-overlay h1 {
        font-size: 4.5rem;
    }

    #MainContent {
        padding-right: 5% !important;
        padding-left: 5% !important;
    }

    /* home hero - wider container for big headlines */
    .PageType_Home .hero-text {
        max-width: 1200px;
    }
}

@media screen and (max-width: 997px) {

    #dnn_dnnLOGO_imgLogo {
        max-height: 35px;
        margin-left: 0;
        margin-right: 5px;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .nav-minimize #dnn_dnnLOGO_imgLogo {
        max-height: 35px;
    }

    .navbar-toggler {
        margin: 10px;
    }

    .nav-item {
        margin: 0;
        text-align: center;
    }

    .header-logo {
        max-width: 150px;
    }

    .jumbo {
        font-size: 3rem;
    }

    .large {
        font-size: 2rem;
    }

    .PageType_Home .hero-bg,
    .PageType_Normal .hero-bg {
        height: auto;
        min-height: 480px;
    }

    #dnn_HeroText {
        padding-left: .25rem;
        padding-right: .25rem;
    }

    .PageType_Home .hero-bg h3 {
        font-size: 1.25rem;
    }

    #MembershipTab {
        max-width: 100%;
        border-radius: 0;
    }
}

@media screen and (max-width: 768px) {

    .hero-text h1,
    .video-overlay h1 {
        font-size: 2.5rem;
    }

    #MembershipTab .nav-link {
        font-size: .9rem;
    }

    #MonthlyPaneFull p,
    #SixMonthPaneFull p,
    #AnnualPaneFull p {
        padding: 1rem .5rem;
        font-size: 1rem;
    }

    .faq-section::before,
    .faq-section::after {
        top: 0rem !important;
        width: 50px !important;
        height: 50px;
    }

    .faq-section::before,
    .faq-section::after {
        left: 0 !important;
    }
}

/*================================================*/
/* SCROLL-REVEAL ANIMATIONS                       */
/* Elements with .scroll-reveal fade/slide in     */
/* when scrolled into view. Driven by custom.js   */
/* (IntersectionObserver). Use stagger classes    */
/* (.reveal-delay-1/2/3) for sequential reveals.  */
/*================================================*/

.scroll-reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity .9s cubic-bezier(.2, .7, .3, 1), transform .9s cubic-bezier(.2, .7, .3, 1);
    will-change: opacity, transform;
}

.scroll-reveal.in-view {
    opacity: 1;
    transform: translateY(0);
}

.reveal-delay-1 {
    transition-delay: .15s;
}

.reveal-delay-2 {
    transition-delay: .35s;
}

.reveal-delay-3 {
    transition-delay: .55s;
}

.reveal-delay-4 {
    transition-delay: .75s;
}

/* Optional fade-from-side variants */
.scroll-reveal.from-left {
    transform: translateX(-40px);
}

.scroll-reveal.from-right {
    transform: translateX(40px);
}

.scroll-reveal.from-left.in-view,
.scroll-reveal.from-right.in-view {
    transform: translateX(0);
}

@media (prefers-reduced-motion: reduce) {
    .scroll-reveal,
    .scroll-reveal.from-left,
    .scroll-reveal.from-right {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/*================================================*/
/* Bordered rounded image cards arranged in a     */
/* zig-zag with an animated dotted SVG path       */
/* connecting them.                               */
/*================================================*/

.steps-section {
    position: relative;
    padding: 2rem 1rem 0;
    background-color: var(--white);
    overflow: hidden;
}

.steps-section .section-heading {
    text-align: center;
    margin-bottom: 5rem;
}

/* Container is now a vertical stack, not a grid */
.steps-grid {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    z-index: 2;
}

.step-card {
    position: relative;
    width: 38%; /* card occupies just over a third of the width */
    margin-bottom: 2rem;
    text-align: center;
    z-index: 2;
}

.step-card:last-child {
    margin-bottom: 0;
}

/* Zig-zag horizontal positioning: left, right, left */
.step-card:nth-of-type(1) {
    margin-left: 4%;
    margin-right: auto;
}

.step-card:nth-of-type(2) {
    margin-left: auto;
    margin-right: 4%;
}

.step-card:nth-of-type(3) {
    margin-left: 4%;
    margin-right: auto;
}

.step-card .step-image {
    border: 4px solid var(--darkgreen);
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    box-shadow: 0 6px 18px rgba(26, 123, 192, 0.15);
    margin-bottom: 1.25rem;
}

.step-card .step-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.step-card h3 {
    font-size: 1.75rem;
    margin-bottom: .5rem;
}

.step-card h3 .accent {
    color: var(--green);
}

.step-card p {
    font-family: 'Inter', sans-serif;
    font-size: 1.05rem;
    color: var(--darkgrey);
    margin-top: 0;
}

/* Dotted SVG path overlay - long S-curve flowing down the page */
.steps-dot-path {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

.steps-dot-path image {
    opacity: 0;
    transition: opacity .05s ease;
}

.steps-dot-path image.lit {
    opacity: 1;
}

@media screen and (max-width: 996px) {
    .step-card {
        width: 80%;
        margin-bottom: 3rem;
    }

    .step-card:nth-child(1),
    .step-card:nth-child(2),
    .step-card:nth-child(3),
    .step-card:nth-of-type(3) {
        margin-left: auto;
        margin-right: auto;
    }

    .steps-dot-path {
        display: none; /* hide curve on stacked mobile layout */
    }
}

/*================================================*/
/* FEATURE CARDS - "Why golfers love CGC" 3-up    */
/*================================================*/

.feature-card {
    text-align: center;
    padding: 1rem;
}

.feature-card .feature-image {
    border-radius: 16px;
    margin-bottom: 1.25rem;
    max-width: 400px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}

.feature-card h3 {
    font-size: 1rem;
    margin-bottom: .5rem;
}

.feature-card h3 .accent {
    color: var(--green);
}

.feature-card p {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    color: var(--darkgrey);
    margin-top: 0;
}

/*================================================*/
/* REVIEWS / TESTIMONIALS - portrait left layout  */
/*================================================*/

.reviews-grid {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    max-width: 850px;
    margin: 0 auto;
    padding: 3rem 1rem 3rem 4rem; /* extra left padding so portraits don't overflow */
}

.review-card {
    display: flex;
    align-items: center;
    gap: 2rem;
    background-color: rgba(255, 255, 255, 0.06);
    border-radius: 12px;
    padding: 2rem 2.5rem 2rem 130px; /* extra left padding clears the overlapping portrait */
    position: relative;
    border: 2px solid var(--lightestgrey);
}

.review-portrait {
    position: absolute;
    left: -85px; /* sticks out past the card's left edge */
    top: 50%;
    transform: translateY(-50%) rotate(-2deg);
    width: 170px;
    height: 170px;
    border-radius: 50%;
    /* Golf ball appearance */
    background-color: #ffffff;
    background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.18) 1.5px, transparent 2.5px), radial-gradient(circle at center, rgba(0, 0, 0, 0.18) 1.5px, transparent 2.5px), radial-gradient(circle at 30% 30%, #ffffff 0%, #e6e6e6 70%, #bfbfbf 100%);
    background-size: 13px 13px, 13px 13px, 100% 100%;
    background-position: 0 0, 6.5px 6.5px, 0 0;
    padding: 10px;
    box-sizing: border-box;
    box-shadow: inset -3px -5px 10px rgba(0, 0, 0, 0.12), 0 6px 14px rgba(0, 0, 0, 0.25);
}

.review-portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%;
}

.review-body {
    flex: 1;
    text-align: left;
}

.review-stars {
    margin-bottom: 1rem;
}

.review-stars .bi {
    color: var(--green);
    font-size: 1rem;
    margin-right: .15rem;
}

.review-quote {
    color: var(--white);
    font-family: 'Inter', sans-serif;
    font-size: 1.1rem;
    line-height: 1.6;
    margin: 0 0 1rem 0;
}

.review-attribution {
    color: var(--whites);
    font-family: 'Inter', sans-serif;
    font-size: .9rem;
}

.review-name {
    color: var(--white);
    font-weight: 700;
    font-size: 1rem;
    display: block;
    margin-bottom: .15rem;
}

/* Mobile: stack portrait above text like the original layout */
@media screen and (max-width: 996px) {
    .reviews-grid {
        padding: 3rem 1rem;
        gap: 5rem;
    }

    .review-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 5rem 1.5rem 2rem;
        margin-top: 3rem;
    }

    .review-portrait {
        left: 50%;
        top: -60px;
        transform: translateX(-50%) rotate(-2deg);
    }

    .review-body {
        text-align: center;
    }
}

/*================================================*/
/* INFINITE SCROLL MARQUEE                        */
/* For the ticker of repeating graphics. The      */
/* track is duplicated so the loop seams cleanly. */
/*================================================*/

.marquee-section {
    background-color: var(--blue);
    border-bottom: 12px solid var(--green);
    padding: 2.5rem 0;
    overflow: hidden;
    width: 100%;
}

.marquee-track {
    display: flex;
    align-items: center;
    gap: 4rem;
    width: max-content;
    animation: marquee-scroll 30s linear infinite;
}

.marquee-section:hover .marquee-track {
    animation-play-state: paused;
}

.marquee-item {
    flex: 0 0 auto;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.marquee-item img,
.marquee-item svg {
    height: 100%;
    width: auto;
    display: block;
}

/* Alternating color treatment for repeating graphic */
.marquee-item:nth-child(even) {
    filter: brightness(0) saturate(100%) invert(78%) sepia(60%) saturate(550%) hue-rotate(60deg) brightness(95%); /* approximate green tint */
}

.marquee-item:nth-child(odd) {
    filter: brightness(0) invert(1); /* white */
}

@keyframes marquee-scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .marquee-track {
        animation: none;
    }
}

/*================================================*/
/* FAQ SECTION - punchy bg with side decorations  */
/*================================================*/

.faq-section {
    position: relative;
    overflow: hidden;
}

.faq-section .section-heading {
    text-align: center;
    margin-bottom: 3rem;
    color: var(--black);
    position: relative;
    z-index: 2;
}

/* Side decoration slots */
/*.faq-section::before,
.faq-section::after {
    content: '';
    position: absolute;
    top: 2rem;
    width: 110px;
    height: 150px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    z-index: 1;
    pointer-events: none;
}

.faq-section::before {
    left: 8rem;
    background-image: url('/portals/196/palm-tree.png');
    transform: rotate(-8deg);
}

.faq-section::after {
    right: 8rem;
    background-image: url('/portals/196/palm-tree.png');
    transform: rotate(8deg) scaleX(-1);
}*/

.faq-list {
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.faq-item {
    border-top: 1px solid var(--black);
    padding: 1.25rem 0;
}

.faq-list .faq-item:last-child {
    border-bottom: 1px solid var(--black);
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 1.15rem;
    color: var(--black);
    padding: .25rem 0;
}

.faq-question::after {
    content: '\F282'; /* bootstrap-icons chevron-down */
    font-family: 'bootstrap-icons';
    font-size: 1.1rem;
    transition: transform .3s ease;
}

.faq-question[aria-expanded="true"]::after {
    transform: rotate(180deg);
}

.faq-answer {
    color: var(--black);
    font-family: 'Inter', sans-serif;
    line-height: 1.6;
}

.faq-answer.show,
.faq-answer.collapsing {
    padding-top: 1rem;
}

.faq-footer {
    text-align: center;
    margin-top: 3rem;
    position: relative;
    z-index: 2;
}

@media screen and (max-width: 768px) {
    .faq-section::before,
    .faq-section::after {
        width: 80px;
        height: 110px;
        opacity: .35;
    }
}

/*================================================*/
/* LOCATION SHOWCASE    */
/*================================================*/

.locations-section {
    background-color: var(--darkblue);
    padding: 4rem 2rem;
    color: var(--white);
}

.locations-section .stat-block {
    text-align: left;
}

.locations-section .stat-block h2 {
    color: var(--white);
    font-size: 3rem;
    line-height: 1;
    margin-bottom: .5rem;
}

.locations-section .stat-block .accent {
    color: var(--green);
}

.locations-section .stars {
    color: var(--green);
    font-size: 1.5rem;
    letter-spacing: .35rem;
    margin-top: 1rem;
}

.locations-section .location-detail h3 {
    color: var(--green);
    font-size: 1.25rem;
    margin-bottom: 1rem;
}

.locations-section .location-detail p,
.locations-section .location-detail a {
    color: var(--white);
    font-family: 'Inter', sans-serif;
    margin: .25rem 0;
}

.locations-section .location-detail a:hover {
    color: var(--white);
}

.free-bucket-section li {
    list-style-type: none !important;
}

/*================================================*/
/* SECTION HEADING UTILITY                        */
/*================================================*/
.section-heading {
    font-family: 'DM Sans', sans-serif;
    font-size: 3rem;
    line-height: 1.05;
    text-transform: uppercase;
    margin-bottom: 2rem;
}

.section-heading .accent {
    color: var(--green);
}

@media screen and (max-width: 768px) {
    .section-heading {
        font-size: 2rem;
    }
}
