/*
    Theme Name: MHL-i teema 2026; 
    Author: Valju Aloel
    Author URI: http://aloel.ee/
    Description: MHL-Snow täielikult oma teema
    Version: 7.0.0
*/

@font-face {
font-family:"sofia-pro-variable";
src:url("https://use.typekit.net/af/f610d8/0000000000000000774fa8bd/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/f610d8/0000000000000000774fa8bd/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/f610d8/0000000000000000774fa8bd/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display:swap;font-style:normal;font-weight:100 900;font-stretch:normal;
}


:root {
  --mhl-sinine: #2A78BE;
  --heledam-0: #2e5582;
  --heledam-1: #6d98cf;
  --heledam-2: #a0b9df;
  --heledam-3: #d0dbef;
  --valge: #ffffff;





  --supersnow: #ff7b02;
  --tume-hall: #222E2F;
  --hele-hall: #ffffffb0;

  --serv: calc(8% - 1.1rem);
  --laius: 1050px;
  --kasti-pilt: 100px;

  --sinepikollane: #BF862A;
  --uudis-kollane: #f1c838;

  --radius: .6px;
  --shadow: 0 12px 28px hsl(214 30% 10% / 0.12);
  --container: min(70rem, 100vw);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  color-scheme: light !important;
  height: 100dvh;


background: url('/assets/images/proov.avif'), linear-gradient(to bottom, var(--heledam-0), var(--heledam-1));
  background-repeat: no-repeat;
  background-size: 100% auto;        /* laius 100%, kõrgus auto */
  background-position: bottom center; /* joondus alla */
  background-attachment: fixed;

  scrollbar-width: thin;
  scrollbar-color: #8aa2c4 transparent;
  scroll-behavior: smooth;
  transition: height 0.66s ease-out;
  scroll-padding-top: 0;
}

body {
  margin-inline: auto;
  margin-block: 0;
  min-height: 100lvh;
  font-family: 'sofia-pro-variable', system-ui;
  font-weight: 400;
  background: transparent;
  inline-size: var(--container);

}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 300;
  line-height: 1.2;
  margin: 1rem 0 0.6rem;
  color: var(--mhl-sinine);
}

h1 {
  font-size: 2.4rem;
  font-weight: 300;
  letter-spacing: 0.02em;
}

h2 {
  font-size: 1.6rem;
  font-weight: 300;
  letter-spacing: 0.01em;
}

h3 {
  font-size: 1.5rem;
  font-weight: 400;
  letter-spacing: 0.01em;
}

h4 {
  font-size: 1.35rem;
  font-weight: 400;
  letter-spacing: 0.005em;
}

