/*!
Theme Name: fvtheme
Theme URI: http://underscores.me/
Author: Codeink OÜ
Author URI: http://codeink.ee
Description: Description
Version: 1.0.3
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: fvtheme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

fvtheme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components 
	- Navigation 
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */


/* Montserrat Variable (Roman) */
@font-face {
  font-family: 'Montserrat';
  src: url('assets/fonts/Montserrat/Montserrat-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Montserrat Variable (Italic) */
@font-face {
  font-family: 'Montserrat';
  src: url('assets/fonts/Montserrat/Montserrat-Italic-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}


/* Anton Regular (static) */
@font-face {
  font-family: 'Anton';
  src: url('assets/fonts/Anton/Anton-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/* ——————————————————————————————
   Montserrat Variable (Roman + Italic)
   —————————————————————————————— */
@font-face {
  font-family: 'Montserrat';
  src: url('assets/fonts/Montserrat/Montserrat-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat';
  src: url('assets/fonts/Montserrat/Montserrat-Italic-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

/* ——————————————————————————————
    Font weight name ↔ numeric mapping, colors
   —————————————————————————————— */
:root {
  --fw-thin:          100;
  --fw-extralight:    200;
  --fw-light:         300;
  --fw-regular:       400;
  --fw-medium:        500;
  --fw-semibold:      600;
  --fw-bold:          700;
  --fw-extrabold:     800;
  --fw-black:         900;
  /* --site-color: #FCDA09; */
  --site-color:   #000;

  --font-size-h1-extra: 145px;
  --font-size-h1: 100px;
  --font-size-h2: 64px;
  --font-size-h3: 45px;
  --font-size-h4: 25px;
  --font-size-h5: 18px;
  --font-size-body: 16px;
  --font-size-btn: 16px;
  
}

@media (max-width: 768px) {
:root {
  --font-size-h1-extra: 90px;
  --font-size-h1: 53px;
  --font-size-h2: 35px;
  --font-size-h3: 45px;
  --font-size-h4: 25px;
  --font-size-h5: 18px;
  --font-size-body: 16px;
  --font-size-btn: 16px;
  
}}



@media (max-width: 420px) {
:root {
  --font-size-h1-extra: 75px;
  --font-size-h1: 43px;
  --font-size-h2: 30px;
  --font-size-h3: 40px;
  --font-size-h4: 22px;
  --font-size-body: 14px;
  --font-size-btn: 12px;
  
}}

/* ——————————————————————————————
   Optional utility classes
   —————————————————————————————— */
.font-thin      { font-weight: var(--fw-thin); }
.font-extralight{ font-weight: var(--fw-extralight); }
.font-light     { font-weight: var(--fw-light); }
.font-regular   { font-weight: var(--fw-regular); }
.font-medium    { font-weight: var(--fw-medium); }
.font-semibold  { font-weight: var(--fw-semibold); }
.font-bold      { font-weight: var(--fw-bold); }
.font-extrabold { font-weight: var(--fw-extrabold); }
.font-black     { font-weight: var(--fw-black); }


/* ——————————————————————————————
   Font-size utility classes
   —————————————————————————————— */
.text-h1    { font-size: var(--font-size-h1); }
.text-h2    { font-size: var(--font-size-h2); }
.text-h3    { font-size: var(--font-size-h3); }
.text-body  { font-size: var(--font-size-body); }


h3 {
  font-size: var(--font-size-h3);
  margin: 0px;
  padding: 0px;
}

h4 {
  font-size: var(--font-size-h4)
}

h5 {
  font-size: var(--font-size-5)
}
a {
    color: #000;
}


/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #000;
  	font-family: 'Montserrat', sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
background-color: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	/* margin: 0 0 1.5em 3em; */
  margin: 0;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
/* a {
	color: #4169e1;
} */

a:visited {
  color: inherit;
}

a:hover,
a:focus,
a:active {
	color: inherit;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */


/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}



/* hide-desktop: only hidden on screens ≥ 768px */
@media (min-width: 768px) {
  .hide-desktop {
    display: none !important;
    visibility: hidden !important;
  }
}

/* hide-mobile: only hidden on screens < 768px */
@media (max-width: 767px) {
  .hide-mobile {
    display: none !important;
    visibility: hidden !important;
  }
}











/* ==================================================
   1) GLOBAL HEADER LAYOUT
   ================================================== */


/* Invert logo only on shop + product category pages */
 .site-logo img {
  max-height: 60px;
  width: 100%;
  filter: invert(1);
}




.site-header {
  background: transparent;
  transition: background 0.3s ease;
  position: sticky;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  margin-bottom: -90px;
}
.site-header.scrolled {
  background: #000;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);

}

body.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 1250px) { body.admin-bar .nav-wrap { padding: 70px 1.5rem 1.5rem; } }

body.admin-bar .nav-toggle:checked + .burger { top: 110px; }

@media screen and (max-width: 782px) { body.admin-bar .nav-wrap { padding: 70px 1.5rem 1.5rem;  }
body.admin-bar .nav-toggle:checked + .burger { top: 110px; } }


.header-inner {
  max-width: 1420px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .7em 1em;
}




#weglot-switcher-1 .weglot_switcher.skewed .language-list {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: none;
    border-radius: 0px;
    background: var(--site-color)

}




#weglot-switcher-1.weglot-container {
  border-left: 1px solid black;
    transform: skewX(-15deg);
          z-index: 9;
}

@media screen and (max-width: 1250px) {
#weglot-switcher-1 {
  display: none;
  visibility: hidden;
}}



@media screen and (min-width: 1250px) {
#weglot-switcher-2 {
  display: none;
  visibility: hidden;
}}


#weglot-switcher-2 .underline{
    background-color: #000 !important;

}

/* ==================================================
   2) TOPBAR
   ================================================== */
.topbar {
  background: var(--site-color);
  width: 100%;
}
.topbar__inner {
  max-width: 1420px;
  margin: 0 auto;
  display: flex;
  justify-content: flex-end;
}
.topbar__button {
  display: block;
  transform: skewX(-15deg);
  border-left: 1px solid #1E1E1D;
  border-right: 1px solid #1E1E1D;
  padding: .5rem 1.5rem;
  width: 150px;
  text-align: center;
  text-decoration: none;
  color: #000;
}

@media screen and (min-width: 1250px) {
.topbar__button:last-child{
margin-right:10px;
}

.btn-content img {
  display: none;
  visibility: hidden;
}

.submenu-toggle {
  display: none;visibility: hidden;
}
}


.topbar__button span {
  display: block;
  color: #fff;
  transform: skewX(15deg);
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: var(--fw-semibold);
}
.topbar__button:hover,
.topbar__button.active {
  background: #1E1E1D;
  color: #fff;
}

/* ==================================================
   3) LOGO
   ================================================== */
.header-left .site-logo img {
  max-height: 60px;
width: 100%;
}

/* ==================================================
   4) SINGLE NAV + CTAS WRAPPER (desktop)
   ================================================== */
.nav-wrap {
  display: flex;
  align-items: center;
  gap: 1.5em;
}

.nav-title {
  display: none;
  visibility: hidden;
}

/* ==================================================
   5) PRIMARY MENU (desktop base)
   ================================================== */
.primary-menu {
  display: flex;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.primary-menu li {
  position: relative;
  margin: 0 1.3em;
  font-family: 'Montserrat', sans-serif;
  font-weight: var(--fw-semibold);
  font-size: 16px;
}
.primary-menu li a {
  color: #fff;
  text-decoration: none;
  padding: .5em 0;
  display: block;
}
@media (max-width: 1300px) {
.primary-menu li {
    margin: 0 1em;
}}
/* ==================================================
   6) DESKTOP SUB-MENU (ALL RULES YOU MUST NOT MISS)
   ================================================== */

/* arrow indicator */
.primary-menu li.menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-left: .3em;
  background: url(/wp-content/themes/fvtheme/assets/icons/down.svg) no-repeat center / contain;
  background-size: contain;
}

/* hide the submenu by default */
.primary-menu li.menu-item-has-children > .sub-menu {
  display: none;
  position: absolute;
  top: calc(100% + 0px);
  left: -35px;
  z-index: 999;
  /* no margin-top here — the “+15px” in top handles that gap */
}

/* reveal on hover/focus */
.primary-menu li.menu-item-has-children:hover > .sub-menu,
.primary-menu li.menu-item-has-children:focus-within > .sub-menu {
  display: block;
}

/* ------------------ Dropdown container sizing ------------------ */
.primary-menu .sub-menu {
  overflow: visible;
  width: max-content;   /* shrink-wrap to the longest <a> */
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ------------------ Parallelogram items ------------------ */
.primary-menu .sub-menu li {
  margin-top: 5px;      /* vertical gap */
}
.primary-menu .sub-menu li a {
  position: relative;
  display: block;       /* fill the container width */
  padding: 1em 2em 1em 1em;
  color: #000;
  white-space: nowrap;
}

/* draw the skewed background behind each <a> */
.primary-menu .sub-menu li a::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: #fff;
  transform-origin: top left;
  transform: skewX(-20deg);
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  z-index: -1;
}

/* ------------------ Uniform Offsets via transform ------------------ */
/* 1st item stays in place */
.primary-menu .sub-menu li:nth-child(1) a {
  transform: translateX(0);
}
/* 2nd item shifts left by 20px */
.primary-menu .sub-menu li:nth-child(2) a {
  transform: translateX(-20px);
}
/* 3rd item shifts left by 40px */
.primary-menu .sub-menu li:nth-child(3) a {
  transform: translateX(-40px);
}
/* 4th item shifts left by 60px */
.primary-menu .sub-menu li:nth-child(4) a {
  transform: translateX(-60px);
}
/* add more if needed */


/* hover & active states */
.primary-menu .sub-menu li a:hover::before,
.primary-menu .sub-menu li.current-menu-item > a::before {
  background: var(--site-color);
}
.primary-menu .sub-menu li.current-menu-item > a {
  color: #000;
}
.primary-menu li.current-menu-item > a {
  /* color: var(--site-color); */
}



/* staggered fade-in animation */
.primary-menu .sub-menu li {
  opacity: 0;
  transform: translateY(-10px);
}
@keyframes slideDown {
  to { opacity: 1; transform: translateY(0); }
}
.primary-menu li.menu-item-has-children:hover .sub-menu li,
.primary-menu li.menu-item-has-children:focus-within .sub-menu li {
  animation: slideDown .3s forwards;
}
.primary-menu li.menu-item-has-children:hover .sub-menu li:nth-child(1),
.primary-menu li.menu-item-has-children:focus-within .sub-menu li:nth-child(1) { animation-delay: .05s; }
.primary-menu li.menu-item-has-children:hover .sub-menu li:nth-child(2),
.primary-menu li.menu-item-has-children:focus-within .sub-menu li:nth-child(2) { animation-delay: .10s; }
.primary-menu li.menu-item-has-children:hover .sub-menu li:nth-child(3),
.primary-menu li.menu-item-has-children:focus-within .sub-menu li:nth-child(3) { animation-delay: .15s; }
.primary-menu li.menu-item-has-children:hover .sub-menu li:nth-child(4),
.primary-menu li.menu-item-has-children:focus-within .sub-menu li:nth-child(4) { animation-delay: .20s; }

/* ==================================================
   7) DESKTOP CTAs
   ================================================== */
.header-right {
  display: flex;
  gap: .5em;
}
.btn-tilt {
    display: inline-block;
    width: 190px;
    text-align: center;
    padding: .9em 1.2em;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: var(--fw-semibold);
    transform: skew(-19deg);
    transition: background .2s;
}
.btn-tilt > * { display: inline-block; transform: skew(10deg); }
.btn-white { background: #fff; color: #000; }
.btn-white:hover { background: #eee; }
.btn-dark { background: var(--site-color); color: #fff; }
.btn-dark:hover { background: var(--site-color); color: #fff; }

/* hide mobile controls until we hit the breakpoint */
.nav-toggle,
.burger {
  display: none;
}


/* ==================================================
   8) MOBILE STYLES (≤1250px)
   ================================================== */
@media (max-width: 1250px) {

.header-inner {
    height: 75px;
  }
  /* center topbar under 1250px */
  .topbar__inner {
    justify-content: center;
  }


  .header-left .site-logo img {
    max-height: 50px;
}


.topbar__button {
    transform: none;
    width: 100%;
}

.topbar__button span {
    font-family: 'Montserrat', sans-serif;
    font-style: normal;
    transform: none;
    font-weight: var(--fw-semibold);
}
  /* show the hamburger */
  .nav-toggle {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
    display: block;
  }
  .burger {
    display: flex;
    position: absolute;
    top: 75px; right: 1rem;
    transform: translateY(-50%);
    width: 30px; height: 22px;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    z-index: 1200;
       align-items: flex-end;
  }
.burger span {
  display: block;
  height: 2px;
  background: #fff;
  border-radius: 1px;
  transition: transform .3s ease, opacity .3s ease;
}

/* Line lengths */
.burger span:nth-child(1) { width: 100%; }
.burger span:nth-child(2) { width: 85%;  }
.burger span:nth-child(3) { width: 80%;  }




    .nav-toggle:checked + .burger {
        position: fixed;
        top: 75px;
  }

  .nav-title {
  display: block;
  margin-top: 3px;
  visibility: visible;
  font-family: "Anton";
  font-size: 51px;
  color: #fff;
  }
  /* center logo, pin it left */
  .header-inner {
    justify-content: center;
    position: relative;
  }
  .header-left {
    position: absolute;
    top: 50%; left: 1rem;
    transform: translateY(-50%);
    z-index: 1100;
  }

  /* off-canvas panel from right */
  .nav-wrap {
    position: fixed;
    align-items: flex-start;
    top: 0; right: 0;
    width: 75%; max-width: 340px;
    height: 100vh;
    background: var(--site-color);
    padding: 35px 1.5rem 1.5rem;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s ease;
    z-index: 1150;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }



  /* toggle panel & animate burger→X */
  .nav-toggle:checked + .burger span:nth-child(1) {
        transform: translateY(9px) rotate(45deg);
        height: 3px;
        width: 110%;
  }
  .nav-toggle:checked + .burger span:nth-child(2) {
    opacity: 0;
  }
  .nav-toggle:checked + .burger span:nth-child(3) {
        transform: translateY(-10px) rotate(-45deg);
        width: 110%;
        height: 3px;
  }
  .nav-toggle:checked ~ .header-inner .nav-wrap {
    transform: translateX(0);
  }

  /* stack mobile links */
  .nav-wrap .primary-menu {
    flex-direction: column;
    margin: 0; padding: 0;
  }
  .nav-wrap .primary-menu li {
    margin: .5em 0;
  border-bottom: 1px solid rgba(30, 30, 29, 0.2);
  }
  .nav-wrap .primary-menu li a {
    color: #fff;
    font-size: 1.1rem;
    padding: .6em 0;
  text-transform: uppercase;
  }

  .primary-menu li.menu-item-has-children > a::after {
    filter: invert(100%);
  }

  /* CTAs at bottom */
  .nav-wrap .header-right {
margin-bottom: auto;
    flex-direction: column;
    gap: .5em;
  }
  .nav-wrap .btn-tilt {
    width: 100%;
    transform: none;
  }

  /* accordion submenu (JS toggles .open) */
  .nav-wrap .menu-item-has-children > .sub-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
    display: flex;
    flex-direction: column;
  }

 .nav-wrap 



  .nav-wrap .menu-item-has-children.open > .sub-menu {
    max-height: 500px; /* adjust as needed */
  }
    /* 1) Full-width menu items */
  .nav-wrap .primary-menu {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
    flex-direction: column;
  }
  .nav-wrap .primary-menu li {
    width: 100% !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(30,30,29,0.2);
  }
  .nav-wrap .primary-menu li a {
    display: block !important;
    width: 100% !important;
    padding: .8em 1rem !important;
    box-sizing: border-box;
    text-transform: uppercase;
    color: #fff;
  }

  /* 2) Sub-menu accordion setup */
  .nav-wrap .menu-item-has-children > .sub-menu {
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
    display: flex !important;
    flex-direction: column;
  }
  .nav-wrap .menu-item-has-children.open > .sub-menu {
    max-height: 500px; /* enough for your links */
  }

  /* 3) Kill the desktop-only skew/parallelogram styling */
  .nav-wrap .sub-menu li a,
  .nav-wrap .sub-menu li a::before {
    transform: none !important;
    box-shadow: none !important;
  }
  .nav-wrap .sub-menu li a::before {
    display: none !important;
  }

  /* 4) Inject the real toggle button */
  .nav-wrap .menu-item-has-children > a::after {
    display: none !important;  /* hide old pseudo-arrow */
  }
  .nav-wrap .menu-item-has-children > a {
    position: relative;
    padding-right: 2.5rem;
  }
  .nav-wrap .menu-item-has-children .submenu-toggle {
                background: none;

    position: absolute;
    top: 25px; right: 1rem;
    width: 1.2rem; height: 1.2rem;
    background-image: url("/wp-content/themes/fvtheme/assets/icons/down.svg");
    background-repeat: no-repeat;
    background-position: center;
    border: none;
    filter: invert(100%);
    transform: translateY(-50%);
    transition: transform .2s;
    cursor: pointer;
  }
  .nav-wrap .menu-item-has-children.open .submenu-toggle {
    transform: translateY(-50%) rotate(180deg);
  }
  .primary-menu .sub-menu li {
    opacity: 1;
    transform: none;
}

.nav-wrap {
  /* keep vertical scrolling, but ban horizontal */
  overflow-y: auto;
  overflow-x: hidden;

  /* only allow vertical touch pans */
  touch-action: pan-y;

  /* prevent the OS “rubber-band” overscroll in the X-axis */
  overscroll-behavior-x: contain;
}
/* ------------------------------------------------------------------
   Mobile header-right buttons → corrected slanted arrow-box
   ------------------------------------------------------------------ */
.nav-wrap .header-right .btn-tilt {
  position: relative;      /* for overflow and stacking */
  overflow: visible;       /* let the arrow-box poke out */
  display: block;
  margin: 0.5em 0;
  transform: skew(-20deg);
  text-decoration: none;
}

/* un-skew the inner content and reserve room for the arrow-box */
.nav-wrap .header-right .btn-tilt .btn-content {
  position: relative;      /* anchor for our pseudo */
  display: flex;
  align-items: center;
  justify-content: space-between;
  transform: skew(20deg);  /* un-skew text+icon */
        padding: 10px 64px 10px 10px;
        font-size: 15px;
}

/* the slanted panel on the right */
.nav-wrap .header-right .btn-tilt .btn-content::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -1rem;            /* tuck under the slanted edge */
  width: 55px;            
  background: currentColor; /* overridden per button below */
  transform-origin: top right;
  transform: skewX(-20deg);
  z-index: 1;
}

/* arrow icon: centered & rotated inside the panel */
.nav-wrap .header-right .btn-tilt .btn-content img {
        position: absolute;
        top: 50%;
        right: 6px;
        width: 26px;
        height: 25px;

        transform: translateY(-50%) rotate(-45deg);
        z-index: 2;
        margin: 0;
}

/* WHITE button → black panel & white arrow */
.nav-wrap .header-right .btn-tilt.btn-white {
  background: #fff;
  color: #fff;             /* panel uses currentColor (white), then overridden */
}
.nav-wrap .header-right .btn-tilt.btn-white .btn-content {
  color: #000;             /* main text stays black */
}
.nav-wrap .header-right .btn-tilt.btn-white .btn-content::after {
  background: #000;         /* black panel */
}
.nav-wrap .header-right .btn-tilt.btn-dark  .btn-content img {
  filter: invert(1);        /* white arrow */
}

/* BLACK button → white panel & black arrow */
.nav-wrap .header-right .btn-tilt.btn-dark {
  background: #fff;
  color: #000;             /* panel uses currentColor (black), then overridden */
}
.nav-wrap .header-right .btn-tilt.btn-dark .btn-content {
  color: #000;             /* main text stays white */
}
.nav-wrap .header-right .btn-tilt.btn-dark .btn-content::after {
  background: #fff;         /* white panel */
}
.nav-wrap .header-right .btn-tilt.btn-dark .btn-content img {
  /* filter: none;            */
}



.btn-tilt {
  padding: 0.5em 1.2em;
}
  .header-left .site-logo img {
    display: block          !important;
    width: auto             !important;
    height: 50px            !important; /* or your desired max-height */
    min-width: 1px          !important;
    visibility: visible     !important;
  }

}



/* ==================================================
   9) EXTRA ADJUSTMENT: ≤990px
   ================================================== */
@media (max-width: 990px) {

}


/* ==================================================
   10) EXTRA ADJUSTMENT: ≤600px
   ================================================== */
@media (max-width: 600px) {

  .burger {top: 65px;}
  .nav-toggle:checked + .burger { top: 65px; }
  .nav-wrap {
    width: 85%;
    max-width: none;
    padding: 25px 1.5rem 1.5rem;
  }

.topbar__button {
    padding: 0.2rem 1.5rem;
}

}














/*--------------------------------------------------------------
# homepage banner area
--------------------------------------------------------------*/

/* make sure the slide is a positioning container */
.hero-slider .slide {
  position: relative;
  overflow: hidden;
}

/* put your content above any overlays */
.hero-slider .slide-inner {
  position: relative;
  z-index: 2;
}

/* when dark-filter is on, insert a black overlay behind the content */
.hero-slider .slide.dark-filter::after {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1;
  pointer-events: none; /* so clicks still hit your buttons */
}


/* ───── container & reset ───── */
.hero-slider {
  position: relative;
  overflow: hidden;
  height: 80vh;
  min-height: 500px;
}
.hero-slider .slide {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0; left: 0;
  background-size: cover;
  background-position: center;
}

/* ───── center‐boxed content ───── */
.slide-inner {
  position: relative;
    width: 90%;
  max-width: 1420px;
  height: 100%;
  margin: 0 auto;
  padding: 0 1em;             /* so content has breathing room */
}

/* reposition & cap width */
.slide-content {
  position: absolute;
  top: 50%; left: 0;
  transform: translateY(-50%);
  max-width: 730px;
  color: #fff;
}

/* ───── typography & buttons ───── */
.slide-title {
  font-size: var(--font-size-h1);
  font-weight: 800;
  margin: 0;
  line-height: normal;
  font-family: "Anton";
      text-transform: uppercase;
    letter-spacing: 2px;
        margin-bottom: -45px;
}





.slide-extra-title {
    font-size: var(--font-size-h1-extra);
    font-family: "Anton";
    color: var(--site-color);
    margin: 0;
    line-height: normal;
    padding: 0;
}


.slide-text {
  font-size: var(--font-size-body);
  margin-bottom: 1.5em;
  line-height: 1.5;
  font-weight: var(--fw-semibold);
}
.slide-buttons {
  display: flex;
  gap: 1em;
}
.btn-hero {
display: inline-flex
;
    align-items: center;
    padding: 7px 0px 7px 18px;
    background: #fff;
    color: #000;
    text-decoration: none;
    font-weight: 600;
    transform: skew(-19deg);
    transition: background .2s;
}

.btn-hero:visited {
  color: #000;
}
.btn-hero:hover { background: #eee; }
.btn-hero span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);

}
.btn-hero img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}
.btn-hero.site-color {
  background: var(--site-color);
}
.btn-hero.site-color:hover {
  background: #00A463;
}

/* ───── arrows ───── */
.slider-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
    background: #fff;
  border: none;
  width: 3em; height: 3em;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}
.slider-nav img { width: 1.5em;    filter: invert(1); }
.slider-nav.prev { left: 1em; }
.slider-nav.prev img { transform: rotate(180deg); }
.slider-nav.next { right: 1em; }

button.slider-nav {
        padding: 0.2em 0.2em 0.2em;
}

/* ───── dots ───── */
.slider-dots {
  position: absolute;
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: .5em;
}
.dot {
  width: 90px;
  height: 11px;
  border-radius: 10px;
  background: rgba(255,255,255,.5);
  border: none;
  pointer-events: none;
  cursor: default;
}

.dot.active {
  background: var(--site-color);
  opacity: 0.8;
}



/* ───── mobile tweaks ───── */
@media (max-width: 768px) {

  .slide-inner {
        width: 100%;
  }
  .hero-slider { cursor: grab; max-height:900px; }
  .slide-content {
        left: 82%;
        transform: translate(-85%, -50%);
        text-align: left;
        width: 90%;
  }
.slider-nav {
  display: none;
  visibility: hidden;
}

.dot {
    width: 55px;
    height: 12px;
    padding: 0px;
}
.slide-title {
    margin-bottom: -20px;/
}
.slide-text {
  margin-top: -5px;
}

.btn-hero img {
  display: inline-block;
  width: 55px;
  margin-left: 3px;
  margin-right: -2px;
}}


@media (max-width: 420px) {
.btn-hero {
      padding: 3px 0px 3px 9px;
}}




.small-title {
    font-size: var(--font-size-h2);
    margin-bottom: 15px;
}

@media (max-width: 768px) {
.small-title {
        margin-bottom: 20px;
}
}

/*--------------------------------------------------------------
# homepage events area
--------------------------------------------------------------*/
.events-section {
  background: #fff;
  color: #111;
  padding: 4rem 2rem;
}
.events-header {
 max-width: 1420px;
  margin: 0 auto 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.events-header h2 {
  font-size: var(  --font-size-h2);
  font-weight: 800;
  margin: 0;
}
.events-btn-all {
  display: inline-flex;
  align-items: center;
  transform: skew(-19deg);
  background: #111;
  color: #fff;
    padding: 7px 0px 7px 18px;
  text-decoration: none;
  transition: background .2s;
  margin-right: 20px;
}
.events-btn-all img {
    margin-left: 0.5em;
    width: 65px;
    padding: 0px;
    transform: skew(19deg);
}
.events-btn-all:hover {
  background: #333;
}

.events-btn-all span {
    transform: skew(19deg);
    font-size: var(--font-size-btn);
}
.events-btn-all:visited {
  color: #fff;
}

/* ─── Slider Container ───────────────────────────────────────────── */
.events-slider {
  position: relative;
  overflow: visible;              /* allow arrows outside */
  margin: 2rem auto;
  max-width: 1420px;
  cursor: grab;
  touch-action: pan-y;            /* allow vertical page scroll */
  overscroll-behavior-x: contain; /* contain horizontal bounce */
}

.events-slider.dragging {
  cursor: grabbing;
}
.events-slider-viewport {
  overflow: hidden;    /* mask only the cards */
    padding: 20px;
    margin: -20px;
  

}
.events-slider-inner {
  display: flex;
  /* gap: 30px;            */
  will-change: transform;
}
.events-slide {
  flex-shrink: 0;
  box-sizing: border-box;
}

/* ─── Card Styling ───────────────────────────────────────────────── */
.events-card {
  background: #fff;
  color: #111;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  /* border-radius: 6px; */
   margin-bottom: 10px;
  overflow: hidden;
}
.events-card-image {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    text-decoration: none;
}
.events-card-body {
    padding: 1rem;

  text-align: center;
}
.events-card-title {
    font-size: var(--font-size-h5);
    font-weight: var(--fw-bold);
    margin: 0;
    margin-bottom: 10px;
}
.events-card-title a {
  text-decoration: none;
}
.events-card-date {
  font-size: var(--font-size-h5);
    font-weight: var(--fw-medium);
  color: #000;
  margin: 0 0 1rem;
}
.events-card-btn {
    display: inline-flex
;
    align-items: center;
    transform: skew(-19deg);
    background: #111;
    color: #fff;
    padding: 7px 0px 7px 18px;
    text-decoration: none;
    transition: background .2s;
    
  }

.events-card-btn span {
    transform: skew(19deg);
    font-size: var(--font-size-btn);
}

.events-card-btn img {
    margin-left: 0.5em;
    width: 65px;
    padding: 0px;
    transform: skew(19deg);
}
.events-card-btn:visited{
  color: #fff;
}
.events-card-btn:hover {
  opacity: .8;
}
.events-card-btn-arrow {
  display: inline-block;
  margin-left: .5em;
  transform: skew(15deg);
}

/* ─── Navigation Arrows ──────────────────────────────────────────── */
.events-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #fff;
  border: none;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  border: 1px solid #000;
      padding: 0px;
}
.events-nav.prev {
  left: -65px;
}
.events-nav.next {
  right: -65px;
}
.events-nav img {
  width: 1.2em;
  filter: invert(1);
}
.events-nav.prev img {
  transform: rotate(180deg);
}

/* ─── “No dots” (hidden) ─────────────────────────────────────────── */
.events-dots {
  display: none;
  visibility: hidden;
}

/* ─── Responsive ─────────────────────────────────────────────────── */
@media (min-width: 1040px) {
 }




 @media (max-width: 1550px) {
.events-nav.next {
    right: 20px;
}
.events-nav.prev {
    left: 20px;
}

 }
@media (max-width: 1040px) {

.events-section {
    background: #fff;
    color: #111;
    padding: 4rem 0rem 4rem 1rem;
}

.events-slider-viewport {
    overflow: hidden;
    padding: 0px;
    margin: 0px;
    margin: -20px 0 -20px -20px;
    padding: 20px 0 20px 20px;
}
.events-slide {
      /* margin-right: -21px!important; */
}
}

@media (max-width: 768px) {
  .events-btn-all {
    text-emphasis: none;
  
  }
  .events-nav {
    width: 35px;
    height: 35px;
  }
  .events-header {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }
  .events-nav.next {
    right: 10px;
}
.events-nav.prev {
    left: -9px;
}
        .events-btn-all {
    display: flex;           /* make it a block so auto-margins work */
    width: max-content;       /* shrink-wrap to its own width */
    margin: 1rem auto;        /* center horizontally and give vertical breathing room */
    margin-top: 45px;
  
    }
}

@media (max-width: 420px) {
    .events-btn-all  {
        padding: 3px 0px 3px 9px;
    }
        .events-card-btn   {
        padding: 3px 0px 3px 9px;
    }

            .events-card-btn  img {
        display: inline-block;
        width: 55px;
        margin-left: 3px;
        margin-right: -2px;
    }

    .events-btn-all img {
              display: inline-block;
        width: 55px;
        margin-left: 3px;
        margin-right: -2px;
    }
}








/*--------------------------------------------------------------
# homepage team area
--------------------------------------------------------------*/


/* ─── Team Members Section & yellow-background ────────────────────── */
.team-members-section {
  position: relative;
  overflow: hidden;
  background: #111;
  color: #fff;
  padding: 4rem 2rem;
}

/* ─── Yellow SVG behind the 1420px container ───────────────────────────────── */
.team-members-section::before {
content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: calc((65vw - 1420px) / 2);
    width: 500px;
    background: url(https://fvpadel.ee/wp-content/themes/fvtheme/assets/icons/green-svg-element.svg) no-repeat center center;
    background-size: cover;
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
    transform-origin: center right;
    transform: scale(2);
}

/* @media (max-width: 1800px) {
  .team-members-section::before {
    width: 450px;
    transform: scale(1.8);
  }
}
@media (max-width: 1600px) {
  .team-members-section::before {
    width: 400px;
    transform: scale(1.6);
  }
}
@media (max-width: 1420px) {
  .team-members-section::before {
    right: 0;
    width: 35%;
    transform: scale(1.4);
  }
}
@media (max-width: 1024px) {
  .team-members-section::before {
    width: 50%;
    transform: scale(1.2);
    opacity: 0.3;
  }
}
@media (max-width: 768px) {
  .team-members-section::before {
    width: 70%;
    transform: scale(1);
    opacity: 0.25;
  }
}
@media (max-width: 480px) {
  .team-members-section::before {
    display: none;  
  }
} */

/* ─── Header ─────────────────────────────────────────────────────── */
.team-members-header {
  max-width: 1420px;
  margin: 0 auto 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.team-members-header h2 {
  font-size: var(--font-size-h2);
  font-weight: 800;
  margin: 0;
}

.team-members-btn-all:visited{
  color: #000;
}
.team-members-btn-all {
  display: inline-flex;
  align-items: center;
  transform: skew(-19deg);
  background: #fff;
  color: #111;
  padding: 7px 0 7px 18px;
  text-decoration: none;
  transition: background .2s;
}
.team-members-btn-all span {
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.team-members-btn-all img {
  transform: skew(19deg);
  margin-left: .5em;
  width: 65px;
}
.team-members-btn-all:hover {
  background: #eee;
  color: #000;
}

/* ─── Slider & Cards ─────────────────────────────────────────────── */
.team-slider {
  position: relative;
  max-width: 1420px;
  margin: 0 auto;
  cursor: grab;
}
.team-slider-viewport { overflow: hidden; }
.team-slider-inner {
  display: flex;
  /* gap: 30px; */
  will-change: transform;
}
.team-slide { flex-shrink: 0; /* width set by JS */ }

.team-card {

  border-radius: 6px;
  overflow: hidden;
  text-align: center;
}
.team-card-image {
    display: block;
    width: 100%;
    aspect-ratio: 2 / 3;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    user-select: none;
    touch-action: auto;
}
/* 1) let the slider‐viewport show overflow so the corners aren’t clipped */
.team-slider-viewport {
}

/* 2) full-width, centered trapezoid panel */
.team-card {
  position: relative;   /* so body can be absolute if you like */
  overflow: visible;    /* also allow the panel corners out */
}

.team-card-body {
    background: #fff;
    transform: skew(-19deg);
    margin: -3rem 0 1rem;
    width: 86%;
    margin-left: 22px;
    box-sizing: border-box;
    padding: 0.5rem 0.5rem;

    display: flex
;
    flex-direction: column;
    align-items: center;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);

}

/* 3) un-skew the text inside so it reads straight */
.team-card-body > * {
  transform: skew(19deg);
  text-align: center;
  margin: 0;
}

/* 4) name + underline + role */
.team-card-name {
  font-size: var(--font-size-h4);
  font-weight: var(--fw-bold);
  border-bottom: 3px solid var(--site-color);
  padding-bottom: .25rem;
  color: #111;
}
.team-card-role {
  font-size: var(--font-size-body);
  font-weight: var(--fw-medium);
  color: #111;
  margin-top: .5rem;
}

/* ─── Navigation Arrows ──────────────────────────────────────────── */
.team-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: #fff;
  border: none;
  width: 3em; height: 3em;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 10;
  padding: 0px;
  border: 1px solid black;
}
.team-nav.prev { left: -65px; }
.team-nav.next { right: -65px; }
.team-nav img {
  width: 1.2em;
  filter: invert(1);
}
.team-nav.prev img { transform: rotate(180deg); }

/* ─── Responsive Tweaks ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  .team-nav.prev { left: 20px; }
  .team-nav.next { right: 20px; }
}
@media (max-width: 768px) {
  .team-nav.prev { left: -20px; }
  .team-nav.next { right: -15px; }
  .team-members-header {
         flex-direction: column;
        gap: 1rem;
        text-align: center;
  }
      .team-members-btn-all {
        display: flex
;
        width: max-content;
        margin: 1rem auto;
        margin-top: 45px;
    }
.team-members-section::before {
  right: calc((282vw - 1420px) / 2);
    transform: scale(1.5);
}
.team-slider-viewport {
    overflow: visible;
}

.team-nav {
        width: 35px;
        height: 35px;
    }


}
@media (max-width: 420px) {
  .team-members-btn-all {
    padding: 3px 0 3px 9px;
  }
  .team-members-btn-all img {
    width: 55px;
    margin-left: 3px;
    margin-right: -2px;
  }
  
}




/*--------------------------------------------------------------
# homepage app promo area
--------------------------------------------------------------*/

/* ─── App Promotion Section ────────────────────────────────────── */
.app-promotion-section {
  position: relative;
  overflow: hidden;
  background-color: var(--site-color);
  padding: 4rem 2rem;
}
.app-promotion-section::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc((88vw - 1420px) / 2);
    width: 225px;
    background-color: #111;
    transform: skewX(-19deg);
    transform-origin: top left;
    z-index: 0;
}
.app-promo-inner {
  position: relative;
  z-index: 1;
  max-width: 1420px;
  margin: 0 auto;
  text-align: center;
}
.app-promo-title {
  font-size: var(--font-size-h2);
  font-weight: 800;
  margin-bottom: 1rem;
}
.app-promo-text {
  font-size: var(--font-size-body);
  max-width: 800px;
  margin: 0 auto 2rem;
  line-height: 1.5;
}
.app-promo-buttons {
  display: inline-flex;
  gap: 1rem;
}
.app-btn {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  padding: 0.5rem;
  border-radius: 6px;
  transition: opacity 0.2s;
}
.app-btn img {
  display: block;
  width: 140px;  /* match your SVG aspect ratio */
  height: auto;
}
.app-btn:hover {
  opacity: 0.8;
}
.app-btn-apple { /* Optional: you can override sizing here */ }
.app-btn-google { }

/* ─── Responsive ─────────────────────────────────────────────── */
@media (max-width: 768px) {
  .app-promo-text {
    padding: 0 1rem;
  }
  .app-promo-buttons {
    flex-direction: column;
  }
  .app-btn {
    width: 100%;
    justify-content: center;
  }
    .app-promotion-section::before {
        width: 100px;
        left: calc((92vw - 100%) / 2);
    }
}





/* ────────────────────────────────────────────────────────────────────────
   Homepage Services Section (scoped)
───────────────────────────────────────────────────────────────────────── */

/* 1) Grid / Slider Visibility Toggles */
.page-template-page-template-homepage .services-grid.hide-services-mobile   { display: none; }
.page-template-page-template-homepage .services-slider.hide-services-desktop { display: none; }

@media (min-width: 769px) {
  .page-template-page-template-homepage .services-grid.hide-services-mobile {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px 75px;
    align-items: start;
  }
  .page-template-page-template-homepage .services-slider.hide-services-desktop {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .page-template-page-template-homepage .services-grid.hide-services-mobile {
    display: none !important;
  }
  .page-template-page-template-homepage .services-slider.hide-services-desktop {
    display: block !important;
  }
  .page-template-page-template-homepage .services-intro {
    padding-bottom: 25px;
    text-align: center;
    margin-top: -20px;
  }
}

/* 2) Section & Container */
.page-template-page-template-homepage .services-section {
  background: #f5f5f5;
  padding: 4rem 2rem;
  overflow: hidden;
}
.page-template-page-template-homepage .services-inner {
  max-width: 1420px;
  margin: 0 auto;
}

/* 3) Intro Cell */
.page-template-page-template-homepage .services-intro {
  padding: 40px 20px;
}
.page-template-page-template-homepage .services-intro h2 {
  font-size: var(--font-size-h2);
  font-weight: 800;
  margin-bottom: 1rem;
}
.page-template-page-template-homepage .services-intro p {
  font-size: var(--font-size-body);
  line-height: 1.5;
  margin-bottom: 1.5rem;
}
.page-template-page-template-homepage .services-btn-all {
  display: inline-flex;
  align-items: center;
  padding: 12px 24px;
  background: #111;
  color: #fff;
  text-decoration: none;
  padding: 7px 0 7px 18px;
  transition: transform .2s, box-shadow .2s;
  transform: skew(-19deg);
}
.page-template-page-template-homepage .services-btn-all img {
  margin-left: 0.5em;
  width: 65px;
  padding: 0;
  transform: skew(19deg);
}
.page-template-page-template-homepage .services-btn-all span {
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.page-template-page-template-homepage .services-btn-all:visited {
  color: #fff;
}
.page-template-page-template-homepage .services-btn-all img {
  margin-left: 8px;
  display: block;
}

/* 4) Card Basics */
.page-template-page-template-homepage .services-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  position: relative;
  overflow: visible;
}
.page-template-page-template-homepage .services-card-image-link {
  display: block;
  width: 100%;
  aspect-ratio: 6 / 5;
  overflow: hidden;
  position: relative;
  z-index: 2;
}
.page-template-page-template-homepage .services-card-image {
  position: relative;
  z-index: 2;
}
.page-template-page-template-homepage .services-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  position: absolute;
  top: 0; left: 0;
  z-index: 2;
}
.page-template-page-template-homepage .services-card-body {
  background: #fff;
  padding: 20px;
  position: relative;
  z-index: 1;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  margin: 0;
}
.page-template-page-template-homepage .services-card-title {
  margin: 0 0 .5rem;
  font-size: var(--font-size-h4);
  font-weight: 700;
}
.page-template-page-template-homepage .services-card-text {
  font-size: var(--font-size-body);
  line-height: 1.5;
}

/* 5) Desktop-only tweaks */
@media (min-width: 769px) {
  .page-template-page-template-homepage .services-card-body {
    margin: -150px -30px 30px;
    width: calc(100% + 60px);
  }
  .page-template-page-template-homepage .services-card-image {
    position: relative;
    z-index: 2;
  }
  .page-template-page-template-homepage .services-card-title {
    margin-top: 149px;
  }
}

/* Arrow button on card */
.page-template-page-template-homepage .services-card-link {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 48px;
  height: 48px;
  background: var(--site-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  z-index: 3;
  box-shadow: 0 6px 12px rgba(0,0,0,0.1);
  rotate: -45deg;
}
.page-template-page-template-homepage .services-card-link img {
  content: url('https://fvpadel.ee/wp-content/themes/fvtheme/assets/icons/arrow-right.svg');
  width: 24px;
  height: auto;
  margin: 10px;
  filter: invert(1);
}

/* 6) Mobile GSAP Slider */
.page-template-page-template-homepage .services-slider {
  position: relative;
}
.page-template-page-template-homepage .services-slider-viewport {
  overflow: hidden;
}
.page-template-page-template-homepage .services-slider-inner {
  display: flex;
  will-change: transform;
}
.page-template-page-template-homepage .services-slide {
  flex: 0 0 auto;
  margin-right: 30px;
}
.page-template-page-template-homepage .services-slide:last-child {
  margin-right: 0;
}

/* Slider navigation arrows */
.page-template-page-template-homepage .services-nav {
  position: absolute;
  top: 105%;
  transform: translateY(-50%);
  width: 35px;
  height: 35px;
  border: none;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  display: flex;
  border: 1px solid black;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.page-template-page-template-homepage .services-nav.prev {
  left: -20px;
}
.page-template-page-template-homepage .services-nav.prev img {
  rotate: 180deg;
}
.page-template-page-template-homepage .services-nav.next {
  right: -20px;
}
.page-template-page-template-homepage .services-nav img {
  width: 1.2em;
  filter: invert(1);
}





/* ────────────────────────────────────────────────────────────────────────
   Homepage locations Section
───────────────────────────────────────────────────────────────────────── */

 .locations-section {
    padding: 0px 20px;
  background: #fff;
}
.locations-inner {
    max-width: 1420px;
    margin: 0 auto;
    display: grid
;
    grid-template-columns: 60% 35%;
    grid-gap: 40px;
    align-items: center;

}
.locations-title {
  font-size: var(--font-size-h2);
  margin-bottom: 1.5rem;
}
.locations-items {
  list-style: none;
  margin: 0;
  padding: 0;
}
.page-template-page-template-homepage .location-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid #eee;
}
.location-label {
  display: flex;
  align-items: center;
}
.location-icon {
  width: 24px;
  margin-right: 12px;
}
.location-name {
  font-weight: 700;
  font-size: 20px;
}
.location-buttons .btn-location {
  display: inline-flex;
  align-items: center;
  margin-left: 12px;
    padding: 7px 0px 7px 18px;
  font-size: .9rem;
  text-decoration: none;
  transition: background .2s;
  transform: skew(-19deg);
}

.location-buttons span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}


.location-buttons img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}

.locations-image img {
  width: 100%;
  display: block;
  border-radius: 8px;
}

.btn-yellow-locations:visited {
  color: #000;
}

.btn-yellow-locations {
  background: var(--site-color);
  color: #111;
}
.btn-yellow-locations:hover {
  background: #00A463;
}
.btn-dark-locations {
  background: #111;
  color: #fff;
}
.btn-dark-locations:hover {
  background: #333;
}
.btn-dark-locations:visited {
  color: #fff;
}
@media (max-width: 768px) {
  .locations-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .location-item {
    flex-direction: column;
  }
  .location-buttons {
    margin-top: 12px;
  }
  .location-buttons .btn-location {
    margin-bottom: 12px;
  }
  .locations-image img {
  display: none;visibility: hidden;
}
}












/* ────────────────────────────────────────────────────────────────────────
   Stats homepage Section
───────────────────────────────────────────────────────────────────────── */

/* ─── Stats Section ───────────────────────────────────── */
.stats-section {
  position: relative;
  overflow: hidden;
}

/* Hero image: full-width */
.stats-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* Yellow, skewed stats panel (parallelogram) */
.stats-panel {
    background: var(--site-color);
    transform: skew(-10deg);
    margin-top: -150px;
    padding: 70px 0;
    max-width: 1420px;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
        color: #fff;

    text-align: center;
}
/* Counter-skew & 4-column layout */
.stats-inner {
  max-width: 1420px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  transform: skew(10deg);        /* undo the skew for text */
}

/* Individual stat */
.stat-item {
  text-align: center;
}
.stat-number {
  font-size: var(--font-size-h2);
  font-weight: 700;
  margin: 0;
  font-family: "Anton";
}
.stat-label {
  font-size: var(--font-size-h5);
  margin-top: 8px;
  font-weight: 600;
}

/* ─── Mobile (<768px) ────────────────────────────────── */
@media (max-width: 768px) {
  .stats-panel {
    transform: none;
    margin-top: 0;
    padding: 30px 0;
  }
  .stats-inner {
    transform: none;
    display: flex;
    flex-direction: column;
    gap: 0px;
  }
  .stat-item {
    background: var(--site-color);
    padding: 2px 0;
  }
}










/* ─── Universal Slider Touch Settings ─────────────────────────────── */
.events-slider-viewport,
.team-slider-viewport,
.services-slider-viewport {
  overflow: hidden;
  touch-action: pan-y;            /* allow vertical page scroll */
  overscroll-behavior-x: contain; /* no horizontal rubber‑band */
}

.events-slider-inner,
.team-slider-inner,
.services-slider-inner {
  display: flex;
  will-change: transform;
  touch-action: pan-y;            /* allow vertical, JS will handle horizontal */
  user-select: none;
  -webkit-user-drag: none;
}

@media (max-width: 768px) {
  .team-slider-viewport {
    overflow: visible;
  }
.services-slider-viewport {
  overflow: visible;
}

}




/* ────────────────────────────────────────────────────────────────────────
   Homepage news section
───────────────────────────────────────────────────────────────────────── */


/* ─── News/Blog Section ───────────────────────────────────────── */
.page-template-page-template-homepage .news-section {
  background: #fff;
  padding: 4rem 2rem;
  color: #111;
}
.page-template-page-template-homepage .news-header {
  max-width: 1420px;
  margin: 0 auto 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.page-template-page-template-homepage .news-header h2 {
  font-size: var(--font-size-h2);
  font-weight: 800;
  margin: 0;
}
.page-template-page-template-homepage .news-btn-all {
  display: inline-flex;
  align-items: center;
  transform: skew(-19deg);
  background: #111;
  color: #fff;
  padding: 7px 0 7px 18px;
  text-decoration: none;
  transition: background .2s;
}

.page-template-page-template-homepage .news-btn-all:visited {
  color: #fff;
}
.page-template-page-template-homepage .news-btn-all span { transform: skew(19deg); font-size: var(--font-size-btn); }
.page-template-page-template-homepage .news-btn-all img  { transform: skew(19deg); margin-left:.5em; width:65px; }
.page-template-page-template-homepage .news-btn-all:hover { background:#333; }

/* hide helper */
@media (max-width: 769px) {
  .page-template-page-template-homepage .hide-mobile-news  { display: none!important; }
}

.page-template-page-template-homepage .hide-desktop-news { display: none!important; }

/* ─── Desktop grid ─────────────────────────────────────────── */
@media (min-width: 769px) {
  .page-template-page-template-homepage .news-grid.hide-mobile-news {
    display: flex!important;
    gap: 11px;
    max-width: 1420px;
    margin: 0 auto;
  }
  .page-template-page-template-homepage .news-slider.hide-desktop-news { display: none!important; }

  .page-template-page-template-homepage .news-item {
    background: #fff;
    /* box-shadow:0 4px 20px rgba(0,0,0,0.1); */
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .page-template-page-template-homepage .news-item-large { flex:0 0 55%; }
  .page-template-page-template-homepage .news-item-small { flex:0 0 22.5%; }
  .page-template-page-template-homepage .news-item-small .news-excerpt { display:none; }

  .page-template-page-template-homepage .news-image img { width:100%; height:auto; }
  .page-template-page-template-homepage .news-content {
    padding:1rem;
    display:flex;
    flex-direction:column;
    flex:1;
  }
  .page-template-page-template-homepage .news-title { margin:0 0 .5rem; font-size:var(--font-size-h4); text-decoration: none;}
  .page-template-page-template-homepage .news-excerpt { flex:1; margin-bottom:1rem; }
  .page-template-page-template-homepage .news-read-more {
    font-weight:600;
    color:#000;
    text-decoration:none;
    align-self:flex-start;
  }
  .page-template-page-template-homepage .news-title a {
    text-decoration:none;
  }
}

/* ─── Mobile slider ────────────────────────────────────────── */
@media (max-width:768px) {
  .page-template-page-template-homepage .news-grid.hide-mobile-news   { display:none!important; }
  .page-template-page-template-homepage .news-slider.hide-desktop-news{ display:block!important; }

  .page-template-page-template-homepage .news-header {
    flex-direction:column;
    gap:1rem;
    text-align:center;
  }
  .page-template-page-template-homepage .news-btn-all.hide-desktop-news {
    display: flex !important;
    width: max-content;
    margin: 45px auto 1rem !important;
    text-align: center;
    color: #fff;               /* center text/icon inside, if needed */
  }
  /* slider inner */
  .page-template-page-template-homepage .news-slider { position:relative; max-width: 100%; margin:0 auto; }
  .page-template-page-template-homepage .news-slider-viewport { overflow:hidden; }
  .page-template-page-template-homepage .news-slider-inner { display:flex; will-change:transform; }
  .page-template-page-template-homepage .news-slide {
    flex-shrink:0;
    text-align:center;
  }
  .page-template-page-template-homepage .news-title-mobile {
    font-size:var(--font-size-h4);
    margin:.5rem 0 0;
    text-decoration: none;
  }
  /* Remove underline on mobile news slide links and titles */
  .page-template-page-template-homepage .news-slide a,
  .page-template-page-template-homepage .news-slide a:hover,
  .page-template-page-template-homepage .news-slide a:active,
  .page-template-page-template-homepage .news-slide a:focus {
    text-decoration: none;
  }

  .page-template-page-template-homepage .news-title-mobile {
    text-decoration: none;
  }

  /* nav */
  .page-template-page-template-homepage .news-nav {
    position:absolute;
    /* top:50%; */
    bottom: -109px;
    transform:translateY(-50%);
    background:#fff;
    border:none;
    width:3em; height:3em;
    border-radius:50%;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:10;
  }
  .page-template-page-template-homepage .news-nav.prev { left:20px; }
  .page-template-page-template-homepage .news-nav.next { right:20px; }
  .page-template-page-template-homepage .news-nav img {
    width:1.2em;
    filter:invert(1);
  }
  .page-template-page-template-homepage .news-nav.prev img { transform:rotate(180deg); }
}

@media (min-width:769px) {
  /* give the small-item image container the same 16:9 ratio as the big one */
  .page-template-page-template-homepage .news-item-small .news-image {
    position: relative;
    width: 100%;
    /* match your large image’s aspect-ratio – here 16:9 */
    padding-top: 158.25%;
    overflow: hidden;
  }

  /* absolutely position the img, fill height, crop sides */
  .page-template-page-template-homepage .news-item-small .news-image img {
    position: absolute;
    top: 0; left: 50%;
    height: 100%;
    width: auto;
    transform: translateX(-50%);
    object-fit: cover;
  }
}
.page-template-page-template-homepage .news-nav.next {
  border: 1px solid #000;
  padding: 0px;
  width: 35px;
  height: 35px;
}
.page-template-page-template-homepage .news-nav.prev {
  border: 1px solid #000;
  padding: 0px;
  width: 35px;
  height: 35px;
}
.page-template-page-template-homepage .news-slide img {
  width: 100%;
}
.page-template-page-template-homepage .news-excerpt {
  flex: 1;
  margin-bottom: 0rem;
}



/* ────────────────────────────────────────────────────────────────────────
   Page template court booking
───────────────────────────────────────────────────────────────────────── */
.page-template-page-template-court-booking a.btn-header:visited {
    color: #000;
}
.page-template-page-template-court-booking .btn-header span {
    display: inline-block;
    transform: skew(19deg);
    font-size: var(--font-size-btn);
}
.page-template-page-template-court-booking .btn-header {
    display: inline-flex;
    align-items: center;
    padding: 7px 0px 7px 18px;
    background: var(--site-color);
    color: #000;
    text-decoration: none;
    font-weight: 600;
    transform: skew(-19deg);
    transition: background .2s;
    width: fit-content;
    margin-top: 25px;
}
.page-template-page-template-court-booking .btn-header img {
    display: inline-block;
    width: 65px;
    margin-left: .5em;
    transform: skew(19deg);
}

/* Court Booking Page */
.page-template-page-template-court-booking .court-booking .container {
  max-width: 1420px;
  margin: 0 auto;
  padding: 4rem 1rem;
}

/* Site‐wide wrapper */
.page-template-page-template-court-booking .site-main { max-width:1420px; margin:0 auto; position:relative; }

/* ─── Page Header inherited ────────────────────────────────────────── */
.page-template-page-template-court-booking .site-main{
    max-width: 1420px;
    position: relative;
    margin: auto;
}

.page-template-page-template-court-booking .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-court-booking .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-court-booking .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-court-booking .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-court-booking .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-court-booking .contact-left .contact-item a{
    color: #000;
}
.page-template-page-template-court-booking .page-subtitle {
  font-size: var( --font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-court-booking .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-court-booking .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-court-booking .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-court-booking .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-court-booking .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-court-booking .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-court-booking .page-subtitle {
    font-size: 1rem;
  }
}

/* =============================================================================
   PLAYTOMIC CTA
   Full‐width angled yellow/charcoal split, inner container max 1420px
   ============================================================================= */
.page-template-page-template-court-booking .playtomic-cta {
  position: relative;
  overflow: hidden;
  margin-top: 50px;
  background-color: var(--site-color);
}
.page-template-page-template-court-booking .playtomic-cta::before,
.page-template-page-template-court-booking .playtomic-cta::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 56vw;
  z-index: 0;
}
.page-template-page-template-court-booking .playtomic-cta::before {
  left: 0;
  background-color: var(--site-color);
  clip-path: polygon(0 0, 100% 0, calc(100% - 5vw) 100%, 0% 100%);
}
.page-template-page-template-court-booking .playtomic-cta::after {
  right: 0;
  background-color: #1a1a1a;
  clip-path: polygon(12vw 0, 100% 0, 100% 100%, 0% 100%);
}
.page-template-page-template-court-booking .playtomic-cta .container {
    position: relative;
    z-index: 1;
    max-width: 1420px;
    margin: 0 auto;
    padding: 7rem 1rem;
}
.page-template-page-template-court-booking .playtomic-cta__inner {
  display: flex;
  align-items: center;
  gap: 7rem;
}

/* Left column */
.page-template-page-template-court-booking .playtomic-cta__left {
  flex: 0 0 50%;
  color: #1a1a1a;
}
.page-template-page-template-court-booking .playtomic-cta__title {
  font-size: var(--font-size-h3);
  margin: 0 0 0.5rem;
}
.page-template-page-template-court-booking .playtomic-cta__subtitle {
  font-size: var(--font-size-h4);
  margin: 0 0 2rem;
}
.page-template-page-template-court-booking .playtomic-cta__apps {
  display: flex;
  gap: 1rem;
}
.page-template-page-template-court-booking .playtomic-cta__apps .app-link img {
  height: 3rem;
  display: block;
}

/* Right column */
.page-template-page-template-court-booking .playtomic-cta__right {
  flex: 0 0 50%;
  color: #fff;
}
.page-template-page-template-court-booking .playtomic-cta__label {
  font-size: var(--font-size-h3);
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.page-template-page-template-court-booking .playtomic-cta__locations {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
}
.page-template-page-template-court-booking .playtomic-cta__locations li {
  display: flex;
  align-items: center;
  font-size: var(--font-size-body);
  margin-bottom: 0.75rem;
}
.page-template-page-template-court-booking .playtomic-cta__locations li img {
  width: 1.25rem;
  margin-right: 0.75rem;
}
.page-template-page-template-court-booking .playtomic-cta__logo img {
  max-width: 20rem;
  display: block;
}

/* Responsive stack */
@media (max-width: 768px) {
  .page-template-page-template-court-booking .playtomic-cta__inner {
    flex-direction: column;
    text-align: center;
  }
  .page-template-page-template-court-booking .playtomic-cta__left,
  .page-template-page-template-court-booking .playtomic-cta__right {
    flex: 0 0 auto;
  }
  .page-template-page-template-court-booking .playtomic-cta__locations {
        text-align: center;
        justify-content: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
  }
  .page-template-page-template-court-booking .playtomic-cta__locations li {
    font-size: var(--font-size-h5);
  }
  .page-template-page-template-court-booking .playtomic-cta::after {
    display: none;
    visibility: hidden;
  }
  .page-template-page-template-court-booking .playtomic-cta__right {
    color: #000;
  }
  .page-template-page-template-court-booking .playtomic-cta__locations li img {
    filter: brightness(0) saturate(100%);
  }
  .page-template-page-template-court-booking .playtomic-cta__apps {
    display: flex;
    gap: 1rem;
    justify-content: center;
  }
  .page-template-page-template-court-booking .playtomic-cta__logo img {
    margin-left: auto;
    margin-right: auto;
    max-width: 12rem;
    display: block;
    filter: invert(1);
  }
  .page-template-page-template-court-booking .faq-col.left {
    color: #fff;
  }
  .page-template-page-template-court-booking .faq-container {
    gap: 5rem;
  }
}

/* ─── FAQ SECTION ───────────────────────────────────────────────────────── */

/* 1) Wrapper & full-bleed slanted halves */
.page-template-page-template-court-booking .faq-section {
  position: relative;
  overflow: hidden;
  margin: 0; padding: 0;
  margin-top: 50px;
}
.page-template-page-template-court-booking .faq-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.page-template-page-template-court-booking .faq-bg::before,
.page-template-page-template-court-booking .faq-bg::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 56vw;
  z-index: 0;
}
.page-template-page-template-court-booking .faq-bg::before {
  left: 0;
  background: var(--site-color); /* yellow */
  clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%);
}
.page-template-page-template-court-booking .faq-bg::after {
  right: 0;
  background: #222; /* dark */
  clip-path: polygon(19% 0, 100% 0, 100% 100%, 0% 100%);
}

/* 2) Container sits above slanted bg */
.page-template-page-template-court-booking .faq-container {
  position: relative;
  z-index: 1;
  display: flex;
  gap: 15rem;
  max-width: 1420px;
  margin: 0 auto;
  padding: 4rem 1rem;
}

/* 3) Two columns */
.page-template-page-template-court-booking .faq-col { flex: 0.5; }
.page-template-page-template-court-booking .faq-col.left  { color: #222; }
.page-template-page-template-court-booking .faq-col.right { color: #fff; }

/* 4) Section titles with underline */
.page-template-page-template-court-booking .faq-title {
  font-size: var(--font-size-h3);
  margin-bottom: 1rem;
  position: relative;
}
.page-template-page-template-court-booking .faq-title::after {
  content: "";
  display: block;
  width: 3rem;
  height: 4px;
  background: currentColor;
  margin-top: .5rem;
}

/* 5) FAQ list & spacing */
.page-template-page-template-court-booking .faq-list { list-style: none; margin: 0; padding: 0; }
.page-template-page-template-court-booking .faq-item + .faq-item { margin-top: 1.5rem; }

/* 6) Toggle button styling */
.page-template-page-template-court-booking .faq-toggle {
  width: 100%;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  font-size: var(--font-size-body);
  text-align: left;
  line-height: 1.4;
  position: relative;
  cursor: pointer;
  color: inherit;
  display: flex;
  align-items: center;
}
.page-template-page-template-court-booking .faq-number {
  flex-shrink: 0;
  margin-right: .75rem;
  font-weight: var(--fw-semibold);
}
.page-template-page-template-court-booking .faq-question { flex: 1; }

/* 7) Divider under question */
.page-template-page-template-court-booking .faq-toggle {
  border-bottom: 1px solid rgba(255,255,255,0.3);
  padding-bottom: .75rem;
  border-radius: 0px;
}
.page-template-page-template-court-booking .faq-col.left .faq-toggle {
  border-color: rgba(0,0,0,0.15);
}

/* 8) Plus icon */
.page-template-page-template-court-booking .plus {
  flex-shrink: 0;
  margin-left: .75rem;
  font-size: 1.25rem;
  transition: transform .2s;
}

/* 9) Answer panel */
.page-template-page-template-court-booking .faq-content {
  font-size: var(--font-size-body);
  line-height: 1.6;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

/* 10) Active state */
.page-template-page-template-court-booking .faq-item.active .faq-content {
  display: block;
  max-height: 1000px;
}
.page-template-page-template-court-booking .faq-item.active .plus {
  transform: rotate(45deg);
}

/* 11) Mobile: stack & remove clip-paths */
@media (max-width: 768px) {
  .page-template-page-template-court-booking .faq-container { flex-direction: column; }
  .page-template-page-template-court-booking .faq-bg::before,
  .page-template-page-template-court-booking .faq-bg::after {
    width: 100%;
    clip-path: none;
  }
}

/* When only one FAQ column is shown, center it and cap width at 800px */
.page-template-page-template-court-booking .fv-faq-container {
  position: relative;
  z-index: 1;
  background: #efefef;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  border-radius: 8px;
  padding: 2rem;
  max-width: 1000px;
  margin: 0 auto 4rem;
}
.page-template-page-template-court-booking .fv-faq-toggle {
  width: 100%;
  background: #fff;
  border: 0;
  padding: 1rem 1.25rem;
  font-size: var(--font-size-body);
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background .2s;
  font-weight:var(--fw-semibold);
}
.page-template-page-template-court-booking .fv-faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s ease;
  background: #fff;
  padding: 0 1.25rem;
}
.page-template-page-template-court-booking .fv-faq-item.active .fv-faq-content {
  max-height: 1000px;
}
.page-template-page-template-court-booking .fv-faq-item + .fv-faq-item {
    margin-top: 1rem;
}
.page-template-page-template-court-booking .faq-question {
    flex: 1;
    text-align: left;
}



/* ────────────────────────────────────────────────────────────────────────
   Page template about us
───────────────────────────────────────────────────────────────────────── */
.page-template-page-template-about-us .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

.page-template-page-template-about-us .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-about-us .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-about-us .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-about-us .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-about-us .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-about-us .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-about-us .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-about-us .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-about-us .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-about-us .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-about-us .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-about-us .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-about-us .page-subtitle {
    font-size: 1rem;
  }
}

/* —— About Us Section —— */
.page-template-page-template-about-us .about-us {
  background-color: #f2f2f2;
  padding: 4rem 1rem;
}
.page-template-page-template-about-us .about-container {
  max-width: 1420px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  gap: 2rem;
}

/* Image column with overlays */
.page-template-page-template-about-us .about-image {
  position: relative;
  flex: 1;
  overflow: hidden;
}
.page-template-page-template-about-us .about-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* Content column */
.page-template-page-template-about-us .about-content {
  flex: 1;
}
.page-template-page-template-about-us .about-content h2 {
  font-size: var(--font-size-h2);
  margin-bottom: 1rem;
}
.page-template-page-template-about-us .about-content p {
  font-size: var(--font-size-body);
  line-height: 1.6;
  margin-bottom: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
  .page-template-page-template-about-us .about-container {
    flex-direction: column;
  }
  .page-template-page-template-about-us .about-image::before,
  .page-template-page-template-about-us .about-image::after {
    display: none;
  }
}



/* ────────────────────────────────────────────────────────────────────────
   Page template trainings bookings
───────────────────────────────────────────────────────────────────────── */
.page-template-page-template-trainings-booking a.btn-header:visited {
    color: #000;
}
.page-template-page-template-trainings-booking .btn-header span {
    display: inline-block;
    transform: skew(19deg);
    font-size: var(--font-size-btn);
}
.page-template-page-template-trainings-booking .btn-header {
    display: inline-flex;
    align-items: center;
    padding: 7px 0px 7px 18px;
    background: var(--site-color);
    color: #000;
    text-decoration: none;
    font-weight: 600;
    transform: skew(-19deg);
    transition: background .2s;
    width: fit-content;
    margin-top: 0px;
}
.page-template-page-template-trainings-booking .btn-header img {
    display: inline-block;
    width: 65px;
    margin-left: .5em;
    transform: skew(19deg);
}

/* Court Booking Page */
.page-template-page-template-trainings-booking .court-booking .container {
  max-width: 1420px;
  margin: 0 auto;
  padding: 4rem 1rem;
}

/* Site‐wide wrapper */
.page-template-page-template-trainings-booking .site-main { max-width:1420px; margin:0 auto; position:relative; }
.page-template-page-template-trainings-booking .site-main{
    max-width: 1420px;
    position: relative;
    margin: auto;
}

/* ─── Page Header inherited ────────────────────────────────────────── */
.page-template-page-template-trainings-booking .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-trainings-booking .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-trainings-booking .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-trainings-booking .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-trainings-booking .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-trainings-booking .contact-left .contact-item a{
    color: #000;
}
.page-template-page-template-trainings-booking .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-trainings-booking .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-trainings-booking .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-trainings-booking .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-trainings-booking .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-trainings-booking .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-trainings-booking .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-trainings-booking .page-subtitle {
    font-size: 1rem;
  }
}

/* ─── Trainings Overview ────────────────────────────────────────── */
.page-template-page-template-trainings-booking .trainings-overview {
  position: relative;
  overflow: hidden;
  margin-top: 50px;
  background: #fff;
}
.page-template-page-template-trainings-booking .trainings-overview .container {
  max-width: 1420px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
}
.page-template-page-template-trainings-booking .overview-left,
.page-template-page-template-trainings-booking .overview-right {
  position: relative;
  z-index: 1;
}
.page-template-page-template-trainings-booking .overview-left {
  flex: 0 0 45%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4rem 1rem;
}
.page-template-page-template-trainings-booking .overview-left .image-wrap {
  width: 100%;
  padding-top: 150%;
  position: relative;
}
.page-template-page-template-trainings-booking .overview-left .image-wrap img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: contain;
  border-radius: .5rem;
}

/* slanted yellow background behind left image */
.page-template-page-template-trainings-booking .trainings-overview::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 0; right: 55%;
  background: var(--site-color);
  clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
  z-index: 0;
}

.page-template-page-template-trainings-booking .overview-right {
  flex: 0 0 55%%;
  padding: 4rem 2rem;
}
.page-template-page-template-trainings-booking .overview-right h2 {
  font-size: var(--font-size-h3);
  margin-top: 0;
}
.page-template-page-template-trainings-booking .overview-right p {
  margin-bottom: 1.5rem;
  line-height: 1.6;
}
.page-template-page-template-trainings-booking .overview-right hr {
  border: none;
  border-top: 1px solid #ddd;
  margin: 2rem 0;
}

/* MOBILE */
@media (max-width: 768px) {
  .page-template-page-template-trainings-booking .trainings-overview .container {
    flex-direction: column;
  }
  .page-template-page-template-trainings-booking .overview-left,
  .page-template-page-template-trainings-booking .overview-right {
    flex: 0 0 auto;
    width: 100%;
    padding: 2rem 1rem;
  }
  .page-template-page-template-trainings-booking .trainings-overview::before {
    display: none;
  }
  .page-template-page-template-trainings-booking .overview-left .image-wrap {
    padding-top: 60%;
  }
}



/* ────────────────────────────────────────────────────────────────────────
   Page template contact
───────────────────────────────────────────────────────────────────────── */
/* Site‐wide wrapper */
.page-template-page-template-contact .site-main { max-width:1420px; margin:0 auto; position:relative; }
.page-template-page-template-contact .site-main{
    max-width: 1420px;
    position: relative;
    margin: auto;
}

/* ─── Page Header inherited ────────────────────────────────────────── */
.page-template-page-template-contact .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-contact .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-contact .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-contact .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-contact .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-contact .contact-left .contact-item a{
    color: #000;
}
.page-template-page-template-contact .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-contact .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-contact .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-contact .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-contact .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-contact .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-contact .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-contact .page-subtitle {
    font-size: 1rem;
  }
}

