/* FILE: miura-core.css (clean) */

:root{
  --miura-color-text:#333;
  --miura-color-text-light:#666;
  --miura-color-bg:#fff;
  --miura-color-bg-alt:#f9f9fa;
  --miura-color-border:#e0e0e0;

  /* WCAG AA（白文字） */
  --miura-color-cta-primary:#c2410c;
  --miura-color-cta-primary-hover:#9a3412;
  --miura-color-cta-secondary:#15803d;
  --miura-color-cta-secondary-hover:#166534;

  --miura-color-theme:#1976d2;
  --miura-color-theme-light:#e3f2fd;

  --miura-fs-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);
  --miura-fs-sm:clamp(0.75rem,0.7rem + 0.25vw,0.875rem);
  --miura-fs-lg:clamp(1.25rem,1.15rem + 0.5vw,1.5rem);
  --miura-fs-xl:clamp(1.5rem,1.3rem + 1vw,2rem);

  --miura-space-xs:0.5rem;
  --miura-space-sm:1rem;
  --miura-space-md:2rem;
  --miura-space-lg:clamp(3rem,5vw,5rem);

  --miura-radius:10px;
  --miura-radius-lg:12px;

  --miura-shadow:0 4px 6px rgba(0,0,0,.05);
  --miura-shadow-hover:0 8px 15px rgba(0,0,0,.1);

  --miura-transition:
    background-color .2s ease-in-out,
    color .2s ease-in-out,
    border-color .2s ease-in-out,
    transform .2s ease-in-out,
    box-shadow .2s ease-in-out;
}

/* =========================================================
   BASE
========================================================= */
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page){
  font-family:inherit;
  font-size:var(--miura-fs-base);
  color:var(--miura-color-text);
  line-height:1.6;
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) *{ box-sizing:border-box; }

/* =========================================================
   Service page live common UI (Phase 1a)
========================================================= */
:where(.miura-service-page){
  padding-top:3rem;
  padding-bottom:4rem;
}
:where(.miura-service-page) .miura-service-section{
  margin-bottom:3rem;
}
:where(.miura-service-page) .miura-service-h2{
  font-size:1.3rem;
  margin-bottom:1rem;
  padding-left:.6rem;
  border-left:4px solid var(--miura-color-theme);
  font-weight:700;
}

:where(.miura-service-page)
> :where(.gas-hero,.denki-hero,.suidou-hero,.sekiyu-hero,.maintenance-hero){
  padding:20px 18px;
  margin-bottom:32px;
  border-radius:var(--miura-radius-lg);
  border:1px solid transparent;
}

:where(.miura-service-page)
> :where(.gas-hero,.denki-hero,.suidou-hero,.sekiyu-hero,.maintenance-hero)
> .case-summary{
  margin:12px 0 18px;
  padding:12px 14px;
  border-left:4px solid transparent;
  border-radius:var(--miura-radius);
  line-height:1.8;
}


:where(.miura-service-page)
> :where(.gas-price,.denki-price,.suidou-price,.sekiyu-price,.maintenance-price)
> ul{
  list-style:none !important;
  padding-left:0 !important;
  margin:0 !important;
  margin-left:0 !important;
  display:grid;
  gap:.75rem;
}

:where(.miura-service-page)
> :where(.gas-price,.denki-price,.suidou-price,.sekiyu-price,.maintenance-price)
> ul > li{
  list-style:none !important;
  border:1px solid var(--miura-color-border);
  border-radius:var(--miura-radius);
  background:#fff;
  box-shadow:var(--miura-shadow);
  padding:.9rem 1rem;
}

:where(.miura-service-page)
> :where(.gas-price,.denki-price,.suidou-price,.sekiyu-price,.maintenance-price)
> ul > li::before{
  content:none !important;
}

:where(.miura-service-page)
> :where(.gas-price,.denki-price,.suidou-price,.sekiyu-price,.maintenance-price)
> ul > li::marker{
  content:"" !important;
  color:transparent !important;
}

:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) h2.custom-h2{
  font-size:var(--miura-fs-xl);
  font-weight:700;
  margin-top:var(--miura-space-lg);
  margin-bottom:var(--miura-space-md);
  padding-bottom:var(--miura-space-xs);
  border-bottom:3px solid var(--miura-color-theme);
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) h3.custom-h3{
  font-size:var(--miura-fs-lg);
  font-weight:700;
  margin-top:var(--miura-space-md);
  margin-bottom:var(--miura-space-sm);
  display:flex;
  align-items:center;
  gap:var(--miura-space-xs);
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) h3.custom-h3::before{
  content:"";
  width:6px;
  height:1.2em;
  background:var(--miura-color-theme);
  border-radius:2px;
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) p{
  margin-bottom:var(--miura-space-sm);
  overflow-wrap:break-word;
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) hr{
  margin:var(--miura-space-lg) 0;
  border:0;
  border-top:1px solid var(--miura-color-border);
}

/* =========================================================
   CTA (base)
========================================================= */
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.cta-buttons,.case-cta-buttons){
  display:flex;
  flex-direction:column;
  gap:var(--miura-space-sm);
  margin:var(--miura-space-md) 0;
}
@media (min-width:768px){
  :where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.cta-buttons,.case-cta-buttons){
    flex-direction:row;
    justify-content:center;
  }
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.st-pop-btn,.case-btn){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:1rem 1.5rem;
  border-radius:var(--miura-radius);
  font-weight:700;
  text-decoration:none;
  text-align:center;
  transition:var(--miura-transition);
  min-height:54px;
  width:100%;
  box-shadow:var(--miura-shadow);
  border:1px solid var(--miura-color-border);
}
@media (min-width:768px){
  :where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.st-pop-btn,.case-btn){
    width:auto;
    min-width:280px;
  }
}

/* 色（WCAG AA） */
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.st-pop-btn.st-pop-orange,.case-btn-tel){
  background:var(--miura-color-cta-primary);
  color:#fff;
  border-color:color-mix(in srgb, var(--miura-color-cta-primary) 35%, var(--miura-color-border));
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.st-pop-btn.st-pop-green,.case-btn-line){
  background:var(--miura-color-cta-secondary);
  color:#fff;
  border-color:color-mix(in srgb, var(--miura-color-cta-secondary) 35%, var(--miura-color-border));
}

/* hoverはPCだけ */
@media (hover:hover) and (pointer:fine){
  :where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.st-pop-btn.st-pop-orange,.case-btn-tel):hover{
    background:var(--miura-color-cta-primary-hover);
    transform:translateY(-1px);
    box-shadow:var(--miura-shadow-hover);
  }
  :where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.st-pop-btn.st-pop-green,.case-btn-line):hover{
    background:var(--miura-color-cta-secondary-hover);
    transform:translateY(-1px);
    box-shadow:var(--miura-shadow-hover);
  }
}