h5 {
  font-size: 1.1rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

h6 {
  font-size: 1rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

p {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--tume-hall);
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: var(--mhl-sinine);
  text-decoration: none;
}

nav a,
nav a:visited {
  color: #000;
}

/* Lehe struktuur */

.page-shell {
	display: grid;
	grid-template-columns: auto auto;
	margin-block: 1rem;
	gap: .5rem;
  justify-content: center;
}

.site-main,
.site-footer {
  grid-column: 1/-1;
  padding-block-start: calc(100dvh - 530px);
}

.site-header {
  grid-row: 2;
  grid-column: 1/-1;

}

/* keelevahetus, logo ja kontakt */

.language-switcher {
  display: flex;
  gap: .5rem;
  margin-inline: auto;
}

.language-link {
	border-block-end: var(--hele-hall) 2px solid;
	display: grid;
	place-content: center;
	height: 48px;
	border-radius: 50%;
	aspect-ratio: 1;
	box-sizing: border-box;
}

.language-link.is-active {
  border-color: var(--uudis-kollane);
}

.nav-link-contact {
	margin-inline: auto;
	display: flex;
	padding-inline: .8rem;
	align-items: center;
	text-transform: uppercase;
	border-radius: 999px;
	color: #fff;
	height: 48px;
	box-sizing: border-box;
	border-block-end: 2px solid var(--hele-hall);
}

.nav-link-contact:hover,
.nav-link-contact:active {
  color: var(--uudis-kollane);
  
}

.nav-link-contact:visited {
  color: var(--uudis-kollane);
}

.brand * {
  margin-block: 0;
}

.brand {
	container-type: inline-size;
	display: grid;
	margin-inline: auto;
	max-width: 350px;
	padding-left: 2cqw;
	padding-block: 1rem;
}

.brand-description {
	text-align: end;
	margin-inline-end: 12.5cqw;
	font-size: 2.1cqw;
	margin-block-end: -10cqw;
}

.brand-name {
  font-size: 18cqw;
  font-family: 'sofia-pro-variable';
  font-weight: 100;
  display: flex;
  align-content: end;
  justify-content: center;
  /* text-shadow: 1rem 0 50px #fff, 0 0 1px #fff; */
  color: var(--hele-hall);
  text-wrap: nowrap;
  line-height: 18cqw;
  letter-spacing: -0.029em;

  &::after {
mask: url(/assets/images/mhl-snow-helves.svg) no-repeat center;
    mask-size: contain;
    width: 10cqw;
    aspect-ratio: 1;
    align-self: start;
    content: ' ';
    background-repeat: no-repeat;
    background-color: var(--hele-hall);
    animation: rotating 18s linear infinite;

  }

}

@keyframes rotating {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@media screen and (min-width: 500px) {

  .page-shell {
	grid-template-columns: auto auto 1fr;

}

  .brand {
    margin-inline-start: auto;
    margin-inline-end: 1rem;
    margin-block: 1rem;
  }

  .language-switcher,
  .site-header,
  .nav-link-contact {
    grid-row: 1;
    align-items: center;
  }

  .language-switcher {
    margin-inline-start: 1rem;
  }

  .site-header {
    grid-column: 3;
  }

  .nav-link-contact {
    align-self: center;
    grid-column: 2;
  }



}



/* Peamenüü */

.content-nav {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 6px;
	scroll-margin-block-start: 10vh;
	margin-block: 5vh;
}

.content-nav-link {
	height: 300px;
	display: grid;
	align-items: center;
	text-transform: uppercase;
	background: var(--heledam-0);
	box-shadow: 0 120px var(--hele-hall) inset, 2px 2px 4px #222E2F4D;
	padding-inline: .8rem;
	text-align: start;
	box-sizing: border-box;
}
nav a.content-nav-link {
  color: var(--hele-hall);
}

.content-nav-link::before {
	content: ' ';
	background-size: cover;
	width: 80%;
	aspect-ratio: 1;
	background-position: center;
	border-radius: 50%;
	margin-inline: auto;
}

#nav-item-home::before {
  background-color: #F1C838;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cdefs%3E%3CradialGradient id='a' cx='800' cy='371' r='70%25' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23F1C838'/%3E%3Cstop offset='1' stop-color='%23BF862A'/%3E%3C/radialGradient%3E%3CradialGradient id='b' cx='800' cy='371' r='60%25' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23F1C838' stop-opacity='1'/%3E%3Cstop offset='1' stop-color='%23F1C838' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='1600' height='900'/%3E%3Cg fill='none' stroke='%23F1C838' stroke-width='10' stroke-miterlimit='10' stroke-opacity='.5'%3E%3Cpolygon points='2277.4 1152 800-1407-677.4 1152'/%3E%3Cpolygon points='800-1372.9-648.8 1136.5 2248.8 1136.5'/%3E%3Cpolygon points='800-1338.8-620.2 1121.1 2220.2 1121.1'/%3E%3Cpolygon points='800-1304.7-591.6 1105.6 2191.6 1105.6'/%3E%3Cpolygon points='800-1270.6-563 1090.2 2163 1090.2'/%3E%3Cpolygon points='800-1236.5-534.4 1074.7 2134.4 1074.7'/%3E%3Cpolygon points='800-1202.4-505.8 1059.3 2105.8 1059.3'/%3E%3Cpolygon points='800-1168.3-477.2 1043.8 2077.2 1043.8'/%3E%3Cpolygon points='800-1134.2-448.6 1028.4 2048.6 1028.4'/%3E%3Cpolygon points='800-1100.1-420 1012.9 2020 1012.9'/%3E%3Cpolygon points='800-1066-391.4 997.5 1991.4 997.5'/%3E%3Cpolygon points='800-1031.9-362.7 982 1962.7 982'/%3E%3Cpolygon points='800-997.8-334.1 966.6 1934.1 966.6'/%3E%3Cpolygon points='800-963.7-305.5 951.1 1905.5 951.1'/%3E%3Cpolygon points='800-929.6-276.9 935.7 1876.9 935.7'/%3E%3Cpolygon points='800-895.5-248.3 920.2 1848.3 920.2'/%3E%3Cpolygon points='800-861.4-219.7 904.7 1819.7 904.7'/%3E%3Cpolygon points='800-827.3-191.1 889.3 1791.1 889.3'/%3E%3Cpolygon points='800-793.2-162.5 873.8 1762.5 873.8'/%3E%3Cpolygon points='800-759.1-133.9 858.4 1733.9 858.4'/%3E%3Cpolygon points='800-725-105.3 842.9 1705.3 842.9'/%3E%3Cpolygon points='800-690.9-76.7 827.5 1676.7 827.5'/%3E%3Cpolygon points='800-656.8-48.1 812 1648.1 812'/%3E%3Cpolygon points='800-622.7-19.4 796.6 1619.4 796.6'/%3E%3Cpolygon points='800-588.6 9.2 781.1 1590.8 781.1'/%3E%3Cpolygon points='800-554.5 37.8 765.7 1562.2 765.7'/%3E%3Cpolygon points='800-520.5 66.4 750.2 1533.6 750.2'/%3E%3Cpolygon points='800-486.4 95 734.8 1505 734.8'/%3E%3Cpolygon points='800-452.3 123.6 719.3 1476.4 719.3'/%3E%3Cpolygon points='800-418.2 152.2 703.9 1447.8 703.9'/%3E%3Cpolygon points='800-384.1 180.8 688.4 1419.2 688.4'/%3E%3Cpolygon points='800-350 209.4 673 1390.6 673'/%3E%3Cpolygon points='800-315.9 238 657.5 1362 657.5'/%3E%3Cpolygon points='800-281.8 266.6 642 1333.4 642'/%3E%3Cpolygon points='800-247.7 295.2 626.6 1304.8 626.6'/%3E%3Cpolygon points='800-213.6 323.9 611.1 1276.1 611.1'/%3E%3Cpolygon points='800-179.5 352.5 595.7 1247.5 595.7'/%3E%3Cpolygon points='800-145.4 381.1 580.2 1218.9 580.2'/%3E%3Cpolygon points='800-111.3 409.7 564.8 1190.3 564.8'/%3E%3Cpolygon points='800-77.2 438.3 549.3 1161.7 549.3'/%3E%3Cpolygon points='800-43.1 466.9 533.9 1133.1 533.9'/%3E%3Cpolygon points='800-9 495.5 518.4 1104.5 518.4'/%3E%3Cpolygon points='800 25.1 524.1 503 1075.9 503'/%3E%3Cpolygon points='800 59.2 552.7 487.5 1047.3 487.5'/%3E%3Cpolygon points='800 93.3 581.3 472.1 1018.7 472.1'/%3E%3Cpolygon points='800 127.4 609.9 456.6 990.1 456.6'/%3E%3Cpolygon points='800 161.5 638.5 441.2 961.5 441.2'/%3E%3Cpolygon points='800 195.6 667.2 425.7 932.8 425.7'/%3E%3Cpolygon points='800 229.7 695.8 410.2 904.2 410.2'/%3E%3Cpolygon points='800 263.8 724.4 394.8 875.6 394.8'/%3E%3Cpolygon points='800 297.9 753 379.3 847 379.3'/%3E%3Cpolygon points='800 332 781.6 363.9 818.4 363.9'/%3E%3C/g%3E%3Crect fill-opacity='.5' fill='url(%23b)' width='1600' height='900'/%3E%3C/svg%3E");
  background-attachment: fixed;
  background-size: cover;
  display: grid;
  place-content: center;
  font-size: .6rem;
  padding: .7rem;
  text-align: center;
  color: #fff;
}

html[lang="et"] #nav-item-home::before {
  content: 'Mis on uut?';
}

