/*
Theme Name: DigiField
Author: torosyan.dev
Description: A theme for the DigiField website.
Version: 0.2
Requires at least: 6.0
Tested up to: 6.1
Requires PHP: 7.0
License: Proprietary
Text Domain: digifield
*/

.dgf-no-margin {margin: 0;}

/* single post */
.df-single-root, .df-single-navlinks {
    display: flex;
    max-width: var(--wp--style--global--wide-size);
    margin-left: auto !important;
    margin-right: auto !important;
}

.df-single-navlinks {
    width: 100%;
    justify-content: space-between;
}

.df-single-item {
    flex: 1;
}

@media (max-width : 600px) {
    .df-single-root {
        flex-direction: column;
    }
}

/* TODO there is _definitely_ a way to do this with theme.json */
.wp-block-post-title {
    margin: 0;
}

.df-single-image .wp-post-image {
    border-radius: 44px;
}
.df-single-image {
    flex-basis: 600px;
    flex-grow: revert;
}
.df-single-post {
    min-width: 600px;
}
@media (max-width : 600px) {
    .df-single-image .wp-post-image {
        border-radius: 35px;
    }
    .df-single-post {
        min-width: revert;
    }
}

/* field marker */
.dgf-field:before {
	content: "";
	width: 16px;
	height: 16px;
	background: var(--wp--preset--color--red);
	border-radius: 16px;
    display: inline-block;
    margin-right: 30px;
}

.dgf-field.dgf-red:before {
	background: var(--wp--preset--color--red);
}
.dgf-field.dgf-blue:before {
	background: var(--wp--preset--color--blue);
}
.dgf-field.dgf-yellow:before {
	background: var(--wp--preset--color--yellow);
}

/* field category - this is here because it doesn't look like I can edit just one type of taxonomy term in theme.json */
.dgf-single-field, .dgf-field {
	font-weight: 600;
	font-size: 24px;
	line-height: 29px;
	letter-spacing: 0.17em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary);
}
.dgf-single-field a {
	text-decoration: none;
}

/* navi link */
.wp-block-post-navigation-link a {
	text-transform: uppercase;
	letter-spacing: 0.17em;
	text-decoration: none;
}

.wp-block-post-navigation-link a:hover {
	text-decoration: underline;
}

.df-single-navlinks .wp-block-post-navigation-link {
    flex: 1;
}

.df-single-navlinks .wp-block-post-navigation-link {
	flex-grow: revert;
}

/* portfolio item */
.dgf-portfolio-item li {
  display: inline-block;
  padding: 10px;
}

.dgf-portfolio-item h2 {
  color: var(--wp--preset--color--primary);;
  text-decoration: none;
  font-size: 24px;
}
.dgf-portfolio-item h2 a {
  text-decoration: none;
}

.dgf-portfolio-image {
    width: 330.71px;
    margin: 0;
}
.dgf-portfolio-image img {
    border-radius: 20px;
}

.dgf-portfolio-nt .dgf-portfolio-item li {
    padding: 0;
}

.dgf-portfolio-nt .dgf-portfolio-image {
    height: 500px;
    overflow: hidden;
    width: revert;
}
.dgf-portfolio-nt .dgf-portfolio-image img {
    height: 100%;
    object-fit: cover;
    border-radius: 0;
}

.dgf-portfolio-ht .dgf-portfolio-image img {
    transition: all 0.3s;
    -webkit-filter: brightness(100%);
    -moz-filter: brightness(100%);
    -o-filter: brightness(100%);
    -ms-filter: brightness(100%);
    filter: brightness(100%);
}

.dgf-portfolio-ht .dgf-portfolio-item li {
    position: relative;
}

.dgf-portfolio-ht .dgf-portfolio-text {
    position: absolute;
    z-index: 1;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.dgf-portfolio-text .wp-block-post-title {
    text-transform: uppercase;
    letter-spacing: 0.17em;
}

.dgf-portfolio-text .wp-block-post-title, .dgf-portfolio-text .wp-block-post-excerpt {
    color: #00000000;
    overflow: hidden;
    pointer-events: none;
    transition: color 0.3s;
}

/* anims for the above */
.dgf-portfolio-ht .wp-block-post:hover .dgf-portfolio-image img {
    height: 135%;
    -webkit-filter: brightness(60%);
    -moz-filter: brightness(60%);
    -o-filter: brightness(60%);
    -ms-filter: brightness(60%);
    filter: brightness(60%);
}

.dgf-portfolio-ht .wp-block-post:hover .wp-block-post-title {
    color: var(--wp--preset--color--primary);
}

.dgf-portfolio-ht .wp-block-post:hover .wp-block-post-excerpt {
    color: var(--wp--preset--color--primary);
    /*color: var(--wp--preset--color--secondary);*/
}

/* header on mobile */
@media (max-width : 600px) {
    .dgf-header {
        padding-left: 0;
        text-align: center;
    }
}

.fullwidth {width: 100%;}

/* new template video */
.dgf-hero2-video-ctr {
  overflow: hidden;
  position: relative;
  min-height: 750px;
  background: black;
  border-radius: 24px;
}

.dgf-hero2-video-ctr video {
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  filter: brightness(50%);
  -webkit-filter: brightness(50%);
  object-fit: cover;
}

.dgf-hero2-columns {
    min-height: 750px;
    margin: 0;
}

.dgf-hero2-video-ctr .dgf-hero2-on-video {
  z-index: 1;
  padding: 48px;
}

.dgf-hero2-on-video h1, h2 {
  margin: 0;
}

.dgf-hero2-fields > .dgf-field {
  display: inline;
  padding-right: 50px;
}

.dgf-hero2-field.dgf-field:hover {
  text-decoration: underline;
}

.dgf-hero2-fullscreen, .dgf-hero2-close {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 2;
}

.dgf-hero2-fullscreen img, .dgf-hero2-close img {
    width: 48px;
}
@media (max-width : 600px) {
    .dgf-hero2-fullscreen img {
        width: 36px;
    }
}

.dgf-overlay {
    background-color: #0008;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 1000;
}

.dgf-overlay figure {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    max-width: 1350px;
}

/* transitions */
/* this is necessary to make a smooth fade for text while still allowing some
 * compatibility with WordPress FSE. */
.dgf-trans-hidden    { display: none; }
.dgf-trans-invisible { opacity: 0; }
.dgf-trans-enabled {
    transition: opacity 0.5s;
}

.dgf-404-image {
    width: 50%;
    padding: 10px;
    padding-top: 30px;
}

/* cta card */
.dgf-cta-card p {
  text-transform: uppercase;
  letter-spacing: 0.17em;
}

.dgf-cta-card {
    border-radius: 24px;
    padding: 48px;
}

.dgf-clients .dgf-clients-title {
    padding: 24px;
    text-align: center;
}

.dgf-clients .dgf-clients-image {
    padding: 12px;
}

/*:3*/.cat p::after,.cat p::before{content:":3";color:#00000000;padding:10px}.cat p::after{transition:1s}.cat p:hover::after{color:var(--wp--preset--color--secondary)}