/* =========================================================
   Sticky CTA (mobile, HTML無変更)
   ※ .cta-buttons はページ内1つ推奨
========================================================= */
@media (max-width:767px){
  /* 古いブラウザ用の保険（:hasが無い場合） */
  :where(.miura-service-page,.case-detail){
    padding-bottom:calc(96px + env(safe-area-inset-bottom));
  }

  :where(.miura-service-page,.case-detail) :is(.cta-buttons,.case-cta-buttons){
    position:fixed;
    inset-inline:0;
    bottom:0;
    margin:0;
    padding:0;
    padding-bottom:env(safe-area-inset-bottom);
    flex-direction:row;
    gap:0;
    z-index:30;
    box-shadow:0 -2px 10px rgba(0,0,0,.1);
    background:#fff;
    border-top:1px solid var(--miura-color-border);
  }

  :where(.miura-service-page,.case-detail) :is(.st-pop-btn.st-pop-btn,.case-btn.case-btn){
    flex:1;
    border-radius:0;
    min-height:60px;
    padding:.55rem .5rem;
    font-size:var(--miura-fs-sm);
    box-shadow:none;
  }

  /* 文字の見え方（改行事故防止） */
  :where(.miura-service-page,.case-detail) :is(.cta-buttons,.case-cta-buttons) :where(.btn-text){
    text-align:center;
    line-height:1.15;
    word-break:keep-all;
    font-size:clamp(.72rem, 3.2vw, .82rem);
  }
  :where(.miura-service-page,.case-detail) :is(.cta-buttons,.case-cta-buttons) .st-pop-green :where(.btn-text){
    white-space:nowrap;
  }
  :where(.miura-service-page,.case-detail) :is(.cta-buttons,.case-cta-buttons) .st-pop-orange :where(.btn-text){
    line-break:strict;
  }

  /* hover残り対策 */
  :where(.miura-service-page,.case-detail)
  :is(.st-pop-btn.st-pop-orange:hover,.st-pop-btn.st-pop-green:hover,.case-btn-tel:hover,.case-btn-line:hover){
    transform:none;
  }
}

/* :has が使える環境は、body側で下余白を作り、二重paddingを避ける */
@media (max-width:767px){
  @supports selector(body:has(*)){
    body:has(.miura-service-page),
    body:has(.case-detail){
      padding-bottom:calc(96px + env(safe-area-inset-bottom));
    }
    :where(.miura-service-page,.case-detail){
      padding-bottom:0;
    }
  }
}

/* OVERRIDES：テーマ側 a{color:...!important} 対策（塗りCTAのみ） */
:is(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page)
a:is(.st-pop-btn.st-pop-orange,.st-pop-btn.st-pop-green,.case-btn-tel,.case-btn-line){
  color:#fff !important;
}

/* =========================================================
   Cards (reasons / faq)
========================================================= */
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.reason-box,.faq-item){
  background:var(--miura-color-bg-alt);
  border:1px solid var(--miura-color-border);
  border-radius:var(--miura-radius-lg);
  padding:var(--miura-space-md);
  margin-bottom:var(--miura-space-md);
  box-shadow:var(--miura-shadow);
}

/* =========================================================
   FAQ groups (service pages)
========================================================= */
:where(.miura-service-page)
> :where(.gas-faq,.denki-faq,.suidou-faq,.sekiyu-faq,.maintenance-faq)
> .faq-list{
  display:grid;
  gap:.85rem;
  margin-top:1rem;
}
:where(.miura-service-page)
> :where(.gas-faq,.denki-faq,.suidou-faq,.sekiyu-faq,.maintenance-faq)
> .faq-list > .faq-item{
  margin-bottom:0;
}
:where(.miura-service-page)
> :where(.gas-faq,.denki-faq,.suidou-faq,.sekiyu-faq,.maintenance-faq)
> .faq-list > .custom-h3{
  margin:1.1rem 0 .15rem;
}
:where(.miura-service-page)
> :where(.gas-faq,.denki-faq,.suidou-faq,.sekiyu-faq,.maintenance-faq)
> .faq-list > .custom-h3:first-child{
  margin-top:0;
}
:where(.miura-service-page)
> :where(.gas-faq,.denki-faq,.suidou-faq,.sekiyu-faq,.maintenance-faq)
> .faq-list > p{
  margin:0 0 .2rem;
  line-height:1.8;
  color:var(--miura-color-text-light);
}