html[lang="lv"] #nav-item-home::before {
  content: 'Kas ir jauns?';
}

html[lang="lt"] #nav-item-home::before {
  content: 'Kas yra naujo?';
}



#nav-item-006::before {
  background-image: url(/assets/images/kunstlumetorustik-2.avif);
}

#nav-item-005::before {
  background-image: url(/assets/images/kasutatud-lumekahur-1.avif);
}

#nav-item-004::before {
  background-image: url(/assets/images/referentsid-2.avif);
}

#nav-item-007::before {
  background-image: url(https://mhl.ee/wp-content/themes/mhl-lihtne/pildid/supersnow-or.jpg);
  background-size: contain;
  background-repeat: no-repeat;
  background-color: var(--supersnow);
}


/* Sisu */

article {
  margin-block: .1rem;
  padding-block: 1.5rem;
  padding-inline: var(--serv);
  background: #ffffffe8;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  line-height: 1.7;
}

.oluline {
	color: var(--mhl-sinine);
	font-weight: 600;
}

article img {

	mix-blend-mode: darken;

}

p:has(img) {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1rem;
}

p img {
    height: 100px;
    mix-blend-mode: darken;    
}

.news-date {
  visibility: hidden;
}

form p {
  display: grid;
}

.site-header .container {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-block: 1rem;
}