/* ─── Contact Page Grid / Layout ─────────────────────────────────── */
.page-template-page-template-contact .contact-page .container {
  display: flex;
  max-width: 1420px;
  margin: 0 auto;
  padding: 4rem 1rem;
  position: relative;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  margin-top: 50px;
  margin-bottom: 50px;
}

/* Full-bleed yellow panel on the right, angled on the left */
.page-template-page-template-contact .contact-page .container::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 48%;
  background: var(--site-color);
  clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
  z-index: 0;
}

/* Ensure content sits above the yellow panel */
.page-template-page-template-contact .contact-left,
.page-template-page-template-contact .contact-right,
.page-template-page-template-contact .form-wrapper {
  position: relative;
  z-index: 1;
}

/* Left column */
.page-template-page-template-contact .contact-left {
  flex: 0 0 50%;
  padding-right: 2rem;
  padding-left: 3rem;
}
.page-template-page-template-contact .contact-left h2 {
  font-size: var(--font-size-h2);
  margin-bottom: 1rem;
  text-align: center;
}
.page-template-page-template-contact .contact-left p {
  font-size: var(--font-size-body);
  margin-bottom: 2rem;
  text-align: center;
}

/* Contact groups */
.page-template-page-template-contact .contact-groups {
  display: flex;
  gap: 2rem;
}
.page-template-page-template-contact .contact-groups .group {
  flex: 1;
}
.page-template-page-template-contact .contact-groups h3 {
  font-size: var(--font-size-h4);
  margin-bottom: 1rem;
}