/* =========================================================
   Hero quick nav (FV)
========================================================= */
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) .hero-quick-nav{
  background:var(--miura-color-bg-alt);
  padding:var(--miura-space-sm);
  border-radius:var(--miura-radius);
  margin-top:var(--miura-space-md);
  border:1px solid var(--miura-color-border);
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) .hero-quick-title{
  font-weight:700;
  text-align:center;
  margin-bottom:var(--miura-space-sm);
  font-size:var(--miura-fs-sm);
  color:var(--miura-color-text-light);
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) .hero-quick-list{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  justify-content:center;
}
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.hero-quick-link,.hero-quick-list a){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:.55rem .9rem;
  background:#fff;
  border:1px solid var(--miura-color-border);
  border-radius:var(--miura-radius);
  font-size:var(--miura-fs-sm);
  color:var(--miura-color-text);
  text-decoration:none;
  transition:var(--miura-transition);
  box-shadow:var(--miura-shadow);
}
@media (hover:hover) and (pointer:fine){
  :where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(.hero-quick-link,.hero-quick-list a):hover{
    box-shadow:var(--miura-shadow-hover);
    transform:translateY(-1px);
  }
}

/* =========================================================
   Works links (ul.miura-service-list)
========================================================= */
:where(.miura-service-page) .miura-service-list{
  list-style:none;
  padding-left:0;
  margin:0;
  display:grid;
  gap:.75rem;
}
:where(.miura-service-page) .miura-service-list li{
  list-style:none;
}
:where(.miura-service-page) .miura-service-list li::before{
  content:none !important;
}
:where(.miura-service-page) .miura-service-list a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.9rem 1rem;
  border:1px solid var(--miura-color-border);
  border-radius:var(--miura-radius);
  background:#fff;
  box-shadow:var(--miura-shadow);
  text-decoration:none;
  font-weight:700;
  color:var(--miura-color-text);
}
:where(.miura-service-page) .miura-service-list a::after{
  content:"›";
  opacity:.55;
  font-size:1.1em;
}
@media (hover:hover) and (pointer:fine){
  :where(.miura-service-page) .miura-service-list a:hover{
    box-shadow:var(--miura-shadow-hover);
    transform:translateY(-1px);
  }
}

