/*
Theme Name: L'Oustal d'Aure
Theme URI: https://loustal-daure.magic-bead-3651.chatgpt.site
Author: L'Oustal d'Aure
Description: Thème WordPress sur mesure pour la page d'accueil de L'Oustal d'Aure à Saint-Lary-Soulan.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: loustal-daure
*/

:root{--black:#131311;--gold:#bd8745;--cream:#f2eee6;--ink:#211f1b;--line:#d8cfc0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,sans-serif}
a{text-decoration:none;color:inherit}
img{display:block;width:100%}
h1,h2,h3,p{margin-top:0}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nav{position:absolute;z-index:5;width:100%;height:88px;padding:0 4.5vw;display:flex;align-items:center;justify-content:space-between;color:white;background:linear-gradient(#070706aa,transparent)}
.nav nav{position:absolute;left:56%;transform:translateX(-50%);display:flex;gap:31px;font-size:11px;letter-spacing:.08em;white-space:nowrap}
.nav nav a{padding:12px 0}
.nav nav .active{color:var(--gold);border-bottom:2px solid var(--gold)}
.goldButton,.darkButton,.outlineButton{display:inline-flex;align-items:center;justify-content:center;padding:17px 28px;font-size:9px;letter-spacing:.12em}
.goldButton{background:var(--gold);color:white}
.nav>.goldButton{margin-left:auto}
.outlineButton{border:1px solid #ffffff75;color:white}
.darkButton{background:var(--black);color:white}
.hero{height:min(80vh,720px);min-height:610px;position:relative;background:#10151b center/cover no-repeat}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#090909c9,transparent 37%),linear-gradient(180deg,#08080852,transparent 26%)}
.heroBottom{position:absolute;z-index:2;left:4.5vw;right:4.5vw;bottom:52px;display:flex;align-items:end;justify-content:space-between;color:white}
.heroBottom p{font:12px/1.5 Georgia,serif;letter-spacing:.08em;margin-bottom:8px}
.heroBottom span{font:italic 26px Georgia,serif;color:#d39b56}
.heroBottom>div:last-child{display:flex;gap:14px}
.down{position:absolute;z-index:2;bottom:10px;left:50%;color:white;font-size:30px}
.about{display:grid;grid-template-columns:43% 57%;height:460px;min-height:460px}
.aboutCopy{padding:66px 6vw;background:#f7f4ee}
.eyebrow{color:var(--gold);font-size:10px;letter-spacing:.16em;font-weight:bold;margin-bottom:22px}
.eyebrow:after{content:"";display:block;width:30px;height:2px;background:var(--gold);margin-top:12px}
.about h1{font:35px/1.18 Georgia,serif}
.about h1 i{color:var(--gold);font-weight:400}
.aboutCopy>p:not(.eyebrow){font-size:13px;line-height:1.75;color:#56534d;max-width:520px;margin:25px 0}
.aboutImage{height:460px;min-height:0;overflow:hidden;background:#1b1813;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.aboutImage img{width:100%;height:100%;object-fit:cover;object-position:center}
.serviceBand{background:linear-gradient(105deg,#121210,#1d1b16);color:white;padding:32px 4vw;display:grid;grid-template-columns:repeat(5,1fr)}
.serviceBand article{text-align:center;padding:0 22px;border-right:1px solid #ffffff1f}
.serviceBand article:last-child{border:0}
.serviceBand b{display:block;color:var(--gold);font-size:28px;font-weight:400;margin-bottom:13px}
.serviceIcon{display:block;width:38px;height:38px;margin:0 auto;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.serviceBand h3{color:var(--gold);font-size:9px;letter-spacing:.08em}
.serviceBand p{font-size:10px;line-height:1.55;color:#d1cec7}
.rooms{padding:58px 4.5vw 64px;text-align:center;background:#f6f2ea}
.center:after{margin:12px auto}
.rooms>h2{font:36px Georgia,serif;margin:-10px 0 18px}
.roomsSubhead{font:24px Georgia,serif;margin:0 0 7px}
.roomsLead{max-width:650px;margin:0 auto 35px;font:15px/1.65 Georgia,serif;color:#6c665d}
.roomGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.roomGrid article{background:#faf8f3;border:1px solid #d7c5aa;padding-bottom:18px}
.roomPhoto{height:220px;position:relative;overflow:hidden}
.roomPhoto img{height:100%;object-fit:cover;transition:.5s}
.roomGrid article:hover img{transform:scale(1.03)}
.roomPhoto span{position:absolute;right:12px;top:10px;background:#151411c7;color:white;width:32px;height:32px;display:grid;place-items:center;font:11px Georgia,serif}
.roomGrid h3{font:17px Georgia,serif;text-transform:uppercase;letter-spacing:.06em;margin:16px 0 5px}
.roomGrid p{font:12px Georgia,serif;color:#69645c;margin:0 15px 12px}
.roomGrid a{font-size:9px;color:var(--gold);letter-spacing:.1em}
.temp{font-size:9px;color:#8b857b;margin:25px 0 0}
.contact{background:linear-gradient(120deg,#161612,#211f19);color:white;padding:45px 4.5vw;display:grid;grid-template-columns:1fr 1.45fr .75fr;gap:34px;align-items:center}
.contactIntro{border-right:1px solid #8e754f66;padding-right:28px}
.contactIntro h2{font:27px Georgia,serif;margin-bottom:25px}
.contactIntro>p:not(.eyebrow){font-size:11px;line-height:1.6;color:#d3cfc7;margin-bottom:11px}
.contact form{display:grid;gap:8px;border-right:1px solid #8e754f66;padding-right:25px}
.contact form>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.contact input,.contact select,.contact textarea{width:100%;background:transparent;color:#d8d4cc;border:1px solid #6b604f;padding:10px;font:10px Arial,sans-serif}
.contact textarea{height:70px;resize:none}
.contact form button{border:0;background:var(--gold);color:white;text-align:center;padding:12px;font-size:9px;letter-spacing:.1em;cursor:pointer}
.contactBrand{text-align:center}
.contactBrand strong{font:35px/1 Georgia,serif}
.contactBrand p{font:italic 18px Georgia,serif;color:var(--gold);margin:17px 0}
.contactBrand .outlineButton{padding:12px 20px}
.siteFooter{background:#11110f;color:#77746e;border-top:1px solid #ffffff16;padding:18px 4.5vw;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.05em}
.admin-bar .nav{top:32px}
@media(max-width:900px){
 .nav nav{display:none}.hero{height:60vw;min-height:440px}.about{grid-template-columns:1fr;height:auto;min-height:0}.aboutImage{height:480px}.serviceBand{grid-template-columns:repeat(2,1fr)}.serviceBand article{border-bottom:1px solid #ffffff1f;padding:22px}.serviceBand article:last-child{grid-column:1/-1}.roomGrid{grid-template-columns:repeat(2,1fr)}.contact{grid-template-columns:1fr 1.4fr}.contactBrand{grid-column:1/-1;border-top:1px solid #ffffff22;padding-top:30px}
}
@media(max-width:782px){.admin-bar .nav{top:46px}}
@media(max-width:600px){
 .nav{height:75px}.goldButton{padding:13px 17px}.hero{height:70vw;min-height:315px;background-size:contain;background-position:center 75px}.heroBottom{display:none}.aboutCopy{padding:55px 7vw}.about h1{font-size:30px}.aboutImage{height:350px}.serviceBand{grid-template-columns:1fr}.serviceBand article,.serviceBand article:last-child{grid-column:auto;border-right:0}.rooms{padding:55px 5vw}.rooms>h2{font-size:30px}.roomGrid{grid-template-columns:1fr}.roomPhoto{height:280px}.contact{grid-template-columns:1fr;padding:50px 7vw}.contactIntro,.contact form{border-right:0;padding-right:0}.contact form>div{grid-template-columns:1fr}.contactBrand{grid-column:auto}.siteFooter{flex-direction:column;gap:9px;text-align:center}
}