/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* variables (edit here)*/

:root {
    /* Global Padding Variables - Editable */
    /* Left and Right Padding All /Sections/Containers*/
    --fluid-side-padding-min: 1.25rem; /* 20px */
    --fluid-side-padding-max: 5rem;   /* 80px */

    /* Top and Bottom Padding All Containers*/
    --section-xxl-padding-min: 3.75rem; /* 60px */
    --section-xxl-padding-max: 10rem; /* 160px */ 
  
    --section-xl-padding-min: 3.125rem; /* 50px */
    --section-xl-padding-max: 7.5rem; /* 120px */
  
    --section-l-padding-min: 2.5rem; /* 40px */
    --section-l-padding-max: 6.25rem; /* 100px */
  
    --section-m-padding-min: 2.5rem; /* 40px */
    --section-m-padding-max: 5rem; /* 80px */
  
    --section-s-padding-min: 2.5rem; /* 40px */
    --section-s-padding-max: 3.75rem; /* 60px */
  
    --section-xs-padding-min: 2.5rem; /* 40px */
    --section-xs-padding-max: 2.5rem; /* 40px */
  
    --section-xxs-padding-min: 1.5rem; /* 24px */
    --section-xxs-padding-max: 1.5rem; /* 24px */
    
    --section-header-padding-min: 1rem; /* 16px */
    --section-header-padding-max: 1rem; /* 16px */

  
    /* Hero Sections Height Variable */
    --section-hero-height: 100vh; /* 100% the screen height */
  
    /* Offset Padding for Overlay Headers */
    --section-offset-header: 80px; /* Adjust to the overlay header's negative margin */

    /* Width For Narrow Sections*/
    --section-narrow: 62.5rem; /* 1000px */
    --section-narrow-xs: 45rem; /* 720px */
  }


