/* ARTISTASDELATIERRA — Obra V2 */

.obra-page {
    background:var(--adt-background-deep);
    color:var(--adt-text-soft);
}

/* Obra */
.obra-main {
    padding-block:58px 72px;
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
    gap:58px;
    align-items:start;
    border-bottom:1px solid var(--line);
}
.obra-main__image {
    display:block;
    background:#202020;
}
.obra-main__image img {
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    max-height:none;
}
.obra-main__info {
    padding-top:4px;
}
.obra-main__info h2 {
    font-size:clamp(25px,3.1vw,45px);
    font-weight:300;
    line-height:1.01;
    letter-spacing:-.04em;
    color:var(--adt-text-bright);
    margin:0 0 18px;
}
.obra-main__artist {
    display:inline-block;
    font-size:15px;
    color:#c7c7c7;
    margin-bottom:14px;
}
.obra-publication {
    font-size:12px;
    color:#818181;
    margin:0 0 34px;
}

/* Fitxa tècnica */
.obra-meta {
    margin:0;
    border-top:1px solid #343434;
}
.obra-meta>div {
    display:grid;
    grid-template-columns:105px 1fr;
    gap:15px;
    padding:11px 0;
    border-bottom:1px solid #2c2c2c;
}
.obra-meta dt {
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--adt-text-faint);
}
.obra-meta dd {
    margin:0;
    font-size:13px;
    color:#c7c7c7;
}
.obra-meta a {
    border-bottom:1px solid #555;
}
.obra-price dd {
    color:var(--adt-text-bright);
}
.obra-description {
    margin-top:38px;
    font-size:16px;
    line-height:1.75;
    color:#cfcfcf;
}

/* Recomanar obra */
.obra-recommend-action {
    margin:18px 0 0;
}
.recommend-link {
    border:0;
    padding:0;
    background:transparent;
    cursor:pointer;
}
.obra-recommend-action .recommend-link {
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:12px;
    color:var(--adt-text-muted);
}
.obra-recommend-action .recommend-heart {
    color:var(--adt-accent);
    font-size:15px;
    line-height:1;
}
.obra-recommend-action + .obra-notice {
    margin:5px 0 0;
    padding:0;
    border:0;
    background:none;
    color:var(--adt-text-subdued);
    font-size:12px;
    line-height:1.3;
}

/* Transició discreta entre obres */
@keyframes obra-enter{
    from{opacity:.35}
    to{opacity:1}
}
.obra-main{
    animation:obra-enter .22s ease-out both;
    transition:opacity .14s ease;
}
.obra-main.obra-changing{
    opacity:.35;
}
@media (prefers-reduced-motion:reduce){
    .obra-main{
        animation:none;
        transition:none;
    }
}

/* Navegació anterior / següent */
.obra-pager {
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding-top:16px;
    font-size:40px;
    color:#8f8f8f;
}
.obra-pager a:hover {
    color:#d8d8d8;
}

/* Comentaris i recomanacions */
.obra-social {
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
    gap:58px;
    padding-block:66px;
    border-bottom:1px solid var(--line);
}
.section-heading {
    margin-bottom:26px;
}
.section-heading h3 {
    font-size:28px;
    font-weight:300;
    color:#e5e5e5;
    margin:0;
}
.comment-form {
    border-top:1px solid #343434;
    border-bottom:1px solid #343434;
    margin-bottom:28px;
}
.comment-form summary {
    cursor:pointer;
    color:var(--adt-accent);
    padding:16px 0;
    font-size:17px;
    font-weight:500;
}
.comment-form textarea {
    width:100%;
    box-sizing:border-box;
    background:#202020;
    border:1px solid #3a3a3a;
    color:var(--adt-text-light);
    padding:13px;
    resize:vertical;
}
.comment-form__actions {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    padding:12px 0 16px;
    font-size:12px;
    color:var(--adt-text-dim);
}
.action-accent {
    appearance:none;
    border:1px solid var(--adt-accent);
    background:transparent;
    color:var(--adt-accent);
    padding:10px 14px;
    cursor:pointer;
}
.action-accent:hover {
    background:var(--adt-accent);
    color:var(--adt-background-deep);
}

/* Comentaris */
.comment-card {
    padding:22px 0;
    border-top:1px solid var(--adt-background-primary);
}
.comment-card header {
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
}
.comment-card header img,
.reco-person img {
    width:42px;
    height:42px;
    border-radius:50%;
    object-fit:cover;
    background:var(--adt-background-secondary);
}
.comment-card header strong {
    font-size:13px;
    color:var(--adt-text-light);
}
.comment-card time,
.critique-label {
    display:inline-block;
    margin-left:10px;
    font-size:10px;
    color:var(--adt-text-faint);
}
.critique-label {
    color:#b99b63;
    text-transform:uppercase;
    letter-spacing:.08em;
}
.comment-text {
    font-size:14px;
    line-height:1.65;
    color:var(--adt-text-form);
}
.comment-card form {
    margin-top:8px;
}
.comment-card .action-accent {
    padding:0;
    border:0;
    background:transparent;
    color:var(--adt-accent);
    font-size:9px;
    font-weight:400;
    cursor:pointer;
}
.quiet-button,
.show-more {
    border:0;
    background:none;
    color:var(--adt-text-subdued);
    padding:10px 0;
    cursor:pointer;
    font-size:12px;
}
.show-more {
    color:var(--adt-text-mid);
    border-bottom:1px solid #555;
}

/* Recomanadors */
.reco-list {
    border-top:1px solid var(--adt-background-primary);
}
.reco-person {
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 0;
    border-bottom:1px solid var(--adt-background-primary);
}
.reco-person span {
    display:flex;
    flex-direction:column;
    gap:3px;
}
.reco-person strong {
    font-size:13px;
    font-weight:500;
}
.reco-person small {
    font-size:11px;
    color:var(--adt-text-faint);
}
.muted {
    color:var(--adt-text-faint);
    font-size:13px;
}