/* Individual item */
.page-template-page-template-contact .group .contact-item {
  display: flex;
  align-items: center;
  margin-bottom: 1.5rem;
}
.page-template-page-template-contact .icon-wrap {
  flex-shrink: 0;
  width: 4rem;
  height: 3rem;
  background: var(--site-color);
  clip-path: polygon(15% 0, 100% 0, 85% 100%, 0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
}
.page-template-page-template-contact .icon-wrap img {
  width: 1.5rem;
  filter: brightness(0) saturate(100%);
}
.page-template-page-template-contact .contact-item .info {
  font-size: var(--font-size-body);
}

/* Right column (form) */
.page-template-page-template-contact .contact-right {
  flex: 0 0 50%;
  display: flex;
  justify-content: flex-end;
}
.page-template-page-template-contact .form-wrapper {
  width: 100%;
  max-width: 550px;
  background: #fff;
  padding: 2rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Contact Form 7 overrides */
.page-template-page-template-contact .form-wrapper .wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.page-template-page-template-contact .form-wrapper .wpcf7-form .wpcf7-form-control {
  width: 100%;
  padding: .75rem 1rem;
  background: #eee;
  border: none;
  font-size: var(--font-size-body);
}
.page-template-page-template-contact .form-wrapper .wpcf7-form textarea {
  min-height: 200px;
  resize: vertical;
}

/* Submit button – angled */
.page-template-page-template-contact .form-wrapper .wpcf7-submit {
  position: relative;
  align-self: flex-start;
  padding: .75rem 2rem .75rem 1.5rem;
  background: var(--site-color)!important;
  color: #000;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: background .2s, transform .2s;
}
.page-template-page-template-contact .form-wrapper .wpcf7-submit:hover {
  background: #ffd700;
  transform: translateY(-2px);
}
.page-template-page-template-contact .form-wrapper .wpcf7-submit::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1rem;
  width: 1rem; height: 1rem;
  background: url("<?php echo get_template_directory_uri(); ?>/assets/icons/dark-arrow.svg") no-repeat center/contain;
  transform: translateY(-50%);
  pointer-events: none;
}

/* Mobile stacking */
@media (max-width: 768px) {
  .page-template-page-template-contact .contact-page .container {
    flex-direction: column;
    padding: 2rem 1rem;
  }
  .page-template-page-template-contact .contact-left,
  .page-template-page-template-contact .contact-right {
    flex: 0 0 auto;
    width: 100%;
    padding: 0;
  }
  .page-template-page-template-contact .contact-groups {
    flex-direction: column;
  }
  .page-template-page-template-contact .form-wrapper {
    margin-top: 2rem;
    max-width: 100%;
  }
  .page-template-page-template-contact .contact-page .container::after {
    display: none;
  }
}

/*────────────────────────────────────────────────────
  Contact Form 7 — placeholder panels & skewed button
────────────────────────────────────────────────────*/

.page-template-page-template-contact .wpcf7-form .cf7-field {
  margin-bottom: 0px;
}

/* Inputs & Textarea */
.page-template-page-template-contact .wpcf7-form .cf7-input,
.page-template-page-template-contact .wpcf7-form .cf7-textarea {
  width: 100%;
  background: #E8E8E8;
  border: none;
  padding: 1rem;
  font-size: var(--font-size-body);
  font-style: italic;
  font-family: inherit;
  color: var(--color-dark);
  box-sizing: border-box;
  outline: none;
  transition: background 0.2s ease;
}

/* lighten on focus */
.page-template-page-template-contact .wpcf7-form .cf7-input:focus,
.page-template-page-template-contact .wpcf7-form .cf7-textarea:focus {
  background: #F0F0F0;
}

/* textarea height */
.page-template-page-template-contact .wpcf7-form-control.cf7-textarea,
.page-template-page-template-contact .wpcf7-textarea.cf7-textarea {
  height: 200px;
  min-height: 200px;
  box-sizing: border-box;
  resize: vertical;
}

/* Submit Button */
.page-template-page-template-contact .wpcf7-form .submit-wrap {
  margin-top: 2rem;
}
.page-template-page-template-contact .wpcf7-form .cf7-submit {
  display: inline-flex;
  align-items: center;
  padding: 0.75rem 2rem;
  background: #FFD700;
  color: #000;
  font-weight: var(--fw-semibold);
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
  position: relative;
}
.page-template-page-template-contact .wpcf7-form .cf7-submit span {
  display: inline-block;
}
.page-template-page-template-contact .wpcf7-form .cf7-submit::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1rem;
  width: 1rem; height: 1rem;
  background: url("<?php echo get_template_directory_uri(); ?>/assets/icons/dark-arrow.svg") no-repeat center/contain;
  pointer-events: none;
}
.page-template-page-template-contact .wpcf7-form .cf7-submit:hover {
  background: #FFEA00;
}

