@charset "UTF-8";
/*
Theme Name: PORTFOLIO Child
Theme URI: https://ss724753.stars.ne.jp/
Author: Yuri Toriyama
Author URI: https://ss724753.stars.ne.jp/
Description: PORTFOLIO の子テーマ
Version: 1.3.2
Template: parent-theme
Text Domain: my-parent-theme-child
*/
:root {
  /* spacing */
  --spacing-unit: 0.5rem;
  --spacing-xs: calc(var(--spacing-unit) / 2);
  --spacing-sm: var(--spacing-unit);
  --spacing-md: calc(var(--spacing-unit) * 2);
  --spacing-lg: calc(var(--spacing-unit) * 3);
  --spacing-xl: calc(var(--spacing-unit) * 5);
  --spacing-2xl: calc(var(--spacing-unit) * 8);
  --spacing-3xl: calc(var(--spacing-unit) * 13);
  /* font-size */
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --font-size-3xl: 2.25rem;
  --font-size-4xl: 2.5rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 4rem;
  --font-size-7xl: 6rem;
  --font-size-8xl: 8rem;
  /* color */
  --color-white: #fff;
  --color-black: #222;
  --color-lightgray: lightgray;
  --color-gray: gray;
  --color-lightblue: lightblue;
  --color-blue: blue;
  --color-purple: purple;
  --color-green: green;
  /* transition */
  --transition-normal: 0.3s;
  /* border-radius */
  --border-radius-xs: 4px;
  --border-radius-sm: 8px;
  --border-radius-md: 16px;
  /* others */
  --inner-padding-inline: var(--spacing-md);
  --content-min-width: calc(320px - var(--inner-padding-inline) * 2);
  --content-max-width: 368px;
  --switch-circle-size: 20px;
  --switch-gap: 2px;
  --form-max-width: 368px;
  --back-to-top-button-size: 32px;
  --svg-size-xs: 1lh;
  --hamburger-size: 24px;
}

* {
  box-sizing: border-box;
}

body,
blockquote,
figure {
  margin: 0;
}

h1,
h2,
h3,
h4,
p,
ul,
ol,
dl {
  margin-block: 0;
}

dd {
  margin-inline-start: 0;
}

ul,
ol {
  padding-inline-start: 0;
  list-style-type: "";
}

:where(a:-moz-any-link) {
  color: inherit;
  text-decoration-line: none;
}

:where(a:any-link) {
  color: inherit;
  text-decoration-line: none;
}

h1,
h2,
h3,
h4 {
  font-size: 1em;
  font-weight: normal;
}

button {
  padding-block: unset;
  padding-inline: unset;
  font-size: 1em;
  background-color: unset;
  border: unset;
}

li {
  display: block;
}

input {
  padding: 0;
  border: none;
}

input[type=checkbox] {
  margin: 0;
}

:where(input[type=submit]) {
  font-size: 1em;
  background-color: transparent;
}

textarea {
  border: none;
  field-sizing: content;
}

:where(button, [type=button], [type=reset], [type=submit]) {
  touch-action: manipulation;
}

:where(:-moz-any-link,
button,
[type=button],
[type=reset],
[type=submit],
label[for],
select,
summary,
[role=tab],
[role=button]) {
  cursor: pointer;
}

:where(:any-link,
button,
[type=button],
[type=reset],
[type=submit],
label[for],
select,
summary,
[role=tab],
[role=button]) {
  cursor: pointer;
}

:focus:not(:focus-visible) {
  outline: none;
}

:where(:-moz-any-link) {
  text-decoration-color: color-mix(in srgb, currentcolor, transparent 40%);
  text-underline-offset: 0.25em;
}

:where(:any-link) {
  text-decoration-color: color-mix(in srgb, currentcolor, transparent 40%);
  text-underline-offset: 0.25em;
}

[tabindex="-1"]:focus-visible {
  outline: none !important;
}

html {
  scrollbar-gutter: stable;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
}

body {
  position: relative;
  display: flex;
  flex-direction: column;
  min-block-size: 100dvh;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  line-height: 1.5;
  color: var(--color-black);
  word-break: normal;
  overflow-wrap: anywhere;
  background-color: var(--color-white);
  transition-duration: var(--transition);
  transition-property: color, background-color;
  line-break: strict;
}
@supports (word-break: auto-phrase) {
  body {
    word-break: auto-phrase;
  }
}

