:root { --ink:#98745f; --brown:#9b775f; --cream:#f4ede8; --paper:#fffdfb; --dark:#6e5041; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Manrope", Arial, sans-serif; font-weight:400; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
.header { height:140px; padding:0 clamp(24px,7vw,108px); display:flex; align-items:center; gap:clamp(20px,4vw,64px); background:#fff; position:sticky; top:0; z-index:10; }
.brand, .footer-brand { display:flex; align-items:center; min-width:185px; }
.brand-logo-wrap { width:112px; height:92px; display:grid; place-items:center; background:var(--brown); }
.brand-logo { width:100%; height:100%; object-fit:contain; }
.brand-logo-wrap .brand-logo { width:88px; height:74px; }
.nav { display:flex; align-items:center; justify-content:center; gap:0; flex:1; }
.nav a { padding:0 20px; font-size:15px; border-right:1px solid #d7c4b9; }
.nav a:last-child { border:0; }
.button { border:0; display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--brown); color:#f9f2eb; border-radius:999px; padding:15px 25px; font:400 13px "Manrope",sans-serif; transition:transform .2s, background .2s; white-space:nowrap; }
.button:hover { background:var(--dark); transform:translateY(-2px); }
.button-small { padding:12px 17px; font-size:11px; }
.menu-toggle { display:none; border:0; background:transparent; }
.section-grid { display:grid; grid-template-columns:1fr 1fr; }
.hero { min-height:750px; background:#f3eae5; overflow:hidden; }
.hero-copy { padding:clamp(70px,9vw,160px) clamp(30px,8vw,154px); align-self:center; position:relative; z-index:1; }
.eyebrow { margin:0 0 20px; text-transform:uppercase; letter-spacing:2px; font-size:10px; }
h1,h2 { font-weight:300; letter-spacing:-.055em; margin:0; line-height:1.02; }
h1 { font-size:clamp(45px,5vw,92px); }
h1 em { font-style:normal; }
.hero-copy > p:not(.eyebrow) { max-width:470px; margin:30px 0; font-size:15px; line-height:1.45; }
.actions { display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.text-link { font-size:13px; padding:12px 0; border-bottom:1px solid var(--ink); }
.hero-image { min-height:750px; }
.hero-image img { width:100%; height:100%; object-fit:cover; object-position:center 34%; }
.story { min-height:800px; background:#f8f3ef; }
.story-copy { padding:clamp(70px,8vw,140px) clamp(30px,8vw,154px); }
.line { width:78px; height:1px; background:var(--brown); display:block; margin-bottom:38px; }
h2 { font-size:clamp(36px,4.1vw,72px); }
.story-copy p { max-width:580px; font-size:15px; line-height:1.45; margin:22px 0 0; }
.story-image img { width:100%; height:100%; object-fit:cover; min-height:650px; }
.technology { min-height:670px; background:#f3eae5; }
.technology-image img { width:100%; height:100%; object-fit:cover; }
.technology-copy { padding:clamp(60px,7vw,120px) clamp(32px,7vw,120px); }
.technology-copy h2 { margin-bottom:30px; }
dl { margin:0 0 28px; } dl div { margin:12px 0; padding-left:15px; border-left:1px solid var(--brown); } dt { font-size:21px; } dd { margin:4px 0 0; font-size:11px; line-height:1.4; }
.care { position:relative; min-height:370px; overflow:hidden; background:#f7eee9; }.care > img { width:100%; height:100%; min-height:370px; object-fit:cover; object-position:68% center; opacity:.86; }.care-copy { position:absolute; max-width:430px; left:clamp(25px,10vw,200px); top:50%; transform:translateY(-50%); }.care-copy h2 { font-size:clamp(38px,4.2vw,70px); }.care-copy p { font-size:12px; line-height:1.45; max-width:350px; }
.differentials { padding:95px clamp(24px,7vw,108px); text-align:center; }.differentials h2 { margin-bottom:54px; }.cards { display:grid; grid-template-columns:repeat(6,1fr); max-width:1450px; margin:auto; }.cards article { min-height:205px; padding:27px 14px 14px; border:1px solid #eadfd8; margin-left:-1px; }.icon-circle { width:52px; height:52px; display:inline-grid; place-items:center; background:var(--brown); border-radius:50%; }.icon-circle img { width:28px; height:28px; object-fit:contain; filter:brightness(0) invert(1); }.cards h3 { font-size:11px; font-weight:500; margin:13px 0 7px; }.cards p { font-size:9px; line-height:1.45; margin:0; }
.banner { min-height:185px; display:grid; grid-template-columns:1.3fr 1fr auto; align-items:center; overflow:hidden; background:#ede3dc; position:relative; padding:25px clamp(24px,10vw,180px); gap:25px; }.banner > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right 53%; opacity:.5; }.banner > *:not(img) { position:relative; }.banner h2 { font-size:28px; }.banner p { max-width:350px; font-size:10px; line-height:1.45; }
.steps { padding:82px 24px 100px; text-align:center; }.steps h2 { margin-bottom:48px; }.steps ol { list-style:none; padding:0; margin:0 auto; max-width:1070px; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }.steps li { display:flex; align-items:center; gap:16px; text-align:left; font-size:12px; line-height:1.3; }.steps b { width:52px; aspect-ratio:1; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; background:var(--brown); color:#fff; font-weight:400; font-size:17px; }
footer { position:relative; display:grid; grid-template-columns:.9fr 1.7fr auto; align-items:center; gap:48px; min-height:340px; padding:65px clamp(24px,9vw,170px) 50px; color:#fffaf6; background:linear-gradient(90deg,rgba(121,87,65,.88),rgba(174,137,111,.78)),url("assets/raw-08.png") center/cover; } footer .brand-logo { width:155px; height:auto; } footer h2 { font-size:clamp(30px,3vw,54px); } footer p { max-width:450px; font-size:12px; } footer .button { background:#b69078; }.copyright { grid-column:1/-1; text-align:center; margin:20px 0 0; }
@media (max-width:900px) { .header { height:90px; gap:15px; }.nav { position:absolute; display:none; top:90px; left:0; right:0; padding:20px; background:#fff; box-shadow:0 10px 20px #5e48331b; }.nav.is-open { display:flex; flex-direction:column; align-items:stretch; }.nav a { border:0; padding:14px; text-align:center; }.menu-toggle { display:grid; gap:5px; margin-left:auto; padding:12px; }.menu-toggle span { width:23px; height:1px; background:var(--ink); display:block; }.header > .button { display:none; }.section-grid { grid-template-columns:1fr; }.hero-copy { padding:80px 9vw 55px; }.hero-image { min-height:480px; }.story-copy,.technology-copy { padding:75px 9vw; }.story-image { order:2; }.story-image img { min-height:420px; }.technology-image { min-height:420px; }.technology-image img { min-height:420px; }.cards { grid-template-columns:repeat(3,1fr); }.banner { grid-template-columns:1fr; padding:38px 9vw; }.banner .button { justify-self:start; }.steps ol { grid-template-columns:repeat(2,1fr); max-width:530px; } footer { grid-template-columns:1fr; gap:20px; }.footer-brand { min-width:0; } }
@media (max-width:520px) { .brand { min-width:0; }.brand strong { font-size:18px; }.hero { min-height:0; }.hero-image { min-height:360px; }.hero-image img { object-position:center 26%; }.cards { grid-template-columns:repeat(2,1fr); }.care,.care > img { min-height:470px; }.care > img { object-position:65% center; }.care-copy { left:24px; right:24px; top:auto; bottom:26px; transform:none; background:#f8eee9e6; padding:18px; }.steps { padding:65px 24px; }.steps ol { grid-template-columns:1fr; max-width:270px; }.banner h2 { font-size:30px; } }
/* */