/* Hide default <br> */
.page-template-page-template-contact .wpcf7-form br {
  display:none;
  visibility: hidden;
}



/* ────────────────────────────────────────────────────────────────────────
   Page template normal
───────────────────────────────────────────────────────────────────────── */

.page-template-page-template-normal  h4 {

    margin: 10px 10px 10px;
    padding: 10px 10px 10px;
}
.page-template-page-template-normal .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

.page-template-page-template-normal .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-normal .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-normal .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-normal .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-normal .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-normal .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-normal .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-normal .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-normal .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-normal .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-normal .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-normal .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-normal .page-subtitle {
    font-size: 1rem;
  }
}



/* ────────────────────────────────────────────────────────────────────────
   Page template asukohad
───────────────────────────────────────────────────────────────────────── */


.page-template-page-template-asukohad .location-services-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-top: 20px;
}
.page-template-page-template-asukohad h4 {
    margin: 0px;
    padding: 0px;
 
    }
 .page-template-page-template-asukohad .location-service-box {
  flex: 1 1 100%;
}

@media (min-width: 768px) {
 .page-template-page-template-asukohad .location-service-box {
    flex: 1 1 45%;
  }
}


/* Container */
.page-template-page-template-asukohad .locations-archive .container {
  max-width: 1420px;
  margin: 0 auto;
  padding: 2rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* Each location block */
.page-template-page-template-asukohad .location-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 3rem 0;
  overflow: visible;
}

/* Full-bleed zebra stripe on even items */
.page-template-page-template-asukohad .location-item:nth-child(even)::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background-color: #f2f2f2;
  z-index: 0;
}

/* Ensure content sits above the stripe */
.page-template-page-template-asukohad .location-item > .location-info,
.page-template-page-template-asukohad .location-item > .location-map {
  position: relative;
  z-index: 1;
}

/* Left column: details */
.page-template-page-template-asukohad .location-info {
  flex: 0 0 45%;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.page-template-page-template-asukohad .location-info .location-title {
  font-size: var(--font-size-h3);
  margin: 0 0 1rem;
}
.page-template-page-template-asukohad .location-info .location-address,
.page-template-page-template-asukohad .location-info .location-phone,
.page-template-page-template-asukohad .location-info .location-email,
.page-template-page-template-asukohad .location-info .location-opening {
  display: flex;
  align-items: center;
  padding: 1rem 0;
  border-bottom: 1px solid #e5e5e5;
  font-size: var(--font-size-body);
  font-weight: var(--fw-semibold);
}
.page-template-page-template-asukohad .location-info .location-opening {
  border-bottom: none;
}
.page-template-page-template-asukohad .location-icon {
  flex-shrink: 0;
  width: 1.25rem;
  margin-right: 1rem;
}

/* “Vaata täpsemalt” button */
.page-template-page-template-asukohad .location-more {
  display: inline-flex;
  align-items: center;
  padding: 7px 0px 7px 18px;
  background: #fff;
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transform: skew(-19deg);
  transition: background .2s;
  position: relative;
}
.page-template-page-template-asukohad .location-more::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1rem;
  width: 1rem;
  height: 1rem;
  background: url("../assets/icons/dark-arrow.svg") no-repeat center/contain;
  transform: translateY(-50%);
  pointer-events: none;
}
.page-template-page-template-asukohad .location-more img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}

/* Right column: map */
.page-template-page-template-asukohad .location-map {
  flex: 0 0 55%;
  position: relative;
  height: 450px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
              rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
  overflow: hidden;
}
.page-template-page-template-asukohad .location-map iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}

/* Buttons */
.page-template-page-template-asukohad .btn-location {
  display: inline-flex;
  align-items: center;
  padding: 7px 0px 7px 18px;
  background: var(--site-color);
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transform: skew(-19deg);
  transition: background .2s;
  width: fit-content;
  margin-top: 25px;
}
.page-template-page-template-asukohad .btn-location img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}
.page-template-page-template-asukohad .btn-location span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}

/* Mobile */
@media (max-width: 768px) {
  .page-template-page-template-asukohad .location-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
  }
  .page-template-page-template-asukohad .location-info,
  .page-template-page-template-asukohad .location-map {
    flex: 0 0 auto;
    width: 100%;
  }
  .page-template-page-template-asukohad .location-map {
    height: 300px;
    clip-path: none;
    margin-top: 1rem;
  }
}

/* Shared layout/header bits */
.page-template-page-template-asukohad .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

.page-template-page-template-asukohad .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-asukohad .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-asukohad .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-asukohad .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-asukohad .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-asukohad .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-asukohad .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-asukohad .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-asukohad .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-asukohad .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks for header */
@media (max-width: 768px) {
  .page-template-page-template-asukohad .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-asukohad .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-asukohad .page-subtitle {
    font-size: 1rem;
  }
}







/* ────────────────────────────────────────────────────────────────────────
   Page template faq
───────────────────────────────────────────────────────────────────────── */

.page-template-page-template-faq a.btn-header:visited { color: #000; }
.page-template-page-template-faq .btn-header span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.page-template-page-template-faq .btn-header {
  display: inline-flex;
  align-items: center;
  padding: 7px 0px 7px 18px;
  background: var(--site-color);
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transform: skew(-19deg);
  transition: background .2s;
  width: fit-content;
  margin-top: 25px;
}
.page-template-page-template-faq .btn-header img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}

/* Court Booking Page (if reused here) */
.page-template-page-template-faq .court-booking .container {
  max-width: 1420px;
  margin: 0 auto;
  padding: 4rem 1rem;
}

/* Site‐wide wrapper */
.page-template-page-template-faq .site-main { max-width:1420px; margin:0 auto; position:relative; }
.page-template-page-template-faq .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

/* ─── Page Header ────────────────────────────────────────── */
.page-template-page-template-faq .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-faq .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-faq .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-faq .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-faq .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-faq .contact-left .contact-item a { color: #000; }
.page-template-page-template-faq .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-faq .page-cta { margin-top: 1.5rem; }
.page-template-page-template-faq .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-faq .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-faq .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-faq .page-header { padding: 4rem 1rem; }
  .page-template-page-template-faq .page-title { font-size: calc(var(--font-size-h1) * 0.8); }
  .page-template-page-template-faq .page-subtitle { font-size: 1rem; }
}

/* ─── FAQ Section ───────────────────────────────────────────── */
.page-template-page-template-faq .fv-faq-section { margin: 50px 0; }
.page-template-page-template-faq .fv-faq-container {
  background: #efefef;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  padding: 2rem;
  max-width: 1000px;
  margin: 0 auto;
}
.page-template-page-template-faq .fv-faq-col-title {
  font-size: var(--font-size-h4);
  margin-top: 2rem;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
}
.page-template-page-template-faq .fv-faq-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.page-template-page-template-faq .fv-faq-item + .fv-faq-item { margin-top: 1rem; }

/* Accordion tab */
.page-template-page-template-faq .fv-faq-toggle {
  width: 100%;
  background: #fff;
  border: 0px solid white;
  padding: 1rem 1.25rem;
  font: inherit;
  font-size: var(--font-size-body);
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.page-template-page-template-faq .fv-faq-toggle:hover {
  background: #fff;
  border-color: #ccc;
}
.page-template-page-template-faq .fv-faq-number {
  flex-shrink: 0;
  margin-right: 0.75rem;
  font-weight: var(--fw-semibold);
  color: #000;
}
.page-template-page-template-faq .fv-faq-question {
  flex: 1;
  font-weight: var(--fw-semibold);
  text-align: left;
}
.page-template-page-template-faq .fv-faq-icon {
  flex-shrink: 0;
  margin-left: 0.75rem;
  font-size: 1.25rem;
  transition: transform 0.3s ease;
  color: #000;
}

/* Accordion panel */
.page-template-page-template-faq .fv-faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
  background: #fff;
  padding: 0 1.25rem;
  font-size: var(--font-size-body);
  line-height: 1.6;
}
.page-template-page-template-faq .fv-faq-item.active .fv-faq-content {
  max-height: 500px;
}
.page-template-page-template-faq .fv-faq-item.active .fv-faq-icon {
  transform: rotate(45deg);
}

