/* =========================================================
   JACOB PORTFOLIO VISUAL EDITOR V20
   Editor UI is local-only. Custom block styles remain useful
   in the normal/public site without the sidebar.
   ========================================================= */

.editor-core-hidden{display:none!important}

/* Builder content that is part of the actual site */
.jb-block{box-sizing:border-box;position:relative;clear:both}
.jb-block > :first-child{margin-top:0}.jb-block > :last-child{margin-bottom:0}
.jb-text-card{padding:24px;border-radius:10px;background:rgba(255,255,255,.32);border:1px solid rgba(17,21,27,.08)}
.jb-text-card p{margin:0;color:#536174;line-height:1.7}
.jb-grid{display:grid;gap:22px}.jb-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.jb-figure{margin:0}.jb-figure figcaption{font:10px var(--mono);letter-spacing:.08em;color:#697587;margin-top:9px}
.jb-photo{min-height:320px;border-radius:10px;background:#cfd4da;border:1px solid rgba(17,21,27,.08)}
.jb-divider{height:var(--jb-divider-thickness,1px);background:var(--line);width:var(--jb-divider-width,100%);margin-left:auto;margin-right:auto;min-height:1px}
.jb-spacer{height:64px;width:100%}
.jb-section{padding:0;border-top:0}.jb-section-divider{margin-bottom:34px}.jb-section p{color:#536174;max-width:780px}
.jb-hidden-by-editor{display:none!important}

@media(max-width:760px){.jb-grid-2{grid-template-columns:1fr}.jb-photo{min-height:250px}}

/* Local editor shell */
body.editor-v11-open{background:#11151b!important;overflow-x:hidden}
body.editor-v11-open .editor-v11-stage{margin-left:330px;min-height:100vh;padding:22px 24px 50px;background:#11151b;overflow:auto}
.editor-v11-canvas{position:relative;margin:0 auto;background:var(--paper);min-height:calc(100vh - 44px);box-shadow:0 18px 70px rgba(0,0,0,.45);transition:width .22s ease,max-width .22s ease;border-radius:4px;overflow:visible}
.editor-v11-canvas.jb-preview-desktop{width:100%;max-width:1600px}
.editor-v11-canvas.jb-preview-tablet{width:820px;max-width:calc(100vw - 385px)}
.editor-v11-canvas.jb-preview-phone{width:390px;max-width:calc(100vw - 385px)}

.editor-v11-sidebar{position:fixed;inset:0 auto 0 0;width:330px;z-index:12000;background:#171c22;color:#eef1f5;border-right:1px solid rgba(255,255,255,.09);box-shadow:14px 0 35px rgba(0,0,0,.24);overflow-y:auto;padding:18px 16px 30px;font-family:var(--sans)}
.editor-v11-sidebar *{box-sizing:border-box}
.jb-sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;padding:4px 2px 14px;border-bottom:1px solid rgba(255,255,255,.09)}
.jb-sidebar-head strong{display:block;font-size:17px;letter-spacing:-.02em}.jb-sidebar-head span{display:block;color:#8794a4;font:9px var(--mono);text-transform:uppercase;letter-spacing:.12em;margin-top:3px}
.jb-save-dot{width:9px!important;height:9px!important;border-radius:50%;background:#60d394;box-shadow:0 0 0 4px rgba(96,211,148,.12);flex:none}
.jb-section-title{margin:19px 2px 9px;color:#7f8b9a;font:9px var(--mono);letter-spacing:.16em;text-transform:uppercase}
.jb-field{display:block;margin:11px 0}.jb-field.compact{margin:0 0 12px}.jb-field>span{display:flex;justify-content:space-between;gap:10px;margin-bottom:7px;color:#c8d0da;font:10px var(--mono);letter-spacing:.06em}.jb-field b{color:#ff6a28;font-weight:600}
.jb-field select,.jb-field input[type=number],.jb-field input[type=text]{width:100%;border:1px solid rgba(255,255,255,.13);background:#232a33;color:#eef1f5;border-radius:7px;padding:9px 10px;font:11px var(--mono)}
.jb-field input[type=range]{width:100%;accent-color:var(--orange)}
.jb-preview-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.jb-preview-switch button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:9px 4px!important}.jb-preview-switch button span{font-size:8px}
.editor-v11-sidebar button{appearance:none;border:1px solid rgba(255,255,255,.12);background:#242b34;color:#e8edf3;border-radius:7px;padding:9px 10px;font:10px var(--mono);letter-spacing:.055em;cursor:pointer;transition:.14s ease}
.editor-v11-sidebar button:hover{border-color:rgba(255,79,0,.72);background:#2b333d}.editor-v11-sidebar button.active{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange)}
.editor-v11-sidebar button.primary{background:var(--orange);border-color:var(--orange);color:#151719;font-weight:800}.editor-v11-sidebar button.danger{color:#ffb2a0;border-color:rgba(255,110,80,.3)}
.jb-main-actions{display:grid;grid-template-columns:1.35fr .65fr;gap:7px;margin-top:13px}.jb-main-actions button{min-height:38px}
.jb-status{margin-top:7px;padding:7px 9px;border-radius:6px;background:#11161c;color:#92a1b2;font:9px var(--mono);min-height:28px;display:flex;align-items:center}
.jb-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:18px 0 12px;padding-top:15px;border-top:1px solid rgba(255,255,255,.08)}
.jb-tabs button{background:transparent}.jb-tab{display:none}.jb-tab.active{display:block}
.jb-add-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.jb-add-grid button{min-height:62px;display:flex;align-items:center;text-align:left;gap:10px}.jb-add-grid button b{width:22px;color:var(--orange);font-size:17px;text-align:center}.jb-add-grid button span{font-size:9px;line-height:1.25}
.jb-help,.jb-muted{color:#8290a0;font-size:10px;line-height:1.55}.jb-help{margin:10px 2px 0}
.jb-empty{padding:16px 11px;border:1px dashed rgba(255,255,255,.16);border-radius:8px;color:#8997a7;font-size:11px;line-height:1.55}
.jb-selected-title{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;margin-bottom:8px;border-radius:7px;background:#11161c}.jb-selected-title span{font-size:11px;font-weight:700}.jb-selected-title code{font-size:8px;color:#8290a0;max-width:120px;overflow:hidden;text-overflow:ellipsis}
.jb-row-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0}.jb-row-buttons:has(button:nth-child(2):last-child){grid-template-columns:1fr 1fr}
.jb-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.jb-seg button{padding:7px 4px}
.jb-wide{width:100%;margin:0 0 7px;text-align:left}.jb-hidden-list{display:grid;gap:5px}.jb-hidden-list button{text-align:left;font-size:8px;padding:7px}

/* Selection and alignment guides */
body.editor-v11-editing .editor-v11-canvas [data-edit-key]:hover{outline:1px dashed rgba(255,79,0,.55);outline-offset:3px;cursor:text}
body.editor-v11-editing .editor-v11-canvas .jb-selected{outline:2px solid #4bb6ff!important;outline-offset:5px!important;box-shadow:0 0 0 7px rgba(75,182,255,.10)}
body.editor-v11-editing .editor-v11-canvas .jb-block{min-height:18px}
body.editor-v11-editing .editor-v11-canvas .jb-block:hover:after{content:"BLOCK";position:absolute;right:2px;top:-18px;font:8px var(--mono);letter-spacing:.1em;color:#4bb6ff;background:#11161c;padding:3px 5px;border-radius:3px;z-index:10}
.jb-grid-guides{background-image:linear-gradient(to right,rgba(75,182,255,.09) 1px,transparent 1px);background-size:calc(100% / 12) 100%}
.jb-grid-guides .container{outline:1px dashed rgba(75,182,255,.28);outline-offset:-1px}

/* Photo editor moved away from old bottom controls */
body.editor-v11-open .photo-editor-panel{right:22px;bottom:22px;z-index:12010}

/* Simulated tablet responsive state inside the desktop browser */
.jb-preview-tablet .container{width:min(100% - 32px,1180px)!important}
.jb-preview-tablet .nav-inner{height:auto;padding:14px 0;align-items:flex-start}
.jb-preview-tablet .brand{flex-direction:column;align-items:flex-start;gap:2px}
.jb-preview-tablet .nav-links{gap:14px;flex-wrap:wrap;justify-content:flex-end}
.jb-preview-tablet .hero-grid,.jb-preview-tablet .project,.jb-preview-tablet .project.reverse,.jb-preview-tablet .skills-grid,.jb-preview-tablet .about-grid,.jb-preview-tablet .detail-grid,.jb-preview-tablet .about-page-hero-grid,.jb-preview-tablet .about-story-grid,.jb-preview-tablet .about-focus-grid,.jb-preview-tablet .about-project-grid{grid-template-columns:1fr!important}
.jb-preview-tablet .project.reverse .project-media,.jb-preview-tablet .project.reverse .project-copy{order:initial!important}
.jb-preview-tablet .hero-grid{gap:44px;padding:70px 0}.jb-preview-tablet .hero-art{min-height:340px}.jb-preview-tablet .skills-board{grid-template-columns:1fr}.jb-preview-tablet .skill:nth-child(odd){border-right:0}.jb-preview-tablet .detail-side{position:static}.jb-preview-tablet .section{padding:72px 0}.jb-preview-tablet .section-head{align-items:flex-start;flex-direction:column}.jb-preview-tablet .tvc-project-detail .detail-grid{grid-template-columns:1fr!important}.jb-preview-tablet .tvc-project-detail .detail-side{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* Simulated phone responsive state */
.jb-preview-phone .container{width:calc(100% - 28px)!important}
.jb-preview-phone .nav-inner{height:auto;padding:12px 0;align-items:flex-start}.jb-preview-phone .brand{flex-direction:column;align-items:flex-start;gap:1px}.jb-preview-phone .nav-links{display:none!important}
.jb-preview-phone .hero-grid,.jb-preview-phone .project,.jb-preview-phone .project.reverse,.jb-preview-phone .skills-grid,.jb-preview-phone .about-grid,.jb-preview-phone .detail-grid,.jb-preview-phone .about-page-hero-grid,.jb-preview-phone .about-story-grid,.jb-preview-phone .about-focus-grid,.jb-preview-phone .about-project-grid,.jb-preview-phone .tvc-gallery-2,.jb-preview-phone .tvc-gallery-3,.jb-preview-phone .tvc-gallery-4,.jb-preview-phone .tvc-data-grid,.jb-preview-phone .tvc-project-detail .detail-side,.jb-preview-phone .jb-grid-2{grid-template-columns:1fr!important}
.jb-preview-phone .project.reverse .project-media,.jb-preview-phone .project.reverse .project-copy{order:initial!important}
.jb-preview-phone .hero-grid{gap:30px;padding:48px 0}.jb-preview-phone .hero h1{font-size:52px!important}.jb-preview-phone .hero-art{min-height:290px}.jb-preview-phone .project-media{min-height:240px}.jb-preview-phone .section{padding:54px 0}.jb-preview-phone .section-head{align-items:flex-start;flex-direction:column;margin-bottom:34px}.jb-preview-phone h2{font-size:36px}.jb-preview-phone .page-hero h1{font-size:42px}.jb-preview-phone .tvc-main-image{min-height:360px}.jb-preview-phone .tvc-flight-section{margin-top:48px;padding-top:30px}.jb-preview-phone .tvc-result-section{padding:24px}.jb-preview-phone .contact h2{font-size:42px}

@media(max-width:760px){
  body.editor-v11-open .editor-v11-sidebar{width:280px}
  body.editor-v11-open .editor-v11-stage{margin-left:280px;padding:14px}
  .editor-v11-canvas.jb-preview-tablet,.editor-v11-canvas.jb-preview-phone{max-width:calc(100vw - 310px)}
}

/* V11 image library + three-column custom galleries */
.jb-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.editor-v11-sidebar .jb-tabs{grid-template-columns:repeat(4,1fr)}
.editor-v11-sidebar .jb-tabs button{padding-left:3px;padding-right:3px;font-size:9px}
.jb-asset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:10px}
.jb-asset{padding:0!important;overflow:hidden;text-align:left;min-height:90px;position:relative}
.jb-asset img{display:block;width:100%;height:82px;object-fit:cover;background:#0e1218}
.jb-asset span{display:block;padding:5px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#aab4c0;font-size:7px}
@media(max-width:760px){.jb-grid-3{grid-template-columns:1fr}}
.jb-preview-phone .jb-grid-3{grid-template-columns:1fr!important}

/* V12 history controls + persistent project-photo sync setting */
.jb-history-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:7px}
.jb-history-actions button{min-height:34px}
.editor-v11-sidebar button:disabled{opacity:.38;cursor:not-allowed;border-color:rgba(255,255,255,.08)!important;background:#20262e!important}
.jb-toggle-setting{display:flex;gap:10px;align-items:flex-start;margin:13px 0;padding:11px;border:1px solid rgba(255,255,255,.11);border-radius:8px;background:#20262e;cursor:pointer}
.jb-toggle-setting input{margin:3px 0 0;accent-color:var(--orange);flex:none}
.jb-toggle-setting span{display:block!important;margin:0!important;color:#d8dee6!important;font-family:var(--sans)!important;letter-spacing:0!important}
.jb-toggle-setting b{display:block;color:#eef1f5!important;font-size:10px;margin-bottom:4px}
.jb-toggle-setting small{display:block;color:#8e9aa8;font-size:9px;line-height:1.45}
body.editor-v11-editing .editor-v11-canvas [data-home-photo-synced="1"]:after{content:"SYNCED FROM HOME";position:absolute;left:8px;bottom:8px;z-index:7;padding:4px 6px;border-radius:4px;background:rgba(17,21,27,.82);color:#f3f5f7;font:8px var(--mono);letter-spacing:.08em;pointer-events:none}


/* V13 adjustable spacers + unified editable section dividers */
.jb-managed-break{border-top:0!important;position:relative}
.jb-managed-break:before{
  content:"";position:absolute;z-index:1;top:0;left:50%;transform:translateX(-50%);
  width:var(--jb-divider-width,100%);height:var(--jb-divider-thickness,1px);
  background:var(--jb-divider-color,var(--line));pointer-events:none;
}
body.editor-v11-editing .jb-managed-break:after{
  content:"SECTION DIVIDER";position:absolute;z-index:8;top:-10px;right:0;
  padding:2px 5px;border-radius:4px;background:rgba(17,21,27,.78);color:#eef1f5;
  font:7px var(--mono);letter-spacing:.08em;pointer-events:none;opacity:.72;
}
body.editor-v11-editing .jb-block-divider,
body.editor-v11-editing .jb-block-spacer{min-height:10px}
body.editor-v11-editing .jb-block-spacer{background:repeating-linear-gradient(135deg,rgba(255,79,0,.035),rgba(255,79,0,.035) 8px,transparent 8px,transparent 16px)}
body.editor-v11-editing .jb-block-spacer.jb-selected{background:repeating-linear-gradient(135deg,rgba(255,79,0,.09),rgba(255,79,0,.09) 8px,transparent 8px,transparent 16px)}
.jb-specific-control{padding:8px;border:1px solid rgba(255,79,0,.24);border-radius:7px;background:rgba(255,79,0,.045)}
.jb-divider-jump{margin:8px 0 10px!important;border-color:rgba(255,79,0,.38)!important;color:#ffd6c4!important}

/* V17 — explicit photo-frame sizing controls */
.editor-v11-sidebar .jb-photo-size-controls{
  margin:14px 0 10px;
  padding:12px;
  border:1px solid rgba(75,182,255,.25);
  border-radius:9px;
  background:rgba(75,182,255,.055);
}
.editor-v11-sidebar .jb-photo-size-controls .jb-section-title{margin-top:0;color:#83caff}
body.editor-v11-editing .editor-v11-canvas [data-photo-key]{
  transition:width .08s ease,height .08s ease,min-height .08s ease;
}


/* V18 — subtitles/subheaders + precise slider entry */
.jb-block-subheading .jb-subheading{
  margin:0;
  font-size:clamp(22px,2.4vw,30px);
  line-height:1.18;
  letter-spacing:-.025em;
  color:var(--ink);
}
.jb-block-subtitle .jb-subtitle{
  margin:0;
  max-width:820px;
  font-size:clamp(16px,1.7vw,20px);
  line-height:1.55;
  color:#667386;
}
.editor-v11-sidebar .jb-slider-pair{
  display:grid;
  grid-template-columns:minmax(0,1fr) 72px;
  gap:8px;
  align-items:center;
}
.editor-v11-sidebar .jb-slider-pair input[type=range]{min-width:0;width:100%}
.editor-v11-sidebar .jb-slider-pair input[type=number]{
  width:72px;
  padding:7px 6px;
  text-align:right;
  -moz-appearance:textfield;
}
.editor-v11-sidebar .jb-slider-pair input[type=number]::-webkit-outer-spin-button,
.editor-v11-sidebar .jb-slider-pair input[type=number]::-webkit-inner-spin-button{opacity:.55}

/* V24 */
.jb-block-kicker .jb-kicker{margin:0;color:#536174;font:10px var(--mono);letter-spacing:.14em;text-transform:uppercase}.jb-block-project-title .jb-project-title{margin:0;font-size:clamp(22px,2.2vw,30px);line-height:1.18;letter-spacing:-.025em;color:var(--ink)}.jb-block-project-subtitle .jb-project-subtitle{margin:0;color:#596576;font-size:16px;line-height:1.65;max-width:850px}.jb-block-current-project .current-item{padding:22px 0;border-bottom:1px solid var(--line)}body.editor-v11-editing figcaption[data-edit-key]{outline:1px dashed rgba(255,79,0,.45);outline-offset:3px;cursor:text}
