Explore (Copy) — ArchitectureForRent.com ®

126 properties found

Claude/explore-properties.html" | pbcopy *,*::before,*::after{box-sizing:border-box;margin:0;padding:0} :root{--black:#111;--white:#fff;--border:#e0e0e0;--mid-gray:#888;--light-gray:#f5f5f3;--font-serif:'Cormorant Garamond',Georgia,serif;--font-sans:'Inter',-apple-system,sans-serif;} html{scroll-behavior:smooth} body{font-family:var(--font-sans);color:var(--black);background:var(--white);overflow-x:hidden} nav{position:fixed;top:0;left:0;right:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;padding:0 40px;height:64px;background:rgba(255,255,255,0.96);backdrop-filter:blur(8px);border-bottom:1px solid rgba(0,0,0,0.08)} .nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--black)} .nav-logo svg{width:28px;height:28px} .nav-logo span{font-size:13px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase} .nav-links{display:flex;gap:36px;list-style:none} .nav-links a{font-size:14px;color:var(--black);text-decoration:none} .nav-links a:hover{opacity:0.6} .nav-right{display:flex;align-items:center;gap:20px} .nav-host{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--black);text-decoration:none} .nav-icon{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer} .nav-icon svg{width:18px;height:18px} .page-header{padding:96px 60px 24px} .page-header-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px} .page-title{font-family:var(--font-serif);font-size:clamp(32px,4vw,52px);font-weight:400;line-height:1.1;margin-bottom:6px} .page-subtitle{font-size:15px;color:var(--mid-gray)} .view-toggle{display:flex;gap:4px;flex-shrink:0;margin-top:4px} .view-btn{width:36px;height:36px;border:1.5px solid var(--border);background:var(--white);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.15s} .view-btn.active,.view-btn:hover{background:var(--black);border-color:var(--black)} .view-btn.active svg,.view-btn:hover svg{stroke:white!important} .view-btn svg{width:16px;height:16px;stroke:var(--black)} .filters-bar{padding:16px 60px;background:var(--white);display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--border);border-bottom:1px solid var(--border)} .search-wrap{position:relative;flex:1;min-width:160px;max-width:260px} .search-wrap svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;pointer-events:none} .search-input{width:100%;padding:9px 12px 9px 34px;border:1.5px solid var(--border);border-radius:6px;font-family:var(--font-sans);font-size:13px;outline:none;transition:border-color 0.15s} .search-input:focus{border-color:var(--black)} .filter-select{padding:9px 30px 9px 12px;border:1.5px solid var(--border);border-radius:6px;font-family:var(--font-sans);font-size:13px;color:var(--black);background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%23888' stroke-width='1.4' fill='none'/%3E%3C/svg%3E") no-repeat right 9px center;appearance:none;outline:none;cursor:pointer;min-width:120px} .filter-select:focus{border-color:var(--black)} .results-bar{padding:12px 60px 8px;display:flex;align-items:center;justify-content:space-between} .results-count{font-size:13px;color:var(--mid-gray)} .results-count strong{color:var(--black);font-weight:600} .reset-btn{font-size:12px;color:var(--mid-gray);background:none;border:none;cursor:pointer;text-decoration:underline;padding:0} .reset-btn:hover{color:var(--black)} .properties-wrap{padding:4px 60px 80px} .properties-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 20px} .properties-list{display:flex;flex-direction:column} .prop-card{cursor:pointer;text-decoration:none;color:inherit;display:block} .prop-card-img{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:4/3;margin-bottom:11px;background:var(--light-gray)} .prop-card-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.4s ease;display:block} .prop-card:hover .prop-card-img img{transform:scale(1.05)} .superhost-badge{position:absolute;top:12px;left:12px;background:var(--white);font-size:11px;font-weight:600;padding:4px 10px;border-radius:4px;letter-spacing:0.01em} .fav-btn{position:absolute;top:12px;right:12px;width:32px;height:32px;background:rgba(255,255,255,0.92);border-radius:50%;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;box-shadow:0 1px 6px rgba(0,0,0,0.14)} .fav-btn svg{width:15px;height:15px} .card-name-row{display:flex;align-items:baseline;justify-content:space-between;font-size:13.5px;font-weight:600;margin-bottom:3px;gap:6px} .card-name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .card-rating{font-size:12.5px;font-weight:500;flex-shrink:0;white-space:nowrap} .card-location{font-size:12.5px;color:var(--mid-gray);display:flex;align-items:center;gap:3px;margin-bottom:2px} .card-architect{font-size:12.5px;font-style:italic;color:var(--black);margin-bottom:1px} .card-meta{font-size:11.5px;color:var(--mid-gray)} .list-card{display:flex;gap:18px;padding:18px 0;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;transition:opacity 0.15s} .list-card:hover{opacity:0.75} .list-card-img{width:180px;flex-shrink:0;border-radius:8px;overflow:hidden;aspect-ratio:4/3;background:var(--light-gray)} .list-card-img img{width:100%;height:100%;object-fit:cover;display:block} .list-card-info{flex:1;display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:0} .lc-name{font-size:15px;font-weight:600} .lc-arch{font-size:13px;font-style:italic} .lc-loc{font-size:13px;color:var(--mid-gray)} .lc-meta{font-size:12px;color:var(--mid-gray)} .lc-rating{font-size:13px;font-weight:500;margin-top:2px} .no-results{padding:80px 0;text-align:center;color:var(--mid-gray);grid-column:1/-1;font-size:15px} .map-section{padding:0 60px 20px;display:none} .map-section.visible{display:block} #prop-map{height:480px;border-radius:10px;overflow:hidden;border:1px solid var(--border)} .map-toggle-btn{display:flex;align-items:center;gap:7px;padding:8px 16px;border:1.5px solid var(--border);border-radius:6px;background:var(--white);font-family:var(--font-sans);font-size:13px;font-weight:500;cursor:pointer;transition:all 0.15s;color:var(--black)} .map-toggle-btn:hover,.map-toggle-btn.active{background:var(--black);color:var(--white);border-color:var(--black)} .map-toggle-btn:hover svg,.map-toggle-btn.active svg{stroke:white} .map-toggle-btn svg{width:15px;height:15px;stroke:var(--black);flex-shrink:0} .leaflet-popup-content-wrapper{border-radius:8px!important;box-shadow:0 4px 20px rgba(0,0,0,0.15)!important;font-family:Inter,-apple-system,sans-serif!important} .leaflet-popup-tip-container{display:none} @media(max-width:600px){.map-section{padding-left:16px;padding-right:16px}#prop-map{height:320px}} @media(max-width:1200px){.properties-grid{grid-template-columns:repeat(3,1fr)}} @media(max-width:900px){.properties-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:600px){ nav{padding:0 16px}.nav-links{display:none} .page-header,.filters-bar,.results-bar,.properties-wrap{padding-left:16px;padding-right:16px} .properties-grid{grid-template-columns:repeat(2,1fr);gap:16px 12px} .search-wrap{max-width:100%}.filter-select,.search-input{font-size:12px} .list-card-img{width:110px} }

126 properties found

Welcome.

Welcome to the ArchitectureForRent blog, curating unique or iconic architecture by (famous) architects for rent!

Explore Properties

Explore Properties

Welcome.