/* Responsive (FAQ container) */
@media (max-width: 768px) {
  .page-template-page-template-faq .fv-faq-container {
    padding: 1.5rem;
    margin: 0 1rem;
  }
}




/* ────────────────────────────────────────────────────────────────────────
   Page template teenused
───────────────────────────────────────────────────────────────────────── */

.page-template-page-template-teenused .teenused-archive .teenus-item:first-child {
  margin-top: 50px;
}

.page-template-page-template-teenused .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

.page-template-page-template-teenused .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-teenused .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-teenused .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-teenused .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-teenused .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-teenused .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 1420px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-teenused .page-cta {
  margin-top: 1.5rem;
}

.page-template-page-template-teenused .btn-teenus {
  display: inline-flex;
  align-items: center;
  padding: 7px 0px 7px 18px;
  background: var(--site-color);
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transform: skew(-19deg);
  transition: background .2s;
  width: fit-content;
  margin-top: 25px;
}
.page-template-page-template-teenused .btn-teenus span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.page-template-page-template-teenused .btn-teenus img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}

.page-template-page-template-teenused .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-teenused .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-teenused .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-teenused .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-teenused .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-teenused .page-subtitle {
    font-size: 1rem;
  }
}

/* ─── Teenused Archive Layout ────────────────────────────────────────── */
.page-template-page-template-teenused .teenused-archive .container {
  display: flex;
  flex-direction: column;
  gap: 80px;
}

/* Each card: two columns */
.page-template-page-template-teenused .teenused-archive .teenus-item {
  display: flex;
  align-items: center;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  border-radius: 8px;
  overflow: hidden;
}

/* Text panel (left) */
.page-template-page-template-teenused .teenused-archive .teenus-item__text {
  width: 50%;
  padding: 40px;
  clip-path: polygon(0 0, 100% 0, 90% 100%, 0 100%);
}
.page-template-page-template-teenused .teenused-archive .teenus-item__text p {
  margin-bottom: 24px;
}

/* Button */
.page-template-page-template-teenused .teenused-archive .teenus-item__button {
  display: inline-flex;
  align-items: center;
  padding: 12px 24px;
  background: #F8D53E;
  color: #000;
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.page-template-page-template-teenused .teenused-archive .teenus-item__button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(0,0,0,0.1);
}
.page-template-page-template-teenused .teenused-archive .teenus-item__button-arrow {
  display: inline-block;
  margin-left: 12px;
  width: 24px;
  height: 24px;
  background: #000;
  color: #fff;
  text-align: center;
  line-height: 24px;
  border-radius: 2px;
  font-size: 16px;
}

/* Image panel (right) */
.page-template-page-template-teenused .teenused-archive .teenus-item__image {
  width: 50%;
      max-height: 500px;
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
  overflow: hidden;
}
.page-template-page-template-teenused .teenused-archive .teenus-item__image img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Pagination */
.page-template-page-template-teenused .pagination {
  margin: 40px 0;
  text-align: center;
}

/* Mobile stack */
@media (max-width: 768px) {
  .page-template-page-template-teenused .teenused-archive .teenus-item {
    flex-direction: column;
  }
  .page-template-page-template-teenused .teenused-archive .teenus-item__text,
  .page-template-page-template-teenused .teenused-archive .teenus-item__image {
    width: 100%;
    clip-path: none;
  }
  .page-template-page-template-teenused .teenused-archive .teenus-item__text {
    margin-bottom: 20px;
  }
}



/* ────────────────────────────────────────────────────────────────────────
   Page template hinnakiri
───────────────────────────────────────────────────────────────────────── */
.page-template-page-template-hinnakiri a.btn-header:visited { color: #000; }
.page-template-page-template-hinnakiri .btn-header span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.page-template-page-template-hinnakiri .btn-header {
  display: inline-flex;
  align-items: center;
  padding: 7px 0px 7px 18px;
  background: var(--site-color);
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transform: skew(-19deg);
  transition: background .2s;
  width: fit-content;
  margin-top: 0px;
}
.page-template-page-template-hinnakiri .btn-header img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}

.page-template-page-template-hinnakiri .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

.page-template-page-template-hinnakiri .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-hinnakiri .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-hinnakiri .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-hinnakiri .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-hinnakiri .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-hinnakiri .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-hinnakiri .page-cta { margin-top: 1.5rem; }
.page-template-page-template-hinnakiri .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-hinnakiri .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-hinnakiri .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-hinnakiri .page-header { padding: 4rem 1rem; }
  .page-template-page-template-hinnakiri .page-title { font-size: calc(var(--font-size-h1) * 0.8); }
  .page-template-page-template-hinnakiri .page-subtitle { font-size: 1rem; }
}

/* Container */
.page-template-page-template-hinnakiri .price-list .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 4rem 1rem;
  box-sizing: border-box;
}
.page-template-page-template-hinnakiri #page > section.price-list > div > div.price-group-panel.active > div.price-panel.active > table > tbody > tr.header {
  height: 40px;
}

/* ─── Outer Tabs (Age Groups) ───────────────────────────────────────── */
.page-template-page-template-hinnakiri .price-groups ul {
  display: flex;
  gap: 1rem;
  margin-bottom: 3rem;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid #ddd;
}
.page-template-page-template-hinnakiri .price-groups a {
  display: block;
  padding: .75rem 1.5rem;
  font-size: var(--font-size-body);
  font-weight: 600;
  text-decoration: none;
  color: #fff;
  background: #222;
  clip-path: polygon(10% 0%,100% 0%,90% 100%,0% 100%);
  -webkit-clip-path: polygon(10% 0%,100% 0%,90% 100%,0% 100%);
  transition: background .2s;
}
.page-template-page-template-hinnakiri .price-groups li.active a {
  background: var(--site-color);
  color: #000;
}
.page-template-page-template-hinnakiri .price-groups a:hover {
  background: var(--site-color);
}

/* ─── Group Panels ───────────────────────────────────────────────────── */
.page-template-page-template-hinnakiri .price-group-panel { display: none; }
.page-template-page-template-hinnakiri .price-group-panel.active { display: block; }

/* ─── Inner Tabs (Tables) ────────────────────────────────────────────── */
.page-template-page-template-hinnakiri .price-tabs ul {
  display: flex;
  gap: 1rem;
  margin: 1rem 0 3em;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid #ddd;
}
.page-template-page-template-hinnakiri .price-tabs a {
  position: relative;
  font-size: var(--font-size-h4);
  font-weight: 600;
  text-decoration: none;
  color: #222;
  padding: .25rem 0;
  border-bottom: 4px solid transparent;
  transition: color .2s, border-color .2s;
}
.page-template-page-template-hinnakiri .price-tabs li.active a {
  border-bottom-color: var(--site-color);
}
.page-template-page-template-hinnakiri .price-tabs a:hover {
  border-bottom-color: var(--site-color);
}

/* ─── Panels & Table ───────────────────────────────────────────────── */
.page-template-page-template-hinnakiri .price-panel {
  display: none;
  animation: fadeIn .3s ease;
}
.page-template-page-template-hinnakiri .price-panel.active { display: block; }
.page-template-page-template-hinnakiri .price-panel table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
  border-radius: 8px;
  overflow: hidden;
}
.page-template-page-template-hinnakiri .price-panel tr.header th {
  background: var(--site-color);
  font-weight: 600;
}
.page-template-page-template-hinnakiri .price-panel tr.even td { background: #fafafa; }
.page-template-page-template-hinnakiri .price-panel tr.odd  td { background: #fff; }
.page-template-page-template-hinnakiri .table-title h4 {}

/* Extra Info bar */
.page-template-page-template-hinnakiri .price-extra {
  position: relative;
  z-index: 1;
  padding: 2rem 1rem;
  margin-bottom: 2rem;
}
.page-template-page-template-hinnakiri .price-extra::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  width: 100vw;
  height: 100%;
  transform: translateX(-50%);
  background: #E8E8E8;
  z-index: -1;
}
.page-template-page-template-hinnakiri .price-extra * {
  max-width: 1420px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Responsive Tweaks (price tables etc.) */
@media (max-width: 768px) {
  .page-template-page-template-hinnakiri .price-groups ul,
  .page-template-page-template-hinnakiri .price-tabs ul {
    flex-wrap: wrap;
  }
  .page-template-page-template-hinnakiri .price-groups a,
  .page-template-page-template-hinnakiri .price-tabs a {
    flex: 1 1 auto;
    text-align: center;
  }
  .page-template-page-template-hinnakiri .price-panel th,
  .page-template-page-template-hinnakiri .price-panel td {
    padding: .5rem;
    font-size: .9rem;
  }
  .page-template-page-template-hinnakiri .price-extra {
    padding: 1.5rem .75rem;
  }
}

/* Final table rules (duplicate, but kept for clarity) */
.page-template-page-template-hinnakiri .price-panel table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.page-template-page-template-hinnakiri .price-panel th,
.page-template-page-template-hinnakiri .price-panel td {
  padding: 6px;
  border-top: 1px solid #ddd;
  text-align: center;
  font-size: var(--font-size-body);
  word-wrap: break-word;
}

/* Keyframes (global scope is fine) */
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}


/* ────────────────────────────────────────────────────────────────────────
   Page template header
───────────────────────────────────────────────────────────────────────── */

.page-template-page-template-header .site-main{
  max-width: 1420px;
  position: relative;
  margin: auto;
}

.page-template-page-template-header .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 2rem 1rem;
  color: #fff;
  overflow: hidden;
}
.page-template-page-template-header .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  /* background-color: rgba(0, 0, 0, 0.5); */
  z-index: 0;
}
.page-template-page-template-header .page-header .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  margin: 0 auto;
}
.page-template-page-template-header .page-header .text-center {
  align-items: center;
  text-align: center;
}
.page-template-page-template-header .page-title {
  font-size: var(--font-size-h1);
  line-height: 1.1;
  margin: 0;
}
.page-template-page-template-header .page-subtitle {
  font-size: var(--font-size-bod);
  line-height: 1.5;
  font-weight: var(--fw-semibold);
  max-width: 850px;
  margin: 0;
  line-height: 30px;
}
.page-template-page-template-header .page-cta {
  margin-top: 1.5rem;
}
.page-template-page-template-header .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.page-template-page-template-header .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}
.page-template-page-template-header .page-newsletter {
  margin-top: 2rem;
  width: 100%;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .page-template-page-template-header .page-header {
    padding: 4rem 1rem;
  }
  .page-template-page-template-header .page-title {
    font-size: calc(var(--font-size-h1) * 0.8);
  }
  .page-template-page-template-header .page-subtitle {
    font-size: 1rem;
  }
}





/* ────────────────────────────────────────────────────────────────────────
   Page template single uudis
───────────────────────────────────────────────────────────────────────── */

.single-uudised .wp-block-button__link {
    text-align: center;
    padding: .9em 1.2em;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: var(--fw-medium);
    transform: skew(-19deg);
    border-radius: 0px;
}

.single-uudised a.wp-block-button__link {
  /* background-color: #000;
    color: #fff !important; */
}




/* Container */
.single-uudised .uudis-single {
  max-width: 800px;
  margin: 3rem auto;
  padding: 0 1rem;
  background: #fff;
}

.single-uudised .uudis-featured-image {
  margin-top: 120px;
}

/* Header override already present */
.single-uudised .site-header {
  background: #000;
}

/* Featured image */
.single-uudised .uudis-featured-image {
  margin-bottom: 2rem;
  overflow: hidden;
  border-radius: 0.5rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.single-uudised .uudis-featured-image img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s ease;
}
.single-uudised .uudis-featured-image:hover img {
  transform: scale(1.03);
}

/* Title */
.single-uudised .uudis-title {
  font-size: var(--font-size-h3);
  line-height: 1.2;
  margin: 0 0 1rem;
  color: #222;
  font-weight: var(--fw-extrabold);
}

/* Meta */
.single-uudised .uudis-single .entry-meta {
  font-size: 0.875rem;
  color: #777;
  margin-bottom: 2rem;
}

/* Content */
.single-uudised .uudis-content {
  font-size: 1rem;
  line-height: 1.8;
  color: #333;
}
.single-uudised .uudis-content p {
  margin-bottom: 1.5rem;
}
.single-uudised .uudis-content h2,
.single-uudised .uudis-content h3,
.single-uudised .uudis-content h4 {
  margin: 2rem 0 1rem;
  line-height: 1.3;
  color: #222;
}
.single-uudised .uudis-content a {
  color: var(--site-color);
  text-decoration: none;
  border-bottom: 1px solid var(--site-color);
  transition: color .2s, border-color .2s;
}
.single-uudised .uudis-content a:hover {
  color: darken(var(--site-color),10%);
  border-color: transparent;
}

/* Blockquote */
.single-uudised .uudis-content blockquote {
  border-left: 4px solid var(--site-color);
  padding: 1rem 1.5rem;
  margin: 2rem 0;
  background: #f9f9f9;
  font-style: italic;
}

/* Images inside content */
.single-uudised .uudis-content img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 1.5rem auto;
  border-radius: 0.25rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* Lists */
.single-uudised .uudis-content ul,
.single-uudised .uudis-content ol {
  margin: 1rem 0 1rem 1.5rem;
}
.single-uudised .uudis-content li {
  margin-bottom: .5rem;
}

/* Responsive iframe embeds */
.single-uudised .uudis-content iframe,
.single-uudised .uudis-content embed {
  width: 100%;
  height: auto;
}

/* Mobile spacing tweaks */
@media (max-width: 600px) {
  .single-uudised .uudis-title {
    font-size: 1.75rem;
  }
  .single-uudised .uudis-single {
    margin: 2rem 0;
    padding: 0 .5rem;
  }
  .single-uudised .uudis-content p {
    margin-bottom: 1rem;
  }
}






/* ────────────────────────────────────────────────────────────────────────
   Page template single teenus
───────────────────────────────────────────────────────────────────────── */



.single-teenused a.btn-header:visited {
    color: #000;
}
.single-teenused .btn-header span {
    display: inline-block;
    transform: skew(19deg);
    font-size: var(--font-size-btn);
}
.single-teenused .btn-header {
    display: inline-flex;
    align-items: center;
    padding: 7px 0px 7px 18px;
    background: var(--site-color);
    color: #000;
    text-decoration: none;
    font-weight: 600;
    transform: skew(-19deg);
    transition: background .2s;
    width: fit-content;
    margin-top: 25px;
}
.single-teenused .btn-header img {
    display: inline-block;
    width: 65px;
    margin-left: .5em;
    transform: skew(19deg);
}

.single-teenused .page-cta {
  margin-top: 1.5rem;
}
.single-teenused .page-cta .btn--primary {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background-color 0.2s ease;
}
.single-teenused .page-cta .btn--primary:hover {
  background-color: darken(var(--color-primary), 10%);
}