img {
  display: block;
  max-inline-size: 100%;
  block-size: auto;
}

a {
  display: block;
}

input[type=submit] {
  color: inherit;
}

textarea {
  resize: none;
}

button {
  display: block;
}

svg {
  transition: fill var(--transition);
}

@media (prefers-reduced-motion: reduce) {
  *,
  ::before,
  ::after,
  ::backdrop {
    background-attachment: scroll !important;
    transition-delay: 0s !important;
    transition-duration: 1ms !important;
    animation-duration: 1ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}
[id],
:focus {
  scroll-margin-block-start: var(--scroll-margin);
}

.inner {
  padding-inline: var(--inner-padding-inline);
  margin-inline: auto;
}

.inner--sm {
  max-inline-size: calc(var(--content-max-width) * 2 + var(--inner-padding-inline) * 2);
}

.inner--md {
  max-inline-size: calc(var(--content-max-width) * 4 + var(--inner-padding-inline) * 2);
}

.l-footer {
  padding-block: var(--spacing-md);
  margin-block-start: var(--spacing-2xl);
}

.l-footer__copyright {
  font-size: var(--font-size-xs);
  text-align: center;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .l-footer__copyright {
  color: var(--color-white);
}

.l-header {
  position: sticky;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: calc(infinity);
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  padding-block: var(--spacing-sm);
  background-color: inherit;
  box-shadow: 0 1px 8px var(--color-lightgray);
}

.l-header--front-page {
  padding-block-end: var(--spacing-md);
}

.l-header__search-form {
  display: flex;
  -moz-column-gap: var(--spacing-xs);
       column-gap: var(--spacing-xs);
  justify-content: center;
  padding: var(--spacing-xs);
  overflow: hidden;
  border: 1px solid;
  border-radius: var(--border-radius-xs);
  transition-duration: var(--transition);
  transition-property: border-color;
}

.is-dark .l-header__search-form {
  border-color: var(--color-white);
}

.l-header__switch {
  display: flex;
  justify-content: center;
}

.l-header__hamburger {
  position: relative;
  inline-size: var(--hamburger-size);
  block-size: var(--hamburger-size);
  cursor: pointer;
}

.l-header__hamburger-icon {
  position: absolute;
  top: 0;
  left: 0;
  transition-duration: var(--transition);
  transition-property: visibility, opacity;
}

.l-header__hamburger.is-active .l-header__hamburger-menu-icon {
  visibility: hidden;
  opacity: 0;
}

.l-header__hamburger-close-icon {
  visibility: hidden;
  opacity: 0;
}

.l-header__hamburger.is-active .l-header__hamburger-close-icon {
  visibility: visible;
  opacity: 1;
}

.l-header__hamburger-icon svg {
  inline-size: var(--hamburger-size);
  block-size: var(--hamburger-size);
}

.l-header__hamburger svg.is-dark {
  fill: var(--color-white);
}

.l-load {
  position: fixed;
  inset-block-start: 0;
  z-index: calc(infinity);
  display: grid;
  place-items: center;
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  block-size: 100dvh;
  background-color: inherit;
  transition: opacity var(--transition-normal), visibility var(--transition-normal);
}
@media (scripting: none) {
  .l-load .l-load {
    display: none;
  }
}

.is-dark .l-load {
  color: var(--color-white);
}

.l-main {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
}

.c-breadcrumbs {
  display: flex;
  padding: var(--spacing-xs);
  margin-block-start: var(--spacing-lg);
  overflow-x: auto;
  font-size: var(--font-size-xs);
  white-space: nowrap;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-breadcrumbs {
  color: var(--color-white);
}

.c-breadcrumbs__item--current {
  color: var(--color-lightgray);
}

.c-breadcrumbs__item svg {
  inline-size: var(--svg-size-xs);
  block-size: var(--svg-size-xs);
  fill: var(--color-black);
}

.c-breadcrumbs__item svg.is-dark {
  fill: var(--color-white);
}

.c-breadcrumbs__item > svg {
  margin-inline: var(--spacing-sm);
}

.c-button-sm-container {
  position: relative;
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  max-inline-size: 368px;
}

.c-button-sm {
  padding: var(--spacing-sm);
  font-weight: bold;
  text-align: center;
  border: 1px solid;
  border-radius: calc(infinity * 1px);
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-button-sm {
  color: var(--color-white);
}

.c-button-sm-container svg {
  position: absolute;
  inset-block-start: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  translate: 0 -50%;
  transition-duration: var(--transition);
  transition-property: background-image;
  inset-inline-end: var(--spacing-sm);
  pointer-events: none;
  cursor: pointer;
  transition-duration: var(--transition);
  transition-property: fill;
}

.is-dark .c-button-sm-container svg {
  fill: var(--color-white);
}

.c-switch {
  position: relative;
  inline-size: calc(var(--switch-circle-size) * 2 + var(--switch-gap) * 2);
  block-size: calc(var(--switch-circle-size) + var(--switch-gap) * 2);
  cursor: pointer;
  background-color: var(--color-black);
  border-radius: calc(infinity * 1px);
  transition: background-color var(--transition);
}

.c-switch.is-dark {
  background-color: var(--color-white);
}

.c-switch::after {
  position: absolute;
  inset-block-start: var(--switch-gap);
  inset-inline-start: var(--switch-gap);
  inline-size: var(--switch-circle-size);
  block-size: var(--switch-circle-size);
  content: "";
  background-color: var(--color-white);
  background-image: url("img/common/light_mode_24dp_ORANGE_FILL0_wght400_GRAD0_opsz24.svg");
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: calc(infinity * 1px);
  transition-duration: var(--transition);
  transition-property: background-color, background-image, translate;
}

.c-switch.is-dark::after {
  background-color: var(--color-black);
  background-image: url("img/common/dark_mode_24dp_GOLD_FILL0_wght400_GRAD0_opsz24.svg");
  translate: 100% 0;
}

.c-back-to-top-button-container {
  position: fixed;
  inset-block-end: 48px;
  inset-inline-end: var(--inner-padding-inline);
  z-index: 10;
  visibility: hidden;
  opacity: 0;
  transition: visibility var(--transition), opacity var(--transition);
}

.c-back-to-top-button-container.is-visible {
  visibility: visible;
  opacity: 1;
}

.c-back-to-top-button {
  inline-size: var(--back-to-top-button-size);
  block-size: var(--back-to-top-button-size);
  background-color: var(--color-lightgray);
  border-radius: var(--border-radius-xs);
}
@media (width >= 768px) {
  .c-back-to-top-button {
    --back-to-top-button-size: 48px;
  }
}

.c-back-to-top-button svg {
  inline-size: calc(var(--back-to-top-button-size) / 2);
}

.c-cards {
  display: grid;
  justify-content: center;
}

.c-cards:not(:has(.c-cards__text)) {
  grid-template-columns: repeat(auto-fit, minmax(auto, var(--content-max-width)));
}

.c-card {
  display: grid;
  grid-template-rows: subgrid;
  grid-row-start: span 4;
  row-gap: var(--spacing-md);
  padding-block: var(--spacing-xl);
}
@media (width >= 768px) {
  .c-card {
    padding: var(--spacing-xl);
  }
}

.c-card:not(:last-child) {
  border-block-end: 1px solid;
  transition-duration: var(--transition);
  transition-property: border-color;
}
@media (width >= 768px) {
  .c-card:not(:last-child) {
    border-block-end: none;
  }
}

.is-dark .c-card:not(:last-child) {
  border-color: var(--color-white);
}

.c-card__image {
  display: grid;
  justify-items: center;
}

.c-card__image-container {
  overflow: hidden;
}

.c-card__no-image {
  block-size: 100%;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
}

.c-card__image img {
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
  transition: filter var(--transition), scale var(--transition);
}

.c-card__container {
  display: flex;
  flex-wrap: wrap;
  row-gap: var(--spacing-md);
  align-items: flex-start;
}

.c-card__categories {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
}

.c-card__category {
  padding-inline: var(--spacing-sm);
  font-size: var(--font-size-xs);
  border: 1px solid;
  border-radius: calc(infinity * 1px);
  transition-duration: var(--transition);
  transition-property: color, background-color;
}

.is-dark .c-card__category {
  color: var(--color-white);
}

.c-card__date-wrapper {
  display: grid;
  flex-grow: 1;
  justify-content: end;
}

.c-card__date-container {
  display: flex;
  -moz-column-gap: var(--spacing-xs);
       column-gap: var(--spacing-xs);
  align-items: center;
}

.c-card__container svg {
  inline-size: 1em;
  block-size: 1em;
}

.is-dark .c-card__container svg {
  fill: var(--color-white);
}

.c-card__date {
  font-size: var(--font-size-xs);
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-card__date {
  color: var(--color-white);
}

.c-card__title-link {
  text-decoration-line: underline;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-card__title-link {
  color: var(--color-white);
}

.c-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-xs) var(--spacing-md);
  font-size: var(--font-size-sm);
}

.c-search-form__text-input {
  inline-size: 100%;
  padding: var(--spacing-xs);
  background-color: transparent;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-search-form__text-input {
  color: var(--color-white);
}

.c-search-form__text-input::-moz-placeholder {
  transition-duration: var(--transition);
  -moz-transition-property: color;
  transition-property: color;
}

.c-search-form__text-input::placeholder {
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-search-form__text-input::-moz-placeholder {
  color: var(--color-lightgray);
}

.is-dark .c-search-form__text-input::placeholder {
  color: var(--color-lightgray);
}

.c-search-form__submit-button {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.c-search-form__submit-button svg {
  fill: var(--color-black);
}

.c-search-form__submit-button svg.is-dark {
  fill: var(--color-white);
}

.c-icon {
  display: flex;
  align-items: center;
}

.c-index {
  border: 1px solid;
  transition-duration: var(--transition);
  transition-property: border-color;
}

.is-dark .c-index {
  border-color: var(--color-white);
}

.c-index__title-container {
  position: relative;
}

.c-index__button {
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  text-align: left;
}

.c-index__title {
  padding: var(--spacing-md);
  font-size: var(--font-size-lg);
  font-weight: bold;
  cursor: pointer;
  background-color: var(--color-lightgray);
  transition-duration: var(--transition);
  transition-property: color, background-color;
}

.is-dark .c-index__title {
  display: block;
  color: var(--color-white);
  background-color: var(--color-gray);
}

.c-index__title-container svg {
  position: absolute;
  inset-block-start: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  translate: 0 -50%;
  transition-duration: var(--transition);
  transition-property: background-image;
  inset-inline-end: var(--spacing-md);
  rotate: 90deg;
  transition-duration: var(--transition);
  transition-property: rotate, fill;
}

.is-dark .c-index__title-container svg {
  fill: var(--color-white);
}

.c-index.is-active .c-index__title-container svg {
  rotate: -90deg;
}

.c-index__list {
  display: grid;
  row-gap: var(--spacing-md);
  block-size: 0;
  padding-inline: var(--spacing-lg);
  overflow-y: hidden;
  list-style-type: decimal;
  transition-duration: var(--transition);
  transition-property: padding-block, color;
}

.is-dark .c-index__list {
  color: var(--color-white);
}

.c-index.is-active .c-index__list {
  block-size: auto;
  padding-block: var(--spacing-lg);
}

.c-index__item {
  display: list-item;
  margin-inline-start: 1em;
}

.c-index__text {
  cursor: pointer;
}

.c-index__child-list {
  display: grid;
  row-gap: var(--spacing-md);
  padding-block-start: var(--spacing-md);
  list-style-type: decimal;
}

.c-index__child-item {
  display: list-item;
  margin-inline-start: 1em;
}

.c-index__child-text {
  cursor: pointer;
}

.c-home-link {
  display: flex;
}

.c-home-link svg {
  margin-inline-end: var(--spacing-xs);
}

.c-post-navigation {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(auto, 360px));
  gap: var(--spacing-md);
  justify-content: center;
}

.c-post-navigation__link {
  display: flex;
  align-items: center;
  block-size: 100%;
  padding-block: var(--spacing-sm);
  font-size: var(--font-size-xs);
  border: 1px solid;
}

.c-post-navigation__container {
  position: relative;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-post-navigation__container {
  color: var(--color-white);
}

.c-post-navigation__container svg {
  position: absolute;
  inset-block-start: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  translate: 0 -50%;
  transition-duration: var(--transition);
  transition-property: background-image;
  transition-duration: var(--transition);
  transition-property: fill;
}

.is-dark .c-post-navigation__container svg {
  fill: var(--color-white);
}

.c-post-navigation__prev-link {
  padding-inline: calc(var(--spacing-sm) * 2 + 1em) var(--spacing-sm);
}

.c-post-navigation__prev svg {
  inset-inline-start: var(--spacing-sm);
}

.c-post-navigation__next-link {
  justify-content: flex-end;
  padding-inline: var(--spacing-sm) calc(var(--spacing-sm) * 2 + 1em);
}

.c-post-navigation__next svg {
  inset-inline-end: var(--spacing-sm);
}

.c-not-found {
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-not-found {
  color: var(--color-white);
}

.c-site-title {
  font-size: var(--font-size-2xl);
  font-weight: bold;
}

.c-site-title__link {
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-site-title__link {
  color: var(--color-white);
}

.c-section-title {
  font-size: var(--font-size-xl);
  font-weight: bold;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-section-title {
  color: var(--color-white);
}

.c-child-section-title {
  font-weight: bold;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .c-child-section-title {
  color: var(--color-white);
}

.p-works__content {
  display: grid;
  row-gap: var(--spacing-3xl);
}

.p-career_skills__content {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(auto, var(--content-max-width)));
  row-gap: var(--spacing-lg);
  align-items: start;
  justify-content: center;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .p-career_skills__content {
  color: var(--color-white);
}

.p-career_skills__content-item {
  display: grid;
  row-gap: var(--spacing-sm);
}

.p-career_skills__content-text {
  white-space: pre-wrap;
}

.p-career_skills__child-content {
  display: grid;
  row-gap: var(--spacing-sm);
  list-style-type: disc;
}

.p-career_skills__child-content-item {
  display: list-item;
  margin-inline-start: 1em;
}

.p-career_skills__child-content-item * {
  all: revert;
}

.p-mainvisual {
  padding-block: var(--spacing-3xl);
}

@media (width >= 768px) {
  .p-mainvisual__container {
    display: grid;
    grid-template-columns: 2fr 1fr;
    align-items: center;
  }
}

.p-mainvisual__text {
  display: grid;
  justify-items: center;
  margin-block-end: var(--spacing-lg);
}
@media (width >= 768px) {
  .p-mainvisual__text {
    margin-block-end: 0;
  }
}

.p-mainvisual__author-name {
  font-size: var(--font-size-3xl);
  font-weight: bold;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .p-mainvisual__author-name {
  color: var(--color-white);
}

.p-mainvisual__occupation {
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .p-mainvisual__occupation {
  color: var(--color-white);
}

.p-mainvisual__image-container {
  display: grid;
  justify-items: center;
}
@media (width >= 768px) {
  .p-mainvisual__image-container {
    justify-items: start;
  }
}

.p-works {
  padding-block: var(--spacing-xl);
}

.p-about {
  padding-block: var(--spacing-xl);
}

.p-contact {
  padding-block: var(--spacing-xl);
}

.p-blog {
  padding-block: var(--spacing-xl);
}

.p-programming {
  padding-block: var(--spacing-xl);
}

.p-search {
  padding-block: var(--spacing-xl);
}

.p-single {
  padding-block: var(--spacing-xl);
}

.p-single__title {
  margin-block-end: var(--spacing-lg);
  font-size: var(--font-size-xl);
  font-weight: bold;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .p-single__title {
  color: var(--color-white);
}

.p-single__image img {
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  aspect-ratio: 16/9;
  margin-block-end: var(--spacing-3xl);
  -o-object-fit: cover;
     object-fit: cover;
}

.p-single__content {
  padding-block-start: var(--spacing-xl);
  margin-block-end: var(--spacing-3xl);
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .p-single__content {
  color: var(--color-white);
}

.p-single__content *:not(.cp_embed_wrapper,
.cp_embed_wrapper *,
.wp-block-kevinbatdorf-code-block-pro,
.wp-block-kevinbatdorf-code-block-pro *) {
  all: revert;
}

.p-single__link {
  color: var(--color-lightblue);
  text-decoration-line: underline;
}

.p-single__tag-link {
  padding-inline: var(--spacing-sm);
  border: 1px solid;
  border-radius: calc(infinity * 1px);
  transition: color var(--transition), background-color var(--transition);
}

.is-dark .p-single__tag-link {
  color: var(--color-white);
}

.p-not-found {
  padding-block: var(--spacing-xl);
}

.p-not-found__title {
  margin-block-end: var(--spacing-lg);
  font-size: var(--font-size-3xl);
  font-weight: bold;
  text-align: center;
  transition-duration: var(--transition);
  transition-property: color;
}
@media (width >= 768px) {
  .p-not-found__title {
    font-size: var(--font-size-6xl);
  }
}
@media (width >= 1024px) {
  .p-not-found__title {
    font-size: var(--font-size-7xl);
  }
}

.is-dark .p-not-found__title {
  color: var(--color-white);
}

.p-not-found__text {
  text-align: center;
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .p-not-found__text {
  color: var(--color-white);
}

.u-text-center {
  text-align: center;
}

.u-items-center {
  align-items: center;
}

.u-justify-center {
  justify-content: center;
}

.u-justify-between {
  justify-content: space-between;
}

.u-hidden {
  display: none;
}

.u-flex {
  display: flex;
}

.u-max-pc {
  grid-column: 1/-1;
}

.u-mbs-xs {
  margin-block-start: var(--spacing-xs);
}

.u-mbs-sm {
  margin-block-start: var(--spacing-sm);
}

.u-mbs-md {
  margin-block-start: var(--spacing-md);
}

.u-mbs-lg {
  margin-block-start: var(--spacing-lg);
}

.u-mbs-xl {
  margin-block-start: var(--spacing-xl);
}

.u-mbs-2xl {
  margin-block-start: var(--spacing-2xl);
}

.u-mbs-3xl {
  margin-block-start: var(--spacing-3xl);
}

.u-mbe-xs {
  margin-block-end: var(--spacing-xs);
}

.u-mbe-sm {
  margin-block-end: var(--spacing-sm);
}

.u-mbe-md {
  margin-block-end: var(--spacing-md);
}

.u-mbe-lg {
  margin-block-end: var(--spacing-lg);
}

.u-mbe-xl {
  margin-block-end: var(--spacing-xl);
}

.u-mbe-2xl {
  margin-block-end: var(--spacing-2xl);
}

.u-mbe-3xl {
  margin-block-end: var(--spacing-3xl);
}

.u-m {
  margin: auto;
}

.u-mb {
  margin-block: auto;
}

.u-mi {
  margin-inline: auto;
}

@media (any-hover: hover) {
  .c-card__category:hover {
    color: var(--color-white);
    background-color: var(--color-black);
  }
  .is-dark .c-card__category:hover {
    color: var(--color-black);
    background-color: var(--color-white);
  }
  .c-card__image img:not(.c-card__no-image):hover {
    filter: brightness(0.8);
    scale: 1.1;
  }
  .p-single__tag-link:hover {
    color: var(--color-white);
    background-color: var(--color-black);
  }
  .is-dark .p-single__tag-link:hover {
    color: var(--color-black);
    background-color: var(--color-white);
  }
}
.is-no-scroll {
  overflow: hidden;
}

body.is-dark {
  background-color: var(--color-black);
}

.is-hidden {
  visibility: hidden;
  opacity: 0;
}

.is-immediately-hidden {
  display: none;
}

.menu-global-menu-container {
  position: absolute;
  inset-block-start: 100%;
  inset-inline-start: 0;
  visibility: hidden;
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  opacity: 0;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  transition: visibility var(--transition), opacity var(--transition);
}

.menu-global-menu-container.is-active {
  visibility: visible;
  opacity: 1;
}

.global-menu {
  inline-size: 75%;
  block-size: 100%;
  padding-block-end: var(--spacing-3xl);
  overflow-y: auto;
  background-color: var(--color-lightgray);
  translate: -100% 0;
  transition: translate var(--transition);
}
@media (orientation: landscape) {
  .global-menu {
    inline-size: 75%;
  }
}
@media (width >= 1024px) {
  .global-menu {
    inline-size: 25%;
  }
}

.menu-global-menu-container.is-active .global-menu {
  translate: 0;
}

.menu-item {
  border-block-end: 1px solid var(--color-black);
}

.menu-item:last-child.is-active {
  border-block-end: none;
}

.menu-item a {
  position: relative;
  padding: var(--spacing-md) calc(var(--spacing-md) * 2 + 1em) var(--spacing-md) var(--spacing-md);
  font-size: var(--font-size-lg);
}

.is-dark .menu-item a {
  color: var(--color-black);
}

.current-menu-item a:not(.sub-menu .current-menu-item a) {
  color: var(--color-white);
  background-color: var(--color-blue);
}

.current-menu-parent:not(.menu-item-has-children .current-menu-parent) > a {
  color: var(--color-white);
  background-color: var(--color-blue);
}

.is-dark .current-menu-parent > a {
  color: var(--color-white);
}

.sub-menu .current-menu-item a {
  color: var(--color-white);
  background-color: var(--color-green);
}

.is-dark .current-menu-item a {
  color: var(--color-white);
}

.menu-item-has-children.is-active > a {
  border-block-end: 1px solid var(--color-black);
}

.menu-item-has-children:has(.current-menu-parent) > a {
  color: var(--color-white);
  background-color: var(--color-blue);
}

.menu-item a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23222"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>');
  position: absolute;
  inset-block-start: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  translate: 0 -50%;
  transition-duration: var(--transition);
  transition-property: background-image;
  inset-inline-end: var(--spacing-md);
}

.current-menu-item a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23fff"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>');
}

.menu-item-has-children:has(.current-menu-parent) > a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23fff"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>');
}

.current-menu-parent > a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23fff"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>');
}

.menu-item-has-children > a::after {
  rotate: 90deg;
  transition: rotate var(--transition);
}

.menu-item-has-children.is-active > a::after {
  rotate: -90deg;
}

.sub-menu {
  inline-size: 90%;
  height: 0;
  margin-inline-start: auto;
  overflow-y: hidden;
}

.menu-item.is-active .sub-menu {
  height: auto;
}

.sub-menu:has(.menu-item-object-programming-tag) {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
  padding-inline: var(--spacing-md);
  transition: padding-block var(--transition);
}

.menu-item.is-active .sub-menu:has(.menu-item-object-programming-tag) {
  padding-block: var(--spacing-md);
}

.sub-menu .menu-item:last-child {
  border-block-end: none;
}

.sub-menu .menu-item-object-programming-tag {
  border-block-end: none;
}

.sub-menu .menu-item-object-programming a {
  display: flex;
  -moz-column-gap: var(--spacing-md);
       column-gap: var(--spacing-md);
  align-items: center;
}

.sub-menu .menu-item-object-programming a::before {
  display: inline-block;
  flex-shrink: 0;
  inline-size: 1em;
  block-size: 1px;
  content: "";
  background-color: var(--color-black);
}

.sub-menu .current-menu-item a::before {
  background-color: var(--color-white);
}

.sub-menu .current-menu-parent a::before {
  background-color: var(--color-white);
}

.sub-menu .menu-item-object-programming-tag a {
  padding-block: 0;
  padding-inline: var(--spacing-sm);
  font-size: var(--font-size-xs);
  border: 1px solid;
  border-radius: calc(infinity * 1px);
}

.sub-menu .menu-item-object-programming-tag a::after {
  background-image: none;
}

.sub-menu .current-menu-parent a {
  color: var(--color-white);
  background-color: var(--color-green);
}

.wp-post-image {
  -o-object-fit: cover;
     object-fit: cover;
}

.c-card__content p {
  font-size: var(--font-size-sm);
}

.navigation {
  margin-block-start: var(--spacing-3xl);
}

.nav-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(auto, 360px));
  gap: var(--spacing-md);
  justify-content: center;
}

.nav-links a {
  position: relative;
  display: flex;
  align-items: center;
  block-size: 100%;
  padding-block: var(--spacing-sm);
  font-size: var(--font-size-xs);
  border: 1px solid;
  transition-duration: var(--transition);
  transition-property: color;
}

.nav-previous a {
  padding-inline: calc(var(--spacing-sm) * 2 + 1em) var(--spacing-sm);
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .nav-previous a {
  color: var(--color-white);
}

.nav-previous a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23222"><path d="M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z"/></svg>');
  position: absolute;
  inset-block-start: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  translate: 0 -50%;
  transition-duration: var(--transition);
  transition-property: background-image;
  inset-inline-start: var(--spacing-sm);
  transition-duration: var(--transition);
  transition-property: background-image;
}

.is-dark .nav-previous a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23fff"><path d="M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z"/></svg>');
}

.nav-next a {
  justify-content: flex-end;
  padding-inline: var(--spacing-sm) calc(var(--spacing-sm) * 2 + 1em);
}

.is-dark .nav-next a {
  color: var(--color-white);
}

.nav-next a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23222"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>');
  position: absolute;
  inset-block-start: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  translate: 0 -50%;
  transition-duration: var(--transition);
  transition-property: background-image;
  inset-inline-end: var(--spacing-sm);
}

.is-dark .nav-next a::after {
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23fff"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>');
}

.nav-links ul {
  display: flex;
  gap: var(--spacing-md);
  justify-content: center;
  list-style: none;
}

.nav-links li > * {
  display: flex;
  align-items: center;
  justify-content: center;
  block-size: 45px;
  font-size: var(--font-size-sm);
}

.nav-links li > *:not(.dots) {
  inline-size: 45px;
  color: #000;
  background-color: #efefef;
  border-radius: calc(infinity * 1px);
  transition: color var(--transition), background-color var(--transition);
}

.nav-links li > .current,
.nav-links li > a:hover {
  color: var(--color-white);
  background-color: var(--color-black);
}

.comments {
  margin-block-end: var(--spacing-3xl);
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .comments {
  color: var(--color-white);
}

.comments .comments-list {
  display: grid;
  row-gap: var(--spacing-md);
  margin-block-end: var(--spacing-2xl);
}

.comments .comment {
  display: grid;
  row-gap: var(--spacing-md);
  padding: var(--spacing-md);
  box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.2);
}

.is-dark .comments .comment {
  box-shadow: 1px 1px 2px 2px rgba(255, 255, 255, 0.2);
}

.comments .children {
  display: grid;
  row-gap: var(--spacing-md);
}

.comments .comment-body {
  display: grid;
  row-gap: var(--spacing-sm);
}

.comments .comment-author {
  display: flex;
  -moz-column-gap: var(--spacing-xs);
       column-gap: var(--spacing-xs);
  align-items: center;
}

.comments .avatar {
  inline-size: 48px;
  margin-inline-end: var(--spacing-sm);
  border-radius: calc(infinity * 1px);
}

.comments .url {
  text-decoration-line: underline;
}

.comments .comment-meta {
  font-size: var(--font-size-xs);
}

.comments .comment-meta a {
  text-decoration-line: underline;
}

.comments .comment-reply-link {
  display: inline-block;
  padding-inline: var(--spacing-sm);
  font-size: var(--font-size-sm);
  color: var(--color-white);
  background-color: var(--color-purple);
  border-radius: var(--border-radius-xs);
}

.comments .comment-respond {
  max-inline-size: var(--form-max-width);
  margin-inline: auto;
}

.comments .comment-reply-title {
  margin-block-end: var(--spacing-md);
  font-size: var(--font-size-lg);
  font-weight: bold;
}

.comments .comment-reply-title a {
  display: inline;
  text-decoration-line: underline;
}

.comment-form {
  display: grid;
  row-gap: var(--spacing-md);
}

.comment-form textarea {
  inline-size: 100%;
  block-size: 200px;
  padding: var(--spacing-sm);
  border: 1px solid;
  border-radius: var(--border-radius-sm);
}

.comment-form .comment-form-author,
.comment-form .comment-form-email {
  display: grid;
  align-items: center;
}

.comment-form .comment-form-author,
.comment-form .comment-form-email {
  grid-template-columns: 20% 80%;
}

.comment-form .comment-form-url {
  display: none;
}

.comment-form input {
  padding: var(--spacing-sm);
  border: 1px solid;
  border-radius: var(--border-radius-sm);
}

.comment-form input[type=submit] {
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  font-weight: bold;
  cursor: pointer;
}

.cp_embed_wrapper {
  margin-block-end: var(--spacing-lg);
}

.wp-block-kevinbatdorf-code-block-pro {
  margin-block-end: var(--spacing-lg);
}

.p-single__content .wp-block-table {
  margin: 0;
  overflow-x: auto;
}

.p-single__content .wp-block-table table {
  inline-size: -webkit-fill-available;
  inline-size: -moz-available;
  inline-size: stretch;
  border-collapse: collapse;
  border-top: 1px solid;
  border-left: 1px solid;
}

.p-single__content .wp-block-table td {
  padding: var(--spacing-sm) var(--spacing-md);
  white-space: nowrap;
  border-block-end: 1px solid;
  border-inline-end: 1px solid;
}

.wpcf7 {
  max-inline-size: var(--form-max-width);
  margin-inline: auto;
}

.wpcf7 .wpcf7-form {
  display: grid;
  row-gap: var(--spacing-md);
  transition-duration: var(--transition);
  transition-property: color;
}

.is-dark .wpcf7 .wpcf7-form {
  color: var(--color-white);
}

.wpcf7 .wpcf7-form-control {
  inline-size: 100%;
  padding: var(--spacing-sm);
  border: 1px solid;
  border-radius: var(--border-radius-sm);
}

.wpcf7 .wpcf7-textarea {
  block-size: 200px;
}

.wpcf7 .wpcf7-submit {
  font-weight: bold;
  cursor: pointer;
  border: 1px solid;
}/*# sourceMappingURL=style.css.map */