/* Project examples and app-inspired showcases. */
.hero-stage-wrap { margin-inline:auto; width:100%; }
.hero-land>.scene-photo { object-position:center; }
.hero-stage.in-view .hero-land [data-group="parcels"]>.projected-line { animation:hero-boundary-draw 2.6s ease both; }
@keyframes hero-boundary-draw { from{stroke-dasharray:1;stroke-dashoffset:1;opacity:0} 10%{opacity:1} to{stroke-dasharray:1;stroke-dashoffset:0;opacity:1} }
#map-demo .demo-body { display:grid; grid-template-columns:minmax(0,1fr) 245px; }
#map-demo .demo-controls { order:initial; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:8px; padding:24px 20px; border-bottom:0; border-left:1px solid #333; }
#map-demo .control-heading { display:flex; flex-direction:row; justify-content:space-between; align-items:center; margin-bottom:12px; }
#map-demo .layer-control { font-size:13px; min-height:44px; }
#map-demo .demo-image { aspect-ratio:4/3; }
.preset-workspace { grid-template-columns:minmax(0,1.7fr) minmax(360px,1fr); }
.preset-workspace .preset-library { padding:25px; }
.preset-workspace .preset-options { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.preset-workspace .preset-options button { font-size:12px; padding:7px; }
.preset-workspace .preset-options button svg { height:29px; }
.preset-workspace .preset-options button>span { min-height:29px; }
.preset-properties { margin-top:18px; }
.preset-properties>div { padding:10px 0; }
@media(min-width:1800px) { #map-demo .demo-body{grid-template-columns:minmax(0,1fr) 290px} #map-demo .layer-control{font-size:15px} .preset-workspace{grid-template-columns:minmax(0,1.8fr) minmax(430px,1fr)} .preset-workspace .preset-options button{font-size:14px} }
@media(max-width:1000px) { #map-demo .demo-body{grid-template-columns:minmax(0,1fr) 205px} #map-demo .demo-controls{padding:18px 14px} #map-demo .layer-control{font-size:11px} .preset-workspace{grid-template-columns:1fr} .preset-workspace .preset-library{border-left:0;border-top:1px solid #373737} .preset-main-photo .photo-scene{aspect-ratio:4/3} }
@media(max-width:650px) { #map-demo .demo-body{grid-template-columns:1fr} #map-demo .demo-controls{display:grid;grid-template-columns:1fr 1fr;gap:5px 18px;border-left:0;border-top:1px solid #333;padding:16px} #map-demo .control-heading{grid-column:1/-1;margin-bottom:4px} #map-demo .layer-control{font-size:12px;min-height:39px} .preset-workspace .preset-library{padding:18px} .preset-workspace .preset-options button{font-size:11px;padding:5px} }
@media(prefers-reduced-motion:reduce) { .hero-stage.in-view .hero-land [data-group="parcels"]>.projected-line{animation:none} }
/* Compact versions of Cartograph's Quick refine and Satellite photo tools. */
.refine-app-preview,.satellite-app-preview { height:390px!important; aspect-ratio:auto!important; background:#181818; display:flex; flex-direction:column; overflow:hidden; }
.refine-preview-photo { height:190px; min-height:140px; position:relative; overflow:hidden; }
.refine-preview-photo>img,.refine-preview-photo>svg { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; }
.refine-preview-photo>svg { overflow:visible; }
.refine-source-line { fill:none;stroke:#ff7824;stroke-width:4; }
.refine-target-line { fill:none;stroke:white;stroke-width:2;stroke-dasharray:6 5;opacity:.5; }
.refine-target { fill:#15151588;stroke:#fff;stroke-width:2; }
.refine-context { position:absolute;top:12px;left:12px;background:#161616ed;padding:6px 9px;border:1px solid #444;border-radius:4px;font-size:10px; }
.refine-context i { color:#ff7824;margin:0 6px; }
.refine-inspector-body { padding:14px;flex:1;border-top:1px solid #3c3c3c;background:#191919; }
.refine-inspector-body header { display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-bottom:13px; }
.refine-inspector-body header span { font-size:9px;color:#999; }
.refine-inspector-body .section-label { font-size:9px;color:#aaa;margin-bottom:7px; }
.refine-tool-grid { display:grid;grid-template-columns:1fr 1fr;gap:7px; }
.refine-tool-grid button { background:#242424;border:1px solid #444;display:flex;align-items:center;text-align:left;gap:8px;border-radius:5px;min-height:56px;padding:9px;color:#ddd; }
.refine-tool-grid button[aria-pressed=true] { border-color:#9a552b;background:#36261c; }
.refine-tool-grid button:hover { background:#303030; }
.refine-action-icon { color:#ff7824;flex:none;display:grid;place-items:center; }
.refine-action-icon svg { width:16px;height:16px; }
.refine-tool-grid b { display:block;font-size:11px;font-weight:500; }
.refine-tool-grid small { display:block;font-size:9px;line-height:1.35;color:#aaa;margin-top:3px; }
.refine-running .refine-source-line { animation:refine-align 1.5s ease both; }
.refine-app-preview[data-action=move] .refine-source-line { transform:translate(10px,14px); }
.refine-app-preview[data-action=horizon] .refine-source-line { transform:rotate(-2deg);transform-origin:center; }
@keyframes refine-align { from { transform:translate(12px,15px); } to { transform:translate(-7px,-11px); } }
.satellite-app-preview>.capture-map { flex:1;min-height:150px;aspect-ratio:auto; }
.capture-map>.imagery-credit { font-size:8px; }
.satellite-capture-interface { position:absolute;inset:0;pointer-events:none;display:grid;place-items:center; }
.satellite-capture-frame { width:calc(100% - var(--capture-padding,15%) * 2);max-height:90%;aspect-ratio:var(--capture-aspect,4/3);border:2px solid #ff7f24;border-radius:3px;box-shadow:0 0 0 9999px #030303a3;position:relative;transition:width .25s,aspect-ratio .25s; }
.satellite-capture-frame-label { position:absolute;left:8px;top:8px;padding:5px 7px;background:#111e;border:1px solid #ff7f2470;border-radius:3px;font:500 9px Trip,sans-serif;text-transform:uppercase;letter-spacing:.06em; }
.satellite-capture-frame>i { position:absolute;width:12px;height:12px;border:2px solid #fff; }
.satellite-capture-frame>i:nth-of-type(1){top:-3px;left:-3px;border-right:0;border-bottom:0}.satellite-capture-frame>i:nth-of-type(2){top:-3px;right:-3px;border-left:0;border-bottom:0}.satellite-capture-frame>i:nth-of-type(3){bottom:-3px;left:-3px;border-right:0;border-top:0}.satellite-capture-frame>i:nth-of-type(4){bottom:-3px;right:-3px;border-left:0;border-top:0}
.satellite-capture-toolbar { padding:13px;background:#101010f7;border:1px solid #444;border-radius:7px;margin:10px;box-shadow:0 12px 26px #0003; }
.capture-topline { display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;font-size:11px;gap:8px; }
.capture-topline>span { font-size:9px;color:#aaa; }
.satellite-capture-toolbar-row { display:grid;grid-template-columns:95px 1fr;gap:12px;align-items:end; }
.capture-select-control,.capture-range-control { display:block;font-size:10px;min-width:0; }
.capture-select-control>span,.capture-range-control>span { display:flex;justify-content:space-between;margin-bottom:6px;color:#aaa; }
.capture-select-control select { padding:6px 9px;height:32px;font-size:11px;background:#252525;border:1px solid #555; }
.capture-range-control input { width:100%;height:32px;margin:0; }
.satellite-capture-actions { display:flex;justify-content:flex-end;gap:7px;margin-top:10px; }
.satellite-capture-actions button { border:1px solid #454545;background:#232323;border-radius:4px;padding:7px 12px;font-size:10px;display:flex;align-items:center;gap:6px; }
.satellite-capture-actions button svg { width:12px;height:12px; }
.satellite-capture-actions button.primary { color:#181818;background:#ff7824;border-color:#ff7824;font-weight:500; }
.satellite-app-preview[data-captured=true] .satellite-capture-frame { border-color:#fff; }
.satellite-app-preview[data-captured=true] .satellite-capture-frame>i,.satellite-app-preview[data-captured=true] .satellite-capture-frame-label { opacity:0; }
.disclaimer-thumbnail .image-disclaimer { left:5%;right:5%;bottom:5%;max-width:90%;width:auto;text-align:center;border:1px solid #ffffff29;border-radius:5px;padding:12px 14px;background:#202629d9;color:#f7f5f0;box-shadow:none;font:500 clamp(10px,.8vw,14px)/1.45 Trip,sans-serif; }
.disclaimer-thumbnail .image-disclaimer>span { display:block;font:400 8px TripMono,monospace;letter-spacing:.12em;margin-bottom:5px;color:#c9c9c9; }
@media(min-width:1800px){.refine-app-preview,.satellite-app-preview{height:440px!important}.refine-preview-photo{height:225px}.refine-tool-grid b{font-size:13px}.refine-tool-grid small{font-size:11px}.refine-tool-grid button{min-height:64px}.satellite-capture-toolbar{padding:17px}.capture-topline{font-size:13px}}
@media(max-width:650px){.refine-app-preview,.satellite-app-preview{height:370px!important}.refine-tool-grid button{padding:8px;gap:6px}.refine-tool-grid b{font-size:11px}.refine-tool-grid small{font-size:9px}.refine-inspector-body{padding:12px}}
@media(prefers-reduced-motion:reduce){.refine-running .refine-source-line{animation:none}}
.project-label-photo,.project-measure-photo { position:relative;aspect-ratio:4/3;background:#202020;overflow:hidden; }
.project-label-photo>img { width:100%;height:100%;object-fit:cover; }
.project-label-photo .thumbnail-label { top:42%;left:43%;font-size:clamp(18px,2.4vw,34px);max-width:84%;white-space:nowrap; }
.project-label-photo .thumbnail-label:after { height:58px; }
.project-measure-photo>.photo-scene { height:100%;width:100%; }
.geographic-measurement { position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none; }
.geographic-measurement path { fill:none;stroke:#ff7824;stroke-width:4; }
.geographic-measurement circle { fill:#202020;stroke:#ff7824;stroke-width:2; }
.geographic-measurement text { fill:#fff;font:500 21px Trip,sans-serif;stroke:#171717;stroke-width:8px;stroke-linejoin:round;paint-order:stroke; }
.project-measure-photo .thumbnail-tool { z-index:3;gap:14px; }
.project-measure-photo .thumbnail-tool strong { color:#eee;margin-left:auto; }
.gallery-project-nav { display:flex;flex-wrap:wrap;gap:10px;margin:5px 0 45px; }
.gallery-project-nav a { padding:8px 12px;border:1px solid #3d3d3d;border-radius:4px;font-size:12px;transition:background .2s; }
.gallery-project-nav a:hover { background:#292929;border-color:#777; }
.project-gallery .gallery-output-list { gap:48px; }
.project-gallery .output-item { scroll-margin-top:100px; }
.project-gallery .output-item figcaption { padding:0 0 18px; }
.project-gallery .output-item figcaption h2 { font-size:clamp(1.5rem,2.1vw,2.2rem); }
.gallery-image-layout { display:grid;grid-template-columns:minmax(0,1fr) 240px;border:1px solid #3b3b3b;border-radius:7px;overflow:hidden;background:#191919; }
.gallery-image-layout .before-after { aspect-ratio:4/3;border:0;border-radius:0; }
.gallery-image-layout .after-view>img { position:absolute;inset:0;width:100%;height:100%;object-fit:contain; }
.gallery-layer-legend { border-left:1px solid #3b3b3b;padding:27px 22px;display:flex;flex-direction:column; }
.gallery-legend-heading { display:flex;align-items:center;gap:9px;padding-bottom:18px;margin-bottom:8px;border-bottom:1px solid #343434; }
.gallery-legend-heading svg { width:16px;height:16px;color:#aaa; }
.gallery-legend-heading h3 { font-size:13px; }
.gallery-layer-legend ul { list-style:none;margin:0;padding:0; }
.gallery-layer-legend li { display:flex;align-items:center;gap:11px;font-size:12px;line-height:1.5;padding:11px 0;color:#ddd; }
.gallery-layer-legend li>i { width:25px;flex:none;border-top:2px var(--legend-style,solid) var(--legend-color); }
.gallery-layer-legend p { font-size:12px;line-height:1.8;color:#aaa; }
.gallery-photo-id { font:400 9px/1.5 TripMono,monospace;color:#888;word-break:break-word;border-top:1px solid #343434;padding-top:15px;margin-top:auto; }
@media(min-width:1800px){.gallery-image-layout{grid-template-columns:minmax(0,1fr) 290px}.gallery-layer-legend{padding:30px}.gallery-layer-legend li,.gallery-legend-heading h3{font-size:15px}}
@media(max-width:1000px){.gallery-image-layout{grid-template-columns:minmax(0,1fr) 200px}.gallery-layer-legend{padding:20px 16px}}
@media(max-width:650px){.gallery-image-layout{grid-template-columns:1fr}.gallery-layer-legend{border-left:0;border-top:1px solid #3b3b3b;padding:18px}.gallery-layer-legend ul{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.gallery-layer-legend li{font-size:11px;padding:7px 0}.gallery-photo-id{margin-top:13px;font-size:8px}.gallery-legend-heading{padding-bottom:10px}.gallery-project-nav{gap:7px;margin-bottom:30px}.gallery-project-nav a{font-size:11px;padding:7px 9px}.project-gallery .output-item figcaption h2{font-size:1.45rem}.project-label-photo .thumbnail-label{font-size:21px}}
.preset-main-photo { align-self:center; }
.preset-main-photo>.photo-scene { height:auto!important;min-height:0!important;aspect-ratio:4/3!important; }
.preset-options svg path { stroke-linecap:round; }
.satellite-capture-toolbar input[type=range] { accent-color:#ff7824; }
.finish-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.finish-grid>.finish-card:nth-child(-n+2) { grid-column:span 2; }
.refine-app-preview,.satellite-app-preview { height:410px!important; }
.refine-preview-photo { height:220px; }
.refine-tool-grid b { font-size:12px; }
.refine-tool-grid small { font-size:10px; }
@media(max-width:1100px){.finish-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.finish-grid>.finish-card:nth-child(-n+2){grid-column:auto}.refine-tool-grid b{font-size:11px}.refine-tool-grid small{font-size:9px}}
@media(max-width:650px){.finish-grid{grid-template-columns:1fr}.refine-app-preview,.satellite-app-preview{height:390px!important}.refine-preview-photo{height:190px}}
.satellite-capture-frame { width:auto;height:calc(100% - var(--capture-padding,15%) * 2);max-width:90%;max-height:none; }
[data-motion=reduced] .hero-stage.in-view .hero-land [data-group=parcels]>.projected-line,[data-motion=reduced] .refine-running .refine-source-line { animation:none; }
[data-motion=reduced] .satellite-capture-frame { transition:none; }