/* ——— Page Header ——— */
.single-teenused .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 4rem 1rem;
  color: #fff;
}
.single-teenused .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 0;
}
.single-teenused .page-header .container {
  position: relative;
  z-index: 1;
  max-width: 1420px;
  margin: 0 auto;
  margin-top: 65px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.single-teenused .page-title {
  font-size: var(--font-size-h1);
  margin: 0;
}
.single-teenused .text-center {
  text-align: center;
  align-items: center;
}
.single-teenused .page-subtitle {
  font-size: var(--font-size-body);
  font-weight: var(--fw-semibold);
  max-width: 850px;
  line-height: 1.5;
}
.single-teenused .page-cta .btn--primary {
  margin-top: 1.5rem;
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background 0.2s;
}
.single-teenused .page-cta .btn--primary:hover {
  background: darken(var(--color-primary),10%);
}
.single-teenused .page-newsletter {
  margin-top: 2rem;
}

/* Container max width / center */
.single-teenused .teenus-single .container {
  max-width: 1420px;
  margin: 0 auto;
  padding: 4rem 1rem;
}

/* Hide the title */
.single-teenused .teenus-single__header {
  display: none;
}

/* Body: two‐column flex */
.single-teenused .teenus-single__body {
  display: flex;
  align-items: stretch;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  gap: 2rem;
}

/* Content panel (left) */
.single-teenused .teenus-single__content {
  flex: 0 0 60%;
  background: #fff;
  padding: 2rem;
  box-shadow: 0 8px 24px rgba(0,0,0,0.05);
  border-radius: 8px;
  clip-path: polygon(0 0, 100% 0, 90% 100%, 0 100%);
  overflow: hidden;
}

/* Image panel (right) */
.single-teenused .teenus-single__image {
  flex: 0 0 40%;
  display: flex;
  box-shadow: 0 8px 24px rgba(0,0,0,0.05);
  border-radius: 8px;
  overflow: hidden;
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
}
.single-teenused .teenus-single__image img {
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Mobile stack */
@media (max-width: 768px) {
  .single-teenused .teenus-single__body {
    flex-direction: column;
  }
  .single-teenused .teenus-single__content,
  .single-teenused .teenus-single__image {
    flex: 0 0 auto;
    width: 100%;
    clip-path: none;
  }
  .single-teenused .teenus-single__content {
    margin-bottom: 2rem;
  }
}





/* ────────────────────────────────────────────────────────────────────────
   Page template single meeskond
───────────────────────────────────────────────────────────────────────── */



.single-meeskond p.trainer-phone {
  margin: 0;
  margin-bottom: -12px;
  font-weight: var(--fw-semibold);
}

.single-meeskond p.trainer-email {
  font-weight: var(--fw-semibold);
}

.single-meeskond .single-trainer .container {
  display: flex;
  align-items: flex-start;
  gap: 2rem;
}

.single-meeskond .trainer-image {
  flex: 0 0 40%;
  padding-top: 50%;              /* 2:1 aspect ratio example */
  background-size: cover;
  background-position: center;
}

.single-meeskond .trainer-details {
  flex: 1;
}

.single-meeskond .trainer-name {
  font-size: var(--font-size-h2);
  margin-bottom: 0.5rem;
}

.single-meeskond .trainer-position {
  font-size: 1.125rem;
  font-weight: var(--fw-semibold);
  margin-bottom: 1.5rem;
}

.single-meeskond .trainer-bio {
  font-size: var(--font-size-body);
  line-height: 1.6;
}

@media (max-width: 768px) {
  .single-meeskond .single-trainer .container {
    flex-direction: column;
  }
  .single-meeskond .trainer-image {
    width: 100%;
    height: 500px;
    padding-top: 60px;
    flex: auto;
  }
}

.single-meeskond .single-trainer {
  margin-top: 100px;
}

.single-meeskond .site-header {
  background: #000;
}













/* ────────────────────────────────────────────────────────────────────────
   Page template single asukohad
───────────────────────────────────────────────────────────────────────── */

 .single-asukohad h4 {
    margin-bottom: 4px;
    margin-top:-5px;
    padding: 0px;
}

.single-asukohad .location-info > h4:first-of-type {
margin-bottom:-30px;


}
/* 
.single-asukohad .location-email {
margin-bottom: -10px;
}

.single-asukohad .location-phone {
  margin-bottom: -25px;
} */


/* Block grouping */
.single-asukohad .location-columns {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}



@media (min-width: 768px) {
  .single-asukohad .location-columns {
    flex-direction: row;
    gap: 3rem;
  }

  .location-service-box + .location-service-box {
        border-left: 1px solid #a8a8a8;
    padding-left: 2rem;
  }

  .single-asukohad .location-block {
    flex: 1;
  }
}


.single-asukohad a.btn-header:visited {
  color: #000;
}
.single-asukohad .btn-header span {
  display: inline-block;
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.single-asukohad .btn-header {
  display: inline-flex;
  align-items: center;
  padding: 7px 0px 7px 18px;
  background: var(--site-color);
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transform: skew(-19deg);
  transition: background .2s;
  width: fit-content;
  margin-top: 25px;
}
.single-asukohad .btn-header img {
  display: inline-block;
  width: 65px;
  margin-left: .5em;
  transform: skew(19deg);
}

/* ——— Page Header ——— */
.single-asukohad .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  padding: 4rem 1rem;
  color: #fff;
}
.single-asukohad .page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 0;
}
.single-asukohad .page-header .container {
  position: relative;
  z-index: 1;
  max-width: 1420px;
  margin: 0 auto;
  margin-top: 65px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.single-asukohad .page-title {
  font-size: var(--font-size-h1);
  margin: 0;
}
.single-asukohad .text-center {
  text-align: center;
  align-items: center;
}
.single-asukohad .page-subtitle {
  font-size: var(--font-size-body);
  font-weight: var(--fw-semibold);
  max-width: 850px;
  line-height: 1.5;
}
.single-asukohad .page-cta .btn--primary {
  margin-top: 1.5rem;
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background: var(--color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: background 0.2s;
}
.single-asukohad .page-cta .btn--primary:hover {
  background: darken(var(--color-primary),10%);
}
.single-asukohad .page-newsletter {
  margin-top: 2rem;
}

/* ——— Single Location ——— */
.single-asukohad .single-location {
  max-width: 1420px;
  margin: 4rem auto;
  padding: 0 1rem;
  display: flex;
  gap: 2rem;
  align-items: flex-start;
}

/* Left side */
.single-asukohad .location-left {
  flex: 0 0 45%;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.single-asukohad .location-info {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.single-asukohad .location-info > div {
  display: flex;
  align-items: center;
  font-size: var(--font-size-body);
}
.single-asukohad .location-icon {
  flex-shrink: 0;
  width: 1.25rem;
  margin-right: 1rem;
}

/* Ensure content above stripe (if reused) */
.single-asukohad .location-item > .location-info,
.single-asukohad .location-item > .location-map {
  position: relative;
  z-index: 1;
}

/* Detailed info rows */
.single-asukohad .location-info .location-title {
  font-size: var(--font-size-h3);
  margin: 0 0 1rem;
}
.single-asukohad .location-info .location-address,
.single-asukohad .location-info .location-phone,
.single-asukohad .location-info .location-email,
.single-asukohad .location-info .location-opening {
  display: flex;
  align-items: center;
  padding: 1rem 0;
  border-bottom: 1px solid #e5e5e5;
  font-size: var(--font-size-body);
  font-weight: var(--fw-semibold);
}
.single-asukohad .location-info .location-opening {
  border-bottom: none;
}

/* Map */
.single-asukohad .location-map {
  width: 100%;
  height: 400px;
  margin-bottom: 50px;
  position: relative;
  max-width: 1420px;
  margin-right: auto;
  margin-left: auto;
  overflow: hidden;
  box-shadow: rgba(50, 50, 93, 0.25) 0 6px 12px -2px,
              rgba(0, 0, 0, 0.3) 0 3px 7px -3px;
}
.single-asukohad .location-map iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}

/* Right side: featured image */
.single-asukohad .location-right {
  flex: 0 0 55%;
}
.single-asukohad .location-image {
  width: 100%;
  aspect-ratio: 4/3;
  background-size: cover;
  background-position: center;
  border-radius: 0.5rem;
  overflow: hidden;
}

/* Responsive */
@media (max-width: 768px) {

.single-asukohad .location-info .location-block {
    align-items: center;
    text-align: center;
}
.single-asukohad .location-info .location-address, .single-asukohad .location-info .location-phone, .single-asukohad .location-info .location-email, .single-asukohad .location-info .location-opening {
  display: block;
  text-align: center;
}

.single-asukohad .location-info > h4:first-of-type {
margin-bottom:-30px;


}

.single-asukohad h4 {
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 0px;
}

  .single-asukohad .single-location {
    flex-direction: column;
    gap: 1.5rem;
  }
  .single-asukohad .location-left,
  .single-asukohad .location-right,
  .single-asukohad .location-map {
    flex: 0 0 auto;
    width: 100%;
  }
  .single-asukohad .location-map {
    height: 300px;
    clip-path: none;
    margin-top: 1rem;
  }
  .single-asukohad .location-info {
    align-items: center;
  }
  .single-asukohad .services-nav {
    top: 66%;
  }
}







/* ────────────────────────────────────────────────────────────────────────
   Services Section (scoped to single-asukohad)
───────────────────────────────────────────────────────────────────────── */

/* 1) Grid / Slider Visibility Toggles */
.single-asukohad .services-grid.hide-services-mobile   { display: none; }
.single-asukohad .services-slider.hide-services-desktop { display: none; }

@media (min-width: 769px) {
      .location-block + .location-block {
    border-left: 1px solid #a8a8a8;
    padding-left: 2rem;
  }
  .single-asukohad .services-grid.hide-services-mobile {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px 75px;
    align-items: start;
    margin-bottom: 4rem;
  }
  .single-asukohad .services-slider.hide-services-desktop {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .single-asukohad .services-grid.hide-services-mobile {
    display: none !important;
  }
  .single-asukohad .services-slider.hide-services-desktop {
    display: block !important;
  }
  .single-asukohad .services-intro {
    padding-bottom: 25px;
    text-align: center;
    margin-top: -20px;
  }
    .page-template-page-template-homepage .services-section {
        padding: 1rem 2rem;
  }
}

/* 2) Section & Container */
.single-asukohad .services-section {
  background: #f5f5f5;
  padding: 4rem 2rem;
  overflow: hidden;
}
.single-asukohad .services-inner {
  max-width: 1420px;
  margin: 0 auto;
}

/* 3) Intro Cell */
.single-asukohad .services-intro {
  padding: 40px 20px;
}
.single-asukohad .services-intro h2 {
  font-size: var(--font-size-h2);
  font-weight: 800;
  margin-bottom: 1rem;
}
.single-asukohad .services-intro p {
  font-size: var(--font-size-body);
  line-height: 1.5;
  margin-bottom: 1.5rem;
}
.single-asukohad .services-btn-all {
  display: inline-flex;
  align-items: center;
  padding: 12px 24px;
  background: #111;
  color: #fff;
  text-decoration: none;
  padding: 7px 0 7px 18px;
  transition: transform .2s, box-shadow .2s;
  transform: skew(-19deg);
}
.single-asukohad .services-btn-all img {
  margin-left: 0.5em;
  width: 65px;
  padding: 0;
  transform: skew(19deg);
}
.single-asukohad .services-btn-all span {
  transform: skew(19deg);
  font-size: var(--font-size-btn);
}
.single-asukohad .services-btn-all:visited {
  color: #fff;
}
.single-asukohad .services-btn-all img {
  margin-left: 8px;
  display: block;
}

/* 4) Card Basics */
.single-asukohad .services-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  position: relative;
  overflow: visible;
}
.single-asukohad .services-card-image-link {
  display: block;
  width: 100%;
  aspect-ratio: 6 / 5;
  overflow: hidden;
  position: relative;
  z-index: 2;
}
.single-asukohad .services-card-image {
  position: relative;
  z-index: 2;
}
.single-asukohad .services-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  position: absolute;
  top: 0; left: 0;
  z-index: 2;
}
.single-asukohad .services-card-body {
  background: #fff;
  padding: 20px;
  position: relative;
  z-index: 1;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  margin: 0;
}
.single-asukohad .services-card-title {
  margin: 0 0 .5rem;
  font-size: var(--font-size-h4);
  font-weight: 700;
}
.single-asukohad .services-card-text {
  font-size: var(--font-size-body);
  line-height: 1.5;
}

/* 5) Desktop-only tweaks */
@media (min-width: 769px) {
  .single-asukohad .services-card-body {
    margin: -150px -30px 30px;
    width: calc(100% + 60px);
  }
  .single-asukohad .services-card-image {
    position: relative;
    z-index: 2;
  }
  .single-asukohad .services-card-title {
    margin-top: 149px;
  }
}

/* Arrow button on card */
.single-asukohad .services-card-link {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 48px;
  height: 48px;
  background: var(--site-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  z-index: 3;
  box-shadow: 0 6px 12px rgba(0,0,0,0.1);
  rotate: -45deg;
}
.single-asukohad .services-card-link img {
  content: url('https://fvpadel.ee/wp-content/themes/fvtheme/assets/icons/arrow-right.svg');
  width: 24px;
  height: auto;
  filter: invert(1);
}

/* 6) Mobile GSAP Slider */
.single-asukohad .services-slider {
  position: relative;
}
.single-asukohad .services-slider-viewport {
  overflow: hidden;
}
.single-asukohad .services-slider-inner {
  display: flex;
  will-change: transform;
}
.single-asukohad .services-slide {
  flex: 0 0 auto;
  margin-right: 30px;
}
.single-asukohad .services-slide:last-child {
  margin-right: 0;
}

/* Slider navigation arrows */
.single-asukohad .services-nav {
  position: absolute;
  top: 105%;
  transform: translateY(-50%);
  width: 35px;
  height: 35px;
  border: none;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  display: flex;
  border: 1px solid black;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}
.single-asukohad .services-nav.prev {
  left: -20px;
}
.single-asukohad .services-nav.prev img {
  rotate: 180deg;
}
.single-asukohad .services-nav.next {
  right: -20px;
}
.single-asukohad .services-nav img {
  width: 1.2em;
  filter: invert(1);
}














/* ///// events */




/* .horizontal-months li a {
		text-decoration: none;
		padding: 5px 10px;
		border: 1px solid #ccc;
		border-radius: 4px;
		background-color: #f0f0f0;
		color: #333;
		border-radius: 50px!important;
	} */


  	.month-link a {
		color: #000;
		font-size: 14px;
		font-style: normal;
		font-weight: 400;
		line-height: 1;
		text-align: center;
		border-radius: 18px;
		background: #F3F3F3;
		padding: 8px 12px;
		white-space: nowrap;
		border-radius: 50px;
	}



  	.horizontal-months {
		list-style-type: none;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}
	
	.horizontal-months li {
		display: inline;
	}
	
	/* .horizontal-months li a {
		text-decoration: none;
		padding: 5px 10px;
		border: 1px solid #ccc;
		border-radius: 4px;
		background-color: #f0f0f0;
		color: #333;
	}
	 */
	.horizontal-months li a:hover {
		background-color: #e0e0e0;
	}
	


	.card-mansory {
		display: flex;
		flex-wrap: wrap; /* Allow cards to wrap */
		position: relative; /* Position relative to allow absolute positioning of spinner */
	}
	
  	.card-mansory {
		gap: 0px;
	}

    	.card-mansory > li {
		width: 30%; /* Set the width of each card to 30% */
		margin: 0 1.5%; /* Add margin to space out the cards */
		box-sizing: border-box; /* Include padding and border in the element's total width and height */
	}
	@media (max-width: 782px) {

  	.card-mansory {
			column-count: 1;
		}		
  		.card-mansory > li {
			width: 100%; /* Set the width to 100% for mobile devices */
			margin: 0; /* Remove margin on mobile for full width */
		}}
	




/* /// single events */
.events-template-default .events {
    margin-top: 140px;
}

.single-events .site-header {
      background: #000;
}
.section-box {
    width: 100%;
    max-width: 1300px;
    margin: auto;
}

.events .site-main {


  padding: 10px;


}
.events .post-container {
    display: flex
;
    flex-wrap: wrap;
    align-items: flex-start;
}
.events .post-content {
    flex: 1 1 50%;
    box-sizing: border-box;
    padding: 10px;
}

.single-events h4 {
  font-size: var(--font-size-h5)
}

@media (min-width: 769px) {
    .events .post-image {
        position: sticky;
        top: 20px;
        position: sticky;
        top: 20px;
        flex: 1 1 50%;
        box-sizing: border-box;
        padding: 10px;
    }
}


		@media (min-width: 768px) {
			.scroll-to-register {
				display: none;
				visibility: hidden;
			}}


      	@media (max-width: 768px) {
		/* events: scroll-to-register button styles */
		.events .scroll-to-register {
			text-align: center;
			margin-top: 20px;
			display: flex;
			gap: 20px;
			margin-left: 11px;
			margin-right: 11px;
		}
	
		.events .scroll-to-register button {
			background-color: #000;
			color: #fff;
			border: none;
        padding: 15px 20px;
        font-size: var(--font-size-body);
			cursor: pointer;
			width: 100%;
      margin-bottom: 25px;
			border-radius: 0px;
		}		}






.single-events .gform_title {
  display: none; visibility: hidden;
}

.single-events .gform_required_legend { 
    display: none; visibility: hidden;

}

.single-events .event-dates {
  font-size: var(  --font-size-h5);
  font-weight: var( --fw-semibold);
      margin-bottom: 25px;
    margin-top: -19px;
}
/* woocommerce */


	/* Center the checkout container */
	.checkout-container {
		max-width: 1800px; /* Limit max width */
		margin: 0 auto; /* Center horizontally */
		padding: 20px; /* Add some padding for spacing */
	}
	
	/* Layout for checkout form */
	.checkout-layout {
		display: flex;
		flex-wrap: wrap;
		gap: 20px; /* Spacing between sections */
		justify-content: center; /* Center content horizontally */
	}
	
	/* Billing Section (Left) */
	.checkout-billing {
		flex: 0 0 44%; /* 50% width on larger screens */
		padding: 20px;
		/* border: 1px solid #e0e0e0; 
		border-radius: 8px;
		background-color: #fff;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);  */
	}
	
	.woocommerce-checkout .woocommerce-message {
	display: none;
	visibility: hidden;
	}
	
	.woocommerce-billing-fields {
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	margin: -21px;
	padding: 26px;
	margin-bottom: 34px;
	background-color: #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	}
	/* Additional Fields Styling */
	.woocommerce-additional-fields {
		padding: 15px;
		margin: -20px;
		margin-top: 20px;
		border: 1px solid #e0e0e0;
		border-radius: 5px;
		background-color: #f9f9f9;
	}
	#billing_address_2_field {
		display: none !important;
		visibility: hidden;
	
	}
	/* Order Review Section (Right) */
	.checkout-order {
		flex: 0 0 44%; /* 50% width on larger screens */
		padding: 20px;
		/* border: 1px solid #e0e0e0; 
		border-radius: 8px;
		background-color: #fff;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);  */
	}
	
	/* Order Review Table Styling */
	#order_review {
		margin-top: 15px;
		/* border: 1px solid #e0e0e0; */
		border-radius: 5px;
		padding: 10px;
		background-color: #fff;
	}
	
	/* Headings */
	.checkout-container h3 {
		font-size: 1.5rem;
		color: #333;
		margin-bottom: 15px;
		/* border-bottom: 1px solid #e0e0e0; */
		padding-bottom: 5px;
	}
	
	/* Responsive Design */
	@media (max-width: 900px) {
		.checkout-layout {
			flex-direction: column; /* Stack sections vertically */
		}
	
		.checkout-billing,
		.checkout-order {
			flex: 0 0 100%; /* Full width for smaller screens */
		}
	}
	
	
	.woocommerce-checkout-coupon-container {
		max-width: 1568px;
		width: 87%;
	
		margin: 20px auto; /* Center the container and add spacing */
		padding: 0px;
		background-color: #fff; /* White background */
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Subtle shadow */
		border: 1px solid #e0e0e0; /* Light gray border */
		border-radius: 8px; /* Rounded corners */
		font-family: 'Arial', sans-serif; /* Consistent font */
		color: #000; /* Black text color */
	}
	
	.woocommerce-checkout-coupon-container .woocommerce-info {
		font-size: 16px; /* Slightly larger text */
		line-height: 1.5; /* Better readability */
		text-align: center; /* Center align text */
		margin-bottom: 15px; /* Space between the info and form */
    		margin-top: 15px; /* Space between the info and form */

	}
	
	.woocommerce-checkout-coupon-container .woocommerce-info a {
		color: #000;
		text-decoration: none; /* Remove underline */
		font-weight: bold; /* Make link stand out */
	}
	
	.woocommerce-checkout-coupon-container .woocommerce-info a:hover {
		color: #000; /* Darker blue for hover effect */
		text-decoration: underline; /* Add underline on hover */
	}
	
	.woocommerce-checkout-coupon-container form.checkout_coupon {
		text-align: center; /* Center align the form content */
	}
	
	.woocommerce-checkout-coupon-container form.checkout_coupon p {
		margin-bottom: 15px; /* Add spacing between form elements */
	}
	
	.woocommerce-checkout-coupon-container form.checkout_coupon .input-text {
		width: calc(50% - 20px); /* Adjust input width */
		max-width: 400px; /* Set a max width for the input */
		padding: 10px; /* Add inner padding */
		border: 1px solid #e0e0e0; /* Light gray border */
		border-radius: 5px; /* Rounded corners */
		margin-right: 10px; /* Spacing from the button */
	}
	
	.woocommerce-checkout-coupon-container form.checkout_coupon .button {
		background-color: #000; /* WooCommerce primary button color */
		color: #fff; /* White text */
		padding: 10px 20px; /* Button size */
		border: none; /* Remove default border */
		border-radius: 5px; /* Rounded corners */
		cursor: pointer; /* Pointer cursor for buttons */
		transition: background-color 0.3s ease; /* Smooth hover transition */
	}
	
	.woocommerce-checkout-coupon-container form.checkout_coupon .button:hover {
		background-color: #000; /* Darker blue on hover */
	}
	@media (max-width: 900px) {
		.woocommerce-checkout-coupon-container {
			width: auto;
			margin: 20px;
			padding: 0px;
		}
	
		.woocommerce-checkout-coupon-container form.checkout_coupon .input-text {
			width: 100%;
	}}
	
	@media (max-width: 440px) {
	.montonio-card-icon {
	width: 144px;
	}}
	
	@media (max-width: 350px) {
	.checkout-container {
	
		padding: 7px;
	}
	
	.checkout-billing {
		padding: 13px;
	}
	.woocommerce-checkout-coupon-container {
		margin: 6px;
	}
	
	}
	
	
	.woocommerce-form-coupon-toggle .woocommerce-info {
		border-top-color: #000;
		background-color: transparent;
	}
	
	
	.woocommerce-form-coupon-toggle  .woocommerce-info::before {
		color: #000;
	}
	
	.woocommerce form.checkout_coupon {
		border: none;
		padding: 7px;
	
	}
	
	.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt {
		background-color: #000;
		width: 100%;
		font-size: 18px;
	
	}
	
	.woocommerce div.product form.cart .button {
		vertical-align: middle;
		float: left;
		margin-top: 15px;
	}
	
	.woocommerce-checkout .page-banner {
		padding: 160px 0 0px;
		margin-top: 0px;
	}
	
	@media (max-width: 768px) {
	#order_review {
	padding: 0px;
	}
	
	.checkout-order {
		padding: 0px;
	}
	}
	/* checkout page end */
	
	/* cart page  */
	/* Style for checkout-page-forms container */
	.checkout-page-forms {
		max-width: 1700px;
		margin: 0 auto;
		padding: 20px;
		/* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
		border: 1px solid #e0e0e0; 
		border-radius: 8px; */
		background-color: #fff;
	}
	
	/* Responsive layout for cart form and totals */
	@media (min-width: 900px) {
		.checkout-page-forms {
			display: flex;
			justify-content: space-between;
			gap: 20px;
		}
	
		.woocommerce-cart-form {
			flex: 1 1 70%;
			max-width: 70%;
		}
	
		.cart-collaterals {
			flex: 1 1 30%;
			max-width: 30%;
		}
	}
	
	.checkout-page-forms h2 {
		font-size: 25px;
		font-style: normal;
		font-weight: 900;
	}
	.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
		margin-bottom: 0px;
	}
	.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
		float: left;
		width: 100%;
	}
	/* Table Styling */
	.shop_table {
		width: 100%;
		border-collapse: collapse;
		margin-bottom: 20px;
	}
	
	.shop_table th,
	.shop_table td {
		padding: 10px;
		border: 1px solid #e0e0e0;
		text-align: left;
	}
	
	/* Product Rows */
	.woocommerce-cart-form__cart-item {
		background-color: #fff;
		border: 1px solid #e0e0e0;
		border-radius: 8px;
		padding: 15px;
		margin-bottom: 20px;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	}
	
	/* Totals Section */
	.cart-collaterals {
		padding: 20px;
		border: 1px solid #e0e0e0;
		border-radius: 8px;
		background-color: #f9f9f9;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	}
	
	/* Buttons */
	.woocommerce-cart-form button,
	.woocommerce-cart-form input[type="submit"] {
		background-color: #0073aa;
		color: #fff;
		border: none;
		padding: 10px 20px;
		border-radius: 5px;
		cursor: pointer;
		transition: background-color 0.3s ease;
	}
	
	.woocommerce-cart-form button:hover,
	.woocommerce-cart-form input[type="submit"]:hover {
		background-color: #005177;
	}
	
	.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt {
		background-color: #000;
	}
	
	.woocommerce-cart table.cart td.actions .coupon .input-text {
		loat: left;
		box-sizing: border-box;
		border: 1px solid #cfc8d8;
		padding: 6px 6px 5px;
		margin: 0 4px 0 0;
		outline: 0;
		width: 200px;
		border-radius: 5px;
	}
	
	.woocommerce-page table.cart td.actions {
		text-align: right;
		padding-top: 29px;
	}
	
	.product-remove {
		width: 20px;
	}
	
	.woocommerce-cart table.cart img {
		width: 100px;
	}
	.woocommerce-cart table.cart .product-thumbnail {
		min-width: 32px;
		width: 127px;
	}
	@media (max-width: 768px) {
		.woocommerce table.shop_table_responsive tbody tr:first-child td:first-child, .woocommerce-page table.shop_table_responsive tbody tr:first-child td:first-child {
	
			width: 100%;
		}
		.woocommerce table.shop_table {
		 border: none
	}
	
	.woocommerce-cart table.cart td.actions .coupon .input-text {
		width: 100%;
	}
	.woocommerce-page table.cart td.actions .coupon .button {
		width: 100%;
		margin-top: 10px;
	}
	}
	
	
	.woocommerce-cart a {
		color: #000;
	}
	/* cart page end */
	
	
	/* product page */
	.single-product .product-image {
		padding-right: 20px;
	}
	
	.single-product .product-details {
		padding-left: 20px;
	}
	
	.single-product .product-summary {
		margin-top: 20px;
	}
	
	.single-product .product-tabs {
		margin-top: 40px;
	}
	/* Move the gallery trigger (next/prev buttons) to the left corner of the product image */
	.woocommerce-product-gallery__trigger {
		position: absolute;
		top: 10px; /* Adjust as needed */
		left: 10px; /* Adjust as needed */
		z-index: 10;
	}
	
	/* Ensure the product images have relative positioning to position the trigger properly */
	.woocommerce-product-gallery {
		position: relative;
	}
	
	/* Optionally, adjust image size or other styles here */
	.product-image img {
		width: 100%;
		height: auto;
	}
	
	/* Container Styling */
	.single-product .wc_gc_send_as_gift_wrapper,
	.single-product .custom-gift-card-checkbox {
		display: flex;
		align-items: center; /* Align checkbox and label vertically */
		gap: 10px; /* Space between checkbox and label */
		margin-bottom: 15px; /* Add spacing between form fields */
	}
	
	.single-product .wc_gc_send_as_gift_wrapper {
		margin-top: 35px;
	}
	
	/* Checkbox Styling */
	.single-product .site-main input[type="checkbox"] {
		width: 18px;
		height: 18px;
		appearance: none;
		background-color: #fff;
		border: 2px solid #000;
		border-radius: 2px; /* Square corners */
		cursor: pointer;
		margin-top: -3px;    display: inline-block; /* Ensure inline placement */
		vertical-align: middle; /* Align to the middle of the label text */
		position: relative; /* For custom checked indicator */
	}
	
	.single-product .site-main input[type="checkbox"]:checked {
		background-color: #000;
	}
	
	.single-product .site-main input[type="checkbox"]:checked::after {
		content: "";
		position: absolute;
		top: 50%; /* Center checkmark vertically */
		left: 50%; /* Center checkmark horizontally */
		transform: translate(-50%, -50%); /* Correct centering offset */
		width: 8px;
		height: 8px;
		background-color: #fff;
		border-radius: 1px;
	}
	
	/* Label Styling */
	.single-product .site-main label {
		font-size: 16px;
		color: #333;
		cursor: pointer;
		margin: 0; /* Remove any potential inherited margin */
		display: inline-block; /* Ensure inline placement */
		line-height: 18px; /* Match checkbox height for perfect alignment */
		vertical-align: middle; /* Align with checkbox */
	}
	
	/* Input Field Styling */
	.single-product .site-main input[type="text"],
	.single-product textarea,
	.single-product .datepicker {
		width: 100%;
		padding: 10px;
		font-size: 14px;
		border: 1px solid #ddd;
		border-radius: 4px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
		margin-top: 5px;
		margin-bottom: 15px;
		outline: none;
		transition: border-color 0.2s ease, box-shadow 0.2s ease;
	}
	
	.single-product .site-main input[type="text"]:focus,
	.single-product textarea:focus,
	.single-product .datepicker:focus {
		border-color: #000;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
	}
	

	
	/* Small Text Styling */
	.single-product small#delivery_date_notice {
		font-size: 16px;
		color: #555;
		margin-top: 5px;
		display: block;
	}
	
	/* Responsive Adjustments */
	@media (max-width: 768px) {
		.single-product .site-main input[type="checkbox"] {
			width: 16px;
			height: 16px;
		}
	
		.single-product .site-main label {
			font-size: 13px;
		}
	
		.single-product .site-main input[type="text"],
		.single-product textarea {
			font-size: 13px;
			padding: 8px;
		}
	
		.single-product button.single_add_to_cart_button {
			font-size: 13px;
			padding: 8px 16px;
		}
	}
	.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover {
		background-color: #000;
	}
	
	
	@media (max-width: 400px) {
	.wc-forward {
	width: 100%;
	text-align: center;
	margin: 10px !important;
	
	}
	
	.go-to-checkout-btn {
	width: 100%;
	text-align: center;
	margin: 10px !important;
	}}
	
	/* product page end */
	
	
	
	
	.woocommerce-order {
	max-width: 1700px;
	display: block;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	}
	.woocommerce form .form-row {
    padding: 3px;
    margin: 0 0 6px;
}
	
	.woocommerce table.shop_table {
		border: 1px solid transparent!important;
	}
	
	.shop_table th, .shop_table td {
	
		border: 1px solid black!important;
	}
	

  .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt {
    background-color: #000;
    width: 100%;
    font-size: 18px;
}







