
.svoe78-prototype{
  --gold:#c69a55;
  --ink:#242a2b;
  --bg:#f7f6f3;
  --line:#e1ded8;
  color:var(--ink);
  font-family:Arial,"Helvetica Neue",sans-serif;
  background:#fff;
}
.svoe78-prototype *{box-sizing:border-box}
.svoe78-prototype button,
.svoe78-prototype input,
.svoe78-prototype select,
.svoe78-prototype textarea{font:inherit}
.svoe78-prototype button,
.svoe78-prototype a{cursor:pointer}
.svoe78-prototype button:focus-visible,
.svoe78-prototype a:focus-visible,
.svoe78-prototype select:focus-visible,
.svoe78-prototype input:focus-visible,
.svoe78-prototype textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.svoe78-prototype a{color:inherit}
.svoe78-prototype .wrap{max-width:1190px;margin:auto;padding:0 22px}
.svoe78-prototype .btn{background:#242a2b;color:white;border:0;border-radius:7px;padding:14px 19px;font-weight:700}
.svoe78-prototype .btn:hover{background:#404a4a}
.svoe78-prototype .small{font-size:12px;color:#777d7d}
.svoe78-prototype .crumb{padding:23px 0;font-size:13px;color:#666}
.svoe78-prototype .crumb a{font-weight:700;text-decoration:none}
.svoe78-prototype .main{background:var(--bg)}
.svoe78-prototype .hero{display:grid;grid-template-columns:1.58fr 1fr;gap:26px;align-items:start;padding-bottom:55px}
.svoe78-prototype .photo{position:relative;min-height:355px;border-radius:14px;overflow:hidden;background:#eae6df;display:flex;align-items:center;justify-content:center}
.svoe78-prototype .photo img{width:100%;height:355px;object-fit:cover}
.svoe78-prototype .photo .actions{position:absolute;right:15px;top:15px;display:flex;gap:8px}
.svoe78-prototype .actions button{background:white;border:0;border-radius:50px;padding:10px 12px;font-size:12px;font-weight:700}
.svoe78-prototype .actions button:hover{background:#e8d0a5}
.svoe78-prototype .thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:9px}
.svoe78-prototype .thumbs button{border:2px solid transparent;padding:0;border-radius:9px;overflow:hidden;background:#ece9e3}
.svoe78-prototype .thumbs button.active{border-color:var(--gold)}
.svoe78-prototype .thumbs img{width:100%;aspect-ratio:1.75;object-fit:cover;display:block}
.svoe78-prototype .textlinks{display:flex;gap:22px;margin:12px 0 0;font-size:13px}
.svoe78-prototype .textlinks a:hover{text-decoration:none}
.svoe78-prototype .project{background:white;border:1px solid var(--line);border-radius:17px;padding:26px}
.svoe78-prototype .eyebrow{color:#946326;letter-spacing:1.4px;font-weight:700;font-size:11px}
.svoe78-prototype .project h1{font-size:54px;line-height:1.05;margin:9px 0 14px;letter-spacing:-2px}
.svoe78-prototype .area{display:flex;gap:9px;align-items:baseline}
.svoe78-prototype .area b{font-size:23px}



.svoe78-prototype .fieldlabel{font-size:11px;color:#92652a;letter-spacing:1px;font-weight:700;margin:17px 0 8px}
.svoe78-prototype .choose{width:100%;padding:12px;border:1px solid #d4cfc5;border-radius:8px;background:white}
.svoe78-prototype .paynav{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;background:#f0efec;border-radius:9px;padding:4px}
.svoe78-prototype .paynav button{border:1px solid transparent;background:transparent;padding:10px 4px;border-radius:7px;font-size:12px;font-weight:bold}
.svoe78-prototype .paynav button.active{border-color:var(--gold);background:#fff}
.svoe78-prototype .pricebox{background:#faf9f7;border:1px solid var(--line);padding:15px;border-radius:10px;margin-top:9px;min-height:112px}
.svoe78-prototype .pricebox.dark{background:#242a2b;color:white}
.svoe78-prototype .value{font-size:30px;font-weight:800;margin:5px 0}
.svoe78-prototype .green{color:#1d8c47;font-size:13px;font-weight:700}
.svoe78-prototype .gold{color:#d8ad63;font-weight:bold}
.svoe78-prototype .paypair{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:12px}
.svoe78-prototype .paypair b{font-size:19px}
.svoe78-prototype .cta{width:100%;margin-top:16px}
.svoe78-prototype .section{padding:52px 0;background:#f7f6f3}
.svoe78-prototype .section h2{font-size:31px;margin:6px 0 12px}
.svoe78-prototype .section p{color:#717677}
.svoe78-prototype .choices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.svoe78-prototype .choices button{border:1px solid var(--line);background:white;border-radius:10px;text-align:left;padding:22px;font-weight:bold}
.svoe78-prototype .choices button:hover{border-color:var(--gold);background:#f7f1e5}
.svoe78-prototype .choices span{display:block;color:#6e7473;font-size:12px;margin-top:9px;font-weight:400}
.svoe78-prototype .floating{position:fixed;bottom:20px;right:20px;background:white;border:1px solid var(--line);border-radius:40px;padding:12px 17px;box-shadow:0 5px 20px #0002;z-index:90}
.svoe78-prototype .shade{position:fixed;inset:0;background:#0009;display:none;align-items:center;justify-content:center;z-index:10000;padding:15px}
.svoe78-prototype .shade.open{display:flex}
.svoe78-prototype .modal{background:white;border-radius:16px;width:min(430px,100%);max-height:92vh;overflow:auto;padding:26px;position:relative}
.svoe78-prototype .modal h2{font-size:23px;margin:12px 0}
.svoe78-prototype .modal input,
.svoe78-prototype .modal textarea{width:100%;border:1px solid #ddd;border-radius:7px;padding:12px;margin:6px 0 12px}
.svoe78-prototype .modal label{font-weight:bold;font-size:12px}
.svoe78-prototype .modal .consent{display:flex;gap:9px;font-weight:400;margin-bottom:10px;align-items:flex-start}
.svoe78-prototype .modal .consent input{width:auto;margin:2px 0 0}
.svoe78-prototype .x{position:absolute;right:15px;top:12px;border:none;background:none;font-size:25px}
.svoe78-prototype .summary{background:#f6f4ef;padding:12px;border-radius:9px;font-size:13px;margin:14px 0}
.svoe78-prototype .toast{position:fixed;bottom:75px;left:50%;transform:translateX(-50%);padding:12px 20px;background:#242a2b;color:white;border-radius:8px;z-index:10001}

@media(max-width:900px){
  .svoe78-prototype .hero{grid-template-columns:1fr}
  .svoe78-prototype .project h1{font-size:42px}
}
@media(max-width:550px){
  .svoe78-prototype .wrap{padding:0 15px}
  .svoe78-prototype .photo img,
  .svoe78-prototype .photo{height:280px;min-height:280px}
  .svoe78-prototype .actions button{font-size:11px;padding:9px}
  .svoe78-prototype .choices{grid-template-columns:1fr}
  .svoe78-prototype .paynav button{font-size:11px}
  .svoe78-prototype .textlinks{gap:10px;flex-wrap:wrap}
  .svoe78-prototype .project{padding:19px}
  .svoe78-prototype .floating{bottom:10px;right:10px}
}


.svoe78-prototype .thumbs.is-few{grid-template-columns:repeat(auto-fit,minmax(110px,160px));justify-content:start}
.svoe78-prototype .photo-empty{flex-direction:column;gap:7px;color:#697071}
.svoe78-prototype .photo-empty strong{font-size:32px;color:#242a2b}
.svoe78-prototype .no-price strong{display:block;font-size:17px;margin-bottom:7px}


/* V3.4 — SVOE 98 media and crisp icon polish */


.svoe78-prototype .photo img{image-rendering:auto}
.svoe78-prototype .thumbs img{image-rendering:auto}
.svoe78-prototype .thumbs button:last-child img{object-fit:contain;background:#06100f}
.svoe78-prototype .thumbs button{background:#07100f}


/* V3.4.1 — lighter project facts */







/* V3.5 — premium first-screen interaction and facts */
.svoe78-prototype .spec{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin:12px 0 23px;
  color:#747a79;
  font-size:12px;
  font-weight:400;
  line-height:1.35;
  letter-spacing:-.01em;
}
.svoe78-prototype .spec-item{white-space:nowrap}
.svoe78-prototype .spec-dot{color:#b8b3aa;font-size:13px;line-height:1}

.svoe78-prototype .actions{position:absolute;right:15px;top:15px;display:flex;gap:8px;z-index:6}
.svoe78-prototype .actions>button{
  min-height:38px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(36,42,43,.08);
  border-radius:50px;
  padding:9px 13px;
  color:#242a2b;
  font-size:12px;
  font-weight:700;
  box-shadow:0 6px 22px rgba(21,24,25,.10);
  backdrop-filter:blur(8px);
}
.svoe78-prototype .actions>button:hover{background:#fff;border-color:#d1ad73}
.svoe78-prototype .actions>button[aria-pressed="true"]{
  border-color:#c69a55;
  background:#fffaf1;
  color:#7f5b27;
}

.svoe78-prototype .share-popover{
  position:absolute;
  right:108px;
  top:47px;
  width:238px;
  overflow:hidden;
  border:1px solid #ddd9d0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 18px 48px rgba(25,29,30,.16);
  padding:6px;
}
.svoe78-prototype .share-popover[hidden]{display:none}
.svoe78-prototype .share-popover button{
  display:block;
  width:100%;
  border:0;
  border-radius:8px;
  background:#fff;
  padding:10px 11px;
  text-align:left;
  color:#242a2b;
}
.svoe78-prototype .share-popover button:hover{background:#f6f2ea}
.svoe78-prototype .share-popover span{display:block;font-size:12px;font-weight:750}
.svoe78-prototype .share-popover small{display:block;margin-top:2px;color:#7b8180;font-size:10px}

.svoe78-prototype .floating{
  display:flex;
  align-items:center;
  gap:9px;
  position:fixed;
  bottom:20px;
  right:20px;
  background:#fff;
  border:1px solid #ddd9d0;
  border-radius:40px;
  padding:10px 11px 10px 15px;
  color:#242a2b;
  box-shadow:0 8px 28px rgba(25,29,30,.13);
  z-index:90;
  font-size:12px;
  font-weight:750;
}
.svoe78-prototype .floating b{
  display:grid;
  place-items:center;
  min-width:25px;
  height:25px;
  padding:0 6px;
  border-radius:999px;
  background:#242a2b;
  color:#fff;
  font-size:11px;
}
.svoe78-prototype .floating:hover{border-color:#c69a55}

.svoe78-prototype .favorites-backdrop{
  position:fixed;
  inset:0;
  z-index:10020;
  background:rgba(26,30,31,.44);
  backdrop-filter:blur(2px);
}
.svoe78-prototype .favorites-backdrop[hidden]{display:none}
.svoe78-prototype .favorites-drawer{
  position:absolute;
  right:0;
  top:0;
  width:min(430px,100%);
  height:100%;
  display:flex;
  flex-direction:column;
  background:#fbfaf7;
  box-shadow:-20px 0 60px rgba(17,20,21,.18);
}
.svoe78-prototype .favorites-drawer__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding:26px 26px 21px;
  border-bottom:1px solid #e2dfd8;
}
.svoe78-prototype .drawer-kicker{
  color:#9a6d2d;
  font-size:10px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.svoe78-prototype .favorites-drawer__head h2{margin:4px 0 0;font-size:29px;letter-spacing:-.035em}
.svoe78-prototype .favorites-drawer__head button{
  width:38px;height:38px;border:1px solid #ddd9d0;border-radius:999px;background:#fff;
  font-size:23px;line-height:1;color:#343a3b
}
.svoe78-prototype .favorites-drawer__body{flex:1;overflow:auto;padding:10px 26px 26px}
.svoe78-prototype .favorites-empty{margin:30px 0;color:#737978;font-size:13px;line-height:1.65}
.svoe78-prototype .favorite-card{
  display:grid;
  grid-template-columns:92px minmax(0,1fr) auto;
  gap:13px;
  align-items:center;
  padding:15px 0;
  border-bottom:1px solid #e3e0d9;
}
.svoe78-prototype .favorite-card img{
  width:92px;height:65px;object-fit:cover;border-radius:8px;background:#e9e6df
}
.svoe78-prototype .favorite-card__name{display:block;color:#242a2b;text-decoration:none;font-size:15px;font-weight:800}
.svoe78-prototype .favorite-card__meta{display:block;margin-top:5px;color:#7b8180;font-size:10px}
.svoe78-prototype .favorite-card button{border:0;background:none;color:#8a8f8e;font-size:20px;padding:6px}
.svoe78-prototype .favorites-drawer__foot{padding:18px 26px;border-top:1px solid #e2dfd8;background:#fff}
.svoe78-prototype .favorites-drawer__foot a{
  color:#242a2b;text-decoration:none;font-size:12px;font-weight:750;
  text-decoration-line:underline;text-decoration-color:#c69a55;text-underline-offset:4px
}

@media(max-width:550px){
  .svoe78-prototype .share-popover{right:0;top:45px;width:min(260px,calc(100vw - 60px))}
  .svoe78-prototype .spec{gap:6px;font-size:11px}
  .svoe78-prototype .favorite-card{grid-template-columns:78px minmax(0,1fr) auto}
  .svoe78-prototype .favorite-card img{width:78px;height:56px}
}

/* ==========================================================
   PROJECT CARD MASTER V4 — VISUAL V1.3 / A5.3 CANON
   Source: SVOE_PROJECT_CARD_VISUAL_V1_3_A5_3
   ========================================================== */
.svoe78-prototype{
  --pc-bg:#fcfbf8;
  --pc-text:#25342d;
  --pc-sub:#738078;
  --pc-card:#f8f6f0;
  --pc-line:#e2ded5;
  --pc-gold:#ae8a51;
  --pc-cta:#253b30;
}
.svoe78-prototype .project{
  background:var(--pc-bg);
  color:var(--pc-text);
  border:1px solid #e3dfd6;
  border-radius:17px;
  padding:27px 28px;
  box-shadow:0 6px 26px rgba(30,44,35,.045);
}
.svoe78-prototype .project h1{
  font-size:41px;
  line-height:1.08;
  letter-spacing:-.047em;
  font-weight:740;
  margin:10px 0 17px;
}
.svoe78-prototype .project .eyebrow{
  color:var(--pc-gold);
  letter-spacing:.12em;
  font-size:10px;
  font-weight:700;
}
.svoe78-prototype .project .area b{font-size:26px;font-weight:750}
.svoe78-prototype .project .small{color:var(--pc-sub)}
.svoe78-prototype .spec{
  margin:10px 0 18px;
  color:var(--pc-sub);
  font-size:13px;
  gap:8px;
}
.svoe78-prototype .spec-dot{color:#b9b4aa}
.svoe78-prototype .fieldlabel{
  color:#8f6b37;
  text-transform:none;
  letter-spacing:.02em;
  font-size:12px;
  font-weight:700;
  margin:15px 0 7px;
}
.svoe78-prototype .native-shadow{display:none!important}
.svoe78-prototype .premium-combobox{position:relative;z-index:14}
.svoe78-prototype .combo-trigger{
  width:100%;min-height:48px;display:flex;justify-content:space-between;align-items:center;gap:12px;
  text-align:left;background:#fff;border:1px solid #ddd9d0;border-radius:8px;padding:11px 14px;
  color:var(--pc-text);font-weight:500;transition:background .16s,border-color .16s,box-shadow .16s;
}
.svoe78-prototype .combo-trigger:hover{border-color:#ab966e;background:#fffdfa}
.svoe78-prototype .combo-trigger[aria-expanded="true"]{border-color:#ad915e;background:#fff;box-shadow:0 0 0 1px rgba(173,145,94,.08)}
.svoe78-prototype .combo-options{
  position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid #ddd6c9;
  border-radius:10px;box-shadow:0 14px 32px rgba(23,37,27,.14);padding:6px;max-height:300px;overflow:auto;z-index:25;
}
.svoe78-prototype .combo-options[hidden]{display:none}
.svoe78-prototype .combo-option{
  width:100%;display:flex;align-items:center;text-align:left;gap:10px;border:0!important;border-radius:6px;
  background:transparent;color:#28362e;padding:11px 10px;min-height:43px;font:inherit;cursor:pointer;
}
.svoe78-prototype .combo-option:hover,.svoe78-prototype .combo-option.keyboard{background:#f6f1e8}
.svoe78-prototype .combo-option[aria-selected="true"]{background:#f5efe4;font-weight:650}
.svoe78-prototype .combo-option .gold-marker{width:3px;height:21px;background:transparent;border-radius:2px;flex:none}
.svoe78-prototype .combo-option[aria-selected="true"] .gold-marker{background:#b08d53}
.svoe78-prototype .combo-option .check{margin-left:auto;color:#9d7a3f;font-weight:800;visibility:hidden}
.svoe78-prototype .combo-option[aria-selected="true"] .check{visibility:visible}
.svoe78-prototype .paynav{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;background:transparent;border-radius:0;padding:0;
}
.svoe78-prototype .paynav.is-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.svoe78-prototype .paynav button{
  border:1px solid #e1ded6;background:#fff;color:var(--pc-text);padding:11px 3px;border-radius:7px;
  font-size:12px;font-weight:600;min-width:0;transition:background .17s,border-color .17s,color .17s;
}
.svoe78-prototype .paynav button:hover{background:#f5f0e5;border-color:#d7cdbb}
.svoe78-prototype .paynav button.active{
  background:#f5f0e6;border:1px solid #b99359;box-shadow:none;font-weight:720;
}
.svoe78-prototype .pricebox{
  background:#f6f2e9;border:0;border-radius:10px;padding:20px 18px;margin:16px 0 0;min-height:112px;
}
.svoe78-prototype .pricebox.dark{background:#27302d;color:#fff}
.svoe78-prototype .value{font-size:37px;font-weight:770;letter-spacing:-.05em;color:#25382e;margin:6px 0 8px}
.svoe78-prototype .pricebox.dark .value{color:#fff}
.svoe78-prototype .green{font-size:13px;color:#477353;font-weight:700}
.svoe78-prototype .project .btn.cta{
  border-radius:8px;padding:15px;font-weight:720;background:var(--pc-cta);transition:background .18s,transform .1s;
}
.svoe78-prototype .project .btn.cta:hover{background:#344b3c}
.svoe78-prototype .project .btn.cta:active{transform:translateY(1px)}
.svoe78-prototype :is(.combo-trigger,.combo-option,.paynav button,.project .btn.cta):focus-visible{
  outline:2px solid #2c677c;outline-offset:3px;
}
/* canonical gallery selection: quiet 1px gold, never a heavy ring */
.svoe78-prototype .thumbs button{border:1px solid transparent;opacity:.95;transition:opacity .16s,border-color .16s,box-shadow .16s}
.svoe78-prototype .thumbs button:hover{opacity:1}
.svoe78-prototype .thumbs button.active{border-color:#af915c;opacity:1;box-shadow:0 0 0 1px rgba(175,145,92,.10)}
/* share popover uses the same brand marks as the global footer */
.svoe78-prototype .share-popover{width:252px;padding:10px;right:102px;top:48px;z-index:30}
.svoe78-prototype .share-popover__title{padding:4px 10px 8px;font-size:12px;font-weight:800;color:#303a34}
.svoe78-prototype .share-popover .share-entry{
  display:flex;align-items:center;gap:12px;min-height:46px;padding:10px 11px;font-size:14px;border:0;background:#fff;width:100%;text-align:left;border-radius:7px;
}
.svoe78-prototype .share-popover .share-entry:hover{background:#f5f2ec}
.svoe78-prototype .share-popover .share-entry span{display:inline;font-size:13px;font-weight:650}
.svoe78-prototype .share-brand-icon{width:21px;height:21px;display:block;flex:0 0 21px}
.svoe78-prototype .share-copy-icon{color:#56615b}
/* favorites: selected state is restrained, not a gold pill */
.svoe78-prototype .actions>button[aria-pressed="true"]{border-color:#c4ae87;background:rgba(255,255,255,.98);color:#5f4b2b;box-shadow:0 6px 22px rgba(21,24,25,.10)}
@media(max-width:550px){
  .svoe78-prototype .project{padding:20px 17px}
  .svoe78-prototype .project h1{font-size:36px}
  .svoe78-prototype .value{font-size:32px}
  .svoe78-prototype .combo-options{max-height:45vh}
  .svoe78-prototype .share-popover{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;border-radius:18px 18px 0 0;padding:18px 18px 28px;box-shadow:0 -8px 40px #0003}
}