dt {
  color: var(--mhl-sinine);
  text-transform: uppercase;
  font-size: 1.2rem;
}

dd+dt {
  margin-block-start: 2rem;
}

dd img {
  max-height: 500px;
  max-width: 100%;
  alignment-baseline: text-top;
  padding-inline: 1rem;
}

dt::before,
h3::before,
h4::before {
  content: ' ';
  display: inline-flex;
  width: 1.5rem;
  aspect-ratio: 1;
  background-image: url(/assets/images/mhl-snow-helves.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin-inline-end: .6rem;
  align-items: revert;
  padding-block-end: .3rem;
  box-sizing: border-box;
}

.back-home {
  display: none;
}


.embed-wrap {
  margin-block: 1.5rem;
}

.embed-wrap-facebook {
  inline-size: fit-content;
  margin-inline: auto;
  padding: .5rem;
  background: rgb(255 255 255 / 0.92);
  border-radius: 1rem;
  box-shadow: 0 1rem 2.5rem rgb(34 46 47 / 0.12);
}

.embed-frame {
  display: block;
  inline-size: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: .75rem;
  background: #fff;
}

.embed-wrap.is-video-portrait .embed-frame {
	aspect-ratio: 9 / 16;
}

.embed-wrap.is-video-square .embed-frame {
	aspect-ratio: 1 / 1;
}

.embed-group {
  margin-block: 1.5rem;
}

.embed-group-facebook {
  inline-size: fit-content;
  max-inline-size: 100%;
  margin-inline: auto;
  padding: .5rem;
  background: rgb(255 255 255 / 0.92);
  border-radius: 1rem;
  box-shadow: 0 1rem 2.5rem rgb(34 46 47 / 0.12);
}

.embed-group-facebook-portrait {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem;
}

.embed-group-item-facebook {
  inline-size: min(267px, 100%);
  flex: 0 1 267px;
}

.embed-group-item-facebook .embed-frame {
	inline-size: 100% !important;
	block-size: auto !important;
	max-inline-size: 100%;
}



.kõrvuti {
	display: grid;
	width: 100%;
	grid-auto-flow: column;
	align-items: stretch;
	gap: .4rem;
	margin-block: .4rem;

   img {
	width: 100%;
	height: clamp(180px, 50cqw, 450px);
	object-fit: cover;
}
}






/* Supersnow lehesisene navigeerimine */


.supersnow-lingid {
  margin-inline: 0;
  background: transparent;
  display: grid;
  align-items: center;
  justify-content: center;
  font-weight: 200;
  border-inline: 12px solid var(--supersnow);
  padding-inline-end: 1rem;
  margin-block-end: 1rem;
  text-align: center;
  padding-block-end: 1rem;

  @media (width > 980px) {

    display: flex;
    justify-content: space-evenly;
    padding-block-end: 0;

  }

  a:link,
  a:visited {
    text-decoration: none;
    font-size: 1.2rem;
    color: #404040;
  }

  &::before {
    background: url(/assets/images/Supersnow-logo-dark.svg) no-repeat;
    display: flex;
    content: ' ';
    background-position: center;
    height: 69px;
    width: 291px;
  }
}
















/* Jalus */

.site-footer {
  margin-block: 2rem;
}

.site-footer-grid {
  display: grid;
  gap: 2rem;
  background: #e3e4e9d4;
  padding: 1rem;
  text-align: center;
}

.site-footer-nav {
  border-block-start: 1px solid var(--tume-hall);
}

.site-footer-company p {
  margin: 0;
}

.site-footer-company-name {
  margin-block-end: .25rem;
}

.site-footer-links {
  list-style: none;
  padding: 0;
  margin: .75rem 0 0;
  display: grid;
  gap: .5rem .9rem;
}

.site-footer-bottom {
  padding-block: 1rem;
  padding-inline-start: var(--serv);
}

.contact-row--with-before::before {
  content: attr(data-label) ': ';
}



@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}