/* RAWAN DESIGN — 2026 | shared across all pages */
:root{--paper:#f4f0e8;--paper2:#ebe6dc;--white:#fffdf8;--ink:#1e211f;--muted:#64615c;--gold:#b69a64;--goldlight:#dec79c;--line:#dcd4c6;--dark:#20241f;--sans:Arial,Helvetica,sans-serif;--serif:Georgia,'Times New Roman',serif;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:115px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img{display:block;width:100%;height:100%;object-fit:cover}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:500;line-height:1.07;letter-spacing:-.044em}h1{font-size:clamp(3rem,6.5vw,6.3rem)}h2{font-size:clamp(2.4rem,4.5vw,4.7rem)}h3{font-size:1.42rem;letter-spacing:-.025em}p{color:var(--muted)}a:focus-visible,button:focus-visible{outline:3px solid #9b7434;outline-offset:5px}.wrap{width:min(1210px,calc(100% - 100px));margin-inline:auto}.wrap-wide{width:min(1395px,calc(100% - 54px));margin-inline:auto}.skip{position:fixed;z-index:150;top:-70px;left:18px;background:var(--white);padding:13px 18px;border-radius:10px}.skip:focus{top:12px}.eyebrow{display:flex;align-items:center;gap:14px;font-size:.72rem;line-height:1.4;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:#907346;margin-bottom:24px}.eyebrow.light{color:#ead5ae}.eyebrow-line{height:1px;width:33px;background:#dec79c}.section{padding:108px 0}.section-top{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:46px}.section-top h2{max-width:800px}.section h2 em,.statement h2 em,.about-text h2 em,.inner-hero h1 em,.detail-intro h2 em{font-family:var(--serif);font-weight:400;color:#a48653}.section-desc{max-width:590px;margin-top:24px;font-size:1.04rem;line-height:1.85}.text-link{align-items:center;display:inline-flex;gap:22px;white-space:nowrap;border-bottom:1px solid #947848;padding:7px 0 10px;font-weight:600;font-size:.88rem;transition:color .3s ease,gap .3s var(--ease)}.text-link:hover{color:#93713a;gap:30px}.text-link span{font-size:1.15rem}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:59px;border-radius:50px;padding:17px 25px;font-size:.89rem;font-weight:700;line-height:1.25;transition:transform .35s var(--ease),box-shadow .35s ease,border-color .35s ease}.button>span{font-size:1.15rem}.button:hover{transform:translateY(-4px);box-shadow:0 15px 25px #0002}.button.gold{background:linear-gradient(125deg,#eadbb8,#c6a76e);color:#211f19;border:1px solid #f7eccd}.button.dark{background:#262925;color:#fff;border:1px solid #262925}.button.ghost{background:#ffffff19;color:#fffdf8;border:1px solid #ffffff8b;backdrop-filter:blur(8px)}.button.full{width:100%}
/* navbar */
.site-header{position:sticky;z-index:60;top:14px;margin-bottom:-102px;padding-top:0;pointer-events:none}.nav-shell{min-height:88px;padding:7px 18px 7px 28px;display:flex;justify-content:space-between;align-items:center;gap:35px;border:1px solid #fffc;border-radius:21px;background:#f4f0e8f0;box-shadow:0 13px 40px #191b1929;backdrop-filter:blur(18px);pointer-events:auto;transition:box-shadow .3s ease}.site-header.is-scrolled .nav-shell{box-shadow:0 8px 28px #191b192d}.brand{flex:none;display:flex;align-items:center;width:145px;height:72px}.brand img{width:145px;height:73px;object-fit:contain}.nav{display:flex;align-items:center;gap:7px}.nav a{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:10px 19px;font-size:.86rem;font-weight:600;border-radius:50px;transition:background .25s ease,color .25s ease}.nav a:hover,.nav a[aria-current="page"]{background:#b69a6428}.nav a:last-child{margin-left:8px;background:#272a26;color:#fff;padding-inline:27px}.nav a:last-child:hover,.nav a:last-child[aria-current="page"]{background:#74613f}.menu-button{display:none;border:1px solid #d7cdbd;border-radius:40px;background:var(--white);width:49px;height:45px;align-items:center;justify-content:center;gap:6px;flex-direction:column}.menu-button span{width:19px;height:1.6px;background:var(--ink);transition:transform .35s var(--ease)}.menu-button[aria-expanded="true"] span:first-child{transform:translateY(3.8px) rotate(45deg)}.menu-button[aria-expanded="true"] span:last-child{transform:translateY(-3.8px) rotate(-45deg)}
/* dark hero */
.hero{isolation:isolate;position:relative;min-height:810px;display:flex;align-items:center;color:var(--white);background:#232923;overflow:hidden;border-radius:0 0 38px 38px}.hero-bg,.hero-cover{position:absolute;inset:0;z-index:-2}.hero-bg img{animation:hero-zoom 13s var(--ease) both;object-position:center 56%}.hero-cover{z-index:-1;background:linear-gradient(90deg,#101612f1 0%,#121710d7 35%,#10161291 63%,#10161242 100%),linear-gradient(0deg,#101612d1,transparent 38%)}.hero-layout{padding:180px 0 115px}.hero-copy{max-width:830px;animation:arrive 1s var(--ease) both}.hero-copy h1{font-size:clamp(3.4rem,6.4vw,6.75rem);line-height:1.04;letter-spacing:-.055em}.hero-copy h1 em{font-family:var(--serif);color:var(--goldlight);font-weight:400}.hero-copy>p:not(.eyebrow){color:#e5e5de;font-size:1.1rem;line-height:1.85;max-width:575px;margin-top:30px}.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:33px}.hero-bottom{position:absolute;bottom:32px;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #ffffff4d;padding-top:17px;color:#e7e4db;font-size:.7rem;letter-spacing:.12em}.hero-bottom a{display:flex;align-items:center;gap:15px;letter-spacing:.11em}.hero-bottom a span{font-size:1.4rem}.feature-strip{border-bottom:1px solid var(--line);background:#eee8dc}.feature-inner{display:flex;align-items:center;justify-content:center;gap:40px;padding:25px 0;color:#716550;font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;font-weight:700}.feature-inner i{width:5px;height:5px;background:#ac905f;border-radius:50%}
/* services */
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.service-card{display:block;min-width:0;padding:8px 8px 0;background:#fefbf6;border:1px solid #ede8df;border-radius:21px;box-shadow:0 4px 15px #322a1b08;transition:transform .4s var(--ease),box-shadow .4s ease}.service-card:hover{transform:translateY(-7px);box-shadow:0 22px 35px #382c1b18}.service-photo{height:255px;position:relative;overflow:hidden;border-radius:15px;background:linear-gradient(135deg,#baa88d,#6c665d)}.service-photo img{transition:transform .9s var(--ease)}.service-card:hover .service-photo img{transform:scale(1.055)}.card-num{position:absolute;top:15px;left:15px;padding:7px 10px;background:#f4f0e8eb;border-radius:50px;font-size:.67rem;letter-spacing:.08em;font-weight:700;color:#40392f}.service-info{padding:22px 18px 18px}.service-info h3{font-size:1.43rem}.service-info p{font-size:.88rem;line-height:1.75;min-height:62px;margin-top:12px}.card-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:17px;padding-top:15px;color:#3e3d38;font-weight:700;font-size:.79rem}.circle-arrow{border-radius:50%;background:#f0e5d2;display:grid;place-items:center;width:34px;height:34px;font-size:1.1rem;transition:background .25s ease,transform .25s ease}.service-card:hover .circle-arrow{background:#ddbe7d;transform:rotate(45deg)}.section-more{text-align:center;margin-top:38px}.section-more .button{min-width:220px}.note{margin-top:35px;font-size:.79rem;max-width:980px;line-height:1.8;color:#797063}
/* about statement and processes */
.statement{background:#ebe5da;padding:95px 0}.statement-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:9%}.statement-image,.about-image,.contact-art,.detail-hero-img{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(135deg,#baa88d,#6c665d)}.statement-image{height:525px}.statement-image img,.about-image img,.contact-art img,.detail-hero-img img{transition:transform 1s var(--ease)}.statement-image:hover img,.about-image:hover img{transform:scale(1.035)}.image-credit{position:absolute;bottom:17px;left:17px;display:inline-flex;background:#151917b8;backdrop-filter:blur(6px);padding:7px 13px;border:1px solid #fff4;border-radius:35px;color:#fff;font-size:.66rem;letter-spacing:.06em}.statement-copy h2,.about-text h2{font-size:clamp(2.65rem,4.15vw,4.6rem)}.statement-copy p:not(.eyebrow),.about-text p:not(.eyebrow){line-height:1.93;margin-top:23px}.statement-copy .text-link,.about-text .text-link{margin-top:30px}.pathway{background:var(--paper)}.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.process-card{padding:36px 32px 40px;border-radius:17px;border:1px solid #e3dace;background:#fbf8f2;min-height:235px}.process-card>span{font-family:var(--serif);font-size:2.9rem;line-height:1;color:#ad8f58}.process-card h3{margin-top:25px;font-size:1.35rem}.process-card p{font-size:.9rem;line-height:1.8;margin-top:11px}.cta-section{background:radial-gradient(ellipse at 90% 0%,#5c553f 0%,#282c25 45%,#1b211c 100%);color:#fff;border-top:1px solid #c7b788}.cta-inner{display:flex;justify-content:space-between;gap:65px;align-items:center;padding:90px 0 95px}.cta-inner h2{font-size:clamp(2.75rem,4.4vw,4.9rem)}.cta-inner p:not(.eyebrow){color:#d7d7cb;max-width:570px;line-height:1.8;margin-top:21px}.cta-actions{display:flex;align-items:flex-start;flex-direction:column;gap:15px;flex:none}.cta-email{color:#e6d3aa;font-size:.85rem;border-bottom:1px solid #a48c5b;padding:5px 0;overflow-wrap:anywhere}
/* interior headers */
.inner-hero{position:relative;padding:200px 0 95px;overflow:hidden;border-radius:0 0 28px 28px;background:radial-gradient(ellipse at 85% 40%,#e8dccc 0%,transparent 42%),#f1ecdf;border-bottom:1px solid #d9cbb9}.crumbs{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:.75rem;color:#85765f;margin-bottom:55px}.crumbs a:hover{text-decoration:underline}.crumbs span{color:#aa8b58}.inner-hero h1{max-width:920px}.inner-lead{font-size:1.15rem;line-height:1.85;max-width:680px;margin-top:28px}.inner-hero-stroke{position:absolute;right:6%;bottom:-60px;color:#b59d7127;font-family:var(--serif);font-size:19rem;line-height:1;pointer-events:none}.about-layout{display:grid;grid-template-columns:.95fr 1fr;gap:9%;align-items:center}.about-image{height:560px}.about-process{background:#eae3d7}.about-process h2{margin-bottom:40px}.contact-intro{background:radial-gradient(ellipse at 85% 38%,#e4d5bb 0%,transparent 48%),#f1ecdf}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:11%;align-items:start}.contact-left>p:not(.eyebrow){margin-top:25px;line-height:1.9;font-size:1.03rem}.contact-art{height:365px;margin-top:45px}.contact-right{display:flex;flex-direction:column;gap:17px}.contact-card{border:1px solid #e2d8c9;border-radius:18px;background:#fffdf8;padding:33px}.contact-card h3{margin:8px 0 16px;font-size:1.62rem}.contact-small{font-size:.68rem;letter-spacing:.16em;font-weight:700;color:#927749}.contact-icon{font-family:var(--serif);color:#a88951;font-size:2.5rem;line-height:1;margin-bottom:10px}.contact-address{font-size:1.13rem;font-weight:700;display:inline-block;overflow-wrap:anywhere;margin-bottom:20px;border-bottom:1px solid #b6a487;padding-bottom:3px}.contact-card>p:not(.contact-small){font-size:.93rem;margin:0 0 22px}.whatsapp-card{background:#eee8dd}.prepare{padding:30px 32px;border-radius:16px;background:#e9e2d6}.prepare h3{font-size:1.4rem}.prepare ul{padding-left:19px;margin:14px 0}.prepare li{padding:6px 0;color:#46443e;font-size:.88rem}.prepare p{font-size:.79rem}
/* details: left copy, right imagery + galleries */
.detail-hero{padding:175px 0 70px;background:linear-gradient(115deg,#f2ecdf,#eae4d9);border-bottom:1px solid var(--line)}.detail-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.07fr);gap:6%;align-items:center}.detail-hero .crumbs{margin-bottom:48px}.detail-hero h1{font-size:clamp(3.1rem,5.3vw,5.7rem);letter-spacing:-.055em}.detail-dot{color:#b79a63}.detail-lead{font-size:1.2rem;line-height:1.8;margin-top:26px;max-width:515px}.detail-actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:34px}.detail-hero-img{height:540px}.detail-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-bottom:40px}.detail-intro-grid>p{font-size:1.09rem;line-height:1.95}.detail-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.detail-card{padding:32px 29px;background:#fbf8f3;border-radius:15px;border:1px solid #ded5c5}.detail-card>span{display:block;color:#af9056;font-size:1.65rem;font-family:var(--serif)}.detail-card h3{font-size:1.29rem;margin-top:23px}.detail-card p{margin-top:12px;font-size:.9rem;line-height:1.82}.gallery-section{background:#ebe5da}.inspo-gallery{display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:repeat(2,225px);gap:15px}.gallery-tile{position:relative;overflow:hidden;border-radius:16px;background:#baa995}.gallery-big{grid-row:1 / 3}.gallery-tile img{transition:transform .8s var(--ease)}.gallery-tile:hover img{transform:scale(1.045)}.gallery-tile figcaption{position:absolute;bottom:13px;left:15px;padding:6px 13px;border-radius:50px;background:#151917bb;color:#fff;font-size:.69rem}.related-section{background:var(--paper)}.related-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
/* footer */
.footer{background:#e6dfd2;border-top:1px solid #d2c6b2}.footer-inner{display:grid;grid-template-columns:1.4fr .65fr 1fr;gap:45px;padding:70px 0 60px}.footer-logo{font-size:1.55rem;line-height:1;letter-spacing:-.07em;font-weight:700}.footer-logo span{color:#947447}.footer-main>p{margin-top:21px;font-size:.9rem;line-height:1.8}.footer-links{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font-size:.88rem}.footer-title{font-size:.72rem;letter-spacing:.16em;color:#927449;margin-bottom:7px;text-transform:uppercase;font-weight:700}.footer-links a:hover{color:#9a7238}.footer-mail{overflow-wrap:anywhere}.footer-mini{color:#827c72;font-size:.8rem}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #cfc5b5;padding:18px 0 25px;color:#80786a;font-size:.76rem}.wa-float{position:fixed;z-index:40;right:22px;bottom:20px;width:55px;height:55px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#24583f;color:#fff;box-shadow:0 7px 24px #15291d4d;border:1px solid #ffffff88;transition:transform .3s var(--ease),background .3s ease}.wa-float:hover{transform:translateY(-4px);background:#1c7048}.reveal{opacity:1}body.has-motion .reveal{opacity:0;transform:translateY(18px);transition:opacity .75s var(--ease),transform .75s var(--ease)}body.has-motion .reveal.is-visible{opacity:1;transform:none}
@keyframes hero-zoom{from{transform:scale(1.06)}to{transform:scale(1)}}@keyframes arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.wrap{width:calc(100% - 68px)}.wrap-wide{width:calc(100% - 36px)}.service-grid{gap:16px}.service-photo{height:220px}.service-info{padding-inline:13px}.nav a{padding-inline:14px}.section{padding:85px 0}.detail-hero-grid{gap:30px}.detail-hero-img{height:440px}.statement-grid,.about-layout{gap:6%}}
@media(max-width:900px){.site-header{top:10px;margin-bottom:-93px}.nav-shell{min-height:78px;border-radius:17px;padding:5px 17px}.brand{width:120px;height:66px}.brand img{width:121px;height:66px}.menu-button{display:flex}.nav{position:absolute;top:calc(100% + 10px);left:18px;right:18px;display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:16px;border:1px solid #fff;border-radius:18px;background:#f4f0e8;box-shadow:0 25px 35px #0003;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px);transition:opacity .25s ease,transform .3s var(--ease),visibility .25s ease}.nav.open{opacity:1;visibility:visible;pointer-events:auto;transform:none}.nav a,.nav a:last-child{margin:0;padding:13px 17px;justify-content:flex-start;border-radius:11px}.nav a:last-child{justify-content:center;margin-top:8px}.hero{min-height:730px}.hero-layout{padding-top:145px}.hero-copy h1{font-size:clamp(3.6rem,7.7vw,5.5rem)}.feature-inner{gap:24px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.service-photo{height:270px}.statement-grid,.about-layout{grid-template-columns:1fr;gap:40px}.statement-image{height:390px;order:2}.statement-copy{order:1}.about-image{height:470px}.section-top{align-items:flex-start}.process-card{padding:25px 23px;min-height:220px}.contact-grid{gap:30px}.detail-hero{padding-top:160px}.detail-hero-grid{grid-template-columns:1fr;gap:35px}.detail-hero-img{height:460px}.detail-hero .crumbs{margin-bottom:34px}.detail-intro-grid{gap:35px}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cta-inner{gap:30px}}
@media(max-width:680px){.wrap{width:calc(100% - 40px)}.wrap-wide{width:calc(100% - 20px)}.site-header{top:8px;margin-bottom:-87px}.nav-shell{min-height:71px;padding:4px 12px}.brand{width:115px;height:62px}.brand img{width:115px;height:62px}.nav{left:10px;right:10px}.hero{min-height:750px;border-radius:0 0 24px 24px}.hero-layout{padding:148px 0 122px}.hero-copy h1{font-size:clamp(3.1rem,11.2vw,4.9rem)}.hero-copy>p:not(.eyebrow){font-size:1rem;line-height:1.76;margin-top:23px}.hero-cover{background:linear-gradient(90deg,#121610ea,#141610b3 66%,#14161071),linear-gradient(0deg,#121710d0,transparent 40%)}.hero-actions{flex-direction:column;align-items:stretch;max-width:365px}.button{min-height:55px;padding:15px 21px;font-size:.85rem}.hero-bottom{bottom:24px;justify-content:space-between;font-size:.59rem}.hero-bottom>span:nth-child(2){display:none}.feature-inner{flex-wrap:wrap;justify-content:center;gap:10px 15px;padding:18px 0;font-size:.62rem;letter-spacing:.075em}.feature-inner i{width:3px;height:3px}.section{padding:65px 0}.section-top{flex-direction:column;gap:22px;margin-bottom:30px}.section h2,.statement h2,.about-text h2{font-size:clamp(2.25rem,8vw,3.4rem)}.section-desc{font-size:.96rem;margin-top:18px}.service-grid,.related-grid{grid-template-columns:1fr;gap:17px}.service-photo{height:290px}.service-info{padding:21px 17px 16px}.service-info p{min-height:0;margin-top:9px}.statement{padding:65px 0}.statement-image{height:325px}.process-grid,.detail-card-grid{grid-template-columns:1fr;gap:14px}.process-card{min-height:0;padding:27px}.process-card h3{margin-top:15px}.cta-inner{padding:70px 0;align-items:flex-start;flex-direction:column;gap:31px}.cta-inner h2{font-size:clamp(2.4rem,8.5vw,3.5rem)}.cta-actions{width:100%}.cta-actions .button{min-width:230px}.inner-hero{padding:155px 0 70px}.inner-hero h1{font-size:clamp(2.85rem,10vw,4.1rem)}.inner-lead{font-size:1rem;margin-top:22px}.inner-hero-stroke{font-size:9rem;right:-15px;bottom:-20px}.crumbs{margin-bottom:42px}.about-image{height:350px}.about-text p:not(.eyebrow){margin-top:18px}.contact-grid{grid-template-columns:1fr;gap:35px}.contact-art{height:275px;margin-top:25px}.contact-card{padding:26px}.contact-address{font-size:1.06rem}.detail-hero{padding:150px 0 55px}.detail-hero h1{font-size:clamp(3rem,9.8vw,4.2rem)}.detail-hero-img{height:320px}.detail-lead{font-size:1.05rem}.detail-actions{flex-direction:column;align-items:flex-start}.detail-intro-grid{grid-template-columns:1fr;gap:16px;margin-bottom:30px}.detail-intro-grid>p{font-size:1rem}.detail-card{padding:26px}.inspo-gallery{grid-template-columns:1fr 1fr;grid-template-rows:260px 150px;gap:10px}.gallery-big{grid-column:1 / -1;grid-row:1}.gallery-tile{min-height:0}.footer-inner{grid-template-columns:1fr 1fr;gap:38px 20px;padding:53px 0}.footer-main{grid-column:1 / -1}.footer-links{font-size:.82rem}.footer-bottom{flex-wrap:wrap;font-size:.69rem;gap:6px}.wa-float{width:51px;height:51px;right:15px;bottom:15px}}
@media(max-width:390px){.hero-copy h1{font-size:3rem}.hero{min-height:770px}.hero-bottom>span:first-child{max-width:178px}.service-photo{height:240px}.inspo-gallery{grid-template-rows:220px 140px}.detail-hero h1{font-size:2.75rem}.footer-mail{font-size:.76rem}}
@media(hover:none){.service-card:hover,.button:hover,.wa-float:hover{transform:none}.service-card:hover img,.gallery-tile:hover img{transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}body.has-motion .reveal{opacity:1;transform:none}}
/* Contact layout: long email addresses must never force a horizontal scroll. */
.contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.contact-grid>*,.contact-left,.contact-right,.contact-card,.prepare{min-width:0;max-width:100%}
.contact-address,.footer-mail{overflow-wrap:anywhere;word-break:break-word}
/* Section content is always visible: motion is an optional enhancement. */
body.has-motion .reveal{opacity:1;transform:none;transition:none}
body.has-motion .reveal.is-visible{animation:soft-rise .75s var(--ease) both}
@keyframes soft-rise{from{opacity:.78;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:900px){.contact-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:680px){.contact-grid{grid-template-columns:minmax(0,1fr)}.brand,.brand img{width:132px}}
@media(prefers-reduced-motion:reduce){body.has-motion .reveal.is-visible{animation:none}}


/* ===============================================================
   CINEMATIC MOTION EDITION — original Rawan Design glass identity
   Restores pointer-following highlights, sweeping reflections and
   layered depth. Effects are progressive and respect reduced motion.
   =============================================================== */

/* 01. Floating glass navigation: warmer, lightly reflective, readable. */
.nav-shell {
  border: 1px solid rgba(255,253,245,.88);
  background: rgba(244,240,232,.89);
  box-shadow: 0 14px 42px rgba(20,22,18,.18), inset 0 1px 0 rgba(255,255,255,.78);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
  backdrop-filter: blur(22px) saturate(140%);
  transition: box-shadow 350ms ease, background 350ms ease, border-color 350ms ease;
}
.site-header.is-scrolled .nav-shell {
  background: rgba(244,240,232,.96);
  box-shadow: 0 10px 30px rgba(17,20,16,.18), inset 0 1px 0 rgba(255,255,255,.82);
}
.nav a:not(:last-child) { position: relative; }
.nav a:not(:last-child)::after {
  content: ''; position: absolute; height: 1px; bottom: 6px;
  left: 24%; right: 24%; background: linear-gradient(90deg,transparent,#9e814a,transparent);
  transform: scaleX(0); transform-origin: center;
  transition: transform 390ms var(--ease);
}
.nav a:not(:last-child):hover::after,
.nav a:not(:last-child)[aria-current="page"]::after { transform: scaleX(1); }
.nav a:last-child {
  border: 1px solid rgba(233,216,175,.27);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 7px 16px rgba(20,22,18,.1);
  transition: background 350ms ease, box-shadow 350ms ease, transform 350ms var(--ease);
}
.nav a:last-child:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 10px 24px rgba(29,25,15,.2); transform: translateY(-2px); }

/* 02. Original cinema-glass buttons: mouse-tracked light + glass sweep. */
.button {
  --glow-x: 50%; --glow-y: 10%;
  position: relative; isolation: isolate; overflow: hidden;
  border: 1px solid rgba(255,255,255,.67);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.71),
              inset 0 -1px 0 rgba(90,61,21,.12),
              0 8px 23px rgba(15,16,13,.13);
  -webkit-backdrop-filter: blur(17px) saturate(140%);
  backdrop-filter: blur(17px) saturate(140%);
  transition: transform 350ms var(--ease), box-shadow 350ms ease,
              border-color 350ms ease, background-color 350ms ease;
}
.button::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  border-radius: inherit; pointer-events: none;
  background: radial-gradient(circle 170px at var(--glow-x) var(--glow-y),
              rgba(255,255,255,.83) 0%, rgba(255,255,255,.34) 42%, transparent 78%);
  opacity: .30; transition: opacity 350ms ease;
}
.button::after {
  content: ''; position: absolute; inset: -90% -40%; z-index: 0;
  pointer-events: none;
  background: linear-gradient(114deg, transparent 42%, rgba(255,255,255,.02) 45%,
              rgba(255,255,255,.58) 50%, rgba(255,255,255,.04) 55%, transparent 59%);
  transform: translateX(-82%) skewX(-12deg);
  transition: transform 920ms var(--ease);
}
.button > span { position: relative; z-index: 1; transition: transform 350ms var(--ease); }
.button:hover { transform: translateY(-4px); border-color: rgba(255,255,255,.94);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92),
              0 14px 28px rgba(23,21,14,.2), 0 0 0 1px rgba(199,165,98,.15);
}
.button:hover::before { opacity: 1; }
.button:hover::after { transform: translateX(82%) skewX(-12deg); }
.button:hover > span { transform: translate(3px,-2px); }
.button:active { transform: translateY(-1px) scale(.985); }
.button.gold {
  background: linear-gradient(130deg, rgba(242,225,188,.97), rgba(201,166,102,.92));
  border-color: rgba(255,248,220,.88);
}
.button.gold:hover { background: linear-gradient(130deg, #f1e2c2, #c6a36e); }
.button.dark { background: linear-gradient(140deg, rgba(52,52,46,.98), rgba(27,32,27,.96));
  border-color: rgba(201,183,148,.52); }
.button.dark::before { background: radial-gradient(circle 180px at var(--glow-x) var(--glow-y),
                    rgba(233,210,157,.54), rgba(255,255,255,.09) 45%, transparent 80%); }
.button.dark:hover { background: linear-gradient(140deg, #4b4638, #252925); }
.button.ghost { background: linear-gradient(135deg, rgba(255,255,255,.19),rgba(255,255,255,.075));
  border-color: rgba(255,255,255,.64);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 7px 22px rgba(0,0,0,.13);
}
.button.ghost:hover { background: linear-gradient(135deg, rgba(255,255,255,.26),rgba(255,255,255,.11)); }

/* 03. Cinematic details for the hero / headings. */
.hero-copy .eyebrow::before {
  content: ''; width: 37px; height: 1px; flex: 0 0 37px;
  background: linear-gradient(90deg,#e1c48b,#fff0c3,#bd955b);
  box-shadow: 0 0 12px rgba(226,193,132,.48);
  animation: line-reveal 900ms 260ms var(--ease) both;
}
.hero-copy h1 em { text-shadow: 0 0 52px rgba(219,183,113,.18); }
.hero-cover { background: linear-gradient(90deg,#0f1611f0 0%,#121710d5 38%,#10161291 69%,#10161240 100%),
                        linear-gradient(0deg,#101610d4,transparent 40%); }
.hero-bottom a span, .text-link span { transition: transform 350ms var(--ease); }
.hero-bottom a:hover span { transform: translateY(5px); }
.text-link:hover span { transform: translate(4px,-3px); }

/* 04. Service cards: luminous upper edge, restrained lift, image zoom. */
.service-card {
  position: relative; isolation: isolate;
  border: 1px solid rgba(216,203,177,.65);
  background: linear-gradient(150deg,rgba(255,253,247,.97),rgba(250,246,237,.96));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95),0 6px 24px rgba(47,37,19,.065);
  transition: transform 530ms var(--ease), box-shadow 500ms ease, border-color 400ms ease;
}
.service-card::before {
  content: ''; position:absolute;inset:-1px;z-index:-1;border-radius:inherit;pointer-events:none;
  background:linear-gradient(135deg, rgba(225,192,126,.42),transparent 45%,rgba(225,192,126,.08));
  opacity:0;transition:opacity 480ms ease;
}
.service-card:hover {
  border-color: rgba(190,154,89,.58);
  transform:translateY(-9px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95),
              0 25px 48px rgba(43,35,22,.17),0 0 0 1px rgba(208,176,110,.12);
}
.service-card:hover::before {opacity:1}
.service-photo { isolation:isolate; }
.service-photo::after {
  content:''; position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,245,223,.13),transparent 36%,rgba(15,17,13,.25));
  opacity:.25;transition:opacity 700ms ease;
}
.service-card:hover .service-photo::after {opacity:.55}
.service-photo img {transition:transform 1100ms var(--ease),filter 1000ms ease;}
.service-card:hover .service-photo img {transform:scale(1.07);filter:saturate(1.07)}
.card-bottom {transition:color 300ms ease;}
.service-card:hover .card-bottom {color:#8f6738}
.circle-arrow { box-shadow: inset 0 1px 0 rgba(255,255,255,.56); }
.service-card:hover .circle-arrow {background:#ddbe7d;transform:rotate(45deg) scale(1.045)}

/* 05. Project galleries and visual surfaces: gentle photographic depth. */
.gallery-tile,.statement-image,.about-image,.contact-art,.detail-hero-img { isolation:isolate; }
.gallery-tile::after,.statement-image::after,.about-image::after,.detail-hero-img::after {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,248,224,.11),transparent 38%,rgba(18,21,17,.22));
  opacity:.36;transition:opacity 800ms ease;
}
.gallery-tile:hover::after,.statement-image:hover::after,
.about-image:hover::after,.detail-hero-img:hover::after {opacity:.72}
.gallery-tile img,.statement-image img,.about-image img,.detail-hero-img img {
  transition:transform 1200ms var(--ease),filter 1000ms ease;
}
.gallery-tile:hover img,.statement-image:hover img,.about-image:hover img,.detail-hero-img:hover img {
  transform:scale(1.045);filter:saturate(1.06);
}
.gallery-tile figcaption,.image-credit {z-index:1}

/* 06. Quality motion for process / information / contact cards. */
.process-card,.detail-card,.contact-card {
  position:relative;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68),0 5px 20px rgba(40,33,21,.055);
  transition:transform 450ms var(--ease),box-shadow 450ms ease,border-color 450ms ease;
}
.process-card:hover,.detail-card:hover,.contact-card:hover {
  border-color:rgba(185,150,85,.53);
  transform:translateY(-5px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 16px 35px rgba(44,34,18,.11);
}
.contact-card .button,.cta-actions .button { box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 10px 29px rgba(18,20,15,.18); }
.wa-float {box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 10px 26px rgba(12,30,19,.31);}
.wa-float:hover {box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 14px 33px rgba(12,30,19,.39);}

/* 07. Lightweight entrance choreography. Content stays visible without JS. */
body.has-motion .reveal {opacity:1;transform:none;transition:none;}
body.has-motion .reveal.is-visible {animation:cinematic-appear 850ms var(--ease) both;}
body.has-motion .service-grid .reveal:nth-child(3n+2).is-visible,
body.has-motion .process-grid .reveal:nth-child(3n+2).is-visible,
body.has-motion .related-grid .reveal:nth-child(3n+2).is-visible {animation-delay:90ms}
body.has-motion .service-grid .reveal:nth-child(3n+3).is-visible,
body.has-motion .process-grid .reveal:nth-child(3n+3).is-visible,
body.has-motion .related-grid .reveal:nth-child(3n+3).is-visible {animation-delay:160ms}
@keyframes cinematic-appear {
  from{opacity:.35;transform:translateY(22px);filter:blur(2px)}
  to{opacity:1;transform:translateY(0);filter:blur(0)}
}
@keyframes line-reveal {from{transform:scaleX(0);transform-origin:left;opacity:0}to{transform:scaleX(1);transform-origin:left;opacity:1}}

/* 08. Motion and transparency fallbacks for small/low-power devices. */
@media (hover:none), (pointer:coarse) {
  .nav a:last-child:hover,.service-card:hover,.button:hover,
  .process-card:hover,.detail-card:hover,.contact-card:hover,
  .wa-float:hover {transform:none;}
  .service-card:hover img,.gallery-tile:hover img,
  .statement-image:hover img,.about-image:hover img,.detail-hero-img:hover img {transform:none;filter:none;}
  .button::after {display:none;}
}
@media (prefers-reduced-motion:reduce) {
  .button::after{display:none!important}
  .button::before{opacity:.35!important}
  .hero-copy .eyebrow::before{animation:none!important}
  body.has-motion .reveal.is-visible{animation:none!important}
}
@media (prefers-reduced-transparency:reduce) {
  .nav-shell {background:#f4f0e8;}
  .button.ghost {background:#383b36;}
  .button.gold {background:#d2b885;}
  .button.dark {background:#30332e;}
}

/* SEO EDITORIAL CONTENT — understated; inherits brand and cinematic motion */
.seo-advice{padding-block:95px;background:linear-gradient(145deg,#eee8dd,#f8f3eb);border-top:1px solid rgba(140,120,84,.17);border-bottom:1px solid rgba(140,120,84,.17)}
.seo-advice-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(35px,7vw,100px);align-items:start}
.seo-advice h2{font-size:clamp(2rem,4vw,3.7rem);max-width:510px}
.seo-advice h2 em{color:#9a7745;font-family:var(--serif);font-weight:400}
.seo-advice-text{max-width:680px}.seo-advice-text p{font-size:1.04rem;line-height:1.9;margin-bottom:20px}
.seo-advice-text h3{font-size:1.28rem;margin:30px 0 14px;line-height:1.35}
.seo-advice-text ul{list-style:none;padding:0;margin:0 0 25px}
.seo-advice-text li{border-bottom:1px solid rgba(80,66,43,.17);padding:12px 10px 12px 26px;position:relative;line-height:1.6}
.seo-advice-text li:before{content:'•';color:#a98650;font-size:1.35rem;position:absolute;left:3px;top:7px}
@media(max-width:820px){.seo-advice-grid{grid-template-columns:1fr;gap:30px}.seo-advice{padding-block:65px}}
@media(max-width:600px){.seo-advice{padding-block:56px}.seo-advice-text p{font-size:1rem}}