/* Peu */
.obra-footer {
    padding-block:35px 60px;
    color:#666;
    font-size:11px;
    line-height:1.5;
}
.obra-footer p {
    margin:3px 0;
}

/* Responsive */
@media(max-width:900px) {
    .obra-main,
    .obra-social {
        grid-template-columns:1fr;
        gap:38px;
    }
    .obra-main__info {
        padding-top:0;
    }
}

@media(max-width:700px) {
    .obra-main {
        padding-block:38px 50px;
    }
    .obra-main__info h2 {
        font-size:36px;
    }
    .obra-social,
    .more-works {
        padding-block:48px;
    }
    .comment-form__actions {
        align-items:flex-start;
        flex-direction:column;
    }
}
/* Editor contextual de l'obra */
.obra-edit-trigger{float:right;margin:0 0 18px 20px;padding:0;border:0;border-bottom:1px solid #a86632;background:transparent;color:#c98349;font:inherit;font-size:12px;cursor:pointer}
.obra-edit-trigger:hover{color:#e09a60;border-color:#e09a60}
.obra-edit-form[hidden],.obra-info-view[hidden]{display:none!important}
.obra-edit-head{margin:0 0 24px}.obra-edit-head h3{margin:3px 0 0;color:#e3e3e3;font-size:24px;font-weight:300}
.obra-edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.obra-dimensions{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.obra-field{display:block;margin:0 0 14px}.obra-field>span{display:block;margin:0 0 6px;color:var(--adt-text-subdued);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.obra-field input,.obra-field select,.obra-field textarea{width:100%;box-sizing:border-box;border:1px solid #3a3a3a;background:#202020;color:var(--adt-text-light);padding:10px 11px;font:inherit;font-size:13px;border-radius:0}
.obra-field textarea{resize:vertical;line-height:1.55}.obra-field input:focus,.obra-field select:focus,.obra-field textarea:focus{outline:none;border-color:#a86632}
.obra-edit-actions{display:flex;align-items:center;gap:18px;margin-top:20px;padding-top:18px;border-top:1px solid #343434}
.obra-save,.obra-cancel{font:inherit;font-size:13px;cursor:pointer}.obra-save{border:1px solid #b86f37;background:#b86f37;color:var(--adt-background-deep);padding:9px 18px}.obra-cancel{border:0;background:transparent;color:var(--adt-text-dim);padding:9px 0}
.obra-edit-saved{margin:12px 0;color:#a9b99b;font-size:12px}.obra-edit-error{margin:12px 0;color:#d08b74;font-size:12px}
@media(max-width:650px){.obra-edit-grid,.obra-dimensions{grid-template-columns:1fr}}



/* Recupera comportament acordat del bloc superior */
.obra-main{display:grid!important;grid-template-columns:max-content minmax(280px,1fr)!important;align-items:start!important}
.obra-main__left{width:max-content;max-width:100%}
.obra-main__image{width:auto!important;max-width:100%;overflow:visible!important}
.obra-main__image img{display:block;width:auto!important;height:auto!important;max-width:min(100%,70vw)!important;object-fit:contain!important;cursor:zoom-in}
.obra-lightbox[hidden]{display:none!important}
.obra-lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:32px;background:rgba(0,0,0,.94)}
.obra-lightbox img{display:block;max-width:calc(100vw - 64px);max-height:calc(100vh - 64px);width:auto;height:auto;object-fit:contain}
.obra-lightbox__close{position:fixed;top:18px;right:24px;z-index:10000;border:0;background:transparent;color:var(--adt-text-light);font-size:34px;line-height:1;cursor:pointer}
body.obra-lightbox-open{overflow:hidden}
@media(max-width:800px){.obra-main{grid-template-columns:1fr!important}.obra-main__left{width:100%}.obra-main__image img{max-width:100%!important}}

/* Mida visual definitiva de l'obra */
.obra-main__image img{
    width:auto!important;
    max-width:min(590px,100%)!important;
    height:auto!important;
}

/* Navegació geomètrica de les obres */
.obra-pager a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#d9d9d9;
    text-decoration:none;
}
.obra-pager a svg {
    width:48px;
    height:32px;
    fill:none;
    stroke:currentColor;
    stroke-width:4;
    stroke-linecap:square;
    stroke-linejoin:miter;
}
.obra-pager a:hover {
    color:#fff;
}

/* Visibilitat de les fletxes SVG */
.obra-pager a svg {
    display:block !important;
    width:48px !important;
    height:32px !important;
    fill:none !important;
    stroke:#d9d9d9 !important;
    stroke-width:4 !important;
    opacity:1 !important;
}
.obra-pager a:hover svg {
    stroke:#ffffff !important;
}

/* Ajust final de les fletxes */
.obra-pager a svg {
    width:42px !important;
    height:28px !important;
    transform:translateY(-7px);
}

/* Nom de l'autor a la pàgina d'obra */
.obra-main__artist {
    font-size:1.12rem;
    font-weight:500;
    color:#e5e5e5;
}


/* Alinear la informació de l'obra a baix, en escriptori */
@media (min-width:901px) {
    .obra-main__info {
        align-self:end;
    }
}

/* Títol SEO accessible, ocult visualment */
.adt-seo-obra-title {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* ADT — més obres: 6 escriptori, 4 mitjà, 3 mòbil */
.obra-page .more-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
}
.obra-page .more-card {
    min-width: 0;
}
.obra-page .more-card img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}
@media (max-width: 1100px) {
    .obra-page .more-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (max-width: 700px) {
    .obra-page .more-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }
}