/* CSS Template (do not edit below) */
  
  
	  /* Section/Container Padding - Fluid Variants */
		.section-xxl {
		  padding-top: clamp(var(--section-xxl-padding-min), 6.522vw - 0.217rem, var(--section-xxl-padding-max));
		  padding-bottom: clamp(var(--section-xxl-padding-min), 6.522vw - 0.217rem, var(--section-xxl-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-xl {
		  padding-top: clamp(var(--section-xl-padding-min), 6.522vw - 0.217rem, var(--section-xl-padding-max));
		  padding-bottom: clamp(var(--section-xl-padding-min), 6.522vw - 0.217rem, var(--section-xl-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-l {
		  padding-top: clamp(var(--section-l-padding-min), 6.522vw - 0.217rem, var(--section-l-padding-max));
		  padding-bottom: clamp(var(--section-l-padding-min), 6.522vw - 0.217rem, var(--section-l-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-m {
		  padding-top: clamp(var(--section-m-padding-min), 6.522vw - 0.217rem, var(--section-m-padding-max));
		  padding-bottom: clamp(var(--section-m-padding-min), 6.522vw - 0.217rem, var(--section-m-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-s {
		  padding-top: clamp(var(--section-s-padding-min), 6.522vw - 0.217rem, var(--section-s-padding-max));
		  padding-bottom: clamp(var(--section-s-padding-min), 6.522vw - 0.217rem, var(--section-s-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-xs {
		  padding-top: clamp(var(--section-xs-padding-min), 6.522vw - 0.217rem, var(--section-xs-padding-max));
		  padding-bottom: clamp(var(--section-xs-padding-min), 6.522vw - 0.217rem, var(--section-xs-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-xxs {
		  padding-top: clamp(var(--section-xxs-padding-min), 6.522vw - 0.217rem, var(--section-xxs-padding-max));
		  padding-bottom: clamp(var(--section-xxs-padding-min), 6.522vw - 0.217rem, var(--section-xxs-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-header {
		  padding-top: clamp(var(--section-header-padding-min), 6.522vw - 0.217rem, var(--section-header-padding-max));
		  padding-bottom: clamp(var(--section-header-padding-min), 6.522vw - 0.217rem, var(--section-header-padding-max));
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}

		.section-header-xs {
		  padding-left: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		  padding-right: clamp(var(--fluid-side-padding-min), 6.522vw - 0.217rem, var(--fluid-side-padding-max)) !important;
		}


  
  /* Hero Container/Sections Height */
  .section-hero {
    min-height: var(--section-hero-height)!important;
  }

  .section-hero .e-con-inner {
    justify-content: center!important;
}
  
  /* Full Width Sections - No Side Padding */

  .section-full div {
    max-width: 100%!important;
  }
  

  /* Narrow Sections */
  .section-narrow .e-con-inner {
    max-width: var(--section-narrow)!important;
  }

  .section-narrow-xs .e-con-inner {
    max-width: var(--section-narrow-xs)!important;
  }


  /* Offset Padding for Overlay Headers */
  .section-offset {
    padding-top: calc(var(--section-offset-header) + var(--section-xxl-padding-min));
  }

.mb-0 p:last-of-type {
    margin-bottom: 0;
}

html {
    position: relative;
    min-height: 100%;
}

main {
	flex-grow: 1;
}


body {
    background: linear-gradient(135deg, #FFFFFF, #F4F4F4);
    position: relative;
    overflow-x: hidden;
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* Přidání zrnitosti přes pseudoelement */
body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(255 255 255 / 0%);
    background-image: url(https://weby.creado.cz/wp-content/uploads/2025/01/noise_pattern_2.jpg);
    background-size: 400px;
    background-blend-mode: screen;
    opacity: 0.4;
    z-index: -1;
}

/* Barevné plochy */
body::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;	
	background: radial-gradient(circle at 140% -15%, var(--e-global-color-primary) -10%, transparent 45%),
				radial-gradient(circle at -57% 50%, var(--e-global-color-primary) -10%, transparent 50%),
				radial-gradient(circle at 120% 88%, var(--e-global-color-primary) -15%, transparent 30%);
    mix-blend-mode: normal;
    opacity: 0.7;
	z-index: -1;
}

.navbar.elementor-sticky--effects .e-con-inner {
    padding: 20px 0 20px 0 !important;
}

.navbar.elementor-sticky--effects {
    background: #f4f4f4;
	border-radius: 0px 0px 10px 10px;
}

.arrow:hover {
	cursor: pointer;
}

.service .service-image {
	display: none;
}

.service:hover .service-image {
	display: initial;
}

.portoflio-item .project-description, .portoflio-item .project-arrow {
	display: none;
}

.portoflio-item:hover .project-description, .portoflio-item:hover .project-arrow {
	display: initial;
}

.elementor-icon.elementor-social-icon:hover {
    font-size: var(--icon-size, 25px) !important;
}


.card{
  --pad:30px;
  --mask:url("https://weby.creado.cz/wp-content/uploads/2025/08/remeslnik.png");
  --shape-w:42%;
  --shape-ratio:3/4;

  position:relative;
  padding:var(--pad);
  border:4px solid #2F57FF;
  border-radius:26px;
  background:#fff;
  overflow:hidden;
}

/* vypneme flex chování uvnitř */
.card .content{
  display:block;          /* důležité pro float a shape-outside */
  position:relative;
  z-index:1;              /* text nad fotkou */
}

/* neviditelný tvar pro obtékání textu */
.card .shape{
  float:right;
  width:var(--shape-w);           /* responsivní šířka */
  aspect-ratio:var(--shape-ratio);/* drží výšku boxu */
  shape-outside:var(--mask);
  shape-image-threshold:.6;
  shape-margin:12px;
}

/* vyčištění floatu */
.card .content::after{ content:""; display:block; clear:both; }

/* fotka přiražená k rámu dole vpravo a rozumně velká */
.card .photo{
  position:absolute;
  right:calc(var(--pad) * -1);
  bottom:calc(var(--pad) * -1);
  z-index:0;
  pointer-events:none;
}
.card .photo img{
  display:block;
  width:clamp(240px, 36vw, 420px);  /* zmenší fotku na reálnou velikost */
  height:auto;
}

/* responsivní ladění */
@media (max-width:1024px){
  .card{ --shape-w:48%; }
}
@media (max-width:768px){
  .card{ --shape-w:60%; }
  .card .photo img{ width:clamp(220px, 44vw, 340px); }
}
@media (max-width:480px){
  .card{ --shape-w:70%; }
  .card .photo img{ width:clamp(200px, 58vw, 300px); }
}