:root{--ink:#1e3431;--muted:#63746e;--gold:#b58b52;--cream:#f8f6f1;--line:#dce3dc;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font:16px/1.65 system-ui,-apple-system,Segoe UI,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,select{touch-action:manipulation}.container{max-width:1180px;margin:auto;padding:0 22px}.topbar{background:#172c29;color:#fff;font-size:12px;text-align:center;padding:7px}.header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid #edf0eb}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:26px;min-height:89px}.logo{display:block;width:270px;max-width:65vw}.nav{display:flex;gap:24px;align-items:center}.nav a{font-size:14px;font-weight:650}.nav a:hover,.link:hover{color:var(--gold)}.btn{display:inline-flex;align-items:center;justify-content:center;background:#b58b52;color:#fff!important;border:none;border-radius:7px;padding:13px 21px;font-weight:750;cursor:pointer;min-height:48px;text-align:center}.btn:hover{background:#9e7540}.btn-outline{background:transparent;border:1px solid currentColor;color:var(--ink)!important}.menu-toggle{display:none;border:0;background:none;font-size:29px;color:var(--ink)}.hero{min-height:590px;background:linear-gradient(90deg,rgba(12,34,31,.83) 0%,rgba(12,34,31,.62) 43%,rgba(12,34,31,.04) 100%),url('/assets/hero.svg') center/cover;display:flex;align-items:center;color:white}.hero h1{font-size:clamp(38px,5.6vw,76px);max-width:760px;line-height:1.1;margin:14px 0 24px;letter-spacing:-2px}.hero p{max-width:560px;color:#e5ebe7;font-size:19px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:#d9b989;font-size:12px;font-weight:800}.hero-cta{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}.hero .btn-outline{color:white!important}.section{padding:78px 0}.section.alt{background:var(--cream)}.center{text-align:center}.section h2{font-size:clamp(30px,3.5vw,46px);letter-spacing:-1.2px;line-height:1.19;margin:10px 0 19px}.lead{font-size:18px;color:var(--muted);max-width:760px}.center .lead{margin:0 auto}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:38px}.card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(24,48,38,.08);transition:transform .25s ease, box-shadow .25s ease}.card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(24,48,38,.12)}.card-media{height:250px;overflow:hidden;background:#e8ece8}.card-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.card:hover .card-media img{transform:scale(1.05)}.card-body{padding:22px 24px 24px}.card h3{font-size:21px;line-height:1.35;margin:0 0 12px}.card p{color:var(--muted);margin:0 0 16px}.link{font-weight:750;color:#937043}.split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.feature{background:#e6ece7;border-radius:14px;padding:45px;min-height:360px}.feature-photo{position:relative;min-height:390px;border-radius:18px;overflow:hidden;box-shadow:0 18px 45px rgba(16,42,38,.12)}.feature-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.feature-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,33,29,.08) 0%,rgba(12,33,29,.68) 100%)}.feature-photo-content{position:relative;z-index:1;min-height:390px;display:flex;flex-direction:column;justify-content:flex-end;padding:34px;color:#fff}.feature-photo-content h2{color:#fff;margin-bottom:14px}.feature-photo-content p{margin:0;color:#edf4ef;font-size:17px;line-height:1.6}.feature-photo-content .eyebrow{color:#efd0a0}.check{margin-bottom:19px;padding-left:29px;position:relative}.check:before{content:'✓';position:absolute;left:0;color:#729073;font-weight:bold}.banner{background:#193630;color:white;padding:62px 0}.banner .lead{color:#e3ede8}.form-wrap{background:white;border:1px solid var(--line);box-shadow:0 15px 55px #152e2517;border-radius:16px;padding:32px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.field{display:flex;flex-direction:column;gap:5px}.field.full{grid-column:1/-1}label{font-weight:650;font-size:14px}.field input,.field select,.field textarea, .admin-input{width:100%;border:1px solid #cbd6ce;background:#fff;border-radius:7px;padding:12px 13px;color:var(--ink)}.field :focus,.admin-input:focus{outline:2px solid #bf9f70;outline-offset:1px}.small{font-size:13px;color:var(--muted)}.legal p{margin-bottom:20px}.locations{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:30px}.locations a{border:1px solid var(--line);border-radius:7px;padding:12px;background:white;font-size:14px}.locations a:hover{border-color:var(--gold)}.footer{background:#162b28;color:#e3e9e5;padding:60px 0 25px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.footer a{display:block;margin:7px 0}.footer p{color:#bfcfc6}.footer-bottom{border-top:1px solid #486057;margin-top:30px;padding-top:20px;font-size:12px;color:#adc1b5}.cookie{position:fixed;bottom:15px;left:15px;right:15px;z-index:100;background:#fff;box-shadow:0 15px 80px #0004;border:1px solid #e0e5df;padding:21px;border-radius:12px;max-width:950px;margin:auto;display:none;gap:20px;align-items:center}.cookie.show{display:flex}.cookie p{margin:0;flex:1;font-size:13px}.cookie-actions{display:flex;flex-wrap:wrap;gap:8px}.cookie button{padding:10px 14px;border:1px solid #b9c9bf;border-radius:6px;background:white;cursor:pointer;font-size:13px}.cookie button.primary{background:#1b463c;color:white;border-color:#1b463c}.alert{padding:14px 18px;border-radius:6px;background:#e8f6ee;color:#15513b;margin-bottom:20px}.error{background:#ffe9e7;color:#8b2c28}.breadcrumb{font-size:13px;color:var(--muted);padding:24px 0}.pill{display:inline-block;padding:5px 11px;background:#e6eee7;border-radius:99px;font-size:12px}.article{max-width:820px}.article h1{font-size:clamp(35px,5vw,56px);line-height:1.1;letter-spacing:-1.3px}.article h2{margin-top:38px}.admin-shell{max-width:1250px;margin:auto;padding:28px 20px}.admin-table{overflow:auto}.admin-table table{border-collapse:collapse;width:100%;min-width:850px}.admin-table th,.admin-table td{text-align:left;border-bottom:1px solid #e0e7df;padding:11px 13px;font-size:14px}.admin-table th{background:#eff3ef}.admin-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:23px 0}.admin-toolbar>*{max-width:250px}.hamburger-overlay{display:none}
@media(max-width:860px){.nav{display:none;position:absolute;top:90px;left:0;right:0;background:white;padding:23px;box-shadow:0 22px 25px #0002;flex-direction:column;align-items:stretch;gap:17px}.nav.open{display:flex}.menu-toggle{display:block}.cards{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.locations{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.header-inner{min-height:75px}.nav{top:76px}.logo{width:228px}.hero{min-height:540px;background-position:59% center}.hero h1{letter-spacing:-1px}.section{padding:53px 0}.cards,.form-grid,.footer-grid{grid-template-columns:1fr}.locations{grid-template-columns:repeat(2,1fr)}.form-wrap{padding:20px}.feature,.feature-photo-content{padding:24px;min-height:auto}.card-media{height:220px}.cookie.show{display:block}.cookie-actions{margin-top:13px}.footer{padding-top:44px}}

/* DiagonalHosting.com - photography and immersive content */
.hero{background:linear-gradient(90deg,rgba(13,31,29,.85) 0%,rgba(13,31,29,.62) 38%,rgba(13,31,29,.07) 100%),url('/assets/pergola-terraza-mediterranea.webp') center 54%/cover no-repeat!important;color:#fff;min-height:590px;display:flex;align-items:center}.hero .container{width:100%}.hero h1{color:#fff;max-width:750px;text-shadow:0 3px 18px #102a2638}.hero p{color:#f1f8f4;max-width:610px}.hero .eyebrow{color:#f1d7ae}.hero .btn-outline{border-color:#fff;color:#fff}.hero .btn-outline:hover{background:#fff;color:#1c3933}.banner{background:linear-gradient(90deg,rgba(15,42,37,.92),rgba(15,42,37,.65)),url('/assets/pergola-terraza-mediterranea.webp') center 55%/cover no-repeat!important;color:white}.banner h1,.banner .lead{color:white}.banner .eyebrow{color:#e9c891}@media(max-width:760px){.hero{background-image:linear-gradient(180deg,rgba(13,31,29,.78),rgba(13,31,29,.58)),url('/assets/pergola-terraza-mediterranea-mobile.webp')!important;min-height:530px}.banner{background-position:57% center}}