/* SHOPPP CHEEECKOUT mfker */

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
    background: #e9e6ed;
    border-radius: 5px;
}


#add_payment_method #payment ul.payment_methods, .woocommerce-cart #payment ul.payment_methods, .woocommerce-checkout #payment ul.payment_methods {
    text-align: left;
    padding: 1em;
    border-bottom: 1px solid #cfc8d8;
    margin: 0;
    list-style: none outside;
}





#place_order {
    background-color: #000;
    width: 96%;
    font-size: 18px;
    height: 47px;
    color: #fff;
    margin: 10px;
}

.woocommerce-terms-and-conditions-wrapper {
  padding: 10px;
}

/* Container tweaks */
.woocommerce-billing-fields__field-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

/* First & last name side-by-side */
.woocommerce-billing-fields__field-wrapper .form-row-first,
.woocommerce-billing-fields__field-wrapper .form-row-last {
  flex: 1 1 calc(50% - 0.5rem);
}

/* All other full-width fields */
.woocommerce-billing-fields__field-wrapper .form-row-wide {
  flex: 1 1 100%;
}

/* Consistent label styling */
.woocommerce-billing-fields__field-wrapper label {
  display: block;
  font-weight: 600;
  margin-bottom: .25rem;
  color: #333;
}

/* Input & select styling */
.woocommerce-billing-fields__field-wrapper input.input-text,
.woocommerce-billing-fields__field-wrapper select {
  width: 100%;
  padding: .75rem 1rem;
  border: 1px solid #ccc;
  border-radius: .25rem;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.05);
  font-size: 1rem;
  transition: border-color .2s, box-shadow .2s;
}

/* Focus state */
.woocommerce-billing-fields__field-wrapper input:focus,
.woocommerce-billing-fields__field-wrapper select:focus {
  outline: none;
  border-color: var(--site-color);
  box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.3);
}

/* Required asterisk */
.woocommerce-billing-fields__field-wrapper abbr.required {
  color: #d00;
}

/* Hidden optional fields (you can override if needed) */
.hidden-field {
  display: none !important;
}

/* Responsive: stack on mobile */
@media (max-width: 600px) {
  .woocommerce-billing-fields__field-wrapper .form-row-first,
  .woocommerce-billing-fields__field-wrapper .form-row-last {
    flex: 1 1 100%;
  }
}

textarea#order_comments {
    margin-top: 20px;
}


.woocommerce-checkout .page-header  .page-title {
    font-size: var(--font-size-h3);
    line-height: 1.1;
    margin: 0;
    color: #000;
        margin-top: 40px;
}



.woocommerce-checkout .page-header .container {
      max-width: 1287px!important;
          padding: 0rem 1rem!important;
}





/* ────────────────────────────────────────────────────────────────────────
  GDPR popup
───────────────────────────────────────────────────────────────────────── */


#moove_gdpr_cookie_info_bar.gdpr_infobar_postion_bottom_left:not(.gdpr-full-screen-infobar) {
  border-radius: 0px!important;
  border: 0px #fff!important;
}


#moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content button.mgbutton:first-child  {
  background-color: var(--site-color)!important;
      color: #fff!important;
}


#moove_gdpr_cookie_modal .moove-gdpr-modal-content.moove_gdpr_modal_theme_v1 .moove-gdpr-modal-footer-content .moove-gdpr-button-holder button.mgbutton:first-child {
    background-color: var(--site-color)!important;
      color: #fff!important;
}



/* ────────────────────────────────────────────────────────────────────────
/// newsletter form change
───────────────────────────────────────────────────────────────────────── */


.page-template-padel-page-newsletter-option .site-header{

    background: #000;
}


.page-template-padel-page-newsletter-option .entry-content {
  margin-top: 135px;
}

	.form-newsletter {
		width: 100%;
		max-width: 744px;
		padding: 55px;
        border-radius: 8px;
		background: #efefef;
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
		margin: 50px auto;
	}
	
	.form-newsletter h1.entry-title {
		font-size: 28px;
		font-weight: 700;
		text-transform: inherit;
	}
	
	.form-newsletter input[type="email"] {
		display: block;
		border: 1px solid #000;
		background: #FFF;
		width: 100%;
		padding: 10px 30px;
	}
	
	.form-newsletter .nlopt-checks {
		margin-top: 40px;
		margin-bottom: 40px;
	}
	
	.nlopt-check input {
		position: absolute;
		opacity: 0;
	}
	
	.nlopt-check label {
		position: relative;
		padding-left: 20px;
	}
	
	.nlopt-check label:before {
		content: "";
		display: block;
		position: absolute;
		width: 14px;
		height: 14px;
		border: 1px solid #000;
		left: 0;
	}
	
	.nlopt-check input:checked + label:after {
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		background: #000;
		position: absolute;
		top: 3px;
		left: 3px;
	}
	
	.nlopt-check .nlopt-check__text h3 {
		font-size: 18px;
		font-weight: 400;
		margin: 0;
		line-height: 1;
	}
	
	.nlopt-check .nlopt-check__text p {
		font-size: 15px;
	}
	
	.nlopt-submit {
    font-size: 16px;
    font-weight: 600;
    background: #000 !important;
    display: block;
    padding: 20px 50px !important;
    border: none !important;
    margin: auto;
    color: #fff!important;

	}
	
	.form-newsletter .fn-response.success h2 {
		color:#169f46
	}
	
	.form-newsletter .fn-response.failed h2,
	.fn-error {
		color: #f21414;
		font-weight: 700;
	}
	

.nlopt-check {
         display: flex
;
    padding-bottom: 23px;

}

.nlopt-check__text {
  margin-top: -2px;
}

h4.listing-title {
  font-size: var(--font-size-h4);
  padding: 0px;
  margin: 0px;
  margin-bottom: 10px;
    margin-top: 20px;
}





/* ────────────────────────────────────────────────────────────────────────

Footer

───────────────────────────────────────────────────────────────────────── */


	/* ─── Footer Grid & Layout ────────────────────────────────────────── */
.site-footer {
  background: #111;
  color: #fff;
  padding: 4rem 2rem;
}

.footer-inner {
  display: grid;
  align-items: start;              /* don’t vertically center everything */
  gap: 2rem;
  max-width: 1420px;
  margin: 0 auto;
    align-items: flex-start;
  /* 3 equal‐min columns that never shrink below 240px */
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  grid-template-areas:
    "logo links contact"
    "copyright copyright copyright";
}
.footer-col {}

/* Logo */
.footer-logo {
  grid-area: logo;
}
.footer-logo img {
  min-width: 85%;
  height: auto;
      margin-top: 12px;
  display: block;
      filter: invert(1);
}

/* Quick Links */
.footer-links {
  grid-area: links;
}
.footer-links h4 {
  font-size: var(--font-size-h4);
  margin-bottom: 1rem;
  text-transform: uppercase;
      margin: 0px;
    margin-bottom: 12px;
}
.footer-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.footer-links li {
  margin-bottom: 0rem;
}
.footer-links a {
  color: #fff;
  text-decoration: none;
  transition: color 0.2s;
  font-size: var(--font-size-body);
  line-height: 36px;
}
.footer-links a:hover {
  color: var(--site-color);
}

/* Contact & Icons */
.footer-contact {
  grid-area: contact;
}
.footer-contact h4 {
  font-size: var(--font-size-h4);
  margin: 1rem 0 0.75rem;
  text-transform: uppercase;
      margin: 0px;
    margin-bottom: 12px;
}
.contact-item {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}
.footer-icon {
  width: 20px;
  height: auto;
  margin-right: 0.5rem;
  display: inline-block;
  vertical-align: middle;
  filter: brightness(0) invert(1);
}
.contact-item a {
  color: #fff;
  text-decoration: none;
  transition: color 0.2s;
  font-size: var(--font-size-body);
}
.contact-item a:hover {
  color: #f4c600;
}

/* Social Icons */
.footer-social {
  margin-top: 1.5rem;
}
.footer-social a {
  display: inline-block;
  margin-right: 1rem;
}
.social-icon {
  width: 36px;
  height: auto;
  vertical-align: middle;
  display: inline-block;
}

/* Copyright */
.footer-copyright {
    font-weight: 400;
    font-size: 18px;
    margin-top: 29px;
}

@media (max-width: 812px) {
  .footer-inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "logo"
      "links"
      "contact"
      "copyright";
  }
  }

/* ─── Mobile (≤600px) ─────────────────────────────────────────────── */
@media (max-width: 600px) {
  .site-footer {
    padding: 2rem 1rem;
  }

  .footer-links h4,
  .footer-contact h4 {
    margin-top: 2rem;
  }
  .footer-logo img {
      margin-top: 50px;
	  max-width: 100%;
	  }
	  .footer-copyright {
    font-weight: 400;
  font-size: var(--font-size-body);
    margin-top: 20px;
}
.footer-links a {
  font-size: var(--font-size-body);
    line-height: 30px;

}
.contact-item a {
  font-size: var(--font-size-body);
    line-height: 30px;
}

}
.gform_footer input[type="submit"] {
border: 1px solid var(--site-color);
    background: var(--site-color);
    border-radius: 0px;
}

.gform_required_legend {
  display: none;
  visibility: hidden;
}


/* WOOCOOMMERCE SHOP — CLEANED */

/* Add margin-bottom only on WooCommerce single, cart, and checkout pages */
.single-product .site-header,
.woocommerce-cart .site-header {
  margin-bottom: 35px !important;
}

/* Keep footer beneath the main content */
.site-footer {
  position: relative; /* avoid fixed/absolute unless you truly need it */
  z-index: 1;
  clear: both;
}

/* Constrain controls + grid + pagination to 1440px (header stays full-bleed) */
.post-type-archive-product  .woocommerce-result-count,
.post-type-archive-product  .woocommerce-ordering,
.post-type-archive-product  ul.products,
.post-type-archive-product  nav.woocommerce-pagination,
.tax-product_cat          .woocommerce-result-count,
.tax-product_cat          .woocommerce-ordering,
.tax-product_cat          ul.products,
.tax-product_cat          nav.woocommerce-pagination,
.tax-product_tag          .woocommerce-result-count,
.tax-product_tag          .woocommerce-ordering,
.tax-product_tag          ul.products,
.tax-product_tag          nav.woocommerce-pagination {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
  width: 100%;
}

/* ======================== GRID & CARDS ======================== */
.post-type-archive-product ul.products,
.tax-product_cat ul.products,
.tax-product_tag ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 28px;
  margin: 0 auto;
  padding: 0;
}

/* reset legacy floats so grid sizing works */
.post-type-archive-product ul.products li.product,
.tax-product_cat ul.products li.product,
.tax-product_tag ul.products li.product {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  clear: none !important;
  background: #fff;
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* top link area (image + meta) */
.post-type-archive-product ul.products li.product a.woocommerce-LoopProduct-link,
.tax-product_cat ul.products li.product a.woocommerce-LoopProduct-link,
.tax-product_tag ul.products li.product a.woocommerce-LoopProduct-link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}

/* image: perfect square */
.post-type-archive-product ul.products li.product a.woocommerce-LoopProduct-link picture,
.tax-product_cat ul.products li.product a.woocommerce-LoopProduct-link picture,
.tax-product_tag ul.products li.product a.woocommerce-LoopProduct-link picture { display:block; }
.post-type-archive-product ul.products li.product a.woocommerce-LoopProduct-link img,
.tax-product_cat ul.products li.product a.woocommerce-LoopProduct-link img,
.tax-product_tag ul.products li.product a.woocommerce-LoopProduct-link img {
  width: 100% !important;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

/* meta: title + price */
.post-type-archive-product ul.products li.product .woocommerce-loop-product__title,
.tax-product_cat ul.products li.product .woocommerce-loop-product__title,
.tax-product_tag ul.products li.product .woocommerce-loop-product__title {
  padding: 22px 18px 6px;
  font-size: clamp(18px, 2.1vw, 26px);
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
  margin: 0;
}
.post-type-archive-product ul.products li.product .price,
.tax-product_cat ul.products li.product .price,
.tax-product_tag ul.products li.product .price {
  padding: 0 18px 18px;
  font-size: clamp(14px, 1.6vw, 18px);
  font-weight: 500;
  text-align: center;
  margin: 0;
}

/* hide extras for clean card */
.post-type-archive-product ul.products li.product .star-rating,
.tax-product_cat ul.products li.product .star-rating,
.tax-product_tag ul.products li.product .star-rating,
.post-type-archive-product ul.products li.product .added_to_cart,
.tax-product_cat ul.products li.product .added_to_cart,
.tax-product_tag ul.products li.product .added_to_cart { display:none !important; }

/* placeholder image tidy */
.woocommerce ul.products li.product img.woocommerce-placeholder { background:#eee; color:transparent; }

/* ======================== BUTTON (skewed bar + right white panel) ======================== */
.post-type-archive-product ul.products li.product a.button,
.tax-product_cat ul.products li.product a.button,
.tax-product_tag ul.products li.product a.button {
  margin: 18px;
  width: calc(100% - 36px);
  height: 55px;
  background: #1a1a1a;
  color: #fff !important;
  display: flex;
  justify-content: flex-start;   /* text to the left */
  align-items: center;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-decoration: none;
  border: 0;
  position: relative;
  overflow: visible;
  transform: skew(-17deg);
  box-shadow: 0 12px 20px rgba(0,0,0,.12);
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
  padding-left: 59px;   /* nudge label left */
  padding-right: 0;     /* space reserved by panel */
}

/* straighten the label */
.post-type-archive-product ul.products li.product a.button > *,
.tax-product_cat ul.products li.product a.button > *,
.tax-product_tag ul.products li.product a.button > * { transform: skew(12deg); }

/* remove any old decorative ::before */
.post-type-archive-product ul.products li.product a.button::before,
.tax-product_cat ul.products li.product a.button::before,
.tax-product_tag ul.products li.product a.button::before { content:none !important; }

/* right-side white panel with arrow */
.post-type-archive-product ul.products li.product a.button::after,
.tax-product_cat ul.products li.product a.button::after,
.tax-product_tag ul.products li.product a.button::after {
  content: "";
  position: absolute;
  top: 6px;
  bottom: 6px;
  right: 7px;
  width: 61px;
  background: #fff;
  transform: skew(-2deg);
  box-sizing: border-box;
  background-image: url('https://fvsport.andrihallik.ee/wp-content/themes/fvtheme/assets/icons/light-arrow.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60px 60px;
}

/* hover: slight lift */
.post-type-archive-product ul.products li.product a.button:hover,
.tax-product_cat ul.products li.product a.button:hover,
.tax-product_tag ul.products li.product a.button:hover {
  background: #000;
  box-shadow: 0 12px 26px rgba(0,0,0,.16);
}

/* never underline button */
.post-type-archive-product ul.products li.product a.button,
.post-type-archive-product ul.products li.product a.button:hover,
.tax-product_cat ul.products li.product a.button,
.tax-product_cat ul.products li.product a.button:hover,
.tax-product_tag ul.products li.product a.button,
.tax-product_tag ul.products li.product a.button:hover { text-decoration: none !important; }

/* ======================== CONTROLS ROW (result count left, ordering right) ======================== */
/* --- Shop tools row --- */
.shop-tools {
  max-width: 1440px;
  margin: 0 auto 20px;
  padding: 0 20px;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  justify-content: space-between;
}



/* result count on left */
.shop-tools .woocommerce-result-count {
    font-size: 14px;
    color: #333;
    margin-top: 32px;
}
/* ordering on right */
.shop-tools .woocommerce-ordering {
  margin: 0;
      text-align: right;
}

/* style the select box */
.shop-tools .woocommerce-ordering select.orderby {
  appearance: none;              /* remove default browser arrow */
  -webkit-appearance: none;
  -moz-appearance: none;

  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 6px 32px 6px 12px;    /* right padding for custom arrow */
  font-size: 14px;
  font-family: inherit;
  color: #333;
  cursor: pointer;
  line-height: 1.4;

  background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23666' stroke-width='2' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E<path d='M6 9l6 6 6-6'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 14px 14px;
}

.shop-tools .woocommerce-ordering select.orderby:focus {
  outline: none;
  border-color: #000;
}




/* // woocommerce notifications */
/* ===== WooCommerce Notices – Modern Card Style (v2) ===== */

/* Container alignment (1440px like your layout) */
.woocommerce-notices-wrapper,
.woocommerce .woocommerce-notices-wrapper,
.woocommerce-page .woocommerce-notices-wrapper {
  max-width: 1440px;
  margin: 14px auto 28px;
  padding: 0 20px;
  box-sizing: border-box;
}

/* Base card */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  position: relative;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  padding: 18px 20px 18px 64px; /* left room for icon/accent */
  margin: 14px 0;
  /* Soft glassy panel with subtle gradient */
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.92));
  color: #111;
  box-shadow:
    0 1px 0 rgba(255,255,255,.8) inset,
    0 10px 18px rgba(0,0,0,.06),
    0 24px 48px rgba(0,0,0,.12);
  -webkit-backdrop-filter: saturate(140%) blur(2px);
          backdrop-filter: saturate(140%) blur(2px);
  animation: wcNoticeIn .28s cubic-bezier(.2,.7,.2,1) both;
  line-height: 1.5;
}

