/*
Theme Name: clu.pl
Author: clu.
Author URI: http://clu.pl/
Description: clu. responsive HTML5 theme
Version: 1.0
*/
/*** Reset ***/
:root {
  hanging-punctuation: first last;
}
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font: inherit;
}
body {
  min-height: 100svh;
}
img {
  height: auto;
  vertical-align: middle;
  font-style: italic;
  background-repeat: no-repeat;
  background-size: cover;
  shape-margin: 0.75rem;
}
img,
picture,
svg,
video {
  display: block;
  max-width: 100%;
}
input,
button,
textarea,
select {
  font: inherit;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
}
p {
  max-width: 75ch;
  text-wrap: pretty;
  line-height: 1.4;
}
@media (prefers-reduced-motion: no-preference) {
  :has(:target) {
    scroll-behavior: smooth;
    scroll-padding-top: var(--scroll-padding-top);
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
    transition: none;
  }
}
body {
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
/*** Utopia ***/
/* @link https://utopia.fyi/type/calculator?c=320,21,1.2,2560,36,1.5,4,2,768-1920&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
:root {
  --step--2: clamp(0.9115rem, 0.8988rem + 0.0632vi, 1rem);
  --step--1: clamp(1.0938rem, 1.0357rem + 0.2902vi, 1.5rem);
  --step-0: clamp(1.3125rem, 1.1786rem + 0.6696vi, 2.25rem);
  --step-1: clamp(1.575rem, 1.3179rem + 1.2857vi, 3.375rem);
  --step-2: clamp(1.89rem, 1.4368rem + 2.2661vi, 5.0625rem);
  --step-3: clamp(2.268rem, 1.5072rem + 3.8041vi, 7.5938rem);
  --step-4: clamp(2.7216rem, 1.4832rem + 6.1922vi, 11.3906rem);
}
/* @link https://utopia.fyi/clamp/calculator?a=320,1920,16—100 */
:root {
  --fluid-16-100: clamp(1rem, -0.05rem + 5.25vi, 6.25rem);
}
/* @link https://utopia.fyi/clamp/calculator?a=320,1920,80—180 */
:root {
  --fluid-80-180: clamp(5rem, 3.75rem + 6.25vi, 11.25rem);
}
/* @link https://utopia.fyi/clamp/calculator?a=320,1920,80—120 */
:root {
  --fluid-80-120: clamp(5rem, 4.5rem + 2.5vi, 7.5rem);
}
.h1 {
  font-size: 140px;
  font-size: var(--step-4);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 0.15em;
}
@media (max-width: 400px) {
  .h1 {
    font-size: 2.3rem;
  }
}
.h2 {
  font-size: var(--step-3);
  font-weight: 700;
  margin-bottom: 0.15em;
}
.h3 {
  font-size: var(--step-2);
  font-weight: 700;
  margin-bottom: 0.15em;
}
body {
  font-size: var(--step-0);
}
body > header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--fluid-80-180);
  display: grid;
  align-content: center;
}
body > header a.site-logo {
  display: block;
  margin-left: calc(var(--fluid-16-100) / -2);
  width: calc(var(--fluid-80-120) + var(--fluid-16-100));
  height: var(--fluid-80-180);
  background: transparent no-repeat center center / var(--fluid-80-120);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 114.85 61.67'%3E%3Cg fill='%23ffffff'%3E%3Cpath d='m58.63 18.26 13.17-1.78v18.5a9.31 9.31 0 0 0 1.78 6.05c2.13 2.49 4.62 2.84 7.47 2.13 2.5-.35 4.27-2.84 4.63-5.69a21.35 21.35 0 0 0 .35-2.85V14.7l13.52-1.78v22.42c-.35 10.32-7.47 18.5-18.14 19.21-6.76.71-13.17-.71-18.15-6.05a17.8 17.8 0 0 1-4.63-12.1ZM50.7 0v38.19a9.64 9.64 0 0 0 .36 1.92 4.03 4.03 0 0 0 4.63 3.53l-3.56 10.91c-6.76-.32-12.45-2.89-14.23-8.98a17.12 17.12 0 0 1-.36-4.82V1.6ZM29.2 11.5l-1.43 11.38c-9.6 1.07-11.74 2.14-13.88 5.34a10.83 10.83 0 0 0 .36 11.74 9.95 9.95 0 0 0 9.96 3.92 13 13 0 0 0 6.76-3.2L34.89 51a16.72 16.72 0 0 1-5.7 2.84c-6.76 2.14-13.52 1.78-19.57-2.13a21 21 0 0 1 1.07-35.94 29.07 29.07 0 0 1 11.74-3.2Z'/%3E%3Cpath d='M114.85 54.55a7.14 7.14 0 0 1-7.11 7.12 7.45 7.45 0 0 1-7.12-7.47 7.14 7.14 0 0 1 7.11-7.12 7.22 7.22 0 0 1 7.12 7.47Z' data-name='Path 4'/%3E%3C/g%3E%3C/svg%3E");
  position: relative;
  top: var(--logo-offset);
  transition: 500ms all cubic-bezier(0.6, 1, 0.6, 1);
}
body > header a.site-logo.logo-invert {
  filter: invert();
}
body > header a.site-logo span {
  display: none;
}
@media (min-width: 992px) {
  body > header a.site-logo {
    margin-left: calc(var(--fluid-16-100) / -1);
  }
}
/*** Settings ***/
/*** Defs ***/
body {
  background: #FFFFFF;
  color: #1A2129;
}
.text-1st {
  color: #D0FF00;
}
.text-2nd {
  color: #2D0DFF;
}
.text-3rd {
  color: #1A2129;
}
.text-white {
  color: #FFFFFF;
}
.background-1st {
  background: #D0FF00;
  color: #1A2129;
}
.background-2nd {
  background: #2D0DFF;
  color: #FFF;
}
.background-3rd {
  background: #1A2129;
  color: #FFF;
}
.background-4th {
  background: #FFFFFF;
  color: #1A2129;
}
/*** Skeleton ***/
.content-grid,
.full-width {
  display: grid;
  grid-template-columns: [full-width-start] var(--fluid-16-100) [content-start] 1fr [content-end] var(--fluid-16-100) [full-width-end];
  align-items: start;
}
.content-grid > *,
.full-width > * {
  grid-column: content;
}
.content-grid > .full-width,
.full-width > .full-width {
  grid-column: full-width;
}
.container {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 0 1em;
}
.container > * {
  grid-column: 1/12;
}
@media (min-width: 992px) {
  .container > * {
    grid-column: 2/12;
  }
}
.section-intro {
  padding-block: var(--fluid-80-180);
  align-items: center;
  min-height: 100svh;
}
.fp-offer {
  padding-block: var(--fluid-80-180);
}
.fp-offer h1 {
  margin-bottom: var(--fluid-16-100);
}
.fp-offer .desc {
  font-size: var(--step--1);
}
@media (min-width: 992px) {
  .fp-offer .desc {
    grid-column: 5/12;
  }
}
.text-side {
  font-size: var(--step--2);
  opacity: 0.5;
}
@media (min-width: 992px) {
  .text-side {
    grid-column: 8/12;
  }
}
.footer {
  padding-block: 6rem;
}
