/* DOG EYE トップページ専用CSS */

.hero{
min-height:650px;
position:relative;
display:flex;
align-items:center;
overflow:hidden}

.hero>img{
position:absolute;
width:100%;
height:100%;
object-fit:cover}

.shade{
position:absolute;
inset:0;
background:linear-gradient(90deg,#102b35df,#102b3580 45%,transparent)}

.hero-copy{
position:relative;
color:#fff;
width:1180px;
max-width:100%;
margin:auto;
padding:70px 36px}

.hero-copy>span{
background:var(--orange);
padding:7px 14px;
border-radius:99px;
font-weight:800;
font-size:.85rem}

.hero h1{
font-size:clamp(2.8rem,6vw,5.2rem);
line-height:1.12;
letter-spacing:-.04em;
margin:24px 0 15px}

.hero p{
max-width:590px;
font-weight:600}

.info{
max-width:1120px;
margin:-38px auto 0;
position:relative;
background:#fff;
display:grid;
grid-template-columns:repeat(3,1fr);
border-radius:20px;
box-shadow:0 15px 40px #3c230d1c;
overflow:hidden}

.info>div{
padding:24px 28px;
border-right:1px solid var(--line);
display:flex;
flex-direction:column}

.info small{
color:#7e6f62}

.home-news{
width:min(1180px,calc(100% - 40px));
margin:22px auto;
background:#fff;
border:1px solid var(--line);
border-radius:18px;
display:grid;
grid-template-columns:180px minmax(0,1fr);
overflow:hidden;
box-shadow:0 12px 35px #5b33120d}

.home-news-heading{
background:var(--navy);
color:#fff;
padding:24px;
display:flex;
flex-direction:column;
justify-content:center}

.home-news-heading small{
color:#ffab6d;
font-weight:900;
letter-spacing:.15em}

.home-news-heading h2{
margin:2px 0;
font-size:1.45rem}

.home-news-scroll{
min-height:132px;
max-height:286px;
overflow-y:auto;
overscroll-behavior:contain;
scrollbar-gutter:stable}

.home-news-item{
min-height:66px;
padding:15px 20px;
border-bottom:1px solid var(--line);
display:grid;
grid-template-columns:100px minmax(0,1fr) auto;
align-items:center;
gap:18px}

.home-news-item:last-child{
border-bottom:0}

.home-news-item:hover{
background:#fff8f1}

.home-news-item time{
color:#6a777d;
font-size:.88rem}

.home-news-item strong{
overflow-wrap:anywhere}

.home-news-item span{
color:var(--orange);
font-weight:800;
white-space:nowrap}

.home-about{
display:grid;
grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);
align-items:center;
gap:55px}

.home-about-copy h2{
max-width:760px;
margin:8px 0 24px;
font-size:clamp(2rem,4vw,3.35rem);
line-height:1.35}

.home-about-copy p{
margin:0 0 16px;
color:#52656d;
font-size:1.05rem;
line-height:2}

.home-visit-guide{
padding:34px;
border-radius:24px;
background:var(--navy);
color:#fff;
box-shadow:0 18px 45px #102b3526}

.home-visit-guide>small{
color:#ffab6d;
font-weight:900;
letter-spacing:.15em}

.home-visit-guide h3{
margin:5px 0 20px;
font-size:1.6rem}

.home-visit-guide ul{
margin:0;
padding:0;
list-style:none}

.home-visit-guide li{
display:flex;
justify-content:space-between;
gap:18px;
padding:12px 0;
border-bottom:1px solid #ffffff2e}

.home-visit-guide li span{
text-align:right;
color:#dce9ed}

.home-visit-guide>a{
display:inline-block;
margin-top:23px;
color:#ffab6d;
font-weight:900}

.home-strengths{
background:#fff;
border-block:1px solid var(--line)}

.home-strengths h2{
margin:8px 0 32px;
font-size:clamp(2rem,4vw,3.2rem)}

.home-strength-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:18px}

.home-strength-grid article{
position:relative;
min-height:230px;
padding:30px;
border:1px solid var(--line);
border-radius:20px;
background:var(--cream);
overflow:hidden}

.home-strength-grid article>small{
position:absolute;
right:20px;
top:6px;
color:#c1845b;
font:900 4.7rem/1 Arial}

.home-strength-grid h3{
position:relative;
max-width:80%;
margin:0 0 12px;
font-size:1.3rem;
line-height:1.45}

.home-strength-grid p{
position:relative;
margin:0;
color:#5b6970}

.home-strength-grid a{
position:relative;
display:inline-block;
margin-top:14px;
color:var(--orange);
font-weight:900}

.cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:22px}

.feature{
position:relative;
min-height:300px;
background:#fff;
border:1px solid var(--line);
border-radius:24px;
padding:30px;
text-align:left;
overflow:hidden}

.feature i{
position:absolute;
right:-5px;
bottom:-40px;
font:900 11rem serif;
color:#fff0e5}

.feature small{
color:var(--orange);
font-weight:800}

.feature h3{
font-size:1.7rem}

.feature span{
position:absolute;
bottom:28px;
font-weight:800;
color:var(--orange)}

.grooming-home{
border-top:1px solid var(--line)}

.grooming-home>h2{
font-size:clamp(2rem,4vw,3rem);
margin:8px 0 30px}

.grooming-post-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:22px}

.grooming-post-card{
overflow:hidden;
background:#fff;
border:1px solid var(--line);
border-radius:20px;
box-shadow:0 10px 28px #3c230d12}

.grooming-cover{
display:grid;
place-items:center;
width:100%;
aspect-ratio:4/3;
background:#f4ddca;
font-size:5rem;
overflow:hidden}

.grooming-cover img{
width:100%;
height:100%;
object-fit:cover}

.grooming-post-card>div:last-child{
padding:18px 20px}

.grooming-post-card time{
color:var(--orange);
font-weight:800}

.grooming-post-card h2{
margin:4px 0 8px;
line-height:1.45}

.grooming-post-card h3{
margin:4px 0 8px;
line-height:1.45}

.grooming-post-card p{
color:#617078}

.grooming-post-card span{
font-weight:800;
color:var(--orange)}

@media(max-width:850px){
.hero{
min-height:620px;
align-items:end}

.home-news{
width:calc(100% - 28px);
margin:14px auto;
grid-template-columns:1fr}

.home-news-heading{
padding:13px 16px;
flex-direction:row;
align-items:baseline;
justify-content:flex-start;
gap:12px}

.home-news-heading h2{
font-size:1.2rem}

.home-news-scroll{
min-height:120px;
max-height:230px}

.home-news-item{
min-height:60px;
padding:12px 14px;
grid-template-columns:82px minmax(0,1fr);
gap:10px}

.home-news-item span{
display:none}

.shade{
background:linear-gradient(0deg,#102b35f2,#102b3590 60%,transparent)}

.hero-copy{
padding:140px 22px 45px}

.hero h1{
font-size:2.55rem}

.info{
margin:0;
border-radius:0;
grid-template-columns:1fr}

.info>div{
padding:14px 22px;
border-bottom:1px solid var(--line)}

.cards{
grid-template-columns:1fr}

.home-about{
grid-template-columns:1fr;
gap:30px}

.home-strength-grid{
grid-template-columns:1fr}
}

@media(max-width:850px){
.grooming-post-grid{
grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:600px){
.home-about-copy h2{
font-size:1.85rem}

.home-about-copy p{
font-size:1rem;
line-height:1.85}

.home-visit-guide{
padding:25px 20px;
border-radius:18px}

.home-visit-guide li{
align-items:flex-start;
flex-direction:column;
gap:2px}

.home-visit-guide li span{
text-align:left}

.home-strength-grid article{
min-height:0;
padding:25px 20px}

.home-strength-grid h3{
max-width:76%}

.grooming-post-grid{
grid-template-columns:minmax(0,1fr)}
}


/* 15.11: reserve the existing 4:3 cover before image decoding. */
.grooming-cover{position:relative;min-width:0}
.grooming-cover img{position:absolute;inset:0;min-width:0;min-height:0}

/* 15.24: managed hero / first visit / phone / FAQ */
.hero>img.home-slide{inset:0;opacity:0;transition:opacity .65s ease;pointer-events:none}
.hero>img.home-slide.is-current{opacity:1}
.hero .home-image-note{position:absolute;right:18px;top:16px;max-width:calc(100% - 36px);padding:5px 9px;border-radius:5px;background:#102b35df;color:white;font-size:.72rem;z-index:2}
.hero .home-image-note[hidden]{display:none}
.hero-copy{padding-bottom:125px}
.home-slide-controls{position:absolute;bottom:52px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:30px;background:#102b35eb;color:#fff;z-index:3;white-space:nowrap}
.home-slide-controls button{min-height:44px;min-width:44px;border:1px solid #ffffff80;border-radius:22px;background:transparent;color:white;font:inherit;cursor:pointer;padding:6px 12px}
.home-slide-controls button:focus-visible,.home-faq summary:focus-visible{outline:3px solid #ffb877;outline-offset:3px}
.home-contact-bar{max-width:1120px;margin:24px auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:0 20px}
.home-contact-bar>div{background:#fff1e5;border:1px solid #edc8ac;padding:20px 24px;border-radius:16px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.home-contact-bar a{font-size:clamp(1.35rem,3vw,1.8rem);font-weight:900;color:#9c3c00;text-decoration:underline;min-height:44px}
.home-contact-bar small{color:#4b5559}
.home-photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:22px}
.home-photo-grid figure{margin:0;overflow:hidden;border-radius:16px;background:white;border:1px solid var(--line)}
.home-photo-grid img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.home-photo-grid figcaption{padding:12px 16px;color:#52656d;font-size:.88rem}
.home-rules .home-strength-grid article{background:#fffaf3}
.home-rules .home-strength-grid h3{max-width:100%}
.home-rules .home-strength-grid p{line-height:1.9}
.home-booking{text-align:center;background:#fff1e5;border-radius:20px}
.home-faq details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:0 20px;margin:12px 0}
.home-faq summary{padding:19px 0;font-weight:800;cursor:pointer}
.home-faq details p{line-height:1.9;margin:0 0 20px}
.home-faq a{text-decoration:underline;color:#9c3c00}
@media(max-width:700px){.home-contact-bar{grid-template-columns:1fr}.hero-copy{padding-top:90px;padding-bottom:135px}.hero .home-image-note{font-size:.65rem}.home-slide-controls{bottom:55px}.home-booking .button{max-width:100%;font-size:.95rem}.home-photo-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.hero>img.home-slide{transition:none}}

@media(max-width:700px){.hero h1{font-size:clamp(1.65rem,7.8vw,2.15rem)}}