/* ==========================================================================
   Foundation: Variables & Base
   ========================================================================== */

:root {
  /* Color */
  --color-primary: #76c7c0;
  --color-primary-dark: #279B9C;
  --color-accent: #d4b677;
  --color-text: #444444;
  --color-text-muted: #666666;
  --color-white: #ffffff;
  --color-border: rgba(118, 199, 192, 0.45);
  --color-bg-fv-start: #fff9ee;
  --color-bg-fv-mid: #eef8f6;
  --color-bg-fv-end: #ffffff;
  --color-bg-section: #f4faf9;
  --color-bg-contact-start: #e8f6f4;
  --color-bg-contact-end: #b8e4df;

  --header-height-sp: 84px;
  --header-height-pc: 112px;
  --wp-admin-bar-height: 0px;
  --gradient-brand: linear-gradient(
    90deg,
    #3aafa4 0%,
    #76c7c0 38%,
    #c9d88a 72%,
    #e8d9a0 100%
  );
  --shadow-header-nav: 0 4px 24px rgba(51, 51, 51, 0.08);

  /* Typography */
  --font-sans: "Noto Sans JP", sans-serif;
  --font-serif: "Shippori Mincho", serif;
  --font-en: parlare, "Helvetica Neue", Arial, sans-serif;
  --font-script: parlare, "Helvetica Neue", Arial, sans-serif;
  --font-size-base-sp: 14px;
  --font-size-base: 16px;
  --font-size-text-sp: var(--font-size-base-sp);
  --font-size-text-pc: var(--font-size-base);
  --line-height-base: 1.8;

  /* Layout */
  --container-padding-sp: 24px;
  --container-padding-pc: 48px;
  --container-max-width: 1200px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;

  /* Spacing */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;
  --space-2xl: 96px;

  /* Radius */
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Transition */
  --transition-base: 0.3s ease;

  /* Z-index */
  --z-fv-bg-text: 0;
  --z-fv-content: 1;
  --z-fv-news: 2;
  --z-header: 100;
  --z-header-drawer: 110;

  --section-padding-sp: 72px;
  --section-padding-pc: 120px;
}

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

html {
  font-size: var(--font-size-text-sp);
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

@media (min-width: 768px) {
  html {
    font-size: var(--font-size-text-pc);
  }
}

/* 管理バー表示時（固定ヘッダー用） */
html.admin-bar {
  --wp-admin-bar-height: 46px;
  margin-top: 0 !important;
}

@media screen and (min-width: 783px) {
  html.admin-bar {
    --wp-admin-bar-height: 32px;
  }
}

html.admin-bar body {
  padding-top: var(--wp-admin-bar-height);
}

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 400;
  line-height: var(--line-height-base);
  color: var(--color-text);
  background-color: var(--color-white);
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

a {
  color: inherit;
  text-decoration: none;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

h1,
h2,
h3,
p {
  margin: 0;
}

p {
  font-size: 1rem;
}

/* SP: 本文テキスト基本 14px（1rem） */
@media (max-width: 767px) {
  .l-main :is(
    .p-approach__text,
    .p-fv__lead,
    .c-section-heading__text,
    .c-service-card__text,
    .p-case-study__intro,
    .p-case-study__list-item,
    .p-svc-web-hero__lead,
    .p-svc-web-section-head__lead,
    .p-svc-web-approach__lead,
    .p-svc-web-approach__text,
    .p-svc-web-failure__text,
    .p-svc-web-reason__text,
    .p-svc-web-flow__text,
    .p-svc-web-faq__q,
    .p-svc-web-faq__a,
    .p-svc-web-price__desc,
    .p-svc-web-price__intro p,
    .p-about-message__profile-credentials,
    .p-about-message__profile-bio,
    .p-cs-approach__text
  ) {
    font-size: var(--font-size-text-sp);
  }
}

em {
  font-style: normal;
}

/* 英字ディスプレイ（Adobe Fonts: Parlare） */
.c-section-heading__en,
.l-header__logo-text,
.l-footer__logo-text,
.p-contact-cta__bg-text,
.p-visual__placeholder-num,
.p-cs-hero__bg-title,
.p-cs-section__en,
.p-cs-section__num,
.p-cs-other__en {
  font-family: var(--font-script);
  font-weight: 400;
  font-style: normal;
}

/* Utilities: responsive visibility */
.u-sp-only {
  display: block;
}

.u-pc-only {
  display: none;
}

@media (min-width: 768px) {
  .u-sp-only {
    display: none !important;
  }

  .u-pc-only {
    display: block;
  }
}