/* =========================================================
   Details UI (tap-to-open)
========================================================= */
:where(.miura-service-page) details > summary{
  list-style:none;
  cursor:pointer;
  user-select:none;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;

  min-height:44px;
  padding:.9rem 1rem;
  border:1px solid var(--miura-color-border);
  border-radius:var(--miura-radius);
  background:#fff;
  box-shadow:var(--miura-shadow);
}
:where(.miura-service-page) details > summary::-webkit-details-marker{ display:none; }
:where(.miura-service-page) details > summary::after{
  content:"▾";
  opacity:.75;
  font-size:1.1em;
  transition:transform .18s ease;
}
:where(.miura-service-page) details[open] > summary::after{ transform:rotate(180deg); }
:where(.miura-service-page) details[open] > summary{
  border-color:color-mix(in srgb, var(--miura-color-theme) 45%, var(--miura-color-border));
}
:where(.miura-service-page) details > :not(summary){ margin-top:.75rem; }
:where(.miura-service-page) details > summary:focus-visible{
  outline:3px solid color-mix(in srgb, var(--miura-color-theme) 65%, #fff);
  outline-offset:3px;
}

/* =========================================================
   Related links (他の住宅設備ページを見る)
========================================================= */
:where(.miura-service-section.related-links) :where(.hero-quick-nav,.hero-quick-list){
  font-size:1rem; /* テーマ側font-size:0等を無効化 */
}

:where(.miura-service-section.related-links) .hero-quick-nav .hero-quick-list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.75rem;
}
@media (min-width:768px){
  :where(.miura-service-section.related-links) .hero-quick-nav .hero-quick-list{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}

:where(.miura-service-section.related-links) .hero-quick-nav .hero-quick-list a{
  --miura-link-accent: var(--miura-color-theme);

  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:.9rem .9rem .9rem 1.1rem;

  border-style:solid !important;
  border-width:1px !important;
  border-color:color-mix(in srgb, var(--miura-link-accent) 28%, var(--miura-color-border)) !important;

  border-radius:var(--miura-radius);
  background:#fff;
  box-shadow:var(--miura-shadow) !important;

  text-decoration:none;
  font-weight:800;
  font-size:var(--miura-fs-sm);
  line-height:1.2;
  color:var(--miura-color-text);

  outline:none !important;
}
:where(.miura-service-section.related-links) .hero-quick-nav .hero-quick-list a::before{
  content:"";
  position:absolute;
  left:0;
  top:10px;
  bottom:10px;
  width:4px;
  border-radius:999px;
  background:var(--miura-link-accent);
  opacity:.9;
}

/* 薄い色面（高級寄せ） */
:where(.miura-service-section.related-links) .hero-quick-link--gas{ --miura-link-accent:#b34700; background:color-mix(in srgb, #b34700 10%, #fff) !important; }
:where(.miura-service-section.related-links) .hero-quick-link--suidou{ --miura-link-accent:#0097a7; background:color-mix(in srgb, #0097a7 10%, #fff) !important; }
:where(.miura-service-section.related-links) .hero-quick-link--denki{  --miura-link-accent:#283593; background:color-mix(in srgb, #283593 10%, #fff) !important; }
:where(.miura-service-section.related-links) .hero-quick-link--sekiyu{  --miura-link-accent:#d84315; background:color-mix(in srgb, #d84315 10%, #fff) !important; }
:where(.miura-service-section.related-links) .hero-quick-link--maintenance{ --miura-link-accent:#6b4f3a; background:color-mix(in srgb, #6b4f3a 10%, #fff) !important; }
:where(.miura-service-section.related-links) .hero-quick-link--works{ --miura-link-accent:#455a64; background:color-mix(in srgb, #455a64 10%, #fff) !important; }
:where(.miura-service-section.related-links) .hero-quick-link--event{ --miura-link-accent:#ad1457; background:color-mix(in srgb, #ad1457 10%, #fff) !important; }

/* current/activeの強制装飾をこのブロック内だけ無効化 */
:where(.miura-service-section.related-links) .hero-quick-nav .hero-quick-list
a:is(.current,.current-menu-item,.current_page_item,.current-menu-ancestor,.current_page_ancestor,.is-active,.active,[aria-current]){
  outline:none !important;
  border-width:1px !important;
  box-shadow:var(--miura-shadow) !important;
}

/* フォーカスは統一（枠が暴れない） */
:where(.miura-service-section.related-links) .hero-quick-nav .hero-quick-list a:focus-visible{
  outline:3px solid color-mix(in srgb, var(--miura-link-accent) 45%, #fff) !important;
  outline-offset:3px;
}

/* =========================================================
   A11y / Reduced motion
========================================================= */
:where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) :where(a,button):focus-visible{
  outline:3px solid var(--miura-color-theme);
  outline-offset:2px;
}
@media (prefers-reduced-motion: reduce){
  :where(.miura-service-page,.case-detail,.miura-event-page,.miura-home-page) *{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* --- Hero quick nav: mobile grid alignment --- */
@media (max-width: 480px){
  :where(.miura-service-page)
  > :where(.gas-hero,.denki-hero,.suidou-hero,.sekiyu-hero,.maintenance-hero)
  .hero-quick-nav .hero-quick-list{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .6rem !important;
    justify-items: stretch;
  }

  :where(.miura-service-page)
  > :where(.gas-hero,.denki-hero,.suidou-hero,.sekiyu-hero,.maintenance-hero)
  .hero-quick-nav .hero-quick-list > a{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding-inline: .7rem;
  }

  :where(.miura-service-page)
  > :where(.gas-hero,.denki-hero,.suidou-hero,.sekiyu-hero,.maintenance-hero)
  .hero-quick-nav .hero-quick-list > a:last-child:nth-child(odd){
    grid-column: 1 / -1;
  }
}