/*
Theme Name: Lilly HOME WordPress Theme
Theme URI: https://lillyhome.biz/
Author: Lilly HOME
Description: Lilly HOMEの現行サイトデザインを移植したカスタムWordPressテーマです。お問い合わせはContact Form 7で設定します。
Version: 1.0.2
Text Domain: lilly-home-wordpress
*/

:root {
  --lilly-navy: #1e3a5f;
  --lilly-navy-light: #2a4f80;
  --lilly-gold: #c9a227;
  --lilly-gold-soft: #f8f2df;
  --lilly-ink: #243447;
  --lilly-muted: #64748b;
  --lilly-canvas: #f7f8fa;
  --lilly-border: #e5e7eb;
  --lilly-radius: 1.25rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.lilly-site { margin: 0; color: var(--lilly-ink); background: #fff; font-family: "Noto Sans JP", sans-serif; }
body.lilly-site img { max-width: 100%; height: auto; }
.lilly-shell { min-height: 100vh; display: flex; flex-direction: column; }
.lilly-container { width: min(100% - 2rem, 1120px); margin-inline: auto; }
.lilly-react-fallback { min-height: 100vh; display: flex; align-items: center; overflow: hidden; color: #fff; background: radial-gradient(circle at 80% 35%,rgba(35,81,123,.55),transparent 28%),var(--lilly-navy); }
.lilly-react-fallback__inner { width: min(100% - 4rem, 1120px); margin-inline: auto; padding: 9rem 0; }
.lilly-react-fallback p:first-child { margin: 0 0 1rem; color: #e1bd39; font-family: "Playfair Display",serif; font-size: .8rem; font-weight: 700; letter-spacing: .2em; }
.lilly-react-fallback h1 { margin: 0; color: #fff; font-family: "Noto Serif JP",serif; font-size: clamp(2.4rem,6vw,5.1rem); line-height: 1.35; }
.lilly-react-fallback h1 + p { max-width: 42rem; margin: 1.5rem 0 2rem; color: #d4e3f2; font-size: 1rem; line-height: 1.9; }
.lilly-react-fallback a { display: inline-flex; padding: 1rem 1.6rem; border-radius: 99px; background: var(--lilly-gold); color: #fff; text-decoration: none; font-size: 14px; font-weight: 700; }

/* Static header / footer used on the Contact Form 7 page. */
.lilly-static-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.97); border-bottom: 1px solid #edf0f3; box-shadow: 0 2px 12px rgba(24,58,95,.04); }
.lilly-header-row { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.lilly-brand { display: inline-flex; align-items: center; gap: .55rem; color: var(--lilly-navy); text-decoration: none; font-family: "Playfair Display", "Noto Serif JP", serif; font-weight: 700; letter-spacing: .02em; }
.lilly-brand-mark { width: 24px; height: 24px; display: grid; place-items: center; background: var(--lilly-navy); color: white; border-radius: 6px; font-family: "Noto Sans JP", sans-serif; font-size: 11px; }
.lilly-nav { display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap; }
.lilly-nav a { color: #334155; text-decoration: none; font-size: 11px; font-weight: 700; white-space: nowrap; }
.lilly-nav a:hover, .lilly-nav a:focus-visible { color: var(--lilly-gold); }
.lilly-header-actions { display: flex; align-items: center; gap: .55rem; }
.lilly-phone { color: var(--lilly-navy); text-decoration: none; font-size: 11px; font-weight: 700; white-space: nowrap; }
.lilly-header-cta, .lilly-btn { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; border: 0; border-radius: 999px; padding: .68rem 1.05rem; background: var(--lilly-gold); color: #fff; text-decoration: none; font-size: 12px; font-weight: 700; transition: transform .16s cubic-bezier(.23,1,.32,1), filter .16s ease; }
.lilly-header-cta:hover, .lilly-btn:hover { filter: brightness(1.06); transform: translateY(-1px); }
.lilly-header-cta:active, .lilly-btn:active { transform: scale(.97); }

/* Contact page. */
.lilly-contact-hero { position: relative; overflow: hidden; padding: 5.5rem 0 6.5rem; color: #fff; background: linear-gradient(135deg, var(--lilly-navy), var(--lilly-navy-light)); }
.lilly-contact-hero::before { content: ""; position: absolute; inset: 0; opacity: .1; background: repeating-linear-gradient(45deg, transparent 0 20px, rgba(255,255,255,.22) 20px 21px); }
.lilly-contact-hero::after { content: ""; position: absolute; z-index: 1; left: -5%; right: -5%; bottom: -26px; height: 50px; border-radius: 50% 50% 0 0; background: #fff; }
.lilly-contact-hero .lilly-container { position: relative; z-index: 2; }
.lilly-eyebrow { margin: 0 0 .65rem; color: #f9db6e; font-family: "Playfair Display", serif; font-size: 13px; letter-spacing: .18em; font-weight: 700; text-transform: uppercase; }
.lilly-contact-hero h1 { margin: 0; color: #fff; font-family: "Noto Serif JP", serif; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.35; }
.lilly-contact-hero p { max-width: 38rem; margin: .8rem 0 0; color: #d7e7fb; font-size: 1rem; line-height: 1.8; }
.lilly-section { padding: 4.5rem 0; }
.lilly-section--soft { background: var(--lilly-canvas); }
.lilly-section-title { margin: 0 auto 2.25rem; text-align: center; }
.lilly-section-title__en { display: block; color: var(--lilly-gold); font-family: "Playfair Display", serif; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.lilly-section-title h2 { margin: .4rem 0 0; color: var(--lilly-navy); font-family: "Noto Serif JP", serif; font-size: clamp(1.45rem, 3vw, 2rem); }
.lilly-section-title p { margin: .55rem auto 0; max-width: 45rem; color: var(--lilly-muted); font-size: 13px; line-height: 1.8; }
.lilly-contact-methods { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.5rem; margin-bottom: 4rem; }
.lilly-method-card { padding: 2rem 1.5rem; border: 1px solid #edf0f3; border-radius: var(--lilly-radius); background: #fff; text-align: center; box-shadow: 0 8px 22px rgba(24,58,95,.035); transition: transform .18s cubic-bezier(.23,1,.32,1), box-shadow .18s ease; }
.lilly-method-card:hover { transform: translateY(-4px); box-shadow: 0 16px 28px rgba(24,58,95,.1); }
.lilly-method-icon { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto 1rem; border-radius: 18px; font-size: 25px; }
.lilly-method-card h3 { margin: 0; color: var(--lilly-navy); font-size: 15px; }
.lilly-method-card strong { display: block; margin: .25rem 0; font-size: 17px; }
.lilly-method-card small { display: block; min-height: 2rem; color: #94a3b8; font-size: 11px; }
.lilly-method-card .lilly-btn { width: 100%; margin-top: 1.1rem; border-radius: .75rem; }
.lilly-navy-btn { background: var(--lilly-navy); }
.lilly-line-btn { background: #06c755; }
.lilly-gold-btn { background: var(--lilly-gold); }

.lilly-contact-form-panel { padding: clamp(1.5rem, 4vw, 2.5rem); border-radius: 1.5rem; background: #f8fafc; }
.lilly-contact-form-panel h2 { display: flex; align-items: center; gap: .65rem; margin: 0 0 1.5rem; color: var(--lilly-navy); font-family: "Noto Serif JP", serif; font-size: 1.25rem; }
.lilly-contact-form-panel h2::before { width: 4px; height: 1.5rem; border-radius: 99px; background: var(--lilly-gold); content: ""; }
.lilly-cf7-info { margin-bottom: 1.25rem; padding: .85rem 1rem; border: 1px solid rgba(30,58,95,.15); border-radius: 1rem; background: #fff; color: #475569; font-size: 12px; line-height: 1.75; }
.lilly-cf7-info strong { color: var(--lilly-navy); }
.lilly-cf7-missing { padding: 1.25rem; border: 1px dashed rgba(201,162,39,.8); border-radius: 1rem; background: #fffdf5; color: #73550a; font-size: 13px; line-height: 1.8; }
.lilly-contact-form-panel .wpcf7-form { display: grid; gap: 1.1rem; }
.lilly-contact-form-panel .wpcf7-form p { margin: 0; }
.lilly-contact-form-panel label { display: block; color: #374151; font-size: 14px; font-weight: 600; }
.lilly-contact-form-panel .required { color: #dc2626; }
.lilly-contact-form-panel input:not([type=checkbox]), .lilly-contact-form-panel select, .lilly-contact-form-panel textarea { width: 100%; margin-top: .45rem; padding: .82rem 1rem; border: 1px solid #dbe1e8; border-radius: .75rem; outline: 0; background: #fff; color: #1f2937; font: inherit; font-size: 14px; transition: box-shadow .16s ease, border-color .16s ease; }
.lilly-contact-form-panel textarea { min-height: 9rem; resize: vertical; }
.lilly-contact-form-panel input:focus, .lilly-contact-form-panel select:focus, .lilly-contact-form-panel textarea:focus { border-color: var(--lilly-navy); box-shadow: 0 0 0 3px rgba(30,58,95,.12); }
.lilly-contact-form-panel .lilly-cf7-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1.1rem; }
.lilly-contact-form-panel .wpcf7-list-item { margin: 0; }
.lilly-contact-form-panel .wpcf7-submit { width: 100%; padding: 1rem 1.2rem; border: 0; border-radius: .75rem; cursor: pointer; background: linear-gradient(135deg, var(--lilly-navy), var(--lilly-navy-light)); color: #fff; font-family: inherit; font-size: 15px; font-weight: 700; transition: filter .16s ease, transform .16s cubic-bezier(.23,1,.32,1); }
.lilly-contact-form-panel .wpcf7-submit:hover { filter: brightness(1.1); }
.lilly-contact-form-panel .wpcf7-submit:active { transform: scale(.98); }
.lilly-contact-form-panel .wpcf7-not-valid-tip { margin-top: .35rem; color: #dc2626; font-size: 12px; }
.lilly-contact-form-panel .wpcf7-response-output { margin: .25rem 0 0 !important; padding: .8rem 1rem !important; border-radius: .75rem; font-size: 13px; }
.lilly-contact-note { display: flex; align-items: flex-start; gap: .5rem; margin-top: 1.25rem; color: #64748b; font-size: 12px; line-height: 1.7; }
.lilly-cf7-confirm { display: grid; gap: 1.25rem; }
.lilly-cf7-confirm__intro { display: flex; gap: .75rem; padding: 1rem; border: 1px solid rgba(201,162,39,.5); border-radius: 1rem; background: #fffdf5; color: #475569; font-size: 12px; line-height: 1.75; }
.lilly-cf7-confirm__intro strong { display: block; color: var(--lilly-navy); font-size: 14px; }
.lilly-cf7-confirm__rows { overflow: hidden; border: 1px solid #e5e7eb; border-radius: 1rem; background: #fff; }
.lilly-cf7-confirm__row { display: grid; grid-template-columns: 9rem minmax(0, 1fr); border-bottom: 1px solid #edf0f3; }
.lilly-cf7-confirm__row:last-child { border-bottom: 0; }
.lilly-cf7-confirm__row dt, .lilly-cf7-confirm__row dd { margin: 0; padding: .8rem 1rem; font-size: 13px; line-height: 1.7; }
.lilly-cf7-confirm__row dt { background: #f8fafc; color: var(--lilly-navy); font-weight: 700; }
.lilly-cf7-confirm__row dd { white-space: pre-wrap; overflow-wrap: anywhere; color: #475569; }
.lilly-cf7-confirm__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.lilly-cf7-confirm__back { padding: 1rem; border: 1px solid rgba(30,58,95,.3); border-radius: .75rem; background: #fff; color: var(--lilly-navy); cursor: pointer; font: inherit; font-size: 14px; font-weight: 700; }
.lilly-cf7-confirm__send { padding: 1rem; border: 0; border-radius: .75rem; background: var(--lilly-navy); color: #fff; cursor: pointer; font: inherit; font-size: 14px; font-weight: 700; }
.lilly-cf7-complete { padding: 3.25rem 1rem; text-align: center; }
.lilly-cf7-complete__mark { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto 1rem; border-radius: 50%; background: rgba(30,58,95,.1); color: var(--lilly-navy); font-size: 30px; }
.lilly-cf7-complete__eyebrow { margin: 0; color: var(--lilly-gold); font-family: "Playfair Display",serif; font-size: 11px; font-weight: 700; letter-spacing: .16em; }
.lilly-cf7-complete h3 { margin: .35rem 0 .75rem; color: var(--lilly-navy); font-family: "Noto Serif JP",serif; font-size: 1.4rem; }
.lilly-cf7-complete p { margin: 0 auto; max-width: 34rem; color: #64748b; font-size: 13px; line-height: 1.8; }
.lilly-cf7-complete__actions { display: flex; justify-content: center; gap: .75rem; margin-top: 1.5rem; flex-wrap: wrap; }
.lilly-cf7-complete__actions a { display: inline-flex; align-items: center; justify-content: center; min-width: 11rem; padding: .8rem 1rem; border: 1px solid rgba(30,58,95,.3); border-radius: .75rem; color: var(--lilly-navy); text-decoration: none; font-size: 13px; font-weight: 700; }
.lilly-cf7-complete__actions a:first-child { border-color: var(--lilly-navy); background: var(--lilly-navy); color: #fff; }

.lilly-company-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 2.5rem; align-items: start; }
.lilly-info-table, .lilly-access-card { overflow: hidden; border: 1px solid #edf0f3; border-radius: 1rem; background: #fff; box-shadow: 0 8px 20px rgba(24,58,95,.03); }
.lilly-info-table__title { padding: 1rem 1.25rem; background: var(--lilly-navy); color: #fff; font-size: 14px; font-weight: 700; }
.lilly-info-table dl { margin: 0; }
.lilly-info-table__row { display: grid; grid-template-columns: 8.2rem minmax(0,1fr); }
.lilly-info-table__row:nth-child(even) { background: #f8fafc; }
.lilly-info-table dt, .lilly-info-table dd { margin: 0; padding: .85rem 1.2rem; font-size: 12px; line-height: 1.7; }
.lilly-info-table dt { color: var(--lilly-navy); font-weight: 700; }
.lilly-info-table dd { color: #475569; }
.lilly-access-card { margin-top: 1.25rem; padding: 1.25rem; }
.lilly-access-card h3 { margin: 0 0 1rem; color: var(--lilly-navy); font-size: 15px; }
.lilly-access-card p { margin: 0 0 .85rem; color: #475569; font-size: 13px; line-height: 1.7; }
.lilly-map-placeholder { min-height: 320px; display: grid; place-items: center; padding: 1.5rem; border-radius: 1rem; background: linear-gradient(135deg,#edf3f6,#fafafa); color: #64748b; text-align: center; font-size: 13px; }
.lilly-map-placeholder strong { display: block; margin-bottom: .5rem; color: var(--lilly-navy); }
.lilly-map-placeholder .lilly-btn { margin-top: 1rem; background: #fff; border: 1px solid var(--lilly-navy); color: var(--lilly-navy); }
.lilly-office-photos { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-top: .75rem; }
.lilly-office-photo { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: .75rem; background: #dce5f0; }
.lilly-office-photo:last-child { grid-column: span 2; }
.lilly-office-photo img { width: 100%; height: 100%; object-fit: cover; }
.lilly-office-photo span { position: absolute; inset: auto 0 0; padding: .75rem; background: linear-gradient(transparent,rgba(0,0,0,.65)); color: #fff; font-size: 11px; font-weight: 700; }

.lilly-steps { max-width: 720px; margin: 0 auto; }
.lilly-step { position: relative; display: grid; grid-template-columns: 3rem minmax(0,1fr); gap: 1rem; padding-bottom: 1rem; }
.lilly-step:not(:last-child)::before { position: absolute; top: 3rem; bottom: -.25rem; left: 1.45rem; width: 2px; background: linear-gradient(var(--lilly-navy),var(--lilly-gold)); content: ""; }
.lilly-step__badge { position: relative; z-index: 1; width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 50%; background: var(--lilly-navy); color: #fff; font-size: 12px; font-weight: 700; box-shadow: 0 5px 12px rgba(24,58,95,.2); }
.lilly-step:last-child .lilly-step__badge { background: var(--lilly-gold); }
.lilly-step__body { padding: 1rem 1.2rem; border: 1px solid #edf0f3; border-radius: 1rem; background: #f8fafc; }
.lilly-step__meta { color: var(--lilly-gold); font-size: 11px; font-weight: 700; }
.lilly-step__body h3 { margin: .3rem 0; color: var(--lilly-navy); font-family: "Noto Serif JP",serif; font-size: 15px; }
.lilly-step__body p { margin: 0; color: #64748b; font-size: 13px; line-height: 1.75; }
.lilly-faq-list { max-width: 720px; margin: 0 auto; }
.lilly-faq-list details { margin-bottom: .7rem; overflow: hidden; border: 1px solid #e2e8f0; border-radius: 1rem; background: #fff; }
.lilly-faq-list summary { cursor: pointer; padding: 1rem 1.2rem; color: var(--lilly-navy); font-size: 14px; font-weight: 700; }
.lilly-faq-list details p { margin: 0; padding: 0 1.2rem 1.2rem; color: #64748b; font-size: 13px; line-height: 1.8; }

.lilly-consult-banner { padding: 3.75rem 0; background: #eef3f7; }
.lilly-consult-inner { max-width: 800px; margin: 0 auto; padding: 2rem; border-radius: 1.2rem; background: var(--lilly-navy); color: #fff; text-align: center; box-shadow: 0 16px 28px rgba(24,58,95,.14); }
.lilly-consult-inner h2 { margin: 0; font-family: "Noto Serif JP",serif; font-size: 1.35rem; }
.lilly-consult-inner p { margin: .75rem auto 1.25rem; max-width: 34rem; color: #dce8f5; font-size: 13px; line-height: 1.8; }
.lilly-consult-actions { display: flex; justify-content: center; gap: .75rem; flex-wrap: wrap; }
.lilly-consult-actions .lilly-btn { background: #fff; color: var(--lilly-navy); }
.lilly-consult-actions .lilly-btn:first-child { background: var(--lilly-gold); color: #fff; }

.lilly-static-footer { margin-top: auto; background: #0f2b4b; color: #d8e5f2; }
.lilly-footer-notices { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.lilly-footer-notice { padding: .7rem; border: 1px solid rgba(255,255,255,.12); border-radius: .7rem; font-size: 10px; line-height: 1.5; }
.lilly-footer-main { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 2rem; padding: 2.5rem 0; }
.lilly-footer-main h2, .lilly-footer-main h3 { margin: 0 0 .7rem; color: #fff; font-size: 13px; }
.lilly-footer-main p, .lilly-footer-main a { margin: 0 0 .35rem; color: #b9cadb; text-decoration: none; font-size: 11px; line-height: 1.7; }
.lilly-footer-links { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .25rem .75rem; }
.lilly-copyright { padding: 1rem 0; border-top: 1px solid rgba(255,255,255,.13); color: #8ca4bb; font-size: 10px; }

@media (max-width: 900px) {
  .lilly-nav { display: none; }
  .lilly-header-row { min-height: 58px; }
  .lilly-phone { display: none; }
  .lilly-contact-methods, .lilly-company-grid { grid-template-columns: 1fr; }
  .lilly-footer-notices { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lilly-footer-main { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .lilly-container { width: min(100% - 1.25rem, 1120px); }
  .lilly-header-cta { padding: .55rem .7rem; font-size: 10px; }
  .lilly-contact-hero { padding: 4rem 0 5rem; }
  .lilly-section { padding: 3.25rem 0; }
  .lilly-contact-methods { gap: 1rem; }
  .lilly-contact-form-panel .lilly-cf7-grid { grid-template-columns: 1fr; }
  .lilly-cf7-confirm__row { grid-template-columns: 1fr; }
  .lilly-cf7-confirm__row dt { padding-bottom: .35rem; }
  .lilly-cf7-confirm__row dd { padding-top: .35rem; }
  .lilly-cf7-confirm__actions { grid-template-columns: 1fr; }
  .lilly-info-table__row { grid-template-columns: 6.3rem minmax(0,1fr); }
  .lilly-info-table dt, .lilly-info-table dd { padding: .75rem; }
  .lilly-footer-main { grid-template-columns: 1fr; gap: 1.25rem; }
}
