.cost-of-living-calculator{--col-orange: #e67e22;--col-text: hsl(25 12% 18%);--col-muted: #6b6b6b;--col-line: hsl(32 14% 88%);--col-field-border: hsl(32 14% 84%);--col-field-border-hover: hsl(32 12% 76%);background:var(--color-surface);border-radius:16px;padding:1.5rem 1.5rem 1.25rem;box-shadow:0 1px 3px #261d1714;border:1px solid var(--col-line)}.col-calc__title{margin:0;font-size:clamp(1.5rem,2.4vw,2rem);font-weight:700;color:var(--col-text);letter-spacing:-.02em}.col-calc__subtitle{margin:.5rem 0 1.25rem;color:#5f554e;font-size:.95rem;line-height:1.6;max-width:60ch}.col-calc__eurostat-badge{margin:0;padding:.55rem .75rem;font-size:.8125rem;line-height:1.45;color:#6b5f57;background:#f8f6f1;border:1px solid hsl(32 18% 88%);border-radius:10px}.calculator-form{display:flex;flex-direction:column;gap:1.1rem;margin-bottom:1.25rem}.col-inputs-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.city-selector,.income-input,.family-size{display:flex;flex-direction:column;gap:.5rem}.col-city-combobox{position:relative}.col-city-suggestions{position:absolute;z-index:20;top:calc(100% + 4px);left:0;right:0;margin:0;padding:.35rem;list-style:none;max-height:240px;overflow-y:auto;background:var(--color-surface);border:1px solid var(--col-field-border);border-radius:12px;box-shadow:0 12px 24px -12px #261d1740}.col-city-suggestions[hidden]{display:none!important}.col-city-suggestions__item{display:block;width:100%;text-align:left;border:0;background:transparent;padding:.55rem .65rem;border-radius:8px;font-size:.875rem;color:var(--col-text);cursor:pointer}.col-city-suggestions__item:hover,.col-city-suggestions__item.is-active{background:color-mix(in srgb,var(--col-orange) 12%,var(--color-surface))}.col-city-suggestions__empty{padding:.65rem;font-size:.8125rem;color:var(--col-muted)}.col-field-label{font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#696059}.col-field-control,.cost-of-living-calculator .form-group input,.cost-of-living-calculator .form-group select,.cost-of-living-calculator .form-group textarea{width:100%;min-height:46px;padding:.65rem .9rem;border-radius:12px;font-size:.9375rem;font-weight:500;background-color:#fefefd!important;color:#28231f!important;color-scheme:light;border-width:1px;border-style:solid;border-color:var(--col-field-border);box-shadow:0 1px 2px #261d170d;background-clip:padding-box;transition:border-color .2s,box-shadow .2s,background-color .2s}.cost-of-living-calculator select.col-field-control,.cost-of-living-calculator input.col-field-control{border:1px solid var(--col-field-border)!important}.cost-of-living-calculator .col-field-control:hover{border-color:var(--col-field-border-hover)!important;background-color:#fff!important}.cost-of-living-calculator select.col-field-control{appearance:none;-webkit-appearance:none;padding-right:2.5rem;cursor:pointer;background-color:#fefefd!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235c5c5c' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .7rem center;background-size:18px 18px}.cost-of-living-calculator select.col-field-control option{color:#28231f;font-weight:500;background-color:#fff}.cost-of-living-calculator select.col-field-control option[value=""]{color:#7c746e}.col-field-control:focus{outline:none;border-color:var(--col-orange)!important;background-color:#fff!important;box-shadow:0 1px 2px #261d170f,0 0 0 2px color-mix(in srgb,var(--col-orange) 22%,transparent)}.cost-of-living-calculator select.col-field-control:focus{background-color:#fff!important}.cost-of-living-calculator input.col-field-control::placeholder{color:#7c746e;font-weight:500}.comparison-results{background:transparent;border:none;border-radius:0;padding:0;margin-bottom:1.25rem}.comparison-summary{display:flex;flex-direction:column;gap:1.5rem}.cities-container{display:grid;grid-template-columns:1fr 1fr;gap:.875rem}.city-card{background:var(--color-surface);border:1px solid var(--col-line);border-radius:14px;padding:1.25rem 1.25rem 1.45rem;box-shadow:0 1px 2px #261d170a}.city-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.85rem}.city-flag{font-size:1.35rem;line-height:1}.city-header h4{margin:0;font-size:1rem;font-weight:700;color:var(--col-text)}.city-content{display:flex;flex-direction:column;gap:.35rem}.cost-row{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem}.cost-label{font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#847971}.cost-amount{font-size:clamp(2rem,4.8vw,2.65rem);font-weight:800;letter-spacing:-.03em;color:#29231f}.cost-breakdown small{font-size:.75rem;color:#847971;line-height:1.4}.col-balance{display:flex;justify-content:space-between;align-items:center;margin-top:.55rem;padding:.15rem 0;border-radius:0;font-weight:500;font-size:.8rem;border:0;background:transparent}.col-balance--surplus,.col-balance--deficit{color:var(--col-text)}.col-balance__label{display:inline-flex;align-items:center;gap:.35rem;color:#847971}.col-balance__warn{width:16px;height:16px;flex-shrink:0;stroke-width:2.25px}.col-balance__amt{font-weight:800;font-size:.95rem;color:#29231f}.col-balance--surplus .col-balance__amt{color:#257e46}.col-balance--deficit .col-balance__amt{color:#b12525}.col-insight{display:flex;align-items:flex-start;gap:.85rem;margin-top:.5rem;padding:1rem 1.1rem;border-radius:12px}.col-insight__ic{flex-shrink:0;color:var(--col-orange)}.col-insight__ic svg{width:26px;height:26px;stroke-width:2.25px}.col-insight--gain{background:#edf7f1;border:1px solid hsl(142 35% 78%)}.col-insight--gain .col-insight__ic{color:#297a47}.col-insight--pain{background:#fff7f0;border:1px solid color-mix(in srgb,var(--col-orange) 45%,var(--col-line))}.col-insight--pain .col-insight__ic{color:var(--col-orange)}.col-insight--neutral{background:#f9f6eb;border:1px solid hsl(45 45% 82%)}.col-insight--neutral .col-insight__ic,.col-insight--neutral .col-insight__kicker{color:#8e6429}.col-insight--neutral .col-insight__text{color:#6b4f2e}.col-insight__kicker{font-size:.6875rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.2rem}.col-insight--gain .col-insight__kicker{color:#2a6f43}.col-insight--pain .col-insight__kicker{color:var(--col-orange)}.col-insight__text{font-size:.9375rem;font-weight:600;line-height:1.45;color:var(--col-text)}.col-insight--pain .col-insight__text{color:#964f2c}.col-insight--gain .col-insight__text{color:#285d3b}.affordability-section{padding:1rem 1.1rem;background:#fcfcfc;border:1px solid var(--col-line);border-radius:12px}.affordability-section h5{margin:0 0 .75rem;font-size:.625rem;font-weight:700;color:var(--col-muted);text-transform:uppercase;letter-spacing:.08em}.affordability-comparison{display:flex;flex-direction:column;gap:.75rem}.affordability-item{display:flex;align-items:center;gap:.65rem}.affordability-section .city-label{min-width:100px;font-size:.8125rem;font-weight:600;color:var(--col-text)}.affordability-bar{flex:1;height:8px;background:#f0f0f0;border-radius:999px;overflow:hidden;border:1px solid var(--col-line);margin-top:.2rem}.affordability-fill{height:100%;border-radius:999px;transition:width .45s ease}.affordability-percent{min-width:48px;text-align:right;font-size:.75rem;font-weight:700;color:var(--col-text)}.affordability-inline{margin-top:.85rem;padding-top:.45rem;padding-bottom:.25rem;border-top:1px solid color-mix(in srgb,var(--col-line) 70%,transparent)}.affordability-inline__top{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.45rem;font-size:.72rem;color:#847971;font-weight:600}.affordability-inline__top>span:last-child{color:#29231f;font-weight:700}.detailed-breakdown{margin:0 0 1rem;background:#f7f5f3;border:1px solid hsl(32 16% 86%);border-radius:14px;padding:1rem}.col-breakdown__title{margin:0 0 1rem;font-size:1rem;font-weight:700;color:var(--col-text)}.breakdown-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.875rem}.expense-category{background:var(--color-surface);border:1px solid var(--col-line);border-radius:12px;padding:.95rem}.category-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.65rem;font-weight:600;font-size:.9375rem;color:var(--col-text)}.category-sub{display:block;margin-top:.15rem;font-size:.72rem;color:#746a63;font-weight:500}.category-icon{display:flex;color:var(--col-orange)}.category-icon svg{width:18px;height:18px;stroke-width:2.25px}.cost-comparison{display:flex;flex-direction:column;gap:.45rem}.cost-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;padding:.35rem 0;background:transparent;border-radius:0;border:0;border-bottom:1px dashed color-mix(in srgb,var(--col-line) 85%,transparent)}.cost-item:last-child{border-bottom:0}.city-name{font-size:.8125rem;color:color-mix(in srgb,var(--col-text) 82%,var(--col-muted));font-weight:600}.cost-value{font-weight:700;font-size:.875rem;color:var(--col-text)}.expense-diff{margin-top:.6rem;margin-left:auto;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:.3rem .7rem;font-size:.8rem;font-weight:700;border:1px solid transparent;width:fit-content}.expense-diff--up{color:#b12525;background:#fbe4e4;border-color:#edb6b6}.expense-diff--down{color:#2d7648;background:#dff6e8;border-color:#b5e3c6}.expense-diff--eq{color:#605852;background:#efece7;border-color:#d8d2ca}.col-methodology{margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--col-line);max-width:40rem;margin-left:auto;margin-right:auto;text-align:center}.col-methodology__link{margin:0;padding:0;border:none;background:none;font:inherit;font-size:.8125rem;font-weight:600;color:var(--col-orange);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.col-methodology__link:hover{color:color-mix(in srgb,var(--col-orange) 85%,var(--col-text))}.col-methodology--accordion .col-methodology__link{list-style:none;text-decoration:none;display:inline-flex;align-items:center;gap:.35rem}.col-methodology--accordion .col-methodology__link::-webkit-details-marker{display:none}.col-methodology__panel{margin-top:.75rem;text-align:left;font-size:.8125rem;color:#635b54;line-height:1.55}.col-methodology__panel p{margin:0}.col-methodology__panel ul{margin:.5rem 0 0;padding-left:1rem}.col-methodology__link:focus-visible{outline:2px solid var(--col-orange);outline-offset:3px;border-radius:4px}.col-method-modal[hidden]{display:none!important}.col-method-modal:not([hidden]){position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:1rem}.col-method-modal__backdrop{position:absolute;inset:0;background:#0000008c;backdrop-filter:blur(4px)}.col-method-modal__dialog{position:relative;z-index:1;width:min(34rem,calc(100vw - 1.5rem));max-height:min(88vh,36rem);overflow:hidden;display:flex;flex-direction:column;background:var(--color-surface);border:1px solid var(--color-border);border-radius:1rem;box-shadow:0 25px 50px -12px #00000040}.col-method-modal__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1.15rem;border-bottom:1px solid var(--color-border)}.col-method-modal__title{margin:0;font-size:1.05rem;font-weight:700;color:var(--color-text);line-height:1.3}.col-method-modal__close{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;flex-shrink:0;border:1px solid var(--color-border);background:var(--color-surface-2);font-size:1.35rem;line-height:1;cursor:pointer;color:var(--color-text-muted);border-radius:.65rem}.col-method-modal__close:hover{color:var(--color-text);background:var(--color-surface-offset)}.col-method-modal__body{padding:1.1rem 1.15rem 1.2rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.col-method-modal__lead{margin:0 0 .85rem;font-size:.9rem;line-height:1.55;color:var(--color-text)}.col-method-modal__note{margin:0 0 .65rem;font-size:.84rem;line-height:1.5;color:var(--color-text)}.col-method-modal__note--muted{color:var(--color-text-muted);font-size:.8rem}.col-method-modal__technical{margin-top:.5rem;padding-top:.65rem;border-top:1px solid var(--color-border)}.col-method-modal__technical summary{cursor:pointer;font-size:.8rem;font-weight:600;color:var(--col-orange);list-style:none}.col-method-modal__technical summary::-webkit-details-marker{display:none}.col-method-modal__technical p{margin:.65rem 0 0;font-size:.76rem;line-height:1.5;color:var(--color-text-muted)}.col-method-modal__links-label{margin:.75rem 0 .35rem;font-size:.76rem;font-weight:600;color:var(--color-text)}.col-method-modal__links{margin:0;padding-left:1.1rem;font-size:.76rem;line-height:1.55;color:var(--color-text-muted)}.col-method-modal__links a{color:var(--col-orange);text-decoration:underline;text-underline-offset:2px}.col-feedback-callout{margin-top:var(--space-4);margin-bottom:var(--space-4);display:grid;grid-template-columns:auto 1fr auto;gap:var(--space-3);align-items:center;padding:var(--space-4);border-radius:var(--radius-lg);border:1px solid color-mix(in srgb,var(--color-primary) 20%,var(--color-border));background:color-mix(in srgb,var(--color-primary) 6%,var(--color-surface))}.col-feedback-callout__icon{width:40px;height:40px;display:grid;place-items:center;border-radius:999px;background:var(--color-surface);border:1px solid var(--color-border);font-size:1.2rem}.col-feedback-callout__text{margin:0;color:var(--color-text);font-size:var(--text-sm);line-height:1.5}.col-feedback-callout__cta{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:.55rem .9rem;border-radius:999px;border:1px solid color-mix(in srgb,var(--color-primary) 40%,var(--color-border));background:var(--color-surface);color:var(--color-primary);font-weight:600;text-decoration:none;font-size:var(--text-sm)}.col-feedback-callout__cta:hover{text-decoration:none;border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 8%,var(--color-surface))}@media(max-width:820px){.col-feedback-callout{grid-template-columns:1fr;text-align:left}}.col-comparison-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem 1rem;text-align:center;color:var(--col-muted)}.col-comparison-loading p{margin:0;font-size:.9rem;max-width:22rem;line-height:1.45}.col-loading-spinner{width:36px;height:36px;border:3px solid var(--col-line);border-top-color:var(--col-orange);border-radius:50%;animation:col-spin .75s linear infinite}@keyframes col-spin{to{transform:rotate(360deg)}}.col-comparison-error{padding:1.25rem 1.35rem;background:var(--color-surface);border:1px solid var(--col-line);border-radius:10px;border-left:4px solid hsl(0 65% 50%)}.col-comparison-error p{margin:0;font-size:.9rem;line-height:1.45;color:var(--col-text)}.result-placeholder{text-align:center;padding:1.5rem 1rem;color:var(--col-muted)}.result-placeholder p{margin:.5rem 0 0;font-size:.9rem;line-height:1.45}html[data-theme=dark] .cost-of-living-calculator{--col-text: hsl(30 15% 92%);--col-muted: hsl(25 8% 62%);--col-line: hsl(25 10% 22%);--col-field-border: hsl(25 8% 32%);--col-field-border-hover: hsl(25 8% 42%)}html[data-theme=dark] .col-field-label{color:#bdb7b2}html[data-theme=dark] .col-field-control{background-color:#1f1b19!important;color:#eeebe8!important;box-shadow:0 1px 2px #0003}html[data-theme=dark] .cost-of-living-calculator select.col-field-control,html[data-theme=dark] .cost-of-living-calculator input.col-field-control{border:1px solid var(--col-field-border)!important}html[data-theme=dark] .cost-of-living-calculator .col-field-control:hover{border-color:var(--col-field-border-hover)!important;background-color:#272320!important}html[data-theme=dark] .cost-of-living-calculator select.col-field-control{background-color:#1f1b19!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23c4c4c4' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-size:18px 18px}html[data-theme=dark] .cost-of-living-calculator select.col-field-control option{background-color:#221e1b;color:#eeebe8}@media(max-width:768px){.col-inputs-grid,.cities-container{grid-template-columns:1fr}.cost-amount{font-size:1.5rem}.breakdown-grid{grid-template-columns:1fr}}.cost-of-living-calculator{--tool-radius: 16px;--tool-radius-sm: 12px;--tool-border: color-mix(in srgb, var(--color-border) 88%, #cfd5dd);--tool-shadow: 0 6px 16px -14px rgba(17, 24, 39, .45)}.cost-of-living-calculator .city-card,.cost-of-living-calculator .expense-category,.cost-of-living-calculator .affordability-section,.cost-of-living-calculator .col-feedback-callout{border-radius:var(--tool-radius);border-color:var(--tool-border);box-shadow:var(--tool-shadow);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.cost-of-living-calculator .city-card:hover,.cost-of-living-calculator .expense-category:hover{transform:translateY(-1px);box-shadow:0 12px 20px -18px #1118278c;border-color:color-mix(in srgb,var(--color-primary) 24%,var(--tool-border))}.cost-of-living-calculator .col-comparison-loading,.cost-of-living-calculator .col-comparison-error,.cost-of-living-calculator .result-placeholder{border-radius:var(--tool-radius);border:1px solid var(--tool-border);background:color-mix(in srgb,var(--color-surface) 95%,#f7f8fa);padding:1rem 1.1rem}.cost-of-living-calculator .col-comparison-error{border-color:color-mix(in srgb,var(--color-danger) 36%,var(--tool-border));background:color-mix(in srgb,var(--color-danger) 8%,var(--color-surface))}.cost-of-living-calculator .result-placeholder p,.cost-of-living-calculator .col-comparison-loading p,.cost-of-living-calculator .col-comparison-error p{margin:0;color:var(--color-text-muted);line-height:1.5}.cost-of-living-calculator .col-loading-spinner{width:20px;height:20px;border:2px solid color-mix(in srgb,var(--tool-border) 78%,transparent);border-top-color:var(--color-primary);border-radius:999px;animation:col-spin .9s linear infinite}@keyframes col-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.cost-of-living-calculator .col-field-control:focus-visible{outline:none;box-shadow:0 0 0 1px var(--color-primary),0 0 0 4px color-mix(in srgb,var(--color-primary) 18%,transparent)}@media(max-width:768px){.cost-of-living-calculator .col-calc__title{font-size:1rem;line-height:1.3}.cost-of-living-calculator .city-header h4{font-size:.92rem;line-height:1.3}.cost-of-living-calculator .cost-amount{font-size:clamp(1.28rem,8vw,1.7rem);line-height:1.12}.cost-of-living-calculator .col-insight__text,.cost-of-living-calculator .col-method-modal__lead{line-height:1.6}}html[data-theme=dark] .cost-of-living-calculator{--tool-border: color-mix(in srgb, var(--color-border) 80%, #3a3f47);--tool-shadow: 0 8px 18px -16px rgba(0, 0, 0, .75)}
