@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600&family=Playfair+Display:ital,wght@0,400;0,500;1,400&display=swap');
:root{--ink:#24292c;--paper:#fff;--soft:#f1f0ec;--accent:#394c62}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--ink);background:var(--paper);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #ab7547;outline-offset:6px}header{height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 6%}.brand{display:flex;flex-direction:column;text-align:center;line-height:1.25}.brand span{font-family:'Playfair Display',Georgia,serif;font-size:23px;letter-spacing:1.5px}.brand small{font-size:10px;letter-spacing:4px;margin-top:7px}nav{display:flex;gap:34px;align-items:center;font-size:14px}.nav-contact{border-bottom:1px solid;padding-bottom:3px}.hero{height:690px;min-height:580px;position:relative;color:#fff;margin:0 22px;overflow:hidden;background:#41484a}.hero>img{width:100%;height:100%;object-fit:cover;object-position:center}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,23,28,.66),rgba(15,23,28,.1)),linear-gradient(0deg,rgba(15,23,28,.35),transparent 25%)}.hero-content{position:absolute;top:50%;left:5%;transform:translateY(-52%);max-width:720px}.eyebrow{font-size:12px;font-weight:600;letter-spacing:2.2px;margin:0 0 22px}.hero h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(45px,5.8vw,82px);font-weight:400;line-height:1.12;letter-spacing:-2px;margin:0 0 26px}em{font-weight:400}p{margin:0 0 20px}.hero-copy{max-width:385px;font-size:18px;line-height:1.65;margin-bottom:32px}.button{display:inline-flex;gap:45px;justify-content:space-between;align-items:center;padding:16px 24px;font-size:15px;font-weight:500;transition:background .2s,transform .2s}.button:hover{transform:translateY(-2px)}.light{background:#fff;color:var(--ink)}.light:hover{background:#eee}.dark{background:var(--ink);color:white}.dark:hover{background:var(--accent)}.micro{font-size:13px;margin-top:15px;opacity:.85}.hero-bottom{position:absolute;bottom:27px;left:5%;right:5%;display:flex;justify-content:space-between;font-size:12px;letter-spacing:1.4px}.hero-bottom a{letter-spacing:0;font-size:14px}.section{padding:96px 7%;max-width:1600px;margin:auto}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:48px}h2{font-family:'Playfair Display',Georgia,serif;font-size:clamp(34px,3.5vw,50px);line-height:1.2;font-weight:400;letter-spacing:-1px;margin:0}.section-heading>p{max-width:320px;color:#666;line-height:1.7;margin-bottom:3px}.cards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px}.photo{height:340px;background:var(--soft);overflow:hidden}.photo img{height:100%;width:100%;object-fit:cover;transition:transform .4s}article:hover .photo img{transform:scale(1.035)}.card-title{display:flex;align-items:center;justify-content:space-between;margin:21px 0 10px}h3{font-size:22px;font-weight:500;margin:0}.card-title span{font-size:12px;color:#777}.cards article>p{font-size:15px;color:#666;line-height:1.75}.motorized{background:var(--accent);color:#fff;padding:30px;display:flex;flex-direction:column;justify-content:space-between}.motorized .eyebrow{font-size:11px}.motorized-main h3{font-family:'Playfair Display',Georgia,serif;font-size:41px;line-height:1.2;margin:17px 0 20px}.motorized-main p{font-size:15px;opacity:.85}.simple-icon{font-size:43px;font-weight:400}.motorized a{font-size:14px;display:flex;justify-content:space-between;border-top:1px solid #ffffff50;padding-top:20px;margin-top:28px}.about{border-top:1px solid #dedede;display:grid;grid-template-columns:1fr 2fr;gap:60px}.about .eyebrow{padding-top:12px}.about h2{margin-bottom:27px}.about>div>p{max-width:650px;color:#666;font-size:17px}.areas{display:flex;flex-wrap:wrap;gap:12px 23px;margin-top:28px;font-size:14px}.contact{max-width:none;background:var(--soft);text-align:center;padding-top:76px;padding-bottom:72px}.contact h2{font-size:clamp(40px,4.5vw,65px);margin-bottom:24px}.contact>p:not(.eyebrow):not(.contact-note){color:#666}.contact-actions{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:30px}.call-link{font-size:15px;border-bottom:1px solid}.contact-note{font-size:11px;letter-spacing:1.6px;margin:25px 0 0;color:#666}footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:46px 6%}footer .brand span{font-size:18px}footer .brand small{font-size:9px}.socials{display:flex;gap:25px;font-size:13px}footer>small{font-size:12px;color:#777}@media(min-width:1600px){.hero{height:800px}.hero-content{left:8%}}@media(max-width:850px){header{height:85px;padding:0 5%}nav{gap:20px}nav>a:not(.nav-contact){display:none}.brand span{font-size:18px}.brand small{font-size:9px}.hero{margin:0 12px;height:660px}.hero-content{left:7%;right:7%}.hero h1{font-size:58px}.hero-bottom{left:7%;right:7%}.hero-bottom>span{display:none}.section{padding:66px 6%}.cards{gap:20px;grid-template-columns:1fr 1fr}.motorized{grid-column:span 2;min-height:320px}.photo{height:290px}.motorized-main{max-width:500px}.motorized-main h3 br{display:none}.section-heading{align-items:flex-start;gap:30px}.section-heading>p{max-width:260px}.about{grid-template-columns:1fr;gap:15px}.about .eyebrow{margin-bottom:5px}footer{flex-wrap:wrap}footer>small{width:100%;text-align:center}}@media(max-width:540px){.brand span{font-size:15px;letter-spacing:1px}.brand small{font-size:8px;letter-spacing:2.5px}nav{font-size:12px}.hero{height:640px;min-height:0}.hero-content{transform:translateY(-48%)}.hero h1{font-size:46px;letter-spacing:-1.2px}.hero .eyebrow{font-size:10px;max-width:240px;line-height:1.8}.hero-copy{font-size:17px;max-width:290px}.hero>img{object-position:60% center}.hero-shade{background:linear-gradient(90deg,rgba(15,23,28,.7),rgba(15,23,28,.24))}.hero-bottom{bottom:22px}.section-heading{display:block}.section-heading>p{margin-top:22px;max-width:none}.cards{grid-template-columns:1fr;gap:32px}.photo{height:340px}.motorized{grid-column:auto;padding:30px;min-height:390px}.section{padding:56px 7%}.contact-actions{flex-direction:column;gap:22px}.contact .button{gap:25px}footer{justify-content:center;text-align:center;padding:38px 6%}.socials{width:100%;justify-content:center;gap:22px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.cards article:not(.motorized){border-top:1px solid #bbb;padding:25px 20px 20px 0;display:flex;flex-direction:column;min-height:365px}.cards .service-number{font-family:Georgia,serif;font-size:65px!important;color:#c4c9cc!important;line-height:1;margin-bottom:70px}.cards article:not(.motorized) h3{font-family:Playfair Display,Georgia,serif;font-size:30px}.card-title{margin:0 0 15px}.brand small{font-size:12px;letter-spacing:2px}footer .brand small{font-size:12px}.motorized .eyebrow,.contact-note{font-size:12px}@media(max-width:540px){.brand small{font-size:12px;letter-spacing:.5px}.hero .eyebrow{font-size:12px}.cards article:not(.motorized){min-height:250px}.cards .service-number{margin-bottom:35px}nav{font-size:14px}.brand span{font-size:14px}}

.brand-logo{display:block;width:88px;height:88px;object-fit:contain}header{height:112px}footer .brand-logo{width:100px;height:100px}@media(max-width:540px){header{height:98px}.brand-logo{width:78px;height:78px}}

.brand-logo{clip-path:circle(48.8% at 50% 50%)}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:64px;text-align:left;padding:80px 7%;align-items:start}.quote-intro>p:not(.eyebrow){max-width:350px}.quote-form{padding:34px;background:#fff;border:1px solid #ddd;text-align:left}.quote-form h3{font-family:'Playfair Display',Georgia,serif;font-size:28px;margin-bottom:28px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-grid label{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:500}.form-grid label span{font-weight:400;color:#666;display:contents}.form-grid .full{grid-column:1/-1}input,select,textarea{font:inherit;font-size:16px;color:var(--ink);width:100%;min-width:0;border:1px solid #bbb;border-radius:0;padding:12px;background:#fff}textarea{resize:vertical}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:2px}.form-note{font-size:13px;line-height:1.6;color:#666;margin:20px 0}.quote-form button{width:100%;border:0;font-family:inherit;cursor:pointer}.quote-form button:disabled{opacity:.6;cursor:wait}.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#quote-status{margin:18px 0 0;font-size:16px}#quote-status:empty{display:none}#quote-status.error{color:#9e2222}#quote-status.success{padding:18px;background:#eff4f6;color:#243d4b} @media(max-width:850px){.contact{grid-template-columns:1fr;gap:35px}.quote-intro>p:not(.eyebrow){max-width:none}}@media(max-width:540px){.quote-form{padding:23px}.form-grid{grid-template-columns:1fr}.contact{padding:55px 6%}.quote-form .button{font-size:14px;padding:15px;gap:10px}}

#measurement-choice{position:fixed;bottom:18px;left:18px;right:18px;max-width:620px;background:#fff;border:1px solid #aaa;box-shadow:0 4px 24px #0002;padding:22px;z-index:40;font-size:14px}#measurement-choice[hidden]{display:none}#measurement-choice p{margin:0 0 15px}#measurement-choice div{display:flex;gap:12px;flex-wrap:wrap}#measurement-choice button,.measurement-settings{font:inherit;font-size:14px;cursor:pointer;border:1px solid #777;background:#fff;color:#24292c;padding:10px 15px}.measurement-settings{font-size:12px}

.whatsapp-float{position:fixed;right:22px;bottom:calc(22px + env(safe-area-inset-bottom));z-index:30;display:flex;align-items:center;gap:10px;min-height:58px;padding:11px 19px 11px 13px;border-radius:999px;background:#25d366;color:#0b2d19;font-size:14px;font-weight:700;box-shadow:0 10px 30px #0003;transition:transform .2s,box-shadow .2s}.whatsapp-float svg{width:34px;height:34px;flex:0 0 auto}.whatsapp-float svg path:first-child{fill:none;stroke:#fff;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}.whatsapp-float svg path:last-child{fill:#fff}.whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 14px 34px #0004}.whatsapp-float:focus-visible{outline-color:#111}@media(max-width:540px){.whatsapp-float{right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:60px;height:60px;min-height:60px;padding:13px;justify-content:center}.whatsapp-float span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.whatsapp-float svg{width:36px;height:36px}}

/* Real project photography from Areas By Design CFL's Instagram. */
.cards article:not(.motorized){padding-top:14px;min-height:560px}.cards .photo{height:330px}.cards .service-number{font-size:36px!important;margin:24px 0 12px}.cards .card-title{margin:0 0 12px}.motorized{position:relative;overflow:hidden;min-height:560px}.motorized-photo,.motorized-overlay{position:absolute;inset:0;width:100%;height:100%}.motorized-photo{object-fit:cover;transition:transform .4s}.motorized-overlay{background:linear-gradient(180deg,rgba(25,39,51,.34),rgba(25,39,51,.88))}.motorized>*:not(.motorized-photo):not(.motorized-overlay){position:relative;z-index:1}.motorized .eyebrow,.motorized-main p{color:#fff}.cards article:hover .motorized-photo{transform:scale(1.035)}
@media(max-width:850px){.cards article:not(.motorized),.motorized{min-height:520px}}
@media(max-width:540px){.cards article:not(.motorized){min-height:0}.cards .photo{height:350px}.cards .service-number{margin:20px 0 10px}.motorized{min-height:460px}}