/* Some WC notices render as UL; normalize spacing */
.woocommerce-error,
.woocommerce-info {
  list-style: none;   /* remove default bullets */
  padding-left: 64px; /* keep icon spacing */
  margin-left: 0;
}
.woocommerce-error li + li,
.woocommerce-info li + li { margin-top: 6px; }

/* Left accent glow */
.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 7px;
  border-radius: 14px 0 0 14px;
  box-shadow:
    0 0 12px currentColor inset,
    0 0 0 1px rgba(0,0,0,.03) inset;
  color: transparent; /* color comes from each type rule below */
}

/* Circular icon "chip" */
.woocommerce-message::after,
.woocommerce-error::after,
.woocommerce-info::after {
  content: "";
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: currentColor; /* set per type below */
  -webkit-mask-size: 16px 16px;
          mask-size: 16px 16px;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  box-shadow: 0 6px 12px rgba(0,0,0,.12);
}

/* Success (added to cart) */
.woocommerce-message {
  background:
    linear-gradient(180deg, rgba(245,255,247,.96), rgba(245,255,247,.92));
}
.woocommerce-message::before { color: #20c36a; }
.woocommerce-message::after  {
  color: #20c36a;
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="%23000" d="M8.5 13.5 4.8 9.8l1.4-1.4 2.3 2.3 4.9-4.9 1.4 1.4z"/></svg>');
          mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="%23000" d="M8.5 13.5 4.8 9.8l1.4-1.4 2.3 2.3 4.9-4.9 1.4 1.4z"/></svg>');
}

/* Error */
.woocommerce-error {
  background:
    linear-gradient(180deg, rgba(255,247,247,.96), rgba(255,247,247,.92));
}
.woocommerce-error::before { color: #ff4d4f; }
.woocommerce-error::after  {
  color: #ff4d4f;
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="%23000" d="M10 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm1 12H9v-2h2v2Zm0-3H9V5h2v6Z"/></svg>');
          mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="%23000" d="M10 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm1 12H9v-2h2v2Zm0-3H9V5h2v6Z"/></svg>');
}

/* Info */
.woocommerce-info {
  background:
    linear-gradient(180deg, rgba(246,251,255,.96), rgba(246,251,255,.92));
}
.woocommerce-info::before { color: #4098ff; }
.woocommerce-info::after  {
  color: #4098ff;
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="%23000" d="M9 8h2v7H9V8Zm1-4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z"/></svg>');
          mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="%23000" d="M9 8h2v7H9V8Zm1-4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z"/></svg>');
}

/* Links inside notices */
.woocommerce-message a,
.woocommerce-error a,
.woocommerce-info a {
  color: inherit;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Buttons that sometimes appear inside notices */
.woocommerce-message .button,
.woocommerce-error .button,
.woocommerce-info .button {
    margin-left: 10px;
    border-radius: 0px;
    padding: 8px 14px;
    background: transparent;
    color: #000;
    margin-top: -10px;
    border: none;
    float: right;
}

/* Slide-in animation */
@keyframes wcNoticeIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Reduced motion users */
@media (prefers-reduced-motion: reduce) {
  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info { animation: none; }
}

/* Dismiss button (if present) */
.woocommerce .notice-dismiss {
  position: absolute;
  top: 10px; right: 12px;
  width: 28px; height: 28px;
  opacity: .6;
  transition: opacity .15s ease;
}
.woocommerce .notice-dismiss:hover { opacity: 1; }


/* Kill Woo's default colored notice borders so only our v2 style shows */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  border: none !important;        /* nuke any border */
  border-left: 0 !important;      /* some themes do left-only */
  border-top: 0 !important;       /* others do top-only */
  outline: none !important;       /* just in case */
  background-clip: padding-box;   /* avoid ghost edges */
}

/* Some themes also re-apply colors with higher-specificity single rules. Neutralize them. */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  border-color: transparent !important;
}


.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  border-top-color: transparent !important;
  border-left-color: transparent !important;
}




/* ===== Woo Notices – Responsive tweaks ===== */

/* <= 1024px: slightly tighter */
@media (max-width: 1024px) {
  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info {
    padding: 16px 16px 16px 56px;
    border-radius: 12px;
  }
  .woocommerce-message::after,
  .woocommerce-error::after,
  .woocommerce-info::after {
    left: 18px;
    width: 22px; height: 22px;
    -webkit-mask-size: 14px 14px; mask-size: 14px 14px;
  }
  .woocommerce-message::before,
  .woocommerce-error::before,
  .woocommerce-info::before { width: 6px; }
}

/* <= 768px: compact layout, button stacks, larger tap targets */
@media (max-width: 768px) {
  /* wrapper breathing space */
  .woocommerce-notices-wrapper { padding: 0 16px; }

  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info {
    padding: 14px 14px 14px 14px;
    margin: 12px 0;
            text-align: center;
    line-height: 1.45;
    box-shadow:
      0 1px 0 rgba(255,255,255,.7) inset,
      0 8px 16px rgba(0,0,0,.06),
      0 18px 34px rgba(0,0,0,.10);
  }

  /* icon + accent slightly smaller */
  .woocommerce-message::before,
  .woocommerce-error::before,
  .woocommerce-info::before { width: 5px; }
  .woocommerce-message::after,
  .woocommerce-error::after,
  .woocommerce-info::after {
    left: 14px;
    width: 20px; height: 20px;
    -webkit-mask-size: 12px 12px; mask-size: 12px 12px;
    box-shadow: 0 4px 8px rgba(0,0,0,.10);
  }

  /* UL-type notices spacing */
  .woocommerce-error,
  .woocommerce-info { padding-left: 50px; }
  .woocommerce-error li + li,
  .woocommerce-info li + li { margin-top: 4px; }

  /* action buttons: full width under text */
  .woocommerce-message .button,
  .woocommerce-error .button,
  .woocommerce-info .button {
         float: none;
        display: inline-flex
;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin: 10px 0 0 0;
        padding: 7px 10px;
        border-radius: 6px;
        background: none;
        color: #000;
        font-size: 17px;
        font-weight: 400;
  }

 .woocommerce-message::after {
  display: none;
 }

.shop-tools .woocommerce-ordering select.orderby {
  max-width: 172px;
}
.shop-tools {
  padding: 0 8px;
}

.post-type-archive-product .woocommerce-ordering {
  padding-left: 20px;
    padding-right: 0px;
}

.post-type-archive-product .woocommerce-result-count {
  padding-left: 0px;
    padding-right: 0px;
}

.post-type-archive-product ul.products, .tax-product_cat ul.products, .tax-product_tag ul.products {
      padding: 0 8px;
}
.post-type-archive-product ul.products li.product a.button::after, .tax-product_cat ul.products li.product a.button::after, .tax-product_tag ul.products li.product a.button::after {
      width: 45px;
    background-size: 50px 50px;
}

.post-type-archive-product ul.products li.product a.button, .tax-product_cat ul.products li.product a.button, .tax-product_tag ul.products li.product a.button {
      height: 48px;
          padding-left: 25px;
}
}

/* <= 480px: super compact, single-line feel */
@media (max-width: 480px) {
  .woocommerce-notices-wrapper { padding: 0 12px; }
  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info {
    padding: 12px 12px 12px 10px;
    border-radius: 10px;
    margin: 10px 0;
    font-size: 14px;      /* slightly smaller type */
  }
  .woocommerce-message::before,
  .woocommerce-error::before,
  .woocommerce-info::before { width: 4px; }
  .woocommerce-message::after,
  .woocommerce-error::after,
  .woocommerce-info::after {
    left: 12px;
    width: 18px; height: 18px;
    -webkit-mask-size: 11px 11px; mask-size: 11px 11px;
  }

  /* links remain readable */
  .woocommerce-message a,
  .woocommerce-error a,
  .woocommerce-info a {
    text-underline-offset: 1.5px;
    word-break: break-word;
  }
}

/* Reduced motion always respected (already present), keep as is */



/* Shared layout for Related + Upsells */
/* ─────────────────────────────────────────────────────────────
   Related + Upsells GSAP slider (scoped)
   Works with sections that have: .related.products.js-relslider / .upsells.products.js-relslider
────────────────────────────────────────────────────────────── */

/* Section wrapper */
.related.products.js-relslider,
.upsells.products.js-relslider {
  position: relative;
  max-width: 1440px;          /* align with site grid */
  margin: 0 auto 40px;
  padding: 0 12px;
  box-sizing: border-box;
  margin-top: 250px;
}

/* Viewport (clip the moving UL) */
.related.products.js-relslider .rel-viewport,
.upsells.products.js-relslider .rel-viewport {
  overflow: hidden;
  padding: 0 12px;
}

/* Track */
.related.products.js-relslider ul.products,
.upsells.products.js-relslider ul.products {
  display: flex;
  gap: 24px;
  margin: 0;
  padding: 0;               /* edge breathing handled by viewport */
  list-style: none;
  will-change: transform;     /* smoother GSAP transforms */
}

/* Slides (flex basis updated by JS) */
.related.products.js-relslider ul.products > li.product,
.upsells.products.js-relslider ul.products > li.product {
  flex: 0 0 33.3333%;
  max-width: 33.3333%;
  margin: 0 !important;
  box-sizing: border-box;
}

/* Card polish (optional – matches your archive look a bit closer) */
.related.products.js-relslider ul.products > li.product,
.upsells.products.js-relslider ul.products > li.product {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

/* Force square images */
.related.products.js-relslider ul.products > li.product a img,
.upsells.products.js-relslider ul.products > li.product a img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;     /* modern & tidy */
  object-fit: cover;        /* crop nicely */
  height: auto;
  -webkit-user-drag: none;  /* prevent native image drag ghost */
  user-select: none;
  pointer-events: auto;     /* JS will disable while dragging */
}

/* Headings & price centering (keeps things tidy) */
.related.products.js-relslider .woocommerce-loop-product__title,
.upsells.products.js-relslider .woocommerce-loop-product__title {
  text-align: center;
  font-weight: 800;
  margin: 14px 12px 6px;
      text-decoration: none;
}
.related.products.js-relslider .price,
.upsells.products.js-relslider .price {
  text-align: center;
  font-weight: 700;
  margin: 0 12px 16px;
  display: block;
}

.related.products.js-relslider .woocommerce-loop-product__title a,
.upsells.products.js-relslider .woocommerce-loop-product__title a,
.related.products.js-relslider .price a,
.upsells.products.js-relslider .price a {
  text-decoration: none !important;
  color: inherit !important;
}

.related.products.js-relslider .woocommerce-loop-product__title a:hover,
.upsells.products.js-relslider .woocommerce-loop-product__title a:hover,
.related.products.js-relslider .price a:hover,
.upsells.products.js-relslider .price a:hover {
  text-decoration: none !important;
}

/* Remove link underlines inside the related/upsells sliders */
.related.products.js-relslider li.product a,
.upsells.products.js-relslider  li.product a {
  text-decoration: none !important;
  color: inherit;
}

/* Also remove the underline if price uses <ins>/<del> */
.related.products.js-relslider .price a,
.upsells.products.js-relslider  .price a,
.related.products.js-relslider .price ins,
.upsells.products.js-relslider  .price ins,
.related.products.js-relslider .price del,
.upsells.products.js-relslider  .price del {
  text-decoration: none !important;
}

/* (Optional) be extra explicit for the title element */
.related.products.js-relslider .woocommerce-loop-product__title a,
.upsells.products.js-relslider  .woocommerce-loop-product__title a {
  text-decoration: none !important;
}
/* Nav buttons – ONLY your custom SVG inside a round black circle */
.related.products.js-relslider .rel-nav,
.upsells.products.js-relslider .rel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px; height: 44px;
  border: none;
  border-radius: 50%;                 /* round */
  background-color: #000;             /* black circle */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;         /* arrow size */
  cursor: pointer;
  z-index: 2;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
  padding: 0;
  line-height: 0;
}

/* Remove Woo default text/icons */
.related.products.js-relslider .rel-nav::before,
.upsells.products.js-relslider .rel-nav::before,
.related.products.js-relslider .rel-nav::after,
.upsells.products.js-relslider .rel-nav::after {
  content: none !important;
}

/* Specific icons */
.related.products.js-relslider .rel-next,
.upsells.products.js-relslider .rel-next {
  right: 10px;
  background-image: url('https://fvsport.andrihallik.ee/wp-content/themes/fvtheme/assets/icons/arrow-right.svg');
}

.related.products.js-relslider .rel-prev,
.upsells.products.js-relslider .rel-prev {
  left: 10px;
  background-image: url('https://fvsport.andrihallik.ee/wp-content/themes/fvtheme/assets/icons/arrow-right.svg');
  transform: translateY(-50%) rotate(180deg); /* flip arrow */
}

/* Disabled state */
.related.products.js-relslider .rel-nav[disabled],
.upsells.products.js-relslider .rel-nav[disabled] {
  opacity: .35;
  cursor: default;
}

/* While dragging, avoid selecting text/images */
.related.products.is-dragging,
.upsells.products.is-dragging { user-select: none; }
.related.products.is-dragging img,
.upsells.products.is-dragging img { pointer-events: none; }

/* ─── Responsiveness ───────────────────────────────────────── */

@media (max-width: 1024px) {
  .related.products.js-relslider ul.products > li.product,
  .upsells.products.js-relslider ul.products > li.product {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (max-width: 640px) {
  .related.products.js-relslider .rel-viewport,
  .upsells.products.js-relslider .rel-viewport { padding: 0 8px; }

  .related.products.js-relslider ul.products > li.product,
  .upsells.products.js-relslider ul.products > li.product {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* On small screens you may want arrows a bit lower so they don't overlap titles */
  .related.products.js-relslider .rel-nav,
  .upsells.products.js-relslider .rel-nav {
    top: 45%;
  }
}



/* Style "Vaata toodet" buttons in sliders */
.related.products.js-relslider ul.products > li.product .button.view-product,
.upsells.products.js-relslider ul.products > li.product .button.view-product {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-style: italic;
  text-transform: uppercase;
  color: #fff;
  background: #111;
  border: none;
  padding: 14px 22px;
  margin: 0 12px 18px;
  position: relative;
  overflow: hidden;
  text-decoration: none;
  clip-path: polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
  transition: background .25s ease;
  width: calc(100% - 24px); /* match card width minus side margin */
}

/* Arrow box */
.related.products.js-relslider ul.products > li.product .button.view-product::after,
.upsells.products.js-relslider ul.products > li.product .button.view-product::after {
    content: "";
    display: block;
    width: 55px;
    height: 45px;
    /* height: 100%; */
    background: #fff url(https://fvsport.andrihallik.ee/wp-content/themes/fvtheme/assets/icons/light-arrow.svg) no-repeat center center;
    background-size: 49px 49px;
    position: absolute;
    right: 13px;
    transform: skew(-18deg);
    top: 4px;
}

/* Hover */
.related.products.js-relslider ul.products > li.product .button.view-product:hover,
.upsells.products.js-relslider ul.products > li.product .button.view-product:hover {
  background: #000;
}




    @media only screen and (min-device-width: 1200px) and (max-device-width: 1327px){

    .post-type-archive-product ul.products li.product a.button {
      padding-left: 34px;
    }
    }




.is-large.wc-block-cart {
  max-width: 1440px;
  padding: 10px;
}

.is-medium.wc-block-components-sidebar-layout {
  padding: 10px;
}

.is-small.wc-block-components-sidebar-layout {
  padding: 10px;
}




/* WooCommerce checkout button – match “Lisa korvi” style */
.wc-block-cart__submit-button.contained {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 55px;
  background: #000;
  color: #fff !important;
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-decoration: none;
  border: 0;
  transform: skew(-17deg);
  box-shadow: 0 12px 20px rgba(0, 0, 0, .12);
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
  overflow: hidden;
  padding-left: 18px;
}

/* make the text straight again */
.wc-block-cart__submit-button.contained span {
  transform: skew(17deg);
  display: inline-block;
}


/* add arrow icon */
.wc-block-cart__submit-button.contained::before {
content: "";
    display: inline-block;
    width: 60px;
    height: 43px;
    max-height: 50px;
    background: #fff url(https://fvsport.andrihallik.ee/wp-content/themes/fvtheme/assets/icons/light-arrow.svg) no-repeat center center;
    background-size: 58px 58px;
    transform: skew(0deg);
    position: absolute;
    right: 0;
    top: 1px;
    bottom: 1px;
    right: 3px;
    margin: auto;
}

/* hover */
.wc-block-cart__submit-button.contained:hover {
  background: #1a1a1a;
  box-shadow: 0 14px 25px rgba(0, 0, 0, .2);
  transform: skew(-17deg) scale(1.02);
}

.woocommerce-checkout .page-header .container {
  max-width: 1440px!important;
}


@media (max-width: 600px) {
    .is-mobile .wc-block-components-form .wc-block-components-checkout-step:first-of-type {
        padding: 10px;

    }

    .wp-block-woocommerce-checkout-billing-address-block {
      padding: 10px!important;
    }

    .wc-block-components-checkbox label {
      margin-left: 10px;
    }
.is-mobile .wc-block-checkout__terms.wc-block-checkout__terms--with-separator {
  padding: 10px;
}
  }



/* Checkout “Place Order” button – match Lisa Korvi style */
.wc-block-components-checkout-place-order-button.contained {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 55px;
  background: #000;
  color: #fff !important;
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-decoration: none;
  border: 0;
  transform: skew(-17deg);
  box-shadow: 0 12px 20px rgba(0, 0, 0, .12);
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
  overflow: hidden;
  padding-left: 18px;
  cursor: pointer;
}

/* make text straight again */
.wc-block-components-checkout-place-order-button.contained span {
  transform: skew(17deg);
  display: inline-block;
}

/* white arrow box (your version) */
.wc-block-components-checkout-place-order-button.contained::before {
  content: "";
  display: inline-block;
  width: 60px;
  height: 43px;
  max-height: 50px;
  background: #fff url(https://fvsport.andrihallik.ee/wp-content/themes/fvtheme/assets/icons/light-arrow.svg) no-repeat center center;
  background-size: 58px 58px;
  transform: skew(0deg);
  position: absolute;
  right: 3px;
  top: 1px;
  bottom: 1px;
  margin: auto;
}

/* hover */
.wc-block-components-checkout-place-order-button.contained:hover {
  background: #1a1a1a;
  box-shadow: 0 14px 25px rgba(0, 0, 0, .2);
  transform: skew(-17deg) scale(1.02);
}


.cart-title {
    max-width: 1440px;
    margin: auto;
    margin-bottom: 50px;

}

.cart-title h1 {
   font-size: var(--font-size-h3);
}


button#wc_gc_cart_redeem_send {background: #414141;
    border-radius: 0px;
    color: #fff;
    border: 1px solid #414141;}



    .woocommerce-checkout .site-header {
  background-color: #000